vxe-table 4.15.5 → 4.15.7

package/packages/table/src/table.ts

@@ -12,14 +12,23 @@ import Cell from './cell'
 import TableBodyComponent from './body'
 import TableHeaderComponent from './header'
 import TableFooterComponent from './footer'
-import tableProps from './props'
-import tableEmits from './emits'
+import { tableProps } from './props'
+import { tableEmits } from './emits'
 import TableCustomPanelComponent from '../module/custom/panel'
 import TableFilterPanelComponent from '../module/filter/panel'
 import TableImportPanelComponent from '../module/export/import-panel'
 import TableExportPanelComponent from '../module/export/export-panel'
 import TableMenuPanelComponent from '../module/menu/panel'
 
+import '../module/filter/hook'
+import '../module/menu/hook'
+import '../module/edit/hook'
+import '../module/export/hook'
+import '../module/keyboard/hook'
+import '../module/validator/hook'
+import '../module/custom/hook'
+import '../render'
+
 import type { VxeTooltipInstance, VxeTabsConstructor, VxeTabsPrivateMethods, ValueOf, VxeComponentSlotType } from 'vxe-pc-ui'
 import type { VxeGridConstructor, VxeGridPrivateMethods, VxeTableConstructor, TableReactData, VxeTablePropTypes, VxeToolbarConstructor, TablePrivateMethods, VxeTablePrivateRef, VxeTablePrivateComputed, VxeTablePrivateMethods, TableMethods, VxeTableMethods, VxeTableDefines, VxeTableEmits, VxeTableProps, VxeColumnPropTypes, VxeTableCustomPanelConstructor } from '../../../types'
 
@@ -95,6 +104,8 @@ export default defineVxeComponent({
       rowGroupColumn: null,
       // 展开列信息
       expandColumn: null,
+      checkboxColumn: null,
+      radioColumn: null,
       // 树节点列信息
       treeNodeColumn: null,
       hasFixedColumn: false,
@@ -350,6 +361,7 @@ export default defineVxeComponent({
     const refScrollYSpaceElem = ref<HTMLDivElement>()
 
     const $xeGrid = inject<(VxeGridConstructor & VxeGridPrivateMethods) | null>('$xeGrid', null)
+    const $xeGantt = inject('$xeGantt', null)
     let $xeToolbar: VxeToolbarConstructor
 
     const computeTableId = computed(() => {
@@ -901,6 +913,9 @@ export default defineVxeComponent({
       getComputeMaps: () => computeMaps,
 
       xeGrid: $xeGrid,
+      xeGantt: $xeGantt,
+
+      // 已废弃
       xegrid: $xeGrid
     } as unknown as VxeTableConstructor & VxeTableMethods & VxeTablePrivateMethods
 
@@ -1696,6 +1711,8 @@ export default defineVxeComponent({
       reactData.rowGroupColumn = rowGroupColumn
       reactData.treeNodeColumn = treeNodeColumn
       reactData.expandColumn = expandColumn
+      reactData.checkboxColumn = checkboxColumn
+      reactData.radioColumn = radioColumn
       reactData.isAllOverflow = isAllOverflow
     }
 
@@ -2264,53 +2281,71 @@ export default defineVxeComponent({
     const updateStyle = () => {
       const { showHeaderOverflow: allColumnHeaderOverflow, showFooterOverflow: allColumnFooterOverflow, mouseConfig, spanMethod, footerSpanMethod } = props
       const { isGroup, currentRow, tableColumn, scrollXLoad, scrollYLoad, overflowX, scrollbarWidth, overflowY, scrollbarHeight, scrollXWidth, columnStore, editStore, isAllOverflow, expandColumn, isColLoading } = reactData
-      const { visibleColumn, tableHeight, headerHeight, footerHeight, elemStore, customHeight, customMinHeight, customMaxHeight } = internalData
+      const { visibleColumn, tableHeight, elemStore, customHeight, customMinHeight, customMaxHeight, tHeaderHeight, tFooterHeight } = internalData
+      const $xeGanttView = internalData.xeGanttView
       const el = refElem.value
-      if (!el) {
+      if (!el || !el.clientHeight) {
         return
       }
       const containerList = ['main', 'left', 'right']
-      const osbWidth = overflowY ? scrollbarWidth : 0
-      const osbHeight = overflowX ? scrollbarHeight : 0
+      let osbWidth = overflowY ? scrollbarWidth : 0
+      let osbHeight = overflowX ? scrollbarHeight : 0
       const emptyPlaceholderElem = refEmptyPlaceholder.value
+      const scrollbarOpts = computeScrollbarOpts.value
       const mouseOpts = computeMouseOpts.value
       const expandOpts = computeExpandOpts.value
       const bodyWrapperElem = getRefElem(elemStore['main-body-wrapper'])
       const bodyTableElem = getRefElem(elemStore['main-body-table'])
       if (emptyPlaceholderElem) {
-        emptyPlaceholderElem.style.top = `${headerHeight}px`
+        emptyPlaceholderElem.style.top = `${tHeaderHeight}px`
         emptyPlaceholderElem.style.height = bodyWrapperElem ? `${bodyWrapperElem.offsetHeight - osbHeight}px` : ''
       }
 
-      let bodyHeight = 0
+      const scrollbarXToTop = computeScrollbarXToTop.value
+      const scrollbarYToLeft = computeScrollbarYToLeft.value
+
+      let xScrollbarVisible = overflowX ? 'visible' : 'hidden'
+      if ($xeGanttView) {
+        osbHeight = scrollbarHeight
+        xScrollbarVisible = 'visible'
+      } else if (scrollbarOpts.x && scrollbarOpts.x.visible === false) {
+        osbHeight = 0
+        xScrollbarVisible = 'hidden'
+      }
+
+      let yScrollbarVisible = overflowY ? 'visible' : 'hidden'
+      if ((scrollbarOpts.y && scrollbarOpts.y.visible === false) || ($xeGanttView && !scrollbarYToLeft)) {
+        osbWidth = 0
+        yScrollbarVisible = 'hidden'
+      }
+
+      let tbHeight = 0
       let bodyMaxHeight = 0
-      const bodyMinHeight = customMinHeight - headerHeight - footerHeight - osbHeight
+      const bodyMinHeight = customMinHeight - tHeaderHeight - tFooterHeight - osbHeight
       if (customMaxHeight) {
-        bodyMaxHeight = Math.max(bodyMinHeight, customMaxHeight - headerHeight - footerHeight - osbHeight)
+        bodyMaxHeight = Math.max(bodyMinHeight, customMaxHeight - tHeaderHeight - tFooterHeight - osbHeight)
       }
       if (customHeight) {
-        bodyHeight = customHeight - headerHeight - footerHeight - osbHeight
+        tbHeight = customHeight - tHeaderHeight - tFooterHeight - osbHeight
       }
-      if (!bodyHeight) {
+      if (!tbHeight) {
         if (bodyTableElem) {
-          bodyHeight = bodyTableElem.clientHeight
+          tbHeight = bodyTableElem.clientHeight
         }
       }
-      if (bodyHeight) {
+      if (tbHeight) {
         if (bodyMaxHeight) {
-          bodyHeight = Math.min(bodyMaxHeight, bodyHeight)
+          tbHeight = Math.min(bodyMaxHeight, tbHeight)
         }
-        bodyHeight = Math.max(bodyMinHeight, bodyHeight)
+        tbHeight = Math.max(bodyMinHeight, tbHeight)
       }
 
-      const scrollbarXToTop = computeScrollbarXToTop.value
-
       const xLeftCornerEl = refScrollXLeftCornerElem.value
       const xRightCornerEl = refScrollXRightCornerElem.value
       const scrollXVirtualEl = refScrollXVirtualElem.value
       if (scrollXVirtualEl) {
         scrollXVirtualEl.style.height = `${osbHeight}px`
-        scrollXVirtualEl.style.visibility = overflowX ? 'visible' : 'hidden'
+        scrollXVirtualEl.style.visibility = xScrollbarVisible
       }
       const xWrapperEl = refScrollXWrapperElem.value
       if (xWrapperEl) {
@@ -2329,32 +2364,34 @@ export default defineVxeComponent({
       const scrollYVirtualEl = refScrollYVirtualElem.value
       if (scrollYVirtualEl) {
         scrollYVirtualEl.style.width = `${osbWidth}px`
-        scrollYVirtualEl.style.height = `${bodyHeight + headerHeight + footerHeight}px`
-        scrollYVirtualEl.style.visibility = overflowY ? 'visible' : 'hidden'
+        scrollYVirtualEl.style.height = `${tbHeight + tHeaderHeight + tFooterHeight}px`
+        scrollYVirtualEl.style.visibility = yScrollbarVisible
       }
       const yTopCornerEl = refScrollYTopCornerElem.value
       if (yTopCornerEl) {
-        yTopCornerEl.style.height = `${headerHeight}px`
-        yTopCornerEl.style.display = overflowY && headerHeight ? 'block' : ''
+        yTopCornerEl.style.height = `${tHeaderHeight}px`
+        yTopCornerEl.style.display = overflowY && tHeaderHeight ? 'block' : ''
       }
       const yWrapperEl = refScrollYWrapperElem.value
       if (yWrapperEl) {
-        yWrapperEl.style.height = `${bodyHeight}px`
-        yWrapperEl.style.top = `${headerHeight}px`
+        yWrapperEl.style.height = `${tbHeight}px`
+        yWrapperEl.style.top = `${tHeaderHeight}px`
       }
       const yBottomCornerEl = refScrollYBottomCornerElem.value
       if (yBottomCornerEl) {
-        yBottomCornerEl.style.height = `${footerHeight}px`
-        yBottomCornerEl.style.top = `${headerHeight + bodyHeight}px`
-        yBottomCornerEl.style.display = overflowY && footerHeight ? 'block' : ''
+        yBottomCornerEl.style.height = `${tFooterHeight}px`
+        yBottomCornerEl.style.top = `${tHeaderHeight + tbHeight}px`
+        yBottomCornerEl.style.display = overflowY && tFooterHeight ? 'block' : ''
       }
 
       const rowExpandEl = refRowExpandElem.value
       if (rowExpandEl) {
-        rowExpandEl.style.height = `${bodyHeight}px`
-        rowExpandEl.style.top = `${headerHeight}px`
+        rowExpandEl.style.height = `${tbHeight}px`
+        rowExpandEl.style.top = `${tHeaderHeight}px`
       }
 
+      internalData.tBodyHeight = tbHeight
+
       containerList.forEach((name, index) => {
         const fixedType = index > 0 ? name : ''
         const layoutList = ['header', 'body', 'footer']
@@ -2420,7 +2457,7 @@ export default defineVxeComponent({
             }
 
             if (currScrollElem) {
-              currScrollElem.style.height = `${headerHeight}px`
+              currScrollElem.style.height = `${tHeaderHeight}px`
             }
 
             if (tableElem) {
@@ -2429,16 +2466,16 @@ export default defineVxeComponent({
           } else if (layout === 'body') {
             if (currScrollElem) {
               currScrollElem.style.maxHeight = customMaxHeight ? `${bodyMaxHeight}px` : ''
-              currScrollElem.style.height = customHeight ? `${bodyHeight}px` : ''
+              currScrollElem.style.height = customHeight ? `${tbHeight}px` : ''
               currScrollElem.style.minHeight = `${bodyMinHeight}px`
             }
 
             // 如果是固定列
             if (fixedWrapperElem) {
               if (wrapperElem) {
-                wrapperElem.style.top = `${headerHeight}px`
+                wrapperElem.style.top = `${tHeaderHeight}px`
               }
-              fixedWrapperElem.style.height = `${customHeight > 0 ? customHeight : (tableHeight + headerHeight + footerHeight + osbHeight)}px`
+              fixedWrapperElem.style.height = `${customHeight > 0 ? customHeight : (tableHeight + tHeaderHeight + tFooterHeight + osbHeight)}px`
               fixedWrapperElem.style.width = `${fixedColumn.reduce((previous, column) => previous + column.renderWidth, 0)}px`
             }
 
@@ -2521,11 +2558,11 @@ export default defineVxeComponent({
             }
 
             if (currScrollElem) {
-              currScrollElem.style.height = `${footerHeight}px`
+              currScrollElem.style.height = `${tFooterHeight}px`
               // 如果是固定列
               if (fixedWrapperElem) {
                 if (wrapperElem) {
-                  wrapperElem.style.top = `${customHeight > 0 ? customHeight - footerHeight - osbHeight : tableHeight + headerHeight}px`
+                  wrapperElem.style.top = `${customHeight > 0 ? customHeight - tFooterHeight - osbHeight : tableHeight + tHeaderHeight}px`
                 }
               }
             }
@@ -2541,6 +2578,9 @@ export default defineVxeComponent({
       if (mouseConfig && mouseOpts.selected && editStore.selected.row && editStore.selected.column) {
         $xeTable.addCellSelectedClass()
       }
+      if ($xeGanttView) {
+        $xeGanttView.handleUpdateStyle()
+      }
       return nextTick()
     }
 
@@ -3126,14 +3166,13 @@ export default defineVxeComponent({
           reactData.scrollbarHeight = scrollbarOpts.height || (xHandleEl.offsetHeight - xHandleEl.clientHeight) || 14
         }
 
-        const headerHeight = headerTableElem ? headerTableElem.clientHeight : 0
-        const footerHeight = footerTableElem ? footerTableElem.clientHeight : 0
+        const hHeight = headerTableElem ? headerTableElem.clientHeight : 0
+        const fHeight = footerTableElem ? footerTableElem.clientHeight : 0
         internalData.tableHeight = bodyWrapperElem.offsetHeight
-        internalData.headerHeight = headerHeight
-        internalData.footerHeight = footerHeight
-
+        internalData.tHeaderHeight = hHeight
+        internalData.tFooterHeight = fHeight
         reactData.overflowX = overflowX
-        reactData.parentHeight = Math.max(internalData.headerHeight + footerHeight + 20, $xeTable.getParentHeight())
+        reactData.parentHeight = Math.max(hHeight + fHeight + 20, $xeTable.getParentHeight())
       }
       if (overflowX) {
         $xeTable.checkScrolling()
@@ -3188,6 +3227,7 @@ export default defineVxeComponent({
 
     const handleLazyRecalculate = (reFull: boolean, reWidth: boolean, reHeight: boolean) => {
       return new Promise<void>(resolve => {
+        const $xeGanttView = internalData.xeGanttView
         const { rceTimeout, rceRunTime } = internalData
         const resizeOpts = computeResizeOpts.value
         const refreshDelay = resizeOpts.refreshDelay || 20
@@ -3212,6 +3252,9 @@ export default defineVxeComponent({
             handleRecalculateStyle(reFull, reWidth, reHeight)
           )
         }
+        if ($xeGanttView) {
+          $xeGanttView.handleLazyRecalculate()
+        }
         internalData.rceTimeout = setTimeout(() => {
           internalData.rceTimeout = undefined
           handleRecalculateStyle(reFull, reWidth, reHeight)
@@ -3219,6 +3262,10 @@ export default defineVxeComponent({
       })
     }
 
+    const handleResizeEvent = () => {
+      handleLazyRecalculate(true, true, true)
+    }
+
     const handleUpdateAggValues = () => {
       const { visibleColumn } = internalData
       const aggCols: VxeTableDefines.ColumnInfo[] = []
@@ -4103,13 +4150,13 @@ export default defineVxeComponent({
     }
 
     const checkLastSyncScroll = (isRollX: boolean, isRollY: boolean) => {
-      const { scrollXLoad, scrollYLoad, isAllOverflow } = reactData
       const { lcsTimeout } = internalData
       reactData.lazScrollLoading = true
       if (lcsTimeout) {
         clearTimeout(lcsTimeout)
       }
       internalData.lcsTimeout = setTimeout(() => {
+        const { scrollXLoad, scrollYLoad, isAllOverflow } = reactData
         internalData.lcsRunTime = Date.now()
         internalData.lcsTimeout = undefined
         internalData.intoRunScroll = false
@@ -4187,6 +4234,18 @@ export default defineVxeComponent({
       requestAnimationFrame(step)
     }
 
+    const syncGanttScrollTop = (scrollTop: number) => {
+      const $xeGanttView = internalData.xeGanttView
+      if ($xeGanttView) {
+        const ganttInternalData = $xeGanttView.internalData
+        const { elemStore: ganttElemStore } = ganttInternalData
+        const ganttBodyScrollElem = getRefElem(ganttElemStore['main-body-scroll'])
+        if (ganttBodyScrollElem) {
+          ganttBodyScrollElem.scrollTop = scrollTop
+        }
+      }
+    }
+
     const dispatchEvent = (type: ValueOf<VxeTableEmits>, params: Record<string, any>, evnt: Event | null) => {
       emit(type, createEvent(evnt, { $table: $xeTable, $grid: $xeGrid }, params))
     }
@@ -7070,11 +7129,18 @@ export default defineVxeComponent({
         internalData.isActivated = false
         return nextTick()
       },
+      /**
+       * 已废弃，被 connectToolbar 替换
+       * @deprecated
+       */
+      connect ($toolbar) {
+        return $xeTable.connectToolbar($toolbar)
+      },
       /**
        * 连接工具栏
        * @param $toolbar
        */
-      connect ($toolbar) {
+      connectToolbar ($toolbar) {
         if ($toolbar) {
           $xeToolbar = $toolbar
           $xeToolbar.syncUpdate({ collectColumn: internalData.collectColumn, $table: $xeTable })
@@ -7633,7 +7699,7 @@ export default defineVxeComponent({
       if (!el || !el.clientWidth) {
         return
       }
-      handleLazyRecalculate(true, true, true)
+      handleResizeEvent()
       $xeTable.updateCellAreas()
     }
 
@@ -7989,6 +8055,7 @@ export default defineVxeComponent({
       handleTableData (force?: boolean) {
         const { scrollYLoad } = reactData
         const { scrollYStore, fullDataRowIdData } = internalData
+        const $xeGanttView = internalData.xeGanttView
         let fullList: any[] = internalData.afterFullData
         // 是否进行数据处理
         if (force) {
@@ -8009,6 +8076,9 @@ export default defineVxeComponent({
         })
         reactData.tableData = tableData
         internalData.visibleDataRowIdData = visibleDataRowIdMaps
+        if ($xeGanttView) {
+          $xeGanttView.updateViewData()
+        }
         return nextTick()
       },
       /**
@@ -9080,8 +9150,8 @@ export default defineVxeComponent({
        * 如果是双击模式，则单击后选中状态
        */
       triggerCellClickEvent (evnt, params) {
-        const { highlightCurrentRow, highlightCurrentColumn, editConfig } = props
-        const { editStore, isDragResize } = reactData
+        const { treeConfig, highlightCurrentRow, highlightCurrentColumn, editConfig, aggregateConfig, rowGroupConfig } = props
+        const { editStore, isDragResize, expandColumn, checkboxColumn, radioColumn } = reactData
         if (isDragResize) {
           return
         }
@@ -9110,15 +9180,15 @@ export default defineVxeComponent({
         params = Object.assign({ cell, triggerRadio, triggerCheckbox, triggerTreeNode, triggerExpandNode }, params)
         if (!triggerCheckbox && !triggerRadio) {
           // 如果是展开行
-          if (!triggerExpandNode && (expandOpts.trigger === 'row' || (isExpandType && expandOpts.trigger === 'cell'))) {
+          if (!triggerExpandNode && ((expandColumn && expandOpts.trigger === 'row') || (isExpandType && expandOpts.trigger === 'cell'))) {
             $xeTable.triggerRowExpandEvent(evnt, params)
           }
           // 如果是树形表格
-          if ((treeOpts.trigger === 'row' || (treeNode && treeOpts.trigger === 'cell'))) {
+          if (treeConfig && (treeOpts.trigger === 'row' || (treeNode && treeOpts.trigger === 'cell'))) {
             $xeTable.triggerTreeExpandEvent(evnt, params)
           }
           // 如果是行分组
-          if ((aggregateOpts.trigger === 'row' || (rowGroupNode && aggregateOpts.trigger === 'cell'))) {
+          if ((aggregateConfig || rowGroupConfig) && (aggregateOpts.trigger === 'row' || (rowGroupNode && aggregateOpts.trigger === 'cell'))) {
             $xeTable.triggerRowGroupExpandEvent(evnt, params)
           }
         }
@@ -9138,11 +9208,11 @@ export default defineVxeComponent({
               }
             }
             // 如果是单选框
-            if (!triggerRadio && (radioOpts.trigger === 'row' || (isRadioType && radioOpts.trigger === 'cell'))) {
+            if (!triggerRadio && ((radioColumn && radioOpts.trigger === 'row') || (isRadioType && radioOpts.trigger === 'cell'))) {
               $xeTable.triggerRadioRowEvent(evnt, params)
             }
             // 如果是复选框
-            if (!triggerCheckbox && (checkboxOpts.trigger === 'row' || (isCheckboxType && checkboxOpts.trigger === 'cell'))) {
+            if (!triggerCheckbox && ((checkboxColumn && checkboxOpts.trigger === 'row') || (isCheckboxType && checkboxOpts.trigger === 'cell'))) {
               $xeTable.handleToggleCheckRowEvent(evnt, params)
             }
           }
@@ -10534,6 +10604,7 @@ export default defineVxeComponent({
           }
           setScrollTop(yHandleEl, scrollTop)
           setScrollTop(rowExpandEl, scrollTop)
+          syncGanttScrollTop(scrollTop)
           if (scrollYLoad) {
             $xeTable.triggerScrollYEvent(evnt)
           }
@@ -10727,6 +10798,7 @@ export default defineVxeComponent({
             setScrollTop(leftScrollElem, currTopNum)
             setScrollTop(rightScrollElem, currTopNum)
             setScrollTop(rowExpandEl, currTopNum)
+            syncGanttScrollTop(currTopNum)
             if (scrollYLoad) {
               $xeTable.triggerScrollYEvent(evnt)
             }
@@ -10743,6 +10815,7 @@ export default defineVxeComponent({
               setScrollTop(leftScrollElem, currTopNum)
               setScrollTop(rightScrollElem, currTopNum)
               setScrollTop(rowExpandEl, currTopNum)
+              syncGanttScrollTop(currTopNum)
               if (scrollYLoad) {
                 $xeTable.triggerScrollYEvent(evnt)
               }
@@ -10817,6 +10890,7 @@ export default defineVxeComponent({
         setScrollTop(leftScrollElem, scrollTop)
         setScrollTop(rightScrollElem, scrollTop)
         setScrollTop(rowExpandEl, scrollTop)
+        syncGanttScrollTop(scrollTop)
         if (scrollYLoad) {
           $xeTable.triggerScrollYEvent(evnt)
         }
@@ -10856,6 +10930,7 @@ export default defineVxeComponent({
       updateScrollXSpace () {
         const { scrollXLoad, overflowX, scrollXWidth } = reactData
         const { visibleColumn, scrollXStore, elemStore, fullColumnIdData } = internalData
+        const $xeGanttView = internalData.xeGanttView
         const mouseOpts = computeMouseOpts.value
         const tableBody = refTableBody.value
         const tableBodyElem = tableBody ? tableBody.$el as HTMLDivElement : null
@@ -10924,10 +10999,13 @@ export default defineVxeComponent({
             scrollXSpaceEl.style.width = `${ySpaceWidth}px`
           }
 
+          calcScrollbar()
           if (isScrollXBig && mouseOpts.area) {
             errLog('vxe.error.notProp', ['mouse-config.area'])
           }
-          calcScrollbar()
+          if ($xeGanttView) {
+            $xeGanttView.updateScrollXSpace()
+          }
           return nextTick().then(() => {
             updateStyle()
           })
@@ -10937,6 +11015,7 @@ export default defineVxeComponent({
       updateScrollYSpace () {
         const { isAllOverflow, overflowY, scrollYLoad, expandColumn } = reactData
         const { scrollYStore, elemStore, isResizeCellHeight, afterFullData, fullAllDataRowIdData, rowExpandedMaps } = internalData
+        const $xeGanttView = internalData.xeGanttView
         const { startIndex } = scrollYStore
         const mouseOpts = computeMouseOpts.value
         const expandOpts = computeExpandOpts.value
@@ -11034,10 +11113,13 @@ export default defineVxeComponent({
         reactData.scrollYHeight = scrollYHeight
         reactData.isScrollYBig = isScrollYBig
 
+        calcScrollbar()
         if (isScrollYBig && mouseOpts.area) {
           errLog('vxe.error.notProp', ['mouse-config.area'])
         }
-        calcScrollbar()
+        if ($xeGanttView) {
+          $xeGanttView.updateScrollYSpace()
+        }
         return nextTick().then(() => {
           updateStyle()
         })
@@ -11140,6 +11222,13 @@ export default defineVxeComponent({
           return getRowid($xeTable, row1) === getRowid($xeTable, row2)
         }
         return false
+      },
+      handleConnectGanttView ($ganttView) {
+        if ($ganttView && $ganttView.connectUpdate) {
+          $ganttView.connectUpdate({ $table: $xeTable })
+          internalData.xeGanttView = $ganttView as any
+        }
+        return nextTick()
       }
     }
 
@@ -12211,7 +12300,7 @@ export default defineVxeComponent({
           const parentEl = tablePrivateMethods.getParentElem()
           resizeObserver = globalResize.create(() => {
             if (props.autoResize) {
-              tableMethods.recalculate(true)
+              handleResizeEvent()
             }
           })
           if (el) {

package/packages/table/src/util.ts

@@ -36,10 +36,6 @@ export function createInternalData (): TableInternalData {
     tableWidth: 0,
     // 表格高度
     tableHeight: 0,
-    // 表头高度
-    headerHeight: 0,
-    // 表尾高度
-    footerHeight: 0,
     customHeight: 0,
     customMinHeight: 0,
     customMaxHeight: 0,
@@ -119,6 +115,13 @@ export function createInternalData (): TableInternalData {
 
     cvCacheMaps: {},
 
+    // 表头高度
+    tHeaderHeight: 0,
+    // 表体高度
+    tBodyHeight: 0,
+    // 表尾高度
+    tFooterHeight: 0,
+
     inited: false,
     tooltipTimeout: null,
     initStatus: false,

package/packages/toolbar/src/toolbar.ts

@@ -310,7 +310,7 @@ export default defineVxeComponent({
             $xeGrid.triggerToolbarBtnEvent(item, $event)
           } else {
             const gCommandOpts = commands.get(code)
-            const params = { code, button: item, $table: $table!, $grid: $xeGrid, $event }
+            const params = { code, button: item, $table: $table as VxeTableConstructor, $grid: $xeGrid, $gantt: null, $event }
             if (gCommandOpts) {
               const tCommandMethod = gCommandOpts.tableCommandMethod || gCommandOpts.commandMethod
               if (tCommandMethod) {
@@ -336,7 +336,7 @@ export default defineVxeComponent({
             $xeGrid.triggerToolbarTolEvent(item, $event)
           } else {
             const gCommandOpts = commands.get(code)
-            const params = { code, button: null, tool: item, $table: $table!, $grid: $xeGrid, $event }
+            const params = { code, button: null, tool: item, $table: $table as VxeTableConstructor, $grid: $xeGrid, $gantt: null, $event }
             if (gCommandOpts) {
               const tCommandMethod = gCommandOpts.tableCommandMethod || gCommandOpts.commandMethod
               if (tCommandMethod) {

package/packages/ui/index.ts

@@ -239,7 +239,15 @@ VxeUI.setConfig({
     },
     scrollbarConfig: {
       // width: 14,
-      // height: 14
+      // height: 14,
+      x: {
+        // position: 'bottom',
+        visible: true
+      },
+      y: {
+        // position: 'right',
+        visible: true
+      }
     }
   },
   // export: {
@@ -292,7 +300,9 @@ VxeUI.setConfig({
     //   types: ['csv', 'html', 'xml', 'txt']
     // },
     // buttons: []
-  }
+  },
+
+  gantt: {}
 })
 
 const iconPrefix = 'vxe-table-icon-'

package/packages/ui/src/dom.ts

@@ -100,7 +100,7 @@ export function getDomNode () {
   }
 }
 
-export function getOffsetHeight (elem: HTMLElement) {
+export function getOffsetHeight (elem?: HTMLElement) {
   return elem ? elem.offsetHeight : 0
 }