vxe-table 4.19.2 → 4.19.3

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

@@ -302,13 +302,7 @@ const tableExportMethodKeys: (keyof TableExportMethods)[] = ['exportData', 'impo
 hooks.add('tableExportModule', {
   setupTable ($xeTable) {
     const { props, reactData, internalData } = $xeTable
-    const { computeTreeOpts, computePrintOpts, computeExportOpts, computeImportOpts, computeCustomOpts, computeSeqOpts, computeRadioOpts, computeCheckboxOpts, computeColumnOpts } = $xeTable.getComputeMaps()
-
-    const hasTreeChildren = (row: any) => {
-      const treeOpts = computeTreeOpts.value
-      const childrenField = treeOpts.children || treeOpts.childrenField
-      return row[childrenField] && row[childrenField].length
-    }
+    const { computeTreeOpts, computePrintOpts, computeExportOpts, computeImportOpts, computeCustomOpts, computeSeqOpts, computeRadioOpts, computeCheckboxOpts, computeColumnOpts, computeAggregateOpts } = $xeTable.getComputeMaps()
 
     const getSeq = (cellValue: any, row: any, $rowIndex: number, column: VxeTableDefines.ColumnInfo, $columnIndex: number) => {
       const seqOpts = computeSeqOpts.value
@@ -344,32 +338,116 @@ hooks.add('tableExportModule', {
     }
 
     const getBodyLabelData = (opts: VxeTablePropTypes.ExportHandleOptions, columns: VxeTableDefines.ColumnInfo[], datas: any[]) => {
-      const { isAllExpand, mode } = opts
+      const { isTreeAllExpanded, isRowGroupAllExpanded, mode } = opts
       const { treeConfig } = props
+      const { isRowGroupStatus } = reactData
       const radioOpts = computeRadioOpts.value
       const checkboxOpts = computeCheckboxOpts.value
       const treeOpts = computeTreeOpts.value
       const columnOpts = computeColumnOpts.value
+      const aggregateOpts = computeAggregateOpts.value
       if (!htmlCellElem) {
         htmlCellElem = document.createElement('div')
       }
+      const { handleGetRowId } = createHandleGetRowId($xeTable)
+      if (isRowGroupStatus) {
+        // 如果是数据分组
+        const { mapChildrenField } = aggregateOpts
+        const rest: any[] = []
+        const expandMaps: Record<string, boolean> = {}
+        const useMaps: Record<string, boolean> = {}
+        XEUtils.eachTree(datas, (item, $rowIndex, items, path, parentItem, nodes) => {
+          const row = item._row || item
+          const rowid = handleGetRowId(row)
+          if (useMaps[rowid]) {
+            return
+          }
+          const parentRow = parentItem && parentItem._row ? parentItem._row : parentItem
+          const pRowid = parentRow ? handleGetRowId(parentRow) : ''
+          if ((isRowGroupAllExpanded || !parentRow || (expandMaps[pRowid] && $xeTable.isRowExpandByRow(parentRow)))) {
+            const hasRowChild = mapChildrenField && row[mapChildrenField] && row[mapChildrenField].length
+            const item: any = {
+              _row: row,
+              _level: nodes.length - 1,
+              _hasChild: hasRowChild,
+              _expand: hasRowChild && $xeTable.isRowExpandByRow(row)
+            }
+            columns.forEach((column, $columnIndex) => {
+              let cellValue: string | number | boolean | null = ''
+              const renderOpts = column.editRender || column.cellRender
+              let bodyExportMethod: VxeColumnPropTypes.ExportMethod | undefined = column.exportMethod || columnOpts.exportMethod
+              if (!bodyExportMethod && renderOpts && renderOpts.name) {
+                const compConf = renderer.get(renderOpts.name)
+                if (compConf) {
+                  bodyExportMethod = compConf.tableExportMethod || compConf.exportMethod
+                }
+              }
+              if (!bodyExportMethod) {
+                bodyExportMethod = columnOpts.exportMethod
+              }
+              if (bodyExportMethod) {
+                cellValue = bodyExportMethod({ $table: $xeTable, row, column, options: opts })
+              } else {
+                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)
+                    break
+                  }
+                  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':
+                    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) {
+                      cellValue = getCellValue(row, column)
+                    } else {
+                      cellValue = $xeTable.getCellLabel(row, column)
+                      if (column.type === 'html') {
+                        htmlCellElem.innerHTML = cellValue
+                        cellValue = htmlCellElem.innerText.trim()
+                      } else {
+                        const cell = $xeTable.getCellElement(row, column)
+                        if (cell && !hasClass(cell, 'is--progress')) {
+                          cellValue = cell.innerText.trim()
+                        }
+                      }
+                    }
+                }
+              }
+              item[column.id] = toStringValue(cellValue)
+            })
+            useMaps[rowid] = true
+            if (pRowid) {
+              expandMaps[pRowid] = true
+            }
+            rest.push(Object.assign(item, row))
+          }
+        }, { children: mapChildrenField })
+        return rest
+      }
       if (treeConfig) {
+        // 如果是树结构
         const childrenField = treeOpts.children || treeOpts.childrenField
-        // 如果是树表格只允许导出数据源
         const rest: any[] = []
         const expandMaps: Record<string, boolean> = {}
         const useMaps: Record<string, boolean> = {}
-        const { handleGetRowId } = createHandleGetRowId($xeTable)
-        XEUtils.eachTree(datas, (item, $rowIndex, items, path, parent, nodes) => {
+        XEUtils.eachTree(datas, (item, $rowIndex, items, path, parentItem, nodes) => {
           const row = item._row || item
           const rowid = handleGetRowId(row)
           if (useMaps[rowid]) {
             return
           }
-          const parentRow = parent && parent._row ? parent._row : parent
+          const parentRow = parentItem && parentItem._row ? parentItem._row : parentItem
           const pRowid = parentRow ? handleGetRowId(parentRow) : ''
-          if ((isAllExpand || !parentRow || (expandMaps[pRowid] && $xeTable.isTreeExpandByRow(parentRow)))) {
-            const hasRowChild = hasTreeChildren(row)
+          if ((isTreeAllExpanded || !parentRow || (expandMaps[pRowid] && $xeTable.isTreeExpandByRow(parentRow)))) {
+            const hasRowChild = row[childrenField] && row[childrenField].length
             const item: any = {
               _row: row,
               _level: nodes.length - 1,
@@ -1037,10 +1115,11 @@ hooks.add('tableExportModule', {
       const $xeGGWrapper = $xeGrid || $xeGantt
 
       const { treeConfig, showHeader, showFooter } = props
-      const { initStore, isGroup, footerTableData, exportStore, exportParams } = reactData
+      const { initStore, isGroup, rowGroupList, footerTableData, exportStore, exportParams } = reactData
       const { collectColumn, mergeBodyList, mergeFooterList } = internalData
       const exportOpts = computeExportOpts.value
-      const hasTree = treeConfig
+      const hasTree = !!treeConfig
+      const hasRowGroup = rowGroupList.length > 0
       const customOpts = computeCustomOpts.value
       const selectRecords = $xeTable.getCheckboxRecords()
       const proxyOpts = $xeGGWrapper ? $xeGGWrapper.getComputeMaps().computeProxyOpts.value : {} as VxeGridPropTypes.ProxyOpts
@@ -1057,6 +1136,13 @@ hooks.add('tableExportModule', {
         current: 'current',
         modes: (proxyOpts.ajax && proxyOpts.ajax.queryAll ? ['all'] : []).concat(['current', 'selected', 'empty'])
       }, options)
+
+      // 已废弃，参数 isAllExpand
+      if (XEUtils.isBoolean((defOpts as any).isAllExpand)) {
+        warnLog('vxe.error.delProp', ['isAllExpand', 'isTreeAllExpanded'])
+        defOpts.isTreeAllExpanded = (defOpts as any).isAllExpand
+      }
+
       const types: string[] = defOpts.types || XEUtils.keys(exportOpts._typeMaps)
       const modes: string[] = defOpts.modes || []
       const checkMethod = customOpts.checkMethod
@@ -1097,17 +1183,16 @@ hooks.add('tableExportModule', {
         column.disabled = (parent && parent.disabled) || (checkMethod ? !checkMethod({ $table: $xeTable, column }) : false)
       })
       // 更新条件
-      Object.assign(exportStore, {
-        columns: exportColumns,
-        typeList,
-        modeList,
-        hasFooter,
-        hasMerge,
-        hasTree,
-        isPrint,
-        hasColgroup: isGroup,
-        visible: true
-      })
+      exportStore.columns = exportColumns
+      exportStore.typeList = typeList
+      exportStore.modeList = modeList
+      exportStore.hasFooter = hasFooter
+      exportStore.hasMerge = hasMerge
+      exportStore.hasTree = hasTree
+      exportStore.hasRowGroup = hasRowGroup
+      exportStore.isPrint = !!isPrint
+      exportStore.hasColgroup = isGroup
+      exportStore.visible = true
       // 默认参数
       Object.assign(exportParams, {
         mode: selectRecords.length ? 'selected' : 'current'
@@ -1188,7 +1273,8 @@ hooks.add('tableExportModule', {
           // filename: '',
           // sheetName: '',
           // original: false,
-          // isAllExpand: false,
+          // isTreeAllExpanded: false,
+          // isRowGroupAllExpanded: false,
           // data: null,
           // remote: false,
           // dataFilterMethod: null,
@@ -1198,6 +1284,13 @@ hooks.add('tableExportModule', {
           // beforeExportMethod: null,
           // afterExportMethod: null
         }, exportOpts, options)
+
+        // 已废弃，参数 isAllExpand
+        if (XEUtils.isBoolean((opts as any).isAllExpand)) {
+          warnLog('vxe.error.delProp', ['isAllExpand', 'isTreeAllExpanded'])
+          opts.isTreeAllExpanded = (opts as any).isAllExpand
+        }
+
         let { filename, sheetName, type, mode, columns, original, columnFilterMethod, beforeExportMethod, includeFields, excludeFields } = opts
         let groups: any[] = []
         const selectRecords = $xeTable.getCheckboxRecords()

package/packages/table/src/table.ts

@@ -312,6 +312,11 @@ export default defineVxeComponent({
       return computeAggregateOpts.value
     })
 
+    const computeAggregateMode = computed(() => {
+      const aggregateOpts = computeAggregateOpts.value
+      return aggregateOpts.mode
+    })
+
     const computeAggregateAccuracyOpts = computed(() => {
       return Object.assign({}, getConfig().table.aggregateAccuracyConfig, props.aggregateAccuracyConfig)
     })
@@ -3616,12 +3621,12 @@ export default defineVxeComponent({
       }
     }
 
-    const handleGroupData = (list: any[], rowGroups: VxeTableDefines.RowGroupItem[]) => {
+    const handleGroupData = (list: any[], rowGroups: VxeTableDefines.RowGroupItem[], isCombinedField?: boolean) => {
       let fullData = list
       let treeData = list
       if (rowGroups) {
         const aggregateOpts = computeAggregateOpts.value
-        const { rowField, parentField, childrenField, mapChildrenField } = aggregateOpts
+        const { rowField, parentField, separator, childrenField, mapChildrenField } = aggregateOpts
         const rowOpts = computeRowOpts.value
         const checkboxOpts = computeCheckboxOpts.value
         const { checkField } = checkboxOpts
@@ -3633,11 +3638,26 @@ export default defineVxeComponent({
           const groupField = rgItem.field
           const groupColumn = $xeTable.getColumnByField(groupField)
           const groupMaps: Record<string, any[]> = {}
+          const groupCombinedMaps: Record<string, any[]> = {}
           const aggList: VxeTableDefines.AggregateRowInfo[] = []
           const rowkey = getRowkey($xeTable)
           list.forEach((row) => {
             const cellValue = groupColumn ? $xeTable.getCellLabel(row, groupColumn) : XEUtils.get(row, groupField)
-            const groupValue = XEUtils.eqNull(cellValue) ? '' : cellValue
+            let groupValue = XEUtils.eqNull(cellValue) ? '' : cellValue
+            if (isCombinedField) {
+              const groupVals = [groupValue]
+              rowGroups.slice(1).forEach(ogItem => {
+                const ogField = ogItem.field
+                const ogColumn = $xeTable.getColumnByField(ogField)
+                const ocValue = ogColumn ? $xeTable.getCellLabel(row, ogColumn) : XEUtils.get(row, ogField)
+                const ogValue = XEUtils.eqNull(ocValue) ? '' : ocValue
+                groupValue += (separator || ' / ') + ogValue
+                groupVals.push(ogValue)
+              })
+              if (!groupCombinedMaps[groupValue]) {
+                groupCombinedMaps[groupValue] = groupVals
+              }
+            }
             let childList = groupMaps[groupValue]
             if (!childList) {
               childList = []
@@ -3648,33 +3668,61 @@ export default defineVxeComponent({
             }
             childList.push(row)
           })
-          XEUtils.objectEach(groupMaps, (childList, groupValue) => {
-            const { fullData: childFullData, treeData: childTreeData } = handleGroupData(childList, rowGroups.slice(1))
-            const aggRow: VxeTableDefines.AggregateRowInfo = {
-              isAggregate: true,
-              aggData: {},
-              groupContent: groupValue,
-              groupField,
-              childCount: 0,
-              [rowField]: getRowUniqueId(),
-              [parentField]: null,
-              [childrenField]: childTreeData,
-              [mapChildrenField]: childTreeData
-            }
-            aggRow[rowkey] = createRowId(rowOpts, aggRow, rowkey)
-            if (checkField) {
-              aggRow[checkField] = false
-            }
-            if (indeterminateField) {
-              aggRow[indeterminateField] = false
-            }
-            aggList.push(aggRow)
-            treeData.push(aggRow)
-            fullData.push(aggRow)
-            if (childFullData.length) {
-              fullData.push(...childFullData)
-            }
-          })
+          if (isCombinedField) {
+            XEUtils.objectEach(groupMaps, (childList, groupValue) => {
+              const aggRow: VxeTableDefines.AggregateRowInfo = {
+                isAggregate: true,
+                aggData: {},
+                groupContent: groupValue,
+                groupCombineds: groupCombinedMaps[groupValue],
+                groupField,
+                childCount: 0,
+                [rowField]: getRowUniqueId(),
+                [parentField]: null,
+                [childrenField]: childList,
+                [mapChildrenField]: childList
+              }
+              aggRow[rowkey] = createRowId(rowOpts, aggRow, rowkey)
+              if (checkField) {
+                aggRow[checkField] = false
+              }
+              if (indeterminateField) {
+                aggRow[indeterminateField] = false
+              }
+              aggList.push(aggRow)
+              treeData.push(aggRow)
+              fullData.push(aggRow)
+            })
+          } else {
+            XEUtils.objectEach(groupMaps, (childList, groupValue) => {
+              const { fullData: childFullData, treeData: childTreeData } = handleGroupData(childList, rowGroups.slice(1))
+              const aggRow: VxeTableDefines.AggregateRowInfo = {
+                isAggregate: true,
+                aggData: {},
+                groupContent: groupValue,
+                groupCombineds: [],
+                groupField,
+                childCount: 0,
+                [rowField]: getRowUniqueId(),
+                [parentField]: null,
+                [childrenField]: childTreeData,
+                [mapChildrenField]: childTreeData
+              }
+              aggRow[rowkey] = createRowId(rowOpts, aggRow, rowkey)
+              if (checkField) {
+                aggRow[checkField] = false
+              }
+              if (indeterminateField) {
+                aggRow[indeterminateField] = false
+              }
+              aggList.push(aggRow)
+              treeData.push(aggRow)
+              fullData.push(aggRow)
+              if (childFullData.length) {
+                fullData.push(...childFullData)
+              }
+            })
+          }
           handleeGroupSummary(aggList)
         }
       }
@@ -3684,6 +3732,14 @@ export default defineVxeComponent({
       }
     }
 
+    const initGroupData = (list: any[], rowGroups: VxeTableDefines.RowGroupItem[]) => {
+      const aggregateOpts = computeAggregateOpts.value
+      const { mode } = aggregateOpts
+      const isCombinedField = mode === 'combined'
+      const groupRest = handleGroupData(list, rowGroups, isCombinedField)
+      return groupRest
+    }
+
     const initData = () => {
       const { data } = props
       loadTableData(data || [], true, true).then(() => {
@@ -3765,7 +3821,7 @@ export default defineVxeComponent({
           treeData = fullData.slice(0)
         }
       } else if ((aggregateConfig || rowGroupConfig) && rowGroupList.length) {
-        const groupRest = handleGroupData(fullData, rowGroupList)
+        const groupRest = initGroupData(fullData, rowGroupList)
         treeData = groupRest.treeData
         fullData = groupRest.fullData
         isRGroup = true
@@ -13878,6 +13934,12 @@ export default defineVxeComponent({
       internalData.keepUpdateFieldMaps = kpfMaps
     })
 
+    watch(computeAggregateMode, () => {
+      if (reactData.isRowGroupStatus) {
+        loadTableData(internalData.tableSynchData, false, true)
+      }
+    })
+
     if ($xeTabs) {
       watch(() => $xeTabs ? $xeTabs.reactData.resizeFlag : null, () => {
         handleGlobalResizeEvent()
@@ -14040,6 +14102,9 @@ export default defineVxeComponent({
       if (exportConfig && exportOpts.types && !exportOpts.exportMethod && !XEUtils.includeArrays(XEUtils.keys(exportOpts._typeMaps), exportOpts.types)) {
         warnLog('vxe.error.errProp', [`export-config.types=${exportOpts.types.join(',')}`, exportOpts.types.filter((type) => XEUtils.includes(XEUtils.keys(exportOpts._typeMaps), type)).join(',') || XEUtils.keys(exportOpts._typeMaps).join(',')])
       }
+      if (exportConfig && XEUtils.isBoolean((exportOpts as any).isAllExpand)) {
+        warnLog('vxe.error.delProp', ['isAllExpand', 'isTreeAllExpanded'])
+      }
 
       if (!props.id) {
         if ((props.customConfig ? isEnableConf(customOpts) : customOpts.enabled) && customOpts.storage) {

package/packages/table/src/util.ts

@@ -342,6 +342,7 @@ export function createReactData (): TableReactData {
       hasFooter: false,
       hasMerge: false,
       hasTree: false,
+      hasRowGroup: false,
       hasColgroup: false,
       visible: false
     },
@@ -352,7 +353,8 @@ export function createReactData (): TableReactData {
       type: '',
       isColgroup: false,
       isMerge: false,
-      isAllExpand: false,
+      isTreeAllExpanded: false,
+      isRowGroupAllExpanded: false,
       useStyle: false,
       original: false,
       message: true,

package/styles/components/table-module/export.scss

@@ -37,7 +37,7 @@
           width: 80%;
         }
         & > .vxe-table-export--panel-option-row {
-          padding: 0.25em 0;
+          padding: 0.5em 0;
         }
       }
     }