vxe-table 3.21.0-beta.9 → 3.21.1

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

@@ -574,7 +574,7 @@ export default {
             const customPanelInternalData = $xeTableCustomPanel.internalData;
             const { dragCol } = customPanelReactData;
             const customOpts = $xeTable.computeCustomOpts;
-            const { immediate } = customOpts;
+            const { showSortDragButton, allowSort, immediate } = customOpts;
             const columnDragOpts = $xeTable.computeColumnDragOpts;
             const { isCrossDrag, isToChildDrag } = columnDragOpts;
             const optEl = evnt.currentTarget;
@@ -589,9 +589,12 @@ export default {
                 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($xeTableCustomPanel, evnt, optEl, false, dragPos);
                     return;
                 }
@@ -747,7 +750,7 @@ export default {
             const { immediate } = customOpts;
             const columnDragOpts = $xeTable.computeColumnDragOpts;
             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 = $xeTable.computeIsMaxFixedColumn;
             const vSize = $xeTable.computeSize;
             const { isCrossDrag } = columnDragOpts;
@@ -826,29 +829,31 @@ export default {
                         h('div', {
                             class: 'vxe-table-custom--name-option'
                         }, [
-                            allowSort && showSortDragButton && showSortBtn
-                                ? h('div', {
-                                    class: 'vxe-table-custom--sort-option'
-                                }, [
-                                    h('span', {
-                                        class: ['vxe-table-custom--sort-btn', {
-                                                'is--disabled': isHidden
-                                            }],
-                                        attrs: {
-                                            title: getI18n('vxe.custom.setting.sortHelpTip')
-                                        },
-                                        on: isHidden
-                                            ? {}
-                                            : {
-                                                mousedown: $xeTableCustomPanel.sortMousedownEvent,
-                                                mouseup: $xeTableCustomPanel.sortMouseupEvent
-                                            }
+                            (allowSort && showSortDragButton) || (allowGroup || allowValues)
+                                ? (showSortBtn || ((allowGroup || allowValues) && !isColGroup)
+                                    ? h('div', {
+                                        class: 'vxe-table-custom--sort-option'
                                     }, [
-                                        h('i', {
-                                            class: getIcon().TABLE_CUSTOM_SORT
-                                        })
+                                        h('span', {
+                                            class: ['vxe-table-custom--sort-btn', {
+                                                    'is--disabled': isHidden
+                                                }],
+                                            attrs: {
+                                                title: getI18n('vxe.custom.setting.sortHelpTip')
+                                            },
+                                            on: isHidden
+                                                ? {}
+                                                : {
+                                                    mousedown: $xeTableCustomPanel.sortMousedownEvent,
+                                                    mouseup: $xeTableCustomPanel.sortMouseupEvent
+                                                }
+                                        }, [
+                                            h('i', {
+                                                class: getIcon().TABLE_CUSTOM_SORT
+                                            })
+                                        ])
                                     ])
-                                ])
+                                    : renderEmptyElement($xeTable))
                                 : renderEmptyElement($xeTable),
                             column.type === 'html'
                                 ? h('div', {
@@ -1134,9 +1139,10 @@ export default {
             const { treeConfig, rowGroupConfig, aggregateConfig, resizable: allResizable } = tableProps;
             const { isCustomStatus, customColumnList } = tableReactData;
             const customOpts = $xeTable.computeCustomOpts;
-            const { immediate, showSortDragButton, showSortMoveButton, showSortPutButton } = customOpts;
             const columnDragOpts = $xeTable.computeColumnDragOpts;
-            const { mode, modalOptions, drawerOptions, allowVisible, allowSort, allowFixed, allowResizable, checkMethod, visibleMethod } = customOpts;
+            const aggregateOpts = $xeTable.computeAggregateOpts;
+            const { placement: aggPlacement } = aggregateOpts;
+            const { mode, immediate, showSortDragButton, showSortMoveButton, showSortPutButton, modalOptions, drawerOptions, allowVisible, allowSort, allowFixed, allowResizable, allowGroup, allowValues, checkMethod, visibleMethod } = customOpts;
             const columnOpts = $xeTable.computeColumnOpts;
             const { maxFixedSize } = columnOpts;
             const resizableOpts = $xeTable.computeResizableOpts;
@@ -1154,6 +1160,7 @@ export default {
             const trVNs = [];
             const isAllChecked = customStore.isAll;
             const isAllIndeterminate = customStore.isIndeterminate;
+            const isAggRtBmLayout = aggPlacement === 'right' || aggPlacement === 'bottom';
             const params = {
                 $table: $xeTable,
                 $grid: $xeGrid,
@@ -1238,8 +1245,8 @@ export default {
                             h('div', {
                                 class: 'vxe-table-custom-popup--name'
                             }, [
-                                allowSort
-                                    ? showSortDragButton && (showSortBtn
+                                (allowSort && showSortDragButton) || (allowGroup || allowValues)
+                                    ? (showSortBtn || ((allowGroup || allowValues) && !isColGroup)
                                         ? h('div', {
                                             class: ['vxe-table-custom-popup--column-sort-btn', {
                                                     'is--disabled': isHidden
@@ -1409,11 +1416,11 @@ export default {
                 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, h)
                         : [
-                            !treeConfig && (aggregateConfig || rowGroupConfig) && $xeTable.getPivotTableAggregatePopupPanel
+                            !isAggRtBmLayout && !treeConfig && (aggregateConfig || rowGroupConfig) && $xeTable.getPivotTableAggregatePopupPanel
                                 ? h($xeTable.getPivotTableAggregatePopupPanel(), {
                                     props: {
                                         customStore
@@ -1502,7 +1509,14 @@ export default {
                                     }, $xeTable.callSlot(bottomSlot, params, h))
                                     : renderEmptyElement($xeTable),
                                 $xeTableCustomPanel.renderDragTip(h)
-                            ])
+                            ]),
+                            isAggRtBmLayout && !treeConfig && (aggregateConfig || rowGroupConfig) && $xeTable.getPivotTableAggregatePopupPanel
+                                ? h($xeTable.getPivotTableAggregatePopupPanel(), {
+                                    props: {
+                                        customStore
+                                    }
+                                })
+                                : renderEmptyElement($xeTable)
                         ]);
                 },
                 footer: () => {

package/es/table/src/methods.js

@@ -3911,7 +3911,7 @@ function checkLastSyncScroll($xeTable, isRollX, isRollY) {
                 });
             }
         });
-    }, 200);
+    }, 240);
 }
 const getWheelSpeed = (lastScrollTime) => {
     let multiple = 1;
@@ -3963,6 +3963,8 @@ function updateHeight($xeTable) {
  * 计算自适应列宽
  */
 function calcColumnAutoWidth($xeTable, column, wrapperEl) {
+    const reactData = $xeTable;
+    const { scrollYLoad } = reactData;
     const columnOpts = $xeTable.computeColumnOpts;
     const { autoOptions } = columnOpts;
     const { isCalcHeader, isCalcBody, isCalcFooter } = autoOptions || {};
@@ -3983,7 +3985,7 @@ function calcColumnAutoWidth($xeTable, column, wrapperEl) {
         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);
@@ -11720,7 +11722,7 @@ const tableMethods = {
             return;
         }
         const { highlightHoverRow } = tableProps;
-        const { scrollXLoad, scrollYLoad, expandColumn } = reactData;
+        const { scrollXLoad, scrollYLoad, overflowX, overflowY, expandColumn } = reactData;
         const leftFixedWidth = $xeTable.computeLeftFixedWidth;
         const rightFixedWidth = $xeTable.computeRightFixedWidth;
         const { elemStore, lastScrollTop, lastScrollLeft } = internalData;
@@ -11743,10 +11745,10 @@ const tableMethods = {
         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') {
@@ -11781,7 +11783,7 @@ const tableMethods = {
                 }
             }
         }
-        if (!(leftFixedWidth || rightFixedWidth || expandColumn)) {
+        if (!(isRollX || leftFixedWidth || rightFixedWidth || expandColumn)) {
             return;
         }
         if (rowOpts.isHover || highlightHoverRow) {

package/es/table/src/table.js

@@ -1706,7 +1706,7 @@ export default {
             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', ['table.edit-config.activeMethod', 'table.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;