fix: fix demo and support GanttDate in scrollToDate #INFR-4334

worktile · Aug 22, 2022 · 4f339d7 · 4f339d7
1 parent 71220d7
commit 4f339d7
Show file tree

Hide file tree

Showing 5 changed files with 17 additions and 19 deletions.
diff --git a/example/src/app/gantt/gantt.component.html b/example/src/app/gantt/gantt.component.html
@@ -11,9 +11,6 @@
       &nbsp; &nbsp; &nbsp;
       <thy-button thyType="primary" thySize="sm" (click)="print('gantt-example')"> ↓ 导出为图片 </thy-button>
       &nbsp; &nbsp; &nbsp;
-      <span>滚动到：</span>
-      <thy-date-picker [(ngModel)]="date" (ngModelChange)="dateChange($event)" [thyAllowClear]="false"> </thy-date-picker>
-      &nbsp; &nbsp; &nbsp;
       <span>基线对比：</span>
       <thy-switch class="baseline-switch" [(ngModel)]="isBaselineChecked" (ngModelChange)="switchChange()">基线对比 </thy-switch>
     </ng-template>

diff --git a/example/src/app/gantt/gantt.component.ts b/example/src/app/gantt/gantt.component.ts
@@ -1,4 +1,4 @@
-import { Component, OnInit, HostBinding, ViewChild } from '@angular/core';
+import { Component, OnInit, HostBinding, ViewChild, AfterViewInit } from '@angular/core';
 import {
     GanttBarClickEvent,
     GanttViewType,
@@ -21,7 +21,7 @@ import { randomItems, random } from '../helper';
     templateUrl: './gantt.component.html',
     providers: [GanttPrintService]
 })
-export class AppGanttExampleComponent implements OnInit {
+export class AppGanttExampleComponent implements OnInit, AfterViewInit {
     views = [
         {
             name: '日',
@@ -94,8 +94,6 @@ export class AppGanttExampleComponent implements OnInit {
         }
     };
 
-    date = new Date();
-
     @HostBinding('class.gantt-example-component') class = true;
 
     @ViewChild('gantt') ganttComponent: NgxGanttComponent;
@@ -109,6 +107,10 @@ export class AppGanttExampleComponent implements OnInit {
 
     ngOnInit(): void {}
 
+    ngAfterViewInit() {
+        setTimeout(() => this.ganttComponent.scrollToDate(1627729997), 200);
+    }
+
     barClick(event: GanttBarClickEvent) {
         this.thyNotify.info('Event: barClick', `你点击了 [${event.item.title}]`);
     }
@@ -141,14 +143,9 @@ export class AppGanttExampleComponent implements OnInit {
     }
 
     scrollToToday() {
-        this.date = new Date();
         this.ganttComponent.scrollToToday();
     }
 
-    dateChange(event: number) {
-        this.ganttComponent.scrollToDate(event);
-    }
-
     switchChange() {
         if (this.isBaselineChecked) {
             this.baselineItems = [

diff --git a/example/src/styles.scss b/example/src/styles.scss
@@ -61,8 +61,5 @@ $primary: #348fe4;
     .baseline-switch {
       display: flex;
     }
-    .thy-calendar-picker {
-      width: 120px;
-    }
   }
 }
diff --git a/packages/gantt/src/gantt.component.ts b/packages/gantt/src/gantt.component.ts
@@ -29,6 +29,7 @@ import { GANTT_ABSTRACT_TOKEN } from './gantt-abstract';
 import { defaultColumnWidth } from './components/table/gantt-table.component';
 import { GanttGlobalConfig, GANTT_GLOBAL_CONFIG } from './gantt.config';
 import { NgxGanttRootComponent } from './root.component';
+import { GanttDate } from './utils/date';
 @Component({
     selector: 'ngx-gantt',
     templateUrl: './gantt.component.html',
@@ -161,7 +162,7 @@ export class NgxGanttComponent extends GanttUpper implements OnInit, AfterViewIn
         this.ganttRoot.scrollToToday();
     }
 
-    scrollToDate(date: number) {
+    scrollToDate(date: number | GanttDate) {
         this.ganttRoot.scrollToDate(date);
     }
 }
diff --git a/packages/gantt/src/root.component.ts b/packages/gantt/src/root.component.ts
@@ -19,7 +19,7 @@ import { GanttUpper, GANTT_UPPER_TOKEN } from './gantt-upper';
 import { GanttPrintService } from './gantt-print.service';
 import { passiveListenerOptions } from './utils/passive-listeners';
 import { GanttDragBackdropComponent } from './components/drag-backdrop/drag-backdrop.component';
-import { GanttDate } from './public-api';
+import { GanttDate } from './utils/date';
 
 @Component({
     selector: 'ngx-gantt-root',
@@ -139,8 +139,14 @@ export class NgxGanttRootComponent implements OnInit, OnDestroy {
         this.dom.scrollMainContainer(x);
     }
 
-    public scrollToDate(date: number) {
-        const x = this.view.getXPointByDate(new GanttDate(date));
+    public scrollToDate(date: number | GanttDate) {
+        let x: number;
+        if (typeof date === 'number') {
+            x = this.view.getXPointByDate(new GanttDate(date));
+        } else {
+            x = this.view.getXPointByDate(date);
+        }
+
         this.dom.scrollMainContainer(x);
     }
 }