vxe-table 4.13.39 → 4.13.41

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

@@ -1,4 +1,5 @@
-import { defineComponent, h, ref, computed, inject, Teleport } from 'vue'
+import { h, ref, computed, inject, Teleport } from 'vue'
+import { defineVxeComponent } from '../../../ui/src/comp'
 import { VxeUI } from '../../../ui'
 import { formatText, isEnableConf } from '../../../ui/src/utils'
 import { getPropClass } from '../../../ui/src/dom'
@@ -9,7 +10,7 @@ import type { VxeTableConstructor, VxeTableMethods, VxeTablePrivateMethods } fro
 
 const { getI18n, getIcon, renderer } = VxeUI
 
-export default defineComponent({
+export default defineVxeComponent({
   name: 'VxeTableFilterPanel',
   props: {
     filterStore: Object as any

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

@@ -1,4 +1,5 @@
-import { defineComponent, h, Teleport, inject, ref, Ref, createCommentVNode } from 'vue'
+import { h, Teleport, inject, ref, Ref, createCommentVNode } from 'vue'
+import { defineVxeComponent } from '../../../ui/src/comp'
 import { VxeUI } from '../../../ui'
 import { getFuncText } from '../../../ui/src/utils'
 import XEUtils from 'xe-utils'
@@ -7,7 +8,7 @@ import type { VxeTablePrivateMethods, VxeTableConstructor, VxeTableMethods } fro
 
 const { getIcon } = VxeUI
 
-export default defineComponent({
+export default defineVxeComponent({
   name: 'VxeTableMenuPanel',
   setup (props, context) {
     const xID = XEUtils.uniqueId()

package/packages/table/src/body.ts

@@ -1,4 +1,5 @@
-import { defineComponent, TransitionGroup, h, ref, Ref, PropType, inject, nextTick, onMounted, onUnmounted } from 'vue'
+import { TransitionGroup, h, ref, Ref, PropType, inject, nextTick, onMounted, onUnmounted } from 'vue'
+import { defineVxeComponent } from '../../ui/src/comp'
 import XEUtils from 'xe-utils'
 import { VxeUI } from '../../ui'
 import { getOffsetSize, calcTreeLine, getRowid, createHandleGetRowId, getCellRestHeight } from './util'
@@ -12,7 +13,7 @@ const { getI18n, renderer, renderEmptyElement } = VxeUI
 
 const renderType = 'body'
 
-export default defineComponent({
+export default defineVxeComponent({
   name: 'VxeTableBody',
   props: {
     tableData: Array as PropType<any[]>,
@@ -45,7 +46,7 @@ export default defineComponent({
       return !!(isDragResize || (lastScrollTime && Date.now() < lastScrollTime + (delayHover as number)))
     }
 
-    const renderLine = (rowid: string, params: VxeTableDefines.CellRenderBodyParams, cellHeight: number) => {
+    const renderLine = (rowid: string, params: VxeTableDefines.CellRenderBodyParams, cellHeight: number): VxeComponentSlotType[] => {
       const { row, column } = params
       const { afterFullData } = tableInternalData
       const { treeConfig } = tableProps
@@ -326,7 +327,7 @@ export default defineComponent({
         tcStyle.minHeight = `${cellHeight}px`
       }
 
-      const tdVNs: any[] = []
+      const tdVNs: VxeComponentSlotType[] = []
       if (fixedHiddenColumn && isAllOverflow) {
         tdVNs.push(
           h('div', {
@@ -609,7 +610,7 @@ export default defineComponent({
             const { showOverflow } = expandColumn || {}
             const colid = expandColumn.id
             const colRest = fullColumnIdData[colid] || {}
-            const hasEllipsis = (XEUtils.isUndefined(showOverflow) || XEUtils.isNull(showOverflow)) ? isAllOverflow : showOverflow
+            const hasEllipsis = XEUtils.eqNull(showOverflow) ? isAllOverflow : showOverflow
             let columnIndex = -1
             let $columnIndex = -1
             let _columnIndex = -1
@@ -791,13 +792,14 @@ export default defineComponent({
 
       let emptyContent: string | VxeComponentSlotType | VxeComponentSlotType[]
       const emptySlot = slots ? slots.empty : null
+      const emptyParams = { $table: $xeTable, $grid: $xeGrid }
       if (emptySlot) {
-        emptyContent = $xeTable.callSlot(emptySlot, { $table: $xeTable, $grid: $xeGrid })
+        emptyContent = $xeTable.callSlot(emptySlot, emptyParams)
       } else {
         const compConf = emptyOpts.name ? renderer.get(emptyOpts.name) : null
         const rtEmptyView = compConf ? (compConf.renderTableEmpty || compConf.renderTableEmptyView || compConf.renderEmpty) : null
         if (rtEmptyView) {
-          emptyContent = getSlotVNs(rtEmptyView(emptyOpts, { $table: $xeTable }))
+          emptyContent = getSlotVNs(rtEmptyView(emptyOpts, emptyParams))
         } else {
           emptyContent = tableProps.emptyText || getI18n('vxe.table.emptyText')
         }
@@ -880,7 +882,7 @@ export default defineComponent({
                 ? [
                     h('span', {
                       class: 'vxe-table--cell-main-area-btn',
-                      onMousedown (evnt: any) {
+                      onMousedown (evnt: MouseEvent) {
                         if ($xeTable.triggerCellAreaExtendMousedownEvent) {
                           $xeTable.triggerCellAreaExtendMousedownEvent(evnt, { $table: $xeTable, fixed: fixedType, type: renderType })
                         }

package/packages/table/src/cell.ts

@@ -400,20 +400,6 @@ export const Cell = {
     const { field, slots, editRender, cellRender, rowGroupNode, aggFunc } = column
     const renderOpts = editRender || cellRender
     const defaultSlot = slots ? slots.default : null
-    if (defaultSlot) {
-      return renderCellBaseVNs(params, $table.callSlot(defaultSlot, params))
-    }
-    if (renderOpts) {
-      const compConf = renderer.get(renderOpts.name)
-      if (compConf) {
-        const rtCell = compConf.renderTableCell || compConf.renderCell
-        const rtDefault = compConf.renderTableDefault || compConf.renderDefault
-        const renderFn = editRender ? rtCell : rtDefault
-        if (renderFn) {
-          return renderCellBaseVNs(params, getSlotVNs(renderFn(renderOpts, Object.assign({ $type: editRender ? 'edit' : 'cell' }, params))))
-        }
-      }
-    }
     let cellValue: string | number | null = ''
     if (isRowGroupStatus && field && row.isAggregate) {
       const aggRow: VxeTableDefines.AggregateRowInfo = row
@@ -460,6 +446,20 @@ export const Cell = {
         }
       }
     } else {
+      if (defaultSlot) {
+        return renderCellBaseVNs(params, $table.callSlot(defaultSlot, params))
+      }
+      if (renderOpts) {
+        const compConf = renderer.get(renderOpts.name)
+        if (compConf) {
+          const rtCell = compConf.renderTableCell || compConf.renderCell
+          const rtDefault = compConf.renderTableDefault || compConf.renderDefault
+          const renderFn = editRender ? rtCell : rtDefault
+          if (renderFn) {
+            return renderCellBaseVNs(params, getSlotVNs(renderFn(renderOpts, Object.assign({ $type: editRender ? 'edit' : 'cell' }, params))))
+          }
+        }
+      }
       cellValue = $table.getCellLabel(row, column)
     }
     const cellPlaceholder = editRender ? editRender.placeholder : ''

package/packages/table/src/column.ts

@@ -1,4 +1,5 @@
-import { defineComponent, h, onUnmounted, inject, ref, PropType, provide, onMounted, createCommentVNode } from 'vue'
+import { h, onUnmounted, inject, ref, PropType, provide, onMounted, createCommentVNode } from 'vue'
+import { defineVxeComponent } from '../../ui/src/comp'
 import { XEColumnInstance, watchColumn, assembleColumn, destroyColumn } from './util'
 import Cell from './cell'
 
@@ -130,7 +131,7 @@ export const columnProps = {
   params: Object as PropType<VxeColumnPropTypes.Params>
 }
 
-export default defineComponent({
+export default defineVxeComponent({
   name: 'VxeColumn',
   props: columnProps,
   setup (props, { slots }) {

package/packages/table/src/footer.ts

@@ -1,4 +1,5 @@
-import { defineComponent, TransitionGroup, h, ref, Ref, PropType, inject, nextTick, onMounted, onUnmounted } from 'vue'
+import { TransitionGroup, h, ref, Ref, PropType, inject, nextTick, onMounted, onUnmounted } from 'vue'
+import { defineVxeComponent } from '../../ui/src/comp'
 import XEUtils from 'xe-utils'
 import { VxeUI } from '../../ui'
 import { updateCellTitle, getPropClass } from '../../ui/src/dom'
@@ -10,7 +11,7 @@ const { renderer, renderEmptyElement } = VxeUI
 
 const renderType = 'footer'
 
-export default defineComponent({
+export default defineVxeComponent({
   name: 'VxeTableFooter',
   props: {
     footerTableData: {

package/packages/table/src/group.ts

@@ -1,11 +1,12 @@
-import { defineComponent, h, onUnmounted, provide, inject, ref, onMounted, Slot, createCommentVNode } from 'vue'
+import { h, onUnmounted, provide, inject, ref, onMounted, Slot, createCommentVNode } from 'vue'
+import { defineVxeComponent } from '../../ui/src/comp'
 import { columnProps } from './column'
 import { XEColumnInstance, watchColumn, assembleColumn, destroyColumn } from './util'
 import Cell from './cell'
 
 import type { VxeTableConstructor, VxeTablePrivateMethods } from '../../../types'
 
-export default defineComponent({
+export default defineVxeComponent({
   name: 'VxeColgroup',
   props: columnProps,
   setup (props, { slots }) {

package/packages/table/src/header.ts

@@ -1,4 +1,5 @@
-import { defineComponent, TransitionGroup, h, ref, Ref, PropType, inject, nextTick, watch, onMounted, onUnmounted } from 'vue'
+import { TransitionGroup, h, ref, Ref, PropType, inject, nextTick, watch, onMounted, onUnmounted } from 'vue'
+import { defineVxeComponent } from '../../ui/src/comp'
 import XEUtils from 'xe-utils'
 import { VxeUI } from '../../ui'
 import { getCellHeight, convertHeaderColumnToRows } from './util'
@@ -9,7 +10,7 @@ const { renderer, renderEmptyElement } = VxeUI
 
 const renderType = 'header'
 
-export default defineComponent({
+export default defineVxeComponent({
   name: 'VxeTableHeader',
   props: {
     tableData: Array as PropType<any[]>,

package/packages/table/src/props.ts

@@ -159,11 +159,20 @@ export default {
   },
 
   /** 高级属性 */
-  // （即将废弃）columnKey 已废弃，被 column-config.useKey 替换
+  /**
+   * （即将废弃）columnKey 已废弃，被 column-config.useKey 替换
+   * @deprecated
+   */
   columnKey: Boolean as PropType<VxeTablePropTypes.ColumnKey>,
-  // （即将废弃）rowKey 已废弃，被 row-config.useKey 替换
+  /**
+   * （即将废弃）rowKey 已废弃，被 row-config.useKey 替换
+   * @deprecated
+   */
   rowKey: Boolean as PropType<VxeTablePropTypes.RowKey>,
-  // （即将废弃）rowId 已废弃，被 row-config.keyField 替换
+  /**
+   * （即将废弃）rowId 已废弃，被 row-config.keyField 替换
+   * @deprecated
+   */
   rowId: {
     type: String as PropType<VxeTablePropTypes.RowId>,
     default: () => getConfig().table.rowId
@@ -200,11 +209,17 @@ export default {
   rowConfig: Object as PropType<VxeTablePropTypes.RowConfig>,
   // 数据聚合配置项
   aggregateConfig: Object as PropType<VxeTablePropTypes.AggregateConfig>,
-  //  已废弃，被 aggregateConfig 替换
+  /**
+   * 已废弃，被 aggregateConfig 替换
+   * @deprecated
+   */
   rowGroupConfig: Object as PropType<VxeTablePropTypes.RowGroupConfig>,
   // 当前行配置项
   currentRowConfig: Object as PropType<VxeTablePropTypes.CurrentRowConfig>,
-  // 已废弃，被 rowDragConfig 替换
+  /**
+   * 已废弃，被 rowDragConfig 替换
+   * @deprecated
+   */
   dragConfig: Object as PropType<VxeTablePropTypes.DragConfig>,
   // 行拖拽排序配置项
   rowDragConfig: Object as PropType<VxeTablePropTypes.RowDragConfig>,
@@ -258,9 +273,15 @@ export default {
   emptyRender: Object as PropType<VxeTablePropTypes.EmptyRender>,
   // 自定义列配置项
   customConfig: Object as PropType<VxeTablePropTypes.CustomConfig>,
-  // （即将废弃）横向虚拟滚动配置项
+  /**
+   * （即将废弃）横向虚拟滚动配置项
+   * @deprecated
+   */
   scrollX: Object as PropType<VxeTablePropTypes.ScrollX>,
-  // （即将废弃）纵向虚拟滚动配置项
+  /**
+   * （即将废弃）纵向虚拟滚动配置项
+   * @deprecated
+   */
   scrollY: Object as PropType<VxeTablePropTypes.ScrollY>,
   // 横向虚拟滚动配置项
   virtualXConfig: Object as PropType<VxeTablePropTypes.VirtualXConfig>,

package/packages/table/src/table.ts

@@ -1,4 +1,5 @@
-import { defineComponent, h, ComponentPublicInstance, reactive, ref, Ref, provide, inject, nextTick, onActivated, onDeactivated, onBeforeUnmount, onUnmounted, watch, computed, onMounted } from 'vue'
+import { h, ComponentPublicInstance, reactive, ref, Ref, provide, inject, nextTick, onActivated, onDeactivated, onBeforeUnmount, onUnmounted, watch, computed, onMounted } from 'vue'
+import { defineVxeComponent } from '../../ui/src/comp'
 import XEUtils from 'xe-utils'
 import { initTpImg, getTpImg, isPx, isScale, hasClass, addClass, removeClass, getEventTargetNode, getPaddingTopBottomSize, setScrollTop, setScrollLeft, toCssUnit, hasControlKey } from '../../ui/src/dom'
 import { getLastZIndex, nextZIndex, hasChildrenList, getFuncText, isEnableConf, formatText, eqEmptyValue } from '../../ui/src/utils'
@@ -28,7 +29,7 @@ const customStorageKey = 'VXE_CUSTOM_STORE'
 const maxYHeight = 5e6
 const maxXWidth = 5e6
 
-export default defineComponent({
+export default defineVxeComponent({
   name: 'VxeTable',
   props: tableProps,
   emits: tableEmits,
@@ -247,6 +248,7 @@ export default defineComponent({
 
       isRowGroupStatus: false,
       rowGroupList: [],
+      aggHandleFields: [],
 
       rowGroupExpandedFlag: 1,
       rowExpandedFlag: 1,
@@ -769,22 +771,15 @@ export default defineComponent({
     })
 
     const computeTableRowExpandedList = computed(() => {
-      const { treeConfig } = props
-      const { rowExpandedFlag, expandColumn, rowGroupExpandedFlag, treeExpandedFlag, isRowGroupStatus } = reactData
+      const { rowExpandedFlag, expandColumn, rowGroupExpandedFlag, treeExpandedFlag } = reactData
       const { visibleDataRowIdData, rowExpandedMaps } = internalData
-      const treeOpts = computeTreeOpts.value
-      const { transform } = treeOpts
       const expandList: any[] = []
       if (expandColumn && rowExpandedFlag && rowGroupExpandedFlag && treeExpandedFlag) {
-        if (isRowGroupStatus || (treeConfig && transform)) {
-          XEUtils.each(rowExpandedMaps, (row, rowid) => {
-            if (visibleDataRowIdData[rowid]) {
-              expandList.push(row)
-            }
-          })
-        } else {
-          return XEUtils.values(rowExpandedMaps)
-        }
+        XEUtils.each(rowExpandedMaps, (row, rowid) => {
+          if (visibleDataRowIdData[rowid]) {
+            expandList.push(row)
+          }
+        })
       }
       return expandList
     })
@@ -866,6 +861,19 @@ export default defineComponent({
       return rowGroupOpts.groupFields
     })
 
+    const computeRowGroupColumns = computed(() => {
+      const { rowGroupList } = reactData
+      const { fullColumnFieldData } = internalData
+      const rgColumns: VxeTableDefines.ColumnInfo[] = []
+      rowGroupList.forEach(aggConf => {
+        const colRest = fullColumnFieldData[aggConf.field]
+        if (colRest) {
+          rgColumns.push(colRest.column)
+        }
+      })
+      return rgColumns
+    })
+
     const refMaps: VxeTablePrivateRef = {
       refElem,
       refTooltip,
@@ -954,6 +962,8 @@ export default defineComponent({
       computeIsMaxFixedColumn,
       computeIsAllCheckboxDisabled,
       computeVirtualScrollBars,
+      computeRowGroupFields,
+      computeRowGroupColumns,
 
       computeSXOpts,
       computeSYOpts
@@ -990,6 +1000,10 @@ export default defineComponent({
       internalData.isCurrDeepKey = hasDeepKey(keyField)
     }
 
+    const hangleStorageDefaultValue = (value: boolean | null | undefined, isAll: boolean) => {
+      return XEUtils.isBoolean(value) ? value : isAll
+    }
+
     const getNextSortOrder = (column: VxeTableDefines.ColumnInfo) => {
       const sortOpts = computeSortOpts.value
       const { orders = [] } = sortOpts
@@ -1523,13 +1537,13 @@ export default defineComponent({
       const { customConfig } = props
       const tableId = computeTableId.value
       const customOpts = computeCustomOpts.value
-      const { storage, restoreStore } = customOpts
+      const { storage, restoreStore, storeOptions } = customOpts
       const isAllCustom = storage === true
-      const storageOpts: VxeTableDefines.VxeTableCustomStorageObj = isAllCustom ? {} : Object.assign({}, storage || {})
-      const isCustomResizable = isAllCustom || storageOpts.resizable
-      const isCustomVisible = isAllCustom || storageOpts.visible
-      const isCustomFixed = isAllCustom || storageOpts.fixed
-      const isCustomSort = isAllCustom || storageOpts.sort
+      const storageOpts: VxeTableDefines.VxeTableCustomStorageObj = isAllCustom ? {} : Object.assign({}, storage || {}, storeOptions)
+      const isCustomResizable = hangleStorageDefaultValue(storageOpts.resizable, isAllCustom)
+      const isCustomVisible = hangleStorageDefaultValue(storageOpts.visible, isAllCustom)
+      const isCustomFixed = hangleStorageDefaultValue(storageOpts.fixed, isAllCustom)
+      const isCustomSort = hangleStorageDefaultValue(storageOpts.sort, isAllCustom)
       if ((customConfig ? isEnableConf(customOpts) : customOpts.enabled) && (isCustomResizable || isCustomVisible || isCustomFixed || isCustomSort)) {
         if (!tableId) {
           errLog('vxe.error.reqProp', ['id'])
@@ -3135,13 +3149,18 @@ export default defineComponent({
     }
 
     const handleUpdateRowGroup = (groupFields?: string[]) => {
-      reactData.rowGroupList = groupFields
-        ? (XEUtils.isArray(groupFields) ? groupFields : [groupFields]).map(field => {
-            return {
-              field
-            }
+      const aggFields: string[] = []
+      const aggConfs: { field: string }[] = []
+      if (groupFields) {
+        (XEUtils.isArray(groupFields) ? groupFields : [groupFields]).forEach(field => {
+          aggFields.push(field)
+          aggConfs.push({
+            field
           })
-        : []
+        })
+      }
+      reactData.rowGroupList = aggConfs
+      reactData.aggHandleFields = aggFields
     }
 
     const handleeGroupSummary = (aggList: VxeTableDefines.AggregateRowInfo[]) => {
@@ -3323,9 +3342,9 @@ export default defineComponent({
       internalData.cvCacheMaps = {}
       reactData.isRowLoading = true
       reactData.scrollVMLoading = false
-      internalData.treeExpandedMaps = {}
+      // internalData.treeExpandedMaps = {}
       reactData.treeExpandedFlag++
-      internalData.rowExpandedMaps = {}
+      // internalData.rowExpandedMaps = {}
       reactData.rowExpandedFlag++
       internalData.insertRowMaps = {}
       reactData.insertRowFlag++
@@ -4072,7 +4091,7 @@ export default defineComponent({
     const handleUpdateResize = () => {
       const el = refElem.value
       if (el && el.clientWidth && el.clientHeight) {
-        tableMethods.recalculate()
+        $xeTable.recalculate()
       }
     }
 
@@ -6715,13 +6734,13 @@ export default defineComponent({
         const { id } = props
         const customOpts = computeCustomOpts.value
         const { collectColumn } = internalData
-        const { storage, checkMethod } = customOpts
+        const { storage, checkMethod, storeOptions } = customOpts
         const isAllCustom = storage === true
-        const storageOpts: VxeTableDefines.VxeTableCustomStorageObj = isAllCustom ? {} : Object.assign({}, storage || {})
-        const isCustomResizable = isAllCustom || storageOpts.resizable
-        const isCustomVisible = isAllCustom || storageOpts.visible
-        const isCustomFixed = isAllCustom || storageOpts.fixed
-        const isCustomSort = isAllCustom || storageOpts.sort
+        const storageOpts: VxeTableDefines.VxeTableCustomStorageObj = isAllCustom ? {} : Object.assign({}, storage || {}, storeOptions)
+        const isCustomResizable = hangleStorageDefaultValue(storageOpts.resizable, isAllCustom)
+        const isCustomVisible = hangleStorageDefaultValue(storageOpts.visible, isAllCustom)
+        const isCustomFixed = hangleStorageDefaultValue(storageOpts.fixed, isAllCustom)
+        const isCustomSort = hangleStorageDefaultValue(storageOpts.sort, isAllCustom)
         const resizableData: Record<string, number> = {}
         const sortData: Record<string, number> = {}
         const visibleData: Record<string, boolean> = {}
@@ -8204,13 +8223,13 @@ export default defineComponent({
         const { customConfig } = props
         const tableId = computeTableId.value
         const customOpts = computeCustomOpts.value
-        const { updateStore, storage } = customOpts
+        const { updateStore, storage, storeOptions } = customOpts
         const isAllCustom = storage === true
-        const storageOpts: VxeTableDefines.VxeTableCustomStorageObj = isAllCustom ? {} : Object.assign({}, storage || {})
-        const isCustomResizable = isAllCustom || storageOpts.resizable
-        const isCustomVisible = isAllCustom || storageOpts.visible
-        const isCustomFixed = isAllCustom || storageOpts.fixed
-        const isCustomSort = isAllCustom || storageOpts.sort
+        const storageOpts: VxeTableDefines.VxeTableCustomStorageObj = isAllCustom ? {} : Object.assign({}, storage || {}, storeOptions)
+        const isCustomResizable = hangleStorageDefaultValue(storageOpts.resizable, isAllCustom)
+        const isCustomVisible = hangleStorageDefaultValue(storageOpts.visible, isAllCustom)
+        const isCustomFixed = hangleStorageDefaultValue(storageOpts.fixed, isAllCustom)
+        const isCustomSort = hangleStorageDefaultValue(storageOpts.sort, isAllCustom)
         if (type !== 'reset') {
           // fix：修复拖动列宽，重置按钮无法点击的问题
           reactData.isCustomStatus = true
@@ -10687,14 +10706,15 @@ export default defineComponent({
 
     const renderEmptyBody = () => {
       const emptyOpts = computeEmptyOpts.value
-      const params = { $table: $xeTable }
-      if (slots.empty) {
-        return slots.empty(params)
+      const emptySlot = slots.empty
+      const emptyParams = { $table: $xeTable, $grid: $xeGrid }
+      if (emptySlot) {
+        return emptySlot(emptyParams)
       } else {
         const compConf = emptyOpts.name ? renderer.get(emptyOpts.name) : null
         const rtEmptyView = compConf ? (compConf.renderTableEmpty || compConf.renderTableEmptyView || compConf.renderEmpty) : null
         if (rtEmptyView) {
-          return getSlotVNs(rtEmptyView(emptyOpts, params))
+          return getSlotVNs(rtEmptyView(emptyOpts, emptyParams))
         }
       }
       return getFuncText(props.emptyText) || getI18n('vxe.table.emptyText')