vxe-table 3.21.2 → 3.21.4

package/packages/locale/lang/zh-CN.ts

@@ -240,6 +240,10 @@ export default {
       expMergeTitle: '如果存在，则支持带有合并结构的单元格',
       expOptAllExpand: '展开树',
       expAllExpandTitle: '如果存在，则支持将带有层级结构的数据全部展开',
+      expOptTreeAllExpand: '展开树',
+      expTreeAllExpandTitle: '如果存在，则自动展开所有树层级',
+      expOptRowGroupAllExpand: '展开分组',
+      expRowGroupAllExpandTitle: '如果存在，则自动展开所有分组层级',
       expOptUseStyle: '样式',
       expUseStyleTitle: '如果存在，则支持带样式的单元格',
       expOptOriginal: '源数据',

package/packages/table/module/custom/panel.ts

@@ -420,7 +420,7 @@ export default /* define-vxe-component start */ defineVxeComponent({
       const { immediate } = customOpts
       const trEl = evnt.currentTarget as HTMLElement
       const columnDragOpts = $xeTable.computeColumnDragOpts
-      const { isCrossDrag, isSelfToChildDrag, isToChildDrag, dragEndMethod } = columnDragOpts
+      const { isCrossDrag, isPeerDrag, isSelfToChildDrag, isToChildDrag, dragEndMethod } = columnDragOpts
       const { dragCol } = customPanelReactData
       const { prevDragCol, prevDragGroupField, prevDragAggFnColid, prevDragPos, prevDragToChild } = customPanelInternalData
       const dragOffsetIndex = prevDragPos === 'bottom' ? 1 : 0
@@ -465,20 +465,28 @@ export default /* define-vxe-component start */ defineVxeComponent({
               if (dragColumn.parentId && newColumn.parentId) {
               // 子到子
 
-                if (!isCrossDrag) {
-                  return
-                }
-                if (oldAllMaps[newColumn.id]) {
-                  isSelfToChildStatus = true
-                  if (!(isCrossDrag && isSelfToChildDrag)) {
-                    if (VxeUI.modal) {
-                      VxeUI.modal.message({
-                        status: 'error',
-                        content: getI18n('vxe.error.treeDragChild')
-                      })
-                    }
+                if (isPeerDrag && !isCrossDrag) {
+                  if (dragColumn.parentId !== newColumn.parentId) {
+                    // 非同级
+                    return
+                  }
+                } else {
+                  if (!isCrossDrag) {
                     return
                   }
+
+                  if (oldAllMaps[newColumn.id]) {
+                    isSelfToChildStatus = true
+                    if (!(isCrossDrag && isSelfToChildDrag)) {
+                      if (VxeUI.modal) {
+                        VxeUI.modal.message({
+                          status: 'error',
+                          content: getI18n('vxe.error.treeDragChild')
+                        })
+                      }
+                      return
+                    }
+                  }
                 }
               } else if (dragColumn.parentId) {
               // 子到根
@@ -616,7 +624,7 @@ export default /* define-vxe-component start */ defineVxeComponent({
       const customOpts = $xeTable.computeCustomOpts
       const { showSortDragButton, allowSort, immediate } = customOpts
       const columnDragOpts = $xeTable.computeColumnDragOpts
-      const { isCrossDrag, isToChildDrag } = columnDragOpts
+      const { isCrossDrag, isPeerDrag, isToChildDrag } = columnDragOpts
       const optEl = evnt.currentTarget as HTMLElement
       const isControlKey = hasControlKey(evnt)
       const colid = optEl.getAttribute('colid')
@@ -624,7 +632,7 @@ export default /* define-vxe-component start */ defineVxeComponent({
       customPanelInternalData.prevDragGroupField = null
       customPanelInternalData.prevDragAggFnColid = null
       // 是否移入有效列
-      if (column && (isCrossDrag || column.level === 1)) {
+      if (column && (isCrossDrag || isPeerDrag || column.level === 1)) {
         evnt.preventDefault()
         const offsetY = evnt.clientY - optEl.getBoundingClientRect().y
         const dragPos = offsetY < optEl.clientHeight / 2 ? 'top' : 'bottom'
@@ -632,9 +640,9 @@ export default /* define-vxe-component start */ defineVxeComponent({
           !dragCol ||
           !(showSortDragButton && allowSort) ||
           (dragCol && dragCol.id === column.id) ||
-          (!isCrossDrag && column.level > 1) ||
+          (!isCrossDrag && (isPeerDrag ? dragCol.parentId !== column.parentId : column.level > 1)) ||
           (!immediate && column.level > 1) ||
-          (!isCrossDrag && dragCol.level > 1) ||
+          (!isCrossDrag && (isPeerDrag ? dragCol.parentId !== column.parentId : dragCol.level > 1)) ||
           (!immediate && dragCol.level > 1)
         ) {
           showDropTip($xeTableCustomPanel, evnt, optEl, false, dragPos)
@@ -804,7 +812,7 @@ export default /* define-vxe-component start */ defineVxeComponent({
       const { immediate, checkMethod, visibleMethod, allowVisible, allowSort, allowFixed, allowGroup, allowValues, trigger, placement, showSortDragButton, showSortMoveButton, showSortPutButton } = customOpts
       const isMaxFixedColumn = $xeTable.computeIsMaxFixedColumn
       const vSize = $xeTable.computeSize
-      const { isCrossDrag } = columnDragOpts
+      const { isCrossDrag, isPeerDrag } = columnDragOpts
       const slots = customOpts.slots || {}
       const headerSlot = slots.header
       const topSlot = slots.top
@@ -838,7 +846,7 @@ export default /* define-vxe-component start */ defineVxeComponent({
           const colTitle = formatText(column.getTitle(), 1)
           const isDisabled = checkMethod ? !checkMethod({ $table: $xeTable, column }) : false
           const isHidden = !isChecked
-          const showSortBtn = ((isCrossDrag ? immediate : false) || column.level === 1)
+          const showSortBtn = (isCrossDrag || isPeerDrag ? immediate : false) || column.level === 1
           colVNs.push(
             h('li', {
               key: column.id,
@@ -1207,7 +1215,7 @@ export default /* define-vxe-component start */ defineVxeComponent({
       const modalOpts = Object.assign({}, modalOptions)
       const drawerOpts = Object.assign({}, drawerOptions)
       const isMaxFixedColumn = $xeTable.computeIsMaxFixedColumn
-      const { isCrossDrag } = columnDragOpts
+      const { isCrossDrag, isPeerDrag } = columnDragOpts
       const slots = customOpts.slots || {}
       const headerSlot = slots.header
       const topSlot = slots.top
@@ -1255,7 +1263,7 @@ export default /* define-vxe-component start */ defineVxeComponent({
           const isColGroup = column.children && column.children.length
           const isDisabled = checkMethod ? !checkMethod({ $table: $xeTable, column }) : false
           const isHidden = !isChecked
-          const showSortBtn = ((isCrossDrag ? immediate : false) || column.level === 1)
+          const showSortBtn = (isCrossDrag || isPeerDrag ? immediate : false) || column.level === 1
           trVNs.push(
             h('tr', {
               key: column.id,

package/packages/table/module/export/export-panel.ts

@@ -242,7 +242,7 @@ export default /* define-vxe-component start */ defineVxeComponent({
 
       const { defaultOptions, storeData } = props
       const { isAll: isAllChecked, isIndeterminate: isAllIndeterminate } = reactData
-      const { hasTree, hasMerge, isPrint, hasColgroup, columns } = storeData
+      const { hasTree, hasRowGroup, hasMerge, isPrint, hasColgroup, columns } = storeData
       const { isHeader } = defaultOptions
       const colVNs: VNode[] = []
       const checkedAll = $xeExportPanel.computeCheckedAll
@@ -494,6 +494,19 @@ export default /* define-vxe-component start */ defineVxeComponent({
                                       }
                                     }
                                   }),
+                                  h('vxe-checkbox', {
+                                    props: {
+                                      value: defaultOptions.isFooter,
+                                      disabled: !storeData.hasFooter,
+                                      title: getI18n('vxe.export.expFooterTitle'),
+                                      content: getI18n('vxe.export.expOptFooter')
+                                    },
+                                    on: {
+                                      input (value: any) {
+                                        defaultOptions.isFooter = value
+                                      }
+                                    }
+                                  }),
                                   h('vxe-checkbox', {
                                     props: {
                                       value: isHeader ? defaultOptions.isTitle : false,
@@ -564,35 +577,34 @@ export default /* define-vxe-component start */ defineVxeComponent({
                                           defaultOptions.useStyle = value
                                         }
                                       }
-                                    }),
+                                    })
+                                ]),
+                                h('div', {
+                                  class: 'vxe-table-export--panel-option-row'
+                                }, [
                                   h('vxe-checkbox', {
                                     props: {
-                                      value: hasTree ? defaultOptions.isAllExpand : false,
+                                      value: hasTree ? defaultOptions.isTreeAllExpanded : false,
                                       disabled: hasEmptyData || !hasTree,
-                                      title: getI18n('vxe.export.expAllExpandTitle'),
-                                      content: getI18n('vxe.export.expOptAllExpand')
+                                      title: getI18n('vxe.export.expTreeAllExpandTitle'),
+                                      content: getI18n('vxe.export.expOptTreeAllExpand')
                                     },
                                     on: {
                                       input (value: any) {
-                                        defaultOptions.isAllExpand = value
+                                        defaultOptions.isTreeAllExpanded = value
                                       }
                                     }
-                                  })
-                                ]),
-
-                                h('div', {
-                                  class: 'vxe-table-export--panel-option-row'
-                                }, [
+                                  }),
                                   h('vxe-checkbox', {
                                     props: {
-                                      value: defaultOptions.isFooter,
-                                      disabled: !storeData.hasFooter,
-                                      title: getI18n('vxe.export.expFooterTitle'),
-                                      content: getI18n('vxe.export.expOptFooter')
+                                      value: hasRowGroup ? defaultOptions.isRowGroupAllExpanded : false,
+                                      disabled: hasEmptyData || !hasRowGroup,
+                                      title: getI18n('vxe.export.expRowGroupAllExpandTitle'),
+                                      content: getI18n('vxe.export.expOptRowGroupAllExpand')
                                     },
                                     on: {
                                       input (value: any) {
-                                        defaultOptions.isFooter = value
+                                        defaultOptions.isRowGroupAllExpanded = value
                                       }
                                     }
                                   })

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

@@ -15,12 +15,6 @@ let htmlCellElem: any
 const csvBOM = '\ufeff'
 const enterSymbol = '\r\n'
 
-function hasTreeChildren ($xeTable: VxeTableConstructor, row: any) {
-  const treeOpts = $xeTable.computeTreeOpts
-  const childrenField = treeOpts.children || treeOpts.childrenField
-  return row[childrenField] && row[childrenField].length
-}
-
 function getSeq ($xeTable: VxeTableConstructor, cellValue: any, row: any, $rowIndex: number, column: VxeTableDefines.ColumnInfo, $columnIndex: number) {
   const seqOpts = $xeTable.computeSeqOpts
   const seqMd = seqOpts.seqMethod || (column as any).seqMethod
@@ -62,35 +56,179 @@ const toStringValue = (cellValue: any) => {
   return eqEmptyValue(cellValue) ? '' : `${cellValue}`
 }
 
-function getBodyLabelData ($xeTable: VxeTableConstructor, opts: VxeTablePropTypes.ExportHandleOptions, columns: VxeTableDefines.ColumnInfo[], datas: any[]) {
+function getBodyLabelData ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, opts: VxeTablePropTypes.ExportHandleOptions, columns: VxeTableDefines.ColumnInfo[], datas: any[]) {
   const props = $xeTable
+  const reactData = $xeTable as unknown as TableReactData
+  const internalData = $xeTable as unknown as TableInternalData
 
-  const { isAllExpand, mode } = opts
+  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
   const columnOpts = $xeTable.computeColumnOpts
+  const aggregateOpts = $xeTable.computeAggregateOpts
   if (!htmlCellElem) {
     htmlCellElem = document.createElement('div')
   }
+  const { handleGetRowId } = createHandleGetRowId($xeTable)
+  if (isRowGroupStatus) {
+    // 如果是数据分组
+    const { mode: aggMode, showTotal, totalMethod, countFields, contentMethod, formatValuesMethod, 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) => {
+          const { field, editRender, cellRender, aggFunc, rowGroupNode } = column
+          let cellValue: string | number | boolean | null = ''
+          const renderOpts = editRender || 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 = expMode === 'all' ? seqVal : getSeq($xeTable, 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 (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)
+                  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()
+                    }
+                  }
+                }
+                break
+              }
+            }
+          }
+          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($xeTable, 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,
@@ -116,7 +254,7 @@ function getBodyLabelData ($xeTable: VxeTableConstructor, opts: VxeTablePropType
             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':
@@ -177,7 +315,7 @@ function getBodyLabelData ($xeTable: VxeTableConstructor, opts: VxeTablePropType
         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':
@@ -1005,10 +1143,11 @@ function handleExportAndPrint ($xeTable: VxeTableConstructor, options: VxeTableP
   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 = $xeTable.computeExportOpts
-  const hasTree = treeConfig
+  const hasTree = !!treeConfig
+  const hasRowGroup = rowGroupList.length > 0
   const customOpts = $xeTable.computeCustomOpts
   const selectRecords = $xeTable.getCheckboxRecords()
   const proxyOpts = $xeGGWrapper ? $xeGGWrapper.computeProxyOpts : {}
@@ -1025,6 +1164,13 @@ function handleExportAndPrint ($xeTable: VxeTableConstructor, options: VxeTableP
     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 = defOpts.types || XEUtils.keys(exportOpts._typeMaps)
   const modes = defOpts.modes || []
   const checkMethod = customOpts.checkMethod
@@ -1065,17 +1211,16 @@ function handleExportAndPrint ($xeTable: VxeTableConstructor, options: VxeTableP
     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'
@@ -1212,7 +1357,8 @@ export default {
         // filename: '',
         // sheetName: '',
         // original: false,
-        // isAllExpand: false,
+        // isTreeAllExpanded: false,
+        // isRowGroupAllExpanded: false,
         // data: null,
         // remote: false,
         // dataFilterMethod: null,
@@ -1222,6 +1368,13 @@ export default {
         // 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/cell.ts

@@ -622,7 +622,12 @@ 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)]
       }
     }