ux-user-selector2

*若显示混乱，请访问readme.md，然后在markdown阅读器中查看 *

Usage no npm install needed!

<script type="module">
  import uxUserSelector2 from 'https://cdn.skypack.dev/ux-user-selector2';
</script>

README

*若显示混乱，请访问readme.md，然后在markdown阅读器中查看 *

主要特性

  • 支持普通模式与高级模式；
  • 搜索高亮匹配
  • 可以选择组及单个人员
  • 删除及清空已选人员
  • 多语言支持

设计稿链接

API说明

属性 说明 类型 必须配置
fetchDepartmentData 获取部门组织结构数据 ():promise->arrayy yes
fetchCommonContact 获取常用联系人数据 (): promise->array yes
fetchSubordinate 获取下级人员数据 (treeNodeObj: object) :Promise-->array yes
onNodeClick 当树形node被点击后的回调-用户获取department雇员信息 (treeNodeObj: object) :Promise-->array yes
allowSearchNull 是否显示“空（未填写）”选项 bool no
onSearch 当搜索发起后的回掉 （val: string）: Array yes
onSure 点击确定按钮后的回调 （val: array）: void yes

接口请求函数返回值

所有涉及到接口请求的函数，期待的返回值都是promise, promise resolve的结果必须是数组

数据格式

部门数据fetchDepartmentData resolve的值 必须有字段Id，PId, DepartmentName , TotalUserCount

[
{
"Id":254482,
"PId":0,
"DepartmentName":"0405技术部",
"FullDepartmentName":"",
"TotalUserCount":69,
"DepartmentLeaderName":null
}
]

常用联系人 fetchCommonContact resolve的值, 必须字段id、name、email、UserAvatar，Color

[ {"Id":112560539, "Name":"shentao", "Email":"shentao2@beisen.com", "UserAvatar":{"Original":"//cache.tita.gift/Image/100013/94c01ab7e05243cf8373d8dcf242f013_o.jpg", "Small":"//cache.tita.gift/Image/100013/94c01ab7e05243cf8373d8dcf242f013_s.jpg", "Medium":"//cache.tita.gift/Image/100013/94c01ab7e05243cf8373d8dcf242f013_m.jpg", "Big":"//cache.tita.gift/Image/100013/94c01ab7e05243cf8373d8dcf242f013_b.jpg", "HasAvatar":true, "Color":null}} ]


我的下属 fetchSubordinate resolve的值
必须字段id,email,name, DepartmentId, UserAvatar

Avatar: "//cache.tita.gift/Image/100013/94c01ab7e05243cf8373d8dcf242f013_s.jpg", Department: null, DepartmentId: 0, Email: "shentao2@beisen.com", HasSub: false, Id: 112560539, IsAssessManager: false, IsBoss: false, IsLeader: false, IsRoot: false, IsShowChangePwd: false, IsShowOrganization: false, IsShowPopularLinks: false, IsSignInManager: false, IsSummaryManager: false, IsTitaFeedSystemManager: false, IsUpaasManager: false, IsUseEmailAccount: true, IsUserManager: false, IsWorkManager: false, JobState: 0, ManagerId: 0, MidAvatar: "//cache.tita.gift/Image/100013/94c01ab7e05243cf8373d8dcf242f013_m.jpg", Name: "shentao", OnlineType: 0, Position: null, Role: 0, Type: 0, Big: "//cache.tita.gift/Image/100013/94c01ab7e05243cf8373d8dcf242f013_b.jpg", Color: null, HasAvatar: true, UserAvatar:{ Large: "//cache.tita.gift/Image/100013/94c01ab7e05243cf8373d8dcf242f013_l.jpg" Medium: "//cache.tita.gift/Image/100013/94c01ab7e05243cf8373d8dcf242f013_m.jpg" Normal: "//cache.tita.gift/Image/100013/94c01ab7e05243cf8373d8dcf242f013_n.jpg" Original: "//cache.tita.gift/Image/100013/94c01ab7e05243cf8373d8dcf242f013_o.jpg" Small: "//cache.tita.gift/Image/100013/94c01ab7e05243cf8373d8dcf242f013_s.jpg" } UserType: 0


> 
部门节点 相关数据onNodeClick resolve的值
必须字段id,email,name, DepartmentId, UserAvatar, 数据格式参考上面例子

搜索接口 onSearch resolve的值
必须字段id,email,name, DepartmentId, UserAvatar, 数据格式参考上面例子

{ "Id":112560695, "Name":"胡勇光", "Email":"kf_huyongguang@beisen.com", "DepartmentId":0, "Department":null, "UserAvatar":{"Original":null,"Small":null,"Medium":null,"Normal":null,"Big":null,"Large":null, "HasAvatar":false, "Color":"#b9cc4f"}}



onSure 提交的值

[{type: 'staff', value : { name: '', email: '', DepartmentId: '', Avatar: '', AvatarColor: '', DepartmentId: ' }}, { type: 'department', value: { DepartmentLeaderName: null DepartmentName: "BeisenTestAR222" FullDepartmentName: "BeisenTestAR222" Id: 0 PId: -1 TotalUserCount: 7949 children : [.......] } }]