vxe-table 3.21.3 → 3.21.5

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

@@ -48,9 +48,11 @@ const toStringValue = (cellValue) => {
 function getBodyLabelData($xeTable, opts, columns, datas) {
     const props = $xeTable;
     const reactData = $xeTable;
-    const { isTreeAllExpanded, isRowGroupAllExpanded, mode } = opts;
+    const internalData = $xeTable;
+    const { isTreeAllExpanded, isRowGroupAllExpanded, mode: expMode } = opts;
     const { treeConfig } = props;
     const { isRowGroupStatus } = reactData;
+    const { fullColumnFieldData } = internalData;
     const radioOpts = $xeTable.computeRadioOpts;
     const checkboxOpts = $xeTable.computeCheckboxOpts;
     const treeOpts = $xeTable.computeTreeOpts;
@@ -62,8 +64,7 @@ function getBodyLabelData($xeTable, opts, columns, datas) {
     const { handleGetRowId } = createHandleGetRowId($xeTable);
     if (isRowGroupStatus) {
         // 如果是数据分组
-        // 如果是数据分组
-        const { mapChildrenField } = aggregateOpts;
+        const { mode: aggMode, showTotal, totalMethod, countFields, contentMethod, formatValuesMethod, mapChildrenField } = aggregateOpts;
         const rest = [];
         const expandMaps = {};
         const useMaps = {};
@@ -84,8 +85,9 @@ function getBodyLabelData($xeTable, opts, columns, datas) {
                     _expand: hasRowChild && $xeTable.isRowExpandByRow(row)
                 };
                 columns.forEach((column, $columnIndex) => {
+                    const { field, editRender, cellRender, aggFunc, rowGroupNode } = column;
                     let cellValue = '';
-                    const renderOpts = column.editRender || column.cellRender;
+                    const renderOpts = editRender || cellRender;
                     let bodyExportMethod = column.exportMethod || columnOpts.exportMethod;
                     if (!bodyExportMethod && renderOpts && renderOpts.name) {
                         const compConf = renderer.get(renderOpts.name);
@@ -103,21 +105,77 @@ function getBodyLabelData($xeTable, opts, columns, datas) {
                         switch (column.type) {
                             case 'seq': {
                                 const seqVal = path.map((num, i) => i % 2 === 0 ? (Number(num) + 1) : '.').join('');
-                                cellValue = mode === 'all' ? seqVal : getSeq($xeTable, seqVal, row, $rowIndex, column, $columnIndex);
+                                cellValue = expMode === 'all' ? seqVal : getSeq($xeTable, seqVal, row, $rowIndex, column, $columnIndex);
                                 break;
                             }
-                            case 'checkbox':
+                            case 'checkbox': {
                                 cellValue = toBooleanValue($xeTable.isCheckedByCheckboxRow(row));
                                 item._checkboxLabel = checkboxOpts.labelField ? XEUtils.get(row, checkboxOpts.labelField) : '';
                                 item._checkboxDisabled = checkboxOpts.checkMethod && !checkboxOpts.checkMethod({ $table: $xeTable, row });
                                 break;
-                            case 'radio':
+                            }
+                            case 'radio': {
                                 cellValue = toBooleanValue($xeTable.isCheckedByRadioRow(row));
                                 item._radioLabel = radioOpts.labelField ? XEUtils.get(row, radioOpts.labelField) : '';
                                 item._radioDisabled = radioOpts.checkMethod && !radioOpts.checkMethod({ $table: $xeTable, row });
                                 break;
-                            default:
-                                if (opts.original) {
+                            }
+                            default: {
+                                if (field && row.isAggregate) {
+                                    const aggRow = row;
+                                    const aggData = aggRow.aggData;
+                                    const currAggData = aggData ? aggData[field] : null;
+                                    const groupField = aggRow.groupField;
+                                    const groupContent = aggRow.groupContent;
+                                    const childList = mapChildrenField ? (aggRow[mapChildrenField] || []) : [];
+                                    const childCount = aggRow.childCount;
+                                    const colRest = fullColumnFieldData[groupField] || {};
+                                    const ctParams = {
+                                        $table: $xeTable,
+                                        groupField,
+                                        groupColumn: (colRest ? colRest.column : null),
+                                        column,
+                                        groupValue: groupContent,
+                                        childList,
+                                        childCount,
+                                        aggValue: null,
+                                        /**
+                                         * 已废弃
+                                         * @deprecated
+                                         */
+                                        children: childList,
+                                        /**
+                                         * 已废弃
+                                         * @deprecated
+                                         */
+                                        totalValue: childCount
+                                    };
+                                    if (aggMode === 'column' ? field === aggRow.groupField : rowGroupNode) {
+                                        cellValue = groupContent;
+                                        if (contentMethod) {
+                                            cellValue = `${contentMethod(ctParams)}`;
+                                        }
+                                        if (showTotal) {
+                                            cellValue = getI18n('vxe.table.rowGroupContentTotal', [cellValue, totalMethod ? totalMethod(ctParams) : childCount, childCount]);
+                                        }
+                                    }
+                                    else if ($xeTable.getPivotTableAggregateCellAggValue) {
+                                        const aggParams = {
+                                            $table: $xeTable,
+                                            row,
+                                            column
+                                        };
+                                        cellValue = $xeTable.getPivotTableAggregateCellAggValue(aggParams);
+                                    }
+                                    else if (aggFunc === true || (countFields && countFields.includes(field))) {
+                                        cellValue = currAggData ? currAggData.value : childCount;
+                                        ctParams.aggValue = cellValue;
+                                        if (formatValuesMethod) {
+                                            cellValue = formatValuesMethod(ctParams);
+                                        }
+                                    }
+                                }
+                                else if (opts.original) {
                                     cellValue = getCellValue(row, column);
                                 }
                                 else {
@@ -133,6 +191,8 @@ function getBodyLabelData($xeTable, opts, columns, datas) {
                                         }
                                     }
                                 }
+                                break;
+                            }
                         }
                     }
                     item[column.id] = toStringValue(cellValue);
@@ -188,7 +248,7 @@ function getBodyLabelData($xeTable, opts, columns, datas) {
                         switch (column.type) {
                             case 'seq': {
                                 const seqVal = path.map((num, i) => i % 2 === 0 ? (Number(num) + 1) : '.').join('');
-                                cellValue = mode === 'all' ? seqVal : getSeq($xeTable, seqVal, row, $rowIndex, column, $columnIndex);
+                                cellValue = expMode === 'all' ? seqVal : getSeq($xeTable, seqVal, row, $rowIndex, column, $columnIndex);
                                 break;
                             }
                             case 'checkbox':
@@ -252,7 +312,7 @@ function getBodyLabelData($xeTable, opts, columns, datas) {
                 switch (column.type) {
                     case 'seq': {
                         const seqValue = $rowIndex + 1;
-                        cellValue = mode === 'all' ? seqValue : getSeq($xeTable, seqValue, row, $rowIndex, column, $columnIndex);
+                        cellValue = expMode === 'all' ? seqValue : getSeq($xeTable, seqValue, row, $rowIndex, column, $columnIndex);
                         break;
                     }
                     case 'checkbox':
@@ -305,7 +365,7 @@ function getBooleanValue(cellValue) {
 function getHeaderTitle($xeTable, opts, column) {
     const columnOpts = $xeTable.computeColumnOpts;
     const headExportMethod = column.headerExportMethod || columnOpts.headerExportMethod;
-    return headExportMethod ? headExportMethod({ column, options: opts, $table: $xeTable }) : ((opts.isTitle ? column.getTitle() : column.field) || '');
+    return headExportMethod ? headExportMethod({ column, options: opts, $table: $xeTable }) : ((opts.isTitle ? $xeTable.getHeaderCellLabel(column) : column.field) || '');
 }
 function getFooterCellValue($xeTable, opts, row, column) {
     const columnOpts = $xeTable.computeColumnOpts;
@@ -823,12 +883,12 @@ function handleImport($xeTable, content, opts) {
     const tableTitleMaps = {};
     tableFullColumn.forEach((column) => {
         const field = column.field;
-        const title = column.getTitle();
+        const title = $xeTable.getHeaderCellLabel(column);
         if (field) {
             tableFieldMaps[field] = column;
         }
         if (title) {
-            tableTitleMaps[column.getTitle()] = column;
+            tableTitleMaps[title] = column;
         }
     });
     const tableConf = {

package/es/table/src/cell.js

@@ -358,7 +358,7 @@ export const Cell = {
                 return getSlotVNs(renderTitleContent(h, params, rtHeader.call($table, h, renderOpts, params)));
             }
         }
-        return renderTitleContent(h, params, formatText(column.getTitle(), 1));
+        return renderTitleContent(h, params, $table.getHeaderCellLabel(column));
     },
     renderDefaultHeader(h, params) {
         return renderHeaderCellBaseVNs(h, params, Cell.renderHeaderTitle(h, params));
@@ -370,7 +370,7 @@ export const Cell = {
         const tableInternalData = $table;
         const { isRowGroupStatus } = tableReactData;
         const { editConfig } = tableProps;
-        const { field, slots, editRender, cellRender, rowGroupNode, aggFunc, formatter } = column;
+        const { field, slots, editRender, cellRender, rowGroupNode, aggFunc } = column;
         const isEnableEdit = editConfig && isEnableConf(editConfig);
         const editRenderOpts = isEnableEdit && isEnableConf(editRender) ? editRender : null;
         const cellRenderOpts = isEnableConf(cellRender) ? cellRender : null;
@@ -445,8 +445,9 @@ export const Cell = {
                 return renderCellBaseVNs(h, params, $table.callSlot(defaultSlot, params, h));
             }
             const renderOpts = editRenderOpts || cellRenderOpts;
-            // formatter > (renderTableCell | renderTableDefault)
-            if (renderOpts && !formatter) {
+            // 如果是编辑表格：renderTableCell > formatter
+            // 如果是查看表格：renderTableDefault > formatter
+            if (renderOpts) {
                 const compConf = renderer.get(renderOpts.name);
                 if (compConf) {
                     const renderFn = editRenderOpts ? (compConf.renderTableCell || compConf.renderCell) : (compConf.renderTableDefault || compConf.renderDefault);
@@ -602,7 +603,13 @@ export const Cell = {
         if (rowGroupList.length) {
             const aggregateOpts = $table.computeAggregateOpts;
             const { mode } = aggregateOpts;
-            if (mode === 'column' ? column.field === row.groupField : rowGroupNode) {
+            if (mode === 'column') {
+                if (row.groupField && column.field === row.groupField) {
+                    return [Cell.renderRowGroupBtn(h, params, cellVNodes)];
+                }
+                return cellVNodes;
+            }
+            else if (rowGroupNode) {
                 return [Cell.renderRowGroupBtn(h, params, cellVNodes)];
             }
         }
@@ -614,7 +621,7 @@ export const Cell = {
     renderSeqHeader(h, params) {
         const { $table, column } = params;
         const { slots } = column;
-        return renderHeaderCellBaseVNs(h, params, renderTitleContent(h, params, slots && slots.header ? $table.callSlot(slots.header, params, h) : formatText(column.getTitle(), 1)));
+        return renderHeaderCellBaseVNs(h, params, renderTitleContent(h, params, slots && slots.header ? $table.callSlot(slots.header, params, h) : $table.getHeaderCellLabel(column)));
     },
     renderSeqCell(h, params) {
         const { $table, column } = params;
@@ -647,7 +654,7 @@ export const Cell = {
             : [
                 h('span', {
                     class: 'vxe-radio--label'
-                }, titleSlot ? $table.callSlot(titleSlot, params, h) : formatText(column.getTitle(), 1))
+                }, titleSlot ? $table.callSlot(titleSlot, params, h) : $table.getHeaderCellLabel(column))
             ]));
     },
     renderRadioCell(h, params) {
@@ -717,7 +724,7 @@ export const Cell = {
         const titleSlot = slots ? slots.title : null;
         const checkboxOpts = $table.computeCheckboxOpts;
         const { checkStrictly, showHeader, headerTitle } = checkboxOpts;
-        const colTitle = column.getTitle();
+        const colTitle = $table.getHeaderCellLabel(column);
         const ons = {};
         if (!isHidden) {
             ons.click = (evnt) => {

package/es/table/src/columnInfo.js

@@ -11,7 +11,7 @@ export class ColumnInfo {
         const $xeGrid = $xeTable.$xeGrid;
         const $xeGantt = $xeTable.$xeGantt;
         const $xeGGWrapper = $xeGrid || $xeGantt;
-        const { field, editRender, filterRender, headerFormatter } = _vm;
+        const { field, editRender, filterRender } = _vm;
         const colId = _vm.colId || XEUtils.uniqueId('col_');
         const proxyOpts = $xeGrid ? $xeGrid.computeProxyOpts : null;
         const formatter = _vm.formatter;
@@ -19,9 +19,6 @@ export class ColumnInfo {
         const flCompConf = isEnableConf(filterRender) ? renderer.get(filterRender.name) : null;
         const ctFilterOptions = flCompConf ? flCompConf.createTableFilterOptions : null;
         const filters = toFilters(_vm.filters, colId);
-        if (headerFormatter) {
-            errLog('vxe.error.notProp', ['header-formatter']);
-        }
         const types = ['seq', 'checkbox', 'radio', 'expand', 'html'];
         if (_vm.type && types.indexOf(_vm.type) === -1) {
             warnLog('vxe.error.errProp', [`type=${_vm.type}`, types.join(', ')]);

package/es/table/src/methods.js

@@ -3786,6 +3786,7 @@ function handleInitColumn($xeTable, collectColumn) {
                 loadScrollXData($xeTable);
             }
         });
+        $xeTable.clearHeaderFormatterCache();
         $xeTable.clearMergeCells();
         $xeTable.clearMergeFooterItems();
         $xeTable.handleTableData(true);
@@ -5408,6 +5409,88 @@ const tableMethods = {
         }
         return $xeTable.$nextTick();
     },
+    getHeaderCellLabel(fieldOrColumn) {
+        const $xeTable = this;
+        const internalData = $xeTable;
+        const column = handleFieldOrColumn($xeTable, fieldOrColumn);
+        if (!column) {
+            return null;
+        }
+        const { headerFormatter } = column;
+        const _columnIndex = $xeTable.getVTColumnIndex(column);
+        let cellLabel = column.getTitle();
+        if (headerFormatter) {
+            let formatData;
+            const { headerFullDataColData } = internalData;
+            const colid = column.id;
+            let colRest = headerFullDataColData[colid];
+            if (!colRest) {
+                colRest = headerFullDataColData[colid] = {};
+            }
+            const formatObj = colRest.formatObj;
+            if (formatObj && formatObj.value === cellLabel) {
+                return formatObj.label;
+            }
+            const headFormatParams = {
+                $table: $xeTable,
+                cellTitle: cellLabel,
+                cellValue: cellLabel,
+                column,
+                _columnIndex,
+                columnIndex: $xeTable.getColumnIndex(column)
+            };
+            if (XEUtils.isString(headerFormatter)) {
+                const gFormatOpts = formats.get(headerFormatter);
+                const fcFormatMethod = gFormatOpts ? gFormatOpts.tableHeaderCellFormatMethod : null;
+                cellLabel = XEUtils.toValueString(fcFormatMethod ? fcFormatMethod(headFormatParams) : '');
+            }
+            else if (XEUtils.isArray(headerFormatter)) {
+                const gFormatOpts = formats.get(headerFormatter[0]);
+                const fcFormatMethod = gFormatOpts ? gFormatOpts.tableHeaderCellFormatMethod : null;
+                cellLabel = XEUtils.toValueString(fcFormatMethod ? fcFormatMethod(headFormatParams, ...headerFormatter.slice(1)) : '');
+            }
+            else {
+                cellLabel = XEUtils.toValueString(headerFormatter(headFormatParams));
+            }
+            if (formatData) {
+                colRest.formatObj = { value: cellLabel, label: cellLabel };
+            }
+        }
+        return cellLabel;
+    },
+    updateHeaderCellLabel(fieldOrColumn) {
+        const $xeTable = this;
+        const internalData = $xeTable;
+        const column = handleFieldOrColumn($xeTable, fieldOrColumn);
+        if (!column) {
+            return '';
+        }
+        const { headerFullDataColData } = internalData;
+        const colid = column.id;
+        const colRest = headerFullDataColData[colid];
+        if (colRest) {
+            colRest.formatObj = undefined;
+        }
+        return $xeTable.getHeaderCellLabel(column);
+    },
+    clearHeaderFormatterCache(isUpdate) {
+        const $xeTable = this;
+        const reactData = $xeTable;
+        const internalData = $xeTable;
+        const { tableColumn } = reactData;
+        const { headerFullDataColData } = internalData;
+        XEUtils.each(headerFullDataColData, (colRest) => {
+            if (colRest.formatObj) {
+                colRest.formatObj = undefined;
+            }
+        });
+        if (isUpdate) {
+            tableColumn.forEach(column => {
+                $xeTable.getHeaderCellLabel(column);
+            });
+        }
+        return $xeTable.$nextTick();
+    },
     getFooterCellLabel(row, fieldOrColumn) {
         const $xeTable = this;
         const reactData = $xeTable;
@@ -12458,6 +12541,7 @@ const tableMethods = {
             footData = visibleColumn.length ? footerMethod({ columns: visibleColumn, data: afterFullData, $table: $xeTable, $grid: $xeGrid, $gantt: $xeGantt }) : [];
         }
         reactData.footerTableData = footData;
+        $xeTable.clearFooterFormatterCache();
         $xeTable.handleUpdateFooterMerge();
         $xeTable.dispatchEvent('footer-data-change', {
             visibleColumn: internalData.visibleColumn,

package/es/table/src/util.js

@@ -77,6 +77,7 @@ export function createInternalData() {
         // 数据集（仅可视）
         visibleDataRowIdData: {},
         keepUpdateFieldMaps: {},
+        headerFullDataColData: {},
         footerFullDataRowData: {},
         // 渲染中缓存数据
         sourceDataRowIdData: {},

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.3";
+export const version = "3.21.5";
 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.3"}`;
+const version = `table v${"3.21.5"}`;
 export const warnLog = log.create('warn', version);
 export const errLog = log.create('error', version);