vxe-pc-ui 4.19.0 → 4.19.2

package/dist/all.esm.js

@@ -101,7 +101,7 @@ function checkDynamic() {
 }
 
 const { log } = VxeUI;
-const uiVersion = `ui v${"4.19.0"}`;
+const uiVersion = `ui v${"4.19.2"}`;
 function createComponentLog(name) {
     const tableVersion = VxeUI.tableVersion ? `table v${VxeUI.tableVersion}` : '';
     const ganttVersion = VxeUI.ganttVersion ? `gantt v${VxeUI.ganttVersion}` : '';
@@ -115,7 +115,7 @@ function createComponentLog(name) {
 const warnLog$i = log.create('warn', uiVersion);
 log.create('error', uiVersion);
 
-const version = "4.19.0";
+const version = "4.19.2";
 VxeUI.uiVersion = version;
 VxeUI.dynamicApp = dynamicApp;
 function config(options) {
@@ -29013,6 +29013,39 @@ var VxeScrollbarComponent = defineVxeComponent({
                     viewEl.scrollIntoView();
                 }
             },
+            setScrollTop(top) {
+                const viewEl = refViewElem.value;
+                if (viewEl) {
+                    viewEl.scrollTop = top;
+                }
+            },
+            setScrollLeft(left) {
+                const viewEl = refViewElem.value;
+                if (viewEl) {
+                    viewEl.scrollLeft = left;
+                }
+            },
+            getScrollTop() {
+                const viewEl = refViewElem.value;
+                if (viewEl) {
+                    return viewEl.scrollTop;
+                }
+                return 0;
+            },
+            getScrollLeft() {
+                const viewEl = refViewElem.value;
+                if (viewEl) {
+                    return viewEl.scrollLeft;
+                }
+                return 0;
+            },
+            clearScroll() {
+                const viewEl = refViewElem.value;
+                if (viewEl) {
+                    viewEl.scrollTop = 0;
+                    viewEl.scrollLeft = 0;
+                }
+            },
             recalculate() {
                 updateThumbSize();
                 updateThumbOffset();
@@ -29389,6 +29422,10 @@ var VxeLayoutAsideComponent = defineVxeComponent({
         loading: Boolean,
         padding: Boolean,
         collapseConfig: Object,
+        useScrollbar: {
+            type: Boolean,
+            default: () => getConfig$4().layoutAside.useScrollbar
+        },
         scrollbarConfig: Object,
         size: {
             type: String,
@@ -29443,7 +29480,7 @@ var VxeLayoutAsideComponent = defineVxeComponent({
         const layoutAsidePrivateMethods = {};
         Object.assign($xeLayoutAside, layoutAsideMethods, layoutAsidePrivateMethods);
         const renderVN = () => {
-            const { collapsed, loading, padding } = props;
+            const { collapsed, loading, padding, useScrollbar } = props;
             const varStyle = computeVarStyle.value;
             const vSize = computeSize.value;
             const collapseOpts = computeCollapseOpts.value;
@@ -29461,21 +29498,29 @@ var VxeLayoutAsideComponent = defineVxeComponent({
                     }],
                 style: varStyle
             }, [
-                h(VxeScrollbar, {
-                    loading,
-                    native,
-                    xConfig: {
-                        visible: 'hidden'
-                    },
-                    yConfig,
-                    className: 'vxe-layout-aside--scrollbar' + (className ? (' ' + className) : ''),
-                    viewAttrs,
-                    viewClassName: 'vxe-layout-aside--view' + (viewClassName ? (' ' + viewClassName) : ''),
-                    viewInnerClassName: 'vxe-layout-aside--inner' + (viewInnerClassName ? (' ' + viewInnerClassName) : '')
-                }, {
-                    default: () => {
-                        return defaultSlot ? defaultSlot({}) : [];
-                    }
+                useScrollbar
+                    ? h(VxeScrollbar, {
+                        native,
+                        xConfig: {
+                            visible: 'hidden'
+                        },
+                        yConfig,
+                        className: 'vxe-layout-aside--scrollbar' + (className ? (' ' + className) : ''),
+                        viewAttrs,
+                        viewClassName: 'vxe-layout-aside--scrollbar-view' + (viewClassName ? (' ' + viewClassName) : ''),
+                        viewInnerClassName: 'vxe-layout-aside--scrollbar-inner' + (viewInnerClassName ? (' ' + viewInnerClassName) : '')
+                    }, {
+                        default: () => defaultSlot ? defaultSlot({}) : []
+                    })
+                    : h('div', {
+                        class: 'vxe-layout-aside--inner'
+                    }, defaultSlot ? defaultSlot({}) : []),
+                /**
+                 * 加载中
+                 */
+                h(VxeLoading, {
+                    class: 'vxe-layout-aside-view--loading',
+                    modelValue: loading
                 })
             ]);
         };
@@ -29513,6 +29558,10 @@ var VxeLayoutBodyComponent = defineVxeComponent({
             default: () => getConfig$4().layoutBody.showBacktop
         },
         backtopConfig: Object,
+        useScrollbar: {
+            type: Boolean,
+            default: () => getConfig$4().layoutBody.useScrollbar
+        },
         scrollbarConfig: Object,
         size: {
             type: String,
@@ -29560,7 +29609,7 @@ var VxeLayoutBodyComponent = defineVxeComponent({
         const layoutBodyPrivateMethods = {};
         Object.assign($xeLayoutBody, layoutBodyMethods, layoutBodyPrivateMethods);
         const renderVN = () => {
-            const { loading, padding, showBacktop } = props;
+            const { loading, padding, showBacktop, useScrollbar } = props;
             const backtopOpts = computeBacktopOpts.value;
             const scrollbarOpts = computeScrollbarOpts.value;
             const { native, xConfig, yConfig, className, viewAttrs, viewClassName, viewInnerClassName } = scrollbarOpts;
@@ -29587,17 +29636,28 @@ var VxeLayoutBodyComponent = defineVxeComponent({
                         'is--padding': padding
                     }]
             }, [
-                h(VxeScrollbar, {
-                    loading,
-                    native,
-                    xConfig,
-                    yConfig,
-                    className: 'vxe-layout-body--scrollbar' + (className ? (' ' + className) : ''),
-                    viewAttrs: Object.assign(Object.assign({}, viewAttrs), { id: showBacktop ? (backtopId || null) : null }),
-                    viewClassName: 'vxe-layout-body--view' + (viewClassName ? (' ' + viewClassName) : ''),
-                    viewInnerClassName: 'vxe-layout-body--inner' + (viewInnerClassName ? (' ' + viewInnerClassName) : '')
-                }, {
-                    default: () => defaultSlot ? defaultSlot({}) : []
+                useScrollbar
+                    ? h(VxeScrollbar, {
+                        native,
+                        xConfig,
+                        yConfig,
+                        className: 'vxe-layout-body--scrollbar' + (className ? (' ' + className) : ''),
+                        viewAttrs: Object.assign(Object.assign({}, viewAttrs), { id: showBacktop ? (backtopId || null) : null }),
+                        viewClassName: 'vxe-layout-body--scrollbar-view' + (viewClassName ? (' ' + viewClassName) : ''),
+                        viewInnerClassName: 'vxe-layout-body--scrollbar-inner' + (viewInnerClassName ? (' ' + viewInnerClassName) : '')
+                    }, {
+                        default: () => defaultSlot ? defaultSlot({}) : []
+                    })
+                    : h('div', {
+                        id: showBacktop ? backtopId : '',
+                        class: 'vxe-layout-body--inner'
+                    }, defaultSlot ? defaultSlot({}) : []),
+                /**
+                 * 加载中
+                 */
+                h(VxeLoading, {
+                    class: 'vxe-layout-body-view--loading',
+                    modelValue: loading
                 }),
                 /**
                  * 回到顶部
@@ -30004,6 +30064,10 @@ var VxeMenuComponent = defineVxeComponent({
             default: () => getConfig$1().menu.size || getConfig$1().size
         },
         menuConfig: Object,
+        useScrollbar: {
+            type: Boolean,
+            default: () => getConfig$1().menu.useScrollbar
+        },
         scrollbarConfig: Object,
         appendTo: {
             type: [String, Function],
@@ -30022,6 +30086,8 @@ var VxeMenuComponent = defineVxeComponent({
         const $xeLayoutAside = inject('$xeLayoutAside', null);
         const refElem = ref();
         const refCollapseElem = ref();
+        const refCollapseBodyElem = ref();
+        const refCollapseBodyScrollbar = ref();
         const { computeSize } = useSize(props);
         const reactData = reactive(createReactData$b());
         const internalData = createInternalData$a();
@@ -30186,16 +30252,21 @@ var VxeMenuComponent = defineVxeComponent({
                     const isCollapsed = computeIsCollapsed.value;
                     const el = refElem.value;
                     if (el) {
-                        const clientRect = el.getBoundingClientRect();
-                        const parentNode = el.parentNode;
-                        reactData.collapseStyle = isCollapsed
-                            ? {
-                                top: toCssUnit(clientRect.top),
-                                left: toCssUnit(clientRect.left),
-                                height: toCssUnit(parentNode.clientHeight),
-                                zIndex: reactData.collapseZindex
+                        let clientRect = el.getBoundingClientRect();
+                        const parentElement = el.parentElement;
+                        if (parentElement) {
+                            if (clientRect.top < 0) {
+                                clientRect = parentElement.getBoundingClientRect();
                             }
-                            : {};
+                            reactData.collapseStyle = isCollapsed
+                                ? {
+                                    top: toCssUnit(clientRect.top),
+                                    left: toCssUnit(clientRect.left),
+                                    height: toCssUnit(parentElement.clientHeight),
+                                    zIndex: reactData.collapseZindex
+                                }
+                                : {};
+                        }
                     }
                 });
             }
@@ -30328,6 +30399,14 @@ var VxeMenuComponent = defineVxeComponent({
             }
         };
         const handleMenuMouseleave = () => {
+            const $collapseBodyScrollbar = refCollapseBodyScrollbar.value;
+            const collapseBodyEl = refCollapseBodyElem.value;
+            if (collapseBodyEl) {
+                collapseBodyEl.scrollTop = 0;
+            }
+            if ($collapseBodyScrollbar) {
+                $collapseBodyScrollbar.clearScroll();
+            }
             reactData.isEnterCollapse = false;
         };
         const callSlot = (slotFunc, params) => {
@@ -30540,13 +30619,14 @@ var VxeMenuComponent = defineVxeComponent({
             ]);
         };
         const renderVN = () => {
-            const { loading, collapseFixed, appendTo } = props;
+            const { loading, collapseFixed, appendTo, useScrollbar } = props;
             const { initialized, menuList, collapseStyle, isEnterCollapse } = reactData;
             const vSize = computeSize.value;
             const isCollapsed = computeIsCollapsed.value;
             const currBorder = computeCurrBorder.value;
             const varStyle = computeVarStyle.value;
             const scrollbarOpts = computeScrollbarOpts.value;
+            const { viewClassName, viewInnerClassName } = scrollbarOpts;
             const headerSlot = slots.header;
             const footerSlot = slots.footer;
             let ons = {};
@@ -30595,9 +30675,14 @@ var VxeMenuComponent = defineVxeComponent({
                                     class: 'vxe-menu--header'
                                 }, headerSlot(stParams))
                                 : renderEmptyElement$1($xeMenu),
-                            h(VxeScrollbar, Object.assign({ class: 'vxe-menu--body' }, scrollbarOpts), {
-                                default: () => menuList.map(child => renderDefaultChildren(child, menuList))
-                            }),
+                            useScrollbar && isEnterCollapse
+                                ? h(VxeScrollbar, Object.assign(Object.assign({ ref: refCollapseBodyScrollbar, class: 'vxe-menu--scrollbar-body' }, scrollbarOpts), { viewClassName: 'vxe-menu--scrollbar-body-view' + (viewClassName ? (' ' + viewClassName) : ''), viewInnerClassName: 'vxe-menu--scrollbar-body-inner' + (viewClassName ? (' ' + viewInnerClassName) : '') }), {
+                                    default: () => menuList.map(child => renderDefaultChildren(child, menuList))
+                                })
+                                : h('div', {
+                                    ref: refCollapseBodyElem,
+                                    class: 'vxe-menu--body'
+                                }, menuList.map(child => renderDefaultChildren(child, menuList))),
                             footerSlot
                                 ? h('div', {
                                     class: 'vxe-menu--footer'