vxe-table 4.19.3 → 4.19.5

package/packages/table/module/export/hook.ts

@@ -326,7 +326,7 @@ hooks.add('tableExportModule', {
     function getHeaderTitle (opts: VxeTablePropTypes.ExportHandleOptions, column: VxeTableDefines.ColumnInfo) {
       const columnOpts = computeColumnOpts.value
       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) || '')
     }
 
     const toBooleanValue = (cellValue: any) => {
@@ -338,9 +338,10 @@ hooks.add('tableExportModule', {
     }
 
     const getBodyLabelData = (opts: VxeTablePropTypes.ExportHandleOptions, columns: VxeTableDefines.ColumnInfo[], datas: any[]) => {
-      const { isTreeAllExpanded, isRowGroupAllExpanded, mode } = opts
+      const { isTreeAllExpanded, isRowGroupAllExpanded, mode: expMode } = opts
       const { treeConfig } = props
       const { isRowGroupStatus } = reactData
+      const { fullColumnFieldData } = internalData
       const radioOpts = computeRadioOpts.value
       const checkboxOpts = computeCheckboxOpts.value
       const treeOpts = computeTreeOpts.value
@@ -352,7 +353,7 @@ hooks.add('tableExportModule', {
       const { handleGetRowId } = createHandleGetRowId($xeTable)
       if (isRowGroupStatus) {
         // 如果是数据分组
-        const { mapChildrenField } = aggregateOpts
+        const { mode: aggMode, showTotal, totalMethod, countFields, contentMethod, formatValuesMethod, mapChildrenField } = aggregateOpts
         const rest: any[] = []
         const expandMaps: Record<string, boolean> = {}
         const useMaps: Record<string, boolean> = {}
@@ -373,8 +374,9 @@ hooks.add('tableExportModule', {
               _expand: hasRowChild && $xeTable.isRowExpandByRow(row)
             }
             columns.forEach((column, $columnIndex) => {
+              const { field, editRender, cellRender, aggFunc, rowGroupNode } = column
               let cellValue: string | number | boolean | null = ''
-              const renderOpts = column.editRender || column.cellRender
+              const renderOpts = editRender || cellRender
               let bodyExportMethod: VxeColumnPropTypes.ExportMethod | undefined = column.exportMethod || columnOpts.exportMethod
               if (!bodyExportMethod && renderOpts && renderOpts.name) {
                 const compConf = renderer.get(renderOpts.name)
@@ -391,21 +393,75 @@ hooks.add('tableExportModule', {
                 switch (column.type) {
                   case 'seq': {
                     const seqVal = path.map((num, i) => i % 2 === 0 ? (Number(num) + 1) : '.').join('')
-                    cellValue = mode === 'all' ? seqVal : getSeq(seqVal, row, $rowIndex, column, $columnIndex)
+                    cellValue = expMode === 'all' ? seqVal : getSeq(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: VxeTableDefines.AggregateRowInfo = 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) as VxeTableDefines.ColumnInfo,
+                        column,
+                        groupValue: groupContent,
+                        childList,
+                        childCount,
+                        aggValue: null as any,
+
+                        /**
+                         * 已废弃
+                         * @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 {
                       cellValue = $xeTable.getCellLabel(row, column)
@@ -419,6 +475,8 @@ hooks.add('tableExportModule', {
                         }
                       }
                     }
+                    break
+                  }
                 }
               }
               item[column.id] = toStringValue(cellValue)
@@ -473,7 +531,7 @@ hooks.add('tableExportModule', {
                 switch (column.type) {
                   case 'seq': {
                     const seqVal = path.map((num, i) => i % 2 === 0 ? (Number(num) + 1) : '.').join('')
-                    cellValue = mode === 'all' ? seqVal : getSeq(seqVal, row, $rowIndex, column, $columnIndex)
+                    cellValue = expMode === 'all' ? seqVal : getSeq(seqVal, row, $rowIndex, column, $columnIndex)
                     break
                   }
                   case 'checkbox':
@@ -534,7 +592,7 @@ hooks.add('tableExportModule', {
             switch (column.type) {
               case 'seq': {
                 const seqValue = $rowIndex + 1
-                cellValue = mode === 'all' ? seqValue : getSeq(seqValue, row, $rowIndex, column, $columnIndex)
+                cellValue = expMode === 'all' ? seqValue : getSeq(seqValue, row, $rowIndex, column, $columnIndex)
                 break
               }
               case 'checkbox':
@@ -936,12 +994,12 @@ hooks.add('tableExportModule', {
       const tableTitleMaps: Record<string, VxeTableDefines.ColumnInfo> = {}
       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/packages/table/src/cell.ts

@@ -387,7 +387,7 @@ export const Cell = {
         }
       }
     }
-    return renderTitleContent(params, formatText(column.getTitle(), 1))
+    return renderTitleContent(params, $table.getHeaderCellLabel(column))
   },
   renderDefaultHeader (params: VxeTableDefines.CellRenderHeaderParams & { $table: VxeTableConstructor & VxeTablePrivateMethods }) {
     return renderHeaderCellBaseVNs(params, Cell.renderHeaderTitle(params))
@@ -399,7 +399,7 @@ export const Cell = {
     const tableInternalData = $table.internalData
     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
@@ -473,8 +473,9 @@ export const Cell = {
         return renderCellBaseVNs(params, $table.callSlot(defaultSlot, params))
       }
       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)
@@ -631,7 +632,12 @@ export const Cell = {
       const { computeAggregateOpts } = $table.getComputeMaps()
       const aggregateOpts = computeAggregateOpts.value
       const { mode } = aggregateOpts
-      if (mode === 'column' ? column.field === row.groupField : rowGroupNode) {
+      if (mode === 'column') {
+        if (row.groupField && column.field === row.groupField) {
+          return [Cell.renderRowGroupBtn(params, cellVNodes)]
+        }
+        return cellVNodes
+      } else if (rowGroupNode) {
         return [Cell.renderRowGroupBtn(params, cellVNodes)]
       }
     }
@@ -645,7 +651,7 @@ export const Cell = {
     const { $table, column } = params
     const { slots } = column
     const headerSlot = slots ? slots.header : null
-    return renderHeaderCellBaseVNs(params, renderTitleContent(params, headerSlot ? $table.callSlot(headerSlot, params) : formatText(column.getTitle(), 1)))
+    return renderHeaderCellBaseVNs(params, renderTitleContent(params, headerSlot ? $table.callSlot(headerSlot, params) : $table.getHeaderCellLabel(column)))
   },
   renderSeqCell (params: VxeTableDefines.CellRenderBodyParams & { $table: VxeTableConstructor & VxeTablePrivateMethods }) {
     const { $table, column } = params
@@ -682,7 +688,7 @@ export const Cell = {
         : [
             h('span', {
               class: 'vxe-radio--label'
-            }, titleSlot ? $table.callSlot(titleSlot, params) : formatText(column.getTitle(), 1))
+            }, titleSlot ? $table.callSlot(titleSlot, params) : $table.getHeaderCellLabel(column))
           ])
     )
   },
@@ -760,7 +766,7 @@ export const Cell = {
     const titleSlot = slots ? slots.title : null
     const checkboxOpts = computeCheckboxOpts.value
     const { checkStrictly, showHeader, headerTitle } = checkboxOpts
-    const colTitle = column.getTitle()
+    const colTitle = $table.getHeaderCellLabel(column)
     const ons: Record<string, any> = {}
     if (!isHidden) {
       ons.onClick = (evnt: MouseEvent) => {

package/packages/table/src/columnInfo.ts

@@ -16,7 +16,7 @@ export class ColumnInfo {
     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_')
 
@@ -28,10 +28,6 @@ export class ColumnInfo {
 
     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/packages/table/src/table.ts

@@ -4218,6 +4218,7 @@ export default defineVxeComponent({
             loadScrollXData()
           }
         })
+        $xeTable.clearHeaderFormatterCache()
         $xeTable.clearMergeCells()
         $xeTable.clearMergeFooterItems()
         $xeTable.handleTableData(true)
@@ -5473,6 +5474,79 @@ export default defineVxeComponent({
         }
         return nextTick()
       },
+      getHeaderCellLabel (fieldOrColumn) {
+        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: Record<string, VxeTableDefines.RowCacheFormatObj> | undefined
+          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 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 { tableColumn } = reactData
+        const { headerFullDataColData } = internalData
+        XEUtils.each(headerFullDataColData, (colRest: VxeTableDefines.HeaderColCacheItem) => {
+          if (colRest.formatObj) {
+            colRest.formatObj = undefined
+          }
+        })
+        if (isUpdate) {
+          tableColumn.forEach(column => {
+            $xeTable.getHeaderCellLabel(column)
+          })
+        }
+        return nextTick()
+      },
       getFooterCellLabel (row, fieldOrColumn) {
         const column = handleFieldOrColumn($xeTable, fieldOrColumn)
         if (!column) {
@@ -7670,6 +7744,7 @@ export default defineVxeComponent({
           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/packages/table/src/util.ts

@@ -83,6 +83,7 @@ export function createInternalData (): TableInternalData {
 
     keepUpdateFieldMaps: {},
 
+    headerFullDataColData: {},
     footerFullDataRowData: {},
 
     // 渲染中缓存数据