vxe-gantt 3.0.27 → 3.1.0

package/lib/ui/index.js

@@ -15,7 +15,7 @@ var _log = require("./src/log");
 var setConfig = _core.VxeUI.setConfig,
   setIcon = _core.VxeUI.setIcon,
   checkVersion = _core.VxeUI.checkVersion;
-_core.VxeUI.ganttVersion = "3.0.27";
+_core.VxeUI.ganttVersion = "3.1.0";
 setConfig({
   gantt: {
     // size: null,

package/lib/ui/index.min.js

@@ -1 +1 @@
-Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"VxeUI",{enumerable:!0,get:function(){return _core.VxeUI}}),exports.default=void 0;var _core=require("@vxe-ui/core"),_log=require("./src/log"),setConfig=_core.VxeUI.setConfig,setIcon=_core.VxeUI.setIcon,checkVersion=_core.VxeUI.checkVersion,iconPrefix=(_core.VxeUI.ganttVersion="3.0.27",setConfig({gantt:{formConfig:{enabled:!0},pagerConfig:{enabled:!0},toolbarConfig:{enabled:!0},proxyConfig:{enabled:!0,autoLoad:!0,showLoading:!0,showResponseMsg:!0,showActionMsg:!0,response:{list:null,result:"result",total:"page.total",message:"message"}},taskViewScaleConfig:{week:{startDay:1}},taskViewConfig:{showNowLine:!0},taskSplitConfig:{enabled:!0,resize:!0,showCollapseTableButton:!0,showCollapseTaskButton:!0}}}),"vxe-icon-"),pVersion=(setIcon({GANTT_VIEW_LEFT_OPEN:iconPrefix+"arrow-left",GANTT_VIEW_LEFT_CLOSE:iconPrefix+"arrow-right",GANTT_VIEW_RIGHT_OPEN:iconPrefix+"arrow-right",GANTT_VIEW_RIGHT_CLOSE:iconPrefix+"arrow-left"}),3),sVersion=18,_default=(checkVersion?checkVersion(_core.VxeUI.tableVersion,pVersion,sVersion)||(0,_log.errLog)("vxe.error.errorVersion",["vxe-table@".concat(_core.VxeUI.tableVersion||"?"),"vxe-table v".concat(pVersion,".").concat(sVersion,"+")]):(0,_log.errLog)("Requires vxe-table v".concat(pVersion,".").concat(sVersion,"+")),exports.default=_core.VxeUI);
+Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"VxeUI",{enumerable:!0,get:function(){return _core.VxeUI}}),exports.default=void 0;var _core=require("@vxe-ui/core"),_log=require("./src/log"),setConfig=_core.VxeUI.setConfig,setIcon=_core.VxeUI.setIcon,checkVersion=_core.VxeUI.checkVersion,iconPrefix=(_core.VxeUI.ganttVersion="3.1.0",setConfig({gantt:{formConfig:{enabled:!0},pagerConfig:{enabled:!0},toolbarConfig:{enabled:!0},proxyConfig:{enabled:!0,autoLoad:!0,showLoading:!0,showResponseMsg:!0,showActionMsg:!0,response:{list:null,result:"result",total:"page.total",message:"message"}},taskViewScaleConfig:{week:{startDay:1}},taskViewConfig:{showNowLine:!0},taskSplitConfig:{enabled:!0,resize:!0,showCollapseTableButton:!0,showCollapseTaskButton:!0}}}),"vxe-icon-"),pVersion=(setIcon({GANTT_VIEW_LEFT_OPEN:iconPrefix+"arrow-left",GANTT_VIEW_LEFT_CLOSE:iconPrefix+"arrow-right",GANTT_VIEW_RIGHT_OPEN:iconPrefix+"arrow-right",GANTT_VIEW_RIGHT_CLOSE:iconPrefix+"arrow-left"}),3),sVersion=18,_default=(checkVersion?checkVersion(_core.VxeUI.tableVersion,pVersion,sVersion)||(0,_log.errLog)("vxe.error.errorVersion",["vxe-table@".concat(_core.VxeUI.tableVersion||"?"),"vxe-table v".concat(pVersion,".").concat(sVersion,"+")]):(0,_log.errLog)("Requires vxe-table v".concat(pVersion,".").concat(sVersion,"+")),exports.default=_core.VxeUI);

package/lib/ui/src/log.js

@@ -6,6 +6,6 @@ Object.defineProperty(exports, "__esModule", {
 exports.warnLog = exports.errLog = void 0;
 var _core = require("@vxe-ui/core");
 var log = _core.VxeUI.log;
-var version = "gantt v".concat("3.0.27");
+var version = "gantt v".concat("3.1.0");
 var warnLog = exports.warnLog = log.create('warn', version);
 var errLog = exports.errLog = log.create('error', version);

package/lib/ui/src/log.min.js

@@ -1 +1 @@
-Object.defineProperty(exports,"__esModule",{value:!0}),exports.warnLog=exports.errLog=void 0;var _core=require("@vxe-ui/core"),log=_core.VxeUI.log,version="gantt v".concat("3.0.27"),warnLog=exports.warnLog=log.create("warn",version),errLog=exports.errLog=log.create("error",version);
+Object.defineProperty(exports,"__esModule",{value:!0}),exports.warnLog=exports.errLog=void 0;var _core=require("@vxe-ui/core"),log=_core.VxeUI.log,version="gantt v".concat("3.1.0"),warnLog=exports.warnLog=log.create("warn",version),errLog=exports.errLog=log.create("error",version);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vxe-gantt",
-  "version": "3.0.27",
+  "version": "3.1.0",
   "description": "A vue based gantt component",
   "scripts": {
     "update": "npm install --legacy-peer-deps",
@@ -64,8 +64,8 @@
     "vue": "~2.6.14",
     "vue-i18n": "^8.15.1",
     "vue-router": "^3.5.1",
-    "vxe-pc-ui": "^3.10.42",
-    "vxe-table": "^3.19.25"
+    "vxe-pc-ui": "^3.10.43",
+    "vxe-table": "^3.19.26"
   },
   "vetur": {
     "tags": "helper/vetur/tags.json",

package/packages/gantt/src/gantt-header.ts

@@ -70,9 +70,10 @@ export default defineVxeComponent({
               })
             })),
             h('thead', {}, headerGroups.map(({ scaleItem, columns }, $rowIndex) => {
-              const { type, titleMethod, headerCellStyle, slots } = scaleItem
+              const { type, titleFormat, titleMethod, headerCellStyle, slots } = scaleItem
               const titleSlot = slots ? slots.title : null
-              const todayValue = showNowLine && $rowIndex === headerGroups.length - 1 ? todayDateMaps[type] : null
+              const isLast = $rowIndex === headerGroups.length - 1
+              const todayValue = isLast && showNowLine ? todayDateMaps[type] : null
               return h('tr', {
                 key: $rowIndex
               }, columns.map((column, cIndex) => {
@@ -84,6 +85,10 @@ export default defineVxeComponent({
                   } else {
                     label = getI18n(`vxe.gantt.${!$rowIndex && headerGroups.length > 1 ? 'tFullFormat' : 'tSimpleFormat'}.${type}`, dateObj)
                   }
+                } else {
+                  if (isLast && scaleItem.type === 'week') {
+                    label = getI18n(`vxe.gantt.tSimpleFormat.${type}`, dateObj)
+                  }
                 }
                 let cellVNs: string | VxeComponentSlotType[] = label
                 const ctParams = { source: sourceType, type: viewType, column, scaleObj: scaleItem, title: label, dateObj: dateObj, $rowIndex }
@@ -91,6 +96,8 @@ export default defineVxeComponent({
                   cellVNs = $xeGantt.callSlot(titleSlot, ctParams, h)
                 } else if (titleMethod) {
                   cellVNs = `${titleMethod(ctParams)}`
+                } else if (titleFormat) {
+                  cellVNs = XEUtils.toDateString(dateObj.date, titleFormat)
                 }
                 let cellStys = {}
                 if (headerCellStyle) {

package/packages/gantt/src/gantt-view.ts

@@ -2,7 +2,7 @@ import { VNode, CreateElement } from 'vue'
 import { defineVxeComponent } from '../../ui/src/comp'
 import { VxeUI } from '@vxe-ui/core'
 import { setScrollTop, setScrollLeft, removeClass, addClass } from '../../ui/src/dom'
-import { getRefElem } from './util'
+import { getRefElem, getStandardGapTime } from './util'
 import XEUtils from 'xe-utils'
 import GanttViewHeaderComponent from './gantt-header'
 import GanttViewBodyComponent from './gantt-body'
@@ -14,6 +14,8 @@ import type { VxeGanttViewConstructor, GanttViewReactData, VxeGanttDefines, VxeG
 const { globalEvents } = VxeUI
 
 const sourceType = 'gantt'
+const minuteMs = 1000 * 60
+const dayMs = minuteMs * 60 * 24
 
 function createInternalData (): GanttViewInternalData {
   return {
@@ -76,41 +78,19 @@ function updateTodayData ($xeGanttView: VxeGanttViewConstructor & VxeGanttViewPr
   }
 }
 
-function handleParseColumn ($xeGanttView: VxeGanttViewConstructor & VxeGanttViewPrivateMethods) {
+function handleColumnHeader ($xeGanttView: VxeGanttViewConstructor & VxeGanttViewPrivateMethods) {
   const $xeGantt = $xeGanttView.$xeGantt
-  const reactData = $xeGanttView.reactData
-  const internalData = $xeGanttView.internalData
 
-  const ganttProps = $xeGantt
   const ganttReactData = $xeGantt.reactData
-  const { treeConfig } = ganttProps
   const { taskScaleList } = ganttReactData
-  const { minViewDate, maxViewDate } = reactData
-  const minScale = XEUtils.last(taskScaleList)
+  const scaleUnit = $xeGantt.computeScaleUnit
+  const minScale = $xeGantt.computeMinScale
+  const weekScale = $xeGantt.computeWeekScale
+  const scaleDateList = $xeGanttView.computeScaleDateList
   const fullCols: VxeGanttDefines.ViewColumn[] = []
   const groupCols: VxeGanttDefines.GroupColumn[] = []
-  if (minScale && minViewDate && maxViewDate) {
-    const minSType = minScale.type
-    const weekScale = taskScaleList.find(item => item.type === 'week')
-    let gapTime = 1000 * 60 * 60 * 24
-    switch (minScale.type) {
-      case 'hour':
-        gapTime = 1000 * 60 * 60
-        break
-      case 'minute':
-        gapTime = 1000 * 60
-        break
-      case 'second':
-        gapTime = 1000
-        break
-      default: {
-        break
-      }
-    }
-    const currTime = minViewDate.getTime()
-    const diffDayNum = maxViewDate.getTime() - minViewDate.getTime()
-    const countSize = Math.max(5, Math.floor(diffDayNum / gapTime) + 1)
 
+  if (minScale && scaleUnit && scaleDateList.length) {
     const renderListMaps: Record<VxeGanttDefines.ColumnScaleType, VxeGanttDefines.ViewColumn[]> = {
       year: [],
       quarter: [],
@@ -136,7 +116,7 @@ function handleParseColumn ($xeGanttView: VxeGanttViewConstructor & VxeGanttView
     }
 
     const handleData = (type: VxeGanttDefines.ColumnScaleType, colMaps: Record<VxeGanttDefines.ColumnScaleType, VxeGanttDefines.ViewColumn>, minCol: VxeGanttDefines.ViewColumn) => {
-      if (minSType === type) {
+      if (minScale.type === type) {
         return
       }
       const currCol = colMaps[type]
@@ -154,14 +134,15 @@ function handleParseColumn ($xeGanttView: VxeGanttViewConstructor & VxeGanttView
         currGpCol.children.push(minCol)
       }
     }
-    for (let i = 0; i < countSize; i++) {
-      const itemDate = new Date(currTime + (i * gapTime))
+
+    for (let i = 0; i < scaleDateList.length; i++) {
+      const itemDate = scaleDateList[i]
       const [yyyy, MM, dd, HH, mm, ss] = XEUtils.toDateString(itemDate, 'yyyy-M-d-H-m-s').split('-')
       const e = itemDate.getDay()
       const E = e + 1
       const q = Math.ceil((itemDate.getMonth() + 1) / 3)
       const W = XEUtils.getYearWeek(itemDate, weekScale ? weekScale.startDay : undefined)
-      const dateObj: VxeGanttDefines.ScaleDateObj = { yy: yyyy, M: MM, d: dd, H: HH, m: mm, s: ss, q, W, E, e }
+      const dateObj: VxeGanttDefines.ScaleDateObj = { date: itemDate, yy: yyyy, M: MM, d: dd, H: HH, m: mm, s: ss, q, W, E, e }
       const colMaps: Record<VxeGanttDefines.ColumnScaleType, VxeGanttDefines.ViewColumn> = {
         year: {
           field: yyyy,
@@ -209,7 +190,7 @@ function handleParseColumn ($xeGanttView: VxeGanttViewConstructor & VxeGanttView
           dateObj
         }
       }
-      const minCol = colMaps[minSType]
+      const minCol = colMaps[minScale.type]
       if (minScale.level < 19) {
         handleData('year', colMaps, minCol)
       }
@@ -239,7 +220,7 @@ function handleParseColumn ($xeGanttView: VxeGanttViewConstructor & VxeGanttView
     }
 
     taskScaleList.forEach(scaleItem => {
-      if (scaleItem.type === minSType) {
+      if (scaleItem.type === minScale.type) {
         groupCols.push({
           scaleItem,
           columns: fullCols
@@ -258,7 +239,221 @@ function handleParseColumn ($xeGanttView: VxeGanttViewConstructor & VxeGanttView
         columns: list
       })
     })
+  }
+
+  return {
+    fullCols,
+    groupCols
+  }
+}
+
+function createChartRender ($xeGanttView: VxeGanttViewConstructor & VxeGanttViewPrivateMethods, fullCols: VxeGanttDefines.ViewColumn[]) {
+  const $xeGantt = $xeGanttView.$xeGantt
+  const reactData = $xeGanttView.reactData
+
+  const { minViewDate } = reactData
+  const minScale = $xeGantt.computeMinScale
+  const scaleUnit = $xeGantt.computeScaleUnit
+  const weekScale = $xeGantt.computeWeekScale
+  switch (scaleUnit) {
+    case 'year': {
+      const indexMaps: Record<string, number> = {}
+      fullCols.forEach(({ dateObj }, i) => {
+        const yyyyMM = XEUtils.toDateString(dateObj.date, 'yyyy')
+        indexMaps[yyyyMM] = i
+      })
+      return (startValue: any, endValue: any) => {
+        const startDate = parseStringDate($xeGanttView, startValue)
+        const endDate = parseStringDate($xeGanttView, endValue)
+        const startStr = XEUtils.toDateString(startDate, 'yyyy')
+        const startFirstDate = XEUtils.getWhatYear(startDate, 0, 'first')
+        const endStr = XEUtils.toDateString(endDate, 'yyyy')
+        const endFirstDate = XEUtils.getWhatYear(endDate, 0, 'first')
+        const dateSize = Math.floor((XEUtils.getWhatYear(endDate, 1, 'first').getTime() - endFirstDate.getTime()) / dayMs)
+        const subtract = (startDate.getTime() - startFirstDate.getTime()) / dayMs / dateSize
+        const addSize = Math.max(0, (endDate.getTime() - endFirstDate.getTime()) / dayMs + 1) / dateSize
+        const offsetLeftSize = (indexMaps[startStr] || 0) + subtract
+        return {
+          offsetLeftSize,
+          offsetWidthSize: (indexMaps[endStr] || 0) - offsetLeftSize + addSize
+        }
+      }
+    }
+    case 'quarter': {
+      const indexMaps: Record<string, number> = {}
+      fullCols.forEach(({ dateObj }, i) => {
+        const q = XEUtils.toDateString(dateObj.date, 'yyyy-q')
+        indexMaps[q] = i
+      })
+      return (startValue: any, endValue: any) => {
+        const startDate = parseStringDate($xeGanttView, startValue)
+        const endDate = parseStringDate($xeGanttView, endValue)
+        const startStr = XEUtils.toDateString(startDate, 'yyyy-q')
+        const startFirstDate = XEUtils.getWhatQuarter(startDate, 0, 'first')
+        const endStr = XEUtils.toDateString(endDate, 'yyyy-q')
+        const endFirstDate = XEUtils.getWhatQuarter(endDate, 0, 'first')
+        const dateSize = Math.floor((XEUtils.getWhatQuarter(endDate, 1, 'first').getTime() - endFirstDate.getTime()) / dayMs)
+        const subtract = (startDate.getTime() - startFirstDate.getTime()) / dayMs / dateSize
+        const addSize = Math.max(0, (endDate.getTime() - endFirstDate.getTime()) / dayMs + 1) / dateSize
+        const offsetLeftSize = (indexMaps[startStr] || 0) + subtract
+        return {
+          offsetLeftSize,
+          offsetWidthSize: (indexMaps[endStr] || 0) - offsetLeftSize + addSize
+        }
+      }
+    }
+    case 'month': {
+      const indexMaps: Record<string, number> = {}
+      fullCols.forEach(({ dateObj }, i) => {
+        const yyyyMM = XEUtils.toDateString(dateObj.date, 'yyyy-MM')
+        indexMaps[yyyyMM] = i
+      })
+      return (startValue: any, endValue: any) => {
+        const startDate = parseStringDate($xeGanttView, startValue)
+        const endDate = parseStringDate($xeGanttView, endValue)
+        const startStr = XEUtils.toDateString(startDate, 'yyyy-MM')
+        const startFirstDate = XEUtils.getWhatMonth(startDate, 0, 'first')
+        const endStr = XEUtils.toDateString(endDate, 'yyyy-MM')
+        const endFirstDate = XEUtils.getWhatMonth(endDate, 0, 'first')
+        const dateSize = Math.floor((XEUtils.getWhatMonth(endDate, 1, 'first').getTime() - endFirstDate.getTime()) / dayMs)
+        const subtract = (startDate.getTime() - startFirstDate.getTime()) / dayMs / dateSize
+        const addSize = Math.max(0, (endDate.getTime() - endFirstDate.getTime()) / dayMs + 1) / dateSize
+        const offsetLeftSize = (indexMaps[startStr] || 0) + subtract
+        return {
+          offsetLeftSize,
+          offsetWidthSize: (indexMaps[endStr] || 0) - offsetLeftSize + addSize
+        }
+      }
+    }
+    case 'week': {
+      const indexMaps: Record<string, number> = {}
+      fullCols.forEach(({ dateObj }, i) => {
+        const yyyyW = XEUtils.toDateString(dateObj.date, 'yyyy-W', { firstDay: weekScale ? weekScale.startDay : undefined })
+        indexMaps[yyyyW] = i
+      })
+      return (startValue: any, endValue: any) => {
+        const startDate = parseStringDate($xeGanttView, startValue)
+        const endDate = parseStringDate($xeGanttView, endValue)
+        const startStr = XEUtils.toDateString(startDate, 'yyyy-W', { firstDay: weekScale ? weekScale.startDay : undefined })
+        const startFirstDate = XEUtils.getWhatWeek(startDate, 0, weekScale ? weekScale.startDay : undefined, weekScale ? weekScale.startDay : undefined)
+        const endStr = XEUtils.toDateString(endDate, 'yyyy-W', { firstDay: weekScale ? weekScale.startDay : undefined })
+        const endFirstDate = XEUtils.getWhatWeek(endDate, 0, weekScale ? weekScale.startDay : undefined, weekScale ? weekScale.startDay : undefined)
+        const dateSize = Math.floor((XEUtils.getWhatWeek(endDate, 1, weekScale ? weekScale.startDay : undefined, weekScale ? weekScale.startDay : undefined).getTime() - endFirstDate.getTime()) / dayMs)
+        const subtract = (startDate.getTime() - startFirstDate.getTime()) / dayMs / dateSize
+        const addSize = Math.max(0, (endDate.getTime() - endFirstDate.getTime()) / dayMs + 1) / dateSize
+        const offsetLeftSize = (indexMaps[startStr] || 0) + subtract
+        return {
+          offsetLeftSize,
+          offsetWidthSize: (indexMaps[endStr] || 0) - offsetLeftSize + addSize
+        }
+      }
+    }
+    case 'day':
+    case 'date': {
+      const indexMaps: Record<string, number> = {}
+      fullCols.forEach(({ dateObj }, i) => {
+        const yyyyMM = XEUtils.toDateString(dateObj.date, 'yyyy-MM-dd')
+        indexMaps[yyyyMM] = i
+      })
+      return (startValue: any, endValue: any) => {
+        const startDate = parseStringDate($xeGanttView, startValue)
+        const endDate = parseStringDate($xeGanttView, endValue)
+        const startStr = XEUtils.toDateString(startDate, 'yyyy-MM-dd')
+        const startFirstDate = XEUtils.getWhatDay(startDate, 0, 'first')
+        const endStr = XEUtils.toDateString(endDate, 'yyyy-MM-dd')
+        const endFirstDate = XEUtils.getWhatDay(endDate, 0, 'first')
+        const minuteSize = Math.floor((XEUtils.getWhatDay(endDate, 1, 'first').getTime() - endFirstDate.getTime()) / minuteMs)
+        const subtract = (startDate.getTime() - startFirstDate.getTime()) / minuteMs / minuteSize
+        const addSize = Math.max(0, (endDate.getTime() - endFirstDate.getTime()) / minuteMs + 1) / minuteSize
+        const offsetLeftSize = (indexMaps[startStr] || 0) + subtract
+        return {
+          offsetLeftSize,
+          offsetWidthSize: (indexMaps[endStr] || 0) - offsetLeftSize + addSize
+        }
+      }
+    }
+    case 'hour': {
+      const indexMaps: Record<string, number> = {}
+      fullCols.forEach(({ dateObj }, i) => {
+        const yyyyMM = XEUtils.toDateString(dateObj.date, 'yyyy-MM-dd HH')
+        indexMaps[yyyyMM] = i
+      })
+      return (startValue: any, endValue: any) => {
+        const startDate = parseStringDate($xeGanttView, startValue)
+        const endDate = parseStringDate($xeGanttView, endValue)
+        const startStr = XEUtils.toDateString(startDate, 'yyyy-MM-dd HH')
+        const startFirstDate = XEUtils.getWhatHours(startDate, 0, 'first')
+        const endStr = XEUtils.toDateString(endDate, 'yyyy-MM-dd HH')
+        const endFirstDate = XEUtils.getWhatHours(endDate, 0, 'first')
+        const minuteSize = Math.floor((XEUtils.getWhatHours(endDate, 1, 'first').getTime() - endFirstDate.getTime()) / minuteMs)
+        const subtract = (startDate.getTime() - startFirstDate.getTime()) / minuteMs / minuteSize
+        const addSize = Math.max(0, (endDate.getTime() - endFirstDate.getTime()) / minuteMs + 1) / minuteSize
+        const offsetLeftSize = (indexMaps[startStr] || 0) + subtract
+        return {
+          offsetLeftSize,
+          offsetWidthSize: (indexMaps[endStr] || 0) - offsetLeftSize + addSize
+        }
+      }
+    }
+    case 'minute': {
+      const indexMaps: Record<string, number> = {}
+      fullCols.forEach(({ dateObj }, i) => {
+        const yyyyMM = XEUtils.toDateString(dateObj.date, 'yyyy-MM-dd HH:mm')
+        indexMaps[yyyyMM] = i
+      })
+      return (startValue: any, endValue: any) => {
+        const startDate = parseStringDate($xeGanttView, startValue)
+        const endDate = parseStringDate($xeGanttView, endValue)
+        const startStr = XEUtils.toDateString(startDate, 'yyyy-MM-dd HH:mm')
+        const startFirstDate = XEUtils.getWhatMinutes(startDate, 0, 'first')
+        const endStr = XEUtils.toDateString(endDate, 'yyyy-MM-dd HH:mm')
+        const endFirstDate = XEUtils.getWhatMinutes(endDate, 0, 'first')
+        const minuteSize = Math.floor((XEUtils.getWhatMinutes(endDate, 1, 'first').getTime() - endFirstDate.getTime()) / minuteMs)
+        const subtract = (startDate.getTime() - startFirstDate.getTime()) / minuteMs / minuteSize
+        const addSize = Math.max(0, (endDate.getTime() - endFirstDate.getTime()) / minuteMs + 1) / minuteSize
+        const offsetLeftSize = (indexMaps[startStr] || 0) + subtract
+        return {
+          offsetLeftSize,
+          offsetWidthSize: (indexMaps[endStr] || 0) - offsetLeftSize + addSize
+        }
+      }
+    }
+    case 'second': {
+      const gapTime = getStandardGapTime(minScale.type)
+      return (startValue: any, endValue: any) => {
+        const startDate = parseStringDate($xeGanttView, startValue)
+        const endDate = parseStringDate($xeGanttView, endValue)
+        let offsetLeftSize = 0
+        let offsetWidthSize = 0
+        if (minViewDate) {
+          offsetLeftSize = (startDate.getTime() - minViewDate.getTime()) / gapTime
+          offsetWidthSize = ((endDate.getTime() - startDate.getTime()) / gapTime) + 1
+        }
+        return {
+          offsetLeftSize,
+          offsetWidthSize
+        }
+      }
+    }
+  }
+  return () => {
+    return {
+      offsetLeftSize: 0,
+      offsetWidthSize: 0
+    }
+  }
+}
 
+function handleParseColumn ($xeGanttView: VxeGanttViewConstructor & VxeGanttViewPrivateMethods) {
+  const $xeGantt = $xeGanttView.$xeGantt
+  const reactData = $xeGanttView.reactData
+  const internalData = $xeGanttView.internalData
+
+  const ganttProps = $xeGantt
+  const { treeConfig } = ganttProps
+  const { minViewDate, maxViewDate } = reactData
+  const { fullCols, groupCols } = handleColumnHeader($xeGanttView)
+  if (minViewDate && maxViewDate) {
     const $xeTable = internalData.xeTable
     if ($xeTable) {
       const startField = $xeGantt.computeStartField
@@ -273,32 +468,30 @@ function handleParseColumn ($xeGanttView: VxeGanttViewConstructor & VxeGanttView
       const childrenField = treeOpts.children || treeOpts.childrenField
 
       const ctMaps: Record<string, VxeGanttDefines.RowCacheItem> = {}
+      const renderFn = createChartRender($xeGanttView, fullCols)
       const handleParseRender = (row: any) => {
         const rowid = $xeTable.getRowid(row)
         const startValue = XEUtils.get(row, startField)
         const endValue = XEUtils.get(row, endField)
         if (startValue && endValue) {
-          const startDate = parseStringDate($xeGanttView, startValue)
-          const endDate = parseStringDate($xeGanttView, endValue)
-          const oLeftSize = Math.floor((startDate.getTime() - minViewDate.getTime()) / gapTime)
-          const oWidthSize = Math.floor((endDate.getTime() - startDate.getTime()) / gapTime) + 1
+          const { offsetLeftSize, offsetWidthSize } = renderFn(startValue, endValue)
           ctMaps[rowid] = {
             row,
             rowid,
-            oLeftSize,
-            oWidthSize
+            oLeftSize: offsetLeftSize,
+            oWidthSize: offsetWidthSize
           }
         }
       }
 
       if (isRowGroupStatus) {
-      // 行分组
+        // 行分组
         const mapChildrenField = aggregateOpts.mapChildrenField
         if (mapChildrenField) {
           XEUtils.eachTree(afterGroupFullData, handleParseRender, { children: mapChildrenField })
         }
       } else if (treeConfig) {
-      // 树结构
+        // 树结构
         XEUtils.eachTree(afterTreeFullData, handleParseRender, { children: transform ? treeOpts.mapChildrenField : childrenField })
       } else {
         afterFullData.forEach(handleParseRender)
@@ -572,10 +765,10 @@ function handleLazyRecalculate ($xeGanttView: VxeGanttViewConstructor & VxeGantt
   return new Promise<void>(resolve => {
     const { rceTimeout, rceRunTime } = internalData
     const $xeTable = internalData.xeTable
-    let refreshDelay = 50
+    let refreshDelay = 30
     if ($xeTable) {
       const resizeOpts = $xeTable.computeResizeOpts
-      refreshDelay = resizeOpts.refreshDelay || 50
+      refreshDelay = resizeOpts.refreshDelay || refreshDelay
     }
     if (rceTimeout) {
       clearTimeout(rceTimeout)
@@ -1009,7 +1202,75 @@ export default defineVxeComponent({
   computed: {
     ...({} as {
       $xeGantt(): (VxeGanttConstructor & VxeGanttPrivateMethods)
-    })
+    }),
+    computeScaleDateList () {
+      const $xeGanttView = this
+      const $xeGantt = $xeGanttView.$xeGantt
+      const reactData = $xeGanttView.reactData
+
+      const { minViewDate, maxViewDate } = reactData
+      const minScale = $xeGantt.computeMinScale
+      const dateList: Date[] = []
+      if (!minViewDate || !maxViewDate) {
+        return dateList
+      }
+
+      const startTime = minViewDate.getTime()
+      const endTime = maxViewDate.getTime()
+      switch (minScale.type) {
+        case 'year': {
+          let currDate = XEUtils.getWhatYear(minViewDate, 0, 'first')
+          while (currDate <= maxViewDate) {
+            const itemDate = currDate
+            dateList.push(itemDate)
+            currDate = XEUtils.getWhatYear(currDate, 1)
+          }
+          break
+        }
+        case 'quarter': {
+          let currDate = XEUtils.getWhatQuarter(minViewDate, 0, 'first')
+          while (currDate <= maxViewDate) {
+            const itemDate = currDate
+            dateList.push(itemDate)
+            currDate = XEUtils.getWhatQuarter(currDate, 1)
+          }
+          break
+        }
+        case 'month': {
+          let currDate = XEUtils.getWhatMonth(minViewDate, 0, 'first')
+          while (currDate <= maxViewDate) {
+            const itemDate = currDate
+            dateList.push(itemDate)
+            currDate = XEUtils.getWhatMonth(currDate, 1)
+          }
+          break
+        }
+        case 'week': {
+          let currDate = XEUtils.getWhatWeek(minViewDate, 0, minScale.startDay, minScale.startDay)
+          while (currDate <= maxViewDate) {
+            const itemDate = currDate
+            dateList.push(itemDate)
+            currDate = XEUtils.getWhatWeek(currDate, 1)
+          }
+          break
+        }
+        case 'day':
+        case 'date':
+        case 'hour':
+        case 'minute':
+        case 'second': {
+          const gapTime = getStandardGapTime(minScale.type)
+          let currTime = startTime
+          while (currTime <= endTime) {
+            const itemDate = new Date(currTime)
+            dateList.push(itemDate)
+            currTime += gapTime
+          }
+          break
+        }
+      }
+      return dateList
+    }
   },
   methods: {
     //
@@ -1017,9 +1278,17 @@ export default defineVxeComponent({
     //
     refreshData (): Promise<void> {
       const $xeGanttView = this
+      const internalData = $xeGanttView.internalData
 
       handleUpdateData($xeGanttView)
-      return handleLazyRecalculate($xeGanttView)
+      handleRecalculateStyle($xeGanttView)
+      return $xeGanttView.$nextTick().then(() => {
+        const $xeTable = internalData.xeTable
+        handleRecalculateStyle($xeGanttView)
+        if ($xeTable) {
+          return $xeTable.recalculate()
+        }
+      })
     },
     updateViewData (): Promise<void> {
       const $xeGanttView = this

package/packages/gantt/src/gantt.ts

@@ -256,6 +256,26 @@ export default /* define-vxe-component start */ defineVxeComponent({
 
       return Object.assign({}, getConfig().gantt.taskSplitConfig, props.taskSplitConfig)
     },
+    computeScaleUnit () {
+      const $xeGantt = this
+
+      const minScale = $xeGantt.computeMinScale as VxeGanttDefines.ColumnScaleObj
+      return minScale ? minScale.type : 'date'
+    },
+    computeMinScale () {
+      const $xeGantt = this
+      const reactData = ($xeGantt as any).reactData as GanttReactData
+
+      const { taskScaleList } = reactData
+      return XEUtils.last(taskScaleList)
+    },
+    computeWeekScale () {
+      const $xeGantt = this
+      const reactData = ($xeGantt as any).reactData as GanttReactData
+
+      const { taskScaleList } = reactData
+      return taskScaleList.find(item => item.type === 'week')
+    },
     computeTaskScaleConfs () {
       const $xeGantt = this
 
@@ -534,6 +554,7 @@ export default /* define-vxe-component start */ defineVxeComponent({
       const $xeGantt = this
 
       $xeGantt.handleTaskScaleConfig()
+      $xeGantt.refreshTaskView()
     }
   },
   methods: {

package/packages/gantt/src/util.ts

@@ -1,3 +1,4 @@
+import type { VxeGanttDefines } from '../../../types'
 import type { VxeTableDefines, VxeTablePropTypes } from 'vxe-table'
 
 export function getRefElem (refEl: any) {
@@ -10,3 +11,15 @@ export function getRefElem (refEl: any) {
 export function getCellRestHeight (rowRest: VxeTableDefines.RowCacheItem, cellOpts: VxeTablePropTypes.CellConfig, rowOpts: VxeTablePropTypes.RowConfig, defaultRowHeight: number) {
   return rowRest.resizeHeight || cellOpts.height || rowOpts.height || rowRest.height || defaultRowHeight
 }
+
+export function getStandardGapTime (type: VxeGanttDefines.ColumnScaleType) {
+  switch (type) {
+    case 'hour':
+      return 1000 * 60 * 60
+    case 'minute':
+      return 1000 * 60
+    case 'second':
+      return 1000
+  }
+  return 1000 * 60 * 60 * 24
+}