vxe-table 4.19.0-beta.9 → 4.19.1

package/es/table/module/custom/panel.js

@@ -34,7 +34,7 @@ export default defineVxeComponent({
         const VxeUIRadioGroupComponent = VxeUI.getComponent('VxeRadioGroup');
         const $xeTable = inject('$xeTable', {});
         const { props: tableProps, reactData: tableReactData, internalData: tableInternalData } = $xeTable;
-        const { computeSize, computeCustomOpts, computeColumnDragOpts, computeColumnOpts, computeIsMaxFixedColumn, computeResizableOpts } = $xeTable.getComputeMaps();
+        const { computeSize, computeCustomOpts, computeColumnDragOpts, computeColumnOpts, computeIsMaxFixedColumn, computeResizableOpts, computeAggregateOpts } = $xeTable.getComputeMaps();
         const refElem = ref();
         const refBodyWrapperElem = ref();
         const refCustomBodyElem = ref();
@@ -498,7 +498,7 @@ export default defineVxeComponent({
         };
         const sortDragoverEvent = (evnt) => {
             const customOpts = computeCustomOpts.value;
-            const { immediate } = customOpts;
+            const { showSortDragButton, allowSort, immediate } = customOpts;
             const columnDragOpts = computeColumnDragOpts.value;
             const { isCrossDrag, isToChildDrag } = columnDragOpts;
             const optEl = evnt.currentTarget;
@@ -514,9 +514,12 @@ export default defineVxeComponent({
                 const offsetY = evnt.clientY - optEl.getBoundingClientRect().y;
                 const dragPos = offsetY < optEl.clientHeight / 2 ? 'top' : 'bottom';
                 if (!dragCol ||
+                    !(showSortDragButton && allowSort) ||
                     (dragCol && dragCol.id === column.id) ||
                     (!isCrossDrag && column.level > 1) ||
-                    (!immediate && column.level > 1)) {
+                    (!immediate && column.level > 1) ||
+                    (!isCrossDrag && dragCol.level > 1) ||
+                    (!immediate && dragCol.level > 1)) {
                     showDropTip(evnt, optEl, false, dragPos);
                     return;
                 }
@@ -648,7 +651,7 @@ export default defineVxeComponent({
             const { immediate } = customOpts;
             const columnDragOpts = computeColumnDragOpts.value;
             const { popupStyle } = customStore;
-            const { checkMethod, visibleMethod, allowVisible, allowSort, allowFixed, trigger, placement, showSortDragButton, showSortMoveButton, showSortPutButton } = customOpts;
+            const { checkMethod, visibleMethod, allowVisible, allowSort, allowFixed, allowGroup, allowValues, trigger, placement, showSortDragButton, showSortMoveButton, showSortPutButton } = customOpts;
             const isMaxFixedColumn = computeIsMaxFixedColumn.value;
             const vSize = computeSize.value;
             const { isCrossDrag } = columnDragOpts;
@@ -719,23 +722,25 @@ export default defineVxeComponent({
                         h('div', {
                             class: 'vxe-table-custom--name-option'
                         }, [
-                            allowSort && showSortDragButton && showSortBtn
-                                ? h('div', {
-                                    class: 'vxe-table-custom--sort-option'
-                                }, [
-                                    h('span', Object.assign({ class: ['vxe-table-custom--sort-btn', {
-                                                'is--disabled': isHidden
-                                            }], title: getI18n('vxe.custom.setting.sortHelpTip') }, (isHidden
-                                        ? {}
-                                        : {
-                                            onMousedown: sortMousedownEvent,
-                                            onMouseup: sortMouseupEvent
-                                        })), [
-                                        h('i', {
-                                            class: getIcon().TABLE_CUSTOM_SORT
-                                        })
+                            (allowSort && showSortDragButton) || (allowGroup || allowValues)
+                                ? (showSortBtn || ((allowGroup || allowValues) && !isColGroup)
+                                    ? h('div', {
+                                        class: 'vxe-table-custom--sort-option'
+                                    }, [
+                                        h('span', Object.assign({ class: ['vxe-table-custom--sort-btn', {
+                                                    'is--disabled': isHidden
+                                                }], title: getI18n('vxe.custom.setting.sortHelpTip') }, (isHidden
+                                            ? {}
+                                            : {
+                                                onMousedown: sortMousedownEvent,
+                                                onMouseup: sortMouseupEvent
+                                            })), [
+                                            h('i', {
+                                                class: getIcon().TABLE_CUSTOM_SORT
+                                            })
+                                        ])
                                     ])
-                                ])
+                                    : renderEmptyElement($xeTable))
                                 : renderEmptyElement($xeTable),
                             column.type === 'html'
                                 ? h('div', {
@@ -968,9 +973,10 @@ export default defineVxeComponent({
             const { treeConfig, rowGroupConfig, aggregateConfig, resizable: allResizable } = tableProps;
             const { isCustomStatus, customColumnList } = tableReactData;
             const customOpts = computeCustomOpts.value;
-            const { immediate, showSortDragButton, showSortMoveButton, showSortPutButton } = customOpts;
             const columnDragOpts = computeColumnDragOpts.value;
-            const { mode, modalOptions, drawerOptions, allowVisible, allowSort, allowFixed, allowResizable, checkMethod, visibleMethod } = customOpts;
+            const aggregateOpts = computeAggregateOpts.value;
+            const { placement: aggPlacement } = aggregateOpts;
+            const { mode, immediate, showSortDragButton, showSortMoveButton, showSortPutButton, modalOptions, drawerOptions, allowVisible, allowSort, allowFixed, allowResizable, allowGroup, allowValues, checkMethod, visibleMethod } = customOpts;
             const columnOpts = computeColumnOpts.value;
             const { maxFixedSize } = columnOpts;
             const resizableOpts = computeResizableOpts.value;
@@ -988,6 +994,7 @@ export default defineVxeComponent({
             const trVNs = [];
             const isAllChecked = customStore.isAll;
             const isAllIndeterminate = customStore.isIndeterminate;
+            const isAggRtBmLayout = aggPlacement === 'right' || aggPlacement === 'bottom';
             const params = {
                 $table: $xeTable,
                 $grid: $xeGrid,
@@ -1064,8 +1071,8 @@ export default defineVxeComponent({
                             h('div', {
                                 class: 'vxe-table-custom-popup--name'
                             }, [
-                                allowSort
-                                    ? showSortDragButton && (showSortBtn
+                                (allowSort && showSortDragButton) || (allowGroup || allowValues)
+                                    ? (showSortBtn || ((allowGroup || allowValues) && !isColGroup)
                                         ? h('div', Object.assign({ class: ['vxe-table-custom-popup--column-sort-btn', {
                                                     'is--disabled': isHidden
                                                 }], title: getI18n('vxe.custom.setting.sortHelpTip') }, (isHidden
@@ -1204,11 +1211,11 @@ export default defineVxeComponent({
                 default: () => {
                     return h('div', {
                         ref: refBodyWrapperElem,
-                        class: 'vxe-table-custom-popup--body-wrapper'
+                        class: ['vxe-table-custom-popup--body-wrapper', `agg-layout--${aggPlacement}`]
                     }, defaultSlot
                         ? $xeTable.callSlot(defaultSlot, params)
                         : [
-                            !treeConfig && (aggregateConfig || rowGroupConfig) && $xeTable.getPivotTableAggregatePopupPanel
+                            !isAggRtBmLayout && !treeConfig && (aggregateConfig || rowGroupConfig) && $xeTable.getPivotTableAggregatePopupPanel
                                 ? h($xeTable.getPivotTableAggregatePopupPanel(), {
                                     customStore
                                 })
@@ -1291,7 +1298,12 @@ export default defineVxeComponent({
                                     }, $xeTable.callSlot(bottomSlot, params))
                                     : renderEmptyElement($xeTable),
                                 renderDragTip()
-                            ])
+                            ]),
+                            isAggRtBmLayout && !treeConfig && (aggregateConfig || rowGroupConfig) && $xeTable.getPivotTableAggregatePopupPanel
+                                ? h($xeTable.getPivotTableAggregatePopupPanel(), {
+                                    customStore
+                                })
+                                : renderEmptyElement($xeTable)
                         ]);
                 },
                 footer: () => {

package/es/table/src/table.js

@@ -1755,6 +1755,7 @@ export default defineVxeComponent({
          * 计算自适应列宽
          */
         const calcColumnAutoWidth = (column, wrapperEl) => {
+            const { scrollYLoad } = reactData;
             const columnOpts = computeColumnOpts.value;
             const { autoOptions } = columnOpts;
             const { isCalcHeader, isCalcBody, isCalcFooter } = autoOptions || {};
@@ -1775,7 +1776,7 @@ export default defineVxeComponent({
                 const cellStyle = getComputedStyle(firstCellEl.parentElement);
                 leftRightPadding = Math.ceil(XEUtils.toNumber(cellStyle.paddingLeft) + XEUtils.toNumber(cellStyle.paddingRight));
             }
-            let colWidth = column.renderAutoWidth - leftRightPadding;
+            let colWidth = (scrollYLoad ? column.renderAutoWidth : 0) - leftRightPadding;
             for (let i = 0; i < cellElemList.length; i++) {
                 const celEl = cellElemList[i];
                 colWidth = Math.max(colWidth, celEl ? Math.ceil(celEl.scrollWidth) + 4 : 0);
@@ -4372,7 +4373,7 @@ export default defineVxeComponent({
                         });
                     }
                 });
-            }, 200);
+            }, 240);
         };
         const getWheelSpeed = (lastScrollTime) => {
             let multiple = 1;
@@ -12106,7 +12107,7 @@ export default defineVxeComponent({
                     return;
                 }
                 const { highlightHoverRow } = tableProps;
-                const { scrollXLoad, scrollYLoad, expandColumn } = reactData;
+                const { scrollXLoad, scrollYLoad, overflowX, overflowY, expandColumn } = reactData;
                 const leftFixedWidth = computeLeftFixedWidth.value;
                 const rightFixedWidth = computeRightFixedWidth.value;
                 const { elemStore, lastScrollTop, lastScrollLeft } = internalData;
@@ -12129,10 +12130,10 @@ export default defineVxeComponent({
                 const deltaLeft = (shiftKey ? (deltaX || deltaY) : deltaX) * wheelSpeed;
                 const currScrollTop = bodyScrollElem.scrollTop;
                 const currScrollLeft = bodyScrollElem.scrollLeft;
-                const scrollTop = currScrollTop + deltaTop;
-                const scrollLeft = currScrollLeft + deltaLeft;
-                const isRollX = scrollLeft !== lastScrollLeft;
-                const isRollY = scrollTop !== lastScrollTop;
+                const scrollTop = Math.max(0, currScrollTop + deltaTop);
+                const scrollLeft = Math.max(0, currScrollLeft + deltaLeft);
+                const isRollX = overflowX && scrollLeft !== lastScrollLeft;
+                const isRollY = overflowY && scrollTop !== lastScrollTop;
                 if (isRollX) {
                     // 如果禁用滚动
                     if (scrollbarXOpts.visible === 'hidden') {
@@ -12167,7 +12168,7 @@ export default defineVxeComponent({
                         }
                     }
                 }
-                if (!(leftFixedWidth || rightFixedWidth || expandColumn)) {
+                if (!(isRollX || leftFixedWidth || rightFixedWidth || expandColumn)) {
                     return;
                 }
                 if (rowOpts.isHover || highlightHoverRow) {
@@ -13885,7 +13886,7 @@ export default defineVxeComponent({
                 warnLog('vxe.error.errConflicts', ['mouse-config.area', 'mouse-config.selected']);
             }
             if (mouseOpts.area && (props.treeConfig && !treeOpts.transform)) {
-                errLog('vxe.error.noTree', ['mouse-config.area']);
+                errLog('vxe.error.notSupportProp', ['mouse-config.area', 'tree-config.transform=false', 'tree-config.transform=true']);
             }
             if (props.editConfig && editOpts.activeMethod) {
                 warnLog('vxe.error.delProp', ['edit-config.activeMethod', 'edit-config.beforeEditMethod']);

package/es/table/style.css

@@ -1006,11 +1006,14 @@
 .vxe-table-custom-popup--body-wrapper {
   position: relative;
   display: flex;
-  flex-direction: column;
+  flex-direction: row;
   overflow: hidden;
   height: 100%;
   outline: 0;
 }
+.vxe-table-custom-popup--body-wrapper.agg-layout--top, .vxe-table-custom-popup--body-wrapper.agg-layout--bottom {
+  flex-direction: column;
+}
 
 .vxe-table-custom-popup--handle-wrapper {
   flex-grow: 1;