@worktile/gantt 19.0.6 → 19.0.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/class/date-point.d.ts +2 -1
- package/components/calendar/calendar.scss +8 -3
- package/components/scrollbar/scrollbar.component.d.ts +5 -4
- package/fesm2022/worktile-gantt.mjs +40 -19
- package/fesm2022/worktile-gantt.mjs.map +1 -1
- package/gantt.component.d.ts +4 -0
- package/gantt.component.scss +0 -1
- package/package.json +1 -1
- package/views/day.d.ts +0 -1
- package/views/hour.d.ts +0 -1
- package/views/view.d.ts +0 -1
package/class/date-point.d.ts
CHANGED
|
@@ -9,8 +9,9 @@ export declare class GanttDatePoint {
|
|
|
9
9
|
isToday: boolean;
|
|
10
10
|
};
|
|
11
11
|
style?: Partial<CSSStyleDeclaration>;
|
|
12
|
+
fill?: string;
|
|
12
13
|
constructor(start: GanttDate, text: string, x: number, y: number | string, additions?: {
|
|
13
14
|
isWeekend: boolean;
|
|
14
15
|
isToday: boolean;
|
|
15
|
-
}, style?: Partial<CSSStyleDeclaration
|
|
16
|
+
}, style?: Partial<CSSStyleDeclaration>, fill?: string);
|
|
16
17
|
}
|
|
@@ -7,9 +7,7 @@
|
|
|
7
7
|
|
|
8
8
|
svg {
|
|
9
9
|
position: relative;
|
|
10
|
-
z-index: 2;
|
|
11
10
|
background-color: variables.$gantt-bg-color;
|
|
12
|
-
overflow: visible;
|
|
13
11
|
}
|
|
14
12
|
line {
|
|
15
13
|
shape-rendering: crispEdges;
|
|
@@ -75,9 +73,16 @@
|
|
|
75
73
|
.gantt-calendar-grid {
|
|
76
74
|
position: absolute;
|
|
77
75
|
width: 100%;
|
|
78
|
-
|
|
76
|
+
svg {
|
|
79
77
|
background-color: transparent;
|
|
80
78
|
}
|
|
79
|
+
.gantt-calendar-grid-fill {
|
|
80
|
+
position: absolute;
|
|
81
|
+
top: 0;
|
|
82
|
+
}
|
|
83
|
+
.gantt-calendar-grid-main {
|
|
84
|
+
z-index: 2;
|
|
85
|
+
}
|
|
81
86
|
|
|
82
87
|
.secondary-line {
|
|
83
88
|
stroke-dasharray: 2px 5px;
|
|
@@ -3,10 +3,11 @@ import { NgxGanttRootComponent } from '../../root.component';
|
|
|
3
3
|
import * as i0 from "@angular/core";
|
|
4
4
|
export declare class GanttScrollbarComponent {
|
|
5
5
|
ganttUpper: GanttUpper;
|
|
6
|
-
hasFooter: boolean
|
|
7
|
-
tableWidth: number
|
|
8
|
-
ganttRoot: NgxGanttRootComponent
|
|
6
|
+
hasFooter: import("@angular/core").InputSignal<boolean>;
|
|
7
|
+
tableWidth: import("@angular/core").InputSignal<number>;
|
|
8
|
+
ganttRoot: import("@angular/core").InputSignal<NgxGanttRootComponent>;
|
|
9
|
+
tableScrollWidth: import("@angular/core").InputSignal<number>;
|
|
9
10
|
constructor(ganttUpper: GanttUpper);
|
|
10
11
|
static ɵfac: i0.ɵɵFactoryDeclaration<GanttScrollbarComponent, never>;
|
|
11
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<GanttScrollbarComponent, "gantt-scrollbar", never, { "hasFooter": { "alias": "hasFooter"; "required": false; }; "tableWidth": { "alias": "tableWidth"; "required": false; }; "ganttRoot": { "alias": "ganttRoot"; "required": false; }; }, {}, never, never, true, never>;
|
|
12
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<GanttScrollbarComponent, "gantt-scrollbar", never, { "hasFooter": { "alias": "hasFooter"; "required": false; "isSignal": true; }; "tableWidth": { "alias": "tableWidth"; "required": false; "isSignal": true; }; "ganttRoot": { "alias": "ganttRoot"; "required": false; "isSignal": true; }; "tableScrollWidth": { "alias": "tableScrollWidth"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
12
13
|
}
|
|
@@ -16,13 +16,16 @@ import { coerceBooleanProperty, coerceCssPixelValue } from '@angular/cdk/coercio
|
|
|
16
16
|
import { __decorate, __param } from 'tslib';
|
|
17
17
|
|
|
18
18
|
class GanttDatePoint {
|
|
19
|
-
constructor(start, text, x, y, additions, style
|
|
19
|
+
constructor(start, text, x, y, additions, style,
|
|
20
|
+
// set fill color
|
|
21
|
+
fill) {
|
|
20
22
|
this.start = start;
|
|
21
23
|
this.text = text;
|
|
22
24
|
this.x = x;
|
|
23
25
|
this.y = y;
|
|
24
26
|
this.additions = additions;
|
|
25
27
|
this.style = style;
|
|
28
|
+
this.fill = fill;
|
|
26
29
|
}
|
|
27
30
|
}
|
|
28
31
|
|
|
@@ -960,7 +963,6 @@ const viewOptions$3 = {
|
|
|
960
963
|
class GanttViewDay extends GanttView {
|
|
961
964
|
constructor(start, end, options) {
|
|
962
965
|
super(start, end, Object.assign({}, viewOptions$3, options));
|
|
963
|
-
this.showWeekBackdrop = true;
|
|
964
966
|
this.showTimeline = false;
|
|
965
967
|
this.viewType = GanttViewType.day;
|
|
966
968
|
}
|
|
@@ -1111,7 +1113,6 @@ const viewOptions = {
|
|
|
1111
1113
|
class GanttViewHour extends GanttView {
|
|
1112
1114
|
constructor(start, end, options) {
|
|
1113
1115
|
super(start, end, Object.assign({}, viewOptions, options));
|
|
1114
|
-
this.showWeekBackdrop = true;
|
|
1115
1116
|
this.showTimeline = true;
|
|
1116
1117
|
this.viewType = GanttViewType.hour;
|
|
1117
1118
|
}
|
|
@@ -2820,11 +2821,11 @@ class GanttCalendarGridComponent {
|
|
|
2820
2821
|
this.unsubscribe$.complete();
|
|
2821
2822
|
}
|
|
2822
2823
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: GanttCalendarGridComponent, deps: [{ token: GANTT_UPPER_TOKEN }, { token: i0.NgZone }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2823
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.3", type: GanttCalendarGridComponent, isStandalone: true, selector: "gantt-calendar-grid", host: { properties: { "class": "this.className" } }, ngImport: i0, template: "<div class=\"gantt-calendar-today-overlay\" [style.width.px]=\"view.width\">\n @if (ganttUpper.showTodayLine) {\n
|
|
2824
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.3", type: GanttCalendarGridComponent, isStandalone: true, selector: "gantt-calendar-grid", host: { properties: { "class": "this.className" } }, ngImport: i0, template: "<div class=\"gantt-calendar-today-overlay\" [style.width.px]=\"view.width\">\n @if (ganttUpper.showTodayLine) {\n <span class=\"today-line\"> </span>\n }\n</div>\n<svg class=\"gantt-calendar-grid-fill\" [attr.width]=\"view.width\" [attr.height]=\"1\">\n <g>\n @for (point of view.secondaryDatePoints; track point.x) {\n @if (point.fill) {\n <rect [attr.x]=\"$index * view.cellWidth\" y=\"0\" [attr.width]=\"view.cellWidth\" [attr.height]=\"mainHeight\" [attr.fill]=\"point.fill\" />\n }\n }\n </g>\n</svg>\n\n<svg class=\"gantt-calendar-grid-main\" [attr.width]=\"view.width\" [attr.height]=\"ganttUpper.styles.headerHeight - 1\">\n <g>\n @if (view.showTimeline) {\n <g>\n @for (point of view.secondaryDatePoints; track point.x) {\n <line\n [attr.x1]=\"($index + 1) * view.cellWidth\"\n [attr.x2]=\"($index + 1) * view.cellWidth\"\n [attr.y1]=\"0\"\n [attr.y2]=\"mainHeight\"\n class=\"secondary-line\"\n ></line>\n }\n </g>\n }\n <g>\n @for (point of view.primaryDatePoints; track point.x) {\n <line\n [attr.x1]=\"($index + 1) * view.primaryWidth\"\n [attr.x2]=\"($index + 1) * view.primaryWidth\"\n [attr.y1]=\"0\"\n [attr.y2]=\"mainHeight\"\n class=\"primary-line\"\n ></line>\n }\n </g>\n </g>\n</svg>\n" }); }
|
|
2824
2825
|
}
|
|
2825
2826
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: GanttCalendarGridComponent, decorators: [{
|
|
2826
2827
|
type: Component,
|
|
2827
|
-
args: [{ selector: 'gantt-calendar-grid', standalone: true, template: "<div class=\"gantt-calendar-today-overlay\" [style.width.px]=\"view.width\">\n @if (ganttUpper.showTodayLine) {\n
|
|
2828
|
+
args: [{ selector: 'gantt-calendar-grid', standalone: true, template: "<div class=\"gantt-calendar-today-overlay\" [style.width.px]=\"view.width\">\n @if (ganttUpper.showTodayLine) {\n <span class=\"today-line\"> </span>\n }\n</div>\n<svg class=\"gantt-calendar-grid-fill\" [attr.width]=\"view.width\" [attr.height]=\"1\">\n <g>\n @for (point of view.secondaryDatePoints; track point.x) {\n @if (point.fill) {\n <rect [attr.x]=\"$index * view.cellWidth\" y=\"0\" [attr.width]=\"view.cellWidth\" [attr.height]=\"mainHeight\" [attr.fill]=\"point.fill\" />\n }\n }\n </g>\n</svg>\n\n<svg class=\"gantt-calendar-grid-main\" [attr.width]=\"view.width\" [attr.height]=\"ganttUpper.styles.headerHeight - 1\">\n <g>\n @if (view.showTimeline) {\n <g>\n @for (point of view.secondaryDatePoints; track point.x) {\n <line\n [attr.x1]=\"($index + 1) * view.cellWidth\"\n [attr.x2]=\"($index + 1) * view.cellWidth\"\n [attr.y1]=\"0\"\n [attr.y2]=\"mainHeight\"\n class=\"secondary-line\"\n ></line>\n }\n </g>\n }\n <g>\n @for (point of view.primaryDatePoints; track point.x) {\n <line\n [attr.x1]=\"($index + 1) * view.primaryWidth\"\n [attr.x2]=\"($index + 1) * view.primaryWidth\"\n [attr.y1]=\"0\"\n [attr.y2]=\"mainHeight\"\n class=\"primary-line\"\n ></line>\n }\n </g>\n </g>\n</svg>\n" }]
|
|
2828
2829
|
}], ctorParameters: () => [{ type: GanttUpper, decorators: [{
|
|
2829
2830
|
type: Inject,
|
|
2830
2831
|
args: [GANTT_UPPER_TOKEN]
|
|
@@ -2876,11 +2877,11 @@ class GanttCalendarHeaderComponent {
|
|
|
2876
2877
|
}
|
|
2877
2878
|
}
|
|
2878
2879
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: GanttCalendarHeaderComponent, deps: [{ token: GANTT_UPPER_TOKEN }, { token: i0.NgZone }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2879
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.3", type: GanttCalendarHeaderComponent, isStandalone: true, selector: "gantt-calendar-header", host: { properties: { "class": "this.className", "style.height": "this.height" } }, ngImport: i0, template: "<div class=\"gantt-calendar-today-overlay\" [style.width.px]=\"view.width\">\n <span class=\"today-rect\" [hidden]=\"ganttUpper.viewType !== viewTypes.day\"> </span>\n</div>\n<svg [attr.width]=\"view.width\" [attr.height]=\"ganttUpper.styles.headerHeight\">\n <g>\n @for (point of view.
|
|
2880
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.3", type: GanttCalendarHeaderComponent, isStandalone: true, selector: "gantt-calendar-header", host: { properties: { "class": "this.className", "style.height": "this.height" } }, ngImport: i0, template: "<div class=\"gantt-calendar-today-overlay\" [style.width.px]=\"view.width\">\n <span class=\"today-rect\" [hidden]=\"ganttUpper.viewType !== viewTypes.day\"> </span>\n</div>\n<svg [attr.width]=\"view.width\" [attr.height]=\"ganttUpper.styles.headerHeight\">\n <g>\n @for (point of view.secondaryDatePoints; track point.x) {\n @if (point.fill) {\n <rect\n [attr.x]=\"$index * view.cellWidth\"\n y=\"0\"\n [attr.width]=\"view.cellWidth\"\n [attr.height]=\"ganttUpper.styles.headerHeight\"\n [attr.fill]=\"point.fill\"\n />\n }\n <text\n class=\"secondary-text\"\n [ngStyle]=\"point.style\"\n [class.today]=\"point.additions?.isToday\"\n [class.weekend]=\"point.additions?.isWeekend\"\n [attr.x]=\"point.x\"\n [attr.y]=\"point.y\"\n >\n {{ point.text }}\n </text>\n }\n\n @for (point of view.primaryDatePoints; track point.x) {\n <text\n class=\"primary-text\"\n [ngStyle]=\"point.style\"\n [class.today]=\"point.additions?.isToday\"\n [class.weekend]=\"point.additions?.isWeekend\"\n [attr.x]=\"point.x\"\n [attr.y]=\"point.y\"\n >\n {{ point.text }}\n </text>\n }\n\n <g>\n @for (point of view.primaryDatePoints; track point.x) {\n <line\n [attr.x1]=\"($index + 1) * view.primaryWidth\"\n [attr.x2]=\"($index + 1) * view.primaryWidth\"\n [attr.y1]=\"0\"\n [attr.y2]=\"ganttUpper.styles.headerHeight\"\n class=\"primary-line\"\n ></line>\n }\n </g>\n\n <g>\n <line\n [attr.x1]=\"0\"\n [attr.x2]=\"view.width\"\n [attr.y1]=\"ganttUpper.styles.headerHeight\"\n [attr.y2]=\"ganttUpper.styles.headerHeight\"\n class=\"header-line\"\n ></line>\n </g>\n </g>\n</svg>\n", dependencies: [{ kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] }); }
|
|
2880
2881
|
}
|
|
2881
2882
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: GanttCalendarHeaderComponent, decorators: [{
|
|
2882
2883
|
type: Component,
|
|
2883
|
-
args: [{ selector: 'gantt-calendar-header', imports: [NgStyle], template: "<div class=\"gantt-calendar-today-overlay\" [style.width.px]=\"view.width\">\n <span class=\"today-rect\" [hidden]=\"ganttUpper.viewType !== viewTypes.day\"> </span>\n</div>\n<svg [attr.width]=\"view.width\" [attr.height]=\"ganttUpper.styles.headerHeight\">\n <g>\n @for (point of view.
|
|
2884
|
+
args: [{ selector: 'gantt-calendar-header', imports: [NgStyle], template: "<div class=\"gantt-calendar-today-overlay\" [style.width.px]=\"view.width\">\n <span class=\"today-rect\" [hidden]=\"ganttUpper.viewType !== viewTypes.day\"> </span>\n</div>\n<svg [attr.width]=\"view.width\" [attr.height]=\"ganttUpper.styles.headerHeight\">\n <g>\n @for (point of view.secondaryDatePoints; track point.x) {\n @if (point.fill) {\n <rect\n [attr.x]=\"$index * view.cellWidth\"\n y=\"0\"\n [attr.width]=\"view.cellWidth\"\n [attr.height]=\"ganttUpper.styles.headerHeight\"\n [attr.fill]=\"point.fill\"\n />\n }\n <text\n class=\"secondary-text\"\n [ngStyle]=\"point.style\"\n [class.today]=\"point.additions?.isToday\"\n [class.weekend]=\"point.additions?.isWeekend\"\n [attr.x]=\"point.x\"\n [attr.y]=\"point.y\"\n >\n {{ point.text }}\n </text>\n }\n\n @for (point of view.primaryDatePoints; track point.x) {\n <text\n class=\"primary-text\"\n [ngStyle]=\"point.style\"\n [class.today]=\"point.additions?.isToday\"\n [class.weekend]=\"point.additions?.isWeekend\"\n [attr.x]=\"point.x\"\n [attr.y]=\"point.y\"\n >\n {{ point.text }}\n </text>\n }\n\n <g>\n @for (point of view.primaryDatePoints; track point.x) {\n <line\n [attr.x1]=\"($index + 1) * view.primaryWidth\"\n [attr.x2]=\"($index + 1) * view.primaryWidth\"\n [attr.y1]=\"0\"\n [attr.y2]=\"ganttUpper.styles.headerHeight\"\n class=\"primary-line\"\n ></line>\n }\n </g>\n\n <g>\n <line\n [attr.x1]=\"0\"\n [attr.x2]=\"view.width\"\n [attr.y1]=\"ganttUpper.styles.headerHeight\"\n [attr.y2]=\"ganttUpper.styles.headerHeight\"\n class=\"header-line\"\n ></line>\n </g>\n </g>\n</svg>\n" }]
|
|
2884
2885
|
}], ctorParameters: () => [{ type: GanttUpper, decorators: [{
|
|
2885
2886
|
type: Inject,
|
|
2886
2887
|
args: [GANTT_UPPER_TOKEN]
|
|
@@ -4195,24 +4196,21 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImpor
|
|
|
4195
4196
|
class GanttScrollbarComponent {
|
|
4196
4197
|
constructor(ganttUpper) {
|
|
4197
4198
|
this.ganttUpper = ganttUpper;
|
|
4198
|
-
this.hasFooter = false;
|
|
4199
|
+
this.hasFooter = input(false);
|
|
4200
|
+
this.tableWidth = input();
|
|
4201
|
+
this.ganttRoot = input();
|
|
4202
|
+
this.tableScrollWidth = input(0);
|
|
4199
4203
|
}
|
|
4200
4204
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: GanttScrollbarComponent, deps: [{ token: GANTT_UPPER_TOKEN }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4201
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
4205
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.3", type: GanttScrollbarComponent, isStandalone: true, selector: "gantt-scrollbar", inputs: { hasFooter: { classPropertyName: "hasFooter", publicName: "hasFooter", isSignal: true, isRequired: false, transformFunction: null }, tableWidth: { classPropertyName: "tableWidth", publicName: "tableWidth", isSignal: true, isRequired: false, transformFunction: null }, ganttRoot: { classPropertyName: "ganttRoot", publicName: "ganttRoot", isSignal: true, isRequired: false, transformFunction: null }, tableScrollWidth: { classPropertyName: "tableScrollWidth", publicName: "tableScrollWidth", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div\n class=\"gantt-scrollbar\"\n [ngClass]=\"{ 'gantt-scrollbar-bg': hasFooter() }\"\n [style.height.px]=\"ganttRoot()?.horizontalScrollbarHeight + 1\"\n [style.right.px]=\"ganttRoot()?.verticalScrollbarWidth\"\n>\n <div\n class=\"gantt-table-scrollbar\"\n syncScrollX=\"ganttTableXScroll\"\n [class.with-scrollbar]=\"ganttRoot()?.horizontalScrollbarHeight\"\n [style.width.px]=\"tableWidth()\"\n >\n <div class=\"h-100\" [style.width.px]=\"tableScrollWidth() - 1\"></div>\n </div>\n <div class=\"gantt-main-scrollbar\" syncScrollX=\"ganttMainXScroll\">\n <div class=\"h-100\" [style.width.px]=\"ganttRoot()['view']?.width\"></div>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: GanttSyncScrollXDirective, selector: "[syncScrollX]", inputs: ["syncScrollX"] }] }); }
|
|
4202
4206
|
}
|
|
4203
4207
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: GanttScrollbarComponent, decorators: [{
|
|
4204
4208
|
type: Component,
|
|
4205
|
-
args: [{ selector: 'gantt-scrollbar', imports: [NgClass, GanttSyncScrollXDirective], template: "<div\n class=\"gantt-scrollbar\"\n [ngClass]=\"{ 'gantt-scrollbar-bg': hasFooter }\"\n [style.height.px]=\"ganttRoot?.horizontalScrollbarHeight + 1\"\n [style.right.px]=\"ganttRoot?.verticalScrollbarWidth\"\n>\n <div\n class=\"gantt-table-scrollbar\"\n syncScrollX=\"ganttTableXScroll\"\n [class.with-scrollbar]=\"ganttRoot?.horizontalScrollbarHeight\"\n [style.width.px]=\"tableWidth\"\n >\n <div class=\"h-100\" [style.width.px]=\"
|
|
4209
|
+
args: [{ selector: 'gantt-scrollbar', imports: [NgClass, GanttSyncScrollXDirective], template: "<div\n class=\"gantt-scrollbar\"\n [ngClass]=\"{ 'gantt-scrollbar-bg': hasFooter() }\"\n [style.height.px]=\"ganttRoot()?.horizontalScrollbarHeight + 1\"\n [style.right.px]=\"ganttRoot()?.verticalScrollbarWidth\"\n>\n <div\n class=\"gantt-table-scrollbar\"\n syncScrollX=\"ganttTableXScroll\"\n [class.with-scrollbar]=\"ganttRoot()?.horizontalScrollbarHeight\"\n [style.width.px]=\"tableWidth()\"\n >\n <div class=\"h-100\" [style.width.px]=\"tableScrollWidth() - 1\"></div>\n </div>\n <div class=\"gantt-main-scrollbar\" syncScrollX=\"ganttMainXScroll\">\n <div class=\"h-100\" [style.width.px]=\"ganttRoot()['view']?.width\"></div>\n </div>\n</div>\n" }]
|
|
4206
4210
|
}], ctorParameters: () => [{ type: GanttUpper, decorators: [{
|
|
4207
4211
|
type: Inject,
|
|
4208
4212
|
args: [GANTT_UPPER_TOKEN]
|
|
4209
|
-
}] }]
|
|
4210
|
-
type: Input
|
|
4211
|
-
}], tableWidth: [{
|
|
4212
|
-
type: Input
|
|
4213
|
-
}], ganttRoot: [{
|
|
4214
|
-
type: Input
|
|
4215
|
-
}] } });
|
|
4213
|
+
}] }] });
|
|
4216
4214
|
|
|
4217
4215
|
class GanttPrintService {
|
|
4218
4216
|
constructor() { }
|
|
@@ -4592,6 +4590,7 @@ class NgxGanttComponent extends GanttUpper {
|
|
|
4592
4590
|
this.lineClick = new EventEmitter();
|
|
4593
4591
|
this.selectedChange = new EventEmitter();
|
|
4594
4592
|
this.virtualScrolledIndexChange = new EventEmitter();
|
|
4593
|
+
this.tableScrollWidth = signal(0);
|
|
4595
4594
|
this.flatItems = [];
|
|
4596
4595
|
this.viewportItems = [];
|
|
4597
4596
|
this._loading = false;
|
|
@@ -4651,6 +4650,7 @@ class NgxGanttComponent extends GanttUpper {
|
|
|
4651
4650
|
this.computeTempDataRefs();
|
|
4652
4651
|
});
|
|
4653
4652
|
}
|
|
4653
|
+
this.initScrollContainerObserver();
|
|
4654
4654
|
}
|
|
4655
4655
|
ngAfterViewChecked() {
|
|
4656
4656
|
if (this.virtualScrollEnabled && this.viewportRuler && this.virtualScroll.getRenderedRange().end > 0) {
|
|
@@ -4816,6 +4816,27 @@ class NgxGanttComponent extends GanttUpper {
|
|
|
4816
4816
|
this.table.dragEnded.emit(event);
|
|
4817
4817
|
this.draggingItem = null;
|
|
4818
4818
|
}
|
|
4819
|
+
initScrollContainerObserver() {
|
|
4820
|
+
if (this.ganttTableBody && this.ganttTableBody['elementRef']?.nativeElement) {
|
|
4821
|
+
this.tableScrollWidth.set(this.ganttTableBody['elementRef'].nativeElement.clientWidth);
|
|
4822
|
+
if (typeof ResizeObserver !== 'undefined') {
|
|
4823
|
+
this.resizeObserver = new ResizeObserver((entries) => {
|
|
4824
|
+
const newWidth = entries[0].target.clientWidth;
|
|
4825
|
+
if (this.tableScrollWidth() !== newWidth) {
|
|
4826
|
+
this.tableScrollWidth.set(newWidth);
|
|
4827
|
+
this.cdr.markForCheck();
|
|
4828
|
+
}
|
|
4829
|
+
});
|
|
4830
|
+
this.resizeObserver.observe(this.ganttTableBody['elementRef'].nativeElement);
|
|
4831
|
+
}
|
|
4832
|
+
}
|
|
4833
|
+
}
|
|
4834
|
+
ngOnDestroy() {
|
|
4835
|
+
super.ngOnDestroy();
|
|
4836
|
+
if (this.resizeObserver) {
|
|
4837
|
+
this.resizeObserver.disconnect();
|
|
4838
|
+
}
|
|
4839
|
+
}
|
|
4819
4840
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: NgxGanttComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i0.NgZone }, { token: i1$1.ViewportRuler }, { token: GANTT_GLOBAL_CONFIG }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4820
4841
|
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.3", type: NgxGanttComponent, isStandalone: true, selector: "ngx-gantt", inputs: { maxLevel: "maxLevel", async: "async", childrenResolve: "childrenResolve", linkable: "linkable", loading: "loading", virtualScrollEnabled: "virtualScrollEnabled", loadingDelay: "loadingDelay" }, outputs: { linkDragStarted: "linkDragStarted", linkDragEnded: "linkDragEnded", lineClick: "lineClick", selectedChange: "selectedChange", virtualScrolledIndexChange: "virtualScrolledIndexChange" }, providers: [
|
|
4821
4842
|
{
|
|
@@ -4826,7 +4847,7 @@ class NgxGanttComponent extends GanttUpper {
|
|
|
4826
4847
|
provide: GANTT_ABSTRACT_TOKEN,
|
|
4827
4848
|
useExisting: forwardRef(() => NgxGanttComponent)
|
|
4828
4849
|
}
|
|
4829
|
-
], queries: [{ propertyName: "table", first: true, predicate: NgxGanttTableComponent, descendants: true }, { propertyName: "tableEmptyTemplate", first: true, predicate: ["tableEmpty"], descendants: true, static: true }, { propertyName: "footerTemplate", first: true, predicate: ["footer"], descendants: true, static: true }, { propertyName: "columns", predicate: NgxGanttTableColumnComponent, descendants: true }], viewQueries: [{ propertyName: "ganttRoot", first: true, predicate: ["ganttRoot"], descendants: true }, { propertyName: "virtualScroll", first: true, predicate: CdkVirtualScrollViewport, descendants: true }, { propertyName: "ganttTableBody", first: true, predicate: ["ganttTableBody"], descendants: true, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ngx-gantt-root #ganttRoot>\n <div class=\"gantt-header\">\n <gantt-table-header #tableHeader [columns]=\"columns\"></gantt-table-header>\n <div class=\"gantt-container-header\">\n <gantt-calendar-header\n syncScrollX=\"ganttMainXScroll\"\n [style.padding-right.px]=\"ganttRoot.verticalScrollbarWidth\"\n ></gantt-calendar-header>\n </div>\n </div>\n @if (loading) {\n <gantt-loader></gantt-loader>\n }\n\n <cdk-virtual-scroll-viewport\n class=\"gantt-virtual-scroll-viewport\"\n [ngClass]=\"{\n 'gantt-normal-viewport': !virtualScrollEnabled,\n 'gantt-scroll-container': virtualScrollEnabled,\n 'with-footer': table?.tableFooterTemplate || footerTemplate\n }\"\n [style.top.px]=\"styles.headerHeight\"\n [itemSize]=\"styles.lineHeight\"\n [minBufferPx]=\"styles.lineHeight * 10\"\n [maxBufferPx]=\"styles.lineHeight * 20\"\n (scrolledIndexChange)=\"scrolledIndexChange($event)\"\n >\n <ng-container *cdkVirtualFor=\"let item of flatItems; trackBy: trackBy\"></ng-container>\n <div class=\"gantt-side\" [style.width.px]=\"tableHeader.tableWidth + 1\" [style.padding-bottom.px]=\"ganttRoot.horizontalScrollbarHeight\">\n <div class=\"gantt-side-container\" syncScrollX=\"ganttTableXScroll\" syncScrollY=\"ganttMainYScroll\">\n <div class=\"gantt-table\">\n <gantt-table-body\n #ganttTableBody\n [flatItems]=\"flatItems\"\n [viewportItems]=\"viewportItems\"\n [columns]=\"columns\"\n [groupTemplate]=\"groupTemplate\"\n [emptyTemplate]=\"table.tableEmptyTemplate || tableEmptyTemplate\"\n [rowBeforeTemplate]=\"table?.rowBeforeTemplate\"\n [rowAfterTemplate]=\"table?.rowAfterTemplate\"\n [draggable]=\"table.draggable\"\n [dropEnterPredicate]=\"table.dropEnterPredicate\"\n (dragDropped)=\"table.dragDropped.emit($event)\"\n (dragStarted)=\"itemDragStarted($event)\"\n (dragEnded)=\"itemDragEnded($event)\"\n (itemClick)=\"selectItem($event)\"\n >\n </gantt-table-body>\n </div>\n </div>\n </div>\n <div class=\"gantt-container\">\n <gantt-calendar-grid\n syncScrollX=\"ganttMainXScroll\"\n [style.padding-right.px]=\"ganttRoot.verticalScrollbarWidth\"\n [style.padding-bottom.px]=\"ganttRoot.horizontalScrollbarHeight\"\n ></gantt-calendar-grid>\n <div class=\"gantt-main\">\n <gantt-main\n syncScrollX=\"ganttMainXScroll\"\n syncScrollY=\"ganttMainYScroll\"\n [ganttRoot]=\"ganttRoot\"\n [flatItems]=\"flatItems\"\n [viewportItems]=\"viewportItems\"\n [groupHeaderTemplate]=\"groupHeaderTemplate\"\n [itemTemplate]=\"itemTemplate\"\n [barTemplate]=\"barTemplate\"\n [rangeTemplate]=\"rangeTemplate\"\n [baselineTemplate]=\"baselineTemplate\"\n [quickTimeFocus]=\"quickTimeFocus\"\n (barClick)=\"barClick.emit($event)\"\n (lineClick)=\"lineClick.emit($event)\"\n >\n </gantt-main>\n </div>\n </div>\n </cdk-virtual-scroll-viewport>\n\n <gantt-drag-backdrop [style.left.px]=\"tableHeader.tableWidth + 1\"></gantt-drag-backdrop>\n\n <gantt-scrollbar\n [ganttRoot]=\"ganttRoot\"\n [hasFooter]=\"!!table?.tableFooterTemplate\"\n [tableWidth]=\"tableHeader.tableWidth\"\n ></gantt-scrollbar>\n\n @if (table?.tableFooterTemplate || footerTemplate) {\n <div\n class=\"gantt-footer\"\n cdkScrollable\n [style.right.px]=\"ganttRoot.verticalScrollbarWidth\"\n [style.bottom.px]=\"ganttRoot.horizontalScrollbarHeight\"\n >\n @if (table?.tableFooterTemplate) {\n <div class=\"gantt-table-footer\" syncScrollX=\"ganttTableXScroll\" [style.width.px]=\"tableHeader.tableWidth + 1\">\n <ng-template [ngTemplateOutlet]=\"table?.tableFooterTemplate\" [ngTemplateOutletContext]=\"{ columns: columns }\"> </ng-template>\n </div>\n }\n @if (footerTemplate) {\n <div class=\"gantt-container-footer\" syncScrollX=\"ganttMainXScroll\">\n <ng-template [ngTemplateOutlet]=\"footerTemplate\"> </ng-template>\n </div>\n }\n </div>\n }\n</ngx-gantt-root>\n", dependencies: [{ kind: "component", type: NgxGanttRootComponent, selector: "ngx-gantt-root", inputs: ["sideWidth"] }, { kind: "component", type: GanttTableHeaderComponent, selector: "gantt-table-header", inputs: ["columns"] }, { kind: "component", type: GanttCalendarHeaderComponent, selector: "gantt-calendar-header" }, { kind: "component", type: GanttLoaderComponent, selector: "gantt-loader" }, { kind: "component", type: CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "directive", type: CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: GanttTableBodyComponent, selector: "gantt-table-body", inputs: ["viewportItems", "flatItems", "columns", "groupTemplate", "emptyTemplate", "rowBeforeTemplate", "rowAfterTemplate", "draggable", "dropEnterPredicate"], outputs: ["dragDropped", "dragStarted", "dragEnded", "itemClick"] }, { kind: "component", type: GanttCalendarGridComponent, selector: "gantt-calendar-grid" }, { kind: "component", type: GanttMainComponent, selector: "gantt-main", inputs: ["viewportItems", "flatItems", "groupHeaderTemplate", "itemTemplate", "barTemplate", "rangeTemplate", "baselineTemplate", "ganttRoot", "quickTimeFocus"], outputs: ["barClick", "lineClick"] }, { kind: "component", type: GanttDragBackdropComponent, selector: "gantt-drag-backdrop" }, { kind: "component", type: GanttScrollbarComponent, selector: "gantt-scrollbar", inputs: ["hasFooter", "tableWidth", "ganttRoot"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: GanttSyncScrollXDirective, selector: "[syncScrollX]", inputs: ["syncScrollX"] }, { kind: "directive", type: GanttSyncScrollYDirective, selector: "[syncScrollY]", inputs: ["syncScrollY"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
4850
|
+
], queries: [{ propertyName: "table", first: true, predicate: NgxGanttTableComponent, descendants: true }, { propertyName: "tableEmptyTemplate", first: true, predicate: ["tableEmpty"], descendants: true, static: true }, { propertyName: "footerTemplate", first: true, predicate: ["footer"], descendants: true, static: true }, { propertyName: "columns", predicate: NgxGanttTableColumnComponent, descendants: true }], viewQueries: [{ propertyName: "ganttRoot", first: true, predicate: ["ganttRoot"], descendants: true }, { propertyName: "virtualScroll", first: true, predicate: CdkVirtualScrollViewport, descendants: true }, { propertyName: "ganttTableBody", first: true, predicate: ["ganttTableBody"], descendants: true, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ngx-gantt-root #ganttRoot>\n <div class=\"gantt-header\">\n <gantt-table-header #tableHeader [columns]=\"columns\"></gantt-table-header>\n <div class=\"gantt-container-header\">\n <gantt-calendar-header\n syncScrollX=\"ganttMainXScroll\"\n [style.padding-right.px]=\"ganttRoot.verticalScrollbarWidth\"\n ></gantt-calendar-header>\n </div>\n </div>\n @if (loading) {\n <gantt-loader></gantt-loader>\n }\n\n <cdk-virtual-scroll-viewport\n class=\"gantt-virtual-scroll-viewport\"\n [ngClass]=\"{\n 'gantt-normal-viewport': !virtualScrollEnabled,\n 'gantt-scroll-container': virtualScrollEnabled,\n 'with-footer': table?.tableFooterTemplate || footerTemplate\n }\"\n [style.top.px]=\"styles.headerHeight\"\n [itemSize]=\"styles.lineHeight\"\n [minBufferPx]=\"styles.lineHeight * 10\"\n [maxBufferPx]=\"styles.lineHeight * 20\"\n (scrolledIndexChange)=\"scrolledIndexChange($event)\"\n >\n <ng-container *cdkVirtualFor=\"let item of flatItems; trackBy: trackBy\"></ng-container>\n <div class=\"gantt-side\" [style.width.px]=\"tableHeader.tableWidth + 1\" [style.padding-bottom.px]=\"ganttRoot.horizontalScrollbarHeight\">\n <div class=\"gantt-side-container\" syncScrollX=\"ganttTableXScroll\" syncScrollY=\"ganttMainYScroll\">\n <div class=\"gantt-table\">\n <gantt-table-body\n #ganttTableBody\n [flatItems]=\"flatItems\"\n [viewportItems]=\"viewportItems\"\n [columns]=\"columns\"\n [groupTemplate]=\"groupTemplate\"\n [emptyTemplate]=\"table.tableEmptyTemplate || tableEmptyTemplate\"\n [rowBeforeTemplate]=\"table?.rowBeforeTemplate\"\n [rowAfterTemplate]=\"table?.rowAfterTemplate\"\n [draggable]=\"table.draggable\"\n [dropEnterPredicate]=\"table.dropEnterPredicate\"\n (dragDropped)=\"table.dragDropped.emit($event)\"\n (dragStarted)=\"itemDragStarted($event)\"\n (dragEnded)=\"itemDragEnded($event)\"\n (itemClick)=\"selectItem($event)\"\n >\n </gantt-table-body>\n </div>\n </div>\n </div>\n <div class=\"gantt-container\">\n <gantt-calendar-grid\n syncScrollX=\"ganttMainXScroll\"\n [style.padding-right.px]=\"ganttRoot.verticalScrollbarWidth\"\n [style.padding-bottom.px]=\"ganttRoot.horizontalScrollbarHeight\"\n ></gantt-calendar-grid>\n <div class=\"gantt-main\">\n <gantt-main\n syncScrollX=\"ganttMainXScroll\"\n syncScrollY=\"ganttMainYScroll\"\n [ganttRoot]=\"ganttRoot\"\n [flatItems]=\"flatItems\"\n [viewportItems]=\"viewportItems\"\n [groupHeaderTemplate]=\"groupHeaderTemplate\"\n [itemTemplate]=\"itemTemplate\"\n [barTemplate]=\"barTemplate\"\n [rangeTemplate]=\"rangeTemplate\"\n [baselineTemplate]=\"baselineTemplate\"\n [quickTimeFocus]=\"quickTimeFocus\"\n (barClick)=\"barClick.emit($event)\"\n (lineClick)=\"lineClick.emit($event)\"\n >\n </gantt-main>\n </div>\n </div>\n </cdk-virtual-scroll-viewport>\n\n <gantt-drag-backdrop [style.left.px]=\"tableHeader.tableWidth + 1\"></gantt-drag-backdrop>\n\n <gantt-scrollbar\n [ganttRoot]=\"ganttRoot\"\n [hasFooter]=\"!!table?.tableFooterTemplate\"\n [tableWidth]=\"tableHeader.tableWidth\"\n [tableScrollWidth]=\"tableScrollWidth()\"\n ></gantt-scrollbar>\n\n @if (table?.tableFooterTemplate || footerTemplate) {\n <div\n class=\"gantt-footer\"\n cdkScrollable\n [style.right.px]=\"ganttRoot.verticalScrollbarWidth\"\n [style.bottom.px]=\"ganttRoot.horizontalScrollbarHeight\"\n >\n @if (table?.tableFooterTemplate) {\n <div class=\"gantt-table-footer\" syncScrollX=\"ganttTableXScroll\" [style.width.px]=\"tableHeader.tableWidth + 1\">\n <ng-template [ngTemplateOutlet]=\"table?.tableFooterTemplate\" [ngTemplateOutletContext]=\"{ columns: columns }\"> </ng-template>\n </div>\n }\n @if (footerTemplate) {\n <div class=\"gantt-container-footer\" syncScrollX=\"ganttMainXScroll\">\n <ng-template [ngTemplateOutlet]=\"footerTemplate\"> </ng-template>\n </div>\n }\n </div>\n }\n</ngx-gantt-root>\n", dependencies: [{ kind: "component", type: NgxGanttRootComponent, selector: "ngx-gantt-root", inputs: ["sideWidth"] }, { kind: "component", type: GanttTableHeaderComponent, selector: "gantt-table-header", inputs: ["columns"] }, { kind: "component", type: GanttCalendarHeaderComponent, selector: "gantt-calendar-header" }, { kind: "component", type: GanttLoaderComponent, selector: "gantt-loader" }, { kind: "component", type: CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "directive", type: CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: GanttTableBodyComponent, selector: "gantt-table-body", inputs: ["viewportItems", "flatItems", "columns", "groupTemplate", "emptyTemplate", "rowBeforeTemplate", "rowAfterTemplate", "draggable", "dropEnterPredicate"], outputs: ["dragDropped", "dragStarted", "dragEnded", "itemClick"] }, { kind: "component", type: GanttCalendarGridComponent, selector: "gantt-calendar-grid" }, { kind: "component", type: GanttMainComponent, selector: "gantt-main", inputs: ["viewportItems", "flatItems", "groupHeaderTemplate", "itemTemplate", "barTemplate", "rangeTemplate", "baselineTemplate", "ganttRoot", "quickTimeFocus"], outputs: ["barClick", "lineClick"] }, { kind: "component", type: GanttDragBackdropComponent, selector: "gantt-drag-backdrop" }, { kind: "component", type: GanttScrollbarComponent, selector: "gantt-scrollbar", inputs: ["hasFooter", "tableWidth", "ganttRoot", "tableScrollWidth"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: GanttSyncScrollXDirective, selector: "[syncScrollX]", inputs: ["syncScrollX"] }, { kind: "directive", type: GanttSyncScrollYDirective, selector: "[syncScrollY]", inputs: ["syncScrollY"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
4830
4851
|
}
|
|
4831
4852
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: NgxGanttComponent, decorators: [{
|
|
4832
4853
|
type: Component,
|
|
@@ -4856,7 +4877,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImpor
|
|
|
4856
4877
|
NgTemplateOutlet,
|
|
4857
4878
|
GanttSyncScrollXDirective,
|
|
4858
4879
|
GanttSyncScrollYDirective
|
|
4859
|
-
], template: "<ngx-gantt-root #ganttRoot>\n <div class=\"gantt-header\">\n <gantt-table-header #tableHeader [columns]=\"columns\"></gantt-table-header>\n <div class=\"gantt-container-header\">\n <gantt-calendar-header\n syncScrollX=\"ganttMainXScroll\"\n [style.padding-right.px]=\"ganttRoot.verticalScrollbarWidth\"\n ></gantt-calendar-header>\n </div>\n </div>\n @if (loading) {\n <gantt-loader></gantt-loader>\n }\n\n <cdk-virtual-scroll-viewport\n class=\"gantt-virtual-scroll-viewport\"\n [ngClass]=\"{\n 'gantt-normal-viewport': !virtualScrollEnabled,\n 'gantt-scroll-container': virtualScrollEnabled,\n 'with-footer': table?.tableFooterTemplate || footerTemplate\n }\"\n [style.top.px]=\"styles.headerHeight\"\n [itemSize]=\"styles.lineHeight\"\n [minBufferPx]=\"styles.lineHeight * 10\"\n [maxBufferPx]=\"styles.lineHeight * 20\"\n (scrolledIndexChange)=\"scrolledIndexChange($event)\"\n >\n <ng-container *cdkVirtualFor=\"let item of flatItems; trackBy: trackBy\"></ng-container>\n <div class=\"gantt-side\" [style.width.px]=\"tableHeader.tableWidth + 1\" [style.padding-bottom.px]=\"ganttRoot.horizontalScrollbarHeight\">\n <div class=\"gantt-side-container\" syncScrollX=\"ganttTableXScroll\" syncScrollY=\"ganttMainYScroll\">\n <div class=\"gantt-table\">\n <gantt-table-body\n #ganttTableBody\n [flatItems]=\"flatItems\"\n [viewportItems]=\"viewportItems\"\n [columns]=\"columns\"\n [groupTemplate]=\"groupTemplate\"\n [emptyTemplate]=\"table.tableEmptyTemplate || tableEmptyTemplate\"\n [rowBeforeTemplate]=\"table?.rowBeforeTemplate\"\n [rowAfterTemplate]=\"table?.rowAfterTemplate\"\n [draggable]=\"table.draggable\"\n [dropEnterPredicate]=\"table.dropEnterPredicate\"\n (dragDropped)=\"table.dragDropped.emit($event)\"\n (dragStarted)=\"itemDragStarted($event)\"\n (dragEnded)=\"itemDragEnded($event)\"\n (itemClick)=\"selectItem($event)\"\n >\n </gantt-table-body>\n </div>\n </div>\n </div>\n <div class=\"gantt-container\">\n <gantt-calendar-grid\n syncScrollX=\"ganttMainXScroll\"\n [style.padding-right.px]=\"ganttRoot.verticalScrollbarWidth\"\n [style.padding-bottom.px]=\"ganttRoot.horizontalScrollbarHeight\"\n ></gantt-calendar-grid>\n <div class=\"gantt-main\">\n <gantt-main\n syncScrollX=\"ganttMainXScroll\"\n syncScrollY=\"ganttMainYScroll\"\n [ganttRoot]=\"ganttRoot\"\n [flatItems]=\"flatItems\"\n [viewportItems]=\"viewportItems\"\n [groupHeaderTemplate]=\"groupHeaderTemplate\"\n [itemTemplate]=\"itemTemplate\"\n [barTemplate]=\"barTemplate\"\n [rangeTemplate]=\"rangeTemplate\"\n [baselineTemplate]=\"baselineTemplate\"\n [quickTimeFocus]=\"quickTimeFocus\"\n (barClick)=\"barClick.emit($event)\"\n (lineClick)=\"lineClick.emit($event)\"\n >\n </gantt-main>\n </div>\n </div>\n </cdk-virtual-scroll-viewport>\n\n <gantt-drag-backdrop [style.left.px]=\"tableHeader.tableWidth + 1\"></gantt-drag-backdrop>\n\n <gantt-scrollbar\n [ganttRoot]=\"ganttRoot\"\n [hasFooter]=\"!!table?.tableFooterTemplate\"\n [tableWidth]=\"tableHeader.tableWidth\"\n ></gantt-scrollbar>\n\n @if (table?.tableFooterTemplate || footerTemplate) {\n <div\n class=\"gantt-footer\"\n cdkScrollable\n [style.right.px]=\"ganttRoot.verticalScrollbarWidth\"\n [style.bottom.px]=\"ganttRoot.horizontalScrollbarHeight\"\n >\n @if (table?.tableFooterTemplate) {\n <div class=\"gantt-table-footer\" syncScrollX=\"ganttTableXScroll\" [style.width.px]=\"tableHeader.tableWidth + 1\">\n <ng-template [ngTemplateOutlet]=\"table?.tableFooterTemplate\" [ngTemplateOutletContext]=\"{ columns: columns }\"> </ng-template>\n </div>\n }\n @if (footerTemplate) {\n <div class=\"gantt-container-footer\" syncScrollX=\"ganttMainXScroll\">\n <ng-template [ngTemplateOutlet]=\"footerTemplate\"> </ng-template>\n </div>\n }\n </div>\n }\n</ngx-gantt-root>\n" }]
|
|
4880
|
+
], template: "<ngx-gantt-root #ganttRoot>\n <div class=\"gantt-header\">\n <gantt-table-header #tableHeader [columns]=\"columns\"></gantt-table-header>\n <div class=\"gantt-container-header\">\n <gantt-calendar-header\n syncScrollX=\"ganttMainXScroll\"\n [style.padding-right.px]=\"ganttRoot.verticalScrollbarWidth\"\n ></gantt-calendar-header>\n </div>\n </div>\n @if (loading) {\n <gantt-loader></gantt-loader>\n }\n\n <cdk-virtual-scroll-viewport\n class=\"gantt-virtual-scroll-viewport\"\n [ngClass]=\"{\n 'gantt-normal-viewport': !virtualScrollEnabled,\n 'gantt-scroll-container': virtualScrollEnabled,\n 'with-footer': table?.tableFooterTemplate || footerTemplate\n }\"\n [style.top.px]=\"styles.headerHeight\"\n [itemSize]=\"styles.lineHeight\"\n [minBufferPx]=\"styles.lineHeight * 10\"\n [maxBufferPx]=\"styles.lineHeight * 20\"\n (scrolledIndexChange)=\"scrolledIndexChange($event)\"\n >\n <ng-container *cdkVirtualFor=\"let item of flatItems; trackBy: trackBy\"></ng-container>\n <div class=\"gantt-side\" [style.width.px]=\"tableHeader.tableWidth + 1\" [style.padding-bottom.px]=\"ganttRoot.horizontalScrollbarHeight\">\n <div class=\"gantt-side-container\" syncScrollX=\"ganttTableXScroll\" syncScrollY=\"ganttMainYScroll\">\n <div class=\"gantt-table\">\n <gantt-table-body\n #ganttTableBody\n [flatItems]=\"flatItems\"\n [viewportItems]=\"viewportItems\"\n [columns]=\"columns\"\n [groupTemplate]=\"groupTemplate\"\n [emptyTemplate]=\"table.tableEmptyTemplate || tableEmptyTemplate\"\n [rowBeforeTemplate]=\"table?.rowBeforeTemplate\"\n [rowAfterTemplate]=\"table?.rowAfterTemplate\"\n [draggable]=\"table.draggable\"\n [dropEnterPredicate]=\"table.dropEnterPredicate\"\n (dragDropped)=\"table.dragDropped.emit($event)\"\n (dragStarted)=\"itemDragStarted($event)\"\n (dragEnded)=\"itemDragEnded($event)\"\n (itemClick)=\"selectItem($event)\"\n >\n </gantt-table-body>\n </div>\n </div>\n </div>\n <div class=\"gantt-container\">\n <gantt-calendar-grid\n syncScrollX=\"ganttMainXScroll\"\n [style.padding-right.px]=\"ganttRoot.verticalScrollbarWidth\"\n [style.padding-bottom.px]=\"ganttRoot.horizontalScrollbarHeight\"\n ></gantt-calendar-grid>\n <div class=\"gantt-main\">\n <gantt-main\n syncScrollX=\"ganttMainXScroll\"\n syncScrollY=\"ganttMainYScroll\"\n [ganttRoot]=\"ganttRoot\"\n [flatItems]=\"flatItems\"\n [viewportItems]=\"viewportItems\"\n [groupHeaderTemplate]=\"groupHeaderTemplate\"\n [itemTemplate]=\"itemTemplate\"\n [barTemplate]=\"barTemplate\"\n [rangeTemplate]=\"rangeTemplate\"\n [baselineTemplate]=\"baselineTemplate\"\n [quickTimeFocus]=\"quickTimeFocus\"\n (barClick)=\"barClick.emit($event)\"\n (lineClick)=\"lineClick.emit($event)\"\n >\n </gantt-main>\n </div>\n </div>\n </cdk-virtual-scroll-viewport>\n\n <gantt-drag-backdrop [style.left.px]=\"tableHeader.tableWidth + 1\"></gantt-drag-backdrop>\n\n <gantt-scrollbar\n [ganttRoot]=\"ganttRoot\"\n [hasFooter]=\"!!table?.tableFooterTemplate\"\n [tableWidth]=\"tableHeader.tableWidth\"\n [tableScrollWidth]=\"tableScrollWidth()\"\n ></gantt-scrollbar>\n\n @if (table?.tableFooterTemplate || footerTemplate) {\n <div\n class=\"gantt-footer\"\n cdkScrollable\n [style.right.px]=\"ganttRoot.verticalScrollbarWidth\"\n [style.bottom.px]=\"ganttRoot.horizontalScrollbarHeight\"\n >\n @if (table?.tableFooterTemplate) {\n <div class=\"gantt-table-footer\" syncScrollX=\"ganttTableXScroll\" [style.width.px]=\"tableHeader.tableWidth + 1\">\n <ng-template [ngTemplateOutlet]=\"table?.tableFooterTemplate\" [ngTemplateOutletContext]=\"{ columns: columns }\"> </ng-template>\n </div>\n }\n @if (footerTemplate) {\n <div class=\"gantt-container-footer\" syncScrollX=\"ganttMainXScroll\">\n <ng-template [ngTemplateOutlet]=\"footerTemplate\"> </ng-template>\n </div>\n }\n </div>\n }\n</ngx-gantt-root>\n" }]
|
|
4860
4881
|
}], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i0.NgZone }, { type: i1$1.ViewportRuler }, { type: undefined, decorators: [{
|
|
4861
4882
|
type: Inject,
|
|
4862
4883
|
args: [GANTT_GLOBAL_CONFIG]
|