vxe-table 4.12.5 → 4.13.0-beta.0

package/es/table/src/table.js

@@ -82,10 +82,6 @@ export default defineComponent({
             // 树节点列信息
             treeNodeColumn: null,
             hasFixedColumn: false,
-            // 合并单元格的对象集
-            mergeList: [],
-            // 合并表尾数据的对象集
-            mergeFooterList: [],
             // 刷新列标识，当列筛选被改变时，触发表格刷新数据
             upDataFlag: 0,
             // 刷新列标识，当列的特定属性被改变时，触发表格刷新列
@@ -238,6 +234,8 @@ export default defineComponent({
             pendingRowFlag: 1,
             insertRowFlag: 1,
             removeRowFlag: 1,
+            mergeBodyFlag: 1,
+            mergeFootFlag: 1,
             rowHeightStore: {
                 default: 48,
                 medium: 44,
@@ -330,13 +328,26 @@ export default defineComponent({
             tableFullColumn: [],
             // 渲染所有列
             visibleColumn: [],
-            // 总的缓存数据集
+            // 全量数据集（包括当前和已删除）
             fullAllDataRowIdData: {},
+            // 数据集（仅当前）
+            fullDataRowIdData: {},
+            // 数据集（仅可视）
+            visibleDataRowIdData: {},
             // 渲染中缓存数据
             sourceDataRowIdData: {},
-            fullDataRowIdData: {},
             fullColumnIdData: {},
             fullColumnFieldData: {},
+            // 合并单元格的数据
+            mergeBodyList: [],
+            mergeBodyMaps: {},
+            // 合并表尾的数据
+            mergeFooterList: [],
+            mergeFooterMaps: {},
+            // 已合并单元格数据集合
+            mergeBodyCellMaps: {},
+            // 已合并表尾数据集合
+            mergeFooterCellMaps: {},
             // 已展开的行集合
             rowExpandedMaps: {},
             // 懒加载中的展开行的集合
@@ -643,17 +654,18 @@ export default defineComponent({
             return Object.assign({}, getConfig().table.customConfig, props.customConfig);
         });
         const computeTableRowExpandedList = computed(() => {
-            const { rowExpandedFlag, tableData, expandColumn } = reactData;
-            const { rowExpandedMaps } = internalData;
-            const { handleGetRowId } = createHandleGetRowId($xeTable);
+            const { treeConfig } = props;
+            const { rowExpandedFlag, expandColumn } = reactData;
+            const { visibleDataRowIdData, rowExpandedMaps } = internalData;
+            const treeOpts = computeTreeOpts.value;
+            const { transform } = treeOpts;
             const expandList = [];
             if (expandColumn && rowExpandedFlag) {
-                const rowKeys = {};
-                tableData.forEach(row => {
-                    rowKeys[handleGetRowId(row)] = true;
-                });
+                if (treeConfig && !transform) {
+                    return XEUtils.values(rowExpandedMaps);
+                }
                 XEUtils.each(rowExpandedMaps, (row, rowid) => {
-                    if (rowKeys[rowid]) {
+                    if (visibleDataRowIdData[rowid]) {
                         expandList.push(row);
                     }
                 });
@@ -1024,30 +1036,66 @@ export default defineComponent({
                 }
             }
         };
-        const setMerges = (merges, mList, rowList) => {
+        function buildMergeData(mergeConfigs) {
+            const mergeMaps = {};
+            if (mergeConfigs && mergeConfigs.length) {
+                for (let mIndex = 0; mIndex < mergeConfigs.length; mIndex++) {
+                    const { row: _rowIndex, col: _columnIndex, rowspan: mergeRowspan, colspan: mergeColspan } = mergeConfigs[mIndex];
+                    for (let i = 0; i < mergeRowspan; i++) {
+                        for (let j = 0; j < mergeColspan; j++) {
+                            mergeMaps[`${_rowIndex + i}:${_columnIndex + j}`] = !i && !j
+                                ? {
+                                    rowspan: mergeRowspan,
+                                    colspan: mergeColspan
+                                }
+                                : {
+                                    rowspan: 0,
+                                    colspan: 0
+                                };
+                        }
+                    }
+                }
+            }
+            return mergeMaps;
+        }
+        const handleBodyMerge = (merges) => {
+            const { fullAllDataRowIdData, fullColumnIdData, visibleColumn, afterFullData, mergeBodyList, mergeBodyMaps } = internalData;
             if (merges) {
-                // const { treeConfig } = props
-                const { visibleColumn } = internalData;
+                const { handleGetRowId } = createHandleGetRowId($xeTable);
                 if (!XEUtils.isArray(merges)) {
                     merges = [merges];
                 }
-                // if (treeConfig && merges.length) {
-                //   errLog('vxe.error.noTree', ['merge-cells | merge-footer-items'])
-                // }
                 merges.forEach((item) => {
-                    let { row, col, rowspan, colspan } = item;
-                    if (rowList && XEUtils.isNumber(row)) {
-                        row = rowList[row];
+                    let { row: margeRow, col: margeCol, rowspan, colspan } = item;
+                    let mergeRowIndex = -1;
+                    let mergeColumnIndex = -1;
+                    if (XEUtils.isNumber(margeRow)) {
+                        mergeRowIndex = margeRow;
                     }
-                    if (XEUtils.isNumber(col)) {
-                        col = visibleColumn[col];
+                    else {
+                        const rowid = margeRow ? handleGetRowId(margeRow) : null;
+                        const rowRest = rowid ? fullAllDataRowIdData[rowid] : null;
+                        if (rowRest) {
+                            mergeRowIndex = rowRest._index;
+                        }
+                    }
+                    if (XEUtils.isNumber(margeCol)) {
+                        mergeColumnIndex = margeCol;
+                    }
+                    else {
+                        const colid = margeCol ? margeCol.id : null;
+                        const colRest = colid ? fullColumnIdData[colid] : null;
+                        if (colRest) {
+                            mergeColumnIndex = colRest._index;
+                        }
                     }
-                    if ((rowList ? row : XEUtils.isNumber(row)) && col && (rowspan || colspan)) {
+                    if (mergeRowIndex > -1 && mergeColumnIndex > -1 && (rowspan || colspan)) {
                         rowspan = XEUtils.toNumber(rowspan) || 1;
                         colspan = XEUtils.toNumber(colspan) || 1;
                         if (rowspan > 1 || colspan > 1) {
-                            const mcIndex = XEUtils.findIndexOf(mList, item => (item._row === row || getRowid($xeTable, item._row) === getRowid($xeTable, row)) && (item._col.id === col || item._col.id === col.id));
-                            const mergeItem = mList[mcIndex];
+                            const row = afterFullData[mergeRowIndex];
+                            const column = visibleColumn[mergeColumnIndex];
+                            let mergeItem = mergeBodyMaps[`${mergeRowIndex}:${mergeColumnIndex}`];
                             if (mergeItem) {
                                 mergeItem.rowspan = rowspan;
                                 mergeItem.colspan = colspan;
@@ -1055,18 +1103,65 @@ export default defineComponent({
                                 mergeItem._colspan = colspan;
                             }
                             else {
-                                const mergeRowIndex = rowList ? $xeTable.findRowIndexOf(rowList, row) : row;
-                                const mergeColIndex = tableMethods.getVTColumnIndex(col);
-                                mList.push({
+                                mergeItem = {
                                     row: mergeRowIndex,
-                                    col: mergeColIndex,
+                                    col: mergeColumnIndex,
                                     rowspan,
                                     colspan,
                                     _row: row,
-                                    _col: col,
+                                    _col: column,
                                     _rowspan: rowspan,
                                     _colspan: colspan
-                                });
+                                };
+                                mergeBodyMaps[`${mergeRowIndex}:${mergeColumnIndex}`] = mergeItem;
+                                mergeBodyList.push(mergeItem);
+                            }
+                        }
+                    }
+                });
+            }
+        };
+        const handleFooterMerge = (merges) => {
+            const { footerTableData } = reactData;
+            const { mergeFooterList, mergeFooterMaps } = internalData;
+            if (merges) {
+                const { visibleColumn } = internalData;
+                if (!XEUtils.isArray(merges)) {
+                    merges = [merges];
+                }
+                merges.forEach((item) => {
+                    let { row: margeRow, col: margeCol, rowspan, colspan } = item;
+                    const mergeRowIndex = XEUtils.isNumber(margeRow) ? margeRow : -1;
+                    let mergeColumnIndex = -1;
+                    if (XEUtils.isNumber(margeCol)) {
+                        mergeColumnIndex = margeCol;
+                    }
+                    if (mergeRowIndex > -1 && mergeColumnIndex > -1 && (rowspan || colspan)) {
+                        rowspan = XEUtils.toNumber(rowspan) || 1;
+                        colspan = XEUtils.toNumber(colspan) || 1;
+                        if (rowspan > 1 || colspan > 1) {
+                            const row = footerTableData[mergeRowIndex];
+                            const column = visibleColumn[mergeColumnIndex];
+                            let mergeItem = mergeFooterMaps[`${mergeRowIndex}:${mergeColumnIndex}`];
+                            if (mergeItem) {
+                                mergeItem.rowspan = rowspan;
+                                mergeItem.colspan = colspan;
+                                mergeItem._rowspan = rowspan;
+                                mergeItem._colspan = colspan;
+                            }
+                            else {
+                                mergeItem = {
+                                    row: mergeRowIndex,
+                                    col: mergeColumnIndex,
+                                    rowspan,
+                                    colspan,
+                                    _row: row,
+                                    _col: column,
+                                    _rowspan: rowspan,
+                                    _colspan: colspan
+                                };
+                                mergeFooterMaps[`${mergeRowIndex}:${mergeColumnIndex}`] = mergeItem;
+                                mergeFooterList.push(mergeItem);
                             }
                         }
                     }
@@ -2668,7 +2763,7 @@ export default defineComponent({
             internalData.tableFullData = fullData;
             internalData.tableFullTreeData = treeData;
             // 缓存数据
-            $xeTable.cacheRowMap(true);
+            $xeTable.cacheRowMap(isReset);
             // 原始数据
             internalData.tableSynchData = datas;
             if (isReset) {
@@ -2686,6 +2781,7 @@ export default defineComponent({
             $xeTable.clearMergeFooterItems();
             $xeTable.handleTableData(true);
             $xeTable.updateFooter();
+            $xeTable.handleUpdateBodyMerge();
             return nextTick().then(() => {
                 updateHeight();
                 updateStyle();
@@ -2798,8 +2894,8 @@ export default defineComponent({
             cacheColumnMap();
         };
         const loadScrollXData = () => {
-            const { mergeList, mergeFooterList, isScrollXBig } = reactData;
-            const { scrollXStore } = internalData;
+            const { isScrollXBig } = reactData;
+            const { mergeBodyList, mergeFooterList, scrollXStore } = internalData;
             const { preloadSize, startIndex, endIndex, offsetSize } = scrollXStore;
             const { toVisibleIndex, visibleSize } = handleVirtualXVisible();
             const offsetItem = {
@@ -2808,7 +2904,7 @@ export default defineComponent({
             };
             scrollXStore.visibleStartIndex = toVisibleIndex - 1;
             scrollXStore.visibleEndIndex = toVisibleIndex + visibleSize + 1;
-            calculateMergerOffsetIndex(mergeList.concat(mergeFooterList), offsetItem, 'col');
+            calculateMergerOffsetIndex(mergeBodyList.concat(mergeFooterList), offsetItem, 'col');
             const { startIndex: offsetStartIndex, endIndex: offsetEndIndex } = offsetItem;
             if (toVisibleIndex <= startIndex || toVisibleIndex >= endIndex - visibleSize - 1) {
                 if (startIndex !== offsetStartIndex || endIndex !== offsetEndIndex) {
@@ -3118,8 +3214,8 @@ export default defineComponent({
          * 纵向 Y 可视渲染处理
          */
         const loadScrollYData = () => {
-            const { mergeList, isAllOverflow, isScrollYBig } = reactData;
-            const { scrollYStore } = internalData;
+            const { isAllOverflow, isScrollYBig } = reactData;
+            const { mergeBodyList, scrollYStore } = internalData;
             const { preloadSize, startIndex, endIndex, offsetSize } = scrollYStore;
             const autoOffsetYSize = isAllOverflow ? offsetSize : offsetSize + 1;
             const { toVisibleIndex, visibleSize } = handleVirtualYVisible();
@@ -3129,7 +3225,7 @@ export default defineComponent({
             };
             scrollYStore.visibleStartIndex = toVisibleIndex - 1;
             scrollYStore.visibleEndIndex = toVisibleIndex + visibleSize + 1;
-            calculateMergerOffsetIndex(mergeList, offsetItem, 'row');
+            calculateMergerOffsetIndex(mergeBodyList, offsetItem, 'row');
             const { startIndex: offsetStartIndex, endIndex: offsetEndIndex } = offsetItem;
             if (toVisibleIndex <= startIndex || toVisibleIndex >= endIndex - visibleSize - 1) {
                 if (startIndex !== offsetStartIndex || endIndex !== offsetEndIndex) {
@@ -3424,7 +3520,7 @@ export default defineComponent({
              * 对于某些特殊的场景，比如深层树节点元素发生变动时可能会用到
              */
             syncData() {
-                warnLog('vxe.error.delFunc', ['syncData', 'getData']);
+                errLog('vxe.error.delFunc', ['syncData', 'getData']);
                 return nextTick().then(() => {
                     reactData.tableData = [];
                     emit('update:data', internalData.tableFullData);
@@ -5699,6 +5795,7 @@ export default defineComponent({
                     footData = visibleColumn.length ? footerMethod({ columns: visibleColumn, data: afterFullData, $table: $xeTable, $grid: $xeGrid }) : [];
                 }
                 reactData.footerTableData = footData;
+                $xeTable.handleUpdateFooterMerge();
                 return nextTick();
             },
             /**
@@ -5722,9 +5819,10 @@ export default defineComponent({
                 if (props.spanMethod) {
                     errLog('vxe.error.errConflicts', ['merge-cells', 'span-method']);
                 }
-                setMerges(merges, reactData.mergeList, internalData.afterFullData);
+                handleBodyMerge(merges);
+                $xeTable.handleUpdateBodyMerge();
                 return nextTick().then(() => {
-                    tableMethods.updateCellAreas();
+                    $xeTable.updateCellAreas();
                     return updateStyle();
                 });
             },
@@ -5736,9 +5834,9 @@ export default defineComponent({
                 if (props.spanMethod) {
                     errLog('vxe.error.errConflicts', ['merge-cells', 'span-method']);
                 }
-                const rest = removeMerges(merges, reactData.mergeList, internalData.afterFullData);
+                const rest = removeMerges(merges, internalData.mergeBodyList, internalData.afterFullData);
                 return nextTick().then(() => {
-                    tableMethods.updateCellAreas();
+                    $xeTable.updateCellAreas();
                     updateStyle();
                     return rest;
                 });
@@ -5747,13 +5845,15 @@ export default defineComponent({
              * 获取所有被合并的单元格
              */
             getMergeCells() {
-                return reactData.mergeList.slice(0);
+                return internalData.mergeBodyList.slice(0);
             },
             /**
              * 清除所有单元格合并
              */
             clearMergeCells() {
-                reactData.mergeList = [];
+                internalData.mergeBodyList = [];
+                internalData.mergeBodyMaps = {};
+                internalData.mergeBodyCellMaps = {};
                 return nextTick().then(() => {
                     return updateStyle();
                 });
@@ -5762,7 +5862,8 @@ export default defineComponent({
                 if (props.footerSpanMethod) {
                     errLog('vxe.error.errConflicts', ['merge-footer-items', 'footer-span-method']);
                 }
-                setMerges(merges, reactData.mergeFooterList);
+                handleFooterMerge(merges);
+                $xeTable.handleUpdateFooterMerge();
                 return nextTick().then(() => {
                     tableMethods.updateCellAreas();
                     return updateStyle();
@@ -5772,7 +5873,7 @@ export default defineComponent({
                 if (props.footerSpanMethod) {
                     errLog('vxe.error.errConflicts', ['merge-footer-items', 'footer-span-method']);
                 }
-                const rest = removeMerges(merges, reactData.mergeFooterList);
+                const rest = removeMerges(merges, internalData.mergeFooterList);
                 return nextTick().then(() => {
                     tableMethods.updateCellAreas();
                     updateStyle();
@@ -5783,13 +5884,15 @@ export default defineComponent({
              * 获取所有被合并的表尾
              */
             getMergeFooterItems() {
-                return reactData.mergeFooterList.slice(0);
+                return internalData.mergeFooterList.slice(0);
             },
             /**
              * 清除所有表尾合并
              */
             clearMergeFooterItems() {
-                reactData.mergeFooterList = [];
+                internalData.mergeFooterList = [];
+                internalData.mergeFooterMaps = {};
+                internalData.mergeFooterCellMaps = {};
                 return nextTick().then(() => {
                     return updateStyle();
                 });
@@ -6826,27 +6929,30 @@ export default defineComponent({
                     fullList = handleVirtualTreeToList();
                 }
                 const tableData = scrollYLoad ? fullList.slice(scrollYStore.startIndex, scrollYStore.endIndex) : fullList.slice(0);
+                const visibleDataRowIdMaps = {};
                 tableData.forEach((row, $index) => {
                     const rowid = getRowid($xeTable, row);
                     const rest = fullDataRowIdData[rowid];
                     if (rest) {
                         rest.$index = $index;
                     }
+                    visibleDataRowIdMaps[rowid] = row;
                 });
                 reactData.tableData = tableData;
+                internalData.visibleDataRowIdData = visibleDataRowIdMaps;
                 return nextTick();
             },
             /**
              * 更新数据行的 Map
              */
-            cacheRowMap() {
+            cacheRowMap(isReset) {
                 const { treeConfig } = props;
                 const { fullAllDataRowIdData, tableFullData, tableFullTreeData, treeExpandedMaps } = internalData;
                 const treeOpts = computeTreeOpts.value;
                 const childrenField = treeOpts.children || treeOpts.childrenField;
                 const hasChildField = treeOpts.hasChild || treeOpts.hasChildField;
                 const { lazy } = treeOpts;
-                const fullAllDataRowIdMaps = Object.assign({}, fullAllDataRowIdData); // 存在已删除数据
+                const fullAllDataRowIdMaps = isReset ? {} : Object.assign({}, fullAllDataRowIdData); // 存在已删除数据
                 const fullDataRowIdMaps = {};
                 const { handleUpdateRowId } = createHandleUpdateRowId($xeTable);
                 const handleRowCache = (row, index, items, currIndex, parentRow, rowid, level, seq) => {
@@ -7627,6 +7733,19 @@ export default defineComponent({
             handleSelectRow({ row }, checked, isForce) {
                 $xeTable.handleBatchSelectRows([row], checked, isForce);
             },
+            /**
+             * 处理合并
+             */
+            handleUpdateBodyMerge() {
+                const { mergeBodyList } = internalData;
+                internalData.mergeBodyCellMaps = buildMergeData(mergeBodyList);
+                reactData.mergeBodyFlag++;
+            },
+            handleUpdateFooterMerge() {
+                const { mergeFooterList } = internalData;
+                internalData.mergeFooterCellMaps = buildMergeData(mergeFooterList);
+                reactData.mergeFootFlag++;
+            },
             triggerHeaderTitleEvent(evnt, iconParams, params) {
                 const tipContent = iconParams.content || iconParams.message;
                 if (tipContent) {
@@ -9671,21 +9790,23 @@ export default defineComponent({
                     const { transform, seqMode } = treeOpts;
                     const cellStyle = {};
                     const rowid = handleGetRowId(row);
-                    const rest = fullAllDataRowIdData[rowid];
+                    const rowRest = fullAllDataRowIdData[rowid];
                     let rowLevel = 0;
                     let seq = -1;
-                    let _rowIndex = 0;
-                    const rowIndex = $xeTable.getRowIndex(row);
-                    const $rowIndex = $xeTable.getVMRowIndex(row);
-                    if (rest) {
-                        rowLevel = rest.level;
+                    let _rowIndex = -1;
+                    let rowIndex = -1;
+                    let $rowIndex = -1;
+                    if (rowRest) {
+                        rowLevel = rowRest.level;
                         if (treeConfig && transform && seqMode === 'increasing') {
-                            seq = rest._index + 1;
+                            seq = rowRest._index + 1;
                         }
                         else {
-                            seq = rest.seq;
+                            seq = rowRest.seq;
                         }
-                        _rowIndex = rest._index;
+                        rowIndex = rowRest.index;
+                        $rowIndex = rowRest.$index;
+                        _rowIndex = rowRest._index;
                     }
                     if (expandHeight) {
                         cellStyle.height = `${expandHeight}px`;
@@ -10278,6 +10399,8 @@ export default defineComponent({
             if (columnOpts.drag || rowOpts.drag || customOpts.allowSort) {
                 initTpImg();
             }
+            ;
+            window.aa = $xeTable;
             nextTick(() => {
                 const { data, exportConfig, importConfig, treeConfig, showOverflow, highlightCurrentRow, highlightCurrentColumn } = props;
                 const { scrollXStore, scrollYStore } = internalData;

package/es/table/src/util.js

@@ -407,19 +407,6 @@ export function calcTreeLine(params, prevRow) {
     }
     return cellHeight * expandSize - (prevRow ? 1 : (12 - getOffsetSize($table)));
 }
-export function mergeBodyMethod(mergeList, _rowIndex, _columnIndex) {
-    for (let mIndex = 0; mIndex < mergeList.length; mIndex++) {
-        const { row: mergeRowIndex, col: mergeColIndex, rowspan: mergeRowspan, colspan: mergeColspan } = mergeList[mIndex];
-        if (mergeColIndex > -1 && mergeRowIndex > -1 && mergeRowspan && mergeColspan) {
-            if (mergeRowIndex === _rowIndex && mergeColIndex === _columnIndex) {
-                return { rowspan: mergeRowspan, colspan: mergeColspan };
-            }
-            if (_rowIndex >= mergeRowIndex && _rowIndex < mergeRowIndex + mergeRowspan && _columnIndex >= mergeColIndex && _columnIndex < mergeColIndex + mergeColspan) {
-                return { rowspan: 0, colspan: 0 };
-            }
-        }
-    }
-}
 export function clearTableDefaultStatus($xeTable) {
     const { props, internalData } = $xeTable;
     internalData.initStatus = false;

package/es/ui/index.js

@@ -1,6 +1,6 @@
 import { VxeUI } from '@vxe-ui/core';
 import { getFuncText } from './src/utils';
-export const version = "4.12.5";
+export const version = "4.13.0-beta.0";
 VxeUI.version = version;
 VxeUI.tableVersion = version;
 VxeUI.setConfig({
@@ -191,7 +191,7 @@ VxeUI.setConfig({
         },
         virtualXConfig: {
             enabled: true,
-            gt: 60,
+            gt: 28,
             preSize: 1,
             oSize: 0
         },

package/es/ui/src/log.js

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

package/lib/grid/src/grid.js

@@ -9,8 +9,8 @@ var _xeUtils = _interopRequireDefault(require("xe-utils"));
 var _utils = require("../../ui/src/utils");
 var _dom = require("../../ui/src/dom");
 var _ui = require("../../ui");
-var _table = _interopRequireDefault(require("../../table"));
-var _toolbar = _interopRequireDefault(require("../../toolbar"));
+var _table = _interopRequireDefault(require("../../table/src/table"));
+var _toolbar = _interopRequireDefault(require("../../toolbar/src/toolbar"));
 var _props = _interopRequireDefault(require("../../table/src/props"));
 var _emits = _interopRequireDefault(require("../../table/src/emits"));
 var _vn = require("../../ui/src/vn");