vxe-table 4.14.0-beta.0 → 4.14.0-beta.10

package/packages/table/src/body.ts

@@ -1,4 +1,4 @@
-import { TransitionGroup, h, ref, Ref, PropType, inject, nextTick, onMounted, onUnmounted } from 'vue'
+import { 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'
@@ -28,7 +28,7 @@ export default defineVxeComponent({
     const $xeTable = inject('$xeTable', {} as VxeTableConstructor & VxeTablePrivateMethods)
 
     const { xID, props: tableProps, context: tableContext, reactData: tableReactData, internalData: tableInternalData } = $xeTable
-    const { computeEditOpts, computeMouseOpts, computeCellOffsetWidth, computeAreaOpts, computeDefaultRowHeight, computeEmptyOpts, computeTooltipOpts, computeRadioOpts, computeExpandOpts, computeTreeOpts, computeCheckboxOpts, computeCellOpts, computeValidOpts, computeRowOpts, computeColumnOpts, computeRowDragOpts, computeColumnDragOpts, computeResizableOpts, computeVirtualXOpts, computeVirtualYOpts } = $xeTable.getComputeMaps()
+    const { computeEditOpts, computeMouseOpts, computeCellOffsetWidth, computeAreaOpts, computeDefaultRowHeight, computeEmptyOpts, computeTooltipOpts, computeRadioOpts, computeExpandOpts, computeTreeOpts, computeCheckboxOpts, computeCellOpts, computeValidOpts, computeRowOpts, computeColumnOpts, computeRowDragOpts, computeResizableOpts, computeVirtualXOpts, computeVirtualYOpts } = $xeTable.getComputeMaps()
 
     const refElem = ref() as Ref<HTMLDivElement>
     const refBodyScroll = ref() as Ref<HTMLDivElement>
@@ -47,7 +47,7 @@ export default defineVxeComponent({
     }
 
     const renderLine = (rowid: string, params: VxeTableDefines.CellRenderBodyParams, cellHeight: number): VxeComponentSlotType[] => {
-      const { row, column } = params
+      const { column } = params
       const { afterFullData } = tableInternalData
       const { treeConfig } = tableProps
       const treeOpts = computeTreeOpts.value
@@ -72,7 +72,7 @@ export default defineVxeComponent({
             h('div', {
               class: 'vxe-tree--line',
               style: {
-                height: `${$xeTable.eqRow(afterFullData[0], row) ? 1 : calcTreeLine(params, prevRow)}px`,
+                height: `${getRowid($xeTable, afterFullData[0]) === rowid ? 1 : calcTreeLine(params, prevRow)}px`,
                 bottom: `-${Math.floor(cellHeight / 2)}px`,
                 left: `${(rLevel * treeOpts.indent) + (rLevel ? 2 - getOffsetSize($xeTable) : 0) + 16}px`
               }
@@ -330,6 +330,8 @@ export default defineVxeComponent({
         tcStyle.minHeight = `${cellHeight}px`
       }
 
+      // console.log(lastScrollTime)
+
       const tdVNs: VxeComponentSlotType[] = []
       if (fixedHiddenColumn && isAllOverflow) {
         tdVNs.push(
@@ -364,7 +366,7 @@ export default defineVxeComponent({
                 h('div', {
                   colid,
                   rowid,
-                  class: 'vxe-cell--wrapper'
+                  class: 'vxe-cell--wrapper vxe-body-cell--wrapper'
                 }, column.renderCell(cellParams))
               ])
         )
@@ -434,7 +436,7 @@ export default defineVxeComponent({
 
       return h('td', {
         class: [
-          'vxe-body--column',
+          'vxe-table--column vxe-body--column',
           colid,
           cellVerticalAlign ? `col--vertical-${cellVerticalAlign}` : '',
           cellAlign ? `col--${cellAlign}` : '',
@@ -474,7 +476,7 @@ export default defineVxeComponent({
       const $xeGrid = $xeTable.xeGrid
 
       const { stripe, rowKey, highlightHoverRow, rowClassName, rowStyle, editConfig, treeConfig } = tableProps
-      const { hasFixedColumn, treeExpandedFlag, isColLoading, scrollXLoad, scrollYLoad, isAllOverflow, rowExpandedFlag, expandColumn, selectRadioRow, pendingRowFlag, isDragColMove, rowExpandHeightFlag, isRowGroupStatus } = tableReactData
+      const { hasFixedColumn, treeExpandedFlag, scrollXLoad, scrollYLoad, isAllOverflow, rowExpandedFlag, expandColumn, selectRadioRow, pendingRowFlag, rowExpandHeightFlag, isRowGroupStatus } = tableReactData
       const { fullAllDataRowIdData, fullColumnIdData, treeExpandedMaps, pendingRowMaps, rowExpandedMaps } = tableInternalData
       const checkboxOpts = computeCheckboxOpts.value
       const radioOpts = computeRadioOpts.value
@@ -482,7 +484,6 @@ export default defineVxeComponent({
       const editOpts = computeEditOpts.value
       const rowOpts = computeRowOpts.value
       const columnOpts = computeColumnOpts.value
-      const columnDragOpts = computeColumnDragOpts.value
       const { transform, seqMode } = treeOpts
       const childrenField = treeOpts.children || treeOpts.childrenField
       const rows: any[] = []
@@ -562,25 +563,13 @@ export default defineVxeComponent({
           return renderTdColumn(seq, rowid, fixedType, isOptimizeMode, rowLevel, row, rowIndex, $rowIndex, _rowIndex, column, $columnIndex, tableColumn, tableData)
         })
         rows.push(
-          !isColLoading && (columnOpts.drag && columnDragOpts.animation)
-            ? h(TransitionGroup, {
-              name: `vxe-header--col-list${isDragColMove ? '' : '-disabled'}`,
-              tag: 'tr',
-              class: trClass,
-              rowid: rowid,
-              style: rowStyle ? (XEUtils.isFunction(rowStyle) ? rowStyle(params) : rowStyle) : null,
-              key: rowKey || scrollXLoad || scrollYLoad || rowOpts.useKey || rowOpts.drag || columnOpts.drag || isRowGroupStatus || treeConfig ? rowid : $rowIndex,
-              ...trOn
-            }, {
-              default: () => tdVNs
-            })
-            : h('tr', {
-              class: trClass,
-              rowid: rowid,
-              style: rowStyle ? (XEUtils.isFunction(rowStyle) ? rowStyle(params) : rowStyle) : null,
-              key: rowKey || scrollXLoad || scrollYLoad || rowOpts.useKey || rowOpts.drag || columnOpts.drag || isRowGroupStatus || treeConfig ? rowid : $rowIndex,
-              ...trOn
-            }, tdVNs)
+          h('tr', {
+            class: trClass,
+            rowid: rowid,
+            style: rowStyle ? (XEUtils.isFunction(rowStyle) ? rowStyle(params) : rowStyle) : null,
+            key: rowKey || scrollXLoad || scrollYLoad || rowOpts.useKey || rowOpts.drag || columnOpts.drag || isRowGroupStatus || treeConfig ? rowid : $rowIndex,
+            ...trOn
+          }, tdVNs)
         )
         // 如果行被展开了
         if (isExpandRow) {
@@ -715,12 +704,10 @@ export default defineVxeComponent({
 
       const { fixedColumn, fixedType, tableColumn } = props
       const { spanMethod, footerSpanMethod, mouseConfig } = tableProps
-      const { isGroup, tableData, isRowLoading, isColLoading, overflowX, scrollXLoad, scrollYLoad, isAllOverflow, isDragRowMove, expandColumn, dragRow, dragCol } = tableReactData
+      const { isGroup, tableData, isColLoading, overflowX, scrollXLoad, scrollYLoad, isAllOverflow, expandColumn, dragRow, dragCol } = tableReactData
       const { visibleColumn, fullAllDataRowIdData, fullColumnIdData } = tableInternalData
-      const rowOpts = computeRowOpts.value
       const emptyOpts = computeEmptyOpts.value
       const mouseOpts = computeMouseOpts.value
-      const rowDragOpts = computeRowDragOpts.value
       const expandOpts = computeExpandOpts.value
 
       let renderDataList = tableData
@@ -860,17 +847,9 @@ export default defineVxeComponent({
             /**
              * 内容
              */
-            !(isRowLoading || isColLoading) && (rowOpts.drag && rowDragOpts.animation)
-              ? h(TransitionGroup, {
-                ref: refBodyTBody,
-                name: `vxe-body--row-list${isDragRowMove ? '' : '-disabled'}`,
-                tag: 'tbody'
-              }, {
-                default: () => renderRows(fixedType, isOptimizeMode, renderDataList, renderColumnList)
-              })
-              : h('tbody', {
-                ref: refBodyTBody
-              }, renderRows(fixedType, isOptimizeMode, renderDataList, renderColumnList))
+            h('tbody', {
+              ref: refBodyTBody
+            }, renderRows(fixedType, isOptimizeMode, renderDataList, renderColumnList))
           ]),
           h('div', {
             class: 'vxe-table--checkbox-range'

package/packages/table/src/cell.ts

@@ -189,7 +189,7 @@ function renderTitleContent (params: VxeTableDefines.CellRenderHeaderParams & {
   const { showHeaderOverflow } = column
   const tooltipOpts = computeTooltipOpts.value
   const showAllTip = tooltipOpts.showAll
-  const headOverflow = XEUtils.isUndefined(showHeaderOverflow) || XEUtils.isNull(showHeaderOverflow) ? allColumnHeaderOverflow : showHeaderOverflow
+  const headOverflow = XEUtils.eqNull(showHeaderOverflow) ? allColumnHeaderOverflow : showHeaderOverflow
   const showTitle = headOverflow === 'title'
   const showTooltip = headOverflow === true || headOverflow === 'tooltip'
   const ons: Record<string, any> = {}

package/packages/table/src/columnInfo.ts

@@ -47,6 +47,11 @@ export class ColumnInfo {
         }
       }
     }
+    if (_vm.aggFunc) {
+      if (!$xeTable.handlePivotTableAggregateData && _vm.aggFunc !== true) {
+        errLog('vxe.error.errProp', [`column.agg-func=${_vm.aggFunc}`, 'column.agg-func=true'])
+      }
+    }
 
     Object.assign(this, {
       // 基本属性

package/packages/table/src/footer.ts

@@ -1,9 +1,9 @@
-import { TransitionGroup, h, ref, Ref, PropType, inject, nextTick, onMounted, onUnmounted } from 'vue'
+import { 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'
-import { getCellHeight } from './util'
+import { getCalcHeight } from './util'
 
 import type { VxeTablePrivateMethods, VxeTableConstructor, VxeTableMethods, VxeTableDefines } from '../../../types'
 
@@ -35,7 +35,7 @@ export default defineVxeComponent({
     const $xeTable = inject('$xeTable', {} as VxeTableConstructor & VxeTableMethods & VxeTablePrivateMethods)
 
     const { xID, props: tableProps, reactData: tableReactData, internalData: tableInternalData } = $xeTable
-    const { computeTooltipOpts, computeColumnOpts, computeColumnDragOpts, computeCellOpts, computeFooterCellOpts, computeDefaultRowHeight, computeResizableOpts, computeVirtualXOpts } = $xeTable.getComputeMaps()
+    const { computeTooltipOpts, computeColumnOpts, computeCellOpts, computeFooterCellOpts, computeDefaultRowHeight, computeResizableOpts, computeVirtualXOpts } = $xeTable.getComputeMaps()
 
     const refElem = ref() as Ref<HTMLDivElement>
     const refFooterScroll = ref() as Ref<HTMLDivElement>
@@ -49,7 +49,7 @@ export default defineVxeComponent({
 
       const { fixedType } = props
       const { resizable: allResizable, border, footerCellClassName, footerCellStyle, footerAlign: allFooterAlign, footerSpanMethod, align: allAlign, columnKey, showFooterOverflow: allColumnFooterOverflow } = tableProps
-      const { scrollXLoad, scrollYLoad, overflowX, currentColumn } = tableReactData
+      const { scrollXLoad, scrollYLoad, overflowX, currentColumn, mergeFootFlag } = tableReactData
       const { fullColumnIdData, mergeFooterList, mergeFooterCellMaps, scrollXStore } = tableInternalData
       const virtualXOpts = computeVirtualXOpts.value
       const tooltipOpts = computeTooltipOpts.value
@@ -59,7 +59,7 @@ export default defineVxeComponent({
       const defaultRowHeight = computeDefaultRowHeight.value
       const cellOpts = computeCellOpts.value
       const footerCellOpts = computeFooterCellOpts.value
-      const currCellHeight = getCellHeight(footerCellOpts.height) || defaultRowHeight
+      const currCellHeight = getCalcHeight(footerCellOpts.height) || defaultRowHeight
 
       return tableColumn.map((column, $columnIndex) => {
         const { type, showFooterOverflow, footerAlign, align, footerClassName, editRender, cellRender } = column
@@ -126,7 +126,7 @@ export default defineVxeComponent({
         }
         let isMergeCell = false
         // 合并行或列
-        if (mergeFooterList.length) {
+        if (mergeFootFlag && mergeFooterList.length) {
           const spanRest = mergeFooterCellMaps[`${_rowIndex}:${_columnIndex}`]
           if (spanRest) {
             const { rowspan, colspan } = spanRest
@@ -173,7 +173,7 @@ export default defineVxeComponent({
         }
 
         return h('td', {
-          class: ['vxe-footer--column', column.id, {
+          class: ['vxe-table--column vxe-footer--column', column.id, {
             [`col--${footAlign}`]: footAlign,
             [`col--${type}`]: type,
             'col--last': isLastColumn,
@@ -200,7 +200,7 @@ export default defineVxeComponent({
             : [
                 h('div', {
                   colid,
-                  class: 'vxe-cell--wrapper'
+                  class: 'vxe-cell--wrapper vxe-footer-cell--wrapper'
                 }, column.renderFooter(cellParams))
               ]),
           /**
@@ -222,28 +222,11 @@ export default defineVxeComponent({
     const renderHeads = (isOptimizeMode: boolean, renderColumnList: VxeTableDefines.ColumnInfo[]) => {
       const { fixedType, footerTableData } = props
       const { footerRowClassName, footerRowStyle } = tableProps
-      const { isColLoading, isDragColMove } = tableReactData
-      const columnOpts = computeColumnOpts.value
-      const columnDragOpts = computeColumnDragOpts.value
 
       return footerTableData.map((row, $rowIndex) => {
         const _rowIndex = $rowIndex
         const rowParams = { $table: $xeTable, row, _rowIndex, $rowIndex, fixed: fixedType, type: renderType }
 
-        if (!isColLoading && columnOpts.drag && columnDragOpts.animation) {
-          return h(TransitionGroup, {
-            key: $rowIndex,
-            name: `vxe-header--col-list${isDragColMove ? '' : '-disabled'}`,
-            tag: 'tr',
-            class: [
-              'vxe-footer--row',
-              footerRowClassName ? XEUtils.isFunction(footerRowClassName) ? footerRowClassName(rowParams) : footerRowClassName : ''
-            ],
-            style: footerRowStyle ? (XEUtils.isFunction(footerRowStyle) ? footerRowStyle(rowParams) : footerRowStyle) : null
-          }, {
-            default: () => renderRows(isOptimizeMode, renderColumnList, footerTableData, row, $rowIndex, _rowIndex)
-          })
-        }
         return h('tr', {
           key: $rowIndex,
           class: [

package/packages/table/src/header.ts

@@ -1,8 +1,8 @@
-import { TransitionGroup, h, ref, Ref, PropType, inject, nextTick, watch, onMounted, onUnmounted } from 'vue'
+import { 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'
+import { getCalcHeight, convertHeaderColumnToRows } from './util'
 
 import type { VxeTablePrivateMethods, VxeTableConstructor, VxeTableMethods, VxeTableDefines, VxeColumnPropTypes } from '../../../types'
 
@@ -56,7 +56,7 @@ export default defineVxeComponent({
       const cellOpts = computeCellOpts.value
       const defaultRowHeight = computeDefaultRowHeight.value
       const headerCellOpts = computeHeaderCellOpts.value
-      const currCellHeight = getCellHeight(headerCellOpts.height) || defaultRowHeight
+      const currCellHeight = getCalcHeight(headerCellOpts.height) || defaultRowHeight
       const { disabledMethod: dragDisabledMethod, isCrossDrag, isPeerDrag } = columnDragOpts
 
       return cols.map((column, $columnIndex) => {
@@ -146,7 +146,7 @@ export default defineVxeComponent({
         }
 
         return h('th', {
-          class: ['vxe-header--column', colid, {
+          class: ['vxe-table--column vxe-header--column', colid, {
             [`col--${headAlign}`]: headAlign,
             [`col--${type}`]: type,
             'col--last': isLastColumn,
@@ -183,7 +183,7 @@ export default defineVxeComponent({
             : [
                 h('div', {
                   colid,
-                  class: 'vxe-cell--wrapper'
+                  class: 'vxe-cell--wrapper vxe-header-cell--wrapper'
                 }, column.renderHeader(cellParams))
               ]),
           /**
@@ -203,27 +203,10 @@ export default defineVxeComponent({
     const renderHeads = (isGroup: boolean, isOptimizeMode: boolean, headerGroups: VxeTableDefines.ColumnInfo[][]) => {
       const { fixedType } = props
       const { headerRowClassName, headerRowStyle } = tableProps
-      const { isColLoading, isDragColMove } = tableReactData
-      const columnOpts = computeColumnOpts.value
-      const columnDragOpts = computeColumnDragOpts.value
 
       return headerGroups.map((cols, $rowIndex) => {
         const params = { $table: $xeTable, $rowIndex, fixed: fixedType, type: renderType }
 
-        if (!isColLoading && columnOpts.drag && columnDragOpts.animation) {
-          return h(TransitionGroup, {
-            key: $rowIndex,
-            name: `vxe-header--col-list${isDragColMove ? '' : '-disabled'}`,
-            tag: 'tr',
-            class: [
-              'vxe-header--row',
-              headerRowClassName ? (XEUtils.isFunction(headerRowClassName) ? headerRowClassName(params) : headerRowClassName) : ''
-            ],
-            style: headerRowStyle ? (XEUtils.isFunction(headerRowStyle) ? headerRowStyle(params) : headerRowStyle) : null
-          }, {
-            default: () => renderRows(isGroup, isOptimizeMode, cols, $rowIndex)
-          })
-        }
         return h('tr', {
           key: $rowIndex,
           class: [