Worktile组织架构

1. 本课程是Worktile的一部分。

2. 演示

预设成员

为了演示公司的组织架构，虚拟了以下人员：

1. CEO：戴国强 13845678901 管理员

2. 总经办经理：赵敏 13845678911 管理员

3. 人事总监：陈颖 13845678902 管理员

4. 财务总监：付媛 13845678906 管理员

5. 项目一组组长：曾辉 13845678312

6. 项目一组开发：黄鸿亮 13845678909

7. 项目一组开发：黄姚谦 13845678223

8. 技术总监：谢林华 13845678907

9. 项目组经理：孙荣浩 13845678905

10. 平台组组长：葛传富 13845678910

11. 测试组组长：王伯祥 13845678908

12. 尚未分配部门：黄飞凯 13845678102

账号

本课程应用作为克隆模板，数据不能太乱，所以没有提供演示账号也没开放注册，即使克隆了本应用也不能直接登录。克隆以后到登录页面（/z/login），它使用的是账号登录管理插件，右键插件，在右边面板激活“注册”后保存再刷新页面即可注册了，注册后自己有账号可以登录了但还是没有密码以上面这些人员的账号登录，可以先在”后端安全“中注释掉里$user.setRole的限制，再在”成员管理“中点击某个成员的”设置“，在”修改成员账号“标签页中修改此成员的密码后就有密码以此人身份登录了。

1. 职位列表
   可添加、修改、上移、下移、删除。

2. 用户登录时（$c.exp.onLogin）拉取公司全员工信息和公司组织架构，即$c.exp.部门。

3. 对员工和组织架构整合到全局变量中，方便应用的很多地方使用。
   $V.部门是组织架构的克隆，除了增加了个”未分配部门“
   $V.部门成员是把组织架构拍平后把各部门成员加进去
   $V.部门总成员是在$V.部门成员基础上再把所有子孙部门成员都加进去

4. 成员管理
   基本信息设置，修改成员账号，角色设置

5. 调整部门
   可以选中成员（单选或全选）后可批量调整他们的部门

6. 成员搜索（过滤）

重点、难点：

1. 移动就是交换位置，常用原生函数arr.splice(新下标, 0, arr.splice(旧下标, 1)[0])，先从旧下标删除一个元素，删除得到的是数组，所以后面加个[0]取得元素本身，再把被删除元素插入到新下标中。
   也就容易理解$l.arr.splice($index - 1, 0, $l.arr.splice($index, 1)[0])是上移，$l.arr.splice($index + 1, 0, $l.arr.splice($index, 1)[0])是下移了。
   等学习了后面课程掌握了如何使用Sortable.js，回过头来把这里的上移和下移按钮改成拖动排序将使操作更简单和直观。

2. 在数据库中删除数组的某个元素常用$pull，即从数组中拉走某个元素：
   $xtk.modify("公司", "职位", {$pull: {"x.arr": $x}})

3. 数据结构
   部门是以树形结构存储的，部门有名称、主管，zchildren数组放子部门。
   数据组件的数据源包含zchildren时会递归渲染成树形结构。

4. 子部门缩进
   为了体现部门层次结构在动态样式里根据层次深度（$indexes）计算左缩进（paddingLeft）

5. 部门调整或成员更新后通过$v.F5让挂载组件获取最新数据重新渲染

6. 删除成员的部门用的是$unset。留意“未分配部门”这个特殊部门。

7. 删除子部门用的是$pull，从数组中“拉走”。

1. 同事列表

2. 同事详情

3. 同事任务列表及状态数

4. 发消息

5. 常用联系人
   收藏

6. 按部门查找同事