cnhis-design-vue 2.1.22 → 2.1.23

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (122) hide show
  1. package/CHANGELOG.md +2280 -2270
  2. package/es/affix/index.js +8 -8
  3. package/es/age/index.js +10 -10
  4. package/es/alert/index.js +8 -8
  5. package/es/anchor/index.js +8 -8
  6. package/es/auto-complete/index.js +8 -8
  7. package/es/avatar/index.js +8 -8
  8. package/es/back-top/index.js +8 -8
  9. package/es/badge/index.js +8 -8
  10. package/es/base/index.js +8 -8
  11. package/es/big-table/index.js +164 -164
  12. package/es/breadcrumb/index.js +8 -8
  13. package/es/button/index.js +31 -31
  14. package/es/calendar/index.js +8 -8
  15. package/es/captcha/index.js +3 -3
  16. package/es/card/index.js +8 -8
  17. package/es/carousel/index.js +8 -8
  18. package/es/cascader/index.js +8 -8
  19. package/es/checkbox/index.js +9 -9
  20. package/es/col/index.js +8 -8
  21. package/es/collapse/index.js +8 -8
  22. package/es/color-picker/index.js +1 -1
  23. package/es/comment/index.js +8 -8
  24. package/es/config-provider/index.js +8 -8
  25. package/es/date-picker/index.js +8 -8
  26. package/es/descriptions/index.js +8 -8
  27. package/es/divider/index.js +8 -8
  28. package/es/drag-layout/index.js +3 -3
  29. package/es/drawer/index.js +8 -8
  30. package/es/dropdown/index.js +8 -8
  31. package/es/editor/index.js +1 -1
  32. package/es/empty/index.js +8 -8
  33. package/es/fabric-chart/index.js +39 -39
  34. package/es/form/index.js +8 -8
  35. package/es/form-model/index.js +8 -8
  36. package/es/form-table/index.js +62 -62
  37. package/es/index/index.js +708 -685
  38. package/es/index/style.css +1 -1
  39. package/es/input/index.js +9 -9
  40. package/es/input-number/index.js +8 -8
  41. package/es/layout/index.js +8 -8
  42. package/es/list/index.js +8 -8
  43. package/es/locale-provider/index.js +8 -8
  44. package/es/map/index.js +9 -9
  45. package/es/mentions/index.js +8 -8
  46. package/es/menu/index.js +8 -8
  47. package/es/message/index.js +8 -8
  48. package/es/multi-chat/index.js +92 -92
  49. package/es/multi-chat-client/index.js +86 -86
  50. package/es/multi-chat-history/index.js +4 -4
  51. package/es/multi-chat-record/index.js +14 -14
  52. package/es/multi-chat-setting/index.js +27 -27
  53. package/es/multi-chat-sip/index.js +1 -1
  54. package/es/notification/index.js +8 -8
  55. package/es/page-header/index.js +8 -8
  56. package/es/pagination/index.js +8 -8
  57. package/es/popconfirm/index.js +8 -8
  58. package/es/popover/index.js +8 -8
  59. package/es/progress/index.js +8 -8
  60. package/es/radio/index.js +9 -9
  61. package/es/rate/index.js +8 -8
  62. package/es/result/index.js +8 -8
  63. package/es/row/index.js +8 -8
  64. package/es/scale-view/index.js +33 -33
  65. package/es/select/index.js +11 -11
  66. package/es/select-label/index.js +11 -11
  67. package/es/select-person/index.js +81 -58
  68. package/es/select-person/style.css +1 -1
  69. package/es/skeleton/index.js +8 -8
  70. package/es/slider/index.js +8 -8
  71. package/es/space/index.js +8 -8
  72. package/es/spin/index.js +8 -8
  73. package/es/statistic/index.js +8 -8
  74. package/es/steps/index.js +8 -8
  75. package/es/switch/index.js +8 -8
  76. package/es/table-filter/index.js +142 -142
  77. package/es/tabs/index.js +8 -8
  78. package/es/tag/index.js +9 -9
  79. package/es/time-picker/index.js +8 -8
  80. package/es/timeline/index.js +8 -8
  81. package/es/tooltip/index.js +8 -8
  82. package/es/transfer/index.js +8 -8
  83. package/es/tree/index.js +8 -8
  84. package/es/tree-select/index.js +8 -8
  85. package/es/upload/index.js +8 -8
  86. package/es/verification-code/index.js +2 -2
  87. package/lib/cui.common.js +659 -636
  88. package/lib/cui.umd.js +659 -636
  89. package/lib/cui.umd.min.js +13 -13
  90. package/package.json +107 -107
  91. package/packages/big-table/src/BigTable.vue +3044 -3044
  92. package/packages/big-table/src/assets/style/table-base.less +370 -370
  93. package/packages/big-table/src/components/AutoLayoutButton.vue +270 -270
  94. package/packages/big-table/src/utils/batchEditing.js +610 -610
  95. package/packages/big-table/src/utils/bigTableProps.js +95 -95
  96. package/packages/button/src/ButtonPrint/components/IdentityVerification.vue +181 -181
  97. package/packages/button/src/ButtonPrint/index.vue +728 -728
  98. package/packages/fabric-chart/src/components/TimeScaleValue.vue +113 -113
  99. package/packages/fabric-chart/src/const/defaultVaule.js +59 -59
  100. package/packages/fabric-chart/src/fabric-chart/FabricPolylines.vue +1066 -1066
  101. package/packages/fabric-chart/src/fabric-chart/FabricScaleValue.vue +135 -135
  102. package/packages/fabric-chart/src/fabric-chart/FabricTextGroup.vue +558 -558
  103. package/packages/fabric-chart/src/fabric-chart2/FabricTop.vue +172 -172
  104. package/packages/multi-chat/chat/chatFooter.vue +1594 -1594
  105. package/packages/multi-chat/chat/chatMain.vue +1466 -1466
  106. package/packages/multi-chat/chat/quickReply.vue +439 -439
  107. package/packages/multi-chat/chat/scrollList.vue +1232 -1232
  108. package/packages/multi-chat/setting/baseInfo/index.vue +1316 -1316
  109. package/packages/multi-chat/store/actions.js +448 -448
  110. package/packages/multi-chat/store/state.js +112 -112
  111. package/packages/scale-view/formitem/r-choice.vue +714 -714
  112. package/packages/scale-view/scaleView.vue +2010 -2010
  113. package/packages/select-person/select-person.vue +1680 -1658
  114. package/packages/table-filter/src/base-search-com/BaseSearch.vue +2462 -2462
  115. package/packages/table-filter/src/components/c-tree-select/tree-select.vue +336 -336
  116. package/packages/table-filter/src/components/multi-select/multi-select.vue +219 -219
  117. package/packages/table-filter/src/components/out-quick-search/out-quick-search.vue +340 -340
  118. package/packages/table-filter/src/components/search-condition/SearchCondition.vue +1825 -1825
  119. package/packages/table-filter/src/const/dataOptions.js +43 -43
  120. package/packages/table-filter/src/mixins/mixins.js +695 -695
  121. package/packages/table-filter/src/quick-search/QuickSearch.vue +2109 -2109
  122. package/src/directive/preventReClick.js +12 -12
@@ -1,1658 +1,1680 @@
1
- <template>
2
- <div class="personnel">
3
- <a-spin :spinning="spinning">
4
- <div class="people-tree">
5
- <!-- 树主体与检索 -->
6
- <div class="people-tree-item people-tree-left">
7
- <!-- $t('1.1.1.5.1') -->
8
- <a-input-search style="margin-bottom: 12px" :placeholder="searchPlaceholder" :enter-button="searchButtonText" :allowClear="true" @search="searchClick" v-model="title" class="person-search">
9
- <!-- <a-icon slot="prefix" type="search" class="search-input-icon" /> -->
10
- <!-- <svg-icon
11
- slot="prefix"
12
- class="search-input-icon"
13
- iconClass="xitongtubiaosousuo"
14
- ></svg-icon> -->
15
- </a-input-search>
16
- <div class="type-wrap" v-if="selectType === 'multiple'">
17
- <div class="type-btn" :class="{ 'type-active': typeActiveIndex === 0 }" @click="onTypeClick(0)">选人员</div>
18
- <div class="type-btn" :class="{ 'type-active': typeActiveIndex === 1 }" @click="onTypeClick(1)">选科室</div>
19
- <div class="type-btn" :class="{ 'type-active': typeActiveIndex === 2 }" @click="onTypeClick(2)">选角色</div>
20
- </div>
21
- <template v-if="!isSingleCheck">
22
- <a-checkbox v-if="searchTreeVisable" v-model="searchChecked" :indeterminate="searchIndeterminate" @change="radioChange">
23
- <!-- {{ $t("1.10.139") }} -->
24
- 全选
25
- </a-checkbox>
26
-
27
- <a-checkbox v-else v-model="singleChecked" :indeterminate="indeterminate" @change="radioChange">
28
- <!-- {{ $t("1.10.139") }} -->
29
- 全选
30
- </a-checkbox>
31
- </template>
32
-
33
- <div v-show="search.status == 3 || (search.status == 0 && treeData.temp && treeData.temp.length == 0)" class="no-data-tips">
34
- 查无结果
35
- </div>
36
- <!-- main tree -->
37
- <a-tree
38
- class="main-tree-container"
39
- v-show="search.status == 0"
40
- ref="antTree"
41
- v-model="checkedKeys.temp"
42
- @expand="onExpand"
43
- @check="onTreeCheck"
44
- checkable
45
- :expandedKeys="expandedKeys"
46
- :autoExpandParent="autoExpandParent"
47
- :checkStrictly="false"
48
- :selectable="false"
49
- :treeData="treeData.temp"
50
- :load-data="getLoadChildData"
51
- :disabled="isDetail"
52
- >
53
- <template slot="custom" slot-scope="scope">
54
- <span v-if="scope.isLeaf">
55
- <a-tooltip :title="`${scope.title} ${scope.sub_title}`" :mouseEnterDelay="0.3">
56
- <span class="c-title">{{ scope.title || scope.key }}&thinsp; </span>
57
- <span class="c-sub-title">{{ scope.sub_title }}</span>
58
- </a-tooltip>
59
- </span>
60
- <span v-else class="p-title">
61
- <span v-if="scope.title">{{ scope.title }}</span>
62
- <span v-else>{{ scope.key }}</span>
63
- {{ treeCount(scope.count) }}
64
- </span>
65
- </template>
66
- </a-tree>
67
- <!-- search tree -->
68
- <searchTree
69
- v-on="$listeners"
70
- ref="searchTree"
71
- :visable="searchTreeVisable"
72
- :formatTreeData="treeData.search"
73
- :searchValue="searchValue"
74
- :allCheckedKeys="checkedKeys"
75
- :defaultExpandedKeys="search.defaultExpandedKeys"
76
- :dataListKeys="search.dataListKeys"
77
- :searchNoMore="searchNoMore"
78
- :loadMorenLoadinng="loadMorenLoadinng"
79
- @addCheckedkeysMain="addCheckedkeysMain"
80
- @removeCheckedkeysMain="removeCheckedkeysMain"
81
- @addCheckedkeysOther="addCheckedkeysOther"
82
- @removeCheckedkeysOther="removeCheckedkeysOther"
83
- @searchOnloadMore="searchOnloadMore"
84
- ></searchTree>
85
- </div>
86
- <!-- 树已选的数据 -->
87
- <div class="select-wrap">
88
- <div class="select-header" v-if="(defaultShowList && defaultShowList.length) || checkedTreeItem.length">
89
- <div class="select-count" v-if="showCount">已选择:{{ defaultShowList.length + checkedTreeItem.length }}</div>
90
- <div class="clear-btn" @click="onClearSelect" v-if="showClear">清空</div>
91
- </div>
92
- <div class="select-content">
93
- <slot v-if="defaultShowList && defaultShowList.length">
94
- <div class="tag-item def-item" v-for="(tag, i) in defaultShowList" :key="i">
95
- {{ tag.title || tag[wordbookChild.user_name_obj] }}
96
- <a-icon v-if="!isDetail" class="tag-close" type="close-circle" theme="filled" @click="closeDefaultTag(tag, i)" />
97
- <!-- <svg-icon
98
- v-if="!isDetail"
99
- class="tag-close"
100
- :icon-class="'xitongtubiaodaohangtubiaoguanbishixin'"
101
- @click="closeDefaultTag(tag, i)"
102
- ></svg-icon> -->
103
- </div>
104
- </slot>
105
-
106
- <div class="tag-item" :class="{ isRoot: !tag.isLeaf }" v-for="tag in checkedTreeItem" :key="tag.key">
107
- {{ tag.title || tag.key }} {{ treeCount(tag.count) }}
108
- <!-- <svg-icon
109
- v-if="!isDetail"
110
- class="tag-close"
111
- :icon-class="'xitongtubiaodaohangtubiaoguanbishixin'"
112
- @click="closeTag(tag)"
113
- ></svg-icon> -->
114
- <a-icon v-if="!isDetail" class="tag-close" type="close-circle" theme="filled" @click="closeTag(tag)" />
115
- </div>
116
- </div>
117
- </div>
118
- </div>
119
- </a-spin>
120
- </div>
121
- </template>
122
- <script>
123
- /* eslint-disable no-async-promise-executor */
124
-
125
- import { Icon, Checkbox, Tree, Tooltip, Input, Spin } from 'ant-design-vue';
126
- import searchTree from './search-tree';
127
- import create from '@/core/create';
128
- import vexutils from '@/utils/vexutils';
129
- import { filterTree, deepTraversalFirst, getAllParentId } from '@/utils';
130
-
131
- /**
132
- * 查询没有部门的分类时,parent_id_obj 为 undefined a-tree 展示异常。
133
- * 前端 赋上固定key 标识 该分类 无部门,该key 不能提交接口。
134
- * */
135
-
136
- /**
137
- * key 唯一key
138
- * title 展示标题
139
- * sub_title 副标题
140
- * count 数量
141
- */
142
-
143
- const FIXEDKEY = '8982eeb4-0439-4100-9805-8cdd12b2256c-front-end-fixed-key';
144
- export default create({
145
- name: 'select-person',
146
- components: {
147
- searchTree,
148
- [Icon.name]: Icon,
149
- [Spin.name]: Spin,
150
- [Tree.name]: Tree,
151
- [Input.Search.name]: Input.Search,
152
- [Checkbox.name]: Checkbox,
153
- [Tooltip.name]: Tooltip
154
- },
155
- props: {
156
- isDetail: { type: Boolean, isDetail: false },
157
- defaultList: { type: Array, default: () => [] },
158
- data: { type: Array, default: () => [] },
159
- roleData: { type: Array, default: () => [] },
160
- roleFields: {
161
- type: Object,
162
- default: () => ({ title: 'name', key: 'id', children: 'children' })
163
- },
164
- searchPlaceholder: {
165
- type: String,
166
- default: '输入关键字搜索'
167
- },
168
- searchButtonText: {
169
- type: String,
170
- default: '搜索'
171
- },
172
- // 父级配置
173
- wordbook: {
174
- type: Object,
175
- default: () => ({
176
- // parent_id_obj: "dept_id", // 父级 id
177
- // parent_id_obj_key: "dept_id", // 提交的 id 的映射 key
178
- // parent_name_obj: "dept_name", // 名称
179
- // parent_name_obj_key: "dept_name", // 名称 的映射key
180
- // user_count_obj: "count" // 统计 key
181
- })
182
- },
183
-
184
- // 子集配置
185
- wordbookChild: {
186
- type: Object,
187
- default: () => ({})
188
- },
189
-
190
- // 检索加载更多
191
- SearchLoadMore: {
192
- type: Boolean,
193
- default: false
194
- },
195
-
196
- showClear: {
197
- type: Boolean,
198
- default: true
199
- },
200
- showCount: {
201
- type: Boolean,
202
- default: true
203
- },
204
- selectType: {
205
- type: String,
206
- default: 'person' // person dept role multiple
207
- },
208
- isSingleCheck: {
209
- type: Boolean,
210
- default: false
211
- },
212
- queryMainTreeData: Function, // 主树请求
213
- queryLoadChildData: Function, // 懒加载请求
214
- queryTreeSearch: Function // 检索请求
215
- },
216
- data() {
217
- return {
218
- treeData: {
219
- main: [],
220
- search: [],
221
- dept: [],
222
- role: [],
223
- temp: []
224
- },
225
- // 展开的keys
226
- expandedKeys: [],
227
- // 展开的部门keys
228
- expandedDeptKeys: [],
229
- autoExpandParent: true,
230
- // 扁平化tree的options Object{Array[Object]}
231
- dataList: {
232
- main: [],
233
- other: [],
234
- dept: [],
235
- role: []
236
- },
237
- // 当前tree选中的keys Object{Array[Number]}
238
- checkedKeys: {
239
- main: [],
240
- other: [],
241
- dept: [],
242
- role: [],
243
- temp: []
244
- },
245
- search: {
246
- defaultExpandedKeys: [],
247
- // 0: 未查询,1:查询中,2:有查询结果,3无查询结果
248
- status: 0,
249
- dataListKeys: {
250
- main: [],
251
- other: []
252
- },
253
- records: 0
254
- },
255
- searchValue: '',
256
- searchPage: 1,
257
- searchNoMore: false,
258
- title: '',
259
- // 选中的所有叶节点(Leaf)keys <Array[Number]>,最终提交接口所需格式
260
- checkedLeafKeys: [],
261
- spinning: false,
262
- loadMorenLoadinng: false,
263
-
264
- errorMsg: '',
265
-
266
- defaultShowList: [], // 默认选中项
267
- checkedKeysMain: [],
268
-
269
- cacheParentIdObj: {},
270
- singleChecked: false,
271
- indeterminate: false,
272
-
273
- searchIndeterminate: false,
274
- searchChecked: false,
275
- typeActiveIndex: 0
276
- };
277
- },
278
- computed: {
279
- searchTreeVisable() {
280
- return this.search.status == 2;
281
- },
282
- dataListMainKeys() {
283
- if (!this.dataList.main.length) return [];
284
-
285
- return this.dataList.main.map(i => {
286
- return i.key;
287
- });
288
- },
289
- dataListDeptKeys() {
290
- if (!this.dataList.dept.length) return [];
291
-
292
- return this.dataList.dept.map(i => {
293
- return i.key;
294
- });
295
- },
296
- dataListRoleKeys() {
297
- if (!this.dataList.role.length) return [];
298
-
299
- return this.dataList.role.map(i => {
300
- return i.key;
301
- });
302
- },
303
- dataListOtherKeys() {
304
- if (!this.dataList.other.length) return [];
305
-
306
- return this.dataList.other.map(i => {
307
- return i.key;
308
- });
309
- },
310
- // 右侧展示tabs <Array[Object]>
311
- checkedTreeItem() {
312
- let otherItems = this.dataList.other.filter(item => {
313
- return this.checkedKeys.other.includes(item.key);
314
- });
315
- let mainItems = this.dataList.main.filter(item => {
316
- // let f = this.currentKey === 'main';
317
- // if(!f) return f;
318
- let { isLeaf, key } = item;
319
- let parentId = this.getParentId(item);
320
- let showKeys = [...this.checkedKeys.main, ...otherItems];
321
- let checked = showKeys.includes(key);
322
- // 父级全选,子级不展示
323
- /** String(parentId) 类型不相等 */
324
- // if (isLeaf && parentId && this.checkedKeys.temp.some(v => v == parentId)) {
325
- // checked = false;
326
- // }
327
- item.itemType = 'person';
328
- return checked && item.type == 2;
329
- });
330
- let deptItems = this.dataList.dept.filter(item => {
331
- let { key } = item;
332
- let showKeys = [...this.checkedKeys.dept, ...otherItems];
333
- let checked = showKeys.includes(key);
334
- // 只展示最后一级的科室
335
- item.itemType = 'dept';
336
- return checked && item.type == 1 && (!item.children || (item.children && !item.children.length));
337
- });
338
- let roleItems = this.dataList.role.filter(item => {
339
- let showKeys = [...this.checkedKeys.role, ...otherItems];
340
- let checked = showKeys.includes(item.key);
341
- item.itemType = 'role';
342
- return checked && item.roleId;
343
- });
344
- if (this.selectType === 'multiple') {
345
- deptItems.forEach(item => {
346
- if (item.title) {
347
- item.title = item.title.includes('(科室)') ? item.title : `${item.title}(科室)`;
348
- }
349
- });
350
- roleItems.map(item => {
351
- if (item.title) {
352
- item.title = item.title.includes('(角色)') ? item.title : `${item.title}(角色)`;
353
- }
354
- return item;
355
- });
356
- }
357
-
358
- let list = this.uniqArrObj([...mainItems, ...deptItems, ...roleItems, ...otherItems], 'key');
359
- return list;
360
- },
361
-
362
- wordbookConfig() {
363
- const { parent_id_obj, parent_name_obj } = this.wordbook || {};
364
- const { user_id_obj, user_name_obj } = this.wordbookChild || {};
365
- return {
366
- parent_id_obj,
367
- parent_name_obj,
368
- user_id_obj,
369
- user_name_obj
370
- };
371
- },
372
-
373
- getLoadChildData() {
374
- if (typeof this.queryLoadChildData == 'function') {
375
- return this.onLoadData;
376
- }
377
- return null;
378
- },
379
-
380
- currentKey() {
381
- return { person: 'main', dept: 'dept', role: 'role', multiple: 'main' }[this.selectType];
382
- }
383
- },
384
- watch: {
385
- // defaultList: {
386
- // immediate: true,
387
- // handler(val) {
388
- // if (!val) return;
389
- // this.initDefault();
390
- // }
391
- // },
392
- selectType: {
393
- immediate: true,
394
- handler(val) {
395
- if (val === 'dept' || val === 'role' || val === 'multiple') {
396
- this.typeActiveIndex = { multiple: 0, dept: 1, role: 2 }[val];
397
- }
398
- }
399
- },
400
- data: {
401
- immediate: true,
402
- handler() {
403
- this.staticDataInit();
404
- this.staticDeptAndRoleDataInit();
405
- const key = { person: 'main', dept: 'dept', role: 'role', multiple: 'main' }[this.selectType];
406
- this.treeData.temp = this.treeData[key];
407
- }
408
- },
409
- roleData: {
410
- immediate: true,
411
- handler() {
412
- this.staticDeptAndRoleDataInit();
413
- const key = { person: 'main', dept: 'dept', role: 'role', multiple: 'main' }[this.selectType];
414
- this.treeData.temp = this.treeData[key];
415
- }
416
- }
417
- },
418
- created() {},
419
- mounted() {
420
- this.getUsers();
421
- this.initDefault();
422
- },
423
- methods: {
424
- initDefault() {
425
- if (this.getLoadChildData) {
426
- this.getDefaultList();
427
- } else {
428
- this.$nextTick(() => {
429
- const userIds = this.defaultList.filter(item => item.itemType === 'person').map(item => item.id);
430
- const deptIds = this.defaultList.filter(item => item.itemType === 'dept').map(item => item.id);
431
- const roleIds = this.defaultList.filter(item => item.itemType === 'role').map(item => item.id);
432
- const key = ['main', 'dept', 'role'][this.typeActiveIndex];
433
- this.checkedKeys.main = userIds;
434
- this.checkedKeys.dept = deptIds;
435
- this.checkedKeys.role = roleIds;
436
- this.checkedKeys.temp = this.checkedKeys[key];
437
- });
438
- }
439
- },
440
-
441
- staticDataInit() {
442
- if (!Array.isArray(this.data) || this.data.length == 0) return;
443
- this.treeData.main = this.data;
444
- this.generateDataList(this.treeData.main, this.dataList.main);
445
- },
446
- staticDeptAndRoleDataInit() {
447
- this.treeData.dept = this.getDeptData(this.data);
448
- this.generateDataList(this.treeData.dept, this.dataList.dept);
449
- this.treeData.role = this.handleRoleData(this.roleData);
450
- this.generateDataList(this.treeData.role, this.dataList.role);
451
- },
452
- getDeptData(data) {
453
- // 把data里面的人员过滤掉
454
- const copyData = JSON.parse(JSON.stringify(data));
455
- vexutils.searchTree(copyData, item => {
456
- if (item.type === 1 && item.children && item.children.length) {
457
- item.children = item.children.filter(child => child.type === 1);
458
- }
459
- });
460
- return copyData;
461
- },
462
- handleRoleData(data) {
463
- const copyData = JSON.parse(JSON.stringify(data));
464
- vexutils.searchTree(copyData, item => {
465
- const { title, key, children } = this.roleFields;
466
- item.title = item[title];
467
- item.children = item[children] ? item[children] : [];
468
- item.key = item[key];
469
- });
470
- return copyData;
471
- },
472
- /** --- 默认值 --- */
473
- getDefaultList() {
474
- const { defaultList } = this;
475
- let copy = JSON.parse(JSON.stringify(defaultList));
476
- if (Array.isArray(copy)) {
477
- // this.defaultShowObj = {};
478
-
479
- const { user_id_obj } = this.wordbookChild || {};
480
- copy.forEach(v => {
481
- this.handleDefMapping(v);
482
- let key = this.getuniqKey(v);
483
- let pId = this.getParentId(v);
484
- this.cacheParentIdObj[pId] = pId;
485
- // this.defaultShowObj[key] = v[user_id_obj];
486
- });
487
- this.defaultShowList = copy;
488
- }
489
- },
490
-
491
- getcheckedKeys() {
492
- const { defaultList } = this;
493
- let checkedKeysMain = [],
494
- checkedKeysOther = [];
495
- let copy = JSON.parse(JSON.stringify(defaultList));
496
- if (Array.isArray(copy)) {
497
- copy.forEach(v => {
498
- this.handleDefMapping(v);
499
- let key = this.getuniqKey(v);
500
- checkedKeysMain.push(key);
501
- // 回填到 检索的选择,防止回填马上检索
502
- if (String(key).includes(FIXEDKEY)) {
503
- checkedKeysOther.push(key);
504
- }
505
- });
506
- }
507
- return {
508
- checkedKeysMain,
509
- checkedKeysOther
510
- };
511
- },
512
-
513
- /**
514
- * 根据配置映射默认值
515
- */
516
- handleDefMapping(v) {
517
- const { parent_id_obj, parent_name_obj, user_id_obj, user_name_obj } = this.wordbookConfig || {};
518
- // 自定义 key
519
- const { parent_id_obj_key, parent_name_obj_key } = this.wordbook;
520
- const { user_id_obj_key, user_name_obj_key } = this.wordbookChild;
521
- v[parent_id_obj] = v[parent_id_obj_key] || v.parent_id;
522
- v[parent_name_obj] = v[parent_name_obj_key] || v.parent_name;
523
- v[user_id_obj] = v[user_id_obj_key] || v.user_id;
524
- v[user_name_obj] = v[user_name_obj_key] || v.user_name;
525
- },
526
-
527
- /**
528
- * 初始化 请求已选的数据
529
- */
530
- async loadSelected() {
531
- try {
532
- let list = await Promise.all(
533
- this.treeData.main.map(async v => {
534
- const { parent_id_obj } = this.wordbook || {};
535
- if ([v.key, v[parent_id_obj], String(v[parent_id_obj])].includes(this.cacheParentIdObj[v[parent_id_obj]])) {
536
- await this.onLoadData({ dataRef: v });
537
- return v;
538
- }
539
- })
540
- );
541
- return list;
542
- } catch (error) {
543
- return Promise.resolve();
544
- }
545
- },
546
-
547
- /**
548
- * 过滤默认值的右边展示
549
- */
550
- hanldeFilterDefaultShowList(list) {
551
- this.defaultShowList = this.defaultShowList.filter(d => list.findIndex(l => this.getuniqKey(d) == this.getuniqKey(l)) == -1);
552
- // this.updateDefaultShowObj(this.defaultShowList);
553
- },
554
-
555
- updateDefaultShowObj(list) {
556
- const { user_id_obj } = this.wordbookConfig || {};
557
- this.defaultShowObj = {};
558
- list.forEach(v => {
559
- this.defaultShowObj[this.getuniqKey(v)] = v[user_id_obj];
560
- });
561
- },
562
-
563
- /**
564
- * 拼接key
565
- */
566
- getuniqKey(v) {
567
- const { user_id_obj } = this.wordbookConfig || {};
568
- return `${this.getParentId(v)}_${v[user_id_obj]}`;
569
- // return v.key;
570
- },
571
-
572
- getParentId(v) {
573
- const { parent_id_obj } = this.wordbookConfig || {};
574
- // return `${v[parent_id_obj] || FIXEDKEY}`;
575
- return `${v[parent_id_obj]}`;
576
- },
577
-
578
- // 查询树结构数据(一级父类)
579
- async getUsers() {
580
- try {
581
- if (typeof this.queryMainTreeData !== 'function') {
582
- return;
583
- }
584
- this.spinning = true;
585
- const { parent_id_obj } = this.wordbookConfig || {};
586
- let rows = await this.queryMainTreeData();
587
- let list = this.uniqArrObj(rows, parent_id_obj);
588
- this.treeData.main = list;
589
- this.generateDataList(this.treeData.main, this.dataList.main);
590
- // TODO:这里的回填
591
- await this.loadSelected();
592
- let { checkedKeysMain, checkedKeysOther } = this.getcheckedKeys();
593
- this.checkedKeys.main.push(...checkedKeysMain);
594
- this.checkedKeys.other = [...checkedKeysOther];
595
-
596
- this.treeData.main.forEach(f => {
597
- if (f && f.children && f.children.length) {
598
- let flag = f.children.every(c => checkedKeysMain.includes(c.key));
599
- if (flag && f.key) {
600
- this.checkedKeys.main.push(f.key);
601
- }
602
- }
603
- });
604
- if (this.currentKey === 'main') {
605
- this.checkedKeys.temp = this.checkedKeys.main;
606
- this.treeData.temp = this.treeData.main;
607
- }
608
- this.spinning = false;
609
- } catch (error) {
610
- this.spinning = false;
611
- this.$message.error('查询异常');
612
- console.log(error);
613
- }
614
- },
615
-
616
- // 动态获取子节点
617
- onLoadData(treeNode) {
618
- return new Promise(async resolve => {
619
- if (treeNode.dataRef.children) {
620
- resolve();
621
- return;
622
- }
623
- treeNode.dataRef.children = await this.handleLoadChildData(treeNode.dataRef.key, treeNode.dataRef);
624
-
625
- this.hanldeFilterDefaultShowList(treeNode.dataRef.children);
626
-
627
- this.$nextTick(() => {
628
- this.treeData.main = [...this.treeData.main];
629
- this.treeData.temp = [...this.treeData.main];
630
- });
631
-
632
- this.addCheckedKeysChildrenMain(treeNode.dataRef);
633
-
634
- this.generateDataList(treeNode.dataRef.children, this.dataList.main);
635
- resolve();
636
- });
637
- },
638
-
639
- async handleLoadChildData(key, treeNode) {
640
- let rows = await this.queryLoadChildData(key, treeNode);
641
- let list = rows;
642
- return list;
643
- },
644
-
645
- loadMainChildData(searchResultTreeData) {
646
- return new Promise(async resolve => {
647
- let promises = searchResultTreeData.map(async item => {
648
- if (item.users) {
649
- let mainTreeItem = this.treeData.main.find(mainItem => mainItem.key == item.key);
650
- if (!mainTreeItem || (mainTreeItem && !mainTreeItem.children)) {
651
- if (!mainTreeItem) {
652
- mainTreeItem = { ...item };
653
- }
654
- mainTreeItem.children = await this.handleLoadChildData(item.key, mainTreeItem);
655
- this.generateDataList(mainTreeItem.children, this.dataList.main);
656
- this.addCheckedKeysChildrenMain(mainTreeItem);
657
- }
658
- }
659
- });
660
-
661
- await Promise.all(promises);
662
-
663
- resolve();
664
- });
665
- },
666
-
667
- /**
668
- * 检索
669
- */
670
- async searchFetch(data = {}, config = {}) {
671
- if (typeof this.queryTreeSearch !== 'function') {
672
- this.staticDataSearch();
673
- this.spinning = false;
674
- this.isSearchAllCheck();
675
- return;
676
- }
677
- if (!this.searchValue) {
678
- this.search.status = 0;
679
- this.search.defaultExpandedKeys = [];
680
- this.expandedKeys = [];
681
- this.spinning = false;
682
- this.searchNoMore = false;
683
- return false;
684
- }
685
- if (!config.loadMoren) {
686
- this.search.status = 1;
687
- } else {
688
- this.loadMorenLoadinng = true;
689
- }
690
-
691
- let rows = await this.queryTreeSearch(this.searchValue, data);
692
- let searchResultTreeData = rows;
693
- this.loadMorenLoadinng = false;
694
- if (!searchResultTreeData || !searchResultTreeData.length) {
695
- if (this.searchPage == 1) {
696
- this.search.defaultExpandedKeys = [];
697
- this.search.status = 3;
698
- } else {
699
- this.search.status = 2;
700
- this.searchNoMore = true;
701
- }
702
-
703
- this.spinning = false;
704
- this.isSearchAllCheck();
705
- return false;
706
- }
707
-
708
- const { parent_id_obj, parent_name_obj, user_count_obj } = this.wordbook || {};
709
- const { user_name_obj } = this.wordbookChild || {};
710
- let pObj = {};
711
- searchResultTreeData.forEach(item => {
712
- item[parent_id_obj] &&
713
- (pObj[item[parent_id_obj]] = {
714
- key: item[parent_id_obj],
715
- users: []
716
- });
717
-
718
- if (item.users) {
719
- this.insertSearchTreeData(item);
720
- } else {
721
- this.insertSearchTreeDataOther(item);
722
- }
723
- });
724
- let pList = [];
725
- Object.keys(pObj || {}).forEach(v => {
726
- if (v) {
727
- pList.push({ ...pObj[v] });
728
- }
729
- });
730
- let len = this.treeData.search.length || 0;
731
- // TODO:加载更多
732
- if (this.SearchLoadMore) {
733
- this.searchNoMore = false;
734
- } else {
735
- this.searchNoMore = true;
736
- }
737
- // 防止searchTree选中后切换回mainTree,mainTree checkedKeys状态丢失
738
- await this.loadMainChildData(pList);
739
- this.generateSearchDataListKeys(searchResultTreeData);
740
-
741
- this.hanldeFilterDefaultShowList(searchResultTreeData);
742
- this.refreshSearchTree();
743
- this.search.status = 2;
744
- this.spinning = false;
745
-
746
- this.isSearchAllCheck();
747
- },
748
-
749
- insertSearchTreeData(item) {
750
- const { user_count_obj } = this.wordbook || {};
751
- this.search.defaultExpandedKeys.push(item.key);
752
-
753
- // 默认值处理
754
- this.hanldeFilterDefaultShowList(item.children || []);
755
-
756
- if (item[user_count_obj] == item.children.length) {
757
- item.disableCheckbox = false;
758
- }
759
- this.treeData.search.push(item);
760
- },
761
-
762
- insertSearchTreeDataOther(item) {
763
- let formatItem = Object.assign({}, item, { isLeaf: true });
764
-
765
- this.treeData.search.push(formatItem);
766
-
767
- if (this.dataListOtherKeys.includes(formatItem.key)) return false;
768
- this.generateDataList([formatItem], this.dataList.other);
769
- },
770
-
771
- generateSearchDataListKeys(searchResultTreeData) {
772
- // this.search.dataListKeys = {
773
- // main: [],
774
- // other: []
775
- // };
776
- searchResultTreeData.forEach(item => {
777
- if (!this.dataListMainKeys.includes(item.key)) {
778
- this.search.dataListKeys.other.push(item.key);
779
- item.children &&
780
- item.children.forEach(childItem => {
781
- this.search.dataListKeys.other.push(childItem.key);
782
- });
783
- return;
784
- }
785
-
786
- this.search.dataListKeys.main.push(item.key);
787
- item.children &&
788
- item.children.forEach(childItem => {
789
- this.search.dataListKeys.main.push(childItem.key);
790
- });
791
- });
792
- },
793
-
794
- searchOnloadMore() {
795
- this.searchPage = this.searchPage + 1;
796
- this.searchFetch({ page: this.searchPage }, { loadMoren: true });
797
- },
798
-
799
- addCheckedKeysChildrenMain(item) {
800
- if (!item.key) return;
801
- if (!this.checkedKeys.main.includes(String(item.key))) return false;
802
- // 新查询到插入已选中的main treeData 的child key,需要手动push到checkedKeys中
803
- if (!Array.isArray(item.children)) return false;
804
- item.children.forEach(({ key }) => {
805
- // 防止重复添加(已处理,不会重复添加,保留代码以防逻辑缺漏)
806
- if (this.checkedKeys.main.includes(key) || !key) return false;
807
- this.checkedKeys.main.push(key);
808
- });
809
- },
810
-
811
- // 暂存实际可选节点arr
812
- generateDataList(data, dataList) {
813
- for (let i = 0; i < data.length; i++) {
814
- const node = data[i];
815
- dataList.push({
816
- parentId: this.getParentId(node),
817
- ...node
818
- });
819
- if (node.children) {
820
- this.generateDataList(node.children, dataList);
821
- }
822
- }
823
- },
824
-
825
- // 获取匹配搜索节点arr
826
- getParentKey(key, tree) {
827
- let parentKey;
828
- for (let i = 0; i < tree.length; i++) {
829
- const node = tree[i];
830
- if (node.key == key) {
831
- parentKey = node.key;
832
- return parentKey;
833
- }
834
-
835
- if (node.children) {
836
- if (node.children.some(item => item.key == key)) {
837
- parentKey = node.key;
838
- } else if (this.getParentKey(key, node.children)) {
839
- parentKey = this.getParentKey(key, node.children);
840
- }
841
- }
842
- }
843
- return parentKey;
844
- },
845
- radioChange(e) {
846
- let { checked } = e.target || {};
847
- if (this.searchTreeVisable) {
848
- this.singleChecked = checked;
849
- } else {
850
- this.searchChecked = checked;
851
- }
852
- this.checkAll(checked ? 1 : 2);
853
- this.handleOk();
854
- },
855
- // type 1 全选 2 反选(清空)
856
- checkAll(type) {
857
- if (this.checkAllSearchTree(type)) return false;
858
- const key = ['main', 'dept', 'role'][this.typeActiveIndex];
859
- if (type == 1) {
860
- this.expandedKeys = [];
861
- this.checkedKeys[key] = this[`dataList${key.slice(0, 1).toUpperCase()}${key.slice(1)}Keys`]; // dataListMainKeys dataListDeptKeys dataListRoleKeys;
862
- this.checkedKeys.temp = this.checkedKeys[key];
863
- } else if (type == 2) {
864
- this.checkedKeys[key] = [];
865
- this.checkedKeys.temp = [];
866
- this.autoExpandParent = true;
867
- }
868
- },
869
-
870
- checkAllSearchTree(type) {
871
- if (!this.searchTreeVisable) return false;
872
-
873
- if (type == 1) {
874
- // 全选默认不选中父级
875
- let allSearchkeysMain = this.search.dataListKeys.main.filter(key => {
876
- return !this.search.defaultExpandedKeys.includes(key);
877
- });
878
-
879
- let allSearchkeysOther = this.search.dataListKeys.other;
880
-
881
- this.checkedKeys.main = vexutils.uniq([...this.checkedKeys.main, ...allSearchkeysMain]);
882
- this.checkedKeys.other = vexutils.uniq([...this.checkedKeys.other, ...allSearchkeysOther]);
883
-
884
- // 如果子级全选,父级也需要选中
885
- this.search.dataListKeys.main.forEach(key => {
886
- let getParentKey = this.getParentKey(key, this.treeData.main);
887
- let parent = this.treeData.main.filter(item => {
888
- return item.key == getParentKey;
889
- });
890
-
891
- let allCheck = parent[0].children.every(item => {
892
- return this.checkedKeys.main.includes(item.key);
893
- });
894
- allCheck && this.checkedKeys.main.push(getParentKey);
895
- });
896
- this.refreshSearchTree();
897
- } else if (type == 2) {
898
- this.$refs['searchTree'].emptyCheckedKeys();
899
- this.autoExpandParent = true;
900
- }
901
- this.isSearchAllCheck();
902
- return true;
903
- },
904
-
905
- refreshSearchTree() {
906
- if (!this.searchTreeVisable) return false;
907
- this.$refs['searchTree'].setDefaultCheckedKeys();
908
- this.$nextTick(() => {
909
- this.isSearchAllCheck();
910
- });
911
- },
912
-
913
- // 展开数节点
914
- onExpand(expandedKeys) {
915
- // const latestOpenKey = expandedKeys.find(key => this.expandedKeys.indexOf(key) == -1);
916
- // this.expandedKeys = latestOpenKey ? [latestOpenKey] : [];
917
- // this.autoExpandParent = false;
918
- this.expandedKeys = expandedKeys;
919
- this.autoExpandParent = false;
920
- // this.$emit('expand', expandedKeys, ...arg)
921
- },
922
- onExpandDept(expandedKeys) {
923
- this.expandedDeptKeys = expandedKeys;
924
- },
925
-
926
- searchClick() {
927
- this.searchValue = this.title;
928
-
929
- this.treeData.search = [];
930
- this.search.dataListKeys.other = [];
931
- this.search.dataListKeys.main = [];
932
- this.search.defaultExpandedKeys = [];
933
-
934
- this.spinning = true;
935
- this.searchPage = 1;
936
- this.searchFetch();
937
- },
938
-
939
- isAllCheck(checkedKeys = []) {
940
- const key = ['main', 'dept', 'role'][this.typeActiveIndex];
941
- if (!checkedKeys || checkedKeys.length == 0) {
942
- this.indeterminate = false;
943
- this.singleChecked = false;
944
- } else {
945
- let keyArr = this.treeData[key].map(item => item.key);
946
- let keyArrTemp = keyArr.filter(item => checkedKeys.indexOf(item) !== -1);
947
- this.indeterminate = !(keyArr.length == keyArrTemp.length);
948
- this.singleChecked = keyArr.length == keyArrTemp.length;
949
- }
950
- },
951
-
952
- isSearchAllCheck() {
953
- this.$nextTick(() => {
954
- let skeyArr = this.treeData.search.map(item => item.key);
955
- let serchCheckedKeys = this.$refs['searchTree'].checkedKeys;
956
- this.searchIndeterminate = !!serchCheckedKeys.length && serchCheckedKeys.length < skeyArr.length;
957
- this.searchChecked = serchCheckedKeys.length === skeyArr.length;
958
- });
959
- },
960
-
961
- /* 子组件emit方法 */
962
- addCheckedkeysMain(keys) {
963
- let checkedKeys = this.checkedKeys.main;
964
- let filterKey = (keys || {}).filter(Boolean);
965
- filterKey.forEach(key => {
966
- //
967
- checkedKeys.push(key);
968
- // 如果子级全选,父级也需要选中
969
- let getParentKey = this.getParentKey(key, this.treeData.main);
970
- if (!getParentKey) return;
971
- let parent = this.treeData.main.filter(item => {
972
- return item.key == getParentKey;
973
- });
974
- let allCheck = (parent[0]?.children || []).every(item => {
975
- return checkedKeys.includes(item.key);
976
- });
977
- allCheck && checkedKeys.push(getParentKey);
978
- });
979
- },
980
-
981
- removeCheckedkeysMain(keys) {
982
- let checkedKeysMain = vexutils.clone(this.checkedKeys.main, true);
983
- keys.forEach(key => {
984
- //
985
- let index = checkedKeysMain.findIndex(mainKey => mainKey == key);
986
- if (index !== -1) {
987
- checkedKeysMain.splice(index, 1);
988
- this.checkedKeys.main = [...checkedKeysMain];
989
- }
990
- // 删除父级选中
991
- let getParentKey = this.getParentKey(key, this.treeData.main);
992
- let parentIndex = checkedKeysMain.findIndex(mainKey => mainKey == getParentKey);
993
- if (parentIndex !== -1) {
994
- checkedKeysMain.splice(parentIndex, 1);
995
- }
996
- });
997
-
998
- this.checkedKeys.main = [...checkedKeysMain];
999
- },
1000
-
1001
- addCheckedkeysOther(keys) {
1002
- this.checkedKeys.other.push(...keys);
1003
- // this.checkedKeys.main.push(...keys);
1004
- },
1005
-
1006
- removeCheckedkeysOther(keys) {
1007
- let checkedKeys = this.checkedKeys.other;
1008
- // let mainCheckedKeys = this.checkedKeys.main;
1009
- keys.forEach(key => {
1010
- let index = checkedKeys.findIndex(otherKey => otherKey == key);
1011
- checkedKeys.splice(index, 1);
1012
- this.handleDeldefaultShowList(key);
1013
-
1014
- // let mindex = mainCheckedKeys.findIndex(otherKey => otherKey == key);
1015
- // mainCheckedKeys.splice(mindex, 1);
1016
- });
1017
- this.removeCheckedkeysMain(keys);
1018
- },
1019
-
1020
- handleDeldefaultShowList(key) {
1021
- let len = this?.defaultShowList?.length || 0;
1022
- if (len > 0) {
1023
- for (let i = len - 1; i >= 0; i--) {
1024
- let d = this.defaultShowList[i];
1025
- if (`${d.parent_id}_${d.user_id}` == key) {
1026
- this.closeDefaultTag(d, i);
1027
- }
1028
- }
1029
- }
1030
- },
1031
-
1032
- closeDefaultTag(tag, i) {
1033
- this.defaultShowList.splice(i, 1);
1034
- this.closeTag({ parentId: this.getParentId(tag), ...tag });
1035
- },
1036
-
1037
- /* 右侧点击item[x]按钮 相关 */
1038
- closeTag(removedTag) {
1039
- // let { parentId } = removedTag;
1040
-
1041
- this.removedCheckedkeysMain(removedTag);
1042
- this.removedCheckedkeysDept(removedTag);
1043
- this.removedCheckedkeysRole(removedTag);
1044
- this.removedCheckedkeysOther(removedTag);
1045
- const propStr = ['person', 'dept', 'role'][this.typeActiveIndex];
1046
- const checkedKeys = this.checkedTreeItem.filter(item => item.itemType === propStr).map(item => item.key);
1047
- this.checkedKeys.temp = checkedKeys;
1048
- this.handleEmitValue();
1049
- this.refreshSearchTree();
1050
- this.isAllCheck(checkedKeys);
1051
- },
1052
-
1053
- removeCheckedkeysIncludeChildren(parentKey) {
1054
- let needRemoveChildKeys = this.dataList.main
1055
- .filter(i => {
1056
- let parentId = this.getParentId(i);
1057
- return parentId == parentKey || i.key == parentKey;
1058
- })
1059
- .map(i => {
1060
- return i.key;
1061
- });
1062
- const checkedKeys = this.checkedKeys.main.filter(i => {
1063
- return !needRemoveChildKeys.includes(i);
1064
- });
1065
- this.checkedKeys.main = checkedKeys;
1066
- },
1067
-
1068
- removedCheckedkeysMain(tag) {
1069
- let checkedKeys = this.checkedKeys.main;
1070
- let parentId = this.getParentId(tag);
1071
- for (let i = 0; i < checkedKeys.length; i++) {
1072
- if (tag.key == checkedKeys[i] && tag.key == parentId) {
1073
- this.removeCheckedkeysIncludeChildren(tag.key);
1074
- return false;
1075
- } else if (tag.key == checkedKeys[i]) {
1076
- checkedKeys.splice(i, 1);
1077
- return false;
1078
- }
1079
- }
1080
- },
1081
- removeCheckedkeysIncludeChildrenDept(parentKey) {
1082
- let needRemoveChildKeys = this.dataList.dept
1083
- .filter(i => {
1084
- let parentId = this.getParentId(i);
1085
- return parentId == parentKey || i.key == parentKey;
1086
- })
1087
- .map(i => {
1088
- return i.key;
1089
- });
1090
- const checkedKeys = this.checkedKeys.dept.filter(i => {
1091
- return !needRemoveChildKeys.includes(i);
1092
- });
1093
- this.checkedKeys.dept = checkedKeys;
1094
- },
1095
- removedCheckedkeysDept(tag) {
1096
- let checkedKeys = this.checkedKeys.dept;
1097
- let parentId = this.getParentId(tag);
1098
- for (let i = 0; i < checkedKeys.length; i++) {
1099
- if (tag.key == checkedKeys[i] && tag.key == parentId) {
1100
- this.removeCheckedkeysIncludeChildrenDept(tag.key);
1101
- return false;
1102
- } else if (tag.key == checkedKeys[i]) {
1103
- checkedKeys.splice(i, 1);
1104
- return false;
1105
- }
1106
- }
1107
- },
1108
- removedCheckedkeysRole(tag) {
1109
- let checkedKeys = this.checkedKeys.role;
1110
- let parentId = '';
1111
- for (let i = 0; i < checkedKeys.length; i++) {
1112
- if (tag.key == checkedKeys[i] && tag.key == parentId) {
1113
- // this.removeCheckedkeysIncludeChildren(tag.key);
1114
- return false;
1115
- } else if (tag.key == checkedKeys[i]) {
1116
- checkedKeys.splice(i, 1);
1117
- return false;
1118
- }
1119
- }
1120
- },
1121
-
1122
- removedCheckedkeysOther(tag) {
1123
- let checkedKeys = this.checkedKeys.other;
1124
- if (checkedKeys.includes(tag.key)) {
1125
- for (let i = 0; i < checkedKeys.length; i++) {
1126
- if (tag.key == checkedKeys[i]) {
1127
- checkedKeys.splice(i, 1);
1128
- return false;
1129
- }
1130
- }
1131
- } else {
1132
- // 删除科室,删除
1133
- this.OtherRemoveCheckedkeysIncludeChildren(tag.key);
1134
- }
1135
- },
1136
-
1137
- OtherRemoveCheckedkeysIncludeChildren(parentKey) {
1138
- let needRemoveChildKeys = this.dataList.main
1139
- .filter(i => {
1140
- let parentId = this.getParentId(i);
1141
- return parentId == parentKey || i.key == parentKey;
1142
- })
1143
- .map(i => {
1144
- return i.key;
1145
- });
1146
-
1147
- this.checkedKeys.other = this.checkedKeys.other.filter(i => {
1148
- return !needRemoveChildKeys.includes(i);
1149
- });
1150
- },
1151
-
1152
- /* submit 相关 */
1153
- getCheckedMainChildKeys() {
1154
- return new Promise(async resolve => {
1155
- let promises = this.treeData.main.map(async item => {
1156
- // 获取勾选了父类tree, 但未获取children
1157
- // 接口传参,需要的是叶节点的keys
1158
- if (this.checkedKeys.main.includes(item.key) && !item.children) {
1159
- item.children = await this.handleLoadChildData(item.key, item);
1160
- this.addCheckedKeysChildrenMain(item);
1161
-
1162
- this.generateDataList(item.children, this.dataList.main);
1163
- }
1164
- });
1165
-
1166
- await Promise.all(promises);
1167
-
1168
- resolve();
1169
- });
1170
- },
1171
-
1172
- getCheckedLeafKeys() {
1173
- let mainLeafKeys = [];
1174
- let mainLeafDataListKeys = this.dataList.main.filter(item => item.isLeaf).map(item => item.key);
1175
-
1176
- this.checkedKeys.main.forEach(key => {
1177
- if (mainLeafDataListKeys.includes(key)) {
1178
- mainLeafKeys.push(key);
1179
- }
1180
- });
1181
-
1182
- let keyList = [...mainLeafKeys, ...this.checkedKeys.other];
1183
- let res = [...new Set(keyList)];
1184
- return [...res];
1185
- },
1186
-
1187
- async handleOk(isShowLoading = false) {
1188
- isShowLoading && (this.spinning = true);
1189
- this.queryLoadChildData && (await this.getCheckedMainChildKeys());
1190
-
1191
- this.checkedLeafKeys = this.getCheckedLeafKeys();
1192
-
1193
- const submitData = this.handleGetSumitData(this.checkedLeafKeys);
1194
-
1195
- // let subList = [...submitData, ...this.defaultShowList];
1196
-
1197
- this.$emit('pubCheckedTreeItem', [...this.checkedTreeItem, ...this.defaultShowList]);
1198
- this.$emit('check', [...this.checkedTreeItem, ...this.defaultShowList]);
1199
- this.$emit('handleOk', this.checkedLeafKeys);
1200
- this.$emit('change', this.checkedLeafKeys, [...submitData, ...this.defaultShowList]);
1201
- this.$emit('submitData', [...submitData, ...this.defaultShowList]);
1202
-
1203
- isShowLoading && (this.spinning = false);
1204
- },
1205
-
1206
- handleEmitValue() {
1207
- clearTimeout(this.emitTimeout);
1208
- this.emitTimeout = setTimeout(() => {
1209
- this.handleOk();
1210
- }, 100);
1211
- },
1212
-
1213
- hanldeGetValue(...arg) {
1214
- this.handleOk(...arg);
1215
- },
1216
-
1217
- // 获取表单提交的数据
1218
- handleGetSumitData(list = []) {
1219
- if (!Array.isArray(list)) return [];
1220
- let resList = [];
1221
- const { parent_id_obj, parent_name_obj, user_id_obj, user_name_obj } = this.wordbookConfig || {};
1222
- list.forEach(v => {
1223
- // d.key
1224
- let f = this.dataList.main.find(d => this.getuniqKey(d) == v);
1225
- if (!f) {
1226
- f = this.dataList.other.find(o => this.getuniqKey(o) == v);
1227
- }
1228
- // [parent_id_obj]: f[parent_id_obj],
1229
- // [parent_name_obj]: f[parent_name_obj],
1230
- // [user_id_obj]: f[user_id_obj],
1231
- // [user_name_obj]: f[user_name_obj]
1232
- if (f) {
1233
- /** 提交映射 */
1234
- // 自定义 key
1235
- const { parent_id_obj_key, parent_name_obj_key } = this.wordbook;
1236
- const { user_id_obj_key, user_name_obj_key } = this.wordbookChild;
1237
- resList.push({
1238
- [user_id_obj_key || 'user_id']: f[user_id_obj],
1239
- [user_name_obj_key || 'user_name']: f[user_name_obj],
1240
- [parent_id_obj_key || 'parent_id']: f[parent_id_obj],
1241
- [parent_name_obj_key || 'parent_name']: f[parent_name_obj]
1242
- });
1243
- }
1244
- });
1245
- return resList;
1246
- },
1247
-
1248
- cancel() {
1249
- this.$emit('update:visible', false);
1250
- this.spinning = false;
1251
- },
1252
- /* */
1253
- treeCount(count) {
1254
- if (!count) return '';
1255
- return `(${count})`;
1256
- },
1257
-
1258
- staticDataSearch() {
1259
- // let expandedKeys = new Set();
1260
- // this.getStaticSearchParentKey(this.treeData.main, expandedKeys);
1261
- // this.expandedKeys = Array.from(expandedKeys);
1262
- // this.autoExpandParent = true;
1263
- const key = ['main', 'dept', 'role'][this.typeActiveIndex];
1264
- if (!this.title) {
1265
- // 如果为空恢复默认数据
1266
- this.$set(this.treeData, 'temp', this.treeData[key]);
1267
- return;
1268
- }
1269
- let copyData = JSON.parse(JSON.stringify(this.treeData[key]));
1270
- // 增加visible属性 true展示 false不展示
1271
- filterTree({ value: this.title, data: copyData, prop: 'title' });
1272
- // 过滤visible属性 为true的数据
1273
- copyData = copyData.filter(item => item.visible);
1274
- const expandedKeys = [];
1275
- vexutils.searchTree(copyData, item => {
1276
- if (item.visible) {
1277
- expandedKeys.push(item.key);
1278
- }
1279
- if (item.children && item.children.length) {
1280
- item.children = item.children.filter(child => child.visible);
1281
- }
1282
- });
1283
- this.$set(this.treeData, 'temp', copyData);
1284
- this.expandedKeys = expandedKeys;
1285
- },
1286
- getStaticSearchParentKey(treeData, expandedKeys, orgId) {
1287
- const keyword = this.title;
1288
- for (let i = 0; i < treeData.length; i++) {
1289
- const user = treeData[i];
1290
- let { title = '', key, children } = user;
1291
- if (keyword.length > 0 && (String(title).indexOf(keyword) !== -1 || String(key).indexOf(keyword) !== -1)) {
1292
- expandedKeys.add(key);
1293
- if (orgId) {
1294
- expandedKeys.add(orgId);
1295
- }
1296
- break;
1297
- }
1298
- if (children) {
1299
- this.getStaticSearchParentKey(children, expandedKeys, user.key || orgId);
1300
- }
1301
- }
1302
- },
1303
-
1304
- // 数组对象去重
1305
- uniqArrObj(arr, name) {
1306
- let obj = {};
1307
- return arr.reduce((cur, next) => {
1308
- obj[next[name]] ? '' : (obj[next[name]] = true && cur.push(next));
1309
- return cur;
1310
- }, []);
1311
- },
1312
- onTypeClick(index) {
1313
- const key = ['main', 'dept', 'role'][index];
1314
- const checkedKeys = this.checkedKeys[key];
1315
- this.treeData.temp = this.treeData[key];
1316
- this.checkedKeys.temp = checkedKeys;
1317
- this.typeActiveIndex = index;
1318
- // 处理全选框
1319
- this.isAllCheck(checkedKeys);
1320
- },
1321
- onTreeCheck(checkedKeys, { checked, node }) {
1322
- // 断掉了父子关系 要不然当存在一二级科室的时候 搜索二级科室 再选中会把一级也选中 ; 后续与产品沟通 不需要断 只取最后一级科室
1323
- const propStr = ['main', 'dept', 'role'][this.typeActiveIndex];
1324
- let totalCheckedKeys = [];
1325
- // const keyData = this.dataList[propStr].find(item => item.key === node.eventKey);
1326
- // let keyData = {};
1327
- // vexutils.searchTree(this.treeData[propStr], item => {
1328
- // if (item.key === node.eventKey) {
1329
- // keyData = item;
1330
- // }
1331
- // });
1332
- // vexutils.searchTree(keyData.children, item => {
1333
- // childKeys.push(item.key);
1334
- // });
1335
- // if (checked) {
1336
- // const singleCheckedKeys = this.getSingleCheckedKeys(propStr, this.treeData[propStr], keyData);
1337
- // totalCheckedKeys = this.isSingleCheck ? singleCheckedKeys : [...new Set(checkedKeys.concat(childKeys))];
1338
- // } else {
1339
- // // totalCheckedKeys = checkedKeys;
1340
- // totalCheckedKeys = this.isSingleCheck ? [] : checkedKeys.filter(key => !childKeys.includes(key));
1341
- // }
1342
- // 如果是选中就把之前选中和现在选中的合并做为temp值(兼容搜索的情况),
1343
- if (checked) {
1344
- const preChecked = this.checkedKeys[propStr];
1345
- // 搜索时选中上级也要把它所有下级给选中 如果是选中一个下级但是也把其上级选中了要把上级选中给去掉
1346
- const childKeys = [];
1347
- let keyData = {};
1348
- vexutils.searchTree(this.treeData[propStr], item => {
1349
- if (item.key === node.eventKey) {
1350
- keyData = item;
1351
- }
1352
- });
1353
- vexutils.searchTree(keyData.children, item => {
1354
- childKeys.push(item.key);
1355
- });
1356
- const allParentIds = getAllParentId(this.treeData[propStr], node.eventKey).filter(Boolean);
1357
- totalCheckedKeys = [...new Set(preChecked.concat(checkedKeys, childKeys))].filter(id => !allParentIds.includes(id));
1358
- } else {
1359
- // 如果是取消从之前的选择中把当前点击的及其子级去除选中作为temp值(兼容搜索的情况)
1360
- let keyData = {};
1361
- const needCancelKeys = [node.eventKey];
1362
- const preChecked = this.checkedKeys[propStr];
1363
- vexutils.searchTree(this.treeData[propStr], item => {
1364
- if (item.key === node.eventKey) {
1365
- keyData = item;
1366
- }
1367
- });
1368
- vexutils.searchTree(keyData.children, item => {
1369
- needCancelKeys.push(item.key);
1370
- });
1371
- const allParentIds = getAllParentId(this.treeData[propStr], node.eventKey).filter(Boolean);
1372
- totalCheckedKeys = [...new Set(preChecked.filter(key => !needCancelKeys.includes(key)))].filter(id => !allParentIds.includes(id));
1373
- }
1374
- this.checkedKeys.temp = totalCheckedKeys;
1375
- this.checkedKeys[propStr] = totalCheckedKeys;
1376
- this.isAllCheck(totalCheckedKeys);
1377
- this.isSearchAllCheck(totalCheckedKeys);
1378
- this.$emit('pubCheckedTreeItem', [...this.checkedTreeItem, ...this.defaultShowList]);
1379
- this.$emit('check', [...this.checkedTreeItem, ...this.defaultShowList]);
1380
- },
1381
- getSingleCheckedKeys(propStr, treeData, keyData) {
1382
- const firstTreeData = deepTraversalFirst(keyData) || [];
1383
- let checkedKeys = [];
1384
- if (propStr === 'main') {
1385
- checkedKeys = firstTreeData.map(item => item.key);
1386
- } else if (propStr === 'dept') {
1387
- // 如果是dept 找到层级为科室的第一个数据
1388
- const index = firstTreeData.findIndex(item => item.type === 1);
1389
- if (index > -1) {
1390
- checkedKeys = firstTreeData.slice(0, index + 1).map(item => item.key);
1391
- } else {
1392
- checkedKeys = firstTreeData.map(item => item.key);
1393
- }
1394
- } else if (propStr === 'role') {
1395
- // 如果是dept 找到层级为角色的第一个数据
1396
- const index = firstTreeData.findIndex(item => item.roleId);
1397
- if (index > -1) {
1398
- checkedKeys = firstTreeData.slice(0, index + 1).map(item => item.key);
1399
- } else {
1400
- checkedKeys = firstTreeData.map(item => item.key);
1401
- }
1402
- }
1403
- return checkedKeys;
1404
- },
1405
-
1406
- onClearSelect() {
1407
- this.checkedKeys.temp = [];
1408
- this.checkedKeys.main = [];
1409
- this.checkedKeys.dept = [];
1410
- this.checkedKeys.role = [];
1411
- this.defaultShowList = [];
1412
- this.indeterminate = false;
1413
- this.singleChecked = false;
1414
- },
1415
- filterTreeData({ value, data, prop, filter, filterXor, children, visible, filterChildren = true, callback }) {
1416
- // 默认赋值
1417
- visible = visible || 'visible';
1418
- children = children || 'children';
1419
- prop = prop || 'text';
1420
-
1421
- const filterNodeMethod = function(value, data) {
1422
- if (!value) {
1423
- return true;
1424
- }
1425
- let flag = (data[prop] || '').indexOf(value) !== -1;
1426
- return filterXor ? !flag : flag;
1427
- };
1428
-
1429
- const traverse = function(node) {
1430
- const childNodes = node[children] || [];
1431
-
1432
- childNodes.forEach(child => {
1433
- callback && callback(child);
1434
- child[visible] = (!node.root && !filterChildren && node[visible]) || filterNodeMethod.call(child, value, child, prop);
1435
-
1436
- traverse(child);
1437
- });
1438
-
1439
- if (!node[visible] && childNodes.length) {
1440
- let allHidden = true;
1441
- allHidden = !childNodes.some(child => child[visible]);
1442
-
1443
- node[visible] = allHidden === false;
1444
- }
1445
- };
1446
- let totalData = {
1447
- root: true
1448
- };
1449
- totalData[children] = data;
1450
- traverse(totalData);
1451
-
1452
- if (filter) {
1453
- let copyData = data.slice();
1454
- let filterHandle = filterData => {
1455
- return filterData.filter((item, index) => {
1456
- if (item[visible]) {
1457
- if (item[children]) {
1458
- item[children] = filterHandle(item[children]);
1459
- }
1460
- return true;
1461
- }
1462
- return false;
1463
- });
1464
- };
1465
- return filterHandle(copyData);
1466
- }
1467
- }
1468
- }
1469
- });
1470
- </script>
1471
- <style lang="less" scoped>
1472
- @primary-color: #2563f4;
1473
- .people-tree {
1474
- display: flex;
1475
- .people-tree-item {
1476
- width: 50%;
1477
- padding: 22px 12px 0;
1478
- max-height: 376px;
1479
- height: 376px;
1480
- overflow-y: auto;
1481
- &.people-tree-left {
1482
- display: flex;
1483
- flex-direction: column;
1484
- }
1485
- /deep/ .person-search {
1486
- // .ant-input-affix-wrapper .ant-input:not(:last-child),
1487
- // .ant-input-affix-wrapper .ant-input:not(:first-child) {
1488
- // padding-left: 34px;
1489
- // }
1490
- .ant-input-group-addon {
1491
- padding: 0;
1492
- border: 0px !important;
1493
- }
1494
- .ant-input-search-button {
1495
- border-top-left-radius: 0;
1496
- border-bottom-left-radius: 0;
1497
- }
1498
- }
1499
- /deep/ .main-tree-container {
1500
- > li {
1501
- width: 100%;
1502
- overflow: hidden;
1503
- }
1504
- .ant-tree-switcher {
1505
- flex-shrink: 0;
1506
- }
1507
- .ant-tree-node-content-wrapper {
1508
- width: 90%;
1509
- text-overflow: ellipsis;
1510
- overflow: hidden;
1511
- white-space: nowrap;
1512
- }
1513
- }
1514
- /deep/.ant-tree-title {
1515
- // width: 250px;
1516
- width: 100%;
1517
- text-overflow: ellipsis;
1518
- overflow: hidden;
1519
- white-space: nowrap;
1520
- display: inline-block;
1521
- }
1522
- &:first-child {
1523
- border-right: 1px solid #e8e8e8;
1524
- }
1525
-
1526
- .no-data-tips {
1527
- height: 200px;
1528
- width: 100%;
1529
- display: flex;
1530
- justify-content: center;
1531
- align-items: center;
1532
- font-size: 16px;
1533
- font-weight: 700;
1534
- }
1535
-
1536
- .c-title {
1537
- font-size: 14px;
1538
- font-family: PingFangSC-Regular, PingFang SC;
1539
- font-weight: 400;
1540
- color: #212121;
1541
- }
1542
- .c-sub-title {
1543
- font-size: 12px;
1544
- font-family: PingFangSC-Regular, PingFang SC;
1545
- // font-weight: 400;
1546
- color: #4e4e4e;
1547
- }
1548
- .p-title {
1549
- font-size: 14px;
1550
- font-family: PingFangSC-Medium, PingFang SC;
1551
- font-weight: 500;
1552
- color: #212121;
1553
- }
1554
- }
1555
- /deep/.ant-tree {
1556
- overflow-y: auto;
1557
- // height: 450px;
1558
- flex: 1;
1559
- position: relative;
1560
- &::-webkit-scrollbar {
1561
- width: 6px;
1562
- height: 6px;
1563
- background-color: #f5f5f5;
1564
- }
1565
- }
1566
- .select-wrap {
1567
- flex: 1;
1568
- padding: 22px 12px 0;
1569
- height: 376px;
1570
- display: flex;
1571
- flex-direction: column;
1572
- .select-header {
1573
- display: flex;
1574
- justify-content: space-between;
1575
- margin-bottom: 20px;
1576
- .clear-btn {
1577
- color: @primary-color;
1578
- cursor: pointer;
1579
- }
1580
- }
1581
- .select-content {
1582
- flex: 1;
1583
- overflow-y: auto;
1584
- .tag-item {
1585
- &.isRoot {
1586
- background: rgba(@primary-color, 0.08);
1587
- border: 1px solid rgba(@primary-color, 0.5);
1588
- color: @primary-color;
1589
- .tag-close {
1590
- color: @primary-color;
1591
- &:hover {
1592
- color: rgba(@primary-color, 0.6);
1593
- }
1594
- }
1595
- }
1596
-
1597
- box-sizing: border-box;
1598
- color: #212121;
1599
- font-size: 14px;
1600
- list-style: none;
1601
- display: inline-flex;
1602
- align-items: center;
1603
- height: 24px;
1604
- line-height: 24px;
1605
- margin-right: 8px;
1606
- margin-bottom: 4px;
1607
- padding: 0 6px;
1608
- white-space: nowrap;
1609
- background: rgba(#d5d5d5, 0.2);
1610
- border: 1px solid rgba(#000000, 0.14);
1611
- border-radius: 4px;
1612
- transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
1613
- .tag-close {
1614
- font-size: 12px;
1615
- &:hover {
1616
- color: rgba(@primary-color, 0.6);
1617
- }
1618
- &:active {
1619
- color: #fff;
1620
- }
1621
- display: inline-block;
1622
- font-size: 14px;
1623
- margin-left: 3px;
1624
- color: #969696;
1625
- font-weight: 700;
1626
- cursor: pointer;
1627
- transition: all 0.3s;
1628
- }
1629
- }
1630
- }
1631
- }
1632
- }
1633
- .df {
1634
- display: flex;
1635
- }
1636
- .search-input-icon {
1637
- color: rgba(0, 0, 0, 0.4);
1638
- margin-bottom: -2px;
1639
- }
1640
- .type-wrap {
1641
- display: flex;
1642
- margin-bottom: 10px;
1643
- .type-btn {
1644
- margin-right: 10px;
1645
- padding: 2px 10px;
1646
- background: #f2f2f2;
1647
- border-radius: 8px;
1648
- cursor: pointer;
1649
- &:last-child {
1650
- margin-right: 0;
1651
- }
1652
- }
1653
- .type-active {
1654
- background: @primary-color;
1655
- color: #ffffff;
1656
- }
1657
- }
1658
- </style>
1
+ <template>
2
+ <div class="personnel">
3
+ <a-spin :spinning="spinning">
4
+ <div class="people-tree">
5
+ <!-- 树主体与检索 -->
6
+ <div class="people-tree-item people-tree-left">
7
+ <!-- $t('1.1.1.5.1') -->
8
+ <a-input-search style="margin-bottom: 12px" :placeholder="searchPlaceholder" :enter-button="searchButtonText" :allowClear="true" @search="searchClick" v-model="title" class="person-search">
9
+ <!-- <a-icon slot="prefix" type="search" class="search-input-icon" /> -->
10
+ <!-- <svg-icon
11
+ slot="prefix"
12
+ class="search-input-icon"
13
+ iconClass="xitongtubiaosousuo"
14
+ ></svg-icon> -->
15
+ </a-input-search>
16
+ <div class="type-wrap" v-if="selectType === 'multiple'">
17
+ <div class="type-btn" :class="{ 'type-active': typeActiveIndex === 0 }" @click="onTypeClick(0)">选人员</div>
18
+ <div class="type-btn" :class="{ 'type-active': typeActiveIndex === 1 }" @click="onTypeClick(1)">选科室</div>
19
+ <div class="type-btn" :class="{ 'type-active': typeActiveIndex === 2 }" @click="onTypeClick(2)">选角色</div>
20
+ </div>
21
+ <template v-if="!isSingleCheck">
22
+ <a-checkbox v-if="searchTreeVisable" v-model="searchChecked" :indeterminate="searchIndeterminate" @change="radioChange">
23
+ <!-- {{ $t("1.10.139") }} -->
24
+ 全选
25
+ </a-checkbox>
26
+
27
+ <a-checkbox v-else v-model="singleChecked" :indeterminate="indeterminate" @change="radioChange">
28
+ <!-- {{ $t("1.10.139") }} -->
29
+ 全选
30
+ </a-checkbox>
31
+ </template>
32
+
33
+ <div v-show="search.status == 3 || (search.status == 0 && treeData.temp && treeData.temp.length == 0)" class="no-data-tips">
34
+ 查无结果
35
+ </div>
36
+ <!-- main tree -->
37
+ <a-tree
38
+ class="main-tree-container"
39
+ v-show="search.status == 0"
40
+ ref="antTree"
41
+ v-model="checkedKeys.temp"
42
+ @expand="onExpand"
43
+ @check="onTreeCheck"
44
+ checkable
45
+ :expandedKeys="expandedKeys"
46
+ :autoExpandParent="autoExpandParent"
47
+ :checkStrictly="checkStrictly"
48
+ :selectable="false"
49
+ :treeData="treeData.temp"
50
+ :load-data="getLoadChildData"
51
+ :disabled="isDetail"
52
+ >
53
+ <template slot="custom" slot-scope="scope">
54
+ <span v-if="scope.isLeaf">
55
+ <a-tooltip :title="`${scope.title} ${scope.sub_title}`" :mouseEnterDelay="0.3">
56
+ <span class="c-title">{{ scope.title || scope.key }}&thinsp; </span>
57
+ <span class="c-sub-title">{{ scope.sub_title }}</span>
58
+ </a-tooltip>
59
+ </span>
60
+ <span v-else class="p-title">
61
+ <span v-if="scope.title">{{ scope.title }}</span>
62
+ <span v-else>{{ scope.key }}</span>
63
+ {{ treeCount(scope.count) }}
64
+ </span>
65
+ </template>
66
+ </a-tree>
67
+ <!-- search tree -->
68
+ <searchTree
69
+ v-on="$listeners"
70
+ ref="searchTree"
71
+ :visable="searchTreeVisable"
72
+ :formatTreeData="treeData.search"
73
+ :searchValue="searchValue"
74
+ :allCheckedKeys="checkedKeys"
75
+ :defaultExpandedKeys="search.defaultExpandedKeys"
76
+ :dataListKeys="search.dataListKeys"
77
+ :searchNoMore="searchNoMore"
78
+ :loadMorenLoadinng="loadMorenLoadinng"
79
+ @addCheckedkeysMain="addCheckedkeysMain"
80
+ @removeCheckedkeysMain="removeCheckedkeysMain"
81
+ @addCheckedkeysOther="addCheckedkeysOther"
82
+ @removeCheckedkeysOther="removeCheckedkeysOther"
83
+ @searchOnloadMore="searchOnloadMore"
84
+ ></searchTree>
85
+ </div>
86
+ <!-- 树已选的数据 -->
87
+ <div class="select-wrap">
88
+ <div class="select-header" v-if="(defaultShowList && defaultShowList.length) || checkedTreeItem.length">
89
+ <div class="select-count" v-if="showCount">已选择:{{ defaultShowList.length + checkedTreeItem.length }}</div>
90
+ <div class="clear-btn" @click="onClearSelect" v-if="showClear">清空</div>
91
+ </div>
92
+ <div class="select-content">
93
+ <slot v-if="defaultShowList && defaultShowList.length">
94
+ <div class="tag-item def-item" v-for="(tag, i) in defaultShowList" :key="i">
95
+ {{ tag.title || tag[wordbookChild.user_name_obj] }}
96
+ <a-icon v-if="!isDetail" class="tag-close" type="close-circle" theme="filled" @click="closeDefaultTag(tag, i)" />
97
+ <!-- <svg-icon
98
+ v-if="!isDetail"
99
+ class="tag-close"
100
+ :icon-class="'xitongtubiaodaohangtubiaoguanbishixin'"
101
+ @click="closeDefaultTag(tag, i)"
102
+ ></svg-icon> -->
103
+ </div>
104
+ </slot>
105
+
106
+ <div class="tag-item" :class="{ isRoot: !tag.isLeaf }" v-for="tag in checkedTreeItem" :key="tag.key">
107
+ {{ tag.title || tag.key }} {{ treeCount(tag.count) }}
108
+ <!-- <svg-icon
109
+ v-if="!isDetail"
110
+ class="tag-close"
111
+ :icon-class="'xitongtubiaodaohangtubiaoguanbishixin'"
112
+ @click="closeTag(tag)"
113
+ ></svg-icon> -->
114
+ <a-icon v-if="!isDetail" class="tag-close" type="close-circle" theme="filled" @click="closeTag(tag)" />
115
+ </div>
116
+ </div>
117
+ </div>
118
+ </div>
119
+ </a-spin>
120
+ </div>
121
+ </template>
122
+ <script>
123
+ /* eslint-disable no-async-promise-executor */
124
+
125
+ import { Icon, Checkbox, Tree, Tooltip, Input, Spin } from 'ant-design-vue';
126
+ import searchTree from './search-tree';
127
+ import create from '@/core/create';
128
+ import vexutils from '@/utils/vexutils';
129
+ import { filterTree, deepTraversalFirst, getAllParentId } from '@/utils';
130
+
131
+ /**
132
+ * 查询没有部门的分类时,parent_id_obj 为 undefined a-tree 展示异常。
133
+ * 前端 赋上固定key 标识 该分类 无部门,该key 不能提交接口。
134
+ * */
135
+
136
+ /**
137
+ * key 唯一key
138
+ * title 展示标题
139
+ * sub_title 副标题
140
+ * count 数量
141
+ */
142
+
143
+ const FIXEDKEY = '8982eeb4-0439-4100-9805-8cdd12b2256c-front-end-fixed-key';
144
+ export default create({
145
+ name: 'select-person',
146
+ components: {
147
+ searchTree,
148
+ [Icon.name]: Icon,
149
+ [Spin.name]: Spin,
150
+ [Tree.name]: Tree,
151
+ [Input.Search.name]: Input.Search,
152
+ [Checkbox.name]: Checkbox,
153
+ [Tooltip.name]: Tooltip
154
+ },
155
+ props: {
156
+ isDetail: { type: Boolean, isDetail: false },
157
+ defaultList: { type: Array, default: () => [] },
158
+ data: { type: Array, default: () => [] },
159
+ roleData: { type: Array, default: () => [] },
160
+ roleFields: {
161
+ type: Object,
162
+ default: () => ({ title: 'name', key: 'id', children: 'children' })
163
+ },
164
+ searchPlaceholder: {
165
+ type: String,
166
+ default: '输入关键字搜索'
167
+ },
168
+ searchButtonText: {
169
+ type: String,
170
+ default: '搜索'
171
+ },
172
+ // 父级配置
173
+ wordbook: {
174
+ type: Object,
175
+ default: () => ({
176
+ // parent_id_obj: "dept_id", // 父级 id
177
+ // parent_id_obj_key: "dept_id", // 提交的 id 的映射 key
178
+ // parent_name_obj: "dept_name", // 名称
179
+ // parent_name_obj_key: "dept_name", // 名称 的映射key
180
+ // user_count_obj: "count" // 统计 key
181
+ })
182
+ },
183
+
184
+ // 子集配置
185
+ wordbookChild: {
186
+ type: Object,
187
+ default: () => ({})
188
+ },
189
+
190
+ // 检索加载更多
191
+ SearchLoadMore: {
192
+ type: Boolean,
193
+ default: false
194
+ },
195
+
196
+ showClear: {
197
+ type: Boolean,
198
+ default: true
199
+ },
200
+ showCount: {
201
+ type: Boolean,
202
+ default: true
203
+ },
204
+ selectType: {
205
+ type: String,
206
+ default: 'person' // person dept role multiple
207
+ },
208
+ isSingleCheck: {
209
+ type: Boolean,
210
+ default: false
211
+ },
212
+ checkStrictly: {
213
+ type: Boolean,
214
+ default: false
215
+ },
216
+ needFilterParentDept: {
217
+ type: Boolean,
218
+ default: true
219
+ },
220
+ queryMainTreeData: Function, // 主树请求
221
+ queryLoadChildData: Function, // 懒加载请求
222
+ queryTreeSearch: Function // 检索请求
223
+ },
224
+ data() {
225
+ return {
226
+ treeData: {
227
+ main: [],
228
+ search: [],
229
+ dept: [],
230
+ role: [],
231
+ temp: []
232
+ },
233
+ // 展开的keys
234
+ expandedKeys: [],
235
+ // 展开的部门keys
236
+ expandedDeptKeys: [],
237
+ autoExpandParent: true,
238
+ // 扁平化tree的options Object{Array[Object]}
239
+ dataList: {
240
+ main: [],
241
+ other: [],
242
+ dept: [],
243
+ role: []
244
+ },
245
+ // 当前tree选中的keys Object{Array[Number]}
246
+ checkedKeys: {
247
+ main: [],
248
+ other: [],
249
+ dept: [],
250
+ role: [],
251
+ temp: []
252
+ },
253
+ search: {
254
+ defaultExpandedKeys: [],
255
+ // 0: 未查询,1:查询中,2:有查询结果,3无查询结果
256
+ status: 0,
257
+ dataListKeys: {
258
+ main: [],
259
+ other: []
260
+ },
261
+ records: 0
262
+ },
263
+ searchValue: '',
264
+ searchPage: 1,
265
+ searchNoMore: false,
266
+ title: '',
267
+ // 选中的所有叶节点(Leaf)keys <Array[Number]>,最终提交接口所需格式
268
+ checkedLeafKeys: [],
269
+ spinning: false,
270
+ loadMorenLoadinng: false,
271
+
272
+ errorMsg: '',
273
+
274
+ defaultShowList: [], // 默认选中项
275
+ checkedKeysMain: [],
276
+
277
+ cacheParentIdObj: {},
278
+ singleChecked: false,
279
+ indeterminate: false,
280
+
281
+ searchIndeterminate: false,
282
+ searchChecked: false,
283
+ typeActiveIndex: 0
284
+ };
285
+ },
286
+ computed: {
287
+ searchTreeVisable() {
288
+ return this.search.status == 2;
289
+ },
290
+ dataListMainKeys() {
291
+ if (!this.dataList.main.length) return [];
292
+
293
+ return this.dataList.main.map(i => {
294
+ return i.key;
295
+ });
296
+ },
297
+ dataListDeptKeys() {
298
+ if (!this.dataList.dept.length) return [];
299
+
300
+ return this.dataList.dept.map(i => {
301
+ return i.key;
302
+ });
303
+ },
304
+ dataListRoleKeys() {
305
+ if (!this.dataList.role.length) return [];
306
+
307
+ return this.dataList.role.map(i => {
308
+ return i.key;
309
+ });
310
+ },
311
+ dataListOtherKeys() {
312
+ if (!this.dataList.other.length) return [];
313
+
314
+ return this.dataList.other.map(i => {
315
+ return i.key;
316
+ });
317
+ },
318
+ // 右侧展示tabs <Array[Object]>
319
+ checkedTreeItem() {
320
+ let otherItems = this.dataList.other.filter(item => {
321
+ return this.checkedKeys.other.includes(item.key);
322
+ });
323
+ let mainItems = this.dataList.main.filter(item => {
324
+ // let f = this.currentKey === 'main';
325
+ // if(!f) return f;
326
+ let { isLeaf, key } = item;
327
+ let parentId = this.getParentId(item);
328
+ let showKeys = [...this.checkedKeys.main, ...otherItems];
329
+ let checked = showKeys.includes(key);
330
+ // 父级全选,子级不展示
331
+ /** String(parentId) 类型不相等 */
332
+ // if (isLeaf && parentId && this.checkedKeys.temp.some(v => v == parentId)) {
333
+ // checked = false;
334
+ // }
335
+ item.itemType = 'person';
336
+ return checked && item.type == 2;
337
+ });
338
+ let deptItems = this.dataList.dept.filter(item => {
339
+ let { key } = item;
340
+ let showKeys = [...this.checkedKeys.dept, ...otherItems];
341
+ let checked = showKeys.includes(key);
342
+ item.itemType = 'dept';
343
+ // 只展示最后一级的科室
344
+ if (this.needFilterParentDept) {
345
+ return checked && item.type == 1 && (!item.children || (item.children && !item.children.length));
346
+ } else {
347
+ // 不过滤
348
+ return checked && item.type == 1;
349
+ }
350
+ });
351
+ let roleItems = this.dataList.role.filter(item => {
352
+ let showKeys = [...this.checkedKeys.role, ...otherItems];
353
+ let checked = showKeys.includes(item.key);
354
+ item.itemType = 'role';
355
+ return checked && item.roleId;
356
+ });
357
+ if (this.selectType === 'multiple') {
358
+ deptItems.forEach(item => {
359
+ if (item.title) {
360
+ item.title = item.title.includes('(科室)') ? item.title : `${item.title}(科室)`;
361
+ }
362
+ });
363
+ roleItems.map(item => {
364
+ if (item.title) {
365
+ item.title = item.title.includes('(角色)') ? item.title : `${item.title}(角色)`;
366
+ }
367
+ return item;
368
+ });
369
+ }
370
+
371
+ let list = this.uniqArrObj([...mainItems, ...deptItems, ...roleItems, ...otherItems], 'key');
372
+ return list;
373
+ },
374
+
375
+ wordbookConfig() {
376
+ const { parent_id_obj, parent_name_obj } = this.wordbook || {};
377
+ const { user_id_obj, user_name_obj } = this.wordbookChild || {};
378
+ return {
379
+ parent_id_obj,
380
+ parent_name_obj,
381
+ user_id_obj,
382
+ user_name_obj
383
+ };
384
+ },
385
+
386
+ getLoadChildData() {
387
+ if (typeof this.queryLoadChildData == 'function') {
388
+ return this.onLoadData;
389
+ }
390
+ return null;
391
+ },
392
+
393
+ currentKey() {
394
+ return { person: 'main', dept: 'dept', role: 'role', multiple: 'main' }[this.selectType];
395
+ }
396
+ },
397
+ watch: {
398
+ // defaultList: {
399
+ // immediate: true,
400
+ // handler(val) {
401
+ // if (!val) return;
402
+ // this.initDefault();
403
+ // }
404
+ // },
405
+ selectType: {
406
+ immediate: true,
407
+ handler(val) {
408
+ if (val === 'dept' || val === 'role' || val === 'multiple') {
409
+ this.typeActiveIndex = { multiple: 0, dept: 1, role: 2 }[val];
410
+ }
411
+ }
412
+ },
413
+ data: {
414
+ immediate: true,
415
+ handler() {
416
+ this.staticDataInit();
417
+ this.staticDeptAndRoleDataInit();
418
+ const key = { person: 'main', dept: 'dept', role: 'role', multiple: 'main' }[this.selectType];
419
+ this.treeData.temp = this.treeData[key];
420
+ }
421
+ },
422
+ roleData: {
423
+ immediate: true,
424
+ handler() {
425
+ this.staticDeptAndRoleDataInit();
426
+ const key = { person: 'main', dept: 'dept', role: 'role', multiple: 'main' }[this.selectType];
427
+ this.treeData.temp = this.treeData[key];
428
+ }
429
+ }
430
+ },
431
+ created() {},
432
+ mounted() {
433
+ this.getUsers();
434
+ this.initDefault();
435
+ },
436
+ methods: {
437
+ initDefault() {
438
+ if (this.getLoadChildData) {
439
+ this.getDefaultList();
440
+ } else {
441
+ this.$nextTick(() => {
442
+ const userIds = this.defaultList.filter(item => item.itemType === 'person').map(item => item.id);
443
+ const deptIds = this.defaultList.filter(item => item.itemType === 'dept').map(item => item.id);
444
+ const roleIds = this.defaultList.filter(item => item.itemType === 'role').map(item => item.id);
445
+ const key = ['main', 'dept', 'role'][this.typeActiveIndex];
446
+ console.log(deptIds, key, '666 init');
447
+ this.checkedKeys.main = userIds;
448
+ this.checkedKeys.dept = deptIds;
449
+ this.checkedKeys.role = roleIds;
450
+ this.checkedKeys.temp = this.checkedKeys[key];
451
+ });
452
+ }
453
+ },
454
+
455
+ staticDataInit() {
456
+ if (!Array.isArray(this.data) || this.data.length == 0) return;
457
+ this.treeData.main = this.data;
458
+ this.generateDataList(this.treeData.main, this.dataList.main);
459
+ },
460
+ staticDeptAndRoleDataInit() {
461
+ this.treeData.dept = this.getDeptData(this.data);
462
+ this.generateDataList(this.treeData.dept, this.dataList.dept);
463
+ this.treeData.role = this.handleRoleData(this.roleData);
464
+ this.generateDataList(this.treeData.role, this.dataList.role);
465
+ },
466
+ getDeptData(data) {
467
+ // 把data里面的人员过滤掉
468
+ let copyData = JSON.parse(JSON.stringify(data));
469
+ copyData = copyData.filter(item => item.type === 1);
470
+ vexutils.searchTree(copyData, item => {
471
+ if (item.type === 1 && item.children && item.children.length) {
472
+ item.children = item.children.filter(child => child.type === 1);
473
+ }
474
+ });
475
+ return copyData;
476
+ },
477
+ handleRoleData(data) {
478
+ const copyData = JSON.parse(JSON.stringify(data));
479
+ vexutils.searchTree(copyData, item => {
480
+ const { title, key, children } = this.roleFields;
481
+ item.title = item[title];
482
+ item.children = item[children] ? item[children] : [];
483
+ item.key = item[key];
484
+ });
485
+ return copyData;
486
+ },
487
+ /** --- 默认值 --- */
488
+ getDefaultList() {
489
+ const { defaultList } = this;
490
+ let copy = JSON.parse(JSON.stringify(defaultList));
491
+ if (Array.isArray(copy)) {
492
+ // this.defaultShowObj = {};
493
+
494
+ const { user_id_obj } = this.wordbookChild || {};
495
+ copy.forEach(v => {
496
+ this.handleDefMapping(v);
497
+ let key = this.getuniqKey(v);
498
+ let pId = this.getParentId(v);
499
+ this.cacheParentIdObj[pId] = pId;
500
+ // this.defaultShowObj[key] = v[user_id_obj];
501
+ });
502
+ this.defaultShowList = copy;
503
+ }
504
+ },
505
+
506
+ getcheckedKeys() {
507
+ const { defaultList } = this;
508
+ let checkedKeysMain = [],
509
+ checkedKeysOther = [];
510
+ let copy = JSON.parse(JSON.stringify(defaultList));
511
+ if (Array.isArray(copy)) {
512
+ copy.forEach(v => {
513
+ this.handleDefMapping(v);
514
+ let key = this.getuniqKey(v);
515
+ checkedKeysMain.push(key);
516
+ // 回填到 检索的选择,防止回填马上检索
517
+ if (String(key).includes(FIXEDKEY)) {
518
+ checkedKeysOther.push(key);
519
+ }
520
+ });
521
+ }
522
+ return {
523
+ checkedKeysMain,
524
+ checkedKeysOther
525
+ };
526
+ },
527
+
528
+ /**
529
+ * 根据配置映射默认值
530
+ */
531
+ handleDefMapping(v) {
532
+ const { parent_id_obj, parent_name_obj, user_id_obj, user_name_obj } = this.wordbookConfig || {};
533
+ // 自定义 key
534
+ const { parent_id_obj_key, parent_name_obj_key } = this.wordbook;
535
+ const { user_id_obj_key, user_name_obj_key } = this.wordbookChild;
536
+ v[parent_id_obj] = v[parent_id_obj_key] || v.parent_id;
537
+ v[parent_name_obj] = v[parent_name_obj_key] || v.parent_name;
538
+ v[user_id_obj] = v[user_id_obj_key] || v.user_id;
539
+ v[user_name_obj] = v[user_name_obj_key] || v.user_name;
540
+ },
541
+
542
+ /**
543
+ * 初始化 请求已选的数据
544
+ */
545
+ async loadSelected() {
546
+ try {
547
+ let list = await Promise.all(
548
+ this.treeData.main.map(async v => {
549
+ const { parent_id_obj } = this.wordbook || {};
550
+ if ([v.key, v[parent_id_obj], String(v[parent_id_obj])].includes(this.cacheParentIdObj[v[parent_id_obj]])) {
551
+ await this.onLoadData({ dataRef: v });
552
+ return v;
553
+ }
554
+ })
555
+ );
556
+ return list;
557
+ } catch (error) {
558
+ return Promise.resolve();
559
+ }
560
+ },
561
+
562
+ /**
563
+ * 过滤默认值的右边展示
564
+ */
565
+ hanldeFilterDefaultShowList(list) {
566
+ this.defaultShowList = this.defaultShowList.filter(d => list.findIndex(l => this.getuniqKey(d) == this.getuniqKey(l)) == -1);
567
+ // this.updateDefaultShowObj(this.defaultShowList);
568
+ },
569
+
570
+ updateDefaultShowObj(list) {
571
+ const { user_id_obj } = this.wordbookConfig || {};
572
+ this.defaultShowObj = {};
573
+ list.forEach(v => {
574
+ this.defaultShowObj[this.getuniqKey(v)] = v[user_id_obj];
575
+ });
576
+ },
577
+
578
+ /**
579
+ * 拼接key
580
+ */
581
+ getuniqKey(v) {
582
+ const { user_id_obj } = this.wordbookConfig || {};
583
+ return `${this.getParentId(v)}_${v[user_id_obj]}`;
584
+ // return v.key;
585
+ },
586
+
587
+ getParentId(v) {
588
+ const { parent_id_obj } = this.wordbookConfig || {};
589
+ // return `${v[parent_id_obj] || FIXEDKEY}`;
590
+ return `${v[parent_id_obj]}`;
591
+ },
592
+
593
+ // 查询树结构数据(一级父类)
594
+ async getUsers() {
595
+ try {
596
+ if (typeof this.queryMainTreeData !== 'function') {
597
+ return;
598
+ }
599
+ this.spinning = true;
600
+ const { parent_id_obj } = this.wordbookConfig || {};
601
+ let rows = await this.queryMainTreeData();
602
+ let list = this.uniqArrObj(rows, parent_id_obj);
603
+ this.treeData.main = list;
604
+ this.generateDataList(this.treeData.main, this.dataList.main);
605
+ // TODO:这里的回填
606
+ await this.loadSelected();
607
+ let { checkedKeysMain, checkedKeysOther } = this.getcheckedKeys();
608
+ this.checkedKeys.main.push(...checkedKeysMain);
609
+ this.checkedKeys.other = [...checkedKeysOther];
610
+
611
+ this.treeData.main.forEach(f => {
612
+ if (f && f.children && f.children.length) {
613
+ let flag = f.children.every(c => checkedKeysMain.includes(c.key));
614
+ if (flag && f.key) {
615
+ this.checkedKeys.main.push(f.key);
616
+ }
617
+ }
618
+ });
619
+ if (this.currentKey === 'main') {
620
+ this.checkedKeys.temp = this.checkedKeys.main;
621
+ this.treeData.temp = this.treeData.main;
622
+ }
623
+ this.spinning = false;
624
+ } catch (error) {
625
+ this.spinning = false;
626
+ this.$message.error('查询异常');
627
+ console.log(error);
628
+ }
629
+ },
630
+
631
+ // 动态获取子节点
632
+ onLoadData(treeNode) {
633
+ return new Promise(async resolve => {
634
+ if (treeNode.dataRef.children) {
635
+ resolve();
636
+ return;
637
+ }
638
+ treeNode.dataRef.children = await this.handleLoadChildData(treeNode.dataRef.key, treeNode.dataRef);
639
+
640
+ this.hanldeFilterDefaultShowList(treeNode.dataRef.children);
641
+
642
+ this.$nextTick(() => {
643
+ this.treeData.main = [...this.treeData.main];
644
+ this.treeData.temp = [...this.treeData.main];
645
+ });
646
+
647
+ this.addCheckedKeysChildrenMain(treeNode.dataRef);
648
+
649
+ this.generateDataList(treeNode.dataRef.children, this.dataList.main);
650
+ resolve();
651
+ });
652
+ },
653
+
654
+ async handleLoadChildData(key, treeNode) {
655
+ let rows = await this.queryLoadChildData(key, treeNode);
656
+ let list = rows;
657
+ return list;
658
+ },
659
+
660
+ loadMainChildData(searchResultTreeData) {
661
+ return new Promise(async resolve => {
662
+ let promises = searchResultTreeData.map(async item => {
663
+ if (item.users) {
664
+ let mainTreeItem = this.treeData.main.find(mainItem => mainItem.key == item.key);
665
+ if (!mainTreeItem || (mainTreeItem && !mainTreeItem.children)) {
666
+ if (!mainTreeItem) {
667
+ mainTreeItem = { ...item };
668
+ }
669
+ mainTreeItem.children = await this.handleLoadChildData(item.key, mainTreeItem);
670
+ this.generateDataList(mainTreeItem.children, this.dataList.main);
671
+ this.addCheckedKeysChildrenMain(mainTreeItem);
672
+ }
673
+ }
674
+ });
675
+
676
+ await Promise.all(promises);
677
+
678
+ resolve();
679
+ });
680
+ },
681
+
682
+ /**
683
+ * 检索
684
+ */
685
+ async searchFetch(data = {}, config = {}) {
686
+ if (typeof this.queryTreeSearch !== 'function') {
687
+ this.staticDataSearch();
688
+ this.spinning = false;
689
+ this.isSearchAllCheck();
690
+ return;
691
+ }
692
+ if (!this.searchValue) {
693
+ this.search.status = 0;
694
+ this.search.defaultExpandedKeys = [];
695
+ this.expandedKeys = [];
696
+ this.spinning = false;
697
+ this.searchNoMore = false;
698
+ return false;
699
+ }
700
+ if (!config.loadMoren) {
701
+ this.search.status = 1;
702
+ } else {
703
+ this.loadMorenLoadinng = true;
704
+ }
705
+
706
+ let rows = await this.queryTreeSearch(this.searchValue, data);
707
+ let searchResultTreeData = rows;
708
+ this.loadMorenLoadinng = false;
709
+ if (!searchResultTreeData || !searchResultTreeData.length) {
710
+ if (this.searchPage == 1) {
711
+ this.search.defaultExpandedKeys = [];
712
+ this.search.status = 3;
713
+ } else {
714
+ this.search.status = 2;
715
+ this.searchNoMore = true;
716
+ }
717
+
718
+ this.spinning = false;
719
+ this.isSearchAllCheck();
720
+ return false;
721
+ }
722
+
723
+ const { parent_id_obj, parent_name_obj, user_count_obj } = this.wordbook || {};
724
+ const { user_name_obj } = this.wordbookChild || {};
725
+ let pObj = {};
726
+ searchResultTreeData.forEach(item => {
727
+ item[parent_id_obj] &&
728
+ (pObj[item[parent_id_obj]] = {
729
+ key: item[parent_id_obj],
730
+ users: []
731
+ });
732
+
733
+ if (item.users) {
734
+ this.insertSearchTreeData(item);
735
+ } else {
736
+ this.insertSearchTreeDataOther(item);
737
+ }
738
+ });
739
+ let pList = [];
740
+ Object.keys(pObj || {}).forEach(v => {
741
+ if (v) {
742
+ pList.push({ ...pObj[v] });
743
+ }
744
+ });
745
+ let len = this.treeData.search.length || 0;
746
+ // TODO:加载更多
747
+ if (this.SearchLoadMore) {
748
+ this.searchNoMore = false;
749
+ } else {
750
+ this.searchNoMore = true;
751
+ }
752
+ // 防止searchTree选中后切换回mainTree,mainTree checkedKeys状态丢失
753
+ await this.loadMainChildData(pList);
754
+ this.generateSearchDataListKeys(searchResultTreeData);
755
+
756
+ this.hanldeFilterDefaultShowList(searchResultTreeData);
757
+ this.refreshSearchTree();
758
+ this.search.status = 2;
759
+ this.spinning = false;
760
+
761
+ this.isSearchAllCheck();
762
+ },
763
+
764
+ insertSearchTreeData(item) {
765
+ const { user_count_obj } = this.wordbook || {};
766
+ this.search.defaultExpandedKeys.push(item.key);
767
+
768
+ // 默认值处理
769
+ this.hanldeFilterDefaultShowList(item.children || []);
770
+
771
+ if (item[user_count_obj] == item.children.length) {
772
+ item.disableCheckbox = false;
773
+ }
774
+ this.treeData.search.push(item);
775
+ },
776
+
777
+ insertSearchTreeDataOther(item) {
778
+ let formatItem = Object.assign({}, item, { isLeaf: true });
779
+
780
+ this.treeData.search.push(formatItem);
781
+
782
+ if (this.dataListOtherKeys.includes(formatItem.key)) return false;
783
+ this.generateDataList([formatItem], this.dataList.other);
784
+ },
785
+
786
+ generateSearchDataListKeys(searchResultTreeData) {
787
+ // this.search.dataListKeys = {
788
+ // main: [],
789
+ // other: []
790
+ // };
791
+ searchResultTreeData.forEach(item => {
792
+ if (!this.dataListMainKeys.includes(item.key)) {
793
+ this.search.dataListKeys.other.push(item.key);
794
+ item.children &&
795
+ item.children.forEach(childItem => {
796
+ this.search.dataListKeys.other.push(childItem.key);
797
+ });
798
+ return;
799
+ }
800
+
801
+ this.search.dataListKeys.main.push(item.key);
802
+ item.children &&
803
+ item.children.forEach(childItem => {
804
+ this.search.dataListKeys.main.push(childItem.key);
805
+ });
806
+ });
807
+ },
808
+
809
+ searchOnloadMore() {
810
+ this.searchPage = this.searchPage + 1;
811
+ this.searchFetch({ page: this.searchPage }, { loadMoren: true });
812
+ },
813
+
814
+ addCheckedKeysChildrenMain(item) {
815
+ if (!item.key) return;
816
+ if (!this.checkedKeys.main.includes(String(item.key))) return false;
817
+ // 新查询到插入已选中的main treeData 的child key,需要手动push到checkedKeys中
818
+ if (!Array.isArray(item.children)) return false;
819
+ item.children.forEach(({ key }) => {
820
+ // 防止重复添加(已处理,不会重复添加,保留代码以防逻辑缺漏)
821
+ if (this.checkedKeys.main.includes(key) || !key) return false;
822
+ this.checkedKeys.main.push(key);
823
+ });
824
+ },
825
+
826
+ // 暂存实际可选节点arr
827
+ generateDataList(data, dataList) {
828
+ for (let i = 0; i < data.length; i++) {
829
+ const node = data[i];
830
+ dataList.push({
831
+ parentId: this.getParentId(node),
832
+ ...node
833
+ });
834
+ if (node.children) {
835
+ this.generateDataList(node.children, dataList);
836
+ }
837
+ }
838
+ },
839
+
840
+ // 获取匹配搜索节点arr
841
+ getParentKey(key, tree) {
842
+ let parentKey;
843
+ for (let i = 0; i < tree.length; i++) {
844
+ const node = tree[i];
845
+ if (node.key == key) {
846
+ parentKey = node.key;
847
+ return parentKey;
848
+ }
849
+
850
+ if (node.children) {
851
+ if (node.children.some(item => item.key == key)) {
852
+ parentKey = node.key;
853
+ } else if (this.getParentKey(key, node.children)) {
854
+ parentKey = this.getParentKey(key, node.children);
855
+ }
856
+ }
857
+ }
858
+ return parentKey;
859
+ },
860
+ radioChange(e) {
861
+ let { checked } = e.target || {};
862
+ if (this.searchTreeVisable) {
863
+ this.singleChecked = checked;
864
+ } else {
865
+ this.searchChecked = checked;
866
+ }
867
+ this.checkAll(checked ? 1 : 2);
868
+ this.handleOk();
869
+ },
870
+ // type 1 全选 2 反选(清空)
871
+ checkAll(type) {
872
+ if (this.checkAllSearchTree(type)) return false;
873
+ const key = ['main', 'dept', 'role'][this.typeActiveIndex];
874
+ if (type == 1) {
875
+ this.expandedKeys = [];
876
+ this.checkedKeys[key] = this[`dataList${key.slice(0, 1).toUpperCase()}${key.slice(1)}Keys`]; // dataListMainKeys dataListDeptKeys dataListRoleKeys;
877
+ this.checkedKeys.temp = this.checkedKeys[key];
878
+ } else if (type == 2) {
879
+ this.checkedKeys[key] = [];
880
+ this.checkedKeys.temp = [];
881
+ this.autoExpandParent = true;
882
+ }
883
+ },
884
+
885
+ checkAllSearchTree(type) {
886
+ if (!this.searchTreeVisable) return false;
887
+
888
+ if (type == 1) {
889
+ // 全选默认不选中父级
890
+ let allSearchkeysMain = this.search.dataListKeys.main.filter(key => {
891
+ return !this.search.defaultExpandedKeys.includes(key);
892
+ });
893
+
894
+ let allSearchkeysOther = this.search.dataListKeys.other;
895
+
896
+ this.checkedKeys.main = vexutils.uniq([...this.checkedKeys.main, ...allSearchkeysMain]);
897
+ this.checkedKeys.other = vexutils.uniq([...this.checkedKeys.other, ...allSearchkeysOther]);
898
+
899
+ // 如果子级全选,父级也需要选中
900
+ this.search.dataListKeys.main.forEach(key => {
901
+ let getParentKey = this.getParentKey(key, this.treeData.main);
902
+ let parent = this.treeData.main.filter(item => {
903
+ return item.key == getParentKey;
904
+ });
905
+
906
+ let allCheck = parent[0].children.every(item => {
907
+ return this.checkedKeys.main.includes(item.key);
908
+ });
909
+ allCheck && this.checkedKeys.main.push(getParentKey);
910
+ });
911
+ this.refreshSearchTree();
912
+ } else if (type == 2) {
913
+ this.$refs['searchTree'].emptyCheckedKeys();
914
+ this.autoExpandParent = true;
915
+ }
916
+ this.isSearchAllCheck();
917
+ return true;
918
+ },
919
+
920
+ refreshSearchTree() {
921
+ if (!this.searchTreeVisable) return false;
922
+ this.$refs['searchTree'].setDefaultCheckedKeys();
923
+ this.$nextTick(() => {
924
+ this.isSearchAllCheck();
925
+ });
926
+ },
927
+
928
+ // 展开数节点
929
+ onExpand(expandedKeys) {
930
+ // const latestOpenKey = expandedKeys.find(key => this.expandedKeys.indexOf(key) == -1);
931
+ // this.expandedKeys = latestOpenKey ? [latestOpenKey] : [];
932
+ // this.autoExpandParent = false;
933
+ this.expandedKeys = expandedKeys;
934
+ this.autoExpandParent = false;
935
+ // this.$emit('expand', expandedKeys, ...arg)
936
+ },
937
+ onExpandDept(expandedKeys) {
938
+ this.expandedDeptKeys = expandedKeys;
939
+ },
940
+
941
+ searchClick() {
942
+ this.searchValue = this.title;
943
+
944
+ this.treeData.search = [];
945
+ this.search.dataListKeys.other = [];
946
+ this.search.dataListKeys.main = [];
947
+ this.search.defaultExpandedKeys = [];
948
+
949
+ this.spinning = true;
950
+ this.searchPage = 1;
951
+ this.searchFetch();
952
+ },
953
+
954
+ isAllCheck(checkedKeys = []) {
955
+ const key = ['main', 'dept', 'role'][this.typeActiveIndex];
956
+ if (!checkedKeys || checkedKeys.length == 0) {
957
+ this.indeterminate = false;
958
+ this.singleChecked = false;
959
+ } else {
960
+ let keyArr = this.treeData[key].map(item => item.key);
961
+ let keyArrTemp = keyArr.filter(item => checkedKeys.indexOf(item) !== -1);
962
+ this.indeterminate = !(keyArr.length == keyArrTemp.length);
963
+ this.singleChecked = keyArr.length == keyArrTemp.length;
964
+ }
965
+ },
966
+
967
+ isSearchAllCheck() {
968
+ this.$nextTick(() => {
969
+ let skeyArr = this.treeData.search.map(item => item.key);
970
+ let serchCheckedKeys = this.$refs['searchTree'].checkedKeys;
971
+ this.searchIndeterminate = !!serchCheckedKeys.length && serchCheckedKeys.length < skeyArr.length;
972
+ this.searchChecked = serchCheckedKeys.length === skeyArr.length;
973
+ });
974
+ },
975
+
976
+ /* 子组件emit方法 */
977
+ addCheckedkeysMain(keys) {
978
+ let checkedKeys = this.checkedKeys.main;
979
+ let filterKey = (keys || {}).filter(Boolean);
980
+ filterKey.forEach(key => {
981
+ //
982
+ checkedKeys.push(key);
983
+ // 如果子级全选,父级也需要选中
984
+ let getParentKey = this.getParentKey(key, this.treeData.main);
985
+ if (!getParentKey) return;
986
+ let parent = this.treeData.main.filter(item => {
987
+ return item.key == getParentKey;
988
+ });
989
+ let allCheck = (parent[0]?.children || []).every(item => {
990
+ return checkedKeys.includes(item.key);
991
+ });
992
+ allCheck && checkedKeys.push(getParentKey);
993
+ });
994
+ },
995
+
996
+ removeCheckedkeysMain(keys) {
997
+ let checkedKeysMain = vexutils.clone(this.checkedKeys.main, true);
998
+ keys.forEach(key => {
999
+ //
1000
+ let index = checkedKeysMain.findIndex(mainKey => mainKey == key);
1001
+ if (index !== -1) {
1002
+ checkedKeysMain.splice(index, 1);
1003
+ this.checkedKeys.main = [...checkedKeysMain];
1004
+ }
1005
+ // 删除父级选中
1006
+ let getParentKey = this.getParentKey(key, this.treeData.main);
1007
+ let parentIndex = checkedKeysMain.findIndex(mainKey => mainKey == getParentKey);
1008
+ if (parentIndex !== -1) {
1009
+ checkedKeysMain.splice(parentIndex, 1);
1010
+ }
1011
+ });
1012
+
1013
+ this.checkedKeys.main = [...checkedKeysMain];
1014
+ },
1015
+
1016
+ addCheckedkeysOther(keys) {
1017
+ this.checkedKeys.other.push(...keys);
1018
+ // this.checkedKeys.main.push(...keys);
1019
+ },
1020
+
1021
+ removeCheckedkeysOther(keys) {
1022
+ let checkedKeys = this.checkedKeys.other;
1023
+ // let mainCheckedKeys = this.checkedKeys.main;
1024
+ keys.forEach(key => {
1025
+ let index = checkedKeys.findIndex(otherKey => otherKey == key);
1026
+ checkedKeys.splice(index, 1);
1027
+ this.handleDeldefaultShowList(key);
1028
+
1029
+ // let mindex = mainCheckedKeys.findIndex(otherKey => otherKey == key);
1030
+ // mainCheckedKeys.splice(mindex, 1);
1031
+ });
1032
+ this.removeCheckedkeysMain(keys);
1033
+ },
1034
+
1035
+ handleDeldefaultShowList(key) {
1036
+ let len = this?.defaultShowList?.length || 0;
1037
+ if (len > 0) {
1038
+ for (let i = len - 1; i >= 0; i--) {
1039
+ let d = this.defaultShowList[i];
1040
+ if (`${d.parent_id}_${d.user_id}` == key) {
1041
+ this.closeDefaultTag(d, i);
1042
+ }
1043
+ }
1044
+ }
1045
+ },
1046
+
1047
+ closeDefaultTag(tag, i) {
1048
+ this.defaultShowList.splice(i, 1);
1049
+ this.closeTag({ parentId: this.getParentId(tag), ...tag });
1050
+ },
1051
+
1052
+ /* 右侧点击item[x]按钮 相关 */
1053
+ closeTag(removedTag) {
1054
+ // let { parentId } = removedTag;
1055
+
1056
+ this.removedCheckedkeysMain(removedTag);
1057
+ this.removedCheckedkeysDept(removedTag);
1058
+ this.removedCheckedkeysRole(removedTag);
1059
+ this.removedCheckedkeysOther(removedTag);
1060
+ const propStr = ['person', 'dept', 'role'][this.typeActiveIndex];
1061
+ const checkedKeys = this.checkedTreeItem.filter(item => item.itemType === propStr).map(item => item.key);
1062
+ this.checkedKeys.temp = checkedKeys;
1063
+ this.handleEmitValue();
1064
+ this.refreshSearchTree();
1065
+ this.isAllCheck(checkedKeys);
1066
+ },
1067
+
1068
+ removeCheckedkeysIncludeChildren(parentKey) {
1069
+ let needRemoveChildKeys = this.dataList.main
1070
+ .filter(i => {
1071
+ let parentId = this.getParentId(i);
1072
+ return parentId == parentKey || i.key == parentKey;
1073
+ })
1074
+ .map(i => {
1075
+ return i.key;
1076
+ });
1077
+ const checkedKeys = this.checkedKeys.main.filter(i => {
1078
+ return !needRemoveChildKeys.includes(i);
1079
+ });
1080
+ this.checkedKeys.main = checkedKeys;
1081
+ },
1082
+
1083
+ removedCheckedkeysMain(tag) {
1084
+ let checkedKeys = this.checkedKeys.main;
1085
+ let parentId = this.getParentId(tag);
1086
+ for (let i = 0; i < checkedKeys.length; i++) {
1087
+ if (tag.key == checkedKeys[i] && tag.key == parentId) {
1088
+ this.removeCheckedkeysIncludeChildren(tag.key);
1089
+ return false;
1090
+ } else if (tag.key == checkedKeys[i]) {
1091
+ checkedKeys.splice(i, 1);
1092
+ return false;
1093
+ }
1094
+ }
1095
+ },
1096
+ removeCheckedkeysIncludeChildrenDept(parentKey) {
1097
+ let needRemoveChildKeys = this.dataList.dept
1098
+ .filter(i => {
1099
+ let parentId = this.getParentId(i);
1100
+ return parentId == parentKey || i.key == parentKey;
1101
+ })
1102
+ .map(i => {
1103
+ return i.key;
1104
+ });
1105
+ const checkedKeys = this.checkedKeys.dept.filter(i => {
1106
+ return !needRemoveChildKeys.includes(i);
1107
+ });
1108
+ this.checkedKeys.dept = checkedKeys;
1109
+ },
1110
+ removedCheckedkeysDept(tag) {
1111
+ let checkedKeys = this.checkedKeys.dept;
1112
+ let parentId = this.getParentId(tag);
1113
+ for (let i = 0; i < checkedKeys.length; i++) {
1114
+ if (tag.key == checkedKeys[i] && tag.key == parentId) {
1115
+ this.removeCheckedkeysIncludeChildrenDept(tag.key);
1116
+ return false;
1117
+ } else if (tag.key == checkedKeys[i]) {
1118
+ checkedKeys.splice(i, 1);
1119
+ return false;
1120
+ }
1121
+ }
1122
+ },
1123
+ removedCheckedkeysRole(tag) {
1124
+ let checkedKeys = this.checkedKeys.role;
1125
+ let parentId = '';
1126
+ for (let i = 0; i < checkedKeys.length; i++) {
1127
+ if (tag.key == checkedKeys[i] && tag.key == parentId) {
1128
+ // this.removeCheckedkeysIncludeChildren(tag.key);
1129
+ return false;
1130
+ } else if (tag.key == checkedKeys[i]) {
1131
+ checkedKeys.splice(i, 1);
1132
+ return false;
1133
+ }
1134
+ }
1135
+ },
1136
+
1137
+ removedCheckedkeysOther(tag) {
1138
+ let checkedKeys = this.checkedKeys.other;
1139
+ if (checkedKeys.includes(tag.key)) {
1140
+ for (let i = 0; i < checkedKeys.length; i++) {
1141
+ if (tag.key == checkedKeys[i]) {
1142
+ checkedKeys.splice(i, 1);
1143
+ return false;
1144
+ }
1145
+ }
1146
+ } else {
1147
+ // 删除科室,删除
1148
+ this.OtherRemoveCheckedkeysIncludeChildren(tag.key);
1149
+ }
1150
+ },
1151
+
1152
+ OtherRemoveCheckedkeysIncludeChildren(parentKey) {
1153
+ let needRemoveChildKeys = this.dataList.main
1154
+ .filter(i => {
1155
+ let parentId = this.getParentId(i);
1156
+ return parentId == parentKey || i.key == parentKey;
1157
+ })
1158
+ .map(i => {
1159
+ return i.key;
1160
+ });
1161
+
1162
+ this.checkedKeys.other = this.checkedKeys.other.filter(i => {
1163
+ return !needRemoveChildKeys.includes(i);
1164
+ });
1165
+ },
1166
+
1167
+ /* submit 相关 */
1168
+ getCheckedMainChildKeys() {
1169
+ return new Promise(async resolve => {
1170
+ let promises = this.treeData.main.map(async item => {
1171
+ // 获取勾选了父类tree, 但未获取children
1172
+ // 接口传参,需要的是叶节点的keys
1173
+ if (this.checkedKeys.main.includes(item.key) && !item.children) {
1174
+ item.children = await this.handleLoadChildData(item.key, item);
1175
+ this.addCheckedKeysChildrenMain(item);
1176
+
1177
+ this.generateDataList(item.children, this.dataList.main);
1178
+ }
1179
+ });
1180
+
1181
+ await Promise.all(promises);
1182
+
1183
+ resolve();
1184
+ });
1185
+ },
1186
+
1187
+ getCheckedLeafKeys() {
1188
+ let mainLeafKeys = [];
1189
+ let mainLeafDataListKeys = this.dataList.main.filter(item => item.isLeaf).map(item => item.key);
1190
+
1191
+ this.checkedKeys.main.forEach(key => {
1192
+ if (mainLeafDataListKeys.includes(key)) {
1193
+ mainLeafKeys.push(key);
1194
+ }
1195
+ });
1196
+
1197
+ let keyList = [...mainLeafKeys, ...this.checkedKeys.other];
1198
+ let res = [...new Set(keyList)];
1199
+ return [...res];
1200
+ },
1201
+
1202
+ async handleOk(isShowLoading = false) {
1203
+ isShowLoading && (this.spinning = true);
1204
+ this.queryLoadChildData && (await this.getCheckedMainChildKeys());
1205
+
1206
+ this.checkedLeafKeys = this.getCheckedLeafKeys();
1207
+
1208
+ const submitData = this.handleGetSumitData(this.checkedLeafKeys);
1209
+
1210
+ // let subList = [...submitData, ...this.defaultShowList];
1211
+
1212
+ this.$emit('pubCheckedTreeItem', [...this.checkedTreeItem, ...this.defaultShowList]);
1213
+ this.$emit('check', [...this.checkedTreeItem, ...this.defaultShowList]);
1214
+ this.$emit('handleOk', this.checkedLeafKeys);
1215
+ this.$emit('change', this.checkedLeafKeys, [...submitData, ...this.defaultShowList]);
1216
+ this.$emit('submitData', [...submitData, ...this.defaultShowList]);
1217
+
1218
+ isShowLoading && (this.spinning = false);
1219
+ },
1220
+
1221
+ handleEmitValue() {
1222
+ clearTimeout(this.emitTimeout);
1223
+ this.emitTimeout = setTimeout(() => {
1224
+ this.handleOk();
1225
+ }, 100);
1226
+ },
1227
+
1228
+ hanldeGetValue(...arg) {
1229
+ this.handleOk(...arg);
1230
+ },
1231
+
1232
+ // 获取表单提交的数据
1233
+ handleGetSumitData(list = []) {
1234
+ if (!Array.isArray(list)) return [];
1235
+ let resList = [];
1236
+ const { parent_id_obj, parent_name_obj, user_id_obj, user_name_obj } = this.wordbookConfig || {};
1237
+ list.forEach(v => {
1238
+ // d.key
1239
+ let f = this.dataList.main.find(d => this.getuniqKey(d) == v);
1240
+ if (!f) {
1241
+ f = this.dataList.other.find(o => this.getuniqKey(o) == v);
1242
+ }
1243
+ // [parent_id_obj]: f[parent_id_obj],
1244
+ // [parent_name_obj]: f[parent_name_obj],
1245
+ // [user_id_obj]: f[user_id_obj],
1246
+ // [user_name_obj]: f[user_name_obj]
1247
+ if (f) {
1248
+ /** 提交映射 */
1249
+ // 自定义 key 值
1250
+ const { parent_id_obj_key, parent_name_obj_key } = this.wordbook;
1251
+ const { user_id_obj_key, user_name_obj_key } = this.wordbookChild;
1252
+ resList.push({
1253
+ [user_id_obj_key || 'user_id']: f[user_id_obj],
1254
+ [user_name_obj_key || 'user_name']: f[user_name_obj],
1255
+ [parent_id_obj_key || 'parent_id']: f[parent_id_obj],
1256
+ [parent_name_obj_key || 'parent_name']: f[parent_name_obj]
1257
+ });
1258
+ }
1259
+ });
1260
+ return resList;
1261
+ },
1262
+
1263
+ cancel() {
1264
+ this.$emit('update:visible', false);
1265
+ this.spinning = false;
1266
+ },
1267
+ /* */
1268
+ treeCount(count) {
1269
+ if (!count) return '';
1270
+ return `(${count})`;
1271
+ },
1272
+
1273
+ staticDataSearch() {
1274
+ // let expandedKeys = new Set();
1275
+ // this.getStaticSearchParentKey(this.treeData.main, expandedKeys);
1276
+ // this.expandedKeys = Array.from(expandedKeys);
1277
+ // this.autoExpandParent = true;
1278
+ const key = ['main', 'dept', 'role'][this.typeActiveIndex];
1279
+ if (!this.title) {
1280
+ // 如果为空恢复默认数据
1281
+ this.$set(this.treeData, 'temp', this.treeData[key]);
1282
+ return;
1283
+ }
1284
+ let copyData = JSON.parse(JSON.stringify(this.treeData[key]));
1285
+ // 增加visible属性 true展示 false不展示
1286
+ filterTree({ value: this.title, data: copyData, prop: 'title' });
1287
+ // 过滤visible属性 为true的数据
1288
+ copyData = copyData.filter(item => item.visible);
1289
+ const expandedKeys = [];
1290
+ vexutils.searchTree(copyData, item => {
1291
+ if (item.visible) {
1292
+ expandedKeys.push(item.key);
1293
+ }
1294
+ if (item.children && item.children.length) {
1295
+ item.children = item.children.filter(child => child.visible);
1296
+ }
1297
+ });
1298
+ this.$set(this.treeData, 'temp', copyData);
1299
+ this.expandedKeys = expandedKeys;
1300
+ },
1301
+ getStaticSearchParentKey(treeData, expandedKeys, orgId) {
1302
+ const keyword = this.title;
1303
+ for (let i = 0; i < treeData.length; i++) {
1304
+ const user = treeData[i];
1305
+ let { title = '', key, children } = user;
1306
+ if (keyword.length > 0 && (String(title).indexOf(keyword) !== -1 || String(key).indexOf(keyword) !== -1)) {
1307
+ expandedKeys.add(key);
1308
+ if (orgId) {
1309
+ expandedKeys.add(orgId);
1310
+ }
1311
+ break;
1312
+ }
1313
+ if (children) {
1314
+ this.getStaticSearchParentKey(children, expandedKeys, user.key || orgId);
1315
+ }
1316
+ }
1317
+ },
1318
+
1319
+ // 数组对象去重
1320
+ uniqArrObj(arr, name) {
1321
+ let obj = {};
1322
+ return arr.reduce((cur, next) => {
1323
+ obj[next[name]] ? '' : (obj[next[name]] = true && cur.push(next));
1324
+ return cur;
1325
+ }, []);
1326
+ },
1327
+ onTypeClick(index) {
1328
+ const key = ['main', 'dept', 'role'][index];
1329
+ const checkedKeys = this.checkedKeys[key];
1330
+ this.treeData.temp = this.treeData[key];
1331
+ this.checkedKeys.temp = checkedKeys;
1332
+ this.typeActiveIndex = index;
1333
+ // 处理全选框
1334
+ this.isAllCheck(checkedKeys);
1335
+ },
1336
+ onTreeCheck(checkedKeys, { checked, node }) {
1337
+ if (this.checkStrictly) {
1338
+ checkedKeys = checkedKeys.checked;
1339
+ }
1340
+ // 断掉了父子关系 要不然当存在一二级科室的时候 搜索二级科室 再选中会把一级也选中 后续与产品沟通 不需要断 只取最后一级科室
1341
+ const propStr = ['main', 'dept', 'role'][this.typeActiveIndex];
1342
+ let totalCheckedKeys = [];
1343
+ // const keyData = this.dataList[propStr].find(item => item.key === node.eventKey);
1344
+ // let keyData = {};
1345
+ // vexutils.searchTree(this.treeData[propStr], item => {
1346
+ // if (item.key === node.eventKey) {
1347
+ // keyData = item;
1348
+ // }
1349
+ // });
1350
+ // vexutils.searchTree(keyData.children, item => {
1351
+ // childKeys.push(item.key);
1352
+ // });
1353
+ // if (checked) {
1354
+ // const singleCheckedKeys = this.getSingleCheckedKeys(propStr, this.treeData[propStr], keyData);
1355
+ // totalCheckedKeys = this.isSingleCheck ? singleCheckedKeys : [...new Set(checkedKeys.concat(childKeys))];
1356
+ // } else {
1357
+ // // totalCheckedKeys = checkedKeys;
1358
+ // totalCheckedKeys = this.isSingleCheck ? [] : checkedKeys.filter(key => !childKeys.includes(key));
1359
+ // }
1360
+ // 如果是选中就把之前选中和现在选中的合并做为temp值(兼容搜索的情况),
1361
+ if (checked) {
1362
+ const preChecked = this.checkedKeys[propStr];
1363
+ // 搜索时选中上级也要把它所有下级给选中 如果是选中一个下级但是也把其上级选中了要把上级选中给去掉
1364
+ const childKeys = [];
1365
+ let keyData = {};
1366
+ vexutils.searchTree(this.treeData[propStr], item => {
1367
+ if (item.key === node.eventKey) {
1368
+ keyData = item;
1369
+ }
1370
+ });
1371
+ vexutils.searchTree(keyData.children, item => {
1372
+ childKeys.push(item.key);
1373
+ });
1374
+ // const allParentIds = getAllParentId(this.treeData[propStr], node.eventKey).filter(Boolean);
1375
+ // totalCheckedKeys = [...new Set(preChecked.concat(checkedKeys, childKeys))].filter(id => !allParentIds.includes(id));
1376
+ totalCheckedKeys = [...new Set(preChecked.concat(checkedKeys, childKeys))];
1377
+ } else {
1378
+ // 如果是取消从之前的选择中把当前点击的及其子级去除选中作为temp值(兼容搜索的情况)
1379
+ let keyData = {};
1380
+ const needCancelKeys = [node.eventKey];
1381
+ const preChecked = this.checkedKeys[propStr];
1382
+ vexutils.searchTree(this.treeData[propStr], item => {
1383
+ if (item.key === node.eventKey) {
1384
+ keyData = item;
1385
+ }
1386
+ });
1387
+ vexutils.searchTree(keyData.children, item => {
1388
+ needCancelKeys.push(item.key);
1389
+ });
1390
+ const allParentIds = getAllParentId(this.treeData[propStr], node.eventKey).filter(Boolean);
1391
+ totalCheckedKeys = [...new Set(preChecked.filter(key => !needCancelKeys.includes(key)))];
1392
+ if (!this.checkStrictly) {
1393
+ totalCheckedKeys = totalCheckedKeys.filter(id => !allParentIds.includes(id));
1394
+ }
1395
+ }
1396
+ this.checkedKeys.temp = totalCheckedKeys;
1397
+ this.checkedKeys[propStr] = totalCheckedKeys;
1398
+ this.isAllCheck(totalCheckedKeys);
1399
+ this.isSearchAllCheck(totalCheckedKeys);
1400
+ this.$emit('pubCheckedTreeItem', [...this.checkedTreeItem, ...this.defaultShowList]);
1401
+ this.$emit('check', [...this.checkedTreeItem, ...this.defaultShowList]);
1402
+ },
1403
+ getSingleCheckedKeys(propStr, treeData, keyData) {
1404
+ const firstTreeData = deepTraversalFirst(keyData) || [];
1405
+ let checkedKeys = [];
1406
+ if (propStr === 'main') {
1407
+ checkedKeys = firstTreeData.map(item => item.key);
1408
+ } else if (propStr === 'dept') {
1409
+ // 如果是dept 找到层级为科室的第一个数据
1410
+ const index = firstTreeData.findIndex(item => item.type === 1);
1411
+ if (index > -1) {
1412
+ checkedKeys = firstTreeData.slice(0, index + 1).map(item => item.key);
1413
+ } else {
1414
+ checkedKeys = firstTreeData.map(item => item.key);
1415
+ }
1416
+ } else if (propStr === 'role') {
1417
+ // 如果是dept 找到层级为角色的第一个数据
1418
+ const index = firstTreeData.findIndex(item => item.roleId);
1419
+ if (index > -1) {
1420
+ checkedKeys = firstTreeData.slice(0, index + 1).map(item => item.key);
1421
+ } else {
1422
+ checkedKeys = firstTreeData.map(item => item.key);
1423
+ }
1424
+ }
1425
+ return checkedKeys;
1426
+ },
1427
+
1428
+ onClearSelect() {
1429
+ this.checkedKeys.temp = [];
1430
+ this.checkedKeys.main = [];
1431
+ this.checkedKeys.dept = [];
1432
+ this.checkedKeys.role = [];
1433
+ this.defaultShowList = [];
1434
+ this.indeterminate = false;
1435
+ this.singleChecked = false;
1436
+ },
1437
+ filterTreeData({ value, data, prop, filter, filterXor, children, visible, filterChildren = true, callback }) {
1438
+ // 默认赋值
1439
+ visible = visible || 'visible';
1440
+ children = children || 'children';
1441
+ prop = prop || 'text';
1442
+
1443
+ const filterNodeMethod = function(value, data) {
1444
+ if (!value) {
1445
+ return true;
1446
+ }
1447
+ let flag = (data[prop] || '').indexOf(value) !== -1;
1448
+ return filterXor ? !flag : flag;
1449
+ };
1450
+
1451
+ const traverse = function(node) {
1452
+ const childNodes = node[children] || [];
1453
+
1454
+ childNodes.forEach(child => {
1455
+ callback && callback(child);
1456
+ child[visible] = (!node.root && !filterChildren && node[visible]) || filterNodeMethod.call(child, value, child, prop);
1457
+
1458
+ traverse(child);
1459
+ });
1460
+
1461
+ if (!node[visible] && childNodes.length) {
1462
+ let allHidden = true;
1463
+ allHidden = !childNodes.some(child => child[visible]);
1464
+
1465
+ node[visible] = allHidden === false;
1466
+ }
1467
+ };
1468
+ let totalData = {
1469
+ root: true
1470
+ };
1471
+ totalData[children] = data;
1472
+ traverse(totalData);
1473
+
1474
+ if (filter) {
1475
+ let copyData = data.slice();
1476
+ let filterHandle = filterData => {
1477
+ return filterData.filter((item, index) => {
1478
+ if (item[visible]) {
1479
+ if (item[children]) {
1480
+ item[children] = filterHandle(item[children]);
1481
+ }
1482
+ return true;
1483
+ }
1484
+ return false;
1485
+ });
1486
+ };
1487
+ return filterHandle(copyData);
1488
+ }
1489
+ }
1490
+ }
1491
+ });
1492
+ </script>
1493
+ <style lang="less" scoped>
1494
+ @primary-color: #2563f4;
1495
+ .people-tree {
1496
+ display: flex;
1497
+ .people-tree-item {
1498
+ width: 50%;
1499
+ padding: 22px 12px 0;
1500
+ max-height: 376px;
1501
+ height: 376px;
1502
+ overflow-y: auto;
1503
+ &.people-tree-left {
1504
+ display: flex;
1505
+ flex-direction: column;
1506
+ }
1507
+ /deep/ .person-search {
1508
+ // .ant-input-affix-wrapper .ant-input:not(:last-child),
1509
+ // .ant-input-affix-wrapper .ant-input:not(:first-child) {
1510
+ // padding-left: 34px;
1511
+ // }
1512
+ .ant-input-group-addon {
1513
+ padding: 0;
1514
+ border: 0px !important;
1515
+ }
1516
+ .ant-input-search-button {
1517
+ border-top-left-radius: 0;
1518
+ border-bottom-left-radius: 0;
1519
+ }
1520
+ }
1521
+ /deep/ .main-tree-container {
1522
+ > li {
1523
+ width: 100%;
1524
+ overflow: hidden;
1525
+ }
1526
+ .ant-tree-switcher {
1527
+ flex-shrink: 0;
1528
+ }
1529
+ .ant-tree-node-content-wrapper {
1530
+ width: 90%;
1531
+ text-overflow: ellipsis;
1532
+ overflow: hidden;
1533
+ white-space: nowrap;
1534
+ }
1535
+ }
1536
+ /deep/.ant-tree-title {
1537
+ // width: 250px;
1538
+ width: 100%;
1539
+ text-overflow: ellipsis;
1540
+ overflow: hidden;
1541
+ white-space: nowrap;
1542
+ display: inline-block;
1543
+ }
1544
+ &:first-child {
1545
+ border-right: 1px solid #e8e8e8;
1546
+ }
1547
+
1548
+ .no-data-tips {
1549
+ height: 200px;
1550
+ width: 100%;
1551
+ display: flex;
1552
+ justify-content: center;
1553
+ align-items: center;
1554
+ font-size: 16px;
1555
+ font-weight: 700;
1556
+ }
1557
+
1558
+ .c-title {
1559
+ font-size: 14px;
1560
+ font-family: PingFangSC-Regular, PingFang SC;
1561
+ font-weight: 400;
1562
+ color: #212121;
1563
+ }
1564
+ .c-sub-title {
1565
+ font-size: 12px;
1566
+ font-family: PingFangSC-Regular, PingFang SC;
1567
+ // font-weight: 400;
1568
+ color: #4e4e4e;
1569
+ }
1570
+ .p-title {
1571
+ font-size: 14px;
1572
+ font-family: PingFangSC-Medium, PingFang SC;
1573
+ font-weight: 500;
1574
+ color: #212121;
1575
+ }
1576
+ }
1577
+ /deep/.ant-tree {
1578
+ overflow-y: auto;
1579
+ // height: 450px;
1580
+ flex: 1;
1581
+ position: relative;
1582
+ &::-webkit-scrollbar {
1583
+ width: 6px;
1584
+ height: 6px;
1585
+ background-color: #f5f5f5;
1586
+ }
1587
+ }
1588
+ .select-wrap {
1589
+ flex: 1;
1590
+ padding: 22px 12px 0;
1591
+ height: 376px;
1592
+ display: flex;
1593
+ flex-direction: column;
1594
+ .select-header {
1595
+ display: flex;
1596
+ justify-content: space-between;
1597
+ margin-bottom: 20px;
1598
+ .clear-btn {
1599
+ color: @primary-color;
1600
+ cursor: pointer;
1601
+ }
1602
+ }
1603
+ .select-content {
1604
+ flex: 1;
1605
+ overflow-y: auto;
1606
+ .tag-item {
1607
+ &.isRoot {
1608
+ background: rgba(@primary-color, 0.08);
1609
+ border: 1px solid rgba(@primary-color, 0.5);
1610
+ color: @primary-color;
1611
+ .tag-close {
1612
+ color: @primary-color;
1613
+ &:hover {
1614
+ color: rgba(@primary-color, 0.6);
1615
+ }
1616
+ }
1617
+ }
1618
+
1619
+ box-sizing: border-box;
1620
+ color: #212121;
1621
+ font-size: 14px;
1622
+ list-style: none;
1623
+ display: inline-flex;
1624
+ align-items: center;
1625
+ height: 24px;
1626
+ line-height: 24px;
1627
+ margin-right: 8px;
1628
+ margin-bottom: 4px;
1629
+ padding: 0 6px;
1630
+ white-space: nowrap;
1631
+ background: rgba(#d5d5d5, 0.2);
1632
+ border: 1px solid rgba(#000000, 0.14);
1633
+ border-radius: 4px;
1634
+ transition: all 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
1635
+ .tag-close {
1636
+ font-size: 12px;
1637
+ &:hover {
1638
+ color: rgba(@primary-color, 0.6);
1639
+ }
1640
+ &:active {
1641
+ color: #fff;
1642
+ }
1643
+ display: inline-block;
1644
+ font-size: 14px;
1645
+ margin-left: 3px;
1646
+ color: #969696;
1647
+ font-weight: 700;
1648
+ cursor: pointer;
1649
+ transition: all 0.3s;
1650
+ }
1651
+ }
1652
+ }
1653
+ }
1654
+ }
1655
+ .df {
1656
+ display: flex;
1657
+ }
1658
+ .search-input-icon {
1659
+ color: rgba(0, 0, 0, 0.4);
1660
+ margin-bottom: -2px;
1661
+ }
1662
+ .type-wrap {
1663
+ display: flex;
1664
+ margin-bottom: 10px;
1665
+ .type-btn {
1666
+ margin-right: 10px;
1667
+ padding: 2px 10px;
1668
+ background: #f2f2f2;
1669
+ border-radius: 8px;
1670
+ cursor: pointer;
1671
+ &:last-child {
1672
+ margin-right: 0;
1673
+ }
1674
+ }
1675
+ .type-active {
1676
+ background: @primary-color;
1677
+ color: #ffffff;
1678
+ }
1679
+ }
1680
+ </style>