cnhis-design-vue 2.1.23 → 2.1.25

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 (127) hide show
  1. package/CHANGELOG.md +2287 -2280
  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 +61 -54
  14. package/es/button/style.css +1 -1
  15. package/es/calendar/index.js +8 -8
  16. package/es/captcha/index.js +3 -3
  17. package/es/card/index.js +8 -8
  18. package/es/carousel/index.js +8 -8
  19. package/es/cascader/index.js +8 -8
  20. package/es/checkbox/index.js +9 -9
  21. package/es/col/index.js +8 -8
  22. package/es/collapse/index.js +8 -8
  23. package/es/color-picker/index.js +1 -1
  24. package/es/comment/index.js +8 -8
  25. package/es/config-provider/index.js +8 -8
  26. package/es/date-picker/index.js +8 -8
  27. package/es/descriptions/index.js +8 -8
  28. package/es/divider/index.js +8 -8
  29. package/es/drag-layout/index.js +3 -3
  30. package/es/drawer/index.js +8 -8
  31. package/es/dropdown/index.js +8 -8
  32. package/es/editor/index.js +30 -25
  33. package/es/editor/style.css +1 -1
  34. package/es/empty/index.js +8 -8
  35. package/es/fabric-chart/index.js +65 -49
  36. package/es/form/index.js +8 -8
  37. package/es/form-model/index.js +8 -8
  38. package/es/form-table/index.js +93 -87
  39. package/es/form-table/style.css +1 -1
  40. package/es/index/index.js +877 -823
  41. package/es/index/style.css +1 -1
  42. package/es/input/index.js +9 -9
  43. package/es/input-number/index.js +8 -8
  44. package/es/layout/index.js +8 -8
  45. package/es/list/index.js +8 -8
  46. package/es/locale-provider/index.js +8 -8
  47. package/es/map/index.js +9 -9
  48. package/es/mentions/index.js +8 -8
  49. package/es/menu/index.js +8 -8
  50. package/es/message/index.js +8 -8
  51. package/es/multi-chat/index.js +92 -92
  52. package/es/multi-chat-client/index.js +86 -86
  53. package/es/multi-chat-history/index.js +4 -4
  54. package/es/multi-chat-record/index.js +14 -14
  55. package/es/multi-chat-setting/index.js +27 -27
  56. package/es/multi-chat-sip/index.js +1 -1
  57. package/es/notification/index.js +8 -8
  58. package/es/page-header/index.js +8 -8
  59. package/es/pagination/index.js +8 -8
  60. package/es/popconfirm/index.js +8 -8
  61. package/es/popover/index.js +8 -8
  62. package/es/progress/index.js +8 -8
  63. package/es/radio/index.js +9 -9
  64. package/es/rate/index.js +8 -8
  65. package/es/result/index.js +8 -8
  66. package/es/row/index.js +8 -8
  67. package/es/scale-view/index.js +33 -33
  68. package/es/select/index.js +11 -11
  69. package/es/select-label/index.js +11 -11
  70. package/es/select-person/index.js +20 -20
  71. package/es/skeleton/index.js +8 -8
  72. package/es/slider/index.js +8 -8
  73. package/es/space/index.js +8 -8
  74. package/es/spin/index.js +8 -8
  75. package/es/statistic/index.js +8 -8
  76. package/es/steps/index.js +8 -8
  77. package/es/switch/index.js +8 -8
  78. package/es/table-filter/index.js +286 -259
  79. package/es/table-filter/style.css +1 -1
  80. package/es/tabs/index.js +8 -8
  81. package/es/tag/index.js +9 -9
  82. package/es/time-picker/index.js +8 -8
  83. package/es/timeline/index.js +8 -8
  84. package/es/tooltip/index.js +8 -8
  85. package/es/transfer/index.js +8 -8
  86. package/es/tree/index.js +8 -8
  87. package/es/tree-select/index.js +8 -8
  88. package/es/upload/index.js +8 -8
  89. package/es/verification-code/index.js +2 -2
  90. package/lib/cui.common.js +918 -864
  91. package/lib/cui.umd.js +918 -864
  92. package/lib/cui.umd.min.js +29 -29
  93. package/package.json +107 -107
  94. package/packages/big-table/src/BigTable.vue +3044 -3044
  95. package/packages/big-table/src/assets/style/table-base.less +370 -370
  96. package/packages/big-table/src/components/AutoLayoutButton.vue +270 -270
  97. package/packages/big-table/src/utils/batchEditing.js +610 -610
  98. package/packages/big-table/src/utils/bigTableProps.js +95 -95
  99. package/packages/button/src/ButtonPrint/components/IdentityVerification.vue +181 -181
  100. package/packages/button/src/ButtonPrint/index.vue +739 -728
  101. package/packages/editor/src/Editor.vue +13 -4
  102. package/packages/fabric-chart/src/components/TimeScaleValue.vue +113 -113
  103. package/packages/fabric-chart/src/const/defaultVaule.js +59 -59
  104. package/packages/fabric-chart/src/fabric-chart/FabricPolylines.vue +1079 -1066
  105. package/packages/fabric-chart/src/fabric-chart/FabricScaleValue.vue +135 -135
  106. package/packages/fabric-chart/src/fabric-chart/FabricTextGroup.vue +558 -558
  107. package/packages/fabric-chart/src/fabric-chart2/FabricTop.vue +172 -172
  108. package/packages/form-table/src/FormTable.vue +5 -1
  109. package/packages/multi-chat/chat/chatFooter.vue +1594 -1594
  110. package/packages/multi-chat/chat/chatMain.vue +1466 -1466
  111. package/packages/multi-chat/chat/quickReply.vue +439 -439
  112. package/packages/multi-chat/chat/scrollList.vue +1232 -1232
  113. package/packages/multi-chat/setting/baseInfo/index.vue +1316 -1316
  114. package/packages/multi-chat/store/actions.js +448 -448
  115. package/packages/multi-chat/store/state.js +112 -112
  116. package/packages/scale-view/formitem/r-choice.vue +714 -714
  117. package/packages/scale-view/scaleView.vue +2010 -2010
  118. package/packages/select-person/select-person.vue +1680 -1680
  119. package/packages/table-filter/src/base-search-com/BaseSearch.vue +2468 -2462
  120. package/packages/table-filter/src/components/c-tree-select/tree-select.vue +336 -336
  121. package/packages/table-filter/src/components/multi-select/multi-select.vue +219 -219
  122. package/packages/table-filter/src/components/out-quick-search/out-quick-search.vue +340 -340
  123. package/packages/table-filter/src/components/search-condition/SearchCondition.vue +1825 -1825
  124. package/packages/table-filter/src/const/dataOptions.js +43 -43
  125. package/packages/table-filter/src/mixins/mixins.js +692 -695
  126. package/packages/table-filter/src/quick-search/QuickSearch.vue +2116 -2109
  127. package/src/directive/preventReClick.js +12 -12
@@ -1,1680 +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="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>
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>