Merge pull request #2897 from VisActor/2892-bug-gantt-setRecords

2892 bug gantt set records
VisActor · Nov 26, 2024 · 1e41abc · 1e41abc
2 parents 1a2e2d4 + dbc7c51
commit 1e41abc
Show file tree

Hide file tree

Showing 6 changed files with 55 additions and 28 deletions.
diff --git a/common/changes/@visactor/vtable/2892-bug-gantt-setRecords_2024-11-22-09-44.json b/common/changes/@visactor/vtable/2892-bug-gantt-setRecords_2024-11-22-09-44.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "comment": "fix: when not set minDate maxDate call setRecords render error #2892\n\n",
+      "type": "none",
+      "packageName": "@visactor/vtable"
+    }
+  ],
+  "packageName": "@visactor/vtable",
+  "email": "[email protected]"
+}
diff --git a/packages/vtable-gantt/src/Gantt.ts b/packages/vtable-gantt/src/Gantt.ts
@@ -547,31 +547,35 @@ export class Gantt extends EventTarget {
   }
 
   _generateTimeLineDateMap() {
-    const startDate = createDateAtMidnight(this.parsedOptions.minDate);
-    const endDate = createDateAtMidnight(this.parsedOptions.maxDate);
-    let colWidthIncludeDays = 1000000;
-    // Iterate over each scale
-    for (const scale of this.parsedOptions.reverseSortedTimelineScales) {
-      // Generate the sub-columns for each step within the scale
-      const currentDate = createDateAtMidnight(startDate);
-      // const timelineDates: any[] = [];
-      scale.timelineDates = generateTimeLineDate(currentDate, endDate, scale);
-    }
+    if (this.parsedOptions.minDate && this.parsedOptions.maxDate) {
+      const startDate = createDateAtMidnight(this.parsedOptions.minDate);
+      const endDate = createDateAtMidnight(this.parsedOptions.maxDate);
+      let colWidthIncludeDays = 1000000;
+      // Iterate over each scale
+      for (const scale of this.parsedOptions.reverseSortedTimelineScales) {
+        // Generate the sub-columns for each step within the scale
+        const currentDate = createDateAtMidnight(startDate);
+        // const timelineDates: any[] = [];
+        scale.timelineDates = generateTimeLineDate(currentDate, endDate, scale);
+      }
 
-    const firstScale = this.parsedOptions.reverseSortedTimelineScales[0];
-    const { unit, step } = firstScale;
-    if (unit === 'day') {
-      colWidthIncludeDays = step;
-    } else if (unit === 'month') {
-      colWidthIncludeDays = 30;
-    } else if (unit === 'week') {
-      colWidthIncludeDays = 7;
-    } else if (unit === 'quarter') {
-      colWidthIncludeDays = 90;
-    } else if (unit === 'year') {
-      colWidthIncludeDays = 365;
+      const firstScale = this.parsedOptions.reverseSortedTimelineScales[0];
+      const { unit, step } = firstScale;
+      if (unit === 'day') {
+        colWidthIncludeDays = step;
+      } else if (unit === 'month') {
+        colWidthIncludeDays = 30;
+      } else if (unit === 'week') {
+        colWidthIncludeDays = 7;
+      } else if (unit === 'quarter') {
+        colWidthIncludeDays = 90;
+      } else if (unit === 'year') {
+        colWidthIncludeDays = 365;
+      }
+      this.parsedOptions.colWidthPerDay = this.parsedOptions.timelineColWidth / colWidthIncludeDays;
+    } else {
+      this.parsedOptions.colWidthPerDay = 0;
     }
-    this.parsedOptions.colWidthPerDay = this.parsedOptions.timelineColWidth / colWidthIncludeDays;
   }
   getAllRowsHeight() {
     return this.getAllHeaderRowsHeight() + this.itemCount * this.parsedOptions.rowHeight;
@@ -758,10 +762,14 @@ export class Gantt extends EventTarget {
   }
   setRecords(records: any[]) {
     this.records = records;
+    this.data.setRecords(records);
     this.taskListTableInstance.setRecords(records);
     this._syncPropsFromTable();
+    this._generateTimeLineDateMap();
+    this.timeLineHeaderLevel = this.parsedOptions.sortedTimelineScales.length;
+    this._updateSize();
+    this.scenegraph.refreshAll();
     this.verticalSplitResizeLine.style.height = this.drawHeight + 'px'; //'100%';
-    this.scenegraph.refreshTaskBarsAndGrid();
     const left = this.stateManager.scroll.horizontalBarPos;
     const top = this.stateManager.scroll.verticalBarPos;
     this.scenegraph.setX(-left);
@@ -791,7 +799,7 @@ export class Gantt extends EventTarget {
   }
   /** 滚动到scrollToMarkLineDate所指向的日期 */
   _scrollToMarkLine() {
-    if (this.parsedOptions.scrollToMarkLineDate) {
+    if (this.parsedOptions.scrollToMarkLineDate && this.parsedOptions.minDate) {
       const minDate = this.parsedOptions.minDate;
       const targetDayDistance =
         ((this.parsedOptions.scrollToMarkLineDate.getTime() - minDate.getTime()) / (1000 * 60 * 60 * 24)) *

diff --git a/packages/vtable-gantt/src/data/DataSource.ts b/packages/vtable-gantt/src/data/DataSource.ts
@@ -19,7 +19,7 @@ export class DataSource {
 
     let minDate = Number.MAX_SAFE_INTEGER;
     let maxDate = Number.MIN_SAFE_INTEGER;
-    if (needMinDate || needMaxDate) {
+    if ((needMinDate || needMaxDate) && this.records.length) {
       for (let i = 0; i < this.records.length; i++) {
         const record = this.records[i];
         if (needMinDate) {
@@ -40,4 +40,8 @@ export class DataSource {
       this._gantt.parsedOptions._maxDateTime = this._gantt.parsedOptions.maxDate.getTime();
     }
   }
+  setRecords(records: any[]) {
+    this.records = records;
+    this.processRecords();
+  }
 }
diff --git a/packages/vtable-gantt/src/scenegraph/grid.ts b/packages/vtable-gantt/src/scenegraph/grid.ts
@@ -93,7 +93,7 @@ export class Grid {
       if (this.gridStyle?.verticalLine.lineWidth & 1) {
         x = 0.5;
       }
-      for (let i = 0; i < this.timelineDates.length - 1; i++) {
+      for (let i = 0; i < this.timelineDates?.length - 1; i++) {
         const dateline = this.timelineDates[i];
         x = x + Math.floor(this.colWidthPerDay * dateline.days);
         const line = createLine({

diff --git a/packages/vtable-gantt/src/scenegraph/scenegraph.ts b/packages/vtable-gantt/src/scenegraph/scenegraph.ts
@@ -125,11 +125,14 @@ export class Scenegraph {
 
   refreshAll() {
     this.tableGroupHeight = Math.min(this._gantt.tableNoFrameHeight, this._gantt.drawHeight);
+    this.tableGroupWidth = this._gantt.tableNoFrameWidth;
     this.tableGroup.setAttribute('height', this.tableGroupHeight);
+    this.tableGroup.setAttribute('width', this.tableGroupWidth);
     this.timelineHeader.refresh();
     this.grid.refresh();
     this.taskBar.refresh();
     this.markLine.refresh();
+    this.dependencyLink.refresh();
     this.frameBorder.resize();
     this.scrollbarComponent.updateScrollBar();
     this.updateNextFrame();
@@ -160,6 +163,7 @@ export class Scenegraph {
 
   updateTableSize() {
     this.tableGroupHeight = Math.min(this._gantt.tableNoFrameHeight, this._gantt.drawHeight);
+    this.tableGroupWidth = this._gantt.tableNoFrameWidth;
     this.tableGroup.setAttributes({
       x: this._gantt.tableX,
       y: this._gantt.tableY,

diff --git a/packages/vtable-gantt/src/scenegraph/timeline-header.ts b/packages/vtable-gantt/src/scenegraph/timeline-header.ts
@@ -42,7 +42,7 @@ export class TimelineHeader {
 
       const { unit, timelineDates, customLayout } = scene._gantt.parsedOptions.sortedTimelineScales[i];
       let x = 0;
-      for (let j = 0; j < timelineDates.length; j++) {
+      for (let j = 0; j < timelineDates?.length; j++) {
         const { days, endDate, startDate, title, dateIndex } = timelineDates[j];
         const date = new Group({
           x,