vxe-table 3.15.34 → 3.15.36

package/packages/table/module/validator/mixin.ts

@@ -5,7 +5,7 @@ import { scrollToView } from '../../../ui/src/dom'
 import { handleFieldOrColumn, getRowid } from '../../src/util'
 import { warnLog, errLog } from '../../../ui/src/log'
 
-import type { VxeTableDefines, TableInternalData } from '../../../../types'
+import type { VxeTableDefines, TableInternalData, TableReactData } from '../../../../types'
 
 const { getConfig, validators } = VxeUI
 
@@ -229,13 +229,15 @@ export default {
     beginValidate (rows: any, cols: VxeTableDefines.ColumnInfo[] | null, cb: any, isFull: any) {
       const $xeTable = this
       const props = $xeTable
+      const reactData = $xeTable as unknown as TableReactData
       const internalData = $xeTable as unknown as TableInternalData
 
       const validRest: any = {}
       const { editRules, treeConfig } = props
+      const { isRowGroupStatus } = reactData
       const { afterFullData, pendingRowMaps, removeRowMaps } = internalData
       const treeOpts = $xeTable.computeTreeOpts
-      const childrenField = treeOpts.children || treeOpts.childrenField
+      const aggregateOpts = $xeTable.computeAggregateOpts
       let validList
       if (rows === true) {
         validList = afterFullData
@@ -266,6 +268,9 @@ export default {
           if (pendingRowMaps[rowid]) {
             return
           }
+          if ($xeTable.isAggregateRecord(row)) {
+            return
+          }
           if (isFull || !this.validRuleErr) {
             const colVailds: any[] = []
             columns.forEach((column: any) => {
@@ -305,7 +310,10 @@ export default {
             rowValidErrs.push(Promise.all(colVailds))
           }
         }
-        if (treeConfig) {
+        if (isRowGroupStatus) {
+          XEUtils.eachTree(validList, handleVaild, { children: aggregateOpts.mapChildrenField })
+        } else if (treeConfig) {
+          const childrenField = treeOpts.children || treeOpts.childrenField
           XEUtils.eachTree(validList, handleVaild, { children: childrenField })
         } else {
           validList.forEach(handleVaild)

package/packages/table/src/body.ts

@@ -2,7 +2,7 @@ import { PropType, CreateElement } from 'vue'
 import XEUtils from 'xe-utils'
 import { VxeUI } from '../../ui'
 import { isEnableConf, getClass } from '../../ui/src/utils'
-import { getOffsetSize, calcTreeLine, getRowid, createHandleGetRowId } from './util'
+import { getOffsetSize, calcTreeLine, getRowid, createHandleGetRowId, getCellRestHeight } from './util'
 import { updateCellTitle } from '../../ui/src/dom'
 import { getSlotVNs } from '../../ui/src/vn'
 
@@ -218,6 +218,7 @@ function renderTdColumn (
     $xeTable.triggerCellDblclickEvent(evnt, cellParams)
   }
   let isMergeCell = false
+  let mergeRowspan = 1
   // 合并行或列
   if (mergeBodyFlag && mergeBodyList.length) {
     const spanRest = mergeBodyCellMaps[`${_rowIndex}:${_columnIndex}`]
@@ -228,6 +229,7 @@ function renderTdColumn (
       }
       if (rowspan > 1) {
         isMergeCell = true
+        mergeRowspan = rowspan
         tdAttrs.rowspan = rowspan
       }
       if (colspan > 1) {
@@ -242,9 +244,12 @@ function renderTdColumn (
       return null
     }
     if (rowspan > 1) {
+      isMergeCell = true
+      mergeRowspan = rowspan
       tdAttrs.rowspan = rowspan
     }
     if (colspan > 1) {
+      isMergeCell = true
       tdAttrs.colspan = colspan
     }
   }
@@ -260,7 +265,7 @@ function renderTdColumn (
   }
 
   const isVNAutoHeight = scrollYLoad && !hasEllipsis
-  const cellHeight = rowRest.resizeHeight || cellOpts.height || rowOpts.height || rowRest.height || defaultRowHeight
+  let cellHeight = getCellRestHeight(rowRest, cellOpts, rowOpts, defaultRowHeight)
 
   const isLastColumn = $columnIndex === columns.length - 1
   const isAutoCellWidth = !column.resizeWidth && (column.minWidth === 'auto' || column.width === 'auto')
@@ -276,6 +281,16 @@ function renderTdColumn (
     }
   }
 
+  if (mergeRowspan > 1) {
+    const mEndRow = afterFullData[_rowIndex + mergeRowspan - 1]
+    if (mEndRow) {
+      const meRowRest = fullAllDataRowIdData[getRowid($xeTable, mEndRow)]
+      if (meRowRest) {
+        cellHeight += meRowRest.oTop - rowRest.oTop + getCellRestHeight(meRowRest, cellOpts, rowOpts, defaultRowHeight)
+      }
+    }
+  }
+
   const tcStyle: Record<string, string> = {}
   if (hasEllipsis && resizeWidthFlag) {
     let tsColspan = tdAttrs.colspan || 0
@@ -310,8 +325,10 @@ function renderTdColumn (
     )
   } else {
     // 渲染单元格
+    if (treeConfig) {
+      tdVNs.push(...renderLine(h, $xeTable, rowid, cellParams, cellHeight))
+    }
     tdVNs.push(
-      ...renderLine(h, $xeTable, rowid, cellParams, cellHeight),
       h('div', {
         key: 'tc',
         class: ['vxe-cell', {

package/packages/table/src/cell.ts

@@ -270,11 +270,11 @@ function renderCellHandle (h: CreateElement, params: VxeTableDefines.CellRenderB
   const { editConfig } = tableProps
   const { isRowGroupStatus } = tableReactData
   const { type, treeNode, rowGroupNode, editRender } = column
-  const rowGroupOpts = $table.computeRowGroupOpts
-  const { mode } = rowGroupOpts
+  const aggregateOpts = $table.computeAggregateOpts
+  const { mode } = aggregateOpts
   const checkboxOpts = $table.computeCheckboxOpts
   const editOpts = $table.computeEditOpts
-  const isDeepCell = treeNode || (isRowGroupStatus && row.isAggregate && (mode === 'column' ? column.field === row.groupField : rowGroupNode))
+  const isDeepCell = treeNode || (isRowGroupStatus && (mode === 'column' ? column.field === row.groupField : rowGroupNode))
   switch (type) {
     case 'seq':
       return isDeepCell ? Cell.renderDeepIndexCell(h, params) : Cell.renderSeqCell(h, params)
@@ -375,7 +375,7 @@ export const Cell = {
     const tableReactData = $table as unknown as TableReactData
     const tableInternalData = $table as unknown as TableInternalData
     const { isRowGroupStatus } = tableReactData
-    const { field, slots, editRender, cellRender, rowGroupNode } = column
+    const { field, slots, editRender, cellRender, rowGroupNode, aggFunc } = column
     const renderOpts = editRender || cellRender
     if (slots && slots.default) {
       return renderCellBaseVNs(h, params, $table.callSlot(slots.default, params, h))
@@ -390,38 +390,50 @@ export const Cell = {
       }
     }
     let cellValue: string | number | null = ''
-    if (isRowGroupStatus && row.isAggregate) {
+    if (isRowGroupStatus && field && row.isAggregate) {
+      const aggRow: VxeTableDefines.AggregateRowInfo = row
       const { fullColumnFieldData } = tableInternalData
-      const rowGroupOpts = $table.computeRowGroupOpts
-      const { mode, showTotal, totalMethod, countFields, countMethod, contentMethod, mapChildrenField } = rowGroupOpts
-      const groupField = row.groupField
-      const groupContent = row.groupContent
-      const childList = mapChildrenField ? (row[mapChildrenField] || []) : []
-      const totalValue = row.childCount
+      const aggregateOpts = $table.computeAggregateOpts
+      const { mode, showTotal, totalMethod, countFields, contentMethod, mapChildrenField } = aggregateOpts
+      const aggMethod = aggregateOpts.aggregateMethod || aggregateOpts.countMethod
+      const groupField = aggRow.groupField
+      const groupContent = aggRow.groupContent
+      const childList = mapChildrenField ? (aggRow[mapChildrenField] || []) : []
+      const childCount = aggRow.childCount
       const colRest = fullColumnFieldData[groupField] || {}
-      const params = {
+      const ctParams = {
         $table,
         groupField,
         groupColumn: (colRest ? colRest.column : null) as VxeTableDefines.ColumnInfo,
         column,
         groupValue: groupContent,
         children: childList,
-        totalValue: totalValue
+        childCount,
+        aggValue: null as any,
+
+        /**
+         * 已废弃
+         * @deprecated
+         */
+        totalValue: childCount
       }
-      if (mode === 'column' ? column.field === row.groupField : rowGroupNode) {
+      if (mode === 'column' ? field === aggRow.groupField : rowGroupNode) {
         cellValue = groupContent
         if (contentMethod) {
-          cellValue = `${contentMethod(params)}`
+          cellValue = `${contentMethod(ctParams)}`
         }
         if (showTotal) {
-          cellValue = getI18n('vxe.table.rowGroupContentTotal', [cellValue, totalMethod ? totalMethod(params) : totalValue, totalValue])
+          cellValue = getI18n('vxe.table.rowGroupContentTotal', [cellValue, totalMethod ? totalMethod(ctParams) : childCount, childCount])
         }
-      } else if (countFields && countFields.includes(field)) {
-        if (countMethod) {
-          cellValue = `${countMethod(params)}`
+      } else if ($table.getPivotTableAggregateCellAggValue) {
+        cellValue = $table.getPivotTableAggregateCellAggValue(params)
+      } else if (aggFunc === true || (countFields && countFields.includes(field))) {
+        if (aggMethod) {
+          ctParams.aggValue = childCount
+          cellValue = `${aggMethod(ctParams)}`
         }
       }
-    } else if (!(isRowGroupStatus && row.isAggregate)) {
+    } else {
       cellValue = $table.getCellLabel(row, column)
     }
     const cellPlaceholder = editRender ? editRender.placeholder : ''
@@ -455,8 +467,8 @@ export const Cell = {
     const { row, level } = params
     const { rowGroupExpandedFlag } = tableReactData
     const { rowGroupExpandedMaps } = tableInternalData
-    const rowGroupOpts = $table.computeRowGroupOpts
-    const { padding, indent } = rowGroupOpts
+    const aggregateOpts = $table.computeAggregateOpts
+    const { padding, indent } = aggregateOpts
     const rowid = getRowid($table, row)
     const isExpand = !!rowGroupExpandedFlag && !!rowGroupExpandedMaps[rowid]
     return h('div', {
@@ -469,18 +481,20 @@ export const Cell = {
           }
         : undefined
     }, [
-      h('span', {
-        class: 'vxe-row-group--node-btn',
-        on: {
-          click (evnt: MouseEvent) {
-            $table.triggerRowGroupExpandEvent(evnt, params)
+      row.isAggregate
+        ? h('span', {
+          class: 'vxe-row-group--node-btn',
+          on: {
+            click (evnt: MouseEvent) {
+              $table.triggerRowGroupExpandEvent(evnt, params)
+            }
           }
-        }
-      }, [
-        h('i', {
-          class: isExpand ? getIcon().TABLE_ROW_GROUP_OPEN : getIcon().TABLE_ROW_GROUP_CLOSE
-        })
-      ]),
+        }, [
+          h('i', {
+            class: isExpand ? getIcon().TABLE_ROW_GROUP_OPEN : getIcon().TABLE_ROW_GROUP_CLOSE
+          })
+        ])
+        : renderEmptyElement($table),
       h('div', {
         class: 'vxe-row-group-cell'
       }, cellVNodes)
@@ -563,9 +577,11 @@ export const Cell = {
   renderDeepNodeBtn (h: CreateElement, params: VxeTableDefines.CellRenderBodyParams & { $table: VxeTableConstructor & VxeTablePrivateMethods }, cellVNodes: VxeComponentSlotType[]) {
     const { $table, row, column } = params
     const { rowGroupNode } = column
-    if (row.isAggregate) {
-      const rowGroupOpts = $table.computeRowGroupOpts
-      const { mode } = rowGroupOpts
+    const tableReactData = $table as unknown as TableReactData
+    const { rowGroupList } = tableReactData
+    if (rowGroupList.length) {
+      const aggregateOpts = $table.computeAggregateOpts
+      const { mode } = aggregateOpts
       if (mode === 'column' ? column.field === row.groupField : rowGroupNode) {
         return [Cell.renderRowGroupBtn(h, params, cellVNodes)]
       }

package/packages/table/src/column.ts

@@ -131,6 +131,8 @@ export const columnProps = {
   editRender: Object,
   // 内容渲染配置项
   contentRender: Object,
+  // 聚合函数
+  aggFunc: [String, Boolean] as PropType<VxeColumnPropTypes.AggFunc>,
   // 额外的参数
   params: Object
 }

package/packages/table/src/columnInfo.ts

@@ -103,6 +103,7 @@ export class ColumnInfo {
       titleHelp: _vm.titleHelp,
       titlePrefix: _vm.titlePrefix,
       titleSuffix: _vm.titleSuffix,
+      aggFunc: _vm.aggFunc,
       // 自定义参数
       params: _vm.params,
       // 渲染属性
@@ -128,6 +129,8 @@ export class ColumnInfo {
       sortNumber: 0, // 用于记录自定义列顺序
       renderSortNumber: 0, // 用于记录自定义列顺序
 
+      renderAggFn: '',
+
       renderFixed: '',
       renderVisible: false,