vxe-table 3.21.7 → 3.21.8

package/es/table/src/methods.js

@@ -3,7 +3,7 @@ import { getTpImg, isPx, isScale, hasClass, addClass, removeClass, wheelScrollLe
 import { getLastZIndex, nextZIndex, hasChildrenList, getFuncText, isEnableConf, formatText, eqEmptyValue } from '../../ui/src/utils';
 import { VxeUI } from '../../ui';
 import Cell from './cell';
-import { getRowUniqueId, createRowId, clearTableAllStatus, getColumnList, toFilters, getRowkey, getRowid, rowToVisible, colToVisible, getCellValue, setCellValue, handleRowidOrRow, handleFieldOrColumn, toTreePathSeq, restoreScrollLocation, getRootColumn, getColReMinWidth, getColReMaxWidth, createHandleUpdateRowId, createHandleGetRowId, getRefElem, getCellRestHeight, getLastChildColumn } from './util';
+import { getRowUniqueId, createRowId, clearTableAllStatus, getColumnList, toFilters, getRowkey, getRowid, rowToVisible, colToVisible, getCellValue, setCellValue, handleRowidOrRow, handleFieldOrColumn, toTreePathSeq, restoreScrollLocation, getRootColumn, getColReMinWidth, getColReMaxWidth, createHandleUpdateRowId, createHandleGetRowId, getRefElem, getCellRestHeight, getLastChildColumn, getRowMaxHeight } from './util';
 import { getSlotVNs } from '../../ui/src/vn';
 import { moveRowAnimateToTb, clearRowAnimate, moveColAnimateToLr, clearColAnimate } from '../../ui/src/anime';
 import { warnLog, errLog } from '../../ui/src/log';
@@ -2470,35 +2470,39 @@ function autoCellWidth($xeTable) {
 /**
  * 计算自适应行高
  */
-const calcCellAutoHeight = ($xeTable, rowRest, wrapperEl) => {
-    const reactData = $xeTable;
-    const { scrollXLoad } = reactData;
+const calcCellAutoHeight = ($xeTable, rowid, rowRest, wrapperEl) => {
+    const internalData = $xeTable;
+    const { fullCellHeightMaps } = internalData;
+    let chRest = fullCellHeightMaps[rowid];
+    if (!chRest) {
+        chRest = {};
+        fullCellHeightMaps[rowid] = chRest;
+    }
     const wrapperElemList = wrapperEl.querySelectorAll(`.vxe-cell--wrapper[rowid="${rowRest.rowid}"]`);
-    let colHeight = 0;
     let firstCellStyle = null;
     let topBottomPadding = 0;
+    let changeCH = false;
     for (let i = 0; i < wrapperElemList.length; i++) {
         const wrapperElem = wrapperElemList[i];
         const cellElem = wrapperElem.parentElement;
         const cellStyle = cellElem.style;
         const orHeight = cellStyle.height;
-        if (!scrollXLoad) {
-            cellStyle.height = '';
-        }
+        const colid = wrapperElem.getAttribute('colid') || '';
+        cellStyle.height = '';
         if (!firstCellStyle) {
             firstCellStyle = getComputedStyle(cellElem);
             topBottomPadding = firstCellStyle ? Math.ceil(XEUtils.toNumber(firstCellStyle.paddingTop) + XEUtils.toNumber(firstCellStyle.paddingBottom)) : 0;
         }
-        if (!scrollXLoad) {
-            cellStyle.height = orHeight;
-        }
         const cellHeight = wrapperElem ? wrapperElem.clientHeight : 0;
-        colHeight = Math.max(colHeight, Math.ceil(cellHeight + topBottomPadding));
-    }
-    if (scrollXLoad) {
-        colHeight = Math.max(colHeight, rowRest.height);
+        const colHeight = Math.ceil(cellHeight + topBottomPadding);
+        if (chRest[colid] !== colHeight) {
+            changeCH = true;
+            chRest[colid] = colHeight;
+        }
+        cellStyle.height = orHeight;
     }
-    return colHeight;
+    const cellMaxHeight = getRowMaxHeight(chRest, changeCH);
+    return cellMaxHeight;
 };
 /**
  * 自适应行高
@@ -2523,7 +2527,7 @@ const calcCellHeight = ($xeTable) => {
             const rowid = handleGetRowId(row);
             const rowRest = fullAllDataRowIdData[rowid];
             if (rowRest) {
-                const height = calcCellAutoHeight($xeTable, rowRest, el);
+                const height = calcCellAutoHeight($xeTable, rowid, rowRest, el);
                 rowRest.height = Math.max(defaultRowHeight, height);
             }
             el.removeAttribute('data-calc-row');
@@ -3014,7 +3018,6 @@ function calcScrollbar($xeTable) {
 function handleRecalculateStyle($xeTable, reFull, reWidth, reHeight) {
     const internalData = $xeTable;
     const el = $xeTable.$refs.refElem;
-    internalData.rceRunTime = Date.now();
     if (!el || !el.clientWidth) {
         return $xeTable.$nextTick();
     }
@@ -3038,6 +3041,7 @@ function handleRecalculateStyle($xeTable, reFull, reWidth, reHeight) {
     if (reFull) {
         updateTreeLineStyle($xeTable);
     }
+    internalData.rceRunTime = Date.now();
     return computeScrollLoad($xeTable).then(() => {
         // 初始化时需要在列计算之后再执行优化运算，达到最优显示效果
         if (reWidth) {
@@ -3058,11 +3062,13 @@ function handleRecalculateStyle($xeTable, reFull, reWidth, reHeight) {
         if (reFull) {
             updateTreeLineStyle($xeTable);
         }
+        internalData.rceRunTime = Date.now();
         if (reFull) {
             return computeScrollLoad($xeTable);
         }
     });
 }
+const minRunDelay = 50;
 function handleLazyRecalculate($xeTable, reFull, reWidth, reHeight) {
     const reactData = $xeTable;
     const internalData = $xeTable;
@@ -3071,7 +3077,17 @@ function handleLazyRecalculate($xeTable, reFull, reWidth, reHeight) {
         const { rceTimeout, rceRunTime } = internalData;
         const $xeGanttView = internalData.xeGanttView;
         const resizeOpts = $xeTable.computeResizeOpts;
-        const refreshDelay = resizeOpts.refreshDelay || 20;
+        let rceDelay = internalData.rceDelay;
+        // 如果在500毫秒内频繁执行，则执行次数减缓
+        if (rceRunTime && rceRunTime > Date.now() - 500) {
+            rceDelay += 50;
+        }
+        else {
+            rceDelay = 0;
+        }
+        internalData.rceDelay = rceDelay;
+        const refreshDelay = resizeOpts.refreshDelay || 30;
+        const reDelay = rceDelay + refreshDelay;
         const el = $xeTable.$refs.refElem;
         if (el && el.clientWidth) {
             autoCellWidth($xeTable);
@@ -3082,7 +3098,7 @@ function handleLazyRecalculate($xeTable, reFull, reWidth, reHeight) {
         }
         if (rceTimeout) {
             clearTimeout(rceTimeout);
-            if (rceRunTime && rceRunTime + (refreshDelay - 5) < Date.now()) {
+            if (rceRunTime && rceRunTime + minRunDelay < Date.now()) {
                 resolve(handleRecalculateStyle($xeTable, reFull, reWidth, reHeight));
             }
             else {
@@ -3100,7 +3116,7 @@ function handleLazyRecalculate($xeTable, reFull, reWidth, reHeight) {
         internalData.rceTimeout = setTimeout(() => {
             internalData.rceTimeout = undefined;
             handleRecalculateStyle($xeTable, reFull, reWidth, reHeight);
-        }, refreshDelay);
+        }, reDelay);
     });
 }
 function handleResizeEvent($xeTable) {
@@ -3437,6 +3453,7 @@ function loadTableData($xeTable, datas, isReload, isReset) {
     reactData.insertRowFlag++;
     internalData.removeRowMaps = {};
     reactData.removeRowFlag++;
+    internalData.fullCellHeightMaps = {};
     const sYLoad = updateScrollYStatus($xeTable, fullData);
     // 全量数据
     internalData.tableFullData = fullData;
@@ -3811,12 +3828,48 @@ function initColumnHierarchy($xeTable) {
     internalData.fullColumnIdData = fullColIdData;
     internalData.fullColumnFieldData = fullColFieldData;
 }
-function handleInitColumn($xeTable, collectColumn) {
+function buildColumnInfo($xeTable) {
     const props = $xeTable;
     const $xeToolbar = $xeTable.$refs.$xeToolbar;
     const reactData = $xeTable;
     const internalData = $xeTable;
+    const { scrollXLoad, scrollYLoad, expandColumn } = reactData;
     const expandOpts = $xeTable.computeExpandOpts;
+    cacheColumnMap($xeTable);
+    parseColumns($xeTable, true).then(() => {
+        if (reactData.scrollXLoad) {
+            loadScrollXData($xeTable);
+        }
+    });
+    $xeTable.clearHeaderFormatterCache();
+    $xeTable.clearMergeCells();
+    $xeTable.clearMergeFooterItems();
+    $xeTable.handleTableData(true);
+    $xeTable.handleAggregateSummaryData();
+    if ((scrollXLoad || scrollYLoad) && (expandColumn && expandOpts.mode !== 'fixed')) {
+        warnLog('vxe.error.scrollErrProp', ['column.type=expand']);
+    }
+    return $xeTable.$nextTick().then(() => {
+        if ($xeToolbar) {
+            $xeToolbar.syncUpdate({
+                collectColumn: internalData.collectColumn,
+                $table: $xeTable
+            });
+        }
+        if ($xeTable.handleUpdateCustomColumn) {
+            $xeTable.handleUpdateCustomColumn();
+        }
+        const columnOpts = $xeTable.computeColumnOpts;
+        if (props.showCustomHeader && reactData.isGroup && (columnOpts.resizable || props.resizable)) {
+            warnLog('vxe.error.notConflictProp', ['show-custom-header & colgroup', 'column-config.resizable=false']);
+        }
+        reactData.isColLoading = false;
+        return handleLazyRecalculate($xeTable, false, true, true);
+    });
+}
+function handleInitColumn($xeTable, collectColumn) {
+    const reactData = $xeTable;
+    const internalData = $xeTable;
     internalData.collectColumn = collectColumn;
     const tFullColumn = getColumnList(collectColumn);
     internalData.tableFullColumn = tFullColumn;
@@ -3824,38 +3877,7 @@ function handleInitColumn($xeTable, collectColumn) {
     reactData.isColLoading = true;
     initColumnHierarchy($xeTable);
     return Promise.resolve(restoreCustomStorage($xeTable)).then(() => {
-        const { scrollXLoad, scrollYLoad, expandColumn } = reactData;
-        cacheColumnMap($xeTable);
-        parseColumns($xeTable, true).then(() => {
-            if (reactData.scrollXLoad) {
-                loadScrollXData($xeTable);
-            }
-        });
-        $xeTable.clearHeaderFormatterCache();
-        $xeTable.clearMergeCells();
-        $xeTable.clearMergeFooterItems();
-        $xeTable.handleTableData(true);
-        $xeTable.handleAggregateSummaryData();
-        if ((scrollXLoad || scrollYLoad) && (expandColumn && expandOpts.mode !== 'fixed')) {
-            warnLog('vxe.error.scrollErrProp', ['column.type=expand']);
-        }
-        return $xeTable.$nextTick().then(() => {
-            if ($xeToolbar) {
-                $xeToolbar.syncUpdate({
-                    collectColumn: internalData.collectColumn,
-                    $table: $xeTable
-                });
-            }
-            if ($xeTable.handleUpdateCustomColumn) {
-                $xeTable.handleUpdateCustomColumn();
-            }
-            const columnOpts = $xeTable.computeColumnOpts;
-            if (props.showCustomHeader && reactData.isGroup && (columnOpts.resizable || props.resizable)) {
-                warnLog('vxe.error.notConflictProp', ['show-custom-header & colgroup', 'column-config.resizable=false']);
-            }
-            reactData.isColLoading = false;
-            return handleLazyRecalculate($xeTable, false, true, true);
-        });
+        return buildColumnInfo($xeTable);
     });
 }
 /**
@@ -6197,6 +6219,9 @@ const tableMethods = {
         warnLog('vxe.error.delFunc', ['resetColumn', 'resetCustom']);
         return this.resetCustom(options);
     },
+    /**
+     * @private
+     */
     handleCustom() {
         const $xeTable = this;
         const props = $xeTable;
@@ -6249,6 +6274,68 @@ const tableMethods = {
             }
         }
     },
+    /**
+     * 用于 custom-config，用于手动恢复自定义列设置信息，恢复表格重置为初始状态
+     * @param storeData
+     * @returns
+     */
+    setCustomStoreData(storeData) {
+        const $xeTable = this;
+        const reactData = $xeTable;
+        const internalData = $xeTable;
+        if (!storeData) {
+            return $xeTable.$nextTick();
+        }
+        const customOpts = $xeTable.computeCustomOpts;
+        const { checkMethod } = customOpts;
+        // 重置状态
+        clearTableAllStatus($xeTable);
+        // 恢复列
+        const allCols = [];
+        XEUtils.eachTree(internalData.collectColumn, (column) => {
+            column.resizeWidth = 0;
+            column.fixed = column.defaultFixed;
+            column.renderSortNumber = column.sortNumber;
+            column.parentId = column.defaultParentId;
+            if (!checkMethod || checkMethod({ $table: $xeTable, column })) {
+                column.visible = column.defaultVisible;
+            }
+            column.aggFunc = column.defaultAggFunc;
+            column.renderAggFn = column.defaultAggFunc;
+            column.renderResizeWidth = column.renderWidth;
+            allCols.push(column);
+        });
+        const newCollectCols = XEUtils.toArrayTree(XEUtils.orderBy(allCols, 'renderSortNumber'), { key: 'id', parentKey: 'parentId', children: 'children' });
+        internalData.collectColumn = newCollectCols;
+        internalData.tableFullColumn = getColumnList(newCollectCols);
+        reactData.updateColFlag++;
+        reactData.isColLoading = true;
+        initColumnHierarchy($xeTable);
+        return Promise.resolve(handleCustomRestore($xeTable, storeData)).then(() => {
+            return buildColumnInfo($xeTable);
+        }).then(() => {
+            // 恢复数据聚合分组
+            const { isRowGroupStatus, rowGroupList } = reactData;
+            if (isRowGroupStatus && !!$xeTable.handlePivotTableAggData) {
+                const rowGroupFields = $xeTable.computeRowGroupFields;
+                if (rowGroupFields ? rowGroupFields.length : rowGroupList.length) {
+                    if (rowGroupFields && rowGroupFields.length) {
+                        $xeTable.setRowGroups(rowGroupFields);
+                    }
+                    else {
+                        $xeTable.clearRowGroups();
+                    }
+                }
+                else {
+                    $xeTable.handleUpdateAggData();
+                }
+            }
+        });
+    },
+    /**
+     * 用于 custom-config，用于获取自定义列设置信息，用于自定义保持
+     * @returns
+     */
     getCustomStoreData() {
         const $xeTable = this;
         const props = $xeTable;
@@ -6372,6 +6459,9 @@ const tableMethods = {
         }
         return storeData;
     },
+    /**
+     * @private
+     */
     saveCustomStore(type) {
         const $xeTable = this;
         const props = $xeTable;
@@ -6716,6 +6806,9 @@ const tableMethods = {
             }
         }
     },
+    /**
+     * @private
+     */
     handleRowResizeMousedownEvent(evnt, params) {
         const $xeTable = this;
         const props = $xeTable;
@@ -6836,6 +6929,9 @@ const tableMethods = {
         };
         updateEvent(evnt);
     },
+    /**
+     * @private
+     */
     handleRowResizeDblclickEvent(evnt, params) {
         const $xeTable = this;
         const reactData = $xeTable;
@@ -6857,7 +6953,7 @@ const tableMethods = {
             }
             const handleRsHeight = () => {
                 el.setAttribute('data-calc-row', 'Y');
-                const resizeHeight = calcCellAutoHeight($xeTable, rowRest, el);
+                const resizeHeight = calcCellAutoHeight($xeTable, rowid, rowRest, el);
                 el.removeAttribute('data-calc-row');
                 const resizeParams = Object.assign(Object.assign({}, params), { resizeHeight, resizeRow: row });
                 reactData.isDragResize = false;
@@ -6943,7 +7039,7 @@ const tableMethods = {
                 const rowid = XEUtils.isString(row) || XEUtils.isNumber(row) ? row : handleGetRowId(row);
                 const rowRest = fullAllDataRowIdData[rowid];
                 if (rowRest) {
-                    rowRest.resizeHeight = calcCellAutoHeight($xeTable, rowRest, el);
+                    rowRest.resizeHeight = calcCellAutoHeight($xeTable, rowid, rowRest, el);
                 }
                 el.removeAttribute('data-calc-row');
             });

package/es/table/src/util.js

@@ -83,6 +83,7 @@ export function createInternalData() {
         sourceDataRowIdData: {},
         fullColumnIdData: {},
         fullColumnFieldData: {},
+        fullCellHeightMaps: {},
         // 当前行
         currentRow: null,
         // 合并表头单元格的数据
@@ -142,7 +143,8 @@ export function createInternalData() {
         inited: false,
         tooltipTimeout: null,
         initStatus: false,
-        isActivated: false
+        isActivated: false,
+        rceDelay: 0
         // _sToTime: null
     };
 }
@@ -390,6 +392,21 @@ export function createReactData() {
         isColLoading: false
     };
 }
+const maxKey = '__max';
+export function getRowMaxHeight(chRest, isForce) {
+    if (isForce || !chRest[maxKey]) {
+        let max = 0;
+        for (const key in chRest) {
+            const val = chRest[key];
+            if (key !== maxKey && XEUtils.isNumber(val) && val > max) {
+                max = val;
+            }
+        }
+        chRest[maxKey] = max;
+        return max;
+    }
+    return chRest[maxKey];
+}
 const getAllConvertColumns = (columns, parentColumn) => {
     const result = [];
     columns.forEach((column) => {

package/es/ui/index.js

@@ -1,6 +1,6 @@
 import { VxeUI } from '@vxe-ui/core';
 import { getFuncText } from './src/utils';
-export const version = "3.21.7";
+export const version = "3.21.8";
 VxeUI.version = version;
 VxeUI.tableVersion = version;
 VxeUI.setConfig({

package/es/ui/src/log.js

@@ -1,5 +1,5 @@
 import { VxeUI } from '@vxe-ui/core';
 const { log } = VxeUI;
-const version = `table v${"3.21.7"}`;
+const version = `table v${"3.21.8"}`;
 export const warnLog = log.create('warn', version);
 export const errLog = log.create('error', version);