vxe-table 4.12.5 → 4.13.0-beta.0

package/es/table/module/edit/hook.js

@@ -97,8 +97,7 @@ hooks.add('tableEditModule', {
         };
         const handleInsertRowAt = (records, targetRow, isInsertNextRow) => {
             const { treeConfig } = props;
-            const { mergeList } = reactData;
-            const { tableFullTreeData, afterFullData, tableFullData, fullDataRowIdData, fullAllDataRowIdData, insertRowMaps } = internalData;
+            const { tableFullTreeData, afterFullData, mergeBodyList, tableFullData, fullDataRowIdData, fullAllDataRowIdData, insertRowMaps } = internalData;
             const treeOpts = computeTreeOpts.value;
             const { transform, rowField, mapChildrenField } = treeOpts;
             const childrenField = treeOpts.children || treeOpts.childrenField;
@@ -121,7 +120,7 @@ hooks.add('tableEditModule', {
                         tableFullData.unshift(item);
                     });
                     // 刷新单元格合并
-                    mergeList.forEach((mergeItem) => {
+                    mergeBodyList.forEach((mergeItem) => {
                         const { row: mergeRowIndex } = mergeItem;
                         if (mergeRowIndex > 0) {
                             mergeItem.row = mergeRowIndex + newRecords.length;
@@ -145,7 +144,7 @@ hooks.add('tableEditModule', {
                             tableFullData.push(item);
                         });
                         // 刷新单元格合并
-                        mergeList.forEach((mergeItem) => {
+                        mergeBodyList.forEach((mergeItem) => {
                             const { row: mergeRowIndex, rowspan: mergeRowspan } = mergeItem;
                             if (mergeRowIndex + mergeRowspan > afterFullData.length) {
                                 mergeItem.rowspan = mergeRowspan + newRecords.length;
@@ -233,7 +232,7 @@ hooks.add('tableEditModule', {
                             tableFullData.push(...newRecords);
                         }
                         // 刷新单元格合并
-                        mergeList.forEach((mergeItem) => {
+                        mergeBodyList.forEach((mergeItem) => {
                             const { row: mergeRowIndex, rowspan: mergeRowspan } = mergeItem;
                             if (mergeRowIndex > afIndex) {
                                 mergeItem.row = mergeRowIndex + newRecords.length;
@@ -257,6 +256,7 @@ hooks.add('tableEditModule', {
                 $xeTable.updateAfterDataIndex();
             }
             $xeTable.updateFooter();
+            $xeTable.handleUpdateBodyMerge();
             $xeTable.checkSelectionStatus();
             if (reactData.scrollYLoad) {
                 $xeTable.updateScrollYSpace();
@@ -487,8 +487,8 @@ hooks.add('tableEditModule', {
              */
             remove(rows) {
                 const { treeConfig } = props;
-                const { mergeList, editStore } = reactData;
-                const { tableFullTreeData, selectCheckboxMaps, afterFullData, tableFullData, pendingRowMaps, insertRowMaps, removeRowMaps } = internalData;
+                const { editStore } = reactData;
+                const { tableFullTreeData, selectCheckboxMaps, afterFullData, mergeBodyList, tableFullData, pendingRowMaps, insertRowMaps, removeRowMaps } = internalData;
                 const checkboxOpts = computeCheckboxOpts.value;
                 const treeOpts = computeTreeOpts.value;
                 const { transform, mapChildrenField } = treeOpts;
@@ -556,7 +556,7 @@ hooks.add('tableEditModule', {
                             const afIndex = $xeTable.findRowIndexOf(afterFullData, row);
                             if (afIndex > -1) {
                                 // 刷新单元格合并
-                                mergeList.forEach((mergeItem) => {
+                                mergeBodyList.forEach((mergeItem) => {
                                     const { row: mergeRowIndex, rowspan: mergeRowspan } = mergeItem;
                                     if (mergeRowIndex > afIndex) {
                                         mergeItem.row = mergeRowIndex - 1;
@@ -587,9 +587,10 @@ hooks.add('tableEditModule', {
                 reactData.removeRowFlag++;
                 reactData.insertRowFlag++;
                 reactData.pendingRowFlag++;
-                $xeTable.updateFooter();
                 $xeTable.cacheRowMap(false);
                 $xeTable.handleTableData(treeConfig && transform);
+                $xeTable.updateFooter();
+                $xeTable.handleUpdateBodyMerge();
                 if (!(treeConfig && transform)) {
                     $xeTable.updateAfterDataIndex();
                 }

package/es/table/module/export/hook.js

@@ -1,7 +1,7 @@
 import { inject, nextTick } from 'vue';
 import XEUtils from 'xe-utils';
 import { VxeUI } from '../../../ui';
-import { isColumnInfo, mergeBodyMethod, getCellValue } from '../../src/util';
+import { isColumnInfo, getCellValue } from '../../src/util';
 import { parseFile, formatText, eqEmptyValue } from '../../../ui/src/utils';
 import { hasClass } from '../../../ui/src/dom';
 import { createHtmlPage, getExportBlobByContent } from './util';
@@ -512,7 +512,8 @@ hooks.add('tableExportModule', {
         };
         const toHtml = (opts, columns, datas) => {
             const { id, border, treeConfig, headerAlign: allHeaderAlign, align: allAlign, footerAlign: allFooterAlign, showOverflow: allColumnOverflow, showHeaderOverflow: allColumnHeaderOverflow } = props;
-            const { isAllSelected, isIndeterminate, mergeList } = reactData;
+            const { isAllSelected, isIndeterminate } = reactData;
+            const { mergeBodyCellMaps } = internalData;
             const treeOpts = computeTreeOpts.value;
             const { print: isPrint, isHeader, isFooter, isColgroup, isMerge, colgroups, original } = opts;
             const allCls = 'check-all';
@@ -574,9 +575,10 @@ hooks.add('tableExportModule', {
                 if (treeConfig) {
                     datas.forEach((item) => {
                         tables.push('<tr>' + columns.map((column) => {
+                            const colid = column.id;
                             const cellAlign = column.align || allAlign;
                             const classNames = hasEllipsis(column, 'showOverflow', allColumnOverflow) ? ['col--ellipsis'] : [];
-                            const cellValue = item[column.id];
+                            const cellValue = item[colid];
                             if (cellAlign) {
                                 classNames.push(`col--${cellAlign}`);
                             }
@@ -612,10 +614,10 @@ hooks.add('tableExportModule', {
                             const cellValue = item[column.id];
                             let rowSpan = 1;
                             let colSpan = 1;
-                            if (isMerge && mergeList.length) {
+                            if (isMerge) {
                                 const _rowIndex = $xeTable.getVTRowIndex(item._row);
                                 const _columnIndex = $xeTable.getVTColumnIndex(column);
-                                const spanRest = mergeBodyMethod(mergeList, _rowIndex, _columnIndex);
+                                const spanRest = mergeBodyCellMaps[`${_rowIndex}:${_columnIndex}`];
                                 if (spanRest) {
                                     const { rowspan, colspan } = spanRest;
                                     if (!rowspan || !colspan) {
@@ -952,15 +954,15 @@ hooks.add('tableExportModule', {
         };
         const handleExportAndPrint = (options, isPrint) => {
             const { treeConfig, showHeader, showFooter } = props;
-            const { initStore, mergeList, mergeFooterList, isGroup, footerTableData, exportStore, exportParams } = reactData;
-            const { collectColumn } = internalData;
+            const { initStore, isGroup, footerTableData, exportStore, exportParams } = reactData;
+            const { collectColumn, mergeBodyList, mergeFooterList } = internalData;
             const exportOpts = computeExportOpts.value;
             const hasTree = treeConfig;
             const customOpts = computeCustomOpts.value;
             const selectRecords = $xeTable.getCheckboxRecords();
             const proxyOpts = $xeGrid ? $xeGrid.getComputeMaps().computeProxyOpts.value : {};
             const hasFooter = !!footerTableData.length;
-            const hasMerge = !!(mergeList.length || mergeFooterList.length);
+            const hasMerge = !!(mergeBodyList.length || mergeFooterList.length);
             const defOpts = Object.assign({
                 message: true,
                 isHeader: showHeader,
@@ -1078,12 +1080,12 @@ hooks.add('tableExportModule', {
              */
             exportData(options) {
                 const { treeConfig, showHeader, showFooter } = props;
-                const { mergeList, mergeFooterList, isGroup } = reactData;
-                const { tableFullColumn, afterFullData, collectColumn } = internalData;
+                const { isGroup } = reactData;
+                const { tableFullColumn, afterFullData, collectColumn, mergeBodyList, mergeFooterList } = internalData;
                 const exportOpts = computeExportOpts.value;
                 const treeOpts = computeTreeOpts.value;
                 const proxyOpts = $xeGrid ? $xeGrid.getComputeMaps().computeProxyOpts.value : {};
-                const hasMerge = !!(mergeList.length || mergeFooterList.length);
+                const hasMerge = !!(mergeBodyList.length || mergeFooterList.length);
                 const opts = Object.assign({
                     message: true,
                     isHeader: showHeader,

package/es/table/src/body.js

@@ -1,7 +1,7 @@
 import { defineComponent, TransitionGroup, h, ref, inject, nextTick, onMounted, onUnmounted } from 'vue';
 import XEUtils from 'xe-utils';
 import { VxeUI } from '../../ui';
-import { getOffsetSize, calcTreeLine, mergeBodyMethod, getRowid, createHandleGetRowId } from './util';
+import { getOffsetSize, calcTreeLine, getRowid, createHandleGetRowId } from './util';
 import { updateCellTitle, getPropClass } from '../../ui/src/dom';
 import { isEnableConf } from '../../ui/src/utils';
 import { getSlotVNs } from '../../ui/src/vn';
@@ -46,14 +46,13 @@ export default defineComponent({
             if (slots && slots.line) {
                 return $xeTable.callSlot(slots.line, params);
             }
-            const rest = fullAllDataRowIdData[rowid];
+            const rowRest = fullAllDataRowIdData[rowid];
             let rLevel = 0;
             let prevRow = null;
-            if (rest) {
-                rLevel = rest.level;
-                prevRow = rest.items[rest.treeIndex - 1];
+            if (rowRest) {
+                rLevel = rowRest.level;
+                prevRow = rowRest.items[rowRest.treeIndex - 1];
             }
-            const isFirstRow = $xeTable.eqRow(afterFullData[0], row);
             if (treeConfig && treeNode && (treeOpts.showLine || treeOpts.line)) {
                 return [
                     h('div', {
@@ -63,7 +62,7 @@ export default defineComponent({
                         h('div', {
                             class: 'vxe-tree--line',
                             style: {
-                                height: `${isFirstRow ? 1 : calcTreeLine(params, prevRow)}px`,
+                                height: `${$xeTable.eqRow(afterFullData[0], row) ? 1 : calcTreeLine(params, prevRow)}px`,
                                 bottom: `-${Math.floor(cellHeight / 2)}px`,
                                 left: `${(rLevel * treeOpts.indent) + (rLevel ? 2 - getOffsetSize($xeTable) : 0) + 16}px`
                             }
@@ -78,10 +77,9 @@ export default defineComponent({
          */
         const renderTdColumn = (seq, rowid, fixedType, isOptimizeMode, rowLevel, row, rowIndex, $rowIndex, _rowIndex, column, $columnIndex, columns, items) => {
             const $xeGrid = $xeTable.xeGrid;
-            const { fullAllDataRowIdData, fullColumnIdData, visibleColumn } = tableInternalData;
             const { columnKey, resizable: allResizable, showOverflow: allShowOverflow, border, height, cellClassName: allCellClassName, cellStyle, align: allAlign, spanMethod, mouseConfig, editConfig, editRules, tooltipConfig, padding: allPadding } = tableProps;
-            const { tableData, dragRow, overflowX, currentColumn, scrollXLoad, scrollYLoad, calcCellHeightFlag, resizeHeightFlag, resizeWidthFlag, mergeList, editStore, isAllOverflow, validErrorMaps } = tableReactData;
-            const { afterFullData, scrollXStore, scrollYStore } = tableInternalData;
+            const { tableData, dragRow, overflowX, currentColumn, scrollXLoad, scrollYLoad, mergeBodyFlag, calcCellHeightFlag, resizeHeightFlag, resizeWidthFlag, editStore, isAllOverflow, validErrorMaps } = tableReactData;
+            const { fullAllDataRowIdData, fullColumnIdData, mergeBodyCellMaps, visibleColumn, afterFullData, mergeBodyList, scrollXStore, scrollYStore } = tableInternalData;
             const cellOpts = computeCellOpts.value;
             const validOpts = computeValidOpts.value;
             const checkboxOpts = computeCheckboxOpts.value;
@@ -209,8 +207,8 @@ export default defineComponent({
             };
             let isMergeCell = false;
             // 合并行或列
-            if (mergeList.length) {
-                const spanRest = mergeBodyMethod(mergeList, _rowIndex, _columnIndex);
+            if (mergeBodyFlag && mergeBodyList.length) {
+                const spanRest = mergeBodyCellMaps[`${_rowIndex}:${_columnIndex}`];
                 if (spanRest) {
                     const { rowspan, colspan } = spanRest;
                     if (!rowspan || !colspan) {
@@ -240,7 +238,7 @@ export default defineComponent({
                 }
             }
             // 如果被合并不可隐藏
-            if (fixedHiddenColumn && mergeList) {
+            if (fixedHiddenColumn && isMergeCell) {
                 if (tdAttrs.colspan > 1 || tdAttrs.rowspan > 1) {
                     fixedHiddenColumn = false;
                 }

package/es/table/src/footer.js

@@ -5,19 +5,6 @@ import { updateCellTitle, getPropClass } from '../../ui/src/dom';
 import { getCellHeight } from './util';
 const { renderer, renderEmptyElement } = VxeUI;
 const renderType = 'footer';
-function mergeFooterMethod(mergeFooterList, _rowIndex, _columnIndex) {
-    for (let mIndex = 0; mIndex < mergeFooterList.length; mIndex++) {
-        const { row: mergeRowIndex, col: mergeColIndex, rowspan: mergeRowspan, colspan: mergeColspan } = mergeFooterList[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 default defineComponent({
     name: 'VxeTableFooter',
     props: {
@@ -52,8 +39,8 @@ export default defineComponent({
             const $xeGrid = $xeTable.xeGrid;
             const { fixedType } = props;
             const { resizable: allResizable, border, footerCellClassName, footerCellStyle, footerAlign: allFooterAlign, footerSpanMethod, align: allAlign, columnKey, showFooterOverflow: allColumnFooterOverflow } = tableProps;
-            const { scrollXLoad, scrollYLoad, overflowX, currentColumn, mergeFooterList } = tableReactData;
-            const { fullColumnIdData, scrollXStore } = tableInternalData;
+            const { scrollXLoad, scrollYLoad, overflowX, currentColumn } = tableReactData;
+            const { fullColumnIdData, mergeFooterList, mergeFooterCellMaps, scrollXStore } = tableInternalData;
             const tooltipOpts = computeTooltipOpts.value;
             const resizableOpts = computeResizableOpts.value;
             const { isAllColumnDrag } = resizableOpts;
@@ -131,7 +118,7 @@ export default defineComponent({
                 let isMergeCell = false;
                 // 合并行或列
                 if (mergeFooterList.length) {
-                    const spanRest = mergeFooterMethod(mergeFooterList, _rowIndex, _columnIndex);
+                    const spanRest = mergeFooterCellMaps[`${_rowIndex}:${_columnIndex}`];
                     if (spanRest) {
                         const { rowspan, colspan } = spanRest;
                         if (!rowspan || !colspan) {