vxe-gantt 3.1.5 → 3.1.7

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

@@ -3,7 +3,7 @@ import { defineVxeComponent } from '../../ui/src/comp'
 import { VxeUI } from '@vxe-ui/core'
 import XEUtils from 'xe-utils'
 import { getCellRestHeight } from './util'
-import { getStringValue } from '../../ui/src/utils'
+import { getStringValue, isEnableConf } from '../../ui/src/utils'
 
 import type { VxeComponentStyleType } from 'vxe-pc-ui'
 import type { TableInternalData, TableReactData, VxeTableConstructor, VxeTableMethods, VxeTablePrivateMethods } from 'vxe-table'
@@ -60,15 +60,13 @@ export default defineVxeComponent({
       const taskBarOpts = $xeGantt.computeTaskBarOpts
       const scaleUnit = $xeGantt.computeScaleUnit
       const barParams = { $gantt: $xeGantt, row, scaleType: scaleUnit }
-      const { showProgress, showContent, contentMethod, barStyle, drag, showTooltip } = taskBarOpts
+      const { showProgress, showContent, contentMethod, barStyle, move, showTooltip } = taskBarOpts
       const isBarRowStyle = XEUtils.isFunction(barStyle)
       const barStyObj = (barStyle ? (isBarRowStyle ? barStyle(barParams) : barStyle) : {}) || {}
       const { round } = barStyObj
 
       const rowRest = fullAllDataRowIdData[rowid] || {}
-      const resizeHeight = resizeHeightFlag ? rowRest.resizeHeight : 0
-      const isRsHeight = resizeHeight > 0
-      const cellHeight = getCellRestHeight(rowRest, cellOpts, rowOpts, defaultRowHeight)
+      const cellHeight = resizeHeightFlag ? getCellRestHeight(rowRest, cellOpts, rowOpts, defaultRowHeight) : 0
 
       let title = getStringValue(XEUtils.get(row, titleField))
       const progressValue = showProgress ? Math.min(100, Math.max(0, XEUtils.toNumber(XEUtils.get(row, progressField)))) : 0
@@ -135,8 +133,7 @@ export default defineVxeComponent({
         },
         class: ['vxe-gantt-view--chart-row', {
           'is--round': round,
-          'is--drag': drag,
-          'col--rs-height': isRsHeight
+          'is--move': move
         }],
         style: {
           height: `${cellHeight}px`
@@ -154,27 +151,40 @@ export default defineVxeComponent({
             rowid
           },
           on: ons
-        }, taskBarSlot
-          ? $xeGantt.callSlot(taskBarSlot, barParams, h)
-          : [
-              showProgress
-                ? h('div', {
-                  class: 'vxe-gantt-view--chart-progress',
-                  style: vpStyle
-                })
-                : renderEmptyElement($xeGantt),
-              showContent
-                ? h('div', {
-                  class: 'vxe-gantt-view--chart-content'
-                }, title)
-                : renderEmptyElement($xeGantt)
-            ])
+        }, $xeGantt.renderGanttTaskBarContent
+          ? $xeGantt.renderGanttTaskBarContent(h, ctParams, {
+            title,
+            vbStyle,
+            vpStyle
+          })
+          : (taskBarSlot
+              ? [
+                  h('div', {
+                    key: 'cbc',
+                    class: 'vxe-gantt-view--chart-custom-bar-content'
+                  }, $xeGantt.callSlot(taskBarSlot, barParams, h))
+                ]
+              : [
+                  showProgress
+                    ? h('div', {
+                      key: 'vcp',
+                      class: 'vxe-gantt-view--chart-progress',
+                      style: vpStyle
+                    })
+                    : renderEmptyElement($xeGantt),
+                  showContent
+                    ? h('div', {
+                      key: 'vcc',
+                      class: 'vxe-gantt-view--chart-content'
+                    }, title)
+                    : renderEmptyElement($xeGantt)
+                ]))
       ])
     },
-    renderRows (h: CreateElement, $xeTable: VxeTableConstructor & VxeTableMethods & VxeTablePrivateMethods, tableData: any[]) {
+    renderTaskRows (h: CreateElement, $xeTable: VxeTableConstructor & VxeTableMethods & VxeTablePrivateMethods, tableData: any[]) {
       const _vm = this
       const $xeGanttView = _vm.$xeGanttView
-      const { reactData } = $xeGanttView
+      const ganttViewReactData = $xeGanttView.reactData
 
       const tableProps = $xeTable
       const { treeConfig } = tableProps
@@ -186,11 +196,11 @@ export default defineVxeComponent({
       const { transform } = treeOpts
       const childrenField = treeOpts.children || treeOpts.childrenField
 
-      const { scrollYLoad } = reactData
+      const { scrollYLoad } = ganttViewReactData
 
       const trVNs: VNode[] = []
       tableData.forEach((row, $rowIndex) => {
-        const rowid = $xeTable ? $xeTable.getRowid(row) : ''
+        const rowid = $xeTable.getRowid(row)
         const rowRest = fullAllDataRowIdData[rowid] || {}
         let rowIndex = $rowIndex
         let _rowIndex = -1
@@ -208,43 +218,62 @@ export default defineVxeComponent({
         }
         // 如果是树形表格
         if (isExpandTree) {
-          trVNs.push(..._vm.renderRows(h, $xeTable, rowChildren))
+          trVNs.push(..._vm.renderTaskRows(h, $xeTable, rowChildren))
         }
       })
       return trVNs
     },
     renderVN (h: CreateElement): VNode {
       const _vm = this
+      const $xeGantt = _vm.$xeGantt
       const $xeGanttView = _vm.$xeGanttView
-      const { reactData } = $xeGanttView
+      const ganttViewInternalData = $xeGanttView.internalData
+      const ganttViewReactData = $xeGanttView.reactData
 
-      const $xeTable = $xeGanttView.internalData.xeTable
+      const $xeTable = ganttViewInternalData.xeTable
 
-      const { tableData } = reactData
+      const { tableData } = ganttViewReactData
+      const taskLinkOpts = $xeGantt.computeTaskLinkOpts
+      const { showArrow } = taskLinkOpts
 
       return h('div', {
         ref: 'refElem',
         class: 'vxe-gantt-view--chart-wrapper'
-      }, $xeTable ? _vm.renderRows(h, $xeTable, tableData) : [])
+      }, [
+        $xeGantt.renderGanttTaskLines
+          ? h('div', {
+            ref: 'reflineWrapperElem',
+            class: ['vxe-gantt-view--chart-line-wrapper', {
+              'show-arrow': showArrow
+            }]
+          }, $xeTable && isEnableConf(taskLinkOpts) ? $xeGantt.renderGanttTaskLines(h) : [])
+          : renderEmptyElement($xeGantt),
+        h('div', {
+          ref: 'refTaskWrapperElem',
+          class: 'vxe-gantt-view--chart-task-wrapper'
+        }, $xeTable ? _vm.renderTaskRows(h, $xeTable, tableData) : [])
+      ])
     }
   },
   mounted () {
     const _vm = this
     const $xeGanttView = _vm.$xeGanttView
-    const { internalData } = $xeGanttView
+    const ganttViewInternalData = $xeGanttView.internalData
 
-    const { elemStore } = internalData
+    const { elemStore } = ganttViewInternalData
     const prefix = 'main-chart-'
-    elemStore[`${prefix}wrapper`] = _vm.$refs.refElem as HTMLDivElement
+    elemStore[`${prefix}task-wrapper`] = _vm.$refs.refTaskWrapperElem as HTMLDivElement
+    elemStore[`${prefix}line-wrapper`] = _vm.$refs.reflineWrapperElem as HTMLDivElement
   },
   destroyed () {
     const _vm = this
     const $xeGanttView = _vm.$xeGanttView
-    const { internalData } = $xeGanttView
+    const ganttViewInternalData = $xeGanttView.internalData
 
-    const { elemStore } = internalData
+    const { elemStore } = ganttViewInternalData
     const prefix = 'main-chart-'
-    elemStore[`${prefix}wrapper`] = null
+    elemStore[`${prefix}task-wrapper`] = null
+    elemStore[`${prefix}line-wrapper`] = null
   },
   render (this: any, h) {
     return this.renderVN(h)

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

@@ -1,8 +1,8 @@
 import { VNode, CreateElement } from 'vue'
 import { defineVxeComponent } from '../../ui/src/comp'
 import { VxeUI } from '@vxe-ui/core'
-import { setScrollTop, setScrollLeft, removeClass, addClass, hasClass } from '../../ui/src/dom'
-import { getRefElem, getStandardGapTime } from './util'
+import { setScrollTop, setScrollLeft, removeClass, addClass } from '../../ui/src/dom'
+import { getRefElem, getStandardGapTime, getTaskBarLeft, getTaskBarWidth } from './util'
 import XEUtils from 'xe-utils'
 import GanttViewHeaderComponent from './gantt-header'
 import GanttViewBodyComponent from './gantt-body'
@@ -601,30 +601,37 @@ function calcScrollbar ($xeGanttView: VxeGanttViewConstructor & VxeGanttViewPriv
   }
 }
 
-function updateChart ($xeGanttView: VxeGanttViewConstructor & VxeGanttViewPrivateMethods) {
+function updateTaskChart ($xeGanttView: VxeGanttViewConstructor & VxeGanttViewPrivateMethods) {
+  const $xeGantt = $xeGanttView.$xeGantt
   const reactData = $xeGanttView.reactData
   const internalData = $xeGanttView.internalData
+  const ganttInternalData = $xeGantt.internalData
+  const $xeTable = internalData.xeTable
 
+  const { dragBarRow } = ganttInternalData
   const { viewCellWidth } = reactData
   const { elemStore, chartMaps } = internalData
-  const chartWrapper = getRefElem(elemStore['main-chart-wrapper'])
-  if (chartWrapper) {
+  const chartWrapper = getRefElem(elemStore['main-chart-task-wrapper'])
+  if (chartWrapper && $xeTable) {
     XEUtils.arrayEach(chartWrapper.children, (rowEl) => {
       const barEl = rowEl.children[0] as HTMLDivElement
-      if (!barEl || hasClass(barEl, 'is--drag')) {
+      if (!barEl) {
         return
       }
       const rowid = rowEl.getAttribute('rowid')
-      const rowRest = rowid ? chartMaps[rowid] : null
-      barEl.style.left = `${rowRest ? viewCellWidth * rowRest.oLeftSize : 0}px`
-      barEl.style.width = `${rowRest ? viewCellWidth * rowRest.oWidthSize : 0}px`
+      if (dragBarRow && $xeTable.getRowid(dragBarRow) === rowid) {
+        return
+      }
+      const chartRest = rowid ? chartMaps[rowid] : null
+      barEl.style.left = `${getTaskBarLeft(chartRest, viewCellWidth)}px`
+      barEl.style.width = `${getTaskBarWidth(chartRest, viewCellWidth)}px`
     })
   }
   return $xeGanttView.$nextTick()
 }
 
 function updateStyle ($xeGanttView: VxeGanttViewConstructor & VxeGanttViewPrivateMethods) {
-  const $xeGantt = $xeGanttView.$xeGantt
+  const $xeGantt = $xeGanttView.$xeGantt as VxeGanttConstructor & VxeGanttPrivateMethods
   const reactData = $xeGanttView.reactData
   const internalData = $xeGanttView.internalData
 
@@ -636,6 +643,9 @@ function updateStyle ($xeGanttView: VxeGanttViewConstructor & VxeGanttViewPrivat
   if (!el) {
     return
   }
+  if (!$xeGantt) {
+    return
+  }
 
   const scrollbarOpts = $xeGantt.computeScrollbarOpts
   const scrollbarXToTop = $xeGantt.computeScrollbarXToTop
@@ -746,20 +756,26 @@ function updateStyle ($xeGanttView: VxeGanttViewConstructor & VxeGanttViewPrivat
 
   reactData.scrollXWidth = viewTableWidth
 
-  return updateChart($xeGanttView)
+  return Promise.all([
+    updateTaskChart($xeGanttView),
+    $xeGantt.handleUpdateTaskLink ? $xeGantt.handleUpdateTaskLink($xeGanttView) : null
+  ])
 }
 
 function handleRecalculateStyle ($xeGanttView: VxeGanttViewConstructor & VxeGanttViewPrivateMethods) {
   const internalData = $xeGanttView.internalData
+  const $xeGantt = $xeGanttView.$xeGantt
 
   const el = $xeGanttView.$refs.refElem as HTMLDivElement
   internalData.rceRunTime = Date.now()
   if (!el || !el.clientWidth) {
     return $xeGanttView.$nextTick()
   }
+  if (!$xeGantt) {
+    return $xeGanttView.$nextTick()
+  }
   calcScrollbar($xeGanttView)
   updateStyle($xeGanttView)
-  updateChart($xeGanttView)
   return computeScrollLoad($xeGanttView)
 }
 
@@ -975,7 +991,7 @@ function updateScrollYSpace ($xeGanttView: VxeGanttViewConstructor & VxeGanttVie
     scrollYTop = 0
   }
 
-  const bodyChartWrapperElem = getRefElem(elemStore['main-chart-wrapper'])
+  const bodyChartWrapperElem = getRefElem(elemStore['main-chart-task-wrapper'])
   if (bodyTableElem) {
     bodyTableElem.style.transform = `translate(${reactData.scrollXLeft || 0}px, ${scrollYTop}px)`
   }
@@ -992,6 +1008,13 @@ function updateScrollYSpace ($xeGanttView: VxeGanttViewConstructor & VxeGanttVie
   if (scrollYSpaceEl) {
     scrollYSpaceEl.style.height = ySpaceHeight ? `${ySpaceHeight}px` : ''
   }
+
+  const lineWrapper = getRefElem(elemStore['main-chart-line-wrapper'])
+  const svgElem = lineWrapper ? lineWrapper.firstElementChild as HTMLDivElement : null
+  if (svgElem) {
+    svgElem.style.height = ySpaceHeight ? `${ySpaceHeight}px` : ''
+  }
+
   reactData.scrollYTop = scrollYTop
   reactData.scrollYHeight = scrollYHeight
   reactData.isScrollYBig = isScrollYBig
@@ -1192,7 +1215,7 @@ export default defineVxeComponent({
       tableColumn: [],
       headerGroups: [],
 
-      viewCellWidth: 20
+      viewCellWidth: 40
     }
 
     const internalData = createInternalData()

package/packages/gantt/src/gantt.ts

@@ -5,13 +5,14 @@ import XEUtils from 'xe-utils'
 import { getLastZIndex, nextZIndex, isEnableConf, formatText } from '../../ui/src/utils'
 import { getOffsetHeight, getPaddingTopBottomSize, getDomNode, toCssUnit, addClass, removeClass } from '../../ui/src/dom'
 import { getSlotVNs } from '../../ui/src/vn'
+import { getTaskLinkKey } from './util'
 import { warnLog, errLog } from '../../ui/src/log'
 import GanttViewComponent from './gantt-view'
 import { VxeTable as VxeTableComponent } from 'vxe-table'
 
 import type { ValueOf, VxeFormInstance, VxeFormItemProps, VxePagerInstance, VxePagerDefines, VxeComponentStyleType, VxeComponentSizeType, VxeFormDefines, VxeFormItemPropTypes } from 'vxe-pc-ui'
 import type { VxeTableMethods, VxeToolbarPropTypes, VxeTooltipInstance, VxeTableProps, VxeTableConstructor, VxeTablePrivateMethods, VxeTableDefines, TableReactData, VxeToolbarInstance, TableInternalData, VxeTablePropTypes, VxeGridPropTypes, VxeGridDefines } from 'vxe-table'
-import type { VxeGanttEmits, GanttReactData, GanttInternalData, VxeGanttPropTypes, VxeGanttViewInstance, VxeGanttDefines, VxeGanttConstructor } from '../../../types'
+import type { VxeGanttEmits, GanttReactData, GanttInternalData, VxeGanttPropTypes, VxeGanttViewInstance, VxeGanttDefines, VxeGanttConstructor, VxeGanttPrivateMethods } from '../../../types'
 
 const { getConfig, getIcon, getI18n, commands, globalMixins, createEvent, globalEvents, GLOBAL_EVENT_KEYS, renderEmptyElement } = VxeUI
 
@@ -74,8 +75,29 @@ XEUtils.each((VxeTableComponent as any).methods, (fn, name) => {
   }
 })
 
+function handleTaskAddLink (item: VxeGanttPropTypes.Link, linkConfs: VxeGanttDefines.LinkConfObj[], fromConfMaps: Record<string, VxeGanttDefines.LinkConfObj[]>, fromKeyMaps: Record<string, VxeGanttDefines.LinkConfObj>, uniqueMaps: Record<string, VxeGanttDefines.LinkConfObj>) {
+  if (item) {
+    const { type, from, to, lineStatus, lineColor, lineTyle, lineWidth, showArrow } = item
+    const tlKey = getTaskLinkKey(from, to)
+    if (from && to && !uniqueMaps[tlKey]) {
+      let confs = fromConfMaps[from]
+      if (!confs) {
+        confs = fromConfMaps[from] = []
+      }
+      const confObj: VxeGanttDefines.LinkConfObj = { type, from, to, lineStatus, lineColor, lineTyle, lineWidth, showArrow }
+      confs.push(confObj)
+      linkConfs.push(confObj)
+      fromKeyMaps[from] = confObj
+      uniqueMaps[tlKey] = confObj
+    }
+  }
+}
+
 function createInternalData (): GanttInternalData {
   return {
+    linkFromConfMaps: {},
+    linkFromKeyMaps: {},
+    linkUniqueMaps: {},
     uFoot: false,
     resizeTableWidth: 0
     // barTipTimeout: null
@@ -110,22 +132,24 @@ export default /* define-vxe-component start */ defineVxeComponent({
       params: PropType<VxeTablePropTypes.Params>
     }),
 
-    columns: Array as PropType<VxeGridPropTypes.Columns<any>>,
+    columns: Array as PropType<VxeGridPropTypes.Columns>,
     pagerConfig: Object as PropType<VxeGridPropTypes.PagerConfig>,
     proxyConfig: Object as PropType<VxeGridPropTypes.ProxyConfig<any>>,
     toolbarConfig: Object as PropType<VxeGridPropTypes.ToolbarConfig>,
     formConfig: Object as PropType<VxeGridPropTypes.FormConfig>,
     zoomConfig: Object as PropType<VxeGridPropTypes.ZoomConfig>,
 
+    links: Array as PropType<VxeGanttPropTypes.Links>,
     layouts: Array as PropType<VxeGanttPropTypes.Layouts>,
     taskConfig: Object as PropType<VxeGanttPropTypes.TaskConfig>,
     taskViewScaleConfig: Object as PropType<VxeGanttPropTypes.TaskViewScaleConfig>,
     taskViewConfig: Object as PropType<VxeGanttPropTypes.TaskViewConfig>,
+    taskLinkConfig: Object as PropType<VxeGanttPropTypes.TaskLinkConfig>,
     taskBarConfig: Object as PropType<VxeGanttPropTypes.TaskBarConfig>,
     taskBarTooltipConfig: Object as PropType<VxeGanttPropTypes.TaskBarTooltipConfig>,
     taskSplitConfig: Object as PropType<VxeGanttPropTypes.TaskSplitConfig>,
     taskBarResizeConfig: Object as PropType<VxeGanttPropTypes.TaskBarResizeConfig>,
-    taskBarDragConfig: Object as PropType<VxeGanttPropTypes.TaskBarDragConfig>,
+    taskBarMoveConfig: Object as PropType<VxeGanttPropTypes.TaskBarMoveConfig>,
     size: {
       type: String as PropType<VxeGridPropTypes.Size>,
       default: () => getConfig().gantt.size || getConfig().size
@@ -147,6 +171,7 @@ export default /* define-vxe-component start */ defineVxeComponent({
       tableLoading: false,
       proxyInited: false,
       isZMax: false,
+      tableLinks: [],
       tableData: [],
       filterData: [],
       formData: {},
@@ -167,7 +192,10 @@ export default /* define-vxe-component start */ defineVxeComponent({
         content: '',
         visible: false,
         params: null
-      }
+      },
+
+      linkList: [],
+      upLinkFlag: 0
     }
 
     const internalData = createInternalData()
@@ -248,11 +276,11 @@ export default /* define-vxe-component start */ defineVxeComponent({
 
       return Object.assign({}, getConfig().gantt.taskBarConfig, props.taskBarConfig)
     },
-    computeTaskBarDragOpts () {
+    computeTaskBarMoveOpts () {
       const $xeGantt = this
       const props = $xeGantt
 
-      return Object.assign({}, getConfig().gantt.taskBarDragConfig, props.taskBarDragConfig)
+      return Object.assign({}, getConfig().gantt.taskBarMoveConfig, props.taskBarMoveConfig)
     },
     computeTaskBarResizeOpts () {
       const $xeGantt = this
@@ -272,6 +300,12 @@ export default /* define-vxe-component start */ defineVxeComponent({
 
       return Object.assign({}, getConfig().gantt.taskBarTooltipConfig, props.taskBarTooltipConfig)
     },
+    computeTaskLinkOpts () {
+      const $xeGantt = this
+      const props = $xeGantt
+
+      return Object.assign({}, getConfig().gantt.taskLinkConfig, props.taskLinkConfig)
+    },
     computeScaleUnit () {
       const $xeGantt = this
 
@@ -679,7 +713,7 @@ export default /* define-vxe-component start */ defineVxeComponent({
       }
     },
     getRespMsg (rest: any, defaultMsg: string) {
-      const $xeGantt = this
+      const $xeGantt = this as unknown as VxeGanttConstructor & VxeGanttPrivateMethods
 
       const proxyOpts = $xeGantt.computeProxyOpts
       const resConfigs = proxyOpts.response || proxyOpts.props || {}
@@ -1187,7 +1221,7 @@ export default /* define-vxe-component start */ defineVxeComponent({
             const commitParams = {
               $table: $xeTable,
               $grid: null,
-              $gantt: $xeGantt,
+              $gantt: $xeGantt as unknown as VxeGanttConstructor & VxeGanttPrivateMethods,
               code,
               button,
               isInited,
@@ -1209,7 +1243,7 @@ export default /* define-vxe-component start */ defineVxeComponent({
               let tableData: any[] = []
               reactData.tableLoading = false
               if (rest) {
-                const reParams = { data: rest, $table: $xeTable, $grid: null, $gantt: $xeGantt }
+                const reParams = { data: rest, $table: $xeTable, $grid: null, $gantt: $xeGantt as unknown as VxeGanttConstructor & VxeGanttPrivateMethods }
                 if (pagerConfig && isEnableConf(pagerOpts)) {
                   const totalProp = resConfigs.total
                   const total = (XEUtils.isFunction(totalProp) ? totalProp(reParams) : XEUtils.get(rest, totalProp || 'page.total')) || 0
@@ -1278,7 +1312,7 @@ export default /* define-vxe-component start */ defineVxeComponent({
             const commitParams = {
               $table: $xeTable,
               $grid: null,
-              $gantt: $xeGantt,
+              $gantt: $xeGantt as unknown as VxeGanttConstructor & VxeGanttPrivateMethods,
               code,
               button,
               filters: filterList,
@@ -1316,7 +1350,7 @@ export default /* define-vxe-component start */ defineVxeComponent({
             const commitParams = {
               $table: $xeTable,
               $grid: null,
-              $gantt: $xeGantt,
+              $gantt: $xeGantt as unknown as VxeGanttConstructor & VxeGanttPrivateMethods,
               code,
               button,
               body,
@@ -1393,7 +1427,7 @@ export default /* define-vxe-component start */ defineVxeComponent({
             const commitParams = {
               $table: $xeTable,
               $grid: null,
-              $gantt: $xeGantt,
+              $gantt: $xeGantt as unknown as VxeGanttConstructor & VxeGanttPrivateMethods,
               code,
               button,
               body,
@@ -1479,7 +1513,7 @@ export default /* define-vxe-component start */ defineVxeComponent({
           if (gCommandOpts) {
             const tCommandMethod = gCommandOpts.tableCommandMethod || gCommandOpts.commandMethod
             if (tCommandMethod) {
-              tCommandMethod({ code, button, $grid: null, $table: $xeTable, $gantt: $xeGantt }, ...args)
+              tCommandMethod({ code, button, $grid: null, $table: $xeTable, $gantt: $xeGantt as unknown as VxeGanttConstructor & VxeGanttPrivateMethods }, ...args)
             } else {
               errLog('vxe.error.notCommands', [code])
             }
@@ -1729,8 +1763,8 @@ export default /* define-vxe-component start */ defineVxeComponent({
       return $xeGantt.$nextTick()
     },
     /**
-       * 关闭 bar tooltip
-       */
+     * 关闭 bar tooltip
+     */
     closeTaskBarTooltip () {
       const $xeGantt = this
       const reactData = $xeGantt.reactData
@@ -1953,6 +1987,33 @@ export default /* define-vxe-component start */ defineVxeComponent({
         $xeGantt.closeTaskBarTooltip()
       }
     },
+    handleTableLinks () {
+      const $xeGantt = this
+      const reactData = $xeGantt.reactData
+
+      const { linkList } = reactData
+      reactData.tableLinks = linkList.slice(0)
+    },
+    handleTaskAddLink,
+    handleTaskUpdateLinks (links: VxeGanttPropTypes.Links) {
+      const $xeGantt = this
+      const reactData = $xeGantt.reactData
+      const internalData = $xeGantt.internalData
+
+      const linkConfs: VxeGanttDefines.LinkConfObj[] = []
+      const fromConfMaps: Record<string, VxeGanttDefines.LinkConfObj[]> = {}
+      const fromKeyMaps: Record<string, VxeGanttDefines.LinkConfObj> = {}
+      const uniqueMaps: Record<string, VxeGanttDefines.LinkConfObj> = {}
+      XEUtils.each(links || [], item => {
+        handleTaskAddLink(item, linkConfs, fromConfMaps, fromKeyMaps, uniqueMaps)
+      })
+      reactData.linkList = linkConfs
+      internalData.linkFromConfMaps = fromConfMaps
+      internalData.linkFromKeyMaps = fromKeyMaps
+      internalData.linkUniqueMaps = uniqueMaps
+      $xeGantt.handleTableLinks()
+      return $xeGantt.$nextTick()
+    },
     handleTaskHeaderContextmenuEvent (evnt: Event, params: VxeGanttDefines.TaskHeaderContextmenuParams) {
       const $xeGantt = this
       const $xeTable = $xeGantt.$refs.refTable as VxeTableConstructor & VxeTablePrivateMethods
@@ -2260,7 +2321,7 @@ export default /* define-vxe-component start */ defineVxeComponent({
       return renderEmptyElement($xeGantt)
     },
     renderTable (h: CreateElement) {
-      const $xeGantt = this
+      const $xeGantt = this as unknown as VxeGanttConstructor & VxeGanttPrivateMethods
       const slots = $xeGantt.$scopedSlots
 
       const tableProps = $xeGantt.computeTableProps
@@ -2271,7 +2332,7 @@ export default /* define-vxe-component start */ defineVxeComponent({
         h(VxeTableComponent as Component, {
           key: 'table',
           props: tableProps,
-          on: getTableOns($xeGantt as VxeGanttConstructor),
+          on: getTableOns($xeGantt),
           scopedSlots: slots,
           ref: 'refTable'
         })
@@ -2590,6 +2651,14 @@ export default /* define-vxe-component start */ defineVxeComponent({
       warnLog('vxe.error.notProp', ['expand-config'])
     }
 
+    if (!($xeGantt as unknown as VxeGanttConstructor & VxeGanttPrivateMethods).handleUpdateTaskLink) {
+      if (props.taskLinkConfig) {
+        warnLog('vxe.error.notProp', ['task-link-config'])
+      }
+      if (props.links) {
+        errLog('vxe.error.notProp', ['links'])
+      }
+    }
     $xeGantt.$nextTick(() => {
       if (props.formConfig) {
         if (!VxeUIFormComponent) {
@@ -2608,6 +2677,9 @@ export default /* define-vxe-component start */ defineVxeComponent({
       }
     })
 
+    if (props.links) {
+      $xeGantt.handleTaskUpdateLinks(props.links)
+    }
     $xeGantt.handleTaskScaleConfig()
     $xeGantt.initPages()
   },

package/packages/gantt/src/static.ts

@@ -0,0 +1,21 @@
+/**
+ * 依赖线枚举类型
+ */
+export enum VxeGanttDependencyType {
+  /**
+   * 结束后才开始，表示一个任务必须在另一个任务开始之前完成
+   */
+  FinishToStart = 0,
+  /**
+   * 开始到结束，表示从某个过程的开始到结束的整个过程
+   */
+  StartToFinish = 1,
+  /**
+   * 开始后才开始，表示一个活动结束了，另一个活动才能开始，它们之间按先后顺序进行
+   */
+  StartToStart = 2,
+  /**
+   * 完成到完成，表示一个任务必须在另一个任务完成之后才能完成
+   */
+  FinishToFinish = 3
+}

package/packages/gantt/src/util.ts

@@ -23,3 +23,15 @@ export function getStandardGapTime (type: VxeGanttDefines.ColumnScaleType) {
   }
   return 1000 * 60 * 60 * 24
 }
+
+export function getTaskBarLeft (chartRest: VxeGanttDefines.RowCacheItem | null, viewCellWidth: number) {
+  return chartRest ? viewCellWidth * chartRest.oLeftSize : 0
+}
+
+export function getTaskBarWidth (chartRest: VxeGanttDefines.RowCacheItem | null, viewCellWidth: number) {
+  return Math.max(1, chartRest ? (Math.floor(viewCellWidth * chartRest.oWidthSize) - 1) : 0)
+}
+
+export function getTaskLinkKey (from: string | number, to: string | number) {
+  return `${from}_${to}`
+}

package/packages/ui/index.ts

@@ -1,7 +1,6 @@
 import { VxeUI } from '@vxe-ui/core'
-import { errLog } from './src/log'
 
-const { setConfig, setIcon, checkVersion } = VxeUI
+const { setConfig, setIcon } = VxeUI
 
 VxeUI.ganttVersion = process.env.VUE_APP_VXE_VERSION as string
 
@@ -49,6 +48,10 @@ setConfig({
     taskBarTooltipConfig: {
       enterable: true
     },
+    taskLinkConfig: {
+      enabled: true,
+      showArrow: true
+    },
     taskViewScaleConfig: {
       year: {
         valueFormat: ymdFormat
@@ -105,16 +108,6 @@ setIcon({
   GANTT_VIEW_RIGHT_CLOSE: iconPrefix + 'arrow-left'
 })
 
-const pVersion = 3
-const sVersion = 18
-if (checkVersion) {
-  if (!checkVersion(VxeUI.tableVersion, pVersion, sVersion)) {
-    errLog('vxe.error.errorVersion', [`vxe-table@${VxeUI.tableVersion || '?'}`, `vxe-table v${pVersion}.${sVersion}+`])
-  }
-} else {
-  errLog(`Requires vxe-table v${pVersion}.${sVersion}+`)
-}
-
 export {
   VxeUI
 }

package/packages/ui/src/depend.ts

@@ -0,0 +1,14 @@
+import { VxeUI } from '@vxe-ui/core'
+import { errLog } from './log'
+
+export function checkDependVersion () {
+  const pVersion = 3
+  const sVersion = 19
+  if (VxeUI.checkVersion) {
+    if (!VxeUI.checkVersion(VxeUI.tableVersion, pVersion, sVersion)) {
+      errLog('vxe.error.errorVersion', [`vxe-table@${VxeUI.tableVersion || '?'}`, `vxe-table v${pVersion}.${sVersion}+`])
+    }
+  } else {
+    errLog(`Requires vxe-table v${pVersion}.${sVersion}+`)
+  }
+}