next-element-vue 0.3.8 → 0.4.0

package/dist/index.umd.js

@@ -2,8 +2,8 @@
 /**
  * 作　　者：huangteng
  * 邮　　箱：htengweb@163.com
- * 当前版本：0.3.8 v
- * 发布日期：2024-09-26
+ * 当前版本：0.4.0 v
+ * 发布日期：2024-11-13
  * 地　　址：https://www.npmjs.com/package/next-element-vue
  */
 
@@ -1813,15 +1813,18 @@
                 return isHeaderBarColorGradual ? {
                     background: `linear-gradient(to bottom , ${color}, ${getLightColor$3(color, .5)})`
                 } : "";
-            }));
-            return vue.createVNode("header", {
+            })), __slots_header_tools = {};
+            return slots[slots_config_headerToolsPrefix] && (__slots_header_tools[slots_config_headerToolsPrefix] = () => slots[slots_config_headerToolsPrefix]()), 
+            slots[slots_config_headerToolsSuffix] && (__slots_header_tools[slots_config_headerToolsSuffix] = () => slots[slots_config_headerToolsSuffix]()), 
+            vue.createVNode("header", {
                 class: _ns.b("header"),
                 style: headerStyle.value
             }, [ vue.createVNode(LogoView, null, null), vue.createVNode("div", {
                 class: _ns.bf("header", "right")
-            }, [ vue.createVNode(HeaderTools, null, {
-                default: () => [ slots[slots_config_headerToolsPrefix]?.(), slots[slots_config_headerToolsSuffix]?.() ]
-            }) ]) ]);
+            }, [ vue.createVNode(HeaderTools, null, (s = __slots_header_tools, "function" == typeof s || "[object Object]" === Object.prototype.toString.call(s) && !vue.isVNode(s) ? __slots_header_tools : {
+                default: () => [ __slots_header_tools ]
+            })) ]) ]);
+            var s;
         }
     });
     function getDefaultExportFromCjs(x) {
@@ -2635,21 +2638,29 @@
         render() {
             const slots = this.$slots, _config = vue.inject("options", {}), _emit = vue.inject("__emit__", {});
             slots.menu;
+            const __slots_header_tools = {};
+            slots[slots_config_headerToolsPrefix] && (__slots_header_tools[slots_config_headerToolsPrefix] = () => slots[slots_config_headerToolsPrefix]()), 
+            slots[slots_config_headerToolsSuffix] && (__slots_header_tools[slots_config_headerToolsSuffix] = () => slots[slots_config_headerToolsSuffix]());
             const isTabs = vue.ref(!!slots.tabs);
             return void 0 === slots.tabs && _config.showTabs && (isTabs.value = !0), vue.createVNode(elementPlus.ElContainer, {
                 class: ns$j.b()
             }, {
-                default: () => [ vue.createVNode(Sidebar$2, null, null), vue.createVNode("div", {
-                    class: [ ns$j.b("content") ]
-                }, [ vue.createVNode(Header$3, null, null), _config.showTabs ? slots.tabs ? slots.tabs?.() : vue.createVNode(NextTabs, {
-                    tabs: _config.tabs,
-                    activeTab: _config.activeTab,
-                    onChange: (...arg) => _emit("tabsChange", ...arg),
-                    onSelect: (...arg) => _emit("tabsSelect", ...arg),
-                    onClose: (...arg) => _emit("tabsClose", ...arg)
-                }, null) : null, vue.createVNode("main", {
-                    class: [ ns$j.bf("main"), ns$j.is("layout-tabs", isTabs.value) ]
-                }, [ slots.default?.() ]) ]) ]
+                default: () => {
+                    return [ vue.createVNode(Sidebar$2, null, null), vue.createVNode("div", {
+                        class: [ ns$j.b("content") ]
+                    }, [ vue.createVNode(Header$3, null, (s = __slots_header_tools, "function" == typeof s || "[object Object]" === Object.prototype.toString.call(s) && !vue.isVNode(s) ? __slots_header_tools : {
+                        default: () => [ __slots_header_tools ]
+                    })), _config.showTabs ? slots.tabs ? slots.tabs?.() : vue.createVNode(NextTabs, {
+                        tabs: _config.tabs,
+                        activeTab: _config.activeTab,
+                        onChange: (...arg) => _emit("tabsChange", ...arg),
+                        onSelect: (...arg) => _emit("tabsSelect", ...arg),
+                        onClose: (...arg) => _emit("tabsClose", ...arg)
+                    }, null) : null, vue.createVNode("main", {
+                        class: [ ns$j.bf("main"), ns$j.is("layout-tabs", isTabs.value) ]
+                    }, [ slots.default?.() ]) ]) ];
+                    var s;
+                }
             });
         }
     });
@@ -2661,21 +2672,26 @@
                 return isHeaderBarColorGradual ? {
                     background: `linear-gradient(to bottom , ${color}, ${getLightColor$2(color, .5)})`
                 } : "";
-            }));
-            return () => vue.createVNode(vue.Fragment, null, [ vue.createVNode("header", {
-                class: _ns.b("header"),
-                style: headerStyle.value
-            }, [ vue.createVNode(LogoView, null, null), vue.createVNode("div", {
-                class: _ns.bf("header", "menu")
-            }, [ slots[slots_config_headerMenu] ? slots[slots_config_headerMenu]() : vue.createVNode(NextMenu, {
-                menuTree: _config.menuTree,
-                router: _config.menuRouter,
-                mode: _config.menuMode
-            }, null) ]), vue.createVNode("div", {
-                class: _ns.bf("header", "right")
-            }, [ vue.createVNode(HeaderTools, null, {
-                default: () => [ slots[slots_config_headerToolsPrefix]?.(), slots[slots_config_headerToolsSuffix]?.() ]
-            }) ]) ]) ]);
+            })), __slots_header_tools = {};
+            slots[slots_config_headerToolsPrefix] && (__slots_header_tools[slots_config_headerToolsPrefix] = () => slots[slots_config_headerToolsPrefix]()), 
+            slots[slots_config_headerToolsSuffix] && (__slots_header_tools[slots_config_headerToolsSuffix] = () => slots[slots_config_headerToolsSuffix]());
+            return () => {
+                return vue.createVNode(vue.Fragment, null, [ vue.createVNode("header", {
+                    class: _ns.b("header"),
+                    style: headerStyle.value
+                }, [ vue.createVNode(LogoView, null, null), vue.createVNode("div", {
+                    class: _ns.bf("header", "menu")
+                }, [ slots[slots_config_headerMenu] ? slots[slots_config_headerMenu]() : vue.createVNode(NextMenu, {
+                    menuTree: _config.menuTree,
+                    router: _config.menuRouter,
+                    mode: _config.menuMode
+                }, null) ]), vue.createVNode("div", {
+                    class: _ns.bf("header", "right")
+                }, [ vue.createVNode(HeaderTools, null, (s = __slots_header_tools, "function" == typeof s || "[object Object]" === Object.prototype.toString.call(s) && !vue.isVNode(s) ? __slots_header_tools : {
+                    default: () => [ __slots_header_tools ]
+                })) ]) ]) ]);
+                var s;
+            };
         }
     });
     const ns$i = useNamespace("layout-transverse");
@@ -2711,17 +2727,22 @@
                 return isHeaderBarColorGradual ? {
                     background: `linear-gradient(to bottom , ${color}, ${getLightColor$1(color, .5)})`
                 } : "";
-            }));
-            return () => vue.createVNode(vue.Fragment, null, [ vue.createVNode("header", {
-                class: _ns.b("header"),
-                style: headerStyle.value
-            }, [ vue.createVNode(LogoView, null, null), vue.createVNode("div", {
-                class: _ns.bf("header", "menu")
-            }, null), vue.createVNode("div", {
-                class: _ns.bf("header", "right")
-            }, [ vue.createVNode(HeaderTools, null, {
-                default: () => [ slots[slots_config_headerToolsPrefix]?.(), slots[slots_config_headerToolsSuffix]?.() ]
-            }) ]) ]) ]);
+            })), __slots_header_tools = {};
+            slots[slots_config_headerToolsPrefix] && (__slots_header_tools[slots_config_headerToolsPrefix] = () => slots[slots_config_headerToolsPrefix]()), 
+            slots[slots_config_headerToolsSuffix] && (__slots_header_tools[slots_config_headerToolsSuffix] = () => slots[slots_config_headerToolsSuffix]());
+            return () => {
+                return vue.createVNode(vue.Fragment, null, [ vue.createVNode("header", {
+                    class: _ns.b("header"),
+                    style: headerStyle.value
+                }, [ vue.createVNode(LogoView, null, null), vue.createVNode("div", {
+                    class: _ns.bf("header", "menu")
+                }, null), vue.createVNode("div", {
+                    class: _ns.bf("header", "right")
+                }, [ vue.createVNode(HeaderTools, null, (s = __slots_header_tools, "function" == typeof s || "[object Object]" === Object.prototype.toString.call(s) && !vue.isVNode(s) ? __slots_header_tools : {
+                    default: () => [ __slots_header_tools ]
+                })) ]) ]) ]);
+                var s;
+            };
         }
     }), Sidebar$1 = vue.defineComponent({
         setup: () => ({
@@ -2777,17 +2798,22 @@
                 return isHeaderBarColorGradual ? {
                     background: `linear-gradient(to bottom , ${color}, ${getLightColor(color, .5)})`
                 } : "";
-            }));
-            return () => vue.createVNode(vue.Fragment, null, [ vue.createVNode("header", {
-                class: _ns.b("header"),
-                style: headerStyle.value
-            }, [ vue.createVNode(LogoView, null, null), vue.createVNode("div", {
-                class: _ns.bf("header", "menu")
-            }, [ slots[slots_config_headerMenu]?.() ]), vue.createVNode("div", {
-                class: _ns.bf("header", "right")
-            }, [ vue.createVNode(HeaderTools, null, {
-                default: () => [ slots[slots_config_headerToolsPrefix]?.(), slots[slots_config_headerToolsSuffix]?.() ]
-            }) ]) ]) ]);
+            })), __slots_header_tools = {};
+            slots[slots_config_headerToolsPrefix] && (__slots_header_tools[slots_config_headerToolsPrefix] = () => slots[slots_config_headerToolsPrefix]()), 
+            slots[slots_config_headerToolsSuffix] && (__slots_header_tools[slots_config_headerToolsSuffix] = () => slots[slots_config_headerToolsSuffix]());
+            return () => {
+                return vue.createVNode(vue.Fragment, null, [ vue.createVNode("header", {
+                    class: _ns.b("header"),
+                    style: headerStyle.value
+                }, [ vue.createVNode(LogoView, null, null), vue.createVNode("div", {
+                    class: _ns.bf("header", "menu")
+                }, [ slots[slots_config_headerMenu]?.() ]), vue.createVNode("div", {
+                    class: _ns.bf("header", "right")
+                }, [ vue.createVNode(HeaderTools, null, (s = __slots_header_tools, "function" == typeof s || "[object Object]" === Object.prototype.toString.call(s) && !vue.isVNode(s) ? __slots_header_tools : {
+                    default: () => [ __slots_header_tools ]
+                })) ]) ]) ]);
+                var s;
+            };
         }
     }), Sidebar = vue.defineComponent({
         setup: () => ({
@@ -2814,8 +2840,14 @@
         render() {
             const slots = this.$slots, _config = vue.inject("options", {}), _emit = vue.inject("__emit__", {});
             slots.menu;
+            const __slots_header_tools = {};
+            slots[slots_config_headerToolsPrefix] && (__slots_header_tools[slots_config_headerToolsPrefix] = () => slots[slots_config_headerToolsPrefix]()), 
+            slots[slots_config_headerToolsSuffix] && (__slots_header_tools[slots_config_headerToolsSuffix] = () => slots[slots_config_headerToolsSuffix]());
             const isTabs = vue.ref(!!slots.tabs);
-            return void 0 === slots.tabs && _config.showTabs && (isTabs.value = !0), vue.createVNode(vue.Fragment, null, [ vue.createVNode(Header, null, null), vue.createVNode("div", {
+            return void 0 === slots.tabs && _config.showTabs && (isTabs.value = !0), vue.createVNode(vue.Fragment, null, [ vue.createVNode(Header, null, (s = __slots_header_tools, 
+            "function" == typeof s || "[object Object]" === Object.prototype.toString.call(s) && !vue.isVNode(s) ? __slots_header_tools : {
+                default: () => [ __slots_header_tools ]
+            })), vue.createVNode("div", {
                 class: [ ns$g.b("content"), ns$g.is("layout-tabs", isTabs.value) ]
             }, [ vue.createVNode(Sidebar, null, null), vue.createVNode("div", {
                 class: ns$g.b("container")
@@ -2828,6 +2860,7 @@
             }, null) : null, vue.createVNode("main", {
                 class: [ ns$g.b("main") ]
             }, [ slots.default?.() ]) ]) ]) ]);
+            var s;
         }
     });
     const ns$f = useNamespace("layout"), layouts = {
@@ -3748,9 +3781,15 @@
             columnSlots.value.forEach((slotName => {
                 column_slots[slotName] = (...arg) => slots[slotName] && slots[slotName](...arg);
             }));
-            const _options = vue.inject("options", {}), options = vue.isRef(_options) ? vue.unref(_options) : _options, columnOption = props.columnOption, _dicKey = valueExist(columnOption.dicKey, "value"), _formatterColumnValue = (value, dicData) => {
+            const _options = vue.inject("options", {}), options = vue.isRef(_options) ? vue.unref(_options) : _options, columnOption = props.columnOption, _dicKey = valueExist(columnOption.dicKey, "value"), _dicLabel = valueExist(columnOption.dicLabel, columnOption.treeSelectProps?.label, "label"), _separator = valueExist(columnOption.treeSelectProps?.separator, ","), _formatterColumnValue = (value, dicData) => {
+                if (Array.isArray(value)) {
+                    const temp = [];
+                    return value.forEach((val => {
+                        temp.push(_formatterColumnValue(val, dicData));
+                    })), temp.join(_separator);
+                }
                 const item = dicData.find((o => o[_dicKey] == value));
-                return item ? item.label : value;
+                return item ? item[_dicLabel] : value;
             }, renderCustomItem = (row, $index) => {
                 if (columnOption.children?.length > 0) return vue.createVNode(vue.Fragment, null, [ columnOption.children.map((column => {
                     return vue.createVNode(TableColumnDynamic, {
@@ -3943,6 +3982,14 @@
     var NextDialog$1 = vue.defineComponent({
         name: "NextDialog",
         props: {
+            className: {
+                type: String,
+                default: ""
+            },
+            style: {
+                type: Object,
+                default: () => ({})
+            },
             modelValue: {
                 type: Boolean,
                 default: !1
@@ -4008,7 +4055,8 @@
             return () => vue.createVNode(vue.Fragment, null, [ vue.createVNode(elementPlus.ElDialog, {
                 modelValue: visible.value,
                 "onUpdate:modelValue": $event => visible.value = $event,
-                class: ns$b.b(),
+                class: [ ns$b.b(), props.className ],
+                style: props.style,
                 title: props.title,
                 appendToBody: props.appendToBody,
                 "destroy-on-close": !0,
@@ -4524,6 +4572,60 @@
                 onClear: onClearValue
             }, null) ]);
         }
+    }), NestTreeCascader = vue.defineComponent({
+        name: "NextTreeCascader",
+        props: {
+            modelValue: {
+                type: [ Number, String, Boolean, Object, Array ],
+                default: ""
+            },
+            column: {
+                type: Object,
+                default: () => ({})
+            },
+            disabled: {
+                type: Boolean,
+                default: !1
+            },
+            formParams: {
+                type: Object,
+                default: () => ({})
+            }
+        },
+        emits: [ "change", "clear", "expand-change", "visible-change", "remove-tag", "blur", "focus" ],
+        setup(props, {emit: emit, expose: expose}) {
+            const {t: t} = useLocale(), _modelValue = vue.ref(props.modelValue);
+            vue.watch((() => props.modelValue), (val => {
+                _modelValue.value = val;
+            }));
+            const _column = props.column, placeholder = _column.placeholder || t("next.form.select") + _column.label, _defaultProps = {
+                label: "label",
+                children: "children"
+            }, onChange = val => {
+                const nodes = treeSelectRef.value.getCheckedNodes().map((item => item.data));
+                props.formParams[_column.prop] = val, _modelValue.value = val, emit("change", val, nodes);
+            }, treeSelectRef = vue.ref(), getInstance = () => treeSelectRef.value;
+            _column.loadInstance && _column.loadInstance(getInstance()), expose({
+                getInstance: getInstance,
+                onClearValue: () => {
+                    props.formParams[_column.prop] = "", _modelValue.value = "";
+                }
+            });
+            return () => vue.createVNode(vue.Fragment, null, [ vue.createVNode(elementPlus.ElCascader, {
+                ref: treeSelectRef,
+                modelValue: _modelValue.value,
+                "onUpdate:modelValue": $event => _modelValue.value = $event,
+                placeholder: placeholder,
+                options: valueExist(_column.dicData, []),
+                props: valueExist(_column.treeSelectProps, _defaultProps),
+                disabled: valueExist(props.disabled, !1),
+                clearable: valueExist(_column.clearable, !0),
+                filterable: valueExist(_column.filterable, !1),
+                "collapse-tags": !0,
+                "collapse-tags-tooltip": !0,
+                onChange: onChange
+            }, null) ]);
+        }
     });
     function _isSlot$2(s) {
         return "function" == typeof s || "[object Object]" === Object.prototype.toString.call(s) && !vue.isVNode(s);
@@ -4639,9 +4741,9 @@
                     return vue.createVNode(elementPlus.ElInput, {
                         modelValue: formParams[col.prop],
                         "onUpdate:modelValue": $event => formParams[col.prop] = $event,
-                        clearable: !0,
+                        clearable: valueExist(col.clearable, !0),
                         readonly: valueExist(col.readonly, !1),
-                        disabled: col.disabled,
+                        disabled: valueExist(col.disabled, !1),
                         placeholder: placeholder,
                         onChange: event => col.onChange?.(event, col, formParams, formColumns)
                     }, {
@@ -4657,7 +4759,7 @@
                         modelValue: formParams[col.prop],
                         "onUpdate:modelValue": $event => formParams[col.prop] = $event,
                         type: "password",
-                        clearable: !0,
+                        clearable: valueExist(col.clearable, !0),
                         "show-password": !0,
                         readonly: valueExist(col.readonly, !1),
                         disabled: col.disabled,
@@ -4675,7 +4777,7 @@
                     return vue.createVNode(elementPlus.ElInput, {
                         modelValue: formParams[col.prop],
                         "onUpdate:modelValue": $event => formParams[col.prop] = $event,
-                        clearable: !0,
+                        clearable: valueExist(col.clearable, !0),
                         readonly: valueExist(col.readonly, !1),
                         disabled: col.disabled,
                         placeholder: placeholder,
@@ -4696,7 +4798,7 @@
                     return vue.createVNode(elementPlus.ElInput, {
                         modelValue: formParams[col.prop],
                         "onUpdate:modelValue": $event => formParams[col.prop] = $event,
-                        clearable: !0,
+                        clearable: valueExist(col.clearable, !0),
                         readonly: valueExist(col.readonly, !1),
                         disabled: col.disabled,
                         placeholder: placeholder,
@@ -4720,7 +4822,7 @@
                         modelValue: formParams[col.prop],
                         "onUpdate:modelValue": $event => formParams[col.prop] = $event,
                         type: "textarea",
-                        clearable: !0,
+                        clearable: valueExist(col.clearable, !0),
                         readonly: valueExist(col.readonly, !1),
                         disabled: col.disabled,
                         placeholder: placeholder,
@@ -4738,8 +4840,9 @@
                         modelValue: formParams[col.prop],
                         "onUpdate:modelValue": $event => formParams[col.prop] = $event,
                         placeholder: placeholder,
-                        clearable: !0,
-                        disabled: col.disabled,
+                        clearable: valueExist(col.clearable, !0),
+                        disabled: valueExist(col.disabled, !1),
+                        readonly: valueExist(col.readonly, !1),
                         multiple: valueExist(col.multiple, !1),
                         "collapse-tags-tooltip": !0,
                         onChange: event => col.onChange?.(event, col, formParams, formColumns)
@@ -4760,8 +4863,10 @@
                         start: "00:00",
                         step: "00:30",
                         end: "23:59",
-                        editable: !1,
-                        disabled: col.disabled,
+                        clearable: valueExist(col.clearable, !0),
+                        editable: valueExist(col.editable, !1),
+                        disabled: valueExist(col.disabled, !1),
+                        readonly: valueExist(col.readonly, !1),
                         placeholder: placeholder,
                         onChange: event => col.onChange?.(event, col, formParams, formColumns)
                     }, {
@@ -4772,7 +4877,8 @@
                 if ("radio" === col.type) return vue.createVNode(elementPlus.ElRadioGroup, {
                     modelValue: formParams[col.prop],
                     "onUpdate:modelValue": $event => formParams[col.prop] = $event,
-                    disabled: col.disabled,
+                    disabled: valueExist(col.disabled, !1),
+                    readonly: valueExist(col.readonly, !1),
                     onChange: event => col.onChange?.(event, col, formParams, formColumns)
                 }, {
                     default: () => [ col.dicData && col.dicData.map((item => vue.createVNode(elementPlus.ElRadio, {
@@ -4787,7 +4893,8 @@
                 vue.createVNode(elementPlus.ElCheckboxGroup, {
                     modelValue: formParams[col.prop],
                     "onUpdate:modelValue": $event => formParams[col.prop] = $event,
-                    disabled: col.disabled,
+                    disabled: valueExist(col.disabled, !1),
+                    readonly: valueExist(col.readonly, !1),
                     onChange: event => col.onChange?.(event, col, formParams, formColumns)
                 }, {
                     default: () => [ col.dicData && col.dicData.map((item => vue.createVNode(elementPlus.ElCheckbox, {
@@ -4807,10 +4914,11 @@
                         type: "date",
                         valueFormat: col.format || "YYYY-MM-DD",
                         format: col.format || "YYYY-MM-DD",
-                        clearable: !0,
+                        clearable: valueExist(col.clearable, !0),
                         disabledDate: col.disabledDate || _defaultDisabledDate,
-                        disabled: col.disabled,
-                        editable: col.editable
+                        editable: valueExist(col.editable, !1),
+                        disabled: valueExist(col.disabled, !1),
+                        readonly: valueExist(col.readonly, !1)
                     }, null);
                 }
                 if ("datetime" === col.type) {
@@ -4822,10 +4930,11 @@
                         type: "datetime",
                         valueFormat: col.format || "YYYY-MM-DD HH:mm:ss",
                         format: col.format || "YYYY-MM-DD HH:mm:ss",
-                        clearable: !0,
+                        clearable: valueExist(col.clearable, !0),
                         disabledDate: col.disabledDate || _defaultDisabledDate,
-                        disabled: col.disabled,
-                        editable: col.editable
+                        editable: valueExist(col.editable, !1),
+                        disabled: valueExist(col.disabled, !1),
+                        readonly: valueExist(col.readonly, !1)
                     }, null);
                 }
                 if ("datetimerange" === col.type) {
@@ -4837,13 +4946,14 @@
                         type: "datetimerange",
                         valueFormat: col.format || "YYYY-MM-DD HH:mm:ss",
                         format: col.format || "YYYY-MM-DD HH:mm:ss",
-                        clearable: !0,
                         "range-separator": t("next.date.rangeSeparator"),
                         "start-placeholder": t("next.date.startPlaceholder"),
                         "end-placeholder": t("next.date.endPlaceholder"),
                         disabledDate: col.disabledDate || _defaultDisabledDate,
-                        disabled: col.disabled,
-                        editable: col.editable,
+                        clearable: valueExist(col.clearable, !0),
+                        editable: valueExist(col.editable, !1),
+                        disabled: valueExist(col.disabled, !1),
+                        readonly: valueExist(col.readonly, !1),
                         shortcuts: col.shortcuts || _defaultShortcuts
                     }, null);
                 }
@@ -4861,7 +4971,7 @@
                     "onUpdate:modelValue": $event => formParams[col.prop] = $event,
                     formParams: formParams,
                     column: col,
-                    disabled: col.disabled,
+                    disabled: valueExist(col.disabled, !1),
                     onSelect: rows => ((rows, col) => {
                         rows && (col.tableSelectRows = rows);
                         const {value: value} = col.tableSelectProps || {};
@@ -4870,17 +4980,25 @@
                 }, null) : "uploadImage" === col.type ? vue.createVNode(UploadImage, {
                     modelValue: formParams[col.prop],
                     "onUpdate:modelValue": $event => formParams[col.prop] = $event,
-                    disabled: col.disabled,
-                    multiple: col.multiple,
+                    disabled: valueExist(col.disabled, !1),
+                    multiple: valueExist(col.multiple, !1),
                     limit: col.limit,
                     onChange: (...arg) => col.onChange?.(...arg, col, formParams, formColumns),
                     onExceed: (...arg) => col.onExceed?.(...arg, col, formParams, formColumns)
                 }, null) : "treeSelect" === col.type ? vue.createVNode(treeSelect, {
                     modelValue: formParams[col.prop],
                     "onUpdate:modelValue": $event => formParams[col.prop] = $event,
-                    disabled: col.disabled,
+                    disabled: valueExist(col.disabled, !1),
                     column: col,
-                    formParams: formParams
+                    formParams: formParams,
+                    onChange: (...arg) => col.onChange?.(...arg, col, formParams, formColumns)
+                }, null) : "cascader" === col.type ? vue.createVNode(NestTreeCascader, {
+                    modelValue: formParams[col.prop],
+                    "onUpdate:modelValue": $event => formParams[col.prop] = $event,
+                    disabled: valueExist(col.disabled, !1),
+                    column: col,
+                    formParams: formParams,
+                    onChange: (...arg) => col.onChange?.(...arg, col, formParams, formColumns)
                 }, null) : void 0;
             };
             expose({
@@ -5050,7 +5168,7 @@
                             append: valueExist(col.formAppend, col.append, null),
                             hide: valueExist(col.formHide, col.hide, !1),
                             disabled: valueExist(col.formDisabled, col.disabled, !1),
-                            clearable: valueExist(col.formClearable, col.clearable, !1),
+                            clearable: valueExist(col.formClearable, col.clearable, !0),
                             readonly: valueExist(col.formReadonly, col.readonly, !1),
                             tip: valueExist(col.formTip, col.tip, null),
                             rules: valueExist(col.formRules, col.rules, null),
@@ -7123,6 +7241,10 @@
         onEditPolygon(callback) {
             this.editPolygonObserver = callback;
         }
+        getTransformPoint(x, y) {
+            const transformMatrix = this.ctx.getTransform(), scaleX = parseFloat(transformMatrix.a.toFixed(1)), scaleY = parseFloat(transformMatrix.d.toFixed(1)), translateX = Math.ceil(transformMatrix.e), translateY = Math.ceil(transformMatrix.f);
+            return [ Math.floor((x - translateX) / scaleX), Math.floor((y - translateY) / scaleY) ];
+        }
         drawPolygonPath(vertexes, mouseX, mouseY) {
             const ctx = this.ctx;
             if (!vertexes.length) return;
@@ -7154,11 +7276,11 @@
             this.drawPolygonEdgeCentre(vertexes));
         }
         pointInVertexes(x, y) {
-            const vertexes = this.vertexes;
+            const [_x, _y] = this.getTransformPoint(x, y), vertexes = this.vertexes;
             let aimIndex = null;
             for (let i = 0; i < vertexes.length; i++) {
                 const [vertex_x, vertex_y] = vertexes[i];
-                if (isPointInCircle(x, y, vertex_x, vertex_y, this.vertexRadius)) {
+                if (isPointInCircle(_x, _y, vertex_x, vertex_y, this.vertexRadius)) {
                     this.canvas.style.cursor = "pointer", aimIndex = i;
                     break;
                 }
@@ -7167,11 +7289,11 @@
             return aimIndex;
         }
         pointInEdgeCentre(x, y) {
-            const vertexes = this.vertexes;
+            const [_x, _y] = this.getTransformPoint(x, y), vertexes = this.vertexes;
             let aimIndex = null;
             for (let i = 0; i < vertexes.length; i++) {
                 const start = vertexes[i % vertexes.length], end = vertexes[(i + 1) % vertexes.length], vertex_x = start[0] + (end[0] - start[0]) / 2, vertex_y = start[1] + (end[1] - start[1]) / 2;
-                if (isPointInCircle(x, y, vertex_x, vertex_y, this.edgeCentreRadius)) {
+                if (isPointInCircle(_x, _y, vertex_x, vertex_y, this.edgeCentreRadius)) {
                     this.canvas.style.cursor = "pointer", aimIndex = i;
                     break;
                 }
@@ -7180,9 +7302,9 @@
             return aimIndex;
         }
         pointInVertexesOrEdgeCentre(x, y) {
-            const vertexes = this.vertexes;
+            const [_x, _y] = this.getTransformPoint(x, y), vertexes = this.vertexes;
             for (let i = 0; i < vertexes.length; i++) {
-                const [vertex_x, vertex_y] = vertexes[i], isInVertex = isPointInCircle(x, y, vertex_x, vertex_y, this.vertexRadius), start = vertexes[i % vertexes.length], end = vertexes[(i + 1) % vertexes.length], edge_center_x = start[0] + (end[0] - start[0]) / 2, edge_center_y = start[1] + (end[1] - start[1]) / 2, isInEdgeCenter = isPointInCircle(x, y, edge_center_x, edge_center_y, this.edgeCentreRadius);
+                const [vertex_x, vertex_y] = vertexes[i], isInVertex = isPointInCircle(_x, _y, vertex_x, vertex_y, this.vertexRadius), start = vertexes[i % vertexes.length], end = vertexes[(i + 1) % vertexes.length], edge_center_x = start[0] + (end[0] - start[0]) / 2, edge_center_y = start[1] + (end[1] - start[1]) / 2, isInEdgeCenter = isPointInCircle(_x, _y, edge_center_x, edge_center_y, this.edgeCentreRadius);
                 if (isInVertex || isInEdgeCenter) {
                     this.canvas.style.cursor = "pointer";
                     break;
@@ -7322,7 +7444,7 @@
             this.ctx.clearRect(0, 0, this.canvasWidth, this.canvasHeight), this.ctx.drawImage(this.image, 0, 0, this.canvasWidth, this.canvasHeight), 
             this.ctx.save();
             const shapes = this.labels.shapes;
-            this.drawPolygons(shapes), this.ctx.restore();
+            shapes?.length && this.drawPolygons(shapes), this.ctx.restore();
         };
         render=() => {
             this.canvas.width = this.canvasWidth, this.scaleOffset.value && (this.ctx.translate(this.scaleOffset.value.x, this.scaleOffset.value.y), 
@@ -7894,7 +8016,7 @@
         })(app);
     };
     var index = {
-        version: "0.3.8",
+        version: "0.4.0",
         install: install
     };
     exports.NextContainer = NextContainer, exports.NextCrudTable = NextCrudTable, exports.NextCrudTableVirtualized = NextCrudTableVirtualized, 
@@ -7941,7 +8063,7 @@
     }), exports.useGetDerivedNamespace = useGetDerivedNamespace, exports.useLanguage = (locale, lang) => {
         const localeRef = vue.isRef(locale) ? locale : vue.ref(locale), nextLang = localeLang[lang] || localeLang["zh-cn"];
         localeRef.value.name = lang, localeRef.value.next = nextLang.next;
-    }, exports.useLocale = useLocale, exports.useNamespace = useNamespace, exports.version = "0.3.8", 
+    }, exports.useLocale = useLocale, exports.useNamespace = useNamespace, exports.version = "0.4.0", 
     Object.defineProperty(exports, "__esModule", {
         value: !0
     });