vxe-gantt 0.0.3 → 4.0.0-beta.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vxe-gantt",
-  "version": "0.0.3",
+  "version": "4.0.0-beta.0",
   "description": "A Gantt chart based on Vxe UI and for use on PC systems",
   "scripts": {
     "update": "npm install --legacy-peer-deps",

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

@@ -1,11 +1,14 @@
 import { h, inject, VNode, ref, Ref, onMounted, onUnmounted } from 'vue'
 import { defineVxeComponent } from '../../ui/src/comp'
+import { VxeUI } from '../../ui'
 import XEUtils from 'xe-utils'
 import { getCellRestHeight } from './util'
 
 import type { VxeTablePropTypes } from 'vxe-table'
 import type { VxeGanttViewConstructor, VxeGanttViewPrivateMethods, VxeGanttConstructor, VxeGanttPrivateMethods } from '../../../types'
 
+const { renderEmptyElement } = VxeUI
+
 export default defineVxeComponent({
   name: 'VxeGanttViewChart',
   setup () {
@@ -14,7 +17,7 @@ export default defineVxeComponent({
 
     const { reactData, internalData } = $xeGanttView
     const { refTable } = $xeGantt.getRefMaps()
-    const { computeProgressField } = $xeGantt.getComputeMaps()
+    const { computeProgressField, computeTaskBarOpts } = $xeGantt.getComputeMaps()
 
     const refElem = ref() as Ref<HTMLDivElement>
 
@@ -34,13 +37,15 @@ export default defineVxeComponent({
 
       const { tableData } = reactData
       const progressField = computeProgressField.value
+      const taskBarOpts = computeTaskBarOpts.value
+      const { showProgress } = taskBarOpts
 
       const trVNs:VNode[] = []
       tableData.forEach((row, rIndex) => {
         const rowid = $xeTable ? $xeTable.getRowid(row) : ''
         const rowRest = fullAllDataRowIdData[rowid] || {}
         const cellHeight = getCellRestHeight(rowRest, cellOpts, rowOpts, defaultRowHeight)
-        const progressValue = XEUtils.get(row, progressField)
+        const progressValue = showProgress ? XEUtils.get(row, progressField) : 0
         trVNs.push(
           h('div', {
             key: rIndex,
@@ -54,14 +59,14 @@ export default defineVxeComponent({
               class: 'vxe-gantt-view--chart-bar',
               rowid
             }, [
-              h('div', {
-                class: 'vxe-gantt-view--chart-progress',
-                style: progressValue
-                  ? {
-                      width: `${progressValue}%`
-                    }
-                  : undefined
-              }),
+              showProgress
+                ? h('div', {
+                  class: 'vxe-gantt-view--chart-progress',
+                  style: {
+                    width: `${progressValue || 0}%`
+                  }
+                })
+                : renderEmptyElement($xeGantt),
               h('div', {
                 class: 'vxe-gantt-view--chart-content'
               })

package/packages/gantt/src/gantt.ts

@@ -156,12 +156,12 @@ export default defineVxeComponent({
 
     const computeStartField = computed(() => {
       const taskOpts = computeTaskOpts.value
-      return taskOpts.startField || 'startDate'
+      return taskOpts.startField || 'start'
     })
 
     const computeEndField = computed(() => {
       const taskOpts = computeTaskOpts.value
-      return taskOpts.endField || 'endDate'
+      return taskOpts.endField || 'end'
     })
 
     const computeProgressField = computed(() => {

package/styles/components/gantt-module/gantt-chart.scss

@@ -11,7 +11,7 @@
   display: flex;
   flex-direction: row;
   position: absolute;
-  width: 100px;
+  width: 0;
   top: 50%;
   left: 0;
   color: #ffffff;