next-element-vue 0.4.1 → 0.4.6

package/dist/index.umd.js

@@ -2,8 +2,8 @@
 /**
  * 作　　者：huangteng
  * 邮　　箱：htengweb@163.com
- * 当前版本：0.4.1 v
- * 发布日期：2024-11-17
+ * 当前版本：0.4.6 v
+ * 发布日期：2024-12-02
  * 地　　址：https://www.npmjs.com/package/next-element-vue
  */
 
@@ -1038,11 +1038,11 @@
             }
         };
     }
-    const {getLightColor: getLightColor$4} = useChangeColor(), nextUseCssVar = (cssvar, value) => {
+    const {getLightColor: getLightColor$5} = useChangeColor(), nextUseCssVar = (cssvar, value) => {
         document.documentElement.style.setProperty(cssvar, value);
     }, nextUseCssTheme = (cssvar, value) => {
         nextUseCssVar(cssvar, value);
-        for (let i = 1; i < 10; i++) nextUseCssVar(cssvar + "-light-" + i, getLightColor$4(value, i / 10));
+        for (let i = 1; i < 10; i++) nextUseCssVar(cssvar + "-light-" + i, getLightColor$5(value, i / 10));
         nextUseCssVar(`${cssvar}-dark-2`, value);
     }, themeColorCssEnum = {
         themeColor: "--el-color-primary",
@@ -1155,7 +1155,7 @@
             isDark: !1
         }
     };
-    const ns$l = useNamespace("text-ellipsis");
+    const ns$n = useNamespace("text-ellipsis");
     const NextTextEllipsis = withInstall(vue.defineComponent({
         name: "NextTextEllipsis",
         props: {
@@ -1201,7 +1201,7 @@
                 }
             };
             return () => vue.createVNode(vue.Fragment, null, [ vue.createVNode("div", {
-                class: [ ns$l.b(), props.class ],
+                class: [ ns$n.b(), props.class ],
                 style: setWidth.value,
                 onMouseenter: onMouseenter
             }, [ isTip.value ? vue.createVNode(elementPlus.ElTooltip, {
@@ -1211,11 +1211,11 @@
                 disabled: props.disabled
             }, {
                 default: () => [ vue.createVNode("span", {
-                    class: ns$l.e("text"),
+                    class: ns$n.e("text"),
                     ref: ellipsisRef
                 }, [ slots.default ? slots.default() : props.content ]) ]
             }) : vue.createVNode("span", {
-                class: ns$l.e("text"),
+                class: ns$n.e("text"),
                 ref: ellipsisRef
             }, [ slots.default ? slots.default() : props.content ]) ]) ]);
         }
@@ -1550,6 +1550,9 @@
             }, {
                 type: "columns",
                 text: "分栏"
+            }, {
+                type: "composite",
+                text: "综合"
             } ];
             return vue.createVNode(elementPlus.ElScrollbar, null, {
                 default: () => [ vue.createVNode(elementPlus.ElDivider, {
@@ -1802,8 +1805,8 @@
             }) ]);
         }
     });
-    const {getLightColor: getLightColor$3} = useChangeColor();
-    var Header$3 = vue.defineComponent({
+    const {getLightColor: getLightColor$4} = useChangeColor();
+    var Header$4 = vue.defineComponent({
         setup: () => ({
             ns: vue.inject("ns", {})
         }),
@@ -1811,7 +1814,7 @@
             const slots = this.$slots, _ns = this.ns, _config = vue.inject("options", {}), headerStyle = vue.computed((() => {
                 const {isHeaderBarColorGradual: isHeaderBarColorGradual, headerBarColor: color} = _config.setting;
                 return isHeaderBarColorGradual ? {
-                    background: `linear-gradient(to bottom , ${color}, ${getLightColor$3(color, .5)})`
+                    background: `linear-gradient(to bottom , ${color}, ${getLightColor$4(color, .5)})`
                 } : "";
             })), __slots_header_tools = {};
             return slots[slots_config_headerToolsPrefix] && (__slots_header_tools[slots_config_headerToolsPrefix] = () => slots[slots_config_headerToolsPrefix]()), 
@@ -2553,7 +2556,7 @@
                 }, null) ]
             }))) ]) ]);
         }
-    }), ns$k = useNamespace("menu");
+    }), ns$m = useNamespace("menu");
     const NextMenu = withInstall(vue.defineComponent({
         name: "NextMenu",
         props: {
@@ -2580,21 +2583,22 @@
             }
         },
         setup(props) {
-            vue.provide("ns", ns$k);
+            vue.provide("ns", ns$m);
             const router = vue.getCurrentInstance().appContext.config.globalProperties.$router, currentPath = router.currentRoute?.value.fullPath, activePath = vue.ref(currentPath);
             vue.watch((() => router.currentRoute?.value), (to => {
                 activePath.value = to.fullPath;
             }));
             return () => vue.createVNode(vue.Fragment, null, [ vue.createVNode(elementPlus.ElMenu, {
-                class: [ ns$k.b(), props.className ],
+                class: [ ns$m.b(), props.className ],
                 style: props.style,
+                "popper-class": ns$m.b("popper"),
                 defaultActive: activePath.value,
                 router: props.router,
                 mode: props.mode,
                 ellipsis: !0
             }, {
                 default: () => [ vue.createVNode(vue.Fragment, null, [ props.menuTree.map((item => item.children?.length ? valueExist(item.meta?.isHide, !1) ? null : vue.createVNode(elementPlus.ElSubMenu, {
-                    "popper-class": ns$k.b("popper"),
+                    "popper-class": ns$m.b("popper"),
                     index: item.path || item.id,
                     teleported: !0
                 }, {
@@ -2605,7 +2609,7 @@
                         menuData: item.children
                     }, null)
                 }) : valueExist(item.meta?.isHide, !1) ? null : vue.createVNode(elementPlus.ElMenuItem, {
-                    "popper-class": ns$k.b("popper"),
+                    "popper-class": ns$m.b("popper"),
                     index: item.path
                 }, {
                     default: () => [ vue.createVNode(MenuItemTitle, {
@@ -2615,7 +2619,7 @@
             }) ]);
         }
     }));
-    var Sidebar$2 = vue.defineComponent({
+    var Sidebar$3 = vue.defineComponent({
         setup: () => ({
             ns: vue.inject("ns", {})
         }),
@@ -2631,10 +2635,10 @@
             }) ]);
         }
     });
-    const ns$j = useNamespace("layout-defaults");
+    const ns$l = useNamespace("layout-defaults");
     var defaults = vue.defineComponent({
         props: {},
-        setup: () => (vue.provide("ns", ns$j), {}),
+        setup: () => (vue.provide("ns", ns$l), {}),
         render() {
             const slots = this.$slots, _config = vue.inject("options", {}), _emit = vue.inject("__emit__", {});
             slots.menu;
@@ -2643,12 +2647,12 @@
             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()
+                class: ns$l.b()
             }, {
                 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 : {
+                    return [ vue.createVNode(Sidebar$3, null, null), vue.createVNode("div", {
+                        class: [ ns$l.b("content") ]
+                    }, [ vue.createVNode(Header$4, 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,
@@ -2657,20 +2661,20 @@
                         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) ]
+                        class: [ ns$l.bf("main"), ns$l.is("layout-tabs", isTabs.value) ]
                     }, [ slots.default?.() ]) ]) ];
                     var s;
                 }
             });
         }
     });
-    const {getLightColor: getLightColor$2} = useChangeColor();
-    var Header$2 = vue.defineComponent({
+    const {getLightColor: getLightColor$3} = useChangeColor();
+    var Header$3 = vue.defineComponent({
         setup(props, {slots: slots}) {
             const _ns = vue.inject("ns", {}), _config = vue.inject("options", {}), headerStyle = vue.computed((() => {
                 const {isHeaderBarColorGradual: isHeaderBarColorGradual, headerBarColor: color} = _config.setting;
                 return isHeaderBarColorGradual ? {
-                    background: `linear-gradient(to bottom , ${color}, ${getLightColor$2(color, .5)})`
+                    background: `linear-gradient(to bottom , ${color}, ${getLightColor$3(color, .5)})`
                 } : "";
             })), __slots_header_tools = {};
             slots[slots_config_headerToolsPrefix] && (__slots_header_tools[slots_config_headerToolsPrefix] = () => slots[slots_config_headerToolsPrefix]()), 
@@ -2694,17 +2698,17 @@
             };
         }
     });
-    const ns$i = useNamespace("layout-transverse");
+    const ns$k = useNamespace("layout-transverse");
     var transverse = vue.defineComponent({
         props: {},
-        setup: () => (vue.provide("ns", ns$i), {}),
+        setup: () => (vue.provide("ns", ns$k), {}),
         render() {
             const slots = this.$slots, _config = vue.inject("options", {}), _emit = vue.inject("__emit__", {}), __slots_header = {};
             slots[slots_config_headerMenu] && (__slots_header[slots_config_headerMenu] = () => slots[slots_config_headerMenu]()), 
             slots[slots_config_headerToolsPrefix] && (__slots_header[slots_config_headerToolsPrefix] = () => slots[slots_config_headerToolsPrefix]()), 
             slots[slots_config_headerToolsSuffix] && (__slots_header[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$2, null, (s = __slots_header, 
+            return void 0 === slots.tabs && _config.showTabs && (isTabs.value = !0), vue.createVNode(vue.Fragment, null, [ vue.createVNode(Header$3, null, (s = __slots_header, 
             "function" == typeof s || "[object Object]" === Object.prototype.toString.call(s) && !vue.isVNode(s) ? __slots_header : {
                 default: () => [ __slots_header ]
             })), _config.showTabs ? slots.tabs ? slots.tabs?.() : vue.createVNode(NextTabs, {
@@ -2714,18 +2718,18 @@
                 onSelect: (...arg) => _emit("tabsSelect", ...arg),
                 onClose: (...arg) => _emit("tabsClose", ...arg)
             }, null) : null, vue.createVNode("main", {
-                class: [ ns$i.b("main"), ns$i.is("layout-tabs", isTabs.value) ]
+                class: [ ns$k.b("main"), ns$k.is("layout-tabs", isTabs.value) ]
             }, [ slots.default?.() ]) ]);
             var s;
         }
     });
-    const {getLightColor: getLightColor$1} = useChangeColor();
-    var Header$1 = vue.defineComponent({
+    const {getLightColor: getLightColor$2} = useChangeColor();
+    var Header$2 = vue.defineComponent({
         setup(props, {slots: slots}) {
             const _ns = vue.inject("ns", {}), _config = vue.inject("options", {}), headerStyle = vue.computed((() => {
                 const {isHeaderBarColorGradual: isHeaderBarColorGradual, headerBarColor: color} = _config.setting;
                 return isHeaderBarColorGradual ? {
-                    background: `linear-gradient(to bottom , ${color}, ${getLightColor$1(color, .5)})`
+                    background: `linear-gradient(to bottom , ${color}, ${getLightColor$2(color, .5)})`
                 } : "";
             })), __slots_header_tools = {};
             slots[slots_config_headerToolsPrefix] && (__slots_header_tools[slots_config_headerToolsPrefix] = () => slots[slots_config_headerToolsPrefix]()), 
@@ -2744,7 +2748,7 @@
                 var s;
             };
         }
-    }), Sidebar$1 = vue.defineComponent({
+    }), Sidebar$2 = vue.defineComponent({
         setup: () => ({
             ns: vue.inject("ns", {})
         }),
@@ -2758,10 +2762,10 @@
             }, null) ]);
         }
     });
-    const ns$h = useNamespace("layout-columns");
+    const ns$j = useNamespace("layout-columns");
     var columns = vue.defineComponent({
         props: {},
-        setup: () => (vue.provide("ns", ns$h), {}),
+        setup: () => (vue.provide("ns", ns$j), {}),
         render() {
             const slots = this.$slots, _config = vue.inject("options", {}), _emit = vue.inject("__emit__", {}), __slots_header = {};
             slots[slots_config_headerMenu] && (__slots_header[slots_config_headerMenu] = () => slots[slots_config_headerMenu]()), 
@@ -2769,12 +2773,12 @@
             slots[slots_config_headerToolsSuffix] && (__slots_header[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$h.b()
+                class: ns$j.b()
             }, {
                 default: () => {
-                    return [ vue.createVNode(Sidebar$1, null, null), vue.createVNode("div", {
-                        class: [ ns$h.b("content") ]
-                    }, [ vue.createVNode(Header$1, null, (s = __slots_header, "function" == typeof s || "[object Object]" === Object.prototype.toString.call(s) && !vue.isVNode(s) ? __slots_header : {
+                    return [ vue.createVNode(Sidebar$2, null, null), vue.createVNode("div", {
+                        class: [ ns$j.b("content") ]
+                    }, [ vue.createVNode(Header$2, null, (s = __slots_header, "function" == typeof s || "[object Object]" === Object.prototype.toString.call(s) && !vue.isVNode(s) ? __slots_header : {
                         default: () => [ __slots_header ]
                     })), _config.showTabs ? slots.tabs ? slots.tabs?.() : vue.createVNode(NextTabs, {
                         tabs: _config.tabs,
@@ -2783,20 +2787,20 @@
                         onSelect: (...arg) => _emit("tabsSelect", ...arg),
                         onClose: (...arg) => _emit("tabsClose", ...arg)
                     }, null) : null, vue.createVNode("main", {
-                        class: [ ns$h.bf("main"), ns$h.is("layout-tabs", isTabs.value) ]
+                        class: [ ns$j.bf("main"), ns$j.is("layout-tabs", isTabs.value) ]
                     }, [ slots.default?.() ]) ]) ];
                     var s;
                 }
             });
         }
     });
-    const {getLightColor: getLightColor} = useChangeColor();
-    var Header = vue.defineComponent({
+    const {getLightColor: getLightColor$1} = useChangeColor();
+    var Header$1 = vue.defineComponent({
         setup(props, {slots: slots}) {
             const _ns = vue.inject("ns", {}), _config = vue.inject("options", {}), headerStyle = vue.computed((() => {
                 const {isHeaderBarColorGradual: isHeaderBarColorGradual, headerBarColor: color} = _config.setting;
                 return isHeaderBarColorGradual ? {
-                    background: `linear-gradient(to bottom , ${color}, ${getLightColor(color, .5)})`
+                    background: `linear-gradient(to bottom , ${color}, ${getLightColor$1(color, .5)})`
                 } : "";
             })), __slots_header_tools = {};
             slots[slots_config_headerToolsPrefix] && (__slots_header_tools[slots_config_headerToolsPrefix] = () => slots[slots_config_headerToolsPrefix]()), 
@@ -2815,7 +2819,7 @@
                 var s;
             };
         }
-    }), Sidebar = vue.defineComponent({
+    }), Sidebar$1 = vue.defineComponent({
         setup: () => ({
             ns: vue.inject("ns", {})
         }),
@@ -2831,12 +2835,155 @@
             }) ]);
         }
     });
-    const ns$g = useNamespace("layout-classic");
+    const ns$i = useNamespace("layout-classic");
     var classic = vue.defineComponent({
         props: {},
-        setup: () => (vue.provide("ns", ns$g), {
-            ns: ns$g
+        setup: () => (vue.provide("ns", ns$i), {
+            ns: ns$i
         }),
+        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$1, 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$i.b("content"), ns$i.is("layout-tabs", isTabs.value) ]
+            }, [ vue.createVNode(Sidebar$1, null, null), vue.createVNode("div", {
+                class: ns$i.b("container")
+            }, [ _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$i.b("main") ]
+            }, [ slots.default?.() ]) ]) ]) ]);
+            var s;
+        }
+    });
+    const findParentNode = (path, tree) => {
+        for (const node of tree) {
+            if (node.children?.some((child => child.path === path))) return node;
+            if (node.children) {
+                const parent = findParentNode(path, node.children);
+                if (parent) return parent;
+            }
+        }
+        return null;
+    }, ns$h = useNamespace("menu");
+    var MenuTop = vue.defineComponent({
+        props: {
+            className: {
+                type: String,
+                default: ""
+            },
+            style: {
+                type: Object,
+                default: () => ({})
+            },
+            menuTree: {
+                type: Array,
+                default: () => []
+            }
+        },
+        setup(props) {
+            vue.provide("ns", ns$h);
+            const updateSubmentTree = vue.inject("updateSubmentTree"), router = vue.getCurrentInstance().appContext.config.globalProperties.$router, currentPath = router.currentRoute?.value.fullPath, parentNode = findParentNode(currentPath, props.menuTree), activeMenuId = vue.ref(parentNode?.id);
+            parentNode?.id && updateSubmentTree(parentNode.children), vue.watch((() => router.currentRoute?.value), (to => {
+                const parentNode = findParentNode(to.fullPath, props.menuTree);
+                activeMenuId.value = parentNode?.id, parentNode?.id && updateSubmentTree(parentNode.children);
+            }));
+            const findTreeFirst = tree => {
+                let result = tree[0];
+                for (let i = 0; i < tree.length; i++) {
+                    const node = tree[i];
+                    if (node.children?.length && (result = findTreeFirst(node.children), result)) break;
+                }
+                return result;
+            }, renderContent = () => vue.createVNode(elementPlus.ElMenu, {
+                class: [ ns$h.b(), props.className ],
+                style: props.style,
+                "popper-class": ns$h.b("popper"),
+                defaultActive: activeMenuId.value,
+                mode: "horizontal",
+                ellipsis: !0
+            }, {
+                default: () => [ vue.createVNode(vue.Fragment, null, [ props.menuTree.map((item => valueExist(item.meta?.isHide, !1) ? null : vue.createVNode(elementPlus.ElMenuItem, {
+                    index: item.id,
+                    onClick: val => ((val, item) => {
+                        if (updateSubmentTree(item.children), item.children?.length) {
+                            const firstNode = findTreeFirst(item.children);
+                            router.push(firstNode.path);
+                        } else router.push(item.path);
+                    })(0, item)
+                }, {
+                    default: () => [ vue.createVNode(MenuItemTitle, {
+                        meta: item.meta
+                    }, null) ]
+                }))) ]) ]
+            });
+            return () => vue.createVNode(vue.Fragment, null, [ renderContent() ]);
+        }
+    });
+    const {getLightColor: getLightColor} = useChangeColor();
+    var Header = vue.defineComponent({
+        setup(props, {slots: slots}) {
+            const _ns = vue.inject("ns", {}), _config = vue.inject("options", {}), headerStyle = vue.computed((() => {
+                const {isHeaderBarColorGradual: isHeaderBarColorGradual, headerBarColor: color} = _config.setting;
+                return isHeaderBarColorGradual ? {
+                    background: `linear-gradient(to bottom , ${color}, ${getLightColor(color, .5)})`
+                } : "";
+            })), __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(MenuTop, {
+                    menuTree: _config.menuTree
+                }, 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 = vue.defineComponent({
+        setup(props, {slots: slots}) {
+            const ns = vue.inject("ns", {}), submenuTree = vue.inject("submenuTree", []);
+            return () => vue.createVNode(vue.Fragment, null, [ 0 === submenuTree.value.length ? null : vue.createVNode("aside", {
+                class: ns.b("sidebar")
+            }, [ slots[slots_config_headerMenu] ? slots[slots_config_headerMenu]() : vue.createVNode(NextMenu, {
+                mode: "vertical",
+                menuTree: submenuTree.value
+            }, null) ]) ]);
+        }
+    });
+    const ns$g = useNamespace("layout-composite");
+    var composite = vue.defineComponent({
+        props: {},
+        setup() {
+            vue.provide("ns", ns$g);
+            const submenuTree = vue.ref([]);
+            return vue.provide("submenuTree", submenuTree), vue.provide("updateSubmentTree", (val => {
+                submenuTree.value = [], vue.nextTick((() => {
+                    submenuTree.value = val;
+                }));
+            })), {
+                ns: ns$g,
+                submenuTree: submenuTree
+            };
+        },
         render() {
             const slots = this.$slots, _config = vue.inject("options", {}), _emit = vue.inject("__emit__", {});
             slots.menu;
@@ -2867,7 +3014,8 @@
         defaults: vue.markRaw(defaults),
         transverse: vue.markRaw(transverse),
         columns: vue.markRaw(columns),
-        classic: vue.markRaw(classic)
+        classic: vue.markRaw(classic),
+        composite: vue.markRaw(composite)
     }, customizerCoverArray = (objValue, srcValue) => {
         if (Array.isArray(objValue)) return srcValue;
     };
@@ -4047,6 +4195,10 @@
             top: {
                 type: String,
                 default: "15vh"
+            },
+            nofill: {
+                type: Boolean,
+                default: !1
             }
         },
         emits: [ "close" ],
@@ -4061,7 +4213,7 @@
             return () => vue.createVNode(vue.Fragment, null, [ vue.createVNode(elementPlus.ElDialog, {
                 modelValue: visible.value,
                 "onUpdate:modelValue": $event => visible.value = $event,
-                class: [ ns$b.b(), props.className ],
+                class: [ ns$b.b(), props.className, props.nofill && ns$b.b("nofill") ],
                 style: props.style,
                 title: props.title,
                 appendToBody: props.appendToBody,
@@ -4196,7 +4348,7 @@
         return "function" == typeof s || "[object Object]" === Object.prototype.toString.call(s) && !vue.isVNode(s);
     }
     const ns$9 = useNamespace("form"), InputTableSelect = vue.defineComponent({
-        name: "InputTableSelect",
+        name: "NextInputTableSelect",
         props: {
             modelValue: {
                 type: [ Array, String, Number, Boolean, Object ],
@@ -4212,6 +4364,10 @@
                 type: Boolean,
                 default: !1
             },
+            closable: {
+                type: Boolean,
+                default: !1
+            },
             formParams: {
                 type: Object,
                 default: () => ({})
@@ -4223,7 +4379,10 @@
         },
         emits: [ "select" ],
         setup(props, {emit: emit}) {
-            const {t: t} = useLocale(), _disabled = props.disabled, _column = props.column, _placeholder = _column.placeholder || t("next.form.select") + _column.label, _tableDefaultConfig = deepClone(defaultConfig$4), _tableSelectConfig = deepClone(tableSelectConfig), _options = merge$1(_tableDefaultConfig, _tableSelectConfig, _column.tableSelect), tableSelectDialog = vue.reactive({
+            const {t: t} = useLocale(), _disabled = props.disabled, _closable = props.closable, _column = props.column, _placeholder = _column.placeholder || t("next.form.select") + _column.label, _tableDefaultConfig = deepClone(defaultConfig$4), _tableSelectConfig = deepClone(tableSelectConfig), _options = merge$1(_tableDefaultConfig, _tableSelectConfig, _column.tableSelect), {value: propsValue, label: propsLabel} = _column.tableSelectProps || {
+                value: "id",
+                label: "name"
+            }, tableSelectDialog = vue.reactive({
                 visible: !1,
                 title: _column.label + t("next.form.tableSelect"),
                 dialogWidth: _options.dialogWidth
@@ -4244,15 +4403,13 @@
                     tableReactive.data = res.data || [], tableReactive.page.total = res.total || 0, 
                     tableReactive.loading = !1;
                 }));
-            }, multipleSelection = vue.ref([]);
+            }, multipleSelection = vue.ref([]), sinleSelection = vue.ref("");
             _column.tableSelectDefaultValue?.(props.formParams, _column, (rows => {
-                rows?.length && (_column.tableSelectRows = rows, multipleSelection.value = rows);
+                rows?.length && (_column.tableSelectRows = rows, multipleSelection.value = rows, 
+                sinleSelection.value = rows[0][propsValue]);
             }));
-            const sinleSelection = vue.ref(""), _disabledSelect = vue.computed((() => "radio" === _options.selectType ? !sinleSelection.value : 0 === multipleSelection.value.length)), isSelected = row => multipleSelection.value.includes(row), onResetTableSelect = () => {
+            const _disabledSelect = vue.computed((() => "radio" === _options.selectType ? !sinleSelection.value : 0 === multipleSelection.value.length)), onResetTableSelect = () => {
                 multipleSelection.value = [], sinleSelection.value = "";
-            }, {value: propsValue, label: propsLabel} = _column.tableSelectProps || {
-                value: "id",
-                label: "name"
             }, onConfirmSelect = () => {
                 const rows = vue.toRaw(multipleSelection.value), _rows = arrayObjNoRepeat(rows, propsValue);
                 onCloseTableDialog(), emit("select", _rows);
@@ -4261,10 +4418,10 @@
             }, renderSelectTypeContent = (row, index) => {
                 const rowKey = _options.rowKey, value = valueExist(row[rowKey], index);
                 return "checkbox" === _options.selectType ? vue.createVNode(elementPlus.ElCheckbox, {
-                    modelValue: isSelected(vue.toRaw(row)),
+                    value: value,
                     onChange: event => ((event, row) => {
                         if (event) multipleSelection.value.push(row); else {
-                            const index = multipleSelection.value.indexOf(row);
+                            const index = multipleSelection.value.findIndex((o => o[propsValue] === row[propsValue]));
                             -1 !== index && multipleSelection.value.splice(index, 1);
                         }
                     })(event, vue.toRaw(row))
@@ -4276,8 +4433,8 @@
                 }, null);
             }, tags = vue.ref([]), tagsMore = vue.ref([]), _updateTags = () => {
                 const rows = arrayObjNoRepeat(multipleSelection.value, propsValue).map((row => ({
-                    value: row[propsValue || "value"],
-                    label: row[propsLabel || "label"]
+                    value: row[propsValue],
+                    label: row[propsLabel]
                 })));
                 rows.length > 1 ? (tags.value = rows.splice(0, 1), tagsMore.value = rows) : (tags.value = rows, 
                 tagsMore.value = []);
@@ -4288,6 +4445,20 @@
                 deep: !0,
                 immediate: !0
             });
+            const _multipleSelection = vue.ref([]);
+            vue.watch((() => [ props.formParams[_column.prop], multipleSelection.value ]), (() => {
+                _multipleSelection.value = multipleSelection.value.map((o => o[propsValue])), _updateTags();
+            }), {
+                deep: !0,
+                immediate: !0
+            });
+            const _sinleSelection = vue.ref(null);
+            vue.watch((() => [ props.formParams[_column.prop], sinleSelection.value ]), (() => {
+                _sinleSelection.value = sinleSelection.value, _updateTags();
+            }), {
+                deep: !0,
+                immediate: !0
+            });
             const _onCloseTag = (tag, i) => {
                 const rows = vue.toRaw(multipleSelection.value);
                 rows.splice(i, 1), multipleSelection.value = rows, _updateTags(), emit("select", rows);
@@ -4300,7 +4471,7 @@
                 }, [ tags?.value.length ? vue.createVNode("span", {
                     class: ns$9.em("input-table", "value")
                 }, [ tags.value.map(((tag, index) => vue.createVNode(elementPlus.ElTag, {
-                    closable: !_disabled,
+                    closable: !_closable,
                     onClose: () => _onCloseTag(0, index)
                 }, {
                     default: () => [ tag.label ]
@@ -4313,7 +4484,7 @@
                         default: () => [ vue.createTextVNode("+ "), tagsMore.value.length ]
                     }),
                     content: () => tagsMore.value.map(((tag, index) => vue.createVNode(elementPlus.ElTag, {
-                        closable: !_disabled,
+                        closable: !_closable,
                         onClose: () => _onCloseTag(0, index + 1)
                     }, {
                         default: () => [ tag.label ]
@@ -4332,13 +4503,35 @@
                     title: tableSelectDialog.title,
                     closeOnClickModal: _options.closeOnClickModal,
                     width: _options.dialogWidth,
+                    appendToBody: valueExist(_options.dialogAppendToBody, !0),
                     modal: !1,
                     onClose: onCloseTableDialog
                 }, {
                     default: () => [ vue.createVNode("div", {
                         class: ns$9.em("input-table", "content")
-                    }, [ vue.createVNode(elementPlus.ElRadioGroup, {
-                        modelValue: sinleSelection.value
+                    }, [ "checkbox" === _options.selectType ? vue.createVNode(elementPlus.ElCheckboxGroup, {
+                        modelValue: _multipleSelection.value
+                    }, {
+                        default: () => [ vue.createVNode(NextCrudTable, {
+                            options: _options,
+                            loading: tableReactive.loading,
+                            data: tableReactive.data,
+                            page: tableReactive.page,
+                            "onConfirm-search": onConfirmSearch,
+                            "onClick-add-edit": onClickAddEdit
+                        }, {
+                            default: () => [ vue.createVNode(elementPlus.ElTableColumn, {
+                                fixed: "left",
+                                label: t("next.table.selection"),
+                                width: 55,
+                                headerAlign: _options.headerAlign,
+                                align: _options.cellAlign
+                            }, {
+                                default: ({row: row, $index: $index}) => renderSelectTypeContent(row, $index)
+                            }) ]
+                        }) ]
+                    }) : vue.createVNode(elementPlus.ElRadioGroup, {
+                        modelValue: _sinleSelection.value
                     }, {
                         default: () => [ vue.createVNode(NextCrudTable, {
                             options: _options,
@@ -4850,6 +5043,7 @@
                         disabled: valueExist(col.disabled, !1),
                         readonly: valueExist(col.readonly, !1),
                         multiple: valueExist(col.multiple, !1),
+                        filterable: valueExist(col.filterable, !1),
                         "collapse-tags-tooltip": !0,
                         onChange: event => col.onChange?.(event, col, formParams, formColumns)
                     }, {
@@ -5081,7 +5275,7 @@
             };
         }
     });
-    const NextTreeSelect = withInstall(treeSelect), NextTreeCascader = withInstall(treeCascader), NextForm = withInstall(Element$7);
+    const NextTreeSelect = withInstall(treeSelect), NextTreeCascader = withInstall(treeCascader), NextInputTableSelect = withInstall(InputTableSelect), NextForm = withInstall(Element$7);
     var AddEditForm = vue.defineComponent({
         name: "AddEditForm",
         props: {
@@ -5584,7 +5778,7 @@
                 default: "image/*"
             }
         },
-        emits: [ "change" ],
+        emits: [ "change", "remove", "preview" ],
         setup() {
             const {appContext: appContext} = vue.getCurrentInstance(), {t: t} = useLocale();
             return {
@@ -5615,10 +5809,14 @@
                             }
                         }) ])
                     });
-                    previewImagesContainer.appContext = this.appContext, vue.render(previewComponent, previewImagesContainer);
+                    previewImagesContainer.appContext = this.appContext, vue.render(previewComponent, previewImagesContainer), 
+                    emit("preview", uploadFile);
                 },
                 onChange: (uploadfile, uploadfiles) => {
                     uploadfilesPreview.value = uploadfiles, emit("change", uploadfile, uploadfiles);
+                },
+                onRemove: (uploadfile, uploadfiles) => {
+                    uploadfilesPreview.value = uploadfiles, emit("remove", uploadfile, uploadfiles);
                 }
             }, {
                 trigger: () => slots.default ? slots.default() : "picture-card" === props.listType ? vue.createVNode(elementPlus.ElIcon, null, {
@@ -7969,6 +8167,7 @@
         NextDialog: NextDialog,
         NextDragResize: NextDragResize,
         NextForm: NextForm,
+        NextInputTableSelect: NextInputTableSelect,
         NextLabelimg: NextLabelimg,
         NextLabelimgPreview: NextLabelimgPreview,
         NextLabelme: NextLabelme,
@@ -8023,20 +8222,21 @@
         })(app);
     };
     var index = {
-        version: "0.4.1",
+        version: "0.4.6",
         install: install
     };
     exports.NextContainer = NextContainer, exports.NextCrudTable = NextCrudTable, exports.NextCrudTableVirtualized = NextCrudTableVirtualized, 
     exports.NextDialog = NextDialog, exports.NextDragResize = NextDragResize, exports.NextForm = NextForm, 
-    exports.NextLabelimg = NextLabelimg, exports.NextLabelimgPreview = NextLabelimgPreview, 
-    exports.NextLabelme = NextLabelme, exports.NextLayout = NextLayout, exports.NextMenu = NextMenu, 
-    exports.NextSpinLoading = NextSpinLoading, exports.NextTabs = NextTabs, exports.NextTextEllipsis = NextTextEllipsis, 
-    exports.NextTreeCascader = NextTreeCascader, exports.NextTreeSelect = NextTreeSelect, 
-    exports.NextUpload = NextUpload, exports.NextVideoPlayer = NextVideoPlayer, exports.buildLocaleContext = buildLocaleContext, 
-    exports.buildTranslator = buildTranslator, exports.default = index, exports.defaultNamespace = "next", 
-    exports.install = install, exports.localeContextKey = localeContextKey, exports.localeLang = localeLang, 
-    exports.namespaceContextKey = namespaceContextKey, exports.nextUseCssTheme = nextUseCssTheme, 
-    exports.nextUseCssVar = nextUseCssVar, exports.translate = translate, exports.updateThemeColor = color => {
+    exports.NextInputTableSelect = NextInputTableSelect, exports.NextLabelimg = NextLabelimg, 
+    exports.NextLabelimgPreview = NextLabelimgPreview, exports.NextLabelme = NextLabelme, 
+    exports.NextLayout = NextLayout, exports.NextMenu = NextMenu, exports.NextSpinLoading = NextSpinLoading, 
+    exports.NextTabs = NextTabs, exports.NextTextEllipsis = NextTextEllipsis, exports.NextTreeCascader = NextTreeCascader, 
+    exports.NextTreeSelect = NextTreeSelect, exports.NextUpload = NextUpload, exports.NextVideoPlayer = NextVideoPlayer, 
+    exports.buildLocaleContext = buildLocaleContext, exports.buildTranslator = buildTranslator, 
+    exports.default = index, exports.defaultNamespace = "next", exports.install = install, 
+    exports.localeContextKey = localeContextKey, exports.localeLang = localeLang, exports.namespaceContextKey = namespaceContextKey, 
+    exports.nextUseCssTheme = nextUseCssTheme, exports.nextUseCssVar = nextUseCssVar, 
+    exports.translate = translate, exports.updateThemeColor = color => {
         color && nextUseCssTheme("--el-color-primary", color);
     }, exports.updateThemeColorCssVar = updateThemeColorCssVar, exports.useDetectVideo = () => ({
         detectVideoFrameImage: ({container: container, video: video, modelUrl: modelUrl, classNames: classNames, classInput: classInput = []}, success, error) => modelUrl ? classNames ? void tf__namespace.loadGraphModel(modelUrl).then((model => {
@@ -8070,7 +8270,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.4.1", 
+    }, exports.useLocale = useLocale, exports.useNamespace = useNamespace, exports.version = "0.4.6", 
     Object.defineProperty(exports, "__esModule", {
         value: !0
     });