hy-dispatch-ui-v3 0.2.64 → 0.2.65
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.
|
@@ -14,7 +14,7 @@ const deviceStatus = {
|
|
|
14
14
|
1: "\u5728\u7EBF"
|
|
15
15
|
};
|
|
16
16
|
const useAppTreeWrapper = (hy) => {
|
|
17
|
-
const { props
|
|
17
|
+
const { props, emits, slots, treeRef, VirtualTree } = hy;
|
|
18
18
|
const instance = getCurrentInstance();
|
|
19
19
|
const slotAppContext = instance ? {
|
|
20
20
|
...instance.appContext,
|
|
@@ -33,17 +33,17 @@ const useAppTreeWrapper = (hy) => {
|
|
|
33
33
|
const selectFilterList = ref([]);
|
|
34
34
|
const loading = ref(true);
|
|
35
35
|
watch(
|
|
36
|
-
() =>
|
|
36
|
+
() => props.showCheckbox,
|
|
37
37
|
(newVal) => {
|
|
38
38
|
virtualTree?.setRowSelection({
|
|
39
|
-
type:
|
|
39
|
+
type: props.showCheckbox ? "checkbox" : "radio"
|
|
40
40
|
});
|
|
41
41
|
}
|
|
42
42
|
);
|
|
43
43
|
function getData(dataList) {
|
|
44
44
|
return new Promise((resolve) => {
|
|
45
45
|
hy.loading.value = true;
|
|
46
|
-
if (
|
|
46
|
+
if (props.disableSelection?.length) {
|
|
47
47
|
setDisAbleSelectionMap();
|
|
48
48
|
}
|
|
49
49
|
if (!virtualTree) {
|
|
@@ -59,9 +59,9 @@ const useAppTreeWrapper = (hy) => {
|
|
|
59
59
|
// 可视区域外的缓冲项数量
|
|
60
60
|
indent: 16,
|
|
61
61
|
emptyText: "\u6682\u65E0\u6570\u636E",
|
|
62
|
-
business:
|
|
62
|
+
business: props.treeType,
|
|
63
63
|
// 自定义整体的插槽
|
|
64
|
-
renderItem:
|
|
64
|
+
renderItem: props.treeType === treeTypeConfig.user ? (data, node) => setUserSlot(data, node) : setSlot("treeParentSlot"),
|
|
65
65
|
// // 自定义状态右侧插槽
|
|
66
66
|
renderRight: (data) => {
|
|
67
67
|
let renderRight = setSlot("renderRight");
|
|
@@ -87,9 +87,9 @@ const useAppTreeWrapper = (hy) => {
|
|
|
87
87
|
return true;
|
|
88
88
|
},
|
|
89
89
|
// // 自定义状态模块
|
|
90
|
-
renderStatus:
|
|
90
|
+
renderStatus: props.treeType === treeTypeConfig.device || props.treeType === treeTypeConfig.channel ? (data) => setRenderStatus(data) : null,
|
|
91
91
|
renderEmpty: () => {
|
|
92
|
-
if (!
|
|
92
|
+
if (!props.showCustomEmpty || hy.filterValue.value) return true;
|
|
93
93
|
let renderEmpty = setSlot("renderEmpty");
|
|
94
94
|
if (renderEmpty) {
|
|
95
95
|
const target = renderEmpty();
|
|
@@ -108,23 +108,23 @@ const useAppTreeWrapper = (hy) => {
|
|
|
108
108
|
}
|
|
109
109
|
return false;
|
|
110
110
|
},
|
|
111
|
-
...
|
|
111
|
+
...props.treeProps
|
|
112
112
|
},
|
|
113
113
|
rowSelection: {
|
|
114
|
-
type:
|
|
115
|
-
highlight:
|
|
116
|
-
checkStrictly:
|
|
114
|
+
type: props.showCheckbox ? "checkbox" : "radio",
|
|
115
|
+
highlight: props.highlight,
|
|
116
|
+
checkStrictly: props.checkStrictly,
|
|
117
117
|
// 是否显示选项 showSinglebox 单选为true时部门不显示其他节点显示选择框
|
|
118
118
|
showSelect: (data) => {
|
|
119
119
|
if (data.dataType === 1) {
|
|
120
|
-
return
|
|
120
|
+
return props.showCheckbox;
|
|
121
121
|
}
|
|
122
|
-
return
|
|
122
|
+
return props.showCheckbox || props.showSinglebox;
|
|
123
123
|
},
|
|
124
124
|
// 单选时是否可以取消选择
|
|
125
|
-
cancelable:
|
|
125
|
+
cancelable: props.cancelable,
|
|
126
126
|
// 是否显示多选框或单选框
|
|
127
|
-
showSelectBox:
|
|
127
|
+
showSelectBox: props.showSelectBox,
|
|
128
128
|
// 选中回调
|
|
129
129
|
onCheckChange: (data, info, checked) => {
|
|
130
130
|
console.log("onCheckChange", info);
|
|
@@ -147,37 +147,41 @@ const useAppTreeWrapper = (hy) => {
|
|
|
147
147
|
}
|
|
148
148
|
},
|
|
149
149
|
// 是否在点击节点的时候展开或者收缩节点
|
|
150
|
-
expandOnClickNode:
|
|
150
|
+
expandOnClickNode: props.expandOnClickNode,
|
|
151
151
|
// 是否在点击节点的时候选中节点
|
|
152
|
-
checkOnClickNode:
|
|
152
|
+
checkOnClickNode: props.checkOnClickNode,
|
|
153
153
|
// 点击叶节点(最后一个子节点)时是否检查或取消节点
|
|
154
|
-
checkOnClickLeaf:
|
|
154
|
+
checkOnClickLeaf: props.checkOnClickLeaf,
|
|
155
155
|
// 双击父节点会触发选中功能
|
|
156
|
-
checkOnDblclickParentNode:
|
|
156
|
+
checkOnDblclickParentNode: props.checkOnDblclickParentNode,
|
|
157
157
|
// 筛选方法
|
|
158
158
|
filterMethod: ({ filterValue: filterValue2 }, data) => {
|
|
159
159
|
let isFilter = true;
|
|
160
|
-
|
|
161
|
-
|
|
160
|
+
console.log("111111111", isFilter, props.filterMethod);
|
|
161
|
+
if (props.filterMethod) {
|
|
162
|
+
isFilter = props.filterMethod(data, {
|
|
163
|
+
filterValue: filterValue2
|
|
164
|
+
});
|
|
162
165
|
}
|
|
163
166
|
if (filterValue2) {
|
|
164
167
|
isFilter = isFilter && !!filterNodeMethod(data, filterValue2, {
|
|
165
|
-
treeFilterParam:
|
|
168
|
+
treeFilterParam: props.treeFilterParam,
|
|
169
|
+
treeType: props.treeType
|
|
166
170
|
});
|
|
167
171
|
}
|
|
168
172
|
return isFilter;
|
|
169
173
|
},
|
|
170
174
|
businessConfig: {
|
|
171
175
|
// 是否开启按在线离线状态排序
|
|
172
|
-
sortByStatus:
|
|
176
|
+
sortByStatus: props.deviceOrderSort,
|
|
173
177
|
// 是否只显示在线设备
|
|
174
|
-
showOnlineState:
|
|
178
|
+
showOnlineState: props.showOnlineOnly,
|
|
175
179
|
// 是否清空没有业务项（设备、用户、采集器）的部门和群组
|
|
176
|
-
clearEmptyBusiness:
|
|
180
|
+
clearEmptyBusiness: props.clearEmptyBusiness,
|
|
177
181
|
// 是否显示通道节点的选择框
|
|
178
|
-
isShowChannelSelect:
|
|
182
|
+
isShowChannelSelect: props.isShowChannelSelect,
|
|
179
183
|
// 初始化过滤数据
|
|
180
|
-
filterConfig:
|
|
184
|
+
filterConfig: props.filterConfig
|
|
181
185
|
},
|
|
182
186
|
// 初始化时处理数据，想回显必须return值，若想要过滤，可不return
|
|
183
187
|
handleMethod: (data) => {
|
|
@@ -198,7 +202,7 @@ const useAppTreeWrapper = (hy) => {
|
|
|
198
202
|
},
|
|
199
203
|
// 双击事件
|
|
200
204
|
onNodeDblClick: (data, node, event) => {
|
|
201
|
-
if (
|
|
205
|
+
if (props.treeType !== "channel") {
|
|
202
206
|
emits("on-dblclick", [{ ...data }]);
|
|
203
207
|
} else {
|
|
204
208
|
if (data.channelId) {
|
|
@@ -238,13 +242,13 @@ const useAppTreeWrapper = (hy) => {
|
|
|
238
242
|
document.body.click();
|
|
239
243
|
},
|
|
240
244
|
onLoad: () => {
|
|
241
|
-
if (
|
|
245
|
+
if (props.showOnlineOnly && !virtualTree._flattenTree?.length && !hy.filterValue.value) {
|
|
242
246
|
ElMessage.warning("\u6682\u65E0\u8BBE\u5907\u5904\u4E8E\u5728\u7EBF\u72B6\u6001");
|
|
243
247
|
}
|
|
244
|
-
if (
|
|
248
|
+
if (props.defaultSelectedOrgID && props.showCheckbox && props.treeType === "device") {
|
|
245
249
|
setSelectedOrg(dataList);
|
|
246
|
-
} else if (
|
|
247
|
-
setCheckedKeys(
|
|
250
|
+
} else if (props.selectedByDefault?.length) {
|
|
251
|
+
setCheckedKeys(props.selectedByDefault);
|
|
248
252
|
}
|
|
249
253
|
if (hy.filterValue.value) {
|
|
250
254
|
getFilterValue();
|
|
@@ -260,13 +264,13 @@ const useAppTreeWrapper = (hy) => {
|
|
|
260
264
|
{
|
|
261
265
|
data: dataList,
|
|
262
266
|
businessConfig: {
|
|
263
|
-
sortByStatus:
|
|
264
|
-
showOnlineState:
|
|
265
|
-
clearEmptyBusiness:
|
|
267
|
+
sortByStatus: props.deviceOrderSort,
|
|
268
|
+
showOnlineState: props.showOnlineOnly,
|
|
269
|
+
clearEmptyBusiness: props.clearEmptyBusiness
|
|
266
270
|
}
|
|
267
271
|
},
|
|
268
272
|
() => {
|
|
269
|
-
if (
|
|
273
|
+
if (props.showOnlineOnly && !virtualTree._flattenTree?.length && !hy.filterValue.value) {
|
|
270
274
|
ElMessage.success("\u6682\u65E0\u8BBE\u5907\u5904\u4E8E\u5728\u7EBF\u72B6\u6001");
|
|
271
275
|
}
|
|
272
276
|
if (hy.filterValue.value) {
|
|
@@ -283,7 +287,7 @@ const useAppTreeWrapper = (hy) => {
|
|
|
283
287
|
}
|
|
284
288
|
function setEmpty() {
|
|
285
289
|
let content = ``;
|
|
286
|
-
if (!
|
|
290
|
+
if (!props.showOnlineOnly) {
|
|
287
291
|
setTimeout(() => {
|
|
288
292
|
if (hy.addDeviceDom.value) {
|
|
289
293
|
hy.addDeviceDom.value.removeEventListener("click", addDevice);
|
|
@@ -312,7 +316,7 @@ const useAppTreeWrapper = (hy) => {
|
|
|
312
316
|
}
|
|
313
317
|
function setDisAbleSelectionMap() {
|
|
314
318
|
const map = /* @__PURE__ */ new Map();
|
|
315
|
-
|
|
319
|
+
props.disableSelection.forEach((v) => {
|
|
316
320
|
map.set(v.id, true);
|
|
317
321
|
});
|
|
318
322
|
hy.disableSelectionMap.value = map;
|
|
@@ -336,7 +340,7 @@ const useAppTreeWrapper = (hy) => {
|
|
|
336
340
|
container.style.display = "flex";
|
|
337
341
|
container.style.width = "100%";
|
|
338
342
|
const dutyHtml = `<div class="flex treeDeviceBox">
|
|
339
|
-
${
|
|
343
|
+
${props.getDutyRoster === 1 && data.rosterContent ? `<span class="w-[22px] h-[22px] text-xs rounded border box-border text-main flex justify-center items-center mr-1"
|
|
340
344
|
style="border-color: ${data.rosterContentColor};background-color: ${data.rosterContentColor}70;">
|
|
341
345
|
${data.rosterContentSimple}
|
|
342
346
|
</span>` : ""}
|
|
@@ -372,7 +376,6 @@ const useAppTreeWrapper = (hy) => {
|
|
|
372
376
|
return true;
|
|
373
377
|
}
|
|
374
378
|
function setSlot(slotName) {
|
|
375
|
-
console.log(slots, slotName);
|
|
376
379
|
if (!slotName || !slots[slotName]) return null;
|
|
377
380
|
return (data, node) => {
|
|
378
381
|
let container = document.createElement("div");
|
|
@@ -416,13 +419,13 @@ const useAppTreeWrapper = (hy) => {
|
|
|
416
419
|
virtualTree?.updateData([payload]);
|
|
417
420
|
}
|
|
418
421
|
function singleRemovalFn(row, isForce = false) {
|
|
419
|
-
if (
|
|
422
|
+
if (props.treeType === "device" || props.treeType === "channel") {
|
|
420
423
|
virtualTree.setChecked(row.channelId || row.deviceId, false, true);
|
|
421
|
-
} else if (
|
|
424
|
+
} else if (props.treeType) {
|
|
422
425
|
virtualTree.setChecked(row.id, false, true, isForce);
|
|
423
|
-
} else if (!
|
|
426
|
+
} else if (!props.treeType && props.treeProps) {
|
|
424
427
|
virtualTree.setChecked(
|
|
425
|
-
row[`${
|
|
428
|
+
row[`${props.treeProps.value}`],
|
|
426
429
|
false,
|
|
427
430
|
true,
|
|
428
431
|
isForce
|
|
@@ -430,30 +433,30 @@ const useAppTreeWrapper = (hy) => {
|
|
|
430
433
|
}
|
|
431
434
|
}
|
|
432
435
|
function setCheckedKeys(dataList, isForce = false) {
|
|
433
|
-
if (
|
|
436
|
+
if (props.treeType === "device" || props.treeType === "channel") {
|
|
434
437
|
virtualTree?.setCheckedKeys(
|
|
435
438
|
dataList.map((v) => v.channelId || v.deviceId),
|
|
436
439
|
true,
|
|
437
440
|
isForce
|
|
438
441
|
);
|
|
439
|
-
} else if (
|
|
442
|
+
} else if (props.treeType) {
|
|
440
443
|
virtualTree?.setCheckedKeys(
|
|
441
444
|
dataList.map((v) => v.id),
|
|
442
445
|
true,
|
|
443
446
|
isForce
|
|
444
447
|
);
|
|
445
|
-
} else if (!
|
|
448
|
+
} else if (!props.treeType && props.treeProps) {
|
|
446
449
|
console.log(
|
|
447
450
|
"\u9009\u4E2D\u56DE\u8C03",
|
|
448
|
-
dataList.map((v) => v[`${
|
|
451
|
+
dataList.map((v) => v[`${props.treeProps.value}`])
|
|
449
452
|
);
|
|
450
453
|
virtualTree?.setCheckedKeys(
|
|
451
|
-
dataList.map((v) => v[`${
|
|
454
|
+
dataList.map((v) => v[`${props.treeProps.value}`]),
|
|
452
455
|
false,
|
|
453
456
|
isForce
|
|
454
457
|
);
|
|
455
458
|
}
|
|
456
|
-
if (
|
|
459
|
+
if (props.isBackDefaultSelected) {
|
|
457
460
|
setTimeout(() => {
|
|
458
461
|
const deviceList = virtualTree?.getCheckedBusinessNodes(true) || [];
|
|
459
462
|
emits("on-selectedDataList", deviceList);
|
|
@@ -461,17 +464,17 @@ const useAppTreeWrapper = (hy) => {
|
|
|
461
464
|
}
|
|
462
465
|
}
|
|
463
466
|
function setChecked(data, type) {
|
|
464
|
-
if (
|
|
467
|
+
if (props.treeType === "device") {
|
|
465
468
|
virtualTree?.setChecked(data.channelId || data.deviceId, type, true);
|
|
466
|
-
} else if (
|
|
469
|
+
} else if (props.treeType) {
|
|
467
470
|
virtualTree?.setChecked(data.id, type, true);
|
|
468
|
-
} else if (!
|
|
469
|
-
virtualTree?.setChecked(data[`${
|
|
471
|
+
} else if (!props.treeType && props.treeProps) {
|
|
472
|
+
virtualTree?.setChecked(data[`${props.treeProps.value}`], type, true);
|
|
470
473
|
}
|
|
471
474
|
}
|
|
472
475
|
function setSelectedOrg(deviceList) {
|
|
473
476
|
for (let i = 0; i < deviceList.length; i++) {
|
|
474
|
-
if (
|
|
477
|
+
if (props.defaultSelectedOrgID === deviceList[i].id) {
|
|
475
478
|
if (deviceList[i].deviceList?.length) {
|
|
476
479
|
setCheckedKeys(deviceList[i].deviceList);
|
|
477
480
|
}
|
|
@@ -484,19 +487,19 @@ const useAppTreeWrapper = (hy) => {
|
|
|
484
487
|
}
|
|
485
488
|
}
|
|
486
489
|
function getSelectedDataList(leafOnly = false) {
|
|
487
|
-
if (
|
|
490
|
+
if (props.treeType) {
|
|
488
491
|
return virtualTree?.getCheckedBusinessNodes(leafOnly) || [];
|
|
489
492
|
}
|
|
490
493
|
return virtualTree?.getCheckedNodes(leafOnly) || [];
|
|
491
494
|
}
|
|
492
495
|
function setFilterListType(type) {
|
|
493
|
-
if (
|
|
496
|
+
if (props.selectFilterList?.length) {
|
|
494
497
|
hy.selectFilterList.value = JSON.parse(
|
|
495
|
-
JSON.stringify(
|
|
498
|
+
JSON.stringify(props.selectFilterList)
|
|
496
499
|
);
|
|
497
500
|
return;
|
|
498
501
|
}
|
|
499
|
-
if (
|
|
502
|
+
if (props.treeType === "device") {
|
|
500
503
|
hy.selectFilterList.value = [
|
|
501
504
|
{
|
|
502
505
|
label: "\u5168\u90E8",
|
|
@@ -514,7 +517,7 @@ const useAppTreeWrapper = (hy) => {
|
|
|
514
517
|
placeholder: "\u8BBE\u5907\u53F7\u3001\u8BBE\u5907\u540D\u79F0\u8FDB\u884C\u7B5B\u9009"
|
|
515
518
|
}
|
|
516
519
|
];
|
|
517
|
-
} else if (
|
|
520
|
+
} else if (props.treeType === "user") {
|
|
518
521
|
hy.selectFilterList.value = [
|
|
519
522
|
{
|
|
520
523
|
label: "\u5168\u90E8",
|
|
@@ -574,13 +577,13 @@ const useAppTreeWrapper = (hy) => {
|
|
|
574
577
|
getNode
|
|
575
578
|
};
|
|
576
579
|
};
|
|
577
|
-
function filterNodeMethod(data, value, { selectFilterType, treeFilterParam = [] }) {
|
|
580
|
+
function filterNodeMethod(data, value, { selectFilterType, treeFilterParam = [], treeType }) {
|
|
578
581
|
let type = data.dataType;
|
|
579
582
|
if (selectFilterType) type = selectFilterType;
|
|
580
583
|
const includesValue = (field) => {
|
|
581
584
|
return field && field.toString().includes(value.toString());
|
|
582
585
|
};
|
|
583
|
-
if (!
|
|
586
|
+
if (!treeType) {
|
|
584
587
|
let filterType = false;
|
|
585
588
|
for (let i = 0; i < treeFilterParam.length; i++) {
|
|
586
589
|
const item = treeFilterParam[i];
|
package/es/version.mjs
CHANGED
|
@@ -16,7 +16,7 @@ const deviceStatus = {
|
|
|
16
16
|
1: "\u5728\u7EBF"
|
|
17
17
|
};
|
|
18
18
|
const useAppTreeWrapper = (hy) => {
|
|
19
|
-
const { props
|
|
19
|
+
const { props, emits, slots, treeRef, VirtualTree } = hy;
|
|
20
20
|
const instance = vue.getCurrentInstance();
|
|
21
21
|
const slotAppContext = instance ? {
|
|
22
22
|
...instance.appContext,
|
|
@@ -35,17 +35,17 @@ const useAppTreeWrapper = (hy) => {
|
|
|
35
35
|
const selectFilterList = vue.ref([]);
|
|
36
36
|
const loading = vue.ref(true);
|
|
37
37
|
vue.watch(
|
|
38
|
-
() =>
|
|
38
|
+
() => props.showCheckbox,
|
|
39
39
|
(newVal) => {
|
|
40
40
|
virtualTree?.setRowSelection({
|
|
41
|
-
type:
|
|
41
|
+
type: props.showCheckbox ? "checkbox" : "radio"
|
|
42
42
|
});
|
|
43
43
|
}
|
|
44
44
|
);
|
|
45
45
|
function getData(dataList) {
|
|
46
46
|
return new Promise((resolve) => {
|
|
47
47
|
hy.loading.value = true;
|
|
48
|
-
if (
|
|
48
|
+
if (props.disableSelection?.length) {
|
|
49
49
|
setDisAbleSelectionMap();
|
|
50
50
|
}
|
|
51
51
|
if (!virtualTree) {
|
|
@@ -61,9 +61,9 @@ const useAppTreeWrapper = (hy) => {
|
|
|
61
61
|
// 可视区域外的缓冲项数量
|
|
62
62
|
indent: 16,
|
|
63
63
|
emptyText: "\u6682\u65E0\u6570\u636E",
|
|
64
|
-
business:
|
|
64
|
+
business: props.treeType,
|
|
65
65
|
// 自定义整体的插槽
|
|
66
|
-
renderItem:
|
|
66
|
+
renderItem: props.treeType === treeConfig.treeTypeConfig.user ? (data, node) => setUserSlot(data, node) : setSlot("treeParentSlot"),
|
|
67
67
|
// // 自定义状态右侧插槽
|
|
68
68
|
renderRight: (data) => {
|
|
69
69
|
let renderRight = setSlot("renderRight");
|
|
@@ -89,9 +89,9 @@ const useAppTreeWrapper = (hy) => {
|
|
|
89
89
|
return true;
|
|
90
90
|
},
|
|
91
91
|
// // 自定义状态模块
|
|
92
|
-
renderStatus:
|
|
92
|
+
renderStatus: props.treeType === treeConfig.treeTypeConfig.device || props.treeType === treeConfig.treeTypeConfig.channel ? (data) => setRenderStatus(data) : null,
|
|
93
93
|
renderEmpty: () => {
|
|
94
|
-
if (!
|
|
94
|
+
if (!props.showCustomEmpty || hy.filterValue.value) return true;
|
|
95
95
|
let renderEmpty = setSlot("renderEmpty");
|
|
96
96
|
if (renderEmpty) {
|
|
97
97
|
const target = renderEmpty();
|
|
@@ -110,23 +110,23 @@ const useAppTreeWrapper = (hy) => {
|
|
|
110
110
|
}
|
|
111
111
|
return false;
|
|
112
112
|
},
|
|
113
|
-
...
|
|
113
|
+
...props.treeProps
|
|
114
114
|
},
|
|
115
115
|
rowSelection: {
|
|
116
|
-
type:
|
|
117
|
-
highlight:
|
|
118
|
-
checkStrictly:
|
|
116
|
+
type: props.showCheckbox ? "checkbox" : "radio",
|
|
117
|
+
highlight: props.highlight,
|
|
118
|
+
checkStrictly: props.checkStrictly,
|
|
119
119
|
// 是否显示选项 showSinglebox 单选为true时部门不显示其他节点显示选择框
|
|
120
120
|
showSelect: (data) => {
|
|
121
121
|
if (data.dataType === 1) {
|
|
122
|
-
return
|
|
122
|
+
return props.showCheckbox;
|
|
123
123
|
}
|
|
124
|
-
return
|
|
124
|
+
return props.showCheckbox || props.showSinglebox;
|
|
125
125
|
},
|
|
126
126
|
// 单选时是否可以取消选择
|
|
127
|
-
cancelable:
|
|
127
|
+
cancelable: props.cancelable,
|
|
128
128
|
// 是否显示多选框或单选框
|
|
129
|
-
showSelectBox:
|
|
129
|
+
showSelectBox: props.showSelectBox,
|
|
130
130
|
// 选中回调
|
|
131
131
|
onCheckChange: (data, info, checked) => {
|
|
132
132
|
console.log("onCheckChange", info);
|
|
@@ -149,37 +149,41 @@ const useAppTreeWrapper = (hy) => {
|
|
|
149
149
|
}
|
|
150
150
|
},
|
|
151
151
|
// 是否在点击节点的时候展开或者收缩节点
|
|
152
|
-
expandOnClickNode:
|
|
152
|
+
expandOnClickNode: props.expandOnClickNode,
|
|
153
153
|
// 是否在点击节点的时候选中节点
|
|
154
|
-
checkOnClickNode:
|
|
154
|
+
checkOnClickNode: props.checkOnClickNode,
|
|
155
155
|
// 点击叶节点(最后一个子节点)时是否检查或取消节点
|
|
156
|
-
checkOnClickLeaf:
|
|
156
|
+
checkOnClickLeaf: props.checkOnClickLeaf,
|
|
157
157
|
// 双击父节点会触发选中功能
|
|
158
|
-
checkOnDblclickParentNode:
|
|
158
|
+
checkOnDblclickParentNode: props.checkOnDblclickParentNode,
|
|
159
159
|
// 筛选方法
|
|
160
160
|
filterMethod: ({ filterValue: filterValue2 }, data) => {
|
|
161
161
|
let isFilter = true;
|
|
162
|
-
|
|
163
|
-
|
|
162
|
+
console.log("111111111", isFilter, props.filterMethod);
|
|
163
|
+
if (props.filterMethod) {
|
|
164
|
+
isFilter = props.filterMethod(data, {
|
|
165
|
+
filterValue: filterValue2
|
|
166
|
+
});
|
|
164
167
|
}
|
|
165
168
|
if (filterValue2) {
|
|
166
169
|
isFilter = isFilter && !!filterNodeMethod(data, filterValue2, {
|
|
167
|
-
treeFilterParam:
|
|
170
|
+
treeFilterParam: props.treeFilterParam,
|
|
171
|
+
treeType: props.treeType
|
|
168
172
|
});
|
|
169
173
|
}
|
|
170
174
|
return isFilter;
|
|
171
175
|
},
|
|
172
176
|
businessConfig: {
|
|
173
177
|
// 是否开启按在线离线状态排序
|
|
174
|
-
sortByStatus:
|
|
178
|
+
sortByStatus: props.deviceOrderSort,
|
|
175
179
|
// 是否只显示在线设备
|
|
176
|
-
showOnlineState:
|
|
180
|
+
showOnlineState: props.showOnlineOnly,
|
|
177
181
|
// 是否清空没有业务项（设备、用户、采集器）的部门和群组
|
|
178
|
-
clearEmptyBusiness:
|
|
182
|
+
clearEmptyBusiness: props.clearEmptyBusiness,
|
|
179
183
|
// 是否显示通道节点的选择框
|
|
180
|
-
isShowChannelSelect:
|
|
184
|
+
isShowChannelSelect: props.isShowChannelSelect,
|
|
181
185
|
// 初始化过滤数据
|
|
182
|
-
filterConfig:
|
|
186
|
+
filterConfig: props.filterConfig
|
|
183
187
|
},
|
|
184
188
|
// 初始化时处理数据，想回显必须return值，若想要过滤，可不return
|
|
185
189
|
handleMethod: (data) => {
|
|
@@ -200,7 +204,7 @@ const useAppTreeWrapper = (hy) => {
|
|
|
200
204
|
},
|
|
201
205
|
// 双击事件
|
|
202
206
|
onNodeDblClick: (data, node, event) => {
|
|
203
|
-
if (
|
|
207
|
+
if (props.treeType !== "channel") {
|
|
204
208
|
emits("on-dblclick", [{ ...data }]);
|
|
205
209
|
} else {
|
|
206
210
|
if (data.channelId) {
|
|
@@ -240,13 +244,13 @@ const useAppTreeWrapper = (hy) => {
|
|
|
240
244
|
document.body.click();
|
|
241
245
|
},
|
|
242
246
|
onLoad: () => {
|
|
243
|
-
if (
|
|
247
|
+
if (props.showOnlineOnly && !virtualTree._flattenTree?.length && !hy.filterValue.value) {
|
|
244
248
|
elementPlus.ElMessage.warning("\u6682\u65E0\u8BBE\u5907\u5904\u4E8E\u5728\u7EBF\u72B6\u6001");
|
|
245
249
|
}
|
|
246
|
-
if (
|
|
250
|
+
if (props.defaultSelectedOrgID && props.showCheckbox && props.treeType === "device") {
|
|
247
251
|
setSelectedOrg(dataList);
|
|
248
|
-
} else if (
|
|
249
|
-
setCheckedKeys(
|
|
252
|
+
} else if (props.selectedByDefault?.length) {
|
|
253
|
+
setCheckedKeys(props.selectedByDefault);
|
|
250
254
|
}
|
|
251
255
|
if (hy.filterValue.value) {
|
|
252
256
|
getFilterValue();
|
|
@@ -262,13 +266,13 @@ const useAppTreeWrapper = (hy) => {
|
|
|
262
266
|
{
|
|
263
267
|
data: dataList,
|
|
264
268
|
businessConfig: {
|
|
265
|
-
sortByStatus:
|
|
266
|
-
showOnlineState:
|
|
267
|
-
clearEmptyBusiness:
|
|
269
|
+
sortByStatus: props.deviceOrderSort,
|
|
270
|
+
showOnlineState: props.showOnlineOnly,
|
|
271
|
+
clearEmptyBusiness: props.clearEmptyBusiness
|
|
268
272
|
}
|
|
269
273
|
},
|
|
270
274
|
() => {
|
|
271
|
-
if (
|
|
275
|
+
if (props.showOnlineOnly && !virtualTree._flattenTree?.length && !hy.filterValue.value) {
|
|
272
276
|
elementPlus.ElMessage.success("\u6682\u65E0\u8BBE\u5907\u5904\u4E8E\u5728\u7EBF\u72B6\u6001");
|
|
273
277
|
}
|
|
274
278
|
if (hy.filterValue.value) {
|
|
@@ -285,7 +289,7 @@ const useAppTreeWrapper = (hy) => {
|
|
|
285
289
|
}
|
|
286
290
|
function setEmpty() {
|
|
287
291
|
let content = ``;
|
|
288
|
-
if (!
|
|
292
|
+
if (!props.showOnlineOnly) {
|
|
289
293
|
setTimeout(() => {
|
|
290
294
|
if (hy.addDeviceDom.value) {
|
|
291
295
|
hy.addDeviceDom.value.removeEventListener("click", addDevice);
|
|
@@ -314,7 +318,7 @@ const useAppTreeWrapper = (hy) => {
|
|
|
314
318
|
}
|
|
315
319
|
function setDisAbleSelectionMap() {
|
|
316
320
|
const map = /* @__PURE__ */ new Map();
|
|
317
|
-
|
|
321
|
+
props.disableSelection.forEach((v) => {
|
|
318
322
|
map.set(v.id, true);
|
|
319
323
|
});
|
|
320
324
|
hy.disableSelectionMap.value = map;
|
|
@@ -338,7 +342,7 @@ const useAppTreeWrapper = (hy) => {
|
|
|
338
342
|
container.style.display = "flex";
|
|
339
343
|
container.style.width = "100%";
|
|
340
344
|
const dutyHtml = `<div class="flex treeDeviceBox">
|
|
341
|
-
${
|
|
345
|
+
${props.getDutyRoster === 1 && data.rosterContent ? `<span class="w-[22px] h-[22px] text-xs rounded border box-border text-main flex justify-center items-center mr-1"
|
|
342
346
|
style="border-color: ${data.rosterContentColor};background-color: ${data.rosterContentColor}70;">
|
|
343
347
|
${data.rosterContentSimple}
|
|
344
348
|
</span>` : ""}
|
|
@@ -374,7 +378,6 @@ const useAppTreeWrapper = (hy) => {
|
|
|
374
378
|
return true;
|
|
375
379
|
}
|
|
376
380
|
function setSlot(slotName) {
|
|
377
|
-
console.log(slots, slotName);
|
|
378
381
|
if (!slotName || !slots[slotName]) return null;
|
|
379
382
|
return (data, node) => {
|
|
380
383
|
let container = document.createElement("div");
|
|
@@ -418,13 +421,13 @@ const useAppTreeWrapper = (hy) => {
|
|
|
418
421
|
virtualTree?.updateData([payload]);
|
|
419
422
|
}
|
|
420
423
|
function singleRemovalFn(row, isForce = false) {
|
|
421
|
-
if (
|
|
424
|
+
if (props.treeType === "device" || props.treeType === "channel") {
|
|
422
425
|
virtualTree.setChecked(row.channelId || row.deviceId, false, true);
|
|
423
|
-
} else if (
|
|
426
|
+
} else if (props.treeType) {
|
|
424
427
|
virtualTree.setChecked(row.id, false, true, isForce);
|
|
425
|
-
} else if (!
|
|
428
|
+
} else if (!props.treeType && props.treeProps) {
|
|
426
429
|
virtualTree.setChecked(
|
|
427
|
-
row[`${
|
|
430
|
+
row[`${props.treeProps.value}`],
|
|
428
431
|
false,
|
|
429
432
|
true,
|
|
430
433
|
isForce
|
|
@@ -432,30 +435,30 @@ const useAppTreeWrapper = (hy) => {
|
|
|
432
435
|
}
|
|
433
436
|
}
|
|
434
437
|
function setCheckedKeys(dataList, isForce = false) {
|
|
435
|
-
if (
|
|
438
|
+
if (props.treeType === "device" || props.treeType === "channel") {
|
|
436
439
|
virtualTree?.setCheckedKeys(
|
|
437
440
|
dataList.map((v) => v.channelId || v.deviceId),
|
|
438
441
|
true,
|
|
439
442
|
isForce
|
|
440
443
|
);
|
|
441
|
-
} else if (
|
|
444
|
+
} else if (props.treeType) {
|
|
442
445
|
virtualTree?.setCheckedKeys(
|
|
443
446
|
dataList.map((v) => v.id),
|
|
444
447
|
true,
|
|
445
448
|
isForce
|
|
446
449
|
);
|
|
447
|
-
} else if (!
|
|
450
|
+
} else if (!props.treeType && props.treeProps) {
|
|
448
451
|
console.log(
|
|
449
452
|
"\u9009\u4E2D\u56DE\u8C03",
|
|
450
|
-
dataList.map((v) => v[`${
|
|
453
|
+
dataList.map((v) => v[`${props.treeProps.value}`])
|
|
451
454
|
);
|
|
452
455
|
virtualTree?.setCheckedKeys(
|
|
453
|
-
dataList.map((v) => v[`${
|
|
456
|
+
dataList.map((v) => v[`${props.treeProps.value}`]),
|
|
454
457
|
false,
|
|
455
458
|
isForce
|
|
456
459
|
);
|
|
457
460
|
}
|
|
458
|
-
if (
|
|
461
|
+
if (props.isBackDefaultSelected) {
|
|
459
462
|
setTimeout(() => {
|
|
460
463
|
const deviceList = virtualTree?.getCheckedBusinessNodes(true) || [];
|
|
461
464
|
emits("on-selectedDataList", deviceList);
|
|
@@ -463,17 +466,17 @@ const useAppTreeWrapper = (hy) => {
|
|
|
463
466
|
}
|
|
464
467
|
}
|
|
465
468
|
function setChecked(data, type) {
|
|
466
|
-
if (
|
|
469
|
+
if (props.treeType === "device") {
|
|
467
470
|
virtualTree?.setChecked(data.channelId || data.deviceId, type, true);
|
|
468
|
-
} else if (
|
|
471
|
+
} else if (props.treeType) {
|
|
469
472
|
virtualTree?.setChecked(data.id, type, true);
|
|
470
|
-
} else if (!
|
|
471
|
-
virtualTree?.setChecked(data[`${
|
|
473
|
+
} else if (!props.treeType && props.treeProps) {
|
|
474
|
+
virtualTree?.setChecked(data[`${props.treeProps.value}`], type, true);
|
|
472
475
|
}
|
|
473
476
|
}
|
|
474
477
|
function setSelectedOrg(deviceList) {
|
|
475
478
|
for (let i = 0; i < deviceList.length; i++) {
|
|
476
|
-
if (
|
|
479
|
+
if (props.defaultSelectedOrgID === deviceList[i].id) {
|
|
477
480
|
if (deviceList[i].deviceList?.length) {
|
|
478
481
|
setCheckedKeys(deviceList[i].deviceList);
|
|
479
482
|
}
|
|
@@ -486,19 +489,19 @@ const useAppTreeWrapper = (hy) => {
|
|
|
486
489
|
}
|
|
487
490
|
}
|
|
488
491
|
function getSelectedDataList(leafOnly = false) {
|
|
489
|
-
if (
|
|
492
|
+
if (props.treeType) {
|
|
490
493
|
return virtualTree?.getCheckedBusinessNodes(leafOnly) || [];
|
|
491
494
|
}
|
|
492
495
|
return virtualTree?.getCheckedNodes(leafOnly) || [];
|
|
493
496
|
}
|
|
494
497
|
function setFilterListType(type) {
|
|
495
|
-
if (
|
|
498
|
+
if (props.selectFilterList?.length) {
|
|
496
499
|
hy.selectFilterList.value = JSON.parse(
|
|
497
|
-
JSON.stringify(
|
|
500
|
+
JSON.stringify(props.selectFilterList)
|
|
498
501
|
);
|
|
499
502
|
return;
|
|
500
503
|
}
|
|
501
|
-
if (
|
|
504
|
+
if (props.treeType === "device") {
|
|
502
505
|
hy.selectFilterList.value = [
|
|
503
506
|
{
|
|
504
507
|
label: "\u5168\u90E8",
|
|
@@ -516,7 +519,7 @@ const useAppTreeWrapper = (hy) => {
|
|
|
516
519
|
placeholder: "\u8BBE\u5907\u53F7\u3001\u8BBE\u5907\u540D\u79F0\u8FDB\u884C\u7B5B\u9009"
|
|
517
520
|
}
|
|
518
521
|
];
|
|
519
|
-
} else if (
|
|
522
|
+
} else if (props.treeType === "user") {
|
|
520
523
|
hy.selectFilterList.value = [
|
|
521
524
|
{
|
|
522
525
|
label: "\u5168\u90E8",
|
|
@@ -576,13 +579,13 @@ const useAppTreeWrapper = (hy) => {
|
|
|
576
579
|
getNode
|
|
577
580
|
};
|
|
578
581
|
};
|
|
579
|
-
function filterNodeMethod(data, value, { selectFilterType, treeFilterParam = [] }) {
|
|
582
|
+
function filterNodeMethod(data, value, { selectFilterType, treeFilterParam = [], treeType }) {
|
|
580
583
|
let type = data.dataType;
|
|
581
584
|
if (selectFilterType) type = selectFilterType;
|
|
582
585
|
const includesValue = (field) => {
|
|
583
586
|
return field && field.toString().includes(value.toString());
|
|
584
587
|
};
|
|
585
|
-
if (!
|
|
588
|
+
if (!treeType) {
|
|
586
589
|
let filterType = false;
|
|
587
590
|
for (let i = 0; i < treeFilterParam.length; i++) {
|
|
588
591
|
const item = treeFilterParam[i];
|
package/lib/version.js
CHANGED