fangguo-component 1.1.2 → 1.1.4
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.
- package/dist/ArgHover.css +20 -1
- package/dist/ArgHover.vue_vue_type_style_index_0_lang-CSymSDRl.js +56 -0
- package/dist/ButtonGroup-DqViorHX.js +134 -0
- package/dist/ButtonGroup.css +35 -1
- package/dist/CitySelect.vue_vue_type_script_setup_true_lang-DZp6834K.js +224 -0
- package/dist/ContentTitle-By0Zk1u7.js +30 -0
- package/dist/ContentTitle.css +6 -1
- package/dist/CustomInputV2-BqhBSO53.js +157 -0
- package/dist/CustomInputV2.css +5 -1
- package/dist/CustomMultipleInput-DRMTUtkE.js +125 -0
- package/dist/CustomMultipleInput.css +8 -1
- package/dist/DragResizable.css +126 -1
- package/dist/DragResizable.vue_vue_type_style_index_0_lang-BePpQHve.js +331 -0
- package/dist/DragSort-5WetnkmW.js +98 -0
- package/dist/DragSort.css +5 -1
- package/dist/ErrorImage-Ao9kEEUg.js +36 -0
- package/dist/ErrorImage.css +4 -1
- package/dist/FgCascader.css +37 -1
- package/dist/FgCascader.vue_vue_type_style_index_0_lang-CM8FxFLJ.js +2424 -0
- package/dist/HSelect-BFkWiCFi.js +671 -0
- package/dist/HSelect.css +80 -1
- package/dist/HSelectAll.vue_vue_type_script_setup_true_lang-BZX7ch2I.js +50 -0
- package/dist/HSelectSJ-DZmtdyjF.js +671 -0
- package/dist/HSelectSJ.css +88 -1
- package/dist/IdentifyAddress.vue_vue_type_script_setup_true_lang-BCIOF-Oy.js +5202 -0
- package/dist/ImageLoupe.vue_vue_type_script_setup_true_lang-BaXHYlDu.js +92 -0
- package/dist/LazyComponent.vue_vue_type_script_setup_true_lang-D5KGqlj4.js +107 -0
- package/dist/LazyPopover.vue_vue_type_script_setup_true_lang-B2vtU4f4.js +34 -0
- package/dist/LoadingBtn-DWm2cY9k.js +87 -0
- package/dist/LoadingBtn.css +12 -1
- package/dist/MInput-s_P63myh.js +114 -0
- package/dist/MInput.css +21 -1
- package/dist/MyTable-CHvxPYgk.js +94 -0
- package/dist/MyTable.css +33 -1
- package/dist/NoRender.vue_vue_type_script_setup_true_lang-B0G6jxPg.js +31 -0
- package/dist/SelectAddress-CCepDxu8.js +254 -0
- package/dist/SelectAddress.css +18 -1
- package/dist/SelectAll.vue_vue_type_script_setup_true_lang-CyzY8ams.js +101 -0
- package/dist/SelectAll2.vue_vue_type_script_setup_true_lang-CrsaohxU.js +103 -0
- package/dist/SelectCustomAll.css +8 -1
- package/dist/SelectCustomAll.vue_vue_type_style_index_0_lang-BEZwlGXa.js +111 -0
- package/dist/SelectTimePicker.vue_vue_type_script_setup_true_lang-Dk4TpTBN.js +48 -0
- package/dist/SelectTree-DHbWogEU.js +1276 -0
- package/dist/SelectTree.css +74 -1
- package/dist/SvgIcon-DIg0upEk.js +33 -0
- package/dist/TextCopy-th0FAxwl.js +44 -0
- package/dist/TextCopy.css +7 -1
- package/dist/TextEllipsisTooltip.vue_vue_type_script_setup_true_lang-DVE1CxPm.js +174 -0
- package/dist/VirtualTable-Cm_L7q9W.js +703 -0
- package/dist/VirtualTable.css +185 -1
- package/dist/_commonjsHelpers-DnzVkjQg.js +38 -0
- package/dist/_plugin-vue_export-helper-1tPrXgE0.js +10 -0
- package/dist/common-B1nSpTGn.js +9669 -0
- package/dist/components/VirtualTable/index.js +2 -2
- package/dist/components/argHover/index.js +2 -2
- package/dist/components/buttonGroup/index.js +2 -2
- package/dist/components/cascader/index.js +2 -2
- package/dist/components/citySelect/index.js +2 -2
- package/dist/components/contentTitle/index.js +2 -2
- package/dist/components/customInputV2/index.js +2 -2
- package/dist/components/customMultipleInput/index.js +2 -2
- package/dist/components/dragResizable/index.js +2 -2
- package/dist/components/dragSort/index.js +2 -2
- package/dist/components/errorImage/index.js +2 -2
- package/dist/components/hSelect/index.js +2 -2
- package/dist/components/hSelectAll/index.js +2 -2
- package/dist/components/hSelectSJ/index.js +2 -2
- package/dist/components/identifyAddress/index.js +2 -2
- package/dist/components/imageLoupe/index.js +2 -2
- package/dist/components/index.js +62 -62
- package/dist/components/lazyComponent/index.js +2 -2
- package/dist/components/lazyPopover/index.js +2 -2
- package/dist/components/loadingBtn/index.js +2 -2
- package/dist/components/mInput/index.js +2 -2
- package/dist/components/myTable/index.js +2 -2
- package/dist/components/noRender/index.js +2 -2
- package/dist/components/selectAddress/index.js +2 -2
- package/dist/components/selectAll/index.js +2 -2
- package/dist/components/selectAll2/index.js +2 -2
- package/dist/components/selectCustomAll/index.js +2 -2
- package/dist/components/selectTimePicker/index.js +2 -2
- package/dist/components/selectTree/index.js +2 -2
- package/dist/components/svgIcon/index.js +2 -2
- package/dist/components/textCopy/index.js +2 -2
- package/dist/components/textEllipsisTooltip/index.js +2 -2
- package/dist/dateShortcuts-DjFC_Txu.js +27 -0
- package/dist/directive/index.js +2 -2
- package/dist/directive/loading/index.js +2 -2
- package/dist/hooks/index.js +2 -2
- package/dist/hooks/usePagination/index.js +2 -2
- package/dist/index-BPnixsfc.js +103 -0
- package/dist/index-C9zyi90j.js +165 -0
- package/dist/index-CSMWzzp0.js +8 -0
- package/dist/index-DfQiknXJ.js +8 -0
- package/dist/index-DzdLpetc.js +29184 -0
- package/dist/index-uQXqC9BF.js +68 -0
- package/dist/index.css +1 -1
- package/dist/index.js +204 -194
- package/dist/loading-CGrVcnNl.js +47 -0
- package/dist/loading.css +110 -1
- package/dist/tools/ImageParserUtils/index.js +17239 -9074
- package/dist/tools/common/index.js +86 -86
- package/dist/tools/index.js +95 -95
- package/dist/usePagination-C63IRXjZ.js +29 -0
- package/dist/vue-virtual-scroller.esm-ZgBoGAjX.js +1507 -0
- package/package.json +1 -1
- package/dist/ArgHover.vue_vue_type_style_index_0_lang-CMhRP09M.js +0 -54
- package/dist/ButtonGroup-C0yZEkxK.js +0 -103
- package/dist/CitySelect.vue_vue_type_script_setup_true_lang-8EbHD3Nt.js +0 -159
- package/dist/ContentTitle-mqrusLjx.js +0 -24
- package/dist/CustomInputV2-uARhbFc8.js +0 -135
- package/dist/CustomMultipleInput-DDaqoHVU.js +0 -109
- package/dist/DragResizable.vue_vue_type_style_index_0_lang-CHv0gJmo.js +0 -179
- package/dist/DragSort-CfDeFAIG.js +0 -66
- package/dist/ErrorImage-CTP_5sal.js +0 -32
- package/dist/FgCascader.vue_vue_type_style_index_0_lang-BUZDDcVn.js +0 -1656
- package/dist/HSelect-Drf6YBwO.js +0 -468
- package/dist/HSelectAll.vue_vue_type_script_setup_true_lang-Blq9xpfa.js +0 -36
- package/dist/HSelectSJ-D3GrXmvj.js +0 -462
- package/dist/IdentifyAddress.vue_vue_type_script_setup_true_lang-BJheMI1q.js +0 -4743
- package/dist/ImageLoupe.vue_vue_type_script_setup_true_lang-BlX4VbRi.js +0 -79
- package/dist/LazyComponent.vue_vue_type_script_setup_true_lang-vNk68D8E.js +0 -82
- package/dist/LazyPopover.vue_vue_type_script_setup_true_lang-DcOrcH0T.js +0 -33
- package/dist/LoadingBtn-BhbhNboo.js +0 -66
- package/dist/MInput-CpoW17Wh.js +0 -101
- package/dist/MyTable-DmwyEVJb.js +0 -68
- package/dist/NoRender.vue_vue_type_script_setup_true_lang-Do36nSsV.js +0 -30
- package/dist/SelectAddress-B4oK5erq.js +0 -173
- package/dist/SelectAll.vue_vue_type_script_setup_true_lang-BC3q2U8f.js +0 -79
- package/dist/SelectAll2.vue_vue_type_script_setup_true_lang-CaET5eli.js +0 -74
- package/dist/SelectCustomAll.vue_vue_type_style_index_0_lang-_wCRO217.js +0 -83
- package/dist/SelectTimePicker.vue_vue_type_script_setup_true_lang-Bj0KMOKv.js +0 -45
- package/dist/SelectTree-Dm5259kY.js +0 -911
- package/dist/SvgIcon-C2ah8E0Z.js +0 -30
- package/dist/TextCopy-hOj-Wj2H.js +0 -41
- package/dist/TextEllipsisTooltip.vue_vue_type_script_setup_true_lang-aZbEQmbM.js +0 -112
- package/dist/VirtualTable-BWugJiQ5.js +0 -349
- package/dist/_commonjsHelpers-ByYUsBRP.js +0 -33
- package/dist/_plugin-vue_export-helper-CHgC5LLL.js +0 -9
- package/dist/common-BIEgCXbl.js +0 -7030
- package/dist/dateShortcuts-DDPtAhDI.js +0 -26
- package/dist/index-BRcBDlVs.js +0 -68
- package/dist/index-CeWudY6u.js +0 -8
- package/dist/index-DIX8TpoT.js +0 -118
- package/dist/index-DpPsTMp0.js +0 -8
- package/dist/index-epuVZjZV.js +0 -103
- package/dist/index-uf7oyYDF.js +0 -16847
- package/dist/loading-DJVNc0eN.js +0 -36
- package/dist/usePagination-CwShBEjA.js +0 -20
- package/dist/vue-virtual-scroller.esm-CH-jx4ri.js +0 -1051
|
@@ -0,0 +1,2424 @@
|
|
|
1
|
+
import './FgCascader.css';var __defProp = Object.defineProperty;
|
|
2
|
+
var __defProps = Object.defineProperties;
|
|
3
|
+
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
4
|
+
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
5
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
+
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
7
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
8
|
+
var __spreadValues = (a, b) => {
|
|
9
|
+
for (var prop in b || (b = {}))
|
|
10
|
+
if (__hasOwnProp.call(b, prop))
|
|
11
|
+
__defNormalProp(a, prop, b[prop]);
|
|
12
|
+
if (__getOwnPropSymbols)
|
|
13
|
+
for (var prop of __getOwnPropSymbols(b)) {
|
|
14
|
+
if (__propIsEnum.call(b, prop))
|
|
15
|
+
__defNormalProp(a, prop, b[prop]);
|
|
16
|
+
}
|
|
17
|
+
return a;
|
|
18
|
+
};
|
|
19
|
+
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
20
|
+
var __objRest = (source, exclude) => {
|
|
21
|
+
var target = {};
|
|
22
|
+
for (var prop in source)
|
|
23
|
+
if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
|
|
24
|
+
target[prop] = source[prop];
|
|
25
|
+
if (source != null && __getOwnPropSymbols)
|
|
26
|
+
for (var prop of __getOwnPropSymbols(source)) {
|
|
27
|
+
if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
|
|
28
|
+
target[prop] = source[prop];
|
|
29
|
+
}
|
|
30
|
+
return target;
|
|
31
|
+
};
|
|
32
|
+
var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
|
|
33
|
+
var __async = (__this, __arguments, generator) => {
|
|
34
|
+
return new Promise((resolve, reject) => {
|
|
35
|
+
var fulfilled = (value) => {
|
|
36
|
+
try {
|
|
37
|
+
step(generator.next(value));
|
|
38
|
+
} catch (e) {
|
|
39
|
+
reject(e);
|
|
40
|
+
}
|
|
41
|
+
};
|
|
42
|
+
var rejected = (value) => {
|
|
43
|
+
try {
|
|
44
|
+
step(generator.throw(value));
|
|
45
|
+
} catch (e) {
|
|
46
|
+
reject(e);
|
|
47
|
+
}
|
|
48
|
+
};
|
|
49
|
+
var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
|
|
50
|
+
step((generator = generator.apply(__this, __arguments)).next());
|
|
51
|
+
});
|
|
52
|
+
};
|
|
53
|
+
import { getCurrentScope, onScopeDispose, watch, computed, toValue, shallowRef, getCurrentInstance, onMounted, warn, defineComponent, h, inject, resolveComponent, openBlock, createElementBlock, normalizeClass, createBlock, withModifiers, withCtx, createElementVNode, createVNode, createCommentVNode, Fragment, ref, normalizeStyle, createTextVNode, toDisplayString, provide, reactive, onBeforeUpdate, nextTick, renderList, useAttrs, unref, withDirectives, vShow, renderSlot, withKeys, vModelText, useSlots, useModel, onBeforeUnmount, mergeProps, mergeModels, render } from "vue";
|
|
54
|
+
import { p as process$1 } from "./index-C9zyi90j.js";
|
|
55
|
+
import { fromPairs, isEqual, flattenDeep, cloneDeep, debounce } from "lodash-unified";
|
|
56
|
+
import { ArrowRight, Loading, Check, CircleClose, ArrowDown } from "@element-plus/icons-vue";
|
|
57
|
+
import { useNamespace, ElIcon, ElRadio, ElCheckbox, ElScrollbar, useLocale, UPDATE_MODEL_EVENT, CHANGE_EVENT, EVENT_CODE, tagProps, useTooltipContentProps, CommonProps as CommonProps$1, useSizeProp, useFormItem, useFormSize, ElConfigProvider, ElTooltip, ElInput, ElTag, ClickOutside } from "element-plus";
|
|
58
|
+
import { ElCheckbox as ElCheckbox$1, ElRadio as ElRadio$1, ElIcon as ElIcon$1 } from "element-plus/es";
|
|
59
|
+
import { b as script$2 } from "./vue-virtual-scroller.esm-ZgBoGAjX.js";
|
|
60
|
+
import { _ as _export_sfc } from "./_plugin-vue_export-helper-1tPrXgE0.js";
|
|
61
|
+
!!(process$1.env.NODE_ENV !== "production") ? Object.freeze({}) : {};
|
|
62
|
+
!!(process$1.env.NODE_ENV !== "production") ? Object.freeze([]) : [];
|
|
63
|
+
const NOOP = () => {
|
|
64
|
+
};
|
|
65
|
+
const hasOwnProperty = Object.prototype.hasOwnProperty;
|
|
66
|
+
const hasOwn = (val, key) => hasOwnProperty.call(val, key);
|
|
67
|
+
const isArray = Array.isArray;
|
|
68
|
+
const isFunction = (val) => typeof val === "function";
|
|
69
|
+
const isString = (val) => typeof val === "string";
|
|
70
|
+
const isObject = (val) => val !== null && typeof val === "object";
|
|
71
|
+
const isPromise = (val) => {
|
|
72
|
+
return (isObject(val) || isFunction(val)) && isFunction(val.then) && isFunction(val.catch);
|
|
73
|
+
};
|
|
74
|
+
const cacheStringFunction = (fn) => {
|
|
75
|
+
const cache = /* @__PURE__ */ Object.create(null);
|
|
76
|
+
return ((str) => {
|
|
77
|
+
const hit = cache[str];
|
|
78
|
+
return hit || (cache[str] = fn(str));
|
|
79
|
+
});
|
|
80
|
+
};
|
|
81
|
+
const capitalize$1 = cacheStringFunction((str) => {
|
|
82
|
+
return str.charAt(0).toUpperCase() + str.slice(1);
|
|
83
|
+
});
|
|
84
|
+
function tryOnScopeDispose(fn, failSilently) {
|
|
85
|
+
if (getCurrentScope()) {
|
|
86
|
+
onScopeDispose(fn, failSilently);
|
|
87
|
+
return true;
|
|
88
|
+
}
|
|
89
|
+
return false;
|
|
90
|
+
}
|
|
91
|
+
const isClient = typeof window !== "undefined" && typeof document !== "undefined";
|
|
92
|
+
typeof WorkerGlobalScope !== "undefined" && globalThis instanceof WorkerGlobalScope;
|
|
93
|
+
const notNullish = (val) => val != null;
|
|
94
|
+
function toArray(value) {
|
|
95
|
+
return Array.isArray(value) ? value : [value];
|
|
96
|
+
}
|
|
97
|
+
const defaultWindow = isClient ? window : void 0;
|
|
98
|
+
function unrefElement(elRef) {
|
|
99
|
+
var _$el;
|
|
100
|
+
const plain = toValue(elRef);
|
|
101
|
+
return (_$el = plain === null || plain === void 0 ? void 0 : plain.$el) !== null && _$el !== void 0 ? _$el : plain;
|
|
102
|
+
}
|
|
103
|
+
// @__NO_SIDE_EFFECTS__
|
|
104
|
+
function useMounted() {
|
|
105
|
+
const isMounted = shallowRef(false);
|
|
106
|
+
const instance = getCurrentInstance();
|
|
107
|
+
if (instance) onMounted(() => {
|
|
108
|
+
isMounted.value = true;
|
|
109
|
+
}, instance);
|
|
110
|
+
return isMounted;
|
|
111
|
+
}
|
|
112
|
+
// @__NO_SIDE_EFFECTS__
|
|
113
|
+
function useSupported(callback) {
|
|
114
|
+
const isMounted = /* @__PURE__ */ useMounted();
|
|
115
|
+
return computed(() => {
|
|
116
|
+
isMounted.value;
|
|
117
|
+
return Boolean(callback());
|
|
118
|
+
});
|
|
119
|
+
}
|
|
120
|
+
function useMutationObserver(target, callback, options = {}) {
|
|
121
|
+
const _a = options, { window: window2 = defaultWindow } = _a, mutationOptions = __objRest(_a, ["window"]);
|
|
122
|
+
let observer;
|
|
123
|
+
const isSupported = /* @__PURE__ */ useSupported(() => window2 && "MutationObserver" in window2);
|
|
124
|
+
const cleanup = () => {
|
|
125
|
+
if (observer) {
|
|
126
|
+
observer.disconnect();
|
|
127
|
+
observer = void 0;
|
|
128
|
+
}
|
|
129
|
+
};
|
|
130
|
+
const stopWatch = watch(computed(() => {
|
|
131
|
+
const items = toArray(toValue(target)).map(unrefElement).filter(notNullish);
|
|
132
|
+
return new Set(items);
|
|
133
|
+
}), (newTargets) => {
|
|
134
|
+
cleanup();
|
|
135
|
+
if (isSupported.value && newTargets.size) {
|
|
136
|
+
observer = new MutationObserver(callback);
|
|
137
|
+
newTargets.forEach((el) => observer.observe(el, mutationOptions));
|
|
138
|
+
}
|
|
139
|
+
}, {
|
|
140
|
+
immediate: true,
|
|
141
|
+
flush: "post"
|
|
142
|
+
});
|
|
143
|
+
const takeRecords = () => {
|
|
144
|
+
return observer === null || observer === void 0 ? void 0 : observer.takeRecords();
|
|
145
|
+
};
|
|
146
|
+
const stop = () => {
|
|
147
|
+
stopWatch();
|
|
148
|
+
cleanup();
|
|
149
|
+
};
|
|
150
|
+
tryOnScopeDispose(stop);
|
|
151
|
+
return {
|
|
152
|
+
isSupported,
|
|
153
|
+
stop,
|
|
154
|
+
takeRecords
|
|
155
|
+
};
|
|
156
|
+
}
|
|
157
|
+
function useCssVar(prop, target, options = {}) {
|
|
158
|
+
const { window: window2 = defaultWindow, initialValue, observe = false } = options;
|
|
159
|
+
const variable = shallowRef(initialValue);
|
|
160
|
+
const elRef = computed(() => {
|
|
161
|
+
var _window$document;
|
|
162
|
+
return unrefElement(target) || (window2 === null || window2 === void 0 || (_window$document = window2.document) === null || _window$document === void 0 ? void 0 : _window$document.documentElement);
|
|
163
|
+
});
|
|
164
|
+
function updateCssVar() {
|
|
165
|
+
const key = toValue(prop);
|
|
166
|
+
const el = toValue(elRef);
|
|
167
|
+
if (el && window2 && key) {
|
|
168
|
+
var _window$getComputedSt;
|
|
169
|
+
variable.value = ((_window$getComputedSt = window2.getComputedStyle(el).getPropertyValue(key)) === null || _window$getComputedSt === void 0 ? void 0 : _window$getComputedSt.trim()) || variable.value || initialValue;
|
|
170
|
+
}
|
|
171
|
+
}
|
|
172
|
+
if (observe) useMutationObserver(elRef, updateCssVar, {
|
|
173
|
+
attributeFilter: ["style", "class"],
|
|
174
|
+
window: window2
|
|
175
|
+
});
|
|
176
|
+
watch([elRef, () => toValue(prop)], (_, old) => {
|
|
177
|
+
if (old[0] && old[1]) old[0].style.removeProperty(old[1]);
|
|
178
|
+
updateCssVar();
|
|
179
|
+
}, { immediate: true });
|
|
180
|
+
watch([variable, elRef], ([val, el]) => {
|
|
181
|
+
const raw_prop = toValue(prop);
|
|
182
|
+
if ((el === null || el === void 0 ? void 0 : el.style) && raw_prop) if (val == null) el.style.removeProperty(raw_prop);
|
|
183
|
+
else el.style.setProperty(raw_prop, val);
|
|
184
|
+
}, { immediate: true });
|
|
185
|
+
return variable;
|
|
186
|
+
}
|
|
187
|
+
function useResizeObserver(target, callback, options = {}) {
|
|
188
|
+
const _a = options, { window: window2 = defaultWindow } = _a, observerOptions = __objRest(_a, ["window"]);
|
|
189
|
+
let observer;
|
|
190
|
+
const isSupported = /* @__PURE__ */ useSupported(() => window2 && "ResizeObserver" in window2);
|
|
191
|
+
const cleanup = () => {
|
|
192
|
+
if (observer) {
|
|
193
|
+
observer.disconnect();
|
|
194
|
+
observer = void 0;
|
|
195
|
+
}
|
|
196
|
+
};
|
|
197
|
+
const stopWatch = watch(computed(() => {
|
|
198
|
+
const _targets = toValue(target);
|
|
199
|
+
return Array.isArray(_targets) ? _targets.map((el) => unrefElement(el)) : [unrefElement(_targets)];
|
|
200
|
+
}), (els) => {
|
|
201
|
+
cleanup();
|
|
202
|
+
if (isSupported.value && window2) {
|
|
203
|
+
observer = new ResizeObserver(callback);
|
|
204
|
+
for (const _el of els) if (_el) observer.observe(_el, observerOptions);
|
|
205
|
+
}
|
|
206
|
+
}, {
|
|
207
|
+
immediate: true,
|
|
208
|
+
flush: "post"
|
|
209
|
+
});
|
|
210
|
+
const stop = () => {
|
|
211
|
+
cleanup();
|
|
212
|
+
stopWatch();
|
|
213
|
+
};
|
|
214
|
+
tryOnScopeDispose(stop);
|
|
215
|
+
return {
|
|
216
|
+
isSupported,
|
|
217
|
+
stop
|
|
218
|
+
};
|
|
219
|
+
}
|
|
220
|
+
const isLeaf = (el) => !el.getAttribute("aria-owns");
|
|
221
|
+
const getSibling = (el, distance, elClass) => {
|
|
222
|
+
const { parentNode } = el;
|
|
223
|
+
if (!parentNode) return null;
|
|
224
|
+
const siblings = parentNode.querySelectorAll(elClass);
|
|
225
|
+
const index = Array.prototype.indexOf.call(siblings, el);
|
|
226
|
+
return siblings[index + distance] || null;
|
|
227
|
+
};
|
|
228
|
+
const focusNode = (el) => {
|
|
229
|
+
if (!el) return;
|
|
230
|
+
el.focus();
|
|
231
|
+
!isLeaf(el) && el.click();
|
|
232
|
+
};
|
|
233
|
+
const isUndefined = (val) => val === void 0;
|
|
234
|
+
const isBoolean = (val) => typeof val === "boolean";
|
|
235
|
+
const isNumber = (val) => typeof val === "number";
|
|
236
|
+
const isEmpty = (val) => !val && val !== 0 || isArray(val) && val.length === 0 || isObject(val) && !Object.keys(val).length;
|
|
237
|
+
const isStringNumber = (val) => {
|
|
238
|
+
if (!isString(val)) {
|
|
239
|
+
return false;
|
|
240
|
+
}
|
|
241
|
+
return !Number.isNaN(Number(val));
|
|
242
|
+
};
|
|
243
|
+
const capitalize = (str) => capitalize$1(str);
|
|
244
|
+
class ElementPlusError extends Error {
|
|
245
|
+
constructor(m) {
|
|
246
|
+
super(m);
|
|
247
|
+
this.name = "ElementPlusError";
|
|
248
|
+
}
|
|
249
|
+
}
|
|
250
|
+
function debugWarn(scope, message) {
|
|
251
|
+
if (process$1.env.NODE_ENV !== "production") {
|
|
252
|
+
const error = isString(scope) ? new ElementPlusError(`[${scope}] ${message}`) : scope;
|
|
253
|
+
console.warn(error);
|
|
254
|
+
}
|
|
255
|
+
}
|
|
256
|
+
const SCOPE = "utils/dom/style";
|
|
257
|
+
function addUnit(value, defaultUnit = "px") {
|
|
258
|
+
if (!value) return "";
|
|
259
|
+
if (isNumber(value) || isStringNumber(value)) {
|
|
260
|
+
return `${value}${defaultUnit}`;
|
|
261
|
+
} else if (isString(value)) {
|
|
262
|
+
return value;
|
|
263
|
+
}
|
|
264
|
+
debugWarn(SCOPE, "binding value must be a string or number");
|
|
265
|
+
}
|
|
266
|
+
const epPropKey = "__epPropKey";
|
|
267
|
+
const definePropType = (val) => val;
|
|
268
|
+
const isEpProp = (val) => isObject(val) && !!val[epPropKey];
|
|
269
|
+
const buildProp = (prop, key) => {
|
|
270
|
+
if (!isObject(prop) || isEpProp(prop)) return prop;
|
|
271
|
+
const { values, required, default: defaultValue, type, validator } = prop;
|
|
272
|
+
const _validator = values || validator ? (val) => {
|
|
273
|
+
let valid = false;
|
|
274
|
+
let allowedValues = [];
|
|
275
|
+
if (values) {
|
|
276
|
+
allowedValues = Array.from(values);
|
|
277
|
+
if (hasOwn(prop, "default")) {
|
|
278
|
+
allowedValues.push(defaultValue);
|
|
279
|
+
}
|
|
280
|
+
valid || (valid = allowedValues.includes(val));
|
|
281
|
+
}
|
|
282
|
+
if (validator) valid || (valid = validator(val));
|
|
283
|
+
if (!valid && allowedValues.length > 0) {
|
|
284
|
+
const allowValuesText = [...new Set(allowedValues)].map((value) => JSON.stringify(value)).join(", ");
|
|
285
|
+
warn(
|
|
286
|
+
`Invalid prop: validation failed${key ? ` for prop "${key}"` : ""}. Expected one of [${allowValuesText}], got value ${JSON.stringify(
|
|
287
|
+
val
|
|
288
|
+
)}.`
|
|
289
|
+
);
|
|
290
|
+
}
|
|
291
|
+
return valid;
|
|
292
|
+
} : void 0;
|
|
293
|
+
const epProp = {
|
|
294
|
+
type,
|
|
295
|
+
required: !!required,
|
|
296
|
+
validator: _validator,
|
|
297
|
+
[epPropKey]: true
|
|
298
|
+
};
|
|
299
|
+
if (hasOwn(prop, "default")) epProp.default = defaultValue;
|
|
300
|
+
return epProp;
|
|
301
|
+
};
|
|
302
|
+
const buildProps = (props) => fromPairs(
|
|
303
|
+
Object.entries(props).map(([key, option]) => [
|
|
304
|
+
key,
|
|
305
|
+
buildProp(option, key)
|
|
306
|
+
])
|
|
307
|
+
);
|
|
308
|
+
const unique = (arr) => [...new Set(arr)];
|
|
309
|
+
const castArray = (arr) => {
|
|
310
|
+
if (!arr && arr !== 0) return [];
|
|
311
|
+
if (Array.isArray(arr)) {
|
|
312
|
+
return arr;
|
|
313
|
+
}
|
|
314
|
+
return [arr];
|
|
315
|
+
};
|
|
316
|
+
const isKorean = (text) => /([\uAC00-\uD7AF\u3130-\u318F])+/gi.test(text);
|
|
317
|
+
const generateId = () => Math.floor(Math.random() * 1e4);
|
|
318
|
+
const NodeContent = defineComponent({
|
|
319
|
+
name: "NodeContent",
|
|
320
|
+
setup() {
|
|
321
|
+
const ns = useNamespace("cascader-node");
|
|
322
|
+
return {
|
|
323
|
+
ns
|
|
324
|
+
};
|
|
325
|
+
},
|
|
326
|
+
render() {
|
|
327
|
+
const { ns } = this;
|
|
328
|
+
const { node, panel } = this.$parent;
|
|
329
|
+
const { data, label } = node;
|
|
330
|
+
const { renderLabelFn } = panel;
|
|
331
|
+
return h(
|
|
332
|
+
"span",
|
|
333
|
+
{ class: ns.e("label") },
|
|
334
|
+
renderLabelFn ? renderLabelFn({ node, data }) : label
|
|
335
|
+
);
|
|
336
|
+
}
|
|
337
|
+
});
|
|
338
|
+
const CASCADER_PANEL_INJECTION_KEY = /* @__PURE__ */ Symbol();
|
|
339
|
+
const _sfc_main$4 = defineComponent({
|
|
340
|
+
name: "ElCascaderNode",
|
|
341
|
+
components: {
|
|
342
|
+
ElCheckbox,
|
|
343
|
+
ElRadio,
|
|
344
|
+
NodeContent,
|
|
345
|
+
ElIcon,
|
|
346
|
+
Check,
|
|
347
|
+
Loading,
|
|
348
|
+
ArrowRight
|
|
349
|
+
},
|
|
350
|
+
props: {
|
|
351
|
+
node: {
|
|
352
|
+
type: Object,
|
|
353
|
+
required: true
|
|
354
|
+
},
|
|
355
|
+
menuId: String
|
|
356
|
+
},
|
|
357
|
+
emits: ["expand"],
|
|
358
|
+
setup(props, { emit }) {
|
|
359
|
+
const panel = inject(CASCADER_PANEL_INJECTION_KEY);
|
|
360
|
+
const ns = useNamespace("cascader-node");
|
|
361
|
+
const isHoverMenu = computed(() => panel.isHoverMenu);
|
|
362
|
+
const multiple = computed(() => panel.config.multiple);
|
|
363
|
+
const checkStrictly = computed(() => panel.config.checkStrictly);
|
|
364
|
+
const checkedNodeId = computed(() => {
|
|
365
|
+
var _a;
|
|
366
|
+
return (_a = panel.checkedNodes[0]) == null ? void 0 : _a.uid;
|
|
367
|
+
});
|
|
368
|
+
const isDisabled = computed(() => props.node.isDisabled);
|
|
369
|
+
const isLeaf2 = computed(() => props.node.isLeaf);
|
|
370
|
+
const expandable = computed(
|
|
371
|
+
() => checkStrictly.value && !isLeaf2.value || !isDisabled.value
|
|
372
|
+
);
|
|
373
|
+
const inExpandingPath = computed(() => isInPath(panel.expandingNode));
|
|
374
|
+
const inCheckedPath = computed(
|
|
375
|
+
() => checkStrictly.value && panel.checkedNodes.some(isInPath)
|
|
376
|
+
);
|
|
377
|
+
const isInPath = (node) => {
|
|
378
|
+
var _a;
|
|
379
|
+
const { level, uid: uid2 } = props.node;
|
|
380
|
+
return ((_a = node == null ? void 0 : node.pathNodes[level - 1]) == null ? void 0 : _a.uid) === uid2;
|
|
381
|
+
};
|
|
382
|
+
const doExpand = () => {
|
|
383
|
+
if (inExpandingPath.value) return;
|
|
384
|
+
panel.expandNode(props.node);
|
|
385
|
+
};
|
|
386
|
+
const doCheck = (checked) => {
|
|
387
|
+
const { node } = props;
|
|
388
|
+
if (checked === node.checked) return;
|
|
389
|
+
panel.handleCheckChange(node, checked);
|
|
390
|
+
};
|
|
391
|
+
const doLoad = () => {
|
|
392
|
+
panel.lazyLoad(props.node, () => {
|
|
393
|
+
if (!isLeaf2.value) doExpand();
|
|
394
|
+
});
|
|
395
|
+
};
|
|
396
|
+
const handleHoverExpand = (e) => {
|
|
397
|
+
if (!isHoverMenu.value) return;
|
|
398
|
+
handleExpand();
|
|
399
|
+
!isLeaf2.value && emit("expand", e);
|
|
400
|
+
};
|
|
401
|
+
const handleExpand = () => {
|
|
402
|
+
const { node } = props;
|
|
403
|
+
if (!expandable.value || node.loading) return;
|
|
404
|
+
node.loaded ? doExpand() : doLoad();
|
|
405
|
+
};
|
|
406
|
+
const handleClick = () => {
|
|
407
|
+
if (isHoverMenu.value && !isLeaf2.value) return;
|
|
408
|
+
if (isLeaf2.value && !isDisabled.value && !checkStrictly.value && !multiple.value) {
|
|
409
|
+
handleCheck(true);
|
|
410
|
+
} else {
|
|
411
|
+
handleExpand();
|
|
412
|
+
}
|
|
413
|
+
};
|
|
414
|
+
const handleSelectCheck = (checked) => {
|
|
415
|
+
if (checkStrictly.value) {
|
|
416
|
+
doCheck(checked);
|
|
417
|
+
if (props.node.loaded) {
|
|
418
|
+
doExpand();
|
|
419
|
+
}
|
|
420
|
+
} else {
|
|
421
|
+
handleCheck(checked);
|
|
422
|
+
}
|
|
423
|
+
};
|
|
424
|
+
const handleCheck = (checked) => {
|
|
425
|
+
if (!props.node.loaded) {
|
|
426
|
+
doLoad();
|
|
427
|
+
} else {
|
|
428
|
+
doCheck(checked);
|
|
429
|
+
!checkStrictly.value && doExpand();
|
|
430
|
+
}
|
|
431
|
+
};
|
|
432
|
+
return {
|
|
433
|
+
panel,
|
|
434
|
+
isHoverMenu,
|
|
435
|
+
multiple,
|
|
436
|
+
checkStrictly,
|
|
437
|
+
checkedNodeId,
|
|
438
|
+
isDisabled,
|
|
439
|
+
isLeaf: isLeaf2,
|
|
440
|
+
expandable,
|
|
441
|
+
inExpandingPath,
|
|
442
|
+
inCheckedPath,
|
|
443
|
+
ns,
|
|
444
|
+
handleHoverExpand,
|
|
445
|
+
handleExpand,
|
|
446
|
+
handleClick,
|
|
447
|
+
handleCheck,
|
|
448
|
+
handleSelectCheck
|
|
449
|
+
};
|
|
450
|
+
}
|
|
451
|
+
});
|
|
452
|
+
const _hoisted_1$1 = ["id", "aria-haspopup", "aria-owns", "aria-expanded", "tabindex"];
|
|
453
|
+
function _sfc_render$2(_ctx, _cache, $props, $setup, $data, $options) {
|
|
454
|
+
const _component_el_checkbox = ElCheckbox$1;
|
|
455
|
+
const _component_el_radio = ElRadio$1;
|
|
456
|
+
const _component_check = resolveComponent("check");
|
|
457
|
+
const _component_el_icon = ElIcon$1;
|
|
458
|
+
const _component_node_content = resolveComponent("node-content");
|
|
459
|
+
const _component_loading = resolveComponent("loading");
|
|
460
|
+
const _component_arrow_right = resolveComponent("arrow-right");
|
|
461
|
+
return openBlock(), createElementBlock("li", {
|
|
462
|
+
id: `${_ctx.menuId}-${_ctx.node.uid}`,
|
|
463
|
+
role: "menuitem",
|
|
464
|
+
"aria-haspopup": !_ctx.isLeaf,
|
|
465
|
+
"aria-owns": _ctx.isLeaf ? null : _ctx.menuId,
|
|
466
|
+
"aria-expanded": _ctx.inExpandingPath,
|
|
467
|
+
tabindex: _ctx.expandable ? -1 : void 0,
|
|
468
|
+
class: normalizeClass([
|
|
469
|
+
_ctx.ns.b(),
|
|
470
|
+
_ctx.ns.is("selectable", _ctx.checkStrictly),
|
|
471
|
+
_ctx.ns.is("active", _ctx.node.checked),
|
|
472
|
+
_ctx.ns.is("disabled", !_ctx.expandable),
|
|
473
|
+
_ctx.inExpandingPath && "in-active-path",
|
|
474
|
+
_ctx.inCheckedPath && "in-checked-path"
|
|
475
|
+
]),
|
|
476
|
+
onMouseenter: _cache[2] || (_cache[2] = (...args) => _ctx.handleHoverExpand && _ctx.handleHoverExpand(...args)),
|
|
477
|
+
onFocus: _cache[3] || (_cache[3] = (...args) => _ctx.handleHoverExpand && _ctx.handleHoverExpand(...args)),
|
|
478
|
+
onClick: _cache[4] || (_cache[4] = (...args) => _ctx.handleClick && _ctx.handleClick(...args))
|
|
479
|
+
}, [
|
|
480
|
+
_ctx.multiple ? (openBlock(), createBlock(_component_el_checkbox, {
|
|
481
|
+
key: 0,
|
|
482
|
+
"model-value": _ctx.node.checked,
|
|
483
|
+
indeterminate: _ctx.node.indeterminate,
|
|
484
|
+
disabled: _ctx.isDisabled,
|
|
485
|
+
onClick: _cache[0] || (_cache[0] = withModifiers(() => {
|
|
486
|
+
}, ["stop"])),
|
|
487
|
+
"onUpdate:modelValue": _ctx.handleSelectCheck
|
|
488
|
+
}, null, 8, ["model-value", "indeterminate", "disabled", "onUpdate:modelValue"])) : _ctx.checkStrictly ? (openBlock(), createBlock(_component_el_radio, {
|
|
489
|
+
key: 1,
|
|
490
|
+
"model-value": _ctx.checkedNodeId,
|
|
491
|
+
label: _ctx.node.uid,
|
|
492
|
+
disabled: _ctx.isDisabled,
|
|
493
|
+
"onUpdate:modelValue": _ctx.handleSelectCheck,
|
|
494
|
+
onClick: _cache[1] || (_cache[1] = withModifiers(() => {
|
|
495
|
+
}, ["stop"]))
|
|
496
|
+
}, {
|
|
497
|
+
default: withCtx(() => [..._cache[5] || (_cache[5] = [
|
|
498
|
+
createElementVNode("span", null, null, -1)
|
|
499
|
+
])]),
|
|
500
|
+
_: 1
|
|
501
|
+
}, 8, ["model-value", "label", "disabled", "onUpdate:modelValue"])) : _ctx.isLeaf && _ctx.node.checked ? (openBlock(), createBlock(_component_el_icon, {
|
|
502
|
+
key: 2,
|
|
503
|
+
class: normalizeClass(_ctx.ns.e("prefix"))
|
|
504
|
+
}, {
|
|
505
|
+
default: withCtx(() => [
|
|
506
|
+
createVNode(_component_check)
|
|
507
|
+
]),
|
|
508
|
+
_: 1
|
|
509
|
+
}, 8, ["class"])) : createCommentVNode("", true),
|
|
510
|
+
createVNode(_component_node_content),
|
|
511
|
+
!_ctx.isLeaf ? (openBlock(), createElementBlock(Fragment, { key: 3 }, [
|
|
512
|
+
_ctx.node.loading ? (openBlock(), createBlock(_component_el_icon, {
|
|
513
|
+
key: 0,
|
|
514
|
+
class: normalizeClass([_ctx.ns.is("loading"), _ctx.ns.e("postfix")])
|
|
515
|
+
}, {
|
|
516
|
+
default: withCtx(() => [
|
|
517
|
+
createVNode(_component_loading)
|
|
518
|
+
]),
|
|
519
|
+
_: 1
|
|
520
|
+
}, 8, ["class"])) : (openBlock(), createBlock(_component_el_icon, {
|
|
521
|
+
key: 1,
|
|
522
|
+
class: normalizeClass(["arrow-right", _ctx.ns.e("postfix")])
|
|
523
|
+
}, {
|
|
524
|
+
default: withCtx(() => [
|
|
525
|
+
createVNode(_component_arrow_right)
|
|
526
|
+
]),
|
|
527
|
+
_: 1
|
|
528
|
+
}, 8, ["class"]))
|
|
529
|
+
], 64)) : createCommentVNode("", true)
|
|
530
|
+
], 42, _hoisted_1$1);
|
|
531
|
+
}
|
|
532
|
+
const CustomCascaderNode = /* @__PURE__ */ _export_sfc(_sfc_main$4, [["render", _sfc_render$2]]);
|
|
533
|
+
const getTextWidth = (text, font = "14px sans-serif") => {
|
|
534
|
+
const canvas = document.createElement("canvas");
|
|
535
|
+
const context = canvas.getContext("2d");
|
|
536
|
+
if (!context) return 0;
|
|
537
|
+
context.font = font;
|
|
538
|
+
return context.measureText(text).width;
|
|
539
|
+
};
|
|
540
|
+
const _sfc_main$3 = defineComponent({
|
|
541
|
+
name: "CustomCascaderMenu",
|
|
542
|
+
components: {
|
|
543
|
+
Loading,
|
|
544
|
+
ElIcon,
|
|
545
|
+
ElScrollbar,
|
|
546
|
+
RecycleScroller: script$2,
|
|
547
|
+
CustomCascaderNode
|
|
548
|
+
},
|
|
549
|
+
props: {
|
|
550
|
+
nodes: {
|
|
551
|
+
type: Array,
|
|
552
|
+
required: true
|
|
553
|
+
},
|
|
554
|
+
index: {
|
|
555
|
+
type: Number,
|
|
556
|
+
required: true
|
|
557
|
+
}
|
|
558
|
+
},
|
|
559
|
+
setup(props) {
|
|
560
|
+
const instance = getCurrentInstance();
|
|
561
|
+
const ns = useNamespace("cascader-menu");
|
|
562
|
+
const { t } = useLocale();
|
|
563
|
+
const id = generateId();
|
|
564
|
+
let activeNode = null;
|
|
565
|
+
let hoverTimer = null;
|
|
566
|
+
const panel = inject(CASCADER_PANEL_INJECTION_KEY);
|
|
567
|
+
const hoverZone = ref(null);
|
|
568
|
+
const isEmpty2 = computed(() => !props.nodes.length);
|
|
569
|
+
const isLoading = computed(() => !panel.initialLoaded);
|
|
570
|
+
const menuId = computed(() => `cascader-menu-${id}-${props.index}`);
|
|
571
|
+
const menuWidth = computed(() => {
|
|
572
|
+
if (!props.nodes.length) return 180;
|
|
573
|
+
const basePadding = 110;
|
|
574
|
+
let maxWidth = 0;
|
|
575
|
+
for (const node of props.nodes) {
|
|
576
|
+
const label = node.label || "";
|
|
577
|
+
const textWidth = getTextWidth(String(label));
|
|
578
|
+
if (textWidth > maxWidth) {
|
|
579
|
+
maxWidth = textWidth;
|
|
580
|
+
}
|
|
581
|
+
}
|
|
582
|
+
return Math.max(180, Math.ceil(maxWidth + basePadding));
|
|
583
|
+
});
|
|
584
|
+
const handleExpand = (e) => {
|
|
585
|
+
activeNode = e.target;
|
|
586
|
+
};
|
|
587
|
+
const handleMouseMove = (e) => {
|
|
588
|
+
if (!panel.isHoverMenu || !activeNode || !hoverZone.value) return;
|
|
589
|
+
if (activeNode.contains(e.target)) {
|
|
590
|
+
clearHoverTimer();
|
|
591
|
+
const el = instance.vnode.el;
|
|
592
|
+
const { left } = el.getBoundingClientRect();
|
|
593
|
+
const { offsetWidth, offsetHeight } = el;
|
|
594
|
+
const startX = e.clientX - left;
|
|
595
|
+
const top = activeNode.offsetTop;
|
|
596
|
+
const bottom = top + activeNode.offsetHeight;
|
|
597
|
+
hoverZone.value.innerHTML = `
|
|
598
|
+
<path style="pointer-events: auto;" fill="transparent" d="M${startX} ${top} L${offsetWidth} 0 V${top} Z" />
|
|
599
|
+
<path style="pointer-events: auto;" fill="transparent" d="M${startX} ${bottom} L${offsetWidth} ${offsetHeight} V${bottom} Z" />
|
|
600
|
+
`;
|
|
601
|
+
} else if (!hoverTimer) {
|
|
602
|
+
hoverTimer = window.setTimeout(clearHoverZone, panel.config.hoverThreshold);
|
|
603
|
+
}
|
|
604
|
+
};
|
|
605
|
+
const clearHoverTimer = () => {
|
|
606
|
+
if (!hoverTimer) return;
|
|
607
|
+
clearTimeout(hoverTimer);
|
|
608
|
+
hoverTimer = null;
|
|
609
|
+
};
|
|
610
|
+
const clearHoverZone = () => {
|
|
611
|
+
if (!hoverZone.value) return;
|
|
612
|
+
hoverZone.value.innerHTML = "";
|
|
613
|
+
clearHoverTimer();
|
|
614
|
+
};
|
|
615
|
+
return {
|
|
616
|
+
ns,
|
|
617
|
+
panel,
|
|
618
|
+
hoverZone,
|
|
619
|
+
isEmpty: isEmpty2,
|
|
620
|
+
isLoading,
|
|
621
|
+
menuId,
|
|
622
|
+
menuWidth,
|
|
623
|
+
t,
|
|
624
|
+
handleExpand,
|
|
625
|
+
handleMouseMove,
|
|
626
|
+
clearHoverZone
|
|
627
|
+
};
|
|
628
|
+
}
|
|
629
|
+
});
|
|
630
|
+
function _sfc_render$1(_ctx, _cache, $props, $setup, $data, $options) {
|
|
631
|
+
const _component_custom_cascader_node = resolveComponent("custom-cascader-node");
|
|
632
|
+
const _component_loading = resolveComponent("loading");
|
|
633
|
+
const _component_el_icon = ElIcon$1;
|
|
634
|
+
const _component_RecycleScroller = resolveComponent("RecycleScroller");
|
|
635
|
+
return _ctx.nodes.length ? (openBlock(), createBlock(_component_RecycleScroller, {
|
|
636
|
+
key: _ctx.menuId,
|
|
637
|
+
tag: "ul",
|
|
638
|
+
role: "menu",
|
|
639
|
+
class: normalizeClass([_ctx.ns.b(), "cascader-virtual-list"]),
|
|
640
|
+
"wrap-class": _ctx.ns.e("wrap"),
|
|
641
|
+
"view-class": [_ctx.ns.e("list"), _ctx.ns.is("empty", _ctx.isEmpty)],
|
|
642
|
+
style: normalizeStyle({ minWidth: _ctx.menuWidth + "px" }),
|
|
643
|
+
items: _ctx.nodes,
|
|
644
|
+
"item-size": 34,
|
|
645
|
+
"key-field": "uid",
|
|
646
|
+
onMousemove: _ctx.handleMouseMove,
|
|
647
|
+
onMouseleave: _ctx.clearHoverZone
|
|
648
|
+
}, {
|
|
649
|
+
default: withCtx(({ item }) => {
|
|
650
|
+
var _a;
|
|
651
|
+
return [
|
|
652
|
+
createVNode(_component_custom_cascader_node, {
|
|
653
|
+
node: item,
|
|
654
|
+
"menu-id": _ctx.menuId,
|
|
655
|
+
onExpand: _ctx.handleExpand
|
|
656
|
+
}, null, 8, ["node", "menu-id", "onExpand"]),
|
|
657
|
+
_ctx.isLoading ? (openBlock(), createElementBlock("div", {
|
|
658
|
+
key: 0,
|
|
659
|
+
class: normalizeClass(_ctx.ns.e("empty-text"))
|
|
660
|
+
}, [
|
|
661
|
+
createVNode(_component_el_icon, {
|
|
662
|
+
size: "14",
|
|
663
|
+
class: normalizeClass(_ctx.ns.is("loading"))
|
|
664
|
+
}, {
|
|
665
|
+
default: withCtx(() => [
|
|
666
|
+
createVNode(_component_loading)
|
|
667
|
+
]),
|
|
668
|
+
_: 1
|
|
669
|
+
}, 8, ["class"]),
|
|
670
|
+
createTextVNode(" " + toDisplayString(_ctx.t("el.cascader.loading")), 1)
|
|
671
|
+
], 2)) : _ctx.isEmpty ? (openBlock(), createElementBlock("div", {
|
|
672
|
+
key: 1,
|
|
673
|
+
class: normalizeClass(_ctx.ns.e("empty-text"))
|
|
674
|
+
}, toDisplayString(_ctx.t("el.cascader.noData")), 3)) : ((_a = _ctx.panel) == null ? void 0 : _a.isHoverMenu) ? (openBlock(), createElementBlock("svg", {
|
|
675
|
+
key: 2,
|
|
676
|
+
ref: "hoverZone",
|
|
677
|
+
class: normalizeClass(_ctx.ns.e("hover-zone"))
|
|
678
|
+
}, null, 2)) : createCommentVNode("", true)
|
|
679
|
+
];
|
|
680
|
+
}),
|
|
681
|
+
_: 1
|
|
682
|
+
}, 8, ["class", "wrap-class", "view-class", "style", "items", "onMousemove", "onMouseleave"])) : createCommentVNode("", true);
|
|
683
|
+
}
|
|
684
|
+
const CustomCascaderMenu = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["render", _sfc_render$1], ["__scopeId", "data-v-a251fab9"]]);
|
|
685
|
+
let uid = 0;
|
|
686
|
+
const calculatePathNodes = (node) => {
|
|
687
|
+
const nodes = [node];
|
|
688
|
+
let { parent } = node;
|
|
689
|
+
while (parent) {
|
|
690
|
+
nodes.unshift(parent);
|
|
691
|
+
parent = parent.parent;
|
|
692
|
+
}
|
|
693
|
+
return nodes;
|
|
694
|
+
};
|
|
695
|
+
class Node {
|
|
696
|
+
constructor(data, config, parent, root = false) {
|
|
697
|
+
__publicField(this, "data");
|
|
698
|
+
__publicField(this, "config");
|
|
699
|
+
__publicField(this, "parent");
|
|
700
|
+
__publicField(this, "root");
|
|
701
|
+
__publicField(this, "uid", uid++);
|
|
702
|
+
__publicField(this, "level");
|
|
703
|
+
__publicField(this, "value");
|
|
704
|
+
__publicField(this, "label");
|
|
705
|
+
__publicField(this, "pathNodes");
|
|
706
|
+
__publicField(this, "pathValues");
|
|
707
|
+
__publicField(this, "pathLabels");
|
|
708
|
+
__publicField(this, "childrenData");
|
|
709
|
+
__publicField(this, "children");
|
|
710
|
+
__publicField(this, "text");
|
|
711
|
+
__publicField(this, "loaded");
|
|
712
|
+
/**
|
|
713
|
+
* Is it checked
|
|
714
|
+
*
|
|
715
|
+
* @default false
|
|
716
|
+
*/
|
|
717
|
+
__publicField(this, "checked", false);
|
|
718
|
+
/**
|
|
719
|
+
* Used to indicate the intermediate state of unchecked and fully checked child nodes
|
|
720
|
+
*
|
|
721
|
+
* @default false
|
|
722
|
+
*/
|
|
723
|
+
__publicField(this, "indeterminate", false);
|
|
724
|
+
/**
|
|
725
|
+
* Loading Status
|
|
726
|
+
*
|
|
727
|
+
* @default false
|
|
728
|
+
*/
|
|
729
|
+
__publicField(this, "loading", false);
|
|
730
|
+
this.data = data;
|
|
731
|
+
this.config = config;
|
|
732
|
+
this.parent = parent;
|
|
733
|
+
this.root = root;
|
|
734
|
+
const { value: valueKey, label: labelKey, children: childrenKey } = config;
|
|
735
|
+
const childrenData = data[childrenKey];
|
|
736
|
+
const pathNodes = calculatePathNodes(this);
|
|
737
|
+
this.level = root ? 0 : parent ? parent.level + 1 : 1;
|
|
738
|
+
this.value = data[valueKey];
|
|
739
|
+
this.label = data[labelKey];
|
|
740
|
+
this.pathNodes = pathNodes;
|
|
741
|
+
this.pathValues = pathNodes.map((node) => node.value);
|
|
742
|
+
this.pathLabels = pathNodes.map((node) => node.label);
|
|
743
|
+
this.childrenData = childrenData;
|
|
744
|
+
this.children = (childrenData || []).map(
|
|
745
|
+
(child) => new Node(child, config, this)
|
|
746
|
+
);
|
|
747
|
+
this.loaded = !config.lazy || this.isLeaf || !isEmpty(childrenData);
|
|
748
|
+
}
|
|
749
|
+
get isDisabled() {
|
|
750
|
+
const { data, parent, config } = this;
|
|
751
|
+
const { disabled, checkStrictly } = config;
|
|
752
|
+
const isDisabled = isFunction(disabled) ? disabled(data, this) : !!data[disabled];
|
|
753
|
+
return isDisabled || !checkStrictly && (parent == null ? void 0 : parent.isDisabled);
|
|
754
|
+
}
|
|
755
|
+
get isLeaf() {
|
|
756
|
+
const { data, config, childrenData, loaded } = this;
|
|
757
|
+
const { lazy, leaf } = config;
|
|
758
|
+
const isLeaf2 = isFunction(leaf) ? leaf(data, this) : data[leaf];
|
|
759
|
+
return isUndefined(isLeaf2) ? lazy && !loaded ? false : !(Array.isArray(childrenData) && childrenData.length) : !!isLeaf2;
|
|
760
|
+
}
|
|
761
|
+
get valueByOption() {
|
|
762
|
+
return this.config.emitPath ? this.pathValues : this.value;
|
|
763
|
+
}
|
|
764
|
+
appendChild(childData) {
|
|
765
|
+
const { childrenData, children } = this;
|
|
766
|
+
const node = new Node(childData, this.config, this);
|
|
767
|
+
if (Array.isArray(childrenData)) {
|
|
768
|
+
childrenData.push(childData);
|
|
769
|
+
} else {
|
|
770
|
+
this.childrenData = [childData];
|
|
771
|
+
}
|
|
772
|
+
children.push(node);
|
|
773
|
+
return node;
|
|
774
|
+
}
|
|
775
|
+
calcText(allLevels, separator) {
|
|
776
|
+
const text = allLevels ? this.pathLabels.join(separator) : this.label;
|
|
777
|
+
this.text = text;
|
|
778
|
+
return text;
|
|
779
|
+
}
|
|
780
|
+
broadcast(event, ...args) {
|
|
781
|
+
const handlerName = `onParent${capitalize(event)}`;
|
|
782
|
+
this.children.forEach((child) => {
|
|
783
|
+
if (child) {
|
|
784
|
+
child.broadcast(event, ...args);
|
|
785
|
+
child[handlerName] && child[handlerName](...args);
|
|
786
|
+
}
|
|
787
|
+
});
|
|
788
|
+
}
|
|
789
|
+
emit(event, ...args) {
|
|
790
|
+
const { parent } = this;
|
|
791
|
+
const handlerName = `onChild${capitalize(event)}`;
|
|
792
|
+
if (parent) {
|
|
793
|
+
parent[handlerName] && parent[handlerName](...args);
|
|
794
|
+
parent.emit(event, ...args);
|
|
795
|
+
}
|
|
796
|
+
}
|
|
797
|
+
onParentCheck(checked) {
|
|
798
|
+
if (!this.isDisabled) {
|
|
799
|
+
this.setCheckState(checked);
|
|
800
|
+
}
|
|
801
|
+
}
|
|
802
|
+
onChildCheck() {
|
|
803
|
+
const { children } = this;
|
|
804
|
+
const validChildren = children.filter((child) => !child.isDisabled);
|
|
805
|
+
const checked = validChildren.length ? validChildren.every((child) => child.checked) : false;
|
|
806
|
+
this.setCheckState(checked);
|
|
807
|
+
}
|
|
808
|
+
setCheckState(checked) {
|
|
809
|
+
const totalNum = this.children.length;
|
|
810
|
+
const checkedNum = this.children.reduce((c, p) => {
|
|
811
|
+
const num = p.checked ? 1 : p.indeterminate ? 0.5 : 0;
|
|
812
|
+
return c + num;
|
|
813
|
+
}, 0);
|
|
814
|
+
this.checked = this.loaded && this.children.filter((child) => !child.isDisabled).every((child) => child.loaded && child.checked) && checked;
|
|
815
|
+
this.indeterminate = this.loaded && checkedNum !== totalNum && checkedNum > 0;
|
|
816
|
+
}
|
|
817
|
+
doCheck(checked) {
|
|
818
|
+
if (this.checked === checked) return;
|
|
819
|
+
const { checkStrictly, multiple } = this.config;
|
|
820
|
+
if (checkStrictly || !multiple) {
|
|
821
|
+
this.checked = checked;
|
|
822
|
+
} else {
|
|
823
|
+
this.broadcast("check", checked);
|
|
824
|
+
this.setCheckState(checked);
|
|
825
|
+
this.emit("check");
|
|
826
|
+
}
|
|
827
|
+
}
|
|
828
|
+
}
|
|
829
|
+
const flatNodes = (nodes, leafOnly) => {
|
|
830
|
+
return nodes.reduce((res, node) => {
|
|
831
|
+
if (node.isLeaf) {
|
|
832
|
+
res.push(node);
|
|
833
|
+
} else {
|
|
834
|
+
!leafOnly && res.push(node);
|
|
835
|
+
res = res.concat(flatNodes(node.children, leafOnly));
|
|
836
|
+
}
|
|
837
|
+
return res;
|
|
838
|
+
}, []);
|
|
839
|
+
};
|
|
840
|
+
class Store {
|
|
841
|
+
constructor(data, config) {
|
|
842
|
+
__publicField(this, "config");
|
|
843
|
+
__publicField(this, "nodes");
|
|
844
|
+
__publicField(this, "allNodes");
|
|
845
|
+
__publicField(this, "leafNodes");
|
|
846
|
+
__publicField(this, "valueNodeMap");
|
|
847
|
+
__publicField(this, "pathNodeMap");
|
|
848
|
+
this.config = config;
|
|
849
|
+
const nodes = (data || []).map((nodeData) => new Node(nodeData, this.config));
|
|
850
|
+
this.nodes = nodes;
|
|
851
|
+
this.allNodes = flatNodes(nodes, false);
|
|
852
|
+
this.leafNodes = flatNodes(nodes, true);
|
|
853
|
+
this.valueNodeMap = /* @__PURE__ */ new Map();
|
|
854
|
+
this.pathNodeMap = /* @__PURE__ */ new Map();
|
|
855
|
+
this.allNodes.forEach((node) => this.cacheNode(node));
|
|
856
|
+
}
|
|
857
|
+
cacheNode(node) {
|
|
858
|
+
if (!this.valueNodeMap.has(node.value)) {
|
|
859
|
+
this.valueNodeMap.set(node.value, node);
|
|
860
|
+
}
|
|
861
|
+
this.pathNodeMap.set(JSON.stringify(node.pathValues), node);
|
|
862
|
+
}
|
|
863
|
+
getNodes() {
|
|
864
|
+
return this.nodes;
|
|
865
|
+
}
|
|
866
|
+
getFlattedNodes(leafOnly) {
|
|
867
|
+
return leafOnly ? this.leafNodes : this.allNodes;
|
|
868
|
+
}
|
|
869
|
+
appendNode(nodeData, parentNode) {
|
|
870
|
+
const node = parentNode ? parentNode.appendChild(nodeData) : new Node(nodeData, this.config);
|
|
871
|
+
if (!parentNode) this.nodes.push(node);
|
|
872
|
+
this.allNodes.push(node);
|
|
873
|
+
node.isLeaf && this.leafNodes.push(node);
|
|
874
|
+
this.cacheNode(node);
|
|
875
|
+
}
|
|
876
|
+
appendNodes(nodeDataList, parentNode) {
|
|
877
|
+
nodeDataList.forEach((nodeData) => this.appendNode(nodeData, parentNode));
|
|
878
|
+
}
|
|
879
|
+
// when checkStrictly, leaf node first
|
|
880
|
+
getNodeByValue(value, leafOnly = false) {
|
|
881
|
+
if (!value && value !== 0) return null;
|
|
882
|
+
if (Array.isArray(value)) {
|
|
883
|
+
const cachedNode = this.pathNodeMap.get(JSON.stringify(value));
|
|
884
|
+
if (cachedNode) return cachedNode;
|
|
885
|
+
} else {
|
|
886
|
+
const cachedNode = this.valueNodeMap.get(value);
|
|
887
|
+
if (cachedNode) return cachedNode;
|
|
888
|
+
}
|
|
889
|
+
const node = this.getFlattedNodes(leafOnly).find(
|
|
890
|
+
(node2) => isEqual(node2.value, value) || isEqual(node2.pathValues, value)
|
|
891
|
+
);
|
|
892
|
+
return node || null;
|
|
893
|
+
}
|
|
894
|
+
getSameNode(node) {
|
|
895
|
+
if (!node) return null;
|
|
896
|
+
const node_ = this.getFlattedNodes(false).find(
|
|
897
|
+
({ value, level }) => isEqual(node.value, value) && node.level === level
|
|
898
|
+
);
|
|
899
|
+
return node_ || null;
|
|
900
|
+
}
|
|
901
|
+
}
|
|
902
|
+
const CommonProps = buildProps({
|
|
903
|
+
/**
|
|
904
|
+
* @description specify which key of node object is used as the node's value
|
|
905
|
+
*/
|
|
906
|
+
modelValue: {
|
|
907
|
+
type: definePropType([Number, String, Array])
|
|
908
|
+
},
|
|
909
|
+
/**
|
|
910
|
+
* @description data of the options, the key of `value` and `label` can be customize by `CascaderProps`.
|
|
911
|
+
*/
|
|
912
|
+
options: {
|
|
913
|
+
type: definePropType(Array),
|
|
914
|
+
default: () => []
|
|
915
|
+
},
|
|
916
|
+
/**
|
|
917
|
+
* @description configuration options, see the following `CascaderProps` table.
|
|
918
|
+
*/
|
|
919
|
+
props: {
|
|
920
|
+
type: definePropType(Object),
|
|
921
|
+
default: () => ({})
|
|
922
|
+
}
|
|
923
|
+
});
|
|
924
|
+
const DefaultProps = {
|
|
925
|
+
/**
|
|
926
|
+
* @description trigger mode of expanding options
|
|
927
|
+
*/
|
|
928
|
+
expandTrigger: "click",
|
|
929
|
+
/**
|
|
930
|
+
* @description whether multiple selection is enabled
|
|
931
|
+
*/
|
|
932
|
+
multiple: false,
|
|
933
|
+
/**
|
|
934
|
+
* @description whether checked state of a node not affects its parent and child nodes
|
|
935
|
+
*/
|
|
936
|
+
checkStrictly: false,
|
|
937
|
+
// whether all nodes can be selected
|
|
938
|
+
/**
|
|
939
|
+
* @description when checked nodes change, whether to emit an array of node's path, if false, only emit the value of node.
|
|
940
|
+
*/
|
|
941
|
+
emitPath: true,
|
|
942
|
+
// wether to emit an array of all levels value in which node is located
|
|
943
|
+
/**
|
|
944
|
+
* @description whether to dynamic load child nodes, use with `lazyload` attribute
|
|
945
|
+
*/
|
|
946
|
+
lazy: false,
|
|
947
|
+
/**
|
|
948
|
+
* @description method for loading child nodes data, only works when `lazy` is true
|
|
949
|
+
*/
|
|
950
|
+
lazyLoad: NOOP,
|
|
951
|
+
/**
|
|
952
|
+
* @description specify which key of node object is used as the node's value
|
|
953
|
+
*/
|
|
954
|
+
value: "value",
|
|
955
|
+
/**
|
|
956
|
+
* @description specify which key of node object is used as the node's label
|
|
957
|
+
*/
|
|
958
|
+
label: "label",
|
|
959
|
+
/**
|
|
960
|
+
* @description specify which key of node object is used as the node's children
|
|
961
|
+
*/
|
|
962
|
+
children: "children",
|
|
963
|
+
/**
|
|
964
|
+
* @description specify which key of node object is used as the node's leaf
|
|
965
|
+
*/
|
|
966
|
+
leaf: "leaf",
|
|
967
|
+
/**
|
|
968
|
+
* @description specify which key of node object is used as the node's disabled
|
|
969
|
+
*/
|
|
970
|
+
disabled: "disabled",
|
|
971
|
+
/**
|
|
972
|
+
* @description hover threshold of expanding options
|
|
973
|
+
*/
|
|
974
|
+
hoverThreshold: 500
|
|
975
|
+
};
|
|
976
|
+
const useCascaderConfig = (props) => {
|
|
977
|
+
return computed(() => __spreadValues(__spreadValues({}, DefaultProps), props.props));
|
|
978
|
+
};
|
|
979
|
+
const getMenuIndex = (el) => {
|
|
980
|
+
if (!el) return 0;
|
|
981
|
+
const pieces = el.id.split("-");
|
|
982
|
+
return Number(pieces[pieces.length - 2]);
|
|
983
|
+
};
|
|
984
|
+
const checkNode = (el) => {
|
|
985
|
+
if (!el) return;
|
|
986
|
+
const input = el.querySelector("input");
|
|
987
|
+
if (input) {
|
|
988
|
+
input.click();
|
|
989
|
+
} else if (isLeaf(el)) {
|
|
990
|
+
el.click();
|
|
991
|
+
}
|
|
992
|
+
};
|
|
993
|
+
const sortByOriginalOrder = (oldNodes, newNodes) => {
|
|
994
|
+
const newNodesCopy = newNodes.slice(0);
|
|
995
|
+
const newIds = newNodesCopy.map((node) => node.uid);
|
|
996
|
+
const res = oldNodes.reduce((acc, item) => {
|
|
997
|
+
const index = newIds.indexOf(item.uid);
|
|
998
|
+
if (index > -1) {
|
|
999
|
+
acc.push(item);
|
|
1000
|
+
newNodesCopy.splice(index, 1);
|
|
1001
|
+
newIds.splice(index, 1);
|
|
1002
|
+
}
|
|
1003
|
+
return acc;
|
|
1004
|
+
}, []);
|
|
1005
|
+
res.push(...newNodesCopy);
|
|
1006
|
+
return res;
|
|
1007
|
+
};
|
|
1008
|
+
const _sfc_main$2 = defineComponent({
|
|
1009
|
+
name: "ElCascaderPanel",
|
|
1010
|
+
components: {
|
|
1011
|
+
CustomCascaderMenu
|
|
1012
|
+
},
|
|
1013
|
+
props: __spreadProps(__spreadValues({}, CommonProps), {
|
|
1014
|
+
border: {
|
|
1015
|
+
type: Boolean,
|
|
1016
|
+
default: true
|
|
1017
|
+
},
|
|
1018
|
+
inputWidth: {
|
|
1019
|
+
type: Number,
|
|
1020
|
+
default: 0
|
|
1021
|
+
},
|
|
1022
|
+
renderLabel: Function
|
|
1023
|
+
}),
|
|
1024
|
+
emits: [UPDATE_MODEL_EVENT, CHANGE_EVENT, "close", "expand-change"],
|
|
1025
|
+
setup(props, { emit, slots }) {
|
|
1026
|
+
let manualChecked = false;
|
|
1027
|
+
const ns = useNamespace("cascader");
|
|
1028
|
+
const config = useCascaderConfig(props);
|
|
1029
|
+
let store = null;
|
|
1030
|
+
const initialLoaded = ref(true);
|
|
1031
|
+
const menuList = ref([]);
|
|
1032
|
+
const menuRenderKey = ref(0);
|
|
1033
|
+
const checkedValue = ref(null);
|
|
1034
|
+
const menus = ref([]);
|
|
1035
|
+
const expandingNode = ref(null);
|
|
1036
|
+
const checkedNodes = ref([]);
|
|
1037
|
+
const isHoverMenu = computed(() => config.value.expandTrigger === "hover");
|
|
1038
|
+
const renderLabelFn = computed(() => props.renderLabel || slots.default);
|
|
1039
|
+
const getMenuScrollElement = (menu) => {
|
|
1040
|
+
var _a, _b;
|
|
1041
|
+
const el = menu == null ? void 0 : menu.$el;
|
|
1042
|
+
return ((_a = el == null ? void 0 : el.classList) == null ? void 0 : _a.contains("vue-recycle-scroller")) ? el : ((_b = el == null ? void 0 : el.querySelector) == null ? void 0 : _b.call(el, ".vue-recycle-scroller")) || el;
|
|
1043
|
+
};
|
|
1044
|
+
const forceRenderMenus = (keepScroll = true) => {
|
|
1045
|
+
const scrollTops = keepScroll ? menuList.value.map((menu) => {
|
|
1046
|
+
var _a;
|
|
1047
|
+
return ((_a = getMenuScrollElement(menu)) == null ? void 0 : _a.scrollTop) || 0;
|
|
1048
|
+
}) : [];
|
|
1049
|
+
menuRenderKey.value++;
|
|
1050
|
+
if (!keepScroll) return;
|
|
1051
|
+
const restoreScroll = () => {
|
|
1052
|
+
menuList.value.forEach((menu, index) => {
|
|
1053
|
+
const scrollElement = getMenuScrollElement(menu);
|
|
1054
|
+
if (scrollElement) {
|
|
1055
|
+
scrollElement.scrollTop = scrollTops[index] || 0;
|
|
1056
|
+
}
|
|
1057
|
+
});
|
|
1058
|
+
};
|
|
1059
|
+
nextTick(() => {
|
|
1060
|
+
restoreScroll();
|
|
1061
|
+
isClient && requestAnimationFrame(restoreScroll);
|
|
1062
|
+
});
|
|
1063
|
+
};
|
|
1064
|
+
const initStore = () => {
|
|
1065
|
+
const { options } = props;
|
|
1066
|
+
const cfg = config.value;
|
|
1067
|
+
manualChecked = false;
|
|
1068
|
+
store = new Store(options, cfg);
|
|
1069
|
+
menus.value = [store.getNodes()];
|
|
1070
|
+
if (cfg.lazy && isEmpty(props.options)) {
|
|
1071
|
+
initialLoaded.value = false;
|
|
1072
|
+
lazyLoad(void 0, (list) => {
|
|
1073
|
+
if (list) {
|
|
1074
|
+
store = new Store(list, cfg);
|
|
1075
|
+
menus.value = [store.getNodes()];
|
|
1076
|
+
}
|
|
1077
|
+
initialLoaded.value = true;
|
|
1078
|
+
syncCheckedValue(false, true);
|
|
1079
|
+
});
|
|
1080
|
+
} else {
|
|
1081
|
+
syncCheckedValue(false, true);
|
|
1082
|
+
}
|
|
1083
|
+
};
|
|
1084
|
+
const lazyLoad = (node, cb) => {
|
|
1085
|
+
const cfg = config.value;
|
|
1086
|
+
node = node || new Node({}, cfg, void 0, true);
|
|
1087
|
+
node.loading = true;
|
|
1088
|
+
const resolve = (dataList) => {
|
|
1089
|
+
const _node = node;
|
|
1090
|
+
const parent = _node.root ? null : _node;
|
|
1091
|
+
dataList && (store == null ? void 0 : store.appendNodes(dataList, parent));
|
|
1092
|
+
_node.loading = false;
|
|
1093
|
+
_node.loaded = true;
|
|
1094
|
+
_node.childrenData = _node.childrenData || [];
|
|
1095
|
+
cb && cb(dataList);
|
|
1096
|
+
};
|
|
1097
|
+
cfg.lazyLoad(node, resolve);
|
|
1098
|
+
};
|
|
1099
|
+
const expandNode = (node, silent) => {
|
|
1100
|
+
var _a;
|
|
1101
|
+
const { level } = node;
|
|
1102
|
+
const newMenus = menus.value.slice(0, level);
|
|
1103
|
+
let newExpandingNode;
|
|
1104
|
+
if (node.isLeaf) {
|
|
1105
|
+
newExpandingNode = node.pathNodes[level - 2];
|
|
1106
|
+
} else {
|
|
1107
|
+
newExpandingNode = node;
|
|
1108
|
+
newMenus.push(node.children);
|
|
1109
|
+
}
|
|
1110
|
+
if (((_a = expandingNode.value) == null ? void 0 : _a.uid) !== (newExpandingNode == null ? void 0 : newExpandingNode.uid)) {
|
|
1111
|
+
expandingNode.value = node;
|
|
1112
|
+
menus.value = newMenus;
|
|
1113
|
+
!silent && emit("expand-change", (node == null ? void 0 : node.pathValues) || []);
|
|
1114
|
+
}
|
|
1115
|
+
};
|
|
1116
|
+
const handleCheckChange = (node, checked, emitClose = true) => {
|
|
1117
|
+
const { checkStrictly, multiple } = config.value;
|
|
1118
|
+
const oldNode = checkedNodes.value[0];
|
|
1119
|
+
manualChecked = true;
|
|
1120
|
+
!multiple && (oldNode == null ? void 0 : oldNode.doCheck(false));
|
|
1121
|
+
node.doCheck(checked);
|
|
1122
|
+
calculateCheckedValue();
|
|
1123
|
+
emitClose && !multiple && !checkStrictly && emit("close");
|
|
1124
|
+
!emitClose && !multiple && !checkStrictly && expandParentNode(node);
|
|
1125
|
+
};
|
|
1126
|
+
const expandParentNode = (node) => {
|
|
1127
|
+
if (!node) return;
|
|
1128
|
+
node = node.parent;
|
|
1129
|
+
expandParentNode(node);
|
|
1130
|
+
node && expandNode(node);
|
|
1131
|
+
};
|
|
1132
|
+
const getFlattedNodes = (leafOnly) => {
|
|
1133
|
+
return store == null ? void 0 : store.getFlattedNodes(leafOnly);
|
|
1134
|
+
};
|
|
1135
|
+
const getCheckedNodes = (leafOnly) => {
|
|
1136
|
+
var _a;
|
|
1137
|
+
return (_a = getFlattedNodes(leafOnly)) == null ? void 0 : _a.filter((node) => node.checked !== false);
|
|
1138
|
+
};
|
|
1139
|
+
const restoreExpandingState = (node) => {
|
|
1140
|
+
const rootNodes = (store == null ? void 0 : store.getNodes()) || [];
|
|
1141
|
+
if (!node) {
|
|
1142
|
+
expandingNode.value = null;
|
|
1143
|
+
menus.value = rootNodes.length ? [rootNodes] : [];
|
|
1144
|
+
forceRenderMenus();
|
|
1145
|
+
return;
|
|
1146
|
+
}
|
|
1147
|
+
const targetNode = node.isLeaf ? node.parent : node;
|
|
1148
|
+
if (!targetNode) {
|
|
1149
|
+
expandingNode.value = null;
|
|
1150
|
+
menus.value = rootNodes.length ? [rootNodes] : [];
|
|
1151
|
+
forceRenderMenus();
|
|
1152
|
+
return;
|
|
1153
|
+
}
|
|
1154
|
+
const newMenus = [rootNodes];
|
|
1155
|
+
targetNode.pathNodes.forEach((pathNode) => {
|
|
1156
|
+
if (!pathNode.isLeaf) {
|
|
1157
|
+
newMenus.push(pathNode.children);
|
|
1158
|
+
}
|
|
1159
|
+
});
|
|
1160
|
+
expandingNode.value = targetNode;
|
|
1161
|
+
menus.value = newMenus;
|
|
1162
|
+
forceRenderMenus();
|
|
1163
|
+
};
|
|
1164
|
+
const clearCheckedNodes = () => {
|
|
1165
|
+
var _a;
|
|
1166
|
+
(_a = getFlattedNodes(false)) == null ? void 0 : _a.forEach((node) => {
|
|
1167
|
+
node.checked = false;
|
|
1168
|
+
node.indeterminate = false;
|
|
1169
|
+
});
|
|
1170
|
+
checkedNodes.value = [];
|
|
1171
|
+
checkedValue.value = config.value.multiple ? [] : null;
|
|
1172
|
+
menus.value = store ? [store.getNodes()] : [];
|
|
1173
|
+
expandingNode.value = null;
|
|
1174
|
+
forceRenderMenus(false);
|
|
1175
|
+
emit("expand-change", []);
|
|
1176
|
+
};
|
|
1177
|
+
const calculateCheckedValue = () => {
|
|
1178
|
+
var _a;
|
|
1179
|
+
const { checkStrictly, multiple } = config.value;
|
|
1180
|
+
const oldNodes = checkedNodes.value;
|
|
1181
|
+
const newNodes = getCheckedNodes(!checkStrictly);
|
|
1182
|
+
const nodes = sortByOriginalOrder(oldNodes, newNodes);
|
|
1183
|
+
const values = nodes.map((node) => node.valueByOption);
|
|
1184
|
+
checkedNodes.value = nodes;
|
|
1185
|
+
checkedValue.value = multiple ? values : (_a = values[0]) != null ? _a : null;
|
|
1186
|
+
};
|
|
1187
|
+
const syncCheckedValue = (loaded = false, forced = false) => {
|
|
1188
|
+
const { modelValue } = props;
|
|
1189
|
+
const { lazy, multiple, checkStrictly } = config.value;
|
|
1190
|
+
const leafOnly = !checkStrictly;
|
|
1191
|
+
if (!initialLoaded.value || manualChecked || !forced && isEqual(modelValue, checkedValue.value)) return;
|
|
1192
|
+
if (lazy && !loaded) {
|
|
1193
|
+
const values = unique(flattenDeep(castArray(modelValue)));
|
|
1194
|
+
const nodes = values.map((val) => store == null ? void 0 : store.getNodeByValue(val)).filter((node) => !!node && !node.loaded && !node.loading);
|
|
1195
|
+
if (nodes.length) {
|
|
1196
|
+
nodes.forEach((node) => {
|
|
1197
|
+
lazyLoad(node, () => syncCheckedValue(false, forced));
|
|
1198
|
+
});
|
|
1199
|
+
} else {
|
|
1200
|
+
syncCheckedValue(true, forced);
|
|
1201
|
+
}
|
|
1202
|
+
} else {
|
|
1203
|
+
const values = multiple ? castArray(modelValue) : [modelValue];
|
|
1204
|
+
const nodes = unique(values.map((val) => store == null ? void 0 : store.getNodeByValue(val, leafOnly)));
|
|
1205
|
+
syncMenuState(nodes, forced);
|
|
1206
|
+
checkedValue.value = cloneDeep(modelValue);
|
|
1207
|
+
}
|
|
1208
|
+
};
|
|
1209
|
+
const syncMenuState = (newCheckedNodes, reserveExpandingState = true) => {
|
|
1210
|
+
var _a;
|
|
1211
|
+
const { checkStrictly, multiple } = config.value;
|
|
1212
|
+
const allNodes = getFlattedNodes(false) || [];
|
|
1213
|
+
const nodeMap = new Map(allNodes.map((node) => [node.uid, node]));
|
|
1214
|
+
const normalizeNode = (node) => {
|
|
1215
|
+
if (!node) return null;
|
|
1216
|
+
return nodeMap.get(node.uid) || (store == null ? void 0 : store.getSameNode(node)) || node;
|
|
1217
|
+
};
|
|
1218
|
+
const oldNodes = checkedNodes.value.map((node) => normalizeNode(node)).filter((node) => !!node);
|
|
1219
|
+
const newNodes = newCheckedNodes.map((node) => normalizeNode(node)).filter((node) => !!node && (checkStrictly || node.isLeaf));
|
|
1220
|
+
const currentExpandingNode = ((_a = expandingNode.value) == null ? void 0 : _a.isLeaf) ? expandingNode.value.parent : expandingNode.value;
|
|
1221
|
+
const oldExpandingNode = currentExpandingNode ? store == null ? void 0 : store.getSameNode(currentExpandingNode) : null;
|
|
1222
|
+
const newNodeSet = new Set(newNodes.map((node) => node.uid));
|
|
1223
|
+
const oldNodeSet = new Set(oldNodes.map((node) => node.uid));
|
|
1224
|
+
const addedNodes = newNodes.filter((node) => !oldNodeSet.has(node.uid));
|
|
1225
|
+
const removedNodes = oldNodes.filter((node) => !newNodeSet.has(node.uid));
|
|
1226
|
+
if (!addedNodes.length && !removedNodes.length) {
|
|
1227
|
+
const newExpandingNode2 = reserveExpandingState && oldExpandingNode || null;
|
|
1228
|
+
restoreExpandingState(newExpandingNode2);
|
|
1229
|
+
checkedNodes.value = newNodes;
|
|
1230
|
+
return;
|
|
1231
|
+
}
|
|
1232
|
+
const shouldBatchSync = multiple && !checkStrictly && addedNodes.length + removedNodes.length > 80;
|
|
1233
|
+
if (shouldBatchSync) {
|
|
1234
|
+
const targetNodeSet = new Set(newNodes);
|
|
1235
|
+
allNodes.forEach((node) => {
|
|
1236
|
+
node.checked = node.isLeaf ? targetNodeSet.has(node) : false;
|
|
1237
|
+
node.indeterminate = false;
|
|
1238
|
+
});
|
|
1239
|
+
allNodes.filter((node) => !node.isLeaf).sort((a, b) => b.level - a.level).forEach((node) => node.onChildCheck());
|
|
1240
|
+
forceRenderMenus();
|
|
1241
|
+
} else {
|
|
1242
|
+
removedNodes.forEach((node) => node.doCheck(false));
|
|
1243
|
+
addedNodes.forEach((node) => node.doCheck(true));
|
|
1244
|
+
}
|
|
1245
|
+
const newExpandingNode = reserveExpandingState && oldExpandingNode || newNodes[0];
|
|
1246
|
+
if (newExpandingNode) {
|
|
1247
|
+
restoreExpandingState(newExpandingNode);
|
|
1248
|
+
} else {
|
|
1249
|
+
restoreExpandingState(null);
|
|
1250
|
+
}
|
|
1251
|
+
checkedNodes.value = newNodes;
|
|
1252
|
+
};
|
|
1253
|
+
const handleKeyDown = (e) => {
|
|
1254
|
+
const target = e.target;
|
|
1255
|
+
const { code } = e;
|
|
1256
|
+
switch (code) {
|
|
1257
|
+
case EVENT_CODE.up:
|
|
1258
|
+
case EVENT_CODE.down: {
|
|
1259
|
+
e.preventDefault();
|
|
1260
|
+
const distance = code === EVENT_CODE.up ? -1 : 1;
|
|
1261
|
+
focusNode(getSibling(target, distance, `.${ns.b("node")}[tabindex="-1"]`));
|
|
1262
|
+
break;
|
|
1263
|
+
}
|
|
1264
|
+
case EVENT_CODE.left: {
|
|
1265
|
+
e.preventDefault();
|
|
1266
|
+
const preMenu = menuList.value[getMenuIndex(target) - 1];
|
|
1267
|
+
const expandedNode = preMenu == null ? void 0 : preMenu.$el.querySelector(`.${ns.b("node")}[aria-expanded="true"]`);
|
|
1268
|
+
focusNode(expandedNode);
|
|
1269
|
+
break;
|
|
1270
|
+
}
|
|
1271
|
+
case EVENT_CODE.right: {
|
|
1272
|
+
e.preventDefault();
|
|
1273
|
+
const nextMenu = menuList.value[getMenuIndex(target) + 1];
|
|
1274
|
+
const firstNode = nextMenu == null ? void 0 : nextMenu.$el.querySelector(`.${ns.b("node")}[tabindex="-1"]`);
|
|
1275
|
+
focusNode(firstNode);
|
|
1276
|
+
break;
|
|
1277
|
+
}
|
|
1278
|
+
case EVENT_CODE.enter:
|
|
1279
|
+
checkNode(target);
|
|
1280
|
+
break;
|
|
1281
|
+
}
|
|
1282
|
+
};
|
|
1283
|
+
provide(
|
|
1284
|
+
CASCADER_PANEL_INJECTION_KEY,
|
|
1285
|
+
reactive({
|
|
1286
|
+
config,
|
|
1287
|
+
expandingNode,
|
|
1288
|
+
checkedNodes,
|
|
1289
|
+
isHoverMenu,
|
|
1290
|
+
initialLoaded,
|
|
1291
|
+
renderLabelFn,
|
|
1292
|
+
lazyLoad,
|
|
1293
|
+
expandNode,
|
|
1294
|
+
handleCheckChange
|
|
1295
|
+
})
|
|
1296
|
+
);
|
|
1297
|
+
watch([config, () => props.options], initStore, {
|
|
1298
|
+
deep: true,
|
|
1299
|
+
immediate: true
|
|
1300
|
+
});
|
|
1301
|
+
watch(
|
|
1302
|
+
() => props.modelValue,
|
|
1303
|
+
() => {
|
|
1304
|
+
manualChecked = false;
|
|
1305
|
+
syncCheckedValue();
|
|
1306
|
+
},
|
|
1307
|
+
{
|
|
1308
|
+
deep: true
|
|
1309
|
+
}
|
|
1310
|
+
);
|
|
1311
|
+
watch(
|
|
1312
|
+
() => checkedValue.value,
|
|
1313
|
+
(val) => {
|
|
1314
|
+
if (!isEqual(val, props.modelValue)) {
|
|
1315
|
+
emit(UPDATE_MODEL_EVENT, val);
|
|
1316
|
+
emit(CHANGE_EVENT, val);
|
|
1317
|
+
}
|
|
1318
|
+
}
|
|
1319
|
+
);
|
|
1320
|
+
onBeforeUpdate(() => menuList.value = []);
|
|
1321
|
+
onMounted(() => !isEmpty(props.modelValue) && syncCheckedValue());
|
|
1322
|
+
return {
|
|
1323
|
+
ns,
|
|
1324
|
+
menuList,
|
|
1325
|
+
menuRenderKey,
|
|
1326
|
+
menus,
|
|
1327
|
+
checkedNodes,
|
|
1328
|
+
handleKeyDown,
|
|
1329
|
+
handleCheckChange,
|
|
1330
|
+
getFlattedNodes,
|
|
1331
|
+
/**
|
|
1332
|
+
* @description get an array of currently selected node,(leafOnly) whether only return the leaf checked nodes, default is `false`
|
|
1333
|
+
*/
|
|
1334
|
+
getCheckedNodes,
|
|
1335
|
+
/**
|
|
1336
|
+
* @description clear checked nodes
|
|
1337
|
+
*/
|
|
1338
|
+
clearCheckedNodes,
|
|
1339
|
+
calculateCheckedValue
|
|
1340
|
+
};
|
|
1341
|
+
}
|
|
1342
|
+
});
|
|
1343
|
+
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
|
|
1344
|
+
var _a;
|
|
1345
|
+
const _component_custom_cascader_menu = resolveComponent("custom-cascader-menu");
|
|
1346
|
+
return openBlock(), createElementBlock("div", {
|
|
1347
|
+
class: normalizeClass([_ctx.ns.b("panel"), _ctx.ns.is("bordered", _ctx.border)]),
|
|
1348
|
+
onKeydown: _cache[0] || (_cache[0] = (...args) => _ctx.handleKeyDown && _ctx.handleKeyDown(...args))
|
|
1349
|
+
}, [
|
|
1350
|
+
((_a = _ctx.options) == null ? void 0 : _a.length) ? (openBlock(true), createElementBlock(Fragment, { key: 0 }, renderList(_ctx.menus, (menu, index) => {
|
|
1351
|
+
return openBlock(), createBlock(_component_custom_cascader_menu, {
|
|
1352
|
+
key: `${index}-${_ctx.menuRenderKey}`,
|
|
1353
|
+
ref_for: true,
|
|
1354
|
+
ref: (item) => _ctx.menuList[index] = item,
|
|
1355
|
+
index,
|
|
1356
|
+
nodes: [...menu]
|
|
1357
|
+
}, null, 8, ["index", "nodes"]);
|
|
1358
|
+
}), 128)) : (openBlock(), createElementBlock("div", {
|
|
1359
|
+
key: 1,
|
|
1360
|
+
class: "empty-panel",
|
|
1361
|
+
style: normalizeStyle(_ctx.inputWidth ? { width: _ctx.inputWidth + "px" } : {})
|
|
1362
|
+
}, [..._cache[1] || (_cache[1] = [
|
|
1363
|
+
createElementVNode("p", null, "暂无数据", -1)
|
|
1364
|
+
])], 4))
|
|
1365
|
+
], 34);
|
|
1366
|
+
}
|
|
1367
|
+
const ElCascaderPanelV2 = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["render", _sfc_render]]);
|
|
1368
|
+
const cascaderProps = buildProps(__spreadProps(__spreadValues({}, CommonProps$1), {
|
|
1369
|
+
/**
|
|
1370
|
+
* @description size of input
|
|
1371
|
+
*/
|
|
1372
|
+
size: useSizeProp,
|
|
1373
|
+
/**
|
|
1374
|
+
* @description placeholder of input
|
|
1375
|
+
*/
|
|
1376
|
+
placeholder: String,
|
|
1377
|
+
/**
|
|
1378
|
+
* @description whether Cascader is disabled
|
|
1379
|
+
*/
|
|
1380
|
+
disabled: Boolean,
|
|
1381
|
+
/**
|
|
1382
|
+
* @description whether selected value can be cleared
|
|
1383
|
+
*/
|
|
1384
|
+
clearable: Boolean,
|
|
1385
|
+
/**
|
|
1386
|
+
* @description whether the options can be searched
|
|
1387
|
+
*/
|
|
1388
|
+
filterable: Boolean,
|
|
1389
|
+
/**
|
|
1390
|
+
* @description customize search logic, the first parameter is `node`, the second is `keyword`, and need return a boolean value indicating whether it hits.
|
|
1391
|
+
*/
|
|
1392
|
+
filterMethod: {
|
|
1393
|
+
type: definePropType(Function),
|
|
1394
|
+
default: (node, keyword) => node.text.includes(keyword)
|
|
1395
|
+
},
|
|
1396
|
+
/**
|
|
1397
|
+
* @description option label separator
|
|
1398
|
+
*/
|
|
1399
|
+
separator: {
|
|
1400
|
+
type: String,
|
|
1401
|
+
default: " / "
|
|
1402
|
+
},
|
|
1403
|
+
/**
|
|
1404
|
+
* @description whether to display all levels of the selected value in the input
|
|
1405
|
+
*/
|
|
1406
|
+
showAllLevels: {
|
|
1407
|
+
type: Boolean,
|
|
1408
|
+
default: true
|
|
1409
|
+
},
|
|
1410
|
+
/**
|
|
1411
|
+
* @description whether to collapse tags in multiple selection mode
|
|
1412
|
+
*/
|
|
1413
|
+
collapseTags: Boolean,
|
|
1414
|
+
/**
|
|
1415
|
+
* @description The max tags number to be shown. To use this, collapse-tags must be true
|
|
1416
|
+
*/
|
|
1417
|
+
maxCollapseTags: {
|
|
1418
|
+
type: Number,
|
|
1419
|
+
default: 1
|
|
1420
|
+
},
|
|
1421
|
+
/**
|
|
1422
|
+
* @description native input id
|
|
1423
|
+
*/
|
|
1424
|
+
collapseTagsTooltip: {
|
|
1425
|
+
type: Boolean,
|
|
1426
|
+
default: false
|
|
1427
|
+
},
|
|
1428
|
+
/**
|
|
1429
|
+
* @description max height of collapsed tags tooltip
|
|
1430
|
+
*/
|
|
1431
|
+
maxCollapseTagsTooltipHeight: {
|
|
1432
|
+
type: definePropType([String, Number]),
|
|
1433
|
+
default: 260
|
|
1434
|
+
},
|
|
1435
|
+
/**
|
|
1436
|
+
* @description debounce delay when typing filter keyword, in milliseconds
|
|
1437
|
+
*/
|
|
1438
|
+
debounce: {
|
|
1439
|
+
type: Number,
|
|
1440
|
+
default: 300
|
|
1441
|
+
},
|
|
1442
|
+
/**
|
|
1443
|
+
* @description hook function before filtering with the value to be filtered as its parameter. If `false` is returned or a `Promise` is returned and then is rejected, filtering will be aborted
|
|
1444
|
+
*/
|
|
1445
|
+
beforeFilter: {
|
|
1446
|
+
type: definePropType(Function),
|
|
1447
|
+
default: () => true
|
|
1448
|
+
},
|
|
1449
|
+
/**
|
|
1450
|
+
* @description custom class name for Cascader's dropdown
|
|
1451
|
+
*/
|
|
1452
|
+
popperClass: {
|
|
1453
|
+
type: String,
|
|
1454
|
+
default: ""
|
|
1455
|
+
},
|
|
1456
|
+
/**
|
|
1457
|
+
* @description whether cascader popup is teleported
|
|
1458
|
+
*/
|
|
1459
|
+
teleported: useTooltipContentProps.teleported,
|
|
1460
|
+
/**
|
|
1461
|
+
* @description tag type
|
|
1462
|
+
*/
|
|
1463
|
+
tagType: __spreadProps(__spreadValues({}, tagProps.type), { default: "info" }),
|
|
1464
|
+
/**
|
|
1465
|
+
* @description whether to trigger form validation
|
|
1466
|
+
*/
|
|
1467
|
+
validateEvent: {
|
|
1468
|
+
type: Boolean,
|
|
1469
|
+
default: true
|
|
1470
|
+
}
|
|
1471
|
+
}));
|
|
1472
|
+
const cascaderEmits = {
|
|
1473
|
+
[UPDATE_MODEL_EVENT]: (val) => !!val || val === null,
|
|
1474
|
+
[CHANGE_EVENT]: (val) => !!val || val === null,
|
|
1475
|
+
focus: (evt) => evt instanceof FocusEvent,
|
|
1476
|
+
blur: (evt) => evt instanceof FocusEvent,
|
|
1477
|
+
visibleChange: (val) => isBoolean(val),
|
|
1478
|
+
expandChange: (val) => !!val,
|
|
1479
|
+
removeTag: (val) => !!val
|
|
1480
|
+
};
|
|
1481
|
+
const _hoisted_1 = { key: 0 };
|
|
1482
|
+
const _hoisted_2 = ["placeholder"];
|
|
1483
|
+
const _hoisted_3 = ["onClick"];
|
|
1484
|
+
const COMPONENT_NAME = "ElCascader";
|
|
1485
|
+
const _sfc_main$1 = /* @__PURE__ */ defineComponent(__spreadProps(__spreadValues({}, {
|
|
1486
|
+
name: COMPONENT_NAME
|
|
1487
|
+
}), {
|
|
1488
|
+
__name: "ElCascader",
|
|
1489
|
+
props: cascaderProps,
|
|
1490
|
+
emits: cascaderEmits,
|
|
1491
|
+
setup(__props, { expose: __expose, emit: __emit }) {
|
|
1492
|
+
const popperOptions = {
|
|
1493
|
+
modifiers: [
|
|
1494
|
+
{
|
|
1495
|
+
name: "arrowPosition",
|
|
1496
|
+
enabled: true,
|
|
1497
|
+
phase: "main",
|
|
1498
|
+
fn: ({ state }) => {
|
|
1499
|
+
const { modifiersData, placement } = state;
|
|
1500
|
+
if (["right", "left", "bottom", "top"].includes(placement)) return;
|
|
1501
|
+
modifiersData.arrow.x = 35;
|
|
1502
|
+
},
|
|
1503
|
+
requires: ["arrow"]
|
|
1504
|
+
}
|
|
1505
|
+
]
|
|
1506
|
+
};
|
|
1507
|
+
const props = __props;
|
|
1508
|
+
const emit = __emit;
|
|
1509
|
+
const attrs = useAttrs();
|
|
1510
|
+
let inputInitialHeight = 0;
|
|
1511
|
+
let pressDeleteCount = 0;
|
|
1512
|
+
const nsCascader = useNamespace("cascader");
|
|
1513
|
+
const nsInput = useNamespace("input");
|
|
1514
|
+
const { t } = useLocale();
|
|
1515
|
+
const { form, formItem } = useFormItem();
|
|
1516
|
+
const tooltipRef = ref(null);
|
|
1517
|
+
const input = ref(null);
|
|
1518
|
+
const tagWrapper = ref(null);
|
|
1519
|
+
const cascaderPanelRef = ref(null);
|
|
1520
|
+
const suggestionPanel = ref(null);
|
|
1521
|
+
const popperVisible = ref(false);
|
|
1522
|
+
const inputHover = ref(false);
|
|
1523
|
+
const filtering = ref(false);
|
|
1524
|
+
const filterFocus = ref(false);
|
|
1525
|
+
const inputValue = ref("");
|
|
1526
|
+
const searchInputValue = ref("");
|
|
1527
|
+
const presentTags = ref([]);
|
|
1528
|
+
const allPresentTags = ref([]);
|
|
1529
|
+
const suggestions = ref([]);
|
|
1530
|
+
const isOnComposition = ref(false);
|
|
1531
|
+
const inputWidth = ref();
|
|
1532
|
+
const cascaderStyle = computed(() => {
|
|
1533
|
+
return attrs.style;
|
|
1534
|
+
});
|
|
1535
|
+
const isDisabled = computed(() => props.disabled || (form == null ? void 0 : form.disabled));
|
|
1536
|
+
const inputPlaceholder = computed(() => props.placeholder || t("el.cascader.placeholder"));
|
|
1537
|
+
const currentPlaceholder = computed(() => searchInputValue.value || presentTags.value.length > 0 || isOnComposition.value ? "" : inputPlaceholder.value);
|
|
1538
|
+
const realSize = useFormSize();
|
|
1539
|
+
const tagSize = computed(() => ["small"].includes(realSize.value) ? "small" : "default");
|
|
1540
|
+
const multiple = computed(() => !!props.props.multiple);
|
|
1541
|
+
const readonly = computed(() => !props.filterable || multiple.value);
|
|
1542
|
+
const searchKeyword = computed(() => multiple.value ? searchInputValue.value : inputValue.value);
|
|
1543
|
+
const checkedNodes = computed(() => {
|
|
1544
|
+
var _a;
|
|
1545
|
+
return ((_a = cascaderPanelRef.value) == null ? void 0 : _a.checkedNodes) || [];
|
|
1546
|
+
});
|
|
1547
|
+
const clearBtnVisible = computed(() => {
|
|
1548
|
+
if (!props.clearable || isDisabled.value || filtering.value || !inputHover.value) return false;
|
|
1549
|
+
return !!checkedNodes.value.length;
|
|
1550
|
+
});
|
|
1551
|
+
const presentText = computed(() => {
|
|
1552
|
+
const { showAllLevels, separator } = props;
|
|
1553
|
+
const nodes = checkedNodes.value;
|
|
1554
|
+
return nodes.length ? multiple.value ? "" : nodes[0].calcText(showAllLevels, separator) : "";
|
|
1555
|
+
});
|
|
1556
|
+
const checkedValue = computed({
|
|
1557
|
+
get() {
|
|
1558
|
+
return cloneDeep(props.modelValue);
|
|
1559
|
+
},
|
|
1560
|
+
set(val) {
|
|
1561
|
+
emit(UPDATE_MODEL_EVENT, val);
|
|
1562
|
+
emit(CHANGE_EVENT, val);
|
|
1563
|
+
if (props.validateEvent) {
|
|
1564
|
+
formItem == null ? void 0 : formItem.validate("change").catch((err) => debugWarn(err));
|
|
1565
|
+
}
|
|
1566
|
+
}
|
|
1567
|
+
});
|
|
1568
|
+
const cascaderKls = computed(() => {
|
|
1569
|
+
return [nsCascader.b(), nsCascader.m(realSize.value), nsCascader.is("disabled", isDisabled.value), attrs.class];
|
|
1570
|
+
});
|
|
1571
|
+
const cascaderIconKls = computed(() => {
|
|
1572
|
+
return [nsInput.e("icon"), "icon-arrow-down", nsCascader.is("reverse", popperVisible.value)];
|
|
1573
|
+
});
|
|
1574
|
+
const inputClass = computed(() => {
|
|
1575
|
+
return nsCascader.is("focus", popperVisible.value || filterFocus.value);
|
|
1576
|
+
});
|
|
1577
|
+
const collapseTagsTooltipContentStyle = computed(() => {
|
|
1578
|
+
const maxHeight = props.maxCollapseTagsTooltipHeight;
|
|
1579
|
+
if (!maxHeight) return void 0;
|
|
1580
|
+
return {
|
|
1581
|
+
maxHeight: addUnit(maxHeight),
|
|
1582
|
+
overflowY: "auto",
|
|
1583
|
+
overflowX: "hidden"
|
|
1584
|
+
};
|
|
1585
|
+
});
|
|
1586
|
+
const contentRef = computed(() => {
|
|
1587
|
+
var _a, _b;
|
|
1588
|
+
return (_b = (_a = tooltipRef.value) == null ? void 0 : _a.popperRef) == null ? void 0 : _b.contentRef;
|
|
1589
|
+
});
|
|
1590
|
+
const togglePopperVisible = (visible) => {
|
|
1591
|
+
var _a, _b;
|
|
1592
|
+
if (isDisabled.value) return;
|
|
1593
|
+
visible = visible != null ? visible : !popperVisible.value;
|
|
1594
|
+
if (visible !== popperVisible.value) {
|
|
1595
|
+
popperVisible.value = visible;
|
|
1596
|
+
(_b = (_a = input.value) == null ? void 0 : _a.input) == null ? void 0 : _b.setAttribute("aria-expanded", `${visible}`);
|
|
1597
|
+
if (visible) {
|
|
1598
|
+
updatePopperPosition();
|
|
1599
|
+
} else if (props.filterable) {
|
|
1600
|
+
syncPresentTextValue();
|
|
1601
|
+
}
|
|
1602
|
+
emit("visibleChange", visible);
|
|
1603
|
+
}
|
|
1604
|
+
};
|
|
1605
|
+
const updatePopperPosition = () => {
|
|
1606
|
+
nextTick(() => {
|
|
1607
|
+
var _a;
|
|
1608
|
+
(_a = tooltipRef.value) == null ? void 0 : _a.updatePopper();
|
|
1609
|
+
});
|
|
1610
|
+
};
|
|
1611
|
+
const hideSuggestionPanel = () => {
|
|
1612
|
+
filtering.value = false;
|
|
1613
|
+
};
|
|
1614
|
+
const genTag = (node) => {
|
|
1615
|
+
const { showAllLevels, separator } = props;
|
|
1616
|
+
return {
|
|
1617
|
+
node,
|
|
1618
|
+
key: node.uid,
|
|
1619
|
+
text: node.calcText(showAllLevels, separator),
|
|
1620
|
+
hitState: false,
|
|
1621
|
+
closable: !isDisabled.value && !node.isDisabled,
|
|
1622
|
+
isCollapseTag: false
|
|
1623
|
+
};
|
|
1624
|
+
};
|
|
1625
|
+
const deleteTag = (tag) => {
|
|
1626
|
+
var _a;
|
|
1627
|
+
const node = tag.node;
|
|
1628
|
+
node.doCheck(false);
|
|
1629
|
+
(_a = cascaderPanelRef.value) == null ? void 0 : _a.calculateCheckedValue();
|
|
1630
|
+
emit("removeTag", node.valueByOption);
|
|
1631
|
+
};
|
|
1632
|
+
const calculatePresentTags = () => {
|
|
1633
|
+
if (!multiple.value) return;
|
|
1634
|
+
const nodes = checkedNodes.value;
|
|
1635
|
+
const tags = [];
|
|
1636
|
+
const allTags = [];
|
|
1637
|
+
nodes.forEach((node) => allTags.push(genTag(node)));
|
|
1638
|
+
allPresentTags.value = allTags;
|
|
1639
|
+
if (nodes.length) {
|
|
1640
|
+
nodes.slice(0, props.maxCollapseTags).forEach((node) => tags.push(genTag(node)));
|
|
1641
|
+
const rest = nodes.slice(props.maxCollapseTags);
|
|
1642
|
+
const restCount = rest.length;
|
|
1643
|
+
if (restCount) {
|
|
1644
|
+
if (props.collapseTags) {
|
|
1645
|
+
tags.push({
|
|
1646
|
+
key: -1,
|
|
1647
|
+
text: `+ ${restCount}`,
|
|
1648
|
+
closable: false,
|
|
1649
|
+
isCollapseTag: true
|
|
1650
|
+
});
|
|
1651
|
+
} else {
|
|
1652
|
+
rest.forEach((node) => tags.push(genTag(node)));
|
|
1653
|
+
}
|
|
1654
|
+
}
|
|
1655
|
+
}
|
|
1656
|
+
presentTags.value = tags;
|
|
1657
|
+
};
|
|
1658
|
+
const calculateSuggestions = () => {
|
|
1659
|
+
var _a, _b;
|
|
1660
|
+
const { filterMethod, showAllLevels, separator } = props;
|
|
1661
|
+
const res = (_b = (_a = cascaderPanelRef.value) == null ? void 0 : _a.getFlattedNodes(!props.props.checkStrictly)) == null ? void 0 : _b.filter((node) => {
|
|
1662
|
+
if (node.isDisabled) return false;
|
|
1663
|
+
node.calcText(showAllLevels, separator);
|
|
1664
|
+
return filterMethod(node, searchKeyword.value);
|
|
1665
|
+
});
|
|
1666
|
+
if (multiple.value) {
|
|
1667
|
+
presentTags.value.forEach((tag) => {
|
|
1668
|
+
tag.hitState = false;
|
|
1669
|
+
});
|
|
1670
|
+
allPresentTags.value.forEach((tag) => {
|
|
1671
|
+
tag.hitState = false;
|
|
1672
|
+
});
|
|
1673
|
+
}
|
|
1674
|
+
filtering.value = true;
|
|
1675
|
+
suggestions.value = res;
|
|
1676
|
+
updatePopperPosition();
|
|
1677
|
+
};
|
|
1678
|
+
const focusFirstNode = () => {
|
|
1679
|
+
var _a;
|
|
1680
|
+
let firstNode;
|
|
1681
|
+
if (filtering.value && suggestionPanel.value) {
|
|
1682
|
+
firstNode = suggestionPanel.value.$el.querySelector(`.${nsCascader.e("suggestion-item")}`);
|
|
1683
|
+
} else {
|
|
1684
|
+
firstNode = (_a = cascaderPanelRef.value) == null ? void 0 : _a.$el.querySelector(`.${nsCascader.b("node")}[tabindex="-1"]`);
|
|
1685
|
+
}
|
|
1686
|
+
if (firstNode) {
|
|
1687
|
+
firstNode.focus();
|
|
1688
|
+
!filtering.value && firstNode.click();
|
|
1689
|
+
}
|
|
1690
|
+
};
|
|
1691
|
+
const updateStyle = () => {
|
|
1692
|
+
var _a, _b;
|
|
1693
|
+
const inputInner = (_a = input.value) == null ? void 0 : _a.input;
|
|
1694
|
+
const tagWrapperEl = tagWrapper.value;
|
|
1695
|
+
const suggestionPanelEl = (_b = suggestionPanel.value) == null ? void 0 : _b.$el;
|
|
1696
|
+
if (!isClient || !inputInner) return;
|
|
1697
|
+
if (suggestionPanelEl) {
|
|
1698
|
+
const suggestionList = suggestionPanelEl.querySelector(`.${nsCascader.e("suggestion-list")}`);
|
|
1699
|
+
suggestionList.style.minWidth = `${inputInner.offsetWidth}px`;
|
|
1700
|
+
inputWidth.value = inputInner.offsetWidth;
|
|
1701
|
+
}
|
|
1702
|
+
if (tagWrapperEl) {
|
|
1703
|
+
const { offsetHeight } = tagWrapperEl;
|
|
1704
|
+
const height = presentTags.value.length > 0 ? `${Math.max(offsetHeight + 6, inputInitialHeight)}px` : `${inputInitialHeight}px`;
|
|
1705
|
+
inputInner.style.height = height;
|
|
1706
|
+
updatePopperPosition();
|
|
1707
|
+
}
|
|
1708
|
+
};
|
|
1709
|
+
const getCheckedNodes = (leafOnly) => {
|
|
1710
|
+
var _a;
|
|
1711
|
+
return (_a = cascaderPanelRef.value) == null ? void 0 : _a.getCheckedNodes(leafOnly);
|
|
1712
|
+
};
|
|
1713
|
+
const handleExpandChange = (value) => {
|
|
1714
|
+
updatePopperPosition();
|
|
1715
|
+
emit("expandChange", value);
|
|
1716
|
+
};
|
|
1717
|
+
const handleComposition = (event) => {
|
|
1718
|
+
var _a;
|
|
1719
|
+
const text = (_a = event.target) == null ? void 0 : _a.value;
|
|
1720
|
+
if (event.type === "compositionend") {
|
|
1721
|
+
isOnComposition.value = false;
|
|
1722
|
+
nextTick(() => handleInput(text));
|
|
1723
|
+
} else {
|
|
1724
|
+
const lastCharacter = text[text.length - 1] || "";
|
|
1725
|
+
isOnComposition.value = !isKorean(lastCharacter);
|
|
1726
|
+
}
|
|
1727
|
+
};
|
|
1728
|
+
const handleKeyDown = (e) => {
|
|
1729
|
+
if (isOnComposition.value) return;
|
|
1730
|
+
switch (e.code) {
|
|
1731
|
+
case EVENT_CODE.enter:
|
|
1732
|
+
togglePopperVisible();
|
|
1733
|
+
break;
|
|
1734
|
+
case EVENT_CODE.down:
|
|
1735
|
+
togglePopperVisible(true);
|
|
1736
|
+
nextTick(focusFirstNode);
|
|
1737
|
+
e.preventDefault();
|
|
1738
|
+
break;
|
|
1739
|
+
case EVENT_CODE.esc:
|
|
1740
|
+
if (popperVisible.value === true) {
|
|
1741
|
+
e.preventDefault();
|
|
1742
|
+
e.stopPropagation();
|
|
1743
|
+
togglePopperVisible(false);
|
|
1744
|
+
}
|
|
1745
|
+
break;
|
|
1746
|
+
case EVENT_CODE.tab:
|
|
1747
|
+
togglePopperVisible(false);
|
|
1748
|
+
break;
|
|
1749
|
+
}
|
|
1750
|
+
};
|
|
1751
|
+
const handleClear = () => {
|
|
1752
|
+
var _a;
|
|
1753
|
+
(_a = cascaderPanelRef.value) == null ? void 0 : _a.clearCheckedNodes();
|
|
1754
|
+
if (!popperVisible.value && props.filterable) {
|
|
1755
|
+
syncPresentTextValue();
|
|
1756
|
+
}
|
|
1757
|
+
togglePopperVisible(false);
|
|
1758
|
+
};
|
|
1759
|
+
const syncPresentTextValue = () => {
|
|
1760
|
+
const { value } = presentText;
|
|
1761
|
+
inputValue.value = value;
|
|
1762
|
+
searchInputValue.value = value;
|
|
1763
|
+
};
|
|
1764
|
+
const handleSuggestionClick = (node) => {
|
|
1765
|
+
var _a, _b;
|
|
1766
|
+
const { checked } = node;
|
|
1767
|
+
if (multiple.value) {
|
|
1768
|
+
(_a = cascaderPanelRef.value) == null ? void 0 : _a.handleCheckChange(node, !checked, false);
|
|
1769
|
+
} else {
|
|
1770
|
+
!checked && ((_b = cascaderPanelRef.value) == null ? void 0 : _b.handleCheckChange(node, true, false));
|
|
1771
|
+
togglePopperVisible(false);
|
|
1772
|
+
}
|
|
1773
|
+
};
|
|
1774
|
+
const handleSuggestionKeyDown = (e) => {
|
|
1775
|
+
const target = e.target;
|
|
1776
|
+
const { code } = e;
|
|
1777
|
+
switch (code) {
|
|
1778
|
+
case EVENT_CODE.up:
|
|
1779
|
+
case EVENT_CODE.down: {
|
|
1780
|
+
const distance = code === EVENT_CODE.up ? -1 : 1;
|
|
1781
|
+
focusNode(getSibling(target, distance, `.${nsCascader.e("suggestion-item")}[tabindex="-1"]`));
|
|
1782
|
+
break;
|
|
1783
|
+
}
|
|
1784
|
+
case EVENT_CODE.enter:
|
|
1785
|
+
target.click();
|
|
1786
|
+
break;
|
|
1787
|
+
}
|
|
1788
|
+
};
|
|
1789
|
+
const handleDelete = () => {
|
|
1790
|
+
const tags = presentTags.value;
|
|
1791
|
+
const lastTag = tags[tags.length - 1];
|
|
1792
|
+
pressDeleteCount = searchInputValue.value ? 0 : pressDeleteCount + 1;
|
|
1793
|
+
if (!lastTag || !pressDeleteCount || props.collapseTags && tags.length > 1) return;
|
|
1794
|
+
if (lastTag.hitState) {
|
|
1795
|
+
deleteTag(lastTag);
|
|
1796
|
+
} else {
|
|
1797
|
+
lastTag.hitState = true;
|
|
1798
|
+
}
|
|
1799
|
+
};
|
|
1800
|
+
const handleFocus = (e) => {
|
|
1801
|
+
const el = e.target;
|
|
1802
|
+
const name = nsCascader.e("search-input");
|
|
1803
|
+
if (el.className === name) {
|
|
1804
|
+
filterFocus.value = true;
|
|
1805
|
+
}
|
|
1806
|
+
emit("focus", e);
|
|
1807
|
+
};
|
|
1808
|
+
const handleBlur = (e) => {
|
|
1809
|
+
filterFocus.value = false;
|
|
1810
|
+
emit("blur", e);
|
|
1811
|
+
};
|
|
1812
|
+
const handleFilter = debounce(() => {
|
|
1813
|
+
const { value } = searchKeyword;
|
|
1814
|
+
if (!value) return;
|
|
1815
|
+
const passed = props.beforeFilter(value);
|
|
1816
|
+
if (isPromise(passed)) {
|
|
1817
|
+
passed.then(calculateSuggestions).catch(() => {
|
|
1818
|
+
});
|
|
1819
|
+
} else if (passed !== false) {
|
|
1820
|
+
calculateSuggestions();
|
|
1821
|
+
} else {
|
|
1822
|
+
hideSuggestionPanel();
|
|
1823
|
+
}
|
|
1824
|
+
}, props.debounce);
|
|
1825
|
+
const handleInput = (val, e) => {
|
|
1826
|
+
!popperVisible.value && togglePopperVisible(true);
|
|
1827
|
+
if (e == null ? void 0 : e.isComposing) return;
|
|
1828
|
+
val = val.trim();
|
|
1829
|
+
val ? handleFilter() : hideSuggestionPanel();
|
|
1830
|
+
};
|
|
1831
|
+
const initEmptyWidth = () => {
|
|
1832
|
+
var _a;
|
|
1833
|
+
const inputInner = (_a = input.value) == null ? void 0 : _a.input;
|
|
1834
|
+
if (inputInner) {
|
|
1835
|
+
inputWidth.value = parseFloat(inputInner.offsetWidth);
|
|
1836
|
+
console.log(inputWidth.value);
|
|
1837
|
+
}
|
|
1838
|
+
};
|
|
1839
|
+
const getInputInnerHeight = (inputInner) => Number.parseFloat(useCssVar(nsInput.cssVarName("input-height"), inputInner).value) - 2;
|
|
1840
|
+
watch(filtering, updatePopperPosition);
|
|
1841
|
+
watch([checkedNodes, isDisabled], calculatePresentTags);
|
|
1842
|
+
watch(presentTags, () => {
|
|
1843
|
+
nextTick(() => updateStyle());
|
|
1844
|
+
});
|
|
1845
|
+
watch(realSize, () => __async(null, null, function* () {
|
|
1846
|
+
yield nextTick();
|
|
1847
|
+
const inputInner = input.value.input;
|
|
1848
|
+
inputInitialHeight = getInputInnerHeight(inputInner) || inputInitialHeight;
|
|
1849
|
+
updateStyle();
|
|
1850
|
+
}));
|
|
1851
|
+
watch(presentText, syncPresentTextValue, { immediate: true });
|
|
1852
|
+
onMounted(() => {
|
|
1853
|
+
const inputInner = input.value.input;
|
|
1854
|
+
const inputInnerHeight = getInputInnerHeight(inputInner);
|
|
1855
|
+
inputInitialHeight = inputInner.offsetHeight || inputInnerHeight;
|
|
1856
|
+
useResizeObserver(inputInner, updateStyle);
|
|
1857
|
+
initEmptyWidth();
|
|
1858
|
+
});
|
|
1859
|
+
__expose({
|
|
1860
|
+
/**
|
|
1861
|
+
* @description get an array of currently selected node,(leafOnly) whether only return the leaf checked nodes, default is `false`
|
|
1862
|
+
*/
|
|
1863
|
+
getCheckedNodes,
|
|
1864
|
+
/**
|
|
1865
|
+
* @description cascader panel ref
|
|
1866
|
+
*/
|
|
1867
|
+
cascaderPanelRef,
|
|
1868
|
+
/**
|
|
1869
|
+
* @description toggle the visible of popper
|
|
1870
|
+
*/
|
|
1871
|
+
togglePopperVisible,
|
|
1872
|
+
/**
|
|
1873
|
+
* @description cascader content ref
|
|
1874
|
+
*/
|
|
1875
|
+
contentRef
|
|
1876
|
+
});
|
|
1877
|
+
return (_ctx, _cache) => {
|
|
1878
|
+
return openBlock(), createBlock(unref(ElConfigProvider), { "z-index": 3e3 }, {
|
|
1879
|
+
default: withCtx(() => [
|
|
1880
|
+
createVNode(unref(ElTooltip), {
|
|
1881
|
+
ref_key: "tooltipRef",
|
|
1882
|
+
ref: tooltipRef,
|
|
1883
|
+
visible: popperVisible.value,
|
|
1884
|
+
teleported: _ctx.teleported,
|
|
1885
|
+
"popper-class": [unref(nsCascader).e("dropdown"), _ctx.popperClass],
|
|
1886
|
+
"popper-options": popperOptions,
|
|
1887
|
+
"fallback-placements": ["bottom-start", "bottom", "top-start", "top"],
|
|
1888
|
+
"stop-popper-mouse-event": false,
|
|
1889
|
+
"gpu-acceleration": false,
|
|
1890
|
+
placement: "bottom-start",
|
|
1891
|
+
transition: `${unref(nsCascader).namespace.value}-zoom-in-top`,
|
|
1892
|
+
effect: "light",
|
|
1893
|
+
pure: "",
|
|
1894
|
+
persistent: "",
|
|
1895
|
+
onHide: hideSuggestionPanel
|
|
1896
|
+
}, {
|
|
1897
|
+
default: withCtx(() => [
|
|
1898
|
+
withDirectives((openBlock(), createElementBlock("div", {
|
|
1899
|
+
class: normalizeClass(cascaderKls.value),
|
|
1900
|
+
style: normalizeStyle(cascaderStyle.value),
|
|
1901
|
+
onClick: _cache[5] || (_cache[5] = () => togglePopperVisible(readonly.value ? void 0 : true)),
|
|
1902
|
+
onKeydown: handleKeyDown,
|
|
1903
|
+
onMouseenter: _cache[6] || (_cache[6] = ($event) => inputHover.value = true),
|
|
1904
|
+
onMouseleave: _cache[7] || (_cache[7] = ($event) => inputHover.value = false)
|
|
1905
|
+
}, [
|
|
1906
|
+
createVNode(unref(ElInput), {
|
|
1907
|
+
ref_key: "input",
|
|
1908
|
+
ref: input,
|
|
1909
|
+
modelValue: inputValue.value,
|
|
1910
|
+
"onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => inputValue.value = $event),
|
|
1911
|
+
placeholder: currentPlaceholder.value,
|
|
1912
|
+
readonly: readonly.value,
|
|
1913
|
+
disabled: isDisabled.value,
|
|
1914
|
+
"validate-event": false,
|
|
1915
|
+
size: unref(realSize),
|
|
1916
|
+
class: normalizeClass(inputClass.value),
|
|
1917
|
+
tabindex: multiple.value && _ctx.filterable && !isDisabled.value ? -1 : void 0,
|
|
1918
|
+
onCompositionstart: handleComposition,
|
|
1919
|
+
onCompositionupdate: handleComposition,
|
|
1920
|
+
onCompositionend: handleComposition,
|
|
1921
|
+
onFocus: handleFocus,
|
|
1922
|
+
onBlur: handleBlur,
|
|
1923
|
+
onInput: handleInput
|
|
1924
|
+
}, {
|
|
1925
|
+
suffix: withCtx(() => [
|
|
1926
|
+
clearBtnVisible.value ? (openBlock(), createBlock(unref(ElIcon), {
|
|
1927
|
+
key: "clear",
|
|
1928
|
+
class: normalizeClass([unref(nsInput).e("icon"), "icon-circle-close"]),
|
|
1929
|
+
onClick: withModifiers(handleClear, ["stop"])
|
|
1930
|
+
}, {
|
|
1931
|
+
default: withCtx(() => [
|
|
1932
|
+
createVNode(unref(CircleClose))
|
|
1933
|
+
]),
|
|
1934
|
+
_: 1
|
|
1935
|
+
}, 8, ["class"])) : (openBlock(), createBlock(unref(ElIcon), {
|
|
1936
|
+
key: "arrow-down",
|
|
1937
|
+
class: normalizeClass(cascaderIconKls.value),
|
|
1938
|
+
onClick: _cache[0] || (_cache[0] = withModifiers(($event) => togglePopperVisible(), ["stop"]))
|
|
1939
|
+
}, {
|
|
1940
|
+
default: withCtx(() => [
|
|
1941
|
+
createVNode(unref(ArrowDown))
|
|
1942
|
+
]),
|
|
1943
|
+
_: 1
|
|
1944
|
+
}, 8, ["class"]))
|
|
1945
|
+
]),
|
|
1946
|
+
_: 1
|
|
1947
|
+
}, 8, ["modelValue", "placeholder", "readonly", "disabled", "size", "class", "tabindex"]),
|
|
1948
|
+
multiple.value ? (openBlock(), createElementBlock("div", {
|
|
1949
|
+
key: 0,
|
|
1950
|
+
ref_key: "tagWrapper",
|
|
1951
|
+
ref: tagWrapper,
|
|
1952
|
+
class: normalizeClass(unref(nsCascader).e("tags"))
|
|
1953
|
+
}, [
|
|
1954
|
+
(openBlock(true), createElementBlock(Fragment, null, renderList(presentTags.value, (tag) => {
|
|
1955
|
+
return openBlock(), createBlock(unref(ElTag), {
|
|
1956
|
+
key: tag.key,
|
|
1957
|
+
type: _ctx.tagType,
|
|
1958
|
+
size: tagSize.value,
|
|
1959
|
+
hit: tag.hitState,
|
|
1960
|
+
closable: tag.closable,
|
|
1961
|
+
"disable-transitions": "",
|
|
1962
|
+
onClose: ($event) => deleteTag(tag)
|
|
1963
|
+
}, {
|
|
1964
|
+
default: withCtx(() => [
|
|
1965
|
+
tag.isCollapseTag === false ? (openBlock(), createElementBlock("span", _hoisted_1, toDisplayString(tag.text), 1)) : (openBlock(), createBlock(unref(ElTooltip), {
|
|
1966
|
+
key: 1,
|
|
1967
|
+
disabled: popperVisible.value || !_ctx.collapseTagsTooltip,
|
|
1968
|
+
"fallback-placements": ["bottom", "top", "right", "left"],
|
|
1969
|
+
placement: "bottom",
|
|
1970
|
+
effect: "light"
|
|
1971
|
+
}, {
|
|
1972
|
+
default: withCtx(() => [
|
|
1973
|
+
createElementVNode("span", null, toDisplayString(tag.text), 1)
|
|
1974
|
+
]),
|
|
1975
|
+
content: withCtx(() => [
|
|
1976
|
+
createElementVNode("div", {
|
|
1977
|
+
class: normalizeClass(unref(nsCascader).e("collapse-tags")),
|
|
1978
|
+
style: normalizeStyle(collapseTagsTooltipContentStyle.value)
|
|
1979
|
+
}, [
|
|
1980
|
+
(openBlock(true), createElementBlock(Fragment, null, renderList(allPresentTags.value.slice(_ctx.maxCollapseTags), (tag2, idx) => {
|
|
1981
|
+
return openBlock(), createElementBlock("div", {
|
|
1982
|
+
key: idx,
|
|
1983
|
+
class: normalizeClass(unref(nsCascader).e("collapse-tag"))
|
|
1984
|
+
}, [
|
|
1985
|
+
(openBlock(), createBlock(unref(ElTag), {
|
|
1986
|
+
key: tag2.key,
|
|
1987
|
+
class: "in-tooltip",
|
|
1988
|
+
type: _ctx.tagType,
|
|
1989
|
+
size: tagSize.value,
|
|
1990
|
+
hit: tag2.hitState,
|
|
1991
|
+
closable: tag2.closable,
|
|
1992
|
+
"disable-transitions": "",
|
|
1993
|
+
onClose: ($event) => deleteTag(tag2)
|
|
1994
|
+
}, {
|
|
1995
|
+
default: withCtx(() => [
|
|
1996
|
+
createElementVNode("span", null, toDisplayString(tag2.text), 1)
|
|
1997
|
+
]),
|
|
1998
|
+
_: 2
|
|
1999
|
+
}, 1032, ["type", "size", "hit", "closable", "onClose"]))
|
|
2000
|
+
], 2);
|
|
2001
|
+
}), 128))
|
|
2002
|
+
], 6)
|
|
2003
|
+
]),
|
|
2004
|
+
_: 2
|
|
2005
|
+
}, 1032, ["disabled"]))
|
|
2006
|
+
]),
|
|
2007
|
+
_: 2
|
|
2008
|
+
}, 1032, ["type", "size", "hit", "closable", "onClose"]);
|
|
2009
|
+
}), 128)),
|
|
2010
|
+
_ctx.filterable && !isDisabled.value ? withDirectives((openBlock(), createElementBlock("input", {
|
|
2011
|
+
key: 0,
|
|
2012
|
+
"onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => searchInputValue.value = $event),
|
|
2013
|
+
type: "text",
|
|
2014
|
+
class: normalizeClass(unref(nsCascader).e("search-input")),
|
|
2015
|
+
placeholder: presentText.value ? "" : inputPlaceholder.value,
|
|
2016
|
+
onInput: _cache[3] || (_cache[3] = (e) => handleInput(searchInputValue.value, e)),
|
|
2017
|
+
onClick: _cache[4] || (_cache[4] = withModifiers(($event) => togglePopperVisible(true), ["stop"])),
|
|
2018
|
+
onKeydown: withKeys(handleDelete, ["delete"]),
|
|
2019
|
+
onCompositionstart: handleComposition,
|
|
2020
|
+
onCompositionupdate: handleComposition,
|
|
2021
|
+
onCompositionend: handleComposition,
|
|
2022
|
+
onFocus: handleFocus,
|
|
2023
|
+
onBlur: handleBlur
|
|
2024
|
+
}, null, 42, _hoisted_2)), [
|
|
2025
|
+
[vModelText, searchInputValue.value]
|
|
2026
|
+
]) : createCommentVNode("", true)
|
|
2027
|
+
], 2)) : createCommentVNode("", true)
|
|
2028
|
+
], 38)), [
|
|
2029
|
+
[unref(ClickOutside), () => togglePopperVisible(false), contentRef.value]
|
|
2030
|
+
])
|
|
2031
|
+
]),
|
|
2032
|
+
content: withCtx(() => [
|
|
2033
|
+
withDirectives(createVNode(ElCascaderPanelV2, {
|
|
2034
|
+
ref_key: "cascaderPanelRef",
|
|
2035
|
+
ref: cascaderPanelRef,
|
|
2036
|
+
inputWidth: inputWidth.value,
|
|
2037
|
+
modelValue: checkedValue.value,
|
|
2038
|
+
"onUpdate:modelValue": _cache[8] || (_cache[8] = ($event) => checkedValue.value = $event),
|
|
2039
|
+
options: _ctx.options,
|
|
2040
|
+
props: props.props,
|
|
2041
|
+
border: false,
|
|
2042
|
+
"render-label": _ctx.$slots.default,
|
|
2043
|
+
onExpandChange: handleExpandChange,
|
|
2044
|
+
onClose: _cache[9] || (_cache[9] = ($event) => _ctx.$nextTick(() => togglePopperVisible(false)))
|
|
2045
|
+
}, null, 8, ["inputWidth", "modelValue", "options", "props", "render-label"]), [
|
|
2046
|
+
[vShow, !filtering.value]
|
|
2047
|
+
]),
|
|
2048
|
+
_ctx.filterable ? withDirectives((openBlock(), createBlock(unref(ElScrollbar), {
|
|
2049
|
+
key: 0,
|
|
2050
|
+
ref_key: "suggestionPanel",
|
|
2051
|
+
ref: suggestionPanel,
|
|
2052
|
+
tag: "ul",
|
|
2053
|
+
class: normalizeClass(unref(nsCascader).e("suggestion-panel")),
|
|
2054
|
+
"view-class": unref(nsCascader).e("suggestion-list"),
|
|
2055
|
+
onKeydown: handleSuggestionKeyDown
|
|
2056
|
+
}, {
|
|
2057
|
+
default: withCtx(() => [
|
|
2058
|
+
suggestions.value.length ? (openBlock(true), createElementBlock(Fragment, { key: 0 }, renderList(suggestions.value, (item) => {
|
|
2059
|
+
return openBlock(), createElementBlock("li", {
|
|
2060
|
+
key: item.uid,
|
|
2061
|
+
class: normalizeClass([unref(nsCascader).e("suggestion-item"), unref(nsCascader).is("checked", item.checked)]),
|
|
2062
|
+
tabindex: -1,
|
|
2063
|
+
onClick: ($event) => handleSuggestionClick(item)
|
|
2064
|
+
}, [
|
|
2065
|
+
createElementVNode("span", null, toDisplayString(item.text), 1),
|
|
2066
|
+
item.checked ? (openBlock(), createBlock(unref(ElIcon), { key: 0 }, {
|
|
2067
|
+
default: withCtx(() => [
|
|
2068
|
+
createVNode(unref(Check))
|
|
2069
|
+
]),
|
|
2070
|
+
_: 1
|
|
2071
|
+
})) : createCommentVNode("", true)
|
|
2072
|
+
], 10, _hoisted_3);
|
|
2073
|
+
}), 128)) : renderSlot(_ctx.$slots, "empty", { key: 1 }, () => [
|
|
2074
|
+
createElementVNode("li", {
|
|
2075
|
+
class: normalizeClass(unref(nsCascader).e("empty-text"))
|
|
2076
|
+
}, toDisplayString(unref(t)("el.cascader.noMatch")), 3)
|
|
2077
|
+
])
|
|
2078
|
+
]),
|
|
2079
|
+
_: 3
|
|
2080
|
+
}, 8, ["class", "view-class"])), [
|
|
2081
|
+
[vShow, filtering.value]
|
|
2082
|
+
]) : createCommentVNode("", true)
|
|
2083
|
+
]),
|
|
2084
|
+
_: 3
|
|
2085
|
+
}, 8, ["visible", "teleported", "popper-class", "transition"])
|
|
2086
|
+
]),
|
|
2087
|
+
_: 3
|
|
2088
|
+
});
|
|
2089
|
+
};
|
|
2090
|
+
}
|
|
2091
|
+
}));
|
|
2092
|
+
const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
2093
|
+
__name: "FgCascader",
|
|
2094
|
+
props: /* @__PURE__ */ mergeModels({
|
|
2095
|
+
props: {
|
|
2096
|
+
type: Object,
|
|
2097
|
+
default: () => ({})
|
|
2098
|
+
},
|
|
2099
|
+
/** 级联展示时候是否有全选 */
|
|
2100
|
+
selectAll: {
|
|
2101
|
+
type: Boolean,
|
|
2102
|
+
default: () => false
|
|
2103
|
+
},
|
|
2104
|
+
options: {
|
|
2105
|
+
type: Array,
|
|
2106
|
+
default: () => []
|
|
2107
|
+
},
|
|
2108
|
+
filterMethod: {
|
|
2109
|
+
type: Function,
|
|
2110
|
+
default: null
|
|
2111
|
+
},
|
|
2112
|
+
/** 筛选后是否有全选 */
|
|
2113
|
+
filterSelectAll: {
|
|
2114
|
+
type: Boolean,
|
|
2115
|
+
default: () => false
|
|
2116
|
+
},
|
|
2117
|
+
poperClass: {
|
|
2118
|
+
type: String,
|
|
2119
|
+
default: () => ""
|
|
2120
|
+
},
|
|
2121
|
+
// 用于搜索后在匹配标签
|
|
2122
|
+
labelIds: {
|
|
2123
|
+
type: Array,
|
|
2124
|
+
default: () => []
|
|
2125
|
+
},
|
|
2126
|
+
// 用于搜索后在标签后显示内容
|
|
2127
|
+
labelName: {
|
|
2128
|
+
type: String,
|
|
2129
|
+
default: () => ""
|
|
2130
|
+
},
|
|
2131
|
+
// 用于搜索后在标签前还是标签后插入,默认标签后
|
|
2132
|
+
labelInsertHeader: {
|
|
2133
|
+
type: Boolean,
|
|
2134
|
+
default: () => false
|
|
2135
|
+
},
|
|
2136
|
+
// 用于搜索后在标签前插入的icon
|
|
2137
|
+
labelIcon: {
|
|
2138
|
+
type: String,
|
|
2139
|
+
default: () => ""
|
|
2140
|
+
},
|
|
2141
|
+
teleported: {
|
|
2142
|
+
type: Boolean,
|
|
2143
|
+
default: () => false
|
|
2144
|
+
}
|
|
2145
|
+
}, {
|
|
2146
|
+
"modelValue": {},
|
|
2147
|
+
"modelModifiers": {}
|
|
2148
|
+
}),
|
|
2149
|
+
emits: /* @__PURE__ */ mergeModels(["change"], ["update:modelValue"]),
|
|
2150
|
+
setup(__props, { emit: __emit }) {
|
|
2151
|
+
const slots = useSlots();
|
|
2152
|
+
const propsData = __props;
|
|
2153
|
+
const modelValue = useModel(__props, "modelValue");
|
|
2154
|
+
const renderKey = ref(0);
|
|
2155
|
+
const cascaderProps2 = __spreadValues({ expandTrigger: "hover", emitPath: false }, propsData.props);
|
|
2156
|
+
const emit = __emit;
|
|
2157
|
+
const cascaderRef = ref();
|
|
2158
|
+
const isFilterSelectAll = ref(false);
|
|
2159
|
+
let footerContainer = null;
|
|
2160
|
+
let filterSelectNode, filterSelectNodeSpan;
|
|
2161
|
+
let filterList = [];
|
|
2162
|
+
const optionsList = computed(() => {
|
|
2163
|
+
return propsData.selectAll && propsData.options.length > 0 ? [{ [cascaderProps2.label || "label"]: "全选", [cascaderProps2.value || "value"]: "ALL" }, ...propsData.options] : propsData.options;
|
|
2164
|
+
});
|
|
2165
|
+
const updateModelValue = (data, type) => {
|
|
2166
|
+
if (type === "add") {
|
|
2167
|
+
const originData = modelValue.value ? JSON.parse(JSON.stringify(modelValue.value)) : [];
|
|
2168
|
+
data.forEach((e) => {
|
|
2169
|
+
if (!originData.find((f) => String(f) === String(e))) {
|
|
2170
|
+
originData.push(e);
|
|
2171
|
+
}
|
|
2172
|
+
});
|
|
2173
|
+
modelValue.value = originData;
|
|
2174
|
+
} else {
|
|
2175
|
+
modelValue.value = modelValue.value.filter((e) => !data.find((f) => String(f) === String(e)));
|
|
2176
|
+
}
|
|
2177
|
+
nextTick(() => {
|
|
2178
|
+
emit("change", [...modelValue.value]);
|
|
2179
|
+
});
|
|
2180
|
+
};
|
|
2181
|
+
const handleFilterSelectAll = () => {
|
|
2182
|
+
isFilterSelectAll.value = !isFilterSelectAll.value;
|
|
2183
|
+
filterSelectNodeSpan.textContent = isFilterSelectAll.value ? "取消全选" : "全选";
|
|
2184
|
+
if (Object.prototype.hasOwnProperty.call(propsData.props, "emitPath")) {
|
|
2185
|
+
updateModelValue(propsData.props.emitPath ? filterList.map((e) => e.pathValues) : filterList.map((e) => e.pathValues[e.pathValues.length - 1]), isFilterSelectAll.value ? "add" : "remove");
|
|
2186
|
+
} else {
|
|
2187
|
+
updateModelValue(
|
|
2188
|
+
filterList.map((e) => e.pathValues[e.pathValues.length - 1]),
|
|
2189
|
+
isFilterSelectAll.value ? "add" : "remove"
|
|
2190
|
+
);
|
|
2191
|
+
}
|
|
2192
|
+
};
|
|
2193
|
+
const focusHandler = () => {
|
|
2194
|
+
if (propsData.filterSelectAll) {
|
|
2195
|
+
isFilterSelectAll.value = false;
|
|
2196
|
+
filterSelectNodeSpan.textContent = "全选";
|
|
2197
|
+
}
|
|
2198
|
+
};
|
|
2199
|
+
const createFooterSlot = () => {
|
|
2200
|
+
var _a, _b;
|
|
2201
|
+
const panelEl = (_b = (_a = cascaderRef.value) == null ? void 0 : _a.cascaderPanelRef) == null ? void 0 : _b.$el.parentNode;
|
|
2202
|
+
if (!panelEl || !slots.footer) return;
|
|
2203
|
+
if (footerContainer && panelEl.contains(footerContainer)) return;
|
|
2204
|
+
footerContainer = document.createElement("div");
|
|
2205
|
+
footerContainer.className = "cascader-footer-slot";
|
|
2206
|
+
panelEl.appendChild(footerContainer);
|
|
2207
|
+
const vNode = () => h("div", { class: "cascader-footer-wrapper" }, slots.footer());
|
|
2208
|
+
render(h(vNode), footerContainer);
|
|
2209
|
+
};
|
|
2210
|
+
const removeFooterSlot = () => {
|
|
2211
|
+
if (footerContainer) {
|
|
2212
|
+
render(null, footerContainer);
|
|
2213
|
+
if (footerContainer.parentNode) {
|
|
2214
|
+
footerContainer.parentNode.removeChild(footerContainer);
|
|
2215
|
+
}
|
|
2216
|
+
footerContainer = null;
|
|
2217
|
+
}
|
|
2218
|
+
};
|
|
2219
|
+
const createAllSelectNode = () => {
|
|
2220
|
+
var _a, _b, _c;
|
|
2221
|
+
const parent = (_c = (_b = (_a = cascaderRef.value) == null ? void 0 : _a.cascaderPanelRef) == null ? void 0 : _b.$el) == null ? void 0 : _c.parentNode;
|
|
2222
|
+
const suggestionPanel = parent == null ? void 0 : parent.querySelector(".el-cascader__suggestion-panel");
|
|
2223
|
+
const ul = suggestionPanel == null ? void 0 : suggestionPanel.querySelector(".el-cascader__suggestion-list");
|
|
2224
|
+
if (!ul) return;
|
|
2225
|
+
const existSelectAllNode = ul.querySelector(".select-all");
|
|
2226
|
+
if (existSelectAllNode) return;
|
|
2227
|
+
filterSelectNode = document.createElement("li");
|
|
2228
|
+
filterSelectNode.className = "el-cascader__suggestion-item select-all";
|
|
2229
|
+
filterSelectNode.style.display = "none";
|
|
2230
|
+
filterSelectNodeSpan = document.createElement("span");
|
|
2231
|
+
filterSelectNodeSpan.textContent = "全选";
|
|
2232
|
+
filterSelectNode.appendChild(filterSelectNodeSpan);
|
|
2233
|
+
ul.prepend(filterSelectNode);
|
|
2234
|
+
filterSelectNode.onclick = () => {
|
|
2235
|
+
handleFilterSelectAll();
|
|
2236
|
+
};
|
|
2237
|
+
};
|
|
2238
|
+
const createFilterLabelNode = (node) => {
|
|
2239
|
+
var _a, _b, _c;
|
|
2240
|
+
const parent = (_c = (_b = (_a = cascaderRef.value) == null ? void 0 : _a.cascaderPanelRef) == null ? void 0 : _b.$el) == null ? void 0 : _c.parentNode;
|
|
2241
|
+
const suggestionPanel = parent == null ? void 0 : parent.querySelector(".el-cascader__suggestion-panel");
|
|
2242
|
+
const ul = suggestionPanel == null ? void 0 : suggestionPanel.querySelector(".el-cascader__suggestion-list");
|
|
2243
|
+
if (!ul) return;
|
|
2244
|
+
nextTick(() => {
|
|
2245
|
+
setTimeout(() => {
|
|
2246
|
+
const li = Array.from(ul.querySelectorAll(".el-cascader__suggestion-item")).find((li2) => li2.querySelector("span").textContent === node.text);
|
|
2247
|
+
if (li) {
|
|
2248
|
+
if (propsData.labelIds.includes(node.value)) {
|
|
2249
|
+
if (li.querySelector("i")) return;
|
|
2250
|
+
const i = document.createElement("i");
|
|
2251
|
+
i.className = `el-cascader__suggestion-item-label text-[#aaa] text-[12px] ${propsData.labelIcon}`;
|
|
2252
|
+
i.textContent = propsData.labelName;
|
|
2253
|
+
if (propsData.labelInsertHeader) {
|
|
2254
|
+
li.insertBefore(i, li.firstChild);
|
|
2255
|
+
} else {
|
|
2256
|
+
li.appendChild(i);
|
|
2257
|
+
}
|
|
2258
|
+
}
|
|
2259
|
+
}
|
|
2260
|
+
});
|
|
2261
|
+
});
|
|
2262
|
+
};
|
|
2263
|
+
const filterSearch = (node, keyword) => {
|
|
2264
|
+
keyword = keyword.trim();
|
|
2265
|
+
if (propsData.filterSelectAll) {
|
|
2266
|
+
createAllSelectNode();
|
|
2267
|
+
node.keyword = keyword;
|
|
2268
|
+
filterList = filterList.filter((e) => e.keyword === keyword);
|
|
2269
|
+
}
|
|
2270
|
+
if (node.value === "ALL") {
|
|
2271
|
+
return false;
|
|
2272
|
+
}
|
|
2273
|
+
const filterResult = propsData.filterMethod ? propsData.filterMethod(node, keyword) : matchIgnoreCase(node, keyword);
|
|
2274
|
+
if (filterResult && propsData.filterSelectAll && !filterList.find((e) => e.uid === node.uid)) {
|
|
2275
|
+
filterList.push(__spreadValues({}, node));
|
|
2276
|
+
}
|
|
2277
|
+
if (propsData.filterSelectAll && filterSelectNode) {
|
|
2278
|
+
filterSelectNode.style.display = filterList.length ? "flex" : "none";
|
|
2279
|
+
}
|
|
2280
|
+
if (propsData.labelIds.length && filterResult) {
|
|
2281
|
+
createFilterLabelNode(node);
|
|
2282
|
+
}
|
|
2283
|
+
return filterResult;
|
|
2284
|
+
};
|
|
2285
|
+
function matchIgnoreCase(n, search) {
|
|
2286
|
+
const searchContent = search.toLowerCase();
|
|
2287
|
+
const _matchFn = (str, targetStr) => {
|
|
2288
|
+
return str.toLowerCase().includes(targetStr);
|
|
2289
|
+
};
|
|
2290
|
+
return _matchFn(n.label, searchContent) || _matchFn(n.text, searchContent);
|
|
2291
|
+
}
|
|
2292
|
+
const LastSelectAll = ref(false);
|
|
2293
|
+
const modelChange = (data) => {
|
|
2294
|
+
modelValue.value = data;
|
|
2295
|
+
emit("change", data);
|
|
2296
|
+
};
|
|
2297
|
+
const collectLeafValues = (nodes, parentPath = []) => {
|
|
2298
|
+
const result = [];
|
|
2299
|
+
nodes.forEach((node) => {
|
|
2300
|
+
const currentValue = node[cascaderProps2.value || "value"];
|
|
2301
|
+
const currentPath = [...parentPath, currentValue];
|
|
2302
|
+
if (node.children && node.children.length > 0) {
|
|
2303
|
+
result.push(...collectLeafValues(node.children, currentPath));
|
|
2304
|
+
} else {
|
|
2305
|
+
result.push(cascaderProps2.emitPath ? currentPath : currentValue);
|
|
2306
|
+
}
|
|
2307
|
+
});
|
|
2308
|
+
return result;
|
|
2309
|
+
};
|
|
2310
|
+
const hasAllSelected = (selectedValues) => {
|
|
2311
|
+
if (!selectedValues || selectedValues.length === 0) return false;
|
|
2312
|
+
if (cascaderProps2.emitPath) {
|
|
2313
|
+
return selectedValues.some((path) => Array.isArray(path) && path.includes("ALL"));
|
|
2314
|
+
} else {
|
|
2315
|
+
return selectedValues.includes("ALL");
|
|
2316
|
+
}
|
|
2317
|
+
};
|
|
2318
|
+
const filterAllValue = (selectedValues) => {
|
|
2319
|
+
if (!selectedValues || selectedValues.length === 0) return [];
|
|
2320
|
+
if (cascaderProps2.emitPath) {
|
|
2321
|
+
return selectedValues.filter((path) => !Array.isArray(path) || !path.includes("ALL"));
|
|
2322
|
+
} else {
|
|
2323
|
+
return selectedValues.filter((value) => value !== "ALL");
|
|
2324
|
+
}
|
|
2325
|
+
};
|
|
2326
|
+
const changeHandler = (arg) => {
|
|
2327
|
+
if (propsData.selectAll) {
|
|
2328
|
+
if (hasAllSelected(arg)) {
|
|
2329
|
+
if (LastSelectAll.value) {
|
|
2330
|
+
LastSelectAll.value = false;
|
|
2331
|
+
modelChange(filterAllValue(arg));
|
|
2332
|
+
return;
|
|
2333
|
+
}
|
|
2334
|
+
const leafValues = collectLeafValues(
|
|
2335
|
+
// 排除全选选项
|
|
2336
|
+
optionsList.value.filter((item) => item[cascaderProps2.value || "value"] !== "ALL")
|
|
2337
|
+
);
|
|
2338
|
+
const allValue = cascaderProps2.emitPath ? [["ALL"]] : ["ALL"];
|
|
2339
|
+
modelChange([...allValue, ...leafValues]);
|
|
2340
|
+
LastSelectAll.value = true;
|
|
2341
|
+
} else {
|
|
2342
|
+
if (LastSelectAll.value) {
|
|
2343
|
+
LastSelectAll.value = false;
|
|
2344
|
+
modelChange([]);
|
|
2345
|
+
return;
|
|
2346
|
+
}
|
|
2347
|
+
LastSelectAll.value = false;
|
|
2348
|
+
modelChange(arg);
|
|
2349
|
+
}
|
|
2350
|
+
} else {
|
|
2351
|
+
modelChange(arg);
|
|
2352
|
+
}
|
|
2353
|
+
};
|
|
2354
|
+
watch(
|
|
2355
|
+
[() => modelValue.value, () => propsData.options],
|
|
2356
|
+
() => {
|
|
2357
|
+
if (!propsData.selectAll) {
|
|
2358
|
+
LastSelectAll.value = false;
|
|
2359
|
+
return;
|
|
2360
|
+
}
|
|
2361
|
+
},
|
|
2362
|
+
{
|
|
2363
|
+
deep: true,
|
|
2364
|
+
immediate: true
|
|
2365
|
+
}
|
|
2366
|
+
);
|
|
2367
|
+
watch(
|
|
2368
|
+
() => propsData.options,
|
|
2369
|
+
() => {
|
|
2370
|
+
var _a;
|
|
2371
|
+
if ((_a = modelValue.value) == null ? void 0 : _a.length) {
|
|
2372
|
+
nextTick(() => {
|
|
2373
|
+
renderKey.value++;
|
|
2374
|
+
});
|
|
2375
|
+
}
|
|
2376
|
+
},
|
|
2377
|
+
{
|
|
2378
|
+
deep: true
|
|
2379
|
+
}
|
|
2380
|
+
);
|
|
2381
|
+
onMounted(() => {
|
|
2382
|
+
if (propsData.filterSelectAll) {
|
|
2383
|
+
createAllSelectNode();
|
|
2384
|
+
}
|
|
2385
|
+
if (slots.footer) {
|
|
2386
|
+
createFooterSlot();
|
|
2387
|
+
}
|
|
2388
|
+
});
|
|
2389
|
+
onBeforeUnmount(() => {
|
|
2390
|
+
removeFooterSlot();
|
|
2391
|
+
});
|
|
2392
|
+
return (_ctx, _cache) => {
|
|
2393
|
+
return openBlock(), createBlock(_sfc_main$1, mergeProps({
|
|
2394
|
+
ref_key: "cascaderRef",
|
|
2395
|
+
ref: cascaderRef,
|
|
2396
|
+
key: renderKey.value,
|
|
2397
|
+
modelValue: modelValue.value,
|
|
2398
|
+
"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => modelValue.value = $event),
|
|
2399
|
+
"popper-class": `cascader-popper-deep ${__props.poperClass}`,
|
|
2400
|
+
teleported: __props.teleported
|
|
2401
|
+
}, _ctx.$attrs, {
|
|
2402
|
+
props: cascaderProps2,
|
|
2403
|
+
options: optionsList.value,
|
|
2404
|
+
"collapse-tags": "",
|
|
2405
|
+
"collapse-tags-tooltip": "",
|
|
2406
|
+
clearable: "",
|
|
2407
|
+
filterable: "",
|
|
2408
|
+
"filter-method": filterSearch,
|
|
2409
|
+
onChange: changeHandler,
|
|
2410
|
+
onFocus: focusHandler
|
|
2411
|
+
}), {
|
|
2412
|
+
default: withCtx(({ data }) => [
|
|
2413
|
+
renderSlot(_ctx.$slots, "customer", { data }, () => [
|
|
2414
|
+
createElementVNode("span", null, toDisplayString(data[cascaderProps2.label || "label"]), 1)
|
|
2415
|
+
])
|
|
2416
|
+
]),
|
|
2417
|
+
_: 3
|
|
2418
|
+
}, 16, ["modelValue", "popper-class", "teleported", "options"]);
|
|
2419
|
+
};
|
|
2420
|
+
}
|
|
2421
|
+
});
|
|
2422
|
+
export {
|
|
2423
|
+
_sfc_main as _
|
|
2424
|
+
};
|