@worktile/gantt 15.1.0-next.5 → 15.1.0-next.6
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/components/table/body/gantt-table-body.component.d.ts +2 -1
- package/esm2020/components/table/body/gantt-table-body.component.mjs +44 -32
- package/esm2020/gantt-abstract.mjs +1 -1
- package/esm2020/gantt.component.mjs +1 -1
- package/fesm2015/worktile-gantt.mjs +46 -35
- package/fesm2015/worktile-gantt.mjs.map +1 -1
- package/fesm2020/worktile-gantt.mjs +46 -34
- package/fesm2020/worktile-gantt.mjs.map +1 -1
- package/gantt-abstract.d.ts +1 -0
- package/package.json +1 -1
|
@@ -2,8 +2,8 @@ import * as i0 from '@angular/core';
|
|
|
2
2
|
import { InjectionToken, EventEmitter, Directive, Inject, Input, Output, ContentChild, HostBinding, Component, Injectable, ViewChild, Pipe, ViewChildren, PLATFORM_ID, ElementRef, Optional, SkipSelf, forwardRef, ChangeDetectionStrategy, ContentChildren, NgModule } from '@angular/core';
|
|
3
3
|
import * as i1 from '@angular/common';
|
|
4
4
|
import { DOCUMENT, isPlatformServer, CommonModule } from '@angular/common';
|
|
5
|
-
import { take, takeUntil, skip, switchMap, debounceTime
|
|
6
|
-
import { BehaviorSubject, Subject, from, takeUntil as takeUntil$1, startWith,
|
|
5
|
+
import { take, takeUntil, skip, switchMap, debounceTime, map, pairwise, auditTime as auditTime$1, startWith as startWith$1, finalize } from 'rxjs/operators';
|
|
6
|
+
import { BehaviorSubject, Subject, from, takeUntil as takeUntil$1, startWith, auditTime, filter, merge, EMPTY, fromEvent, Observable } from 'rxjs';
|
|
7
7
|
import { fromUnixTime, getWeek, getDaysInMonth, differenceInCalendarDays, setDate, addSeconds, addMinutes, addHours, addDays, addWeeks, addMonths, addQuarters, addYears, startOfDay, startOfWeek, startOfMonth, startOfQuarter, startOfYear, endOfDay, endOfWeek, endOfMonth, endOfQuarter, endOfYear, getUnixTime, format, isWeekend, isToday, differenceInDays, differenceInCalendarQuarters, eachMonthOfInterval, eachYearOfInterval, eachWeekOfInterval, eachDayOfInterval, differenceInCalendarYears } from 'date-fns';
|
|
8
8
|
export { addDays, addHours, addMinutes, addMonths, addQuarters, addSeconds, addWeeks, addYears, differenceInCalendarDays, differenceInCalendarQuarters, differenceInDays, eachDayOfInterval, eachMonthOfInterval, eachWeekOfInterval, endOfDay, endOfMonth, endOfQuarter, endOfWeek, endOfYear, format, fromUnixTime, getDaysInMonth, getUnixTime, getWeek, isToday, isWeekend, setDate, startOfDay, startOfMonth, startOfQuarter, startOfWeek, startOfYear } from 'date-fns';
|
|
9
9
|
import { SelectionModel } from '@angular/cdk/collections';
|
|
@@ -1743,7 +1743,7 @@ class GanttTableBodyComponent {
|
|
|
1743
1743
|
this.ganttTableDragging = false;
|
|
1744
1744
|
this.hasExpandIcon = false;
|
|
1745
1745
|
// 缓存 Element 和 DragRef 的关系，方便在 Item 拖动时查找
|
|
1746
|
-
this.
|
|
1746
|
+
this.itemDragsMap = new Map();
|
|
1747
1747
|
this.itemDragMoved = new Subject();
|
|
1748
1748
|
this.destroy$ = new Subject();
|
|
1749
1749
|
}
|
|
@@ -1765,17 +1765,17 @@ class GanttTableBodyComponent {
|
|
|
1765
1765
|
this.cdkDrags.changes
|
|
1766
1766
|
.pipe(startWith(this.cdkDrags), takeUntil$1(this.destroy$))
|
|
1767
1767
|
.subscribe((drags) => {
|
|
1768
|
-
this.
|
|
1768
|
+
this.itemDragsMap.clear();
|
|
1769
1769
|
drags.forEach((drag) => {
|
|
1770
1770
|
if (drag.data) {
|
|
1771
1771
|
// cdkDrag 变化时，缓存 Element 与 DragRef 的关系，方便 Drag Move 时查找
|
|
1772
|
-
this.
|
|
1772
|
+
this.itemDragsMap.set(drag.element.nativeElement, drag);
|
|
1773
1773
|
}
|
|
1774
1774
|
});
|
|
1775
1775
|
});
|
|
1776
1776
|
this.itemDragMoved
|
|
1777
|
-
.pipe(
|
|
1778
|
-
//
|
|
1777
|
+
.pipe(auditTime(30),
|
|
1778
|
+
// auditTime 可能会导致拖动结束后仍然执行 moved ，所以通过判断 dragging 状态来过滤无效 moved
|
|
1779
1779
|
filter((event) => event.source._dragRef.isDragging()), takeUntil$1(this.destroy$))
|
|
1780
1780
|
.subscribe((event) => {
|
|
1781
1781
|
this.onItemDragMoved(event);
|
|
@@ -1816,12 +1816,12 @@ class GanttTableBodyComponent {
|
|
|
1816
1816
|
}
|
|
1817
1817
|
// 缓存放置目标Id 并计算鼠标相对应的位置
|
|
1818
1818
|
this.itemDropTarget = {
|
|
1819
|
-
id: (_a = this.
|
|
1819
|
+
id: (_a = this.itemDragsMap.get(targetElement)) === null || _a === void 0 ? void 0 : _a.data.id,
|
|
1820
1820
|
position: this.getTargetPosition(targetElement, event)
|
|
1821
1821
|
};
|
|
1822
1822
|
// 执行外部传入的 dropEnterPredicate 判断是否允许拖入目标项
|
|
1823
1823
|
if (this.dropEnterPredicate) {
|
|
1824
|
-
const targetDragRef = this.
|
|
1824
|
+
const targetDragRef = this.itemDragsMap.get(targetElement);
|
|
1825
1825
|
if (this.dropEnterPredicate({
|
|
1826
1826
|
source: event.source.data.origin,
|
|
1827
1827
|
target: targetDragRef.data.origin,
|
|
@@ -1841,30 +1841,32 @@ class GanttTableBodyComponent {
|
|
|
1841
1841
|
this.ganttTableDragging = false;
|
|
1842
1842
|
}
|
|
1843
1843
|
onListDropped(event) {
|
|
1844
|
-
var _a, _b;
|
|
1845
1844
|
if (!this.itemDropTarget) {
|
|
1846
1845
|
return;
|
|
1847
1846
|
}
|
|
1848
|
-
const targetDragRef = this.cdkDrags.find((item) => { var _a; return ((_a = item.data) === null || _a === void 0 ? void 0 : _a.id) === this.itemDropTarget.id; });
|
|
1849
1847
|
const sourceItem = event.item.data;
|
|
1848
|
+
const sourceParent = this.getParentByItem(sourceItem);
|
|
1849
|
+
const sourceChildren = this.getExpandChildrenByDrag(event.item);
|
|
1850
|
+
const targetDragRef = this.cdkDrags.find((item) => { var _a; return ((_a = item.data) === null || _a === void 0 ? void 0 : _a.id) === this.itemDropTarget.id; });
|
|
1850
1851
|
const targetItem = targetDragRef === null || targetDragRef === void 0 ? void 0 : targetDragRef.data;
|
|
1851
|
-
this.
|
|
1852
|
+
const targetParent = this.getParentByItem(targetItem);
|
|
1853
|
+
this.removeItem(sourceItem, sourceChildren);
|
|
1852
1854
|
switch (this.itemDropTarget.position) {
|
|
1853
1855
|
case 'before':
|
|
1854
1856
|
case 'after':
|
|
1855
|
-
this.insertItem(targetItem, sourceItem, this.itemDropTarget.position);
|
|
1857
|
+
this.insertItem(targetItem, sourceItem, sourceChildren, this.itemDropTarget.position);
|
|
1856
1858
|
sourceItem.updateLevel(targetItem.level);
|
|
1857
1859
|
break;
|
|
1858
1860
|
case 'inside':
|
|
1859
|
-
this.insertChildrenItem(targetItem, sourceItem);
|
|
1861
|
+
this.insertChildrenItem(targetItem, sourceItem, sourceChildren);
|
|
1860
1862
|
sourceItem.updateLevel(targetItem.level + 1);
|
|
1861
1863
|
break;
|
|
1862
1864
|
}
|
|
1863
1865
|
this.dragDropped.emit({
|
|
1864
1866
|
source: sourceItem.origin,
|
|
1865
|
-
sourceParent:
|
|
1867
|
+
sourceParent: sourceParent === null || sourceParent === void 0 ? void 0 : sourceParent.origin,
|
|
1866
1868
|
target: targetItem.origin,
|
|
1867
|
-
targetParent:
|
|
1869
|
+
targetParent: targetParent === null || targetParent === void 0 ? void 0 : targetParent.origin,
|
|
1868
1870
|
dropPosition: this.itemDropTarget.position
|
|
1869
1871
|
});
|
|
1870
1872
|
this.cleanupDragArtifacts(true);
|
|
@@ -1876,15 +1878,15 @@ class GanttTableBodyComponent {
|
|
|
1876
1878
|
this.destroy$.next();
|
|
1877
1879
|
this.destroy$.complete();
|
|
1878
1880
|
}
|
|
1879
|
-
removeItem(item) {
|
|
1880
|
-
this.renderData.splice(this.renderData.indexOf(item), 1);
|
|
1881
|
-
this.flatData.splice(this.flatData.indexOf(item), 1);
|
|
1881
|
+
removeItem(item, children) {
|
|
1882
|
+
this.renderData.splice(this.renderData.indexOf(item), 1 + children.length);
|
|
1883
|
+
this.flatData.splice(this.flatData.indexOf(item), 1 + children.length);
|
|
1882
1884
|
}
|
|
1883
|
-
insertItem(target, inserted, position) {
|
|
1885
|
+
insertItem(target, inserted, children, position) {
|
|
1884
1886
|
var _a;
|
|
1885
1887
|
if (position === 'before') {
|
|
1886
|
-
this.renderData.splice(this.renderData.indexOf(target), 0, inserted);
|
|
1887
|
-
this.flatData.splice(this.flatData.indexOf(target), 0, inserted);
|
|
1888
|
+
this.renderData.splice(this.renderData.indexOf(target), 0, inserted, ...children);
|
|
1889
|
+
this.flatData.splice(this.flatData.indexOf(target), 0, inserted, ...children);
|
|
1888
1890
|
}
|
|
1889
1891
|
else {
|
|
1890
1892
|
const dragRef = this.cdkDrags.find((drag) => drag.data === target);
|
|
@@ -1893,14 +1895,14 @@ class GanttTableBodyComponent {
|
|
|
1893
1895
|
if (target.expanded) {
|
|
1894
1896
|
childrenCount = ((_a = this.getChildrenElementsByElement(dragRef.element.nativeElement)) === null || _a === void 0 ? void 0 : _a.length) || 0;
|
|
1895
1897
|
}
|
|
1896
|
-
this.renderData.splice(this.renderData.indexOf(target) + 1 + childrenCount, 0, inserted);
|
|
1897
|
-
this.flatData.splice(this.flatData.indexOf(target) + 1 + childrenCount, 0, inserted);
|
|
1898
|
+
this.renderData.splice(this.renderData.indexOf(target) + 1 + childrenCount, 0, inserted, ...children);
|
|
1899
|
+
this.flatData.splice(this.flatData.indexOf(target) + 1 + childrenCount, 0, inserted, ...children);
|
|
1898
1900
|
}
|
|
1899
1901
|
}
|
|
1900
|
-
insertChildrenItem(target, inserted) {
|
|
1902
|
+
insertChildrenItem(target, inserted, children) {
|
|
1901
1903
|
if (target.expanded) {
|
|
1902
|
-
this.renderData.splice(this.renderData.indexOf(target) + target.children.length + 1, 0, inserted);
|
|
1903
|
-
this.flatData.splice(this.flatData.indexOf(target) + target.children.length + 1, 0, inserted);
|
|
1904
|
+
this.renderData.splice(this.renderData.indexOf(target) + target.children.length + 1, 0, inserted, ...children);
|
|
1905
|
+
this.flatData.splice(this.flatData.indexOf(target) + target.children.length + 1, 0, inserted, ...children);
|
|
1904
1906
|
}
|
|
1905
1907
|
target.children.push(inserted);
|
|
1906
1908
|
}
|
|
@@ -1910,17 +1912,26 @@ class GanttTableBodyComponent {
|
|
|
1910
1912
|
return (_a = n.children) === null || _a === void 0 ? void 0 : _a.includes(item);
|
|
1911
1913
|
});
|
|
1912
1914
|
}
|
|
1915
|
+
getExpandChildrenByDrag(dragRef) {
|
|
1916
|
+
if (!dragRef.data.expanded) {
|
|
1917
|
+
return [];
|
|
1918
|
+
}
|
|
1919
|
+
else {
|
|
1920
|
+
const childrenElements = this.getChildrenElementsByElement(dragRef.element.nativeElement);
|
|
1921
|
+
return childrenElements.map((element) => this.itemDragsMap.get(element).data);
|
|
1922
|
+
}
|
|
1923
|
+
}
|
|
1913
1924
|
getChildrenElementsByElement(dragElement) {
|
|
1914
1925
|
// 通过循环持续查找 next element，如果 element 的 level 小于当前 item 的 level，则为它的 children
|
|
1915
1926
|
const children = [];
|
|
1916
|
-
const dragRef = this.
|
|
1927
|
+
const dragRef = this.itemDragsMap.get(dragElement);
|
|
1917
1928
|
// 如果当前的 Drag 正在拖拽，会创建 PlaceholderElement 占位，所以以 PlaceholderElement 向下查找
|
|
1918
1929
|
let nextElement = (dragRef.getPlaceholderElement() || dragElement).nextElementSibling;
|
|
1919
|
-
let nextDragRef = this.
|
|
1930
|
+
let nextDragRef = this.itemDragsMap.get(nextElement);
|
|
1920
1931
|
while (nextDragRef && nextDragRef.data.level > dragRef.data.level) {
|
|
1921
1932
|
children.push(nextElement);
|
|
1922
1933
|
nextElement = nextElement.nextElementSibling;
|
|
1923
|
-
nextDragRef = this.
|
|
1934
|
+
nextDragRef = this.itemDragsMap.get(nextElement);
|
|
1924
1935
|
}
|
|
1925
1936
|
return children;
|
|
1926
1937
|
}
|
|
@@ -1947,18 +1958,18 @@ class GanttTableBodyComponent {
|
|
|
1947
1958
|
cleanupDragArtifacts(dropped = false) {
|
|
1948
1959
|
if (dropped) {
|
|
1949
1960
|
this.itemDropTarget = null;
|
|
1961
|
+
this.document.querySelectorAll('.drag-item-hide').forEach((element) => element.classList.remove('drag-item-hide'));
|
|
1950
1962
|
}
|
|
1951
1963
|
this.document.querySelectorAll('.drop-position-before').forEach((element) => element.classList.remove('drop-position-before'));
|
|
1952
1964
|
this.document.querySelectorAll('.drop-position-after').forEach((element) => element.classList.remove('drop-position-after'));
|
|
1953
1965
|
this.document.querySelectorAll('.drop-position-inside').forEach((element) => element.classList.remove('drop-position-inside'));
|
|
1954
|
-
this.document.querySelectorAll('.drag-item-hide').forEach((element) => element.classList.remove('drop-item-hide'));
|
|
1955
1966
|
}
|
|
1956
1967
|
}
|
|
1957
1968
|
GanttTableBodyComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: GanttTableBodyComponent, deps: [{ token: GANTT_ABSTRACT_TOKEN }, { token: GANTT_UPPER_TOKEN }, { token: i0.ChangeDetectorRef }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Component });
|
|
1958
|
-
GanttTableBodyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.4", type: GanttTableBodyComponent, selector: "gantt-table-body", inputs: { renderData: "renderData", flatData: "flatData", columns: "columns", groupTemplate: "groupTemplate", emptyTemplate: "emptyTemplate", rowBeforeTemplate: "rowBeforeTemplate", rowAfterTemplate: "rowAfterTemplate", draggable: "draggable", dropEnterPredicate: "dropEnterPredicate" }, outputs: { dragDropped: "dragDropped", itemClick: "itemClick" }, host: { properties: { "class.gantt-table-draggable": "this.draggable", "class.gantt-table-body": "this.ganttTableClass", "class.gantt-table-empty": "this.ganttTableEmptyClass", "class.gantt-table-dragging": "this.ganttTableDragging" } }, viewQueries: [{ propertyName: "cdkDrags", predicate: (CdkDrag), descendants: true }], ngImport: i0, template: "<div\n class=\"gantt-table-body-container\"\n cdkDropList\n [cdkDropListAutoScrollStep]=\"6\"\n [cdkDropListData]=\"renderData\"\n [cdkDropListSortingDisabled]=\"true\"\n (cdkDropListDropped)=\"onListDropped($event)\"\n>\n <ng-container *ngIf=\"!renderData?.length\">\n <ng-container *ngIf=\"!emptyTemplate\">\n <gantt-icon class=\"empty-icon\" iconName=\"empty\"></gantt-icon>\n <div class=\"empty-text\">\u6CA1\u6709\u6570\u636E</div>\n </ng-container>\n <ng-template [ngTemplateOutlet]=\"emptyTemplate\"></ng-template>\n </ng-container>\n\n <ng-container *ngIf=\"renderData && renderData.length > 0\">\n <ng-container *ngFor=\"let item of renderData; trackBy: trackBy\">\n <div class=\"gantt-table-group\" [ngClass]=\"item.class\" *ngIf=\"item.items\">\n <div class=\"gantt-table-group-title\" [class.expanded]=\"item.expanded\" (click)=\"expandGroup(item)\">\n <gantt-icon class=\"expand-icon\" [iconName]=\"item.expanded ? 'angle-down' : 'angle-right'\"></gantt-icon>\n <ng-container *ngIf=\"groupTemplate; else default\">\n <ng-template\n [ngTemplateOutlet]=\"groupTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: item.origin, group: item.origin }\"\n ></ng-template>\n </ng-container>\n <ng-template #default>\n <span class=\"group-title\">{{ item.title }}</span>\n </ng-template>\n </div>\n </div>\n\n <div\n *ngIf=\"!item.items\"\n (click)=\"itemClick.emit({ event: $event, selectedValue: item.origin })\"\n cdkDrag\n [cdkDragData]=\"item\"\n [cdkDragDisabled]=\"(draggable && item.itemDraggable === false) || !draggable\"\n (cdkDragStarted)=\"onItemDragStarted($event)\"\n (cdkDragEnded)=\"onItemDragEnded($event)\"\n (cdkDragMoved)=\"emitItemDragMoved($event)\"\n class=\"gantt-table-item\"\n [class.gantt-table-item-with-group]=\"hasGroup\"\n [class.gantt-table-item-first-level-group]=\"item.level === 0 && (item.type | isGanttRangeItem)\"\n [style.height.px]=\"gantt.styles.lineHeight\"\n [style.lineHeight.px]=\"gantt.styles.lineHeight\"\n [class.gantt-table-item-active]=\"ganttUpper.isSelected(item.id)\"\n >\n <ng-template\n [ngTemplateOutlet]=\"rowBeforeTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: item.origin, item: item.origin }\"\n ></ng-template>\n\n <div [classList]=\"column.classList\" *ngFor=\"let column of columns; let first = first\" [style.width]=\"column.columnWidth\">\n <!-- drag icon -->\n <gantt-icon\n *ngIf=\"first && draggable\"\n class=\"gantt-drag-handle\"\n iconName=\"drag\"\n cdkDragHandle\n [cdkDragHandleDisabled]=\"(draggable && item.itemDraggable === false) || !draggable\"\n ></gantt-icon>\n <!-- expand icon -->\n <div\n *ngIf=\"column?.showExpandIcon || (!hasExpandIcon && first)\"\n class=\"gantt-expand-icon\"\n [style.marginLeft.px]=\"item.level * 20\"\n >\n <ng-container *ngIf=\"item.level < gantt.maxLevel - 1 && item.expandable\">\n <gantt-icon\n *ngIf=\"!item.loading\"\n class=\"expand-icon\"\n [iconName]=\"item.expanded ? 'angle-down' : 'angle-right'\"\n (click)=\"expandChildren($event, item)\"\n >\n </gantt-icon>\n <gantt-icon *ngIf=\"item.loading\" [iconName]=\"'loading'\"></gantt-icon>\n </ng-container>\n </div>\n <!-- column content -->\n <div class=\"gantt-table-column-content\">\n <ng-template\n [ngTemplateOutlet]=\"column.templateRef\"\n [ngTemplateOutletContext]=\"{ $implicit: item.origin, item: item.origin }\"\n ></ng-template>\n </div>\n </div>\n <ng-template\n [ngTemplateOutlet]=\"rowAfterTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: item.origin, item: item.origin }\"\n ></ng-template>\n </div>\n </ng-container>\n </ng-container>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i2.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i2.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "component", type: GanttIconComponent, selector: "gantt-icon", inputs: ["iconName"] }, { kind: "pipe", type: IsGanttRangeItemPipe, name: "isGanttRangeItem" }] });
|
|
1969
|
+
GanttTableBodyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.4", type: GanttTableBodyComponent, selector: "gantt-table-body", inputs: { renderData: "renderData", flatData: "flatData", columns: "columns", groupTemplate: "groupTemplate", emptyTemplate: "emptyTemplate", rowBeforeTemplate: "rowBeforeTemplate", rowAfterTemplate: "rowAfterTemplate", draggable: "draggable", dropEnterPredicate: "dropEnterPredicate" }, outputs: { dragDropped: "dragDropped", itemClick: "itemClick" }, host: { properties: { "class.gantt-table-draggable": "this.draggable", "class.gantt-table-body": "this.ganttTableClass", "class.gantt-table-empty": "this.ganttTableEmptyClass", "class.gantt-table-dragging": "this.ganttTableDragging" } }, viewQueries: [{ propertyName: "cdkDrags", predicate: (CdkDrag), descendants: true }], ngImport: i0, template: "<div\n class=\"gantt-table-body-container\"\n cdkDropList\n [cdkDropListAutoScrollStep]=\"6\"\n [cdkDropListData]=\"renderData\"\n [cdkDropListSortingDisabled]=\"true\"\n (cdkDropListDropped)=\"onListDropped($event)\"\n>\n <ng-container *ngIf=\"!renderData?.length\">\n <ng-container *ngIf=\"!emptyTemplate\">\n <gantt-icon class=\"empty-icon\" iconName=\"empty\"></gantt-icon>\n <div class=\"empty-text\">\u6CA1\u6709\u6570\u636E</div>\n </ng-container>\n <ng-template [ngTemplateOutlet]=\"emptyTemplate\"></ng-template>\n </ng-container>\n\n <ng-container *ngIf=\"renderData && renderData.length > 0\">\n <ng-container *ngFor=\"let item of renderData; trackBy: trackBy\">\n <div class=\"gantt-table-group\" [ngClass]=\"item.class\" *ngIf=\"item.items\">\n <div class=\"gantt-table-group-title\" [class.expanded]=\"item.expanded\" (click)=\"expandGroup(item)\">\n <gantt-icon class=\"expand-icon\" [iconName]=\"item.expanded ? 'angle-down' : 'angle-right'\"></gantt-icon>\n <ng-container *ngIf=\"groupTemplate; else default\">\n <ng-template\n [ngTemplateOutlet]=\"groupTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: item.origin, group: item.origin }\"\n ></ng-template>\n </ng-container>\n <ng-template #default>\n <span class=\"group-title\">{{ item.title }}</span>\n </ng-template>\n </div>\n </div>\n\n <div\n *ngIf=\"!item.items\"\n (click)=\"itemClick.emit({ event: $event, selectedValue: item.origin })\"\n cdkDrag\n [cdkDragData]=\"item\"\n [cdkDragDisabled]=\"(draggable && item.itemDraggable === false) || !draggable\"\n (cdkDragStarted)=\"onItemDragStarted($event)\"\n (cdkDragEnded)=\"onItemDragEnded($event)\"\n (cdkDragMoved)=\"emitItemDragMoved($event)\"\n class=\"gantt-table-item\"\n [class.gantt-table-item-with-group]=\"hasGroup\"\n [class.gantt-table-item-first-level-group]=\"item.level === 0 && (item.type | isGanttRangeItem)\"\n [style.height.px]=\"gantt.styles.lineHeight\"\n [style.lineHeight.px]=\"gantt.styles.lineHeight\"\n [class.gantt-table-item-active]=\"ganttUpper.isSelected(item.id)\"\n >\n <ng-template\n [ngTemplateOutlet]=\"rowBeforeTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: item.origin, item: item.origin }\"\n ></ng-template>\n\n <div [classList]=\"column.classList\" *ngFor=\"let column of columns; let first = first\" [style.width]=\"column.columnWidth\">\n <!-- drag icon -->\n <gantt-icon\n *ngIf=\"first && draggable\"\n class=\"gantt-drag-handle\"\n iconName=\"drag\"\n cdkDragHandle\n [cdkDragHandleDisabled]=\"(draggable && item.itemDraggable === false) || !draggable\"\n ></gantt-icon>\n <!-- expand icon -->\n <div\n *ngIf=\"column?.showExpandIcon || (!hasExpandIcon && first)\"\n class=\"gantt-expand-icon\"\n [style.marginLeft.px]=\"item.level * 20\"\n >\n <ng-container *ngIf=\"item.level < gantt.maxLevel - 1 && ((gantt.async && item.expandable) || item.children?.length > 0)\">\n <gantt-icon\n *ngIf=\"!item.loading\"\n class=\"expand-icon\"\n [iconName]=\"item.expanded ? 'angle-down' : 'angle-right'\"\n (click)=\"expandChildren($event, item)\"\n >\n </gantt-icon>\n <gantt-icon *ngIf=\"item.loading\" [iconName]=\"'loading'\"></gantt-icon>\n </ng-container>\n </div>\n <!-- column content -->\n <div class=\"gantt-table-column-content\">\n <ng-template\n [ngTemplateOutlet]=\"column.templateRef\"\n [ngTemplateOutletContext]=\"{ $implicit: item.origin, item: item.origin }\"\n ></ng-template>\n </div>\n </div>\n <ng-template\n [ngTemplateOutlet]=\"rowAfterTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: item.origin, item: item.origin }\"\n ></ng-template>\n </div>\n </ng-container>\n </ng-container>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i2.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i2.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "component", type: GanttIconComponent, selector: "gantt-icon", inputs: ["iconName"] }, { kind: "pipe", type: IsGanttRangeItemPipe, name: "isGanttRangeItem" }] });
|
|
1959
1970
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.4", ngImport: i0, type: GanttTableBodyComponent, decorators: [{
|
|
1960
1971
|
type: Component,
|
|
1961
|
-
args: [{ selector: 'gantt-table-body', template: "<div\n class=\"gantt-table-body-container\"\n cdkDropList\n [cdkDropListAutoScrollStep]=\"6\"\n [cdkDropListData]=\"renderData\"\n [cdkDropListSortingDisabled]=\"true\"\n (cdkDropListDropped)=\"onListDropped($event)\"\n>\n <ng-container *ngIf=\"!renderData?.length\">\n <ng-container *ngIf=\"!emptyTemplate\">\n <gantt-icon class=\"empty-icon\" iconName=\"empty\"></gantt-icon>\n <div class=\"empty-text\">\u6CA1\u6709\u6570\u636E</div>\n </ng-container>\n <ng-template [ngTemplateOutlet]=\"emptyTemplate\"></ng-template>\n </ng-container>\n\n <ng-container *ngIf=\"renderData && renderData.length > 0\">\n <ng-container *ngFor=\"let item of renderData; trackBy: trackBy\">\n <div class=\"gantt-table-group\" [ngClass]=\"item.class\" *ngIf=\"item.items\">\n <div class=\"gantt-table-group-title\" [class.expanded]=\"item.expanded\" (click)=\"expandGroup(item)\">\n <gantt-icon class=\"expand-icon\" [iconName]=\"item.expanded ? 'angle-down' : 'angle-right'\"></gantt-icon>\n <ng-container *ngIf=\"groupTemplate; else default\">\n <ng-template\n [ngTemplateOutlet]=\"groupTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: item.origin, group: item.origin }\"\n ></ng-template>\n </ng-container>\n <ng-template #default>\n <span class=\"group-title\">{{ item.title }}</span>\n </ng-template>\n </div>\n </div>\n\n <div\n *ngIf=\"!item.items\"\n (click)=\"itemClick.emit({ event: $event, selectedValue: item.origin })\"\n cdkDrag\n [cdkDragData]=\"item\"\n [cdkDragDisabled]=\"(draggable && item.itemDraggable === false) || !draggable\"\n (cdkDragStarted)=\"onItemDragStarted($event)\"\n (cdkDragEnded)=\"onItemDragEnded($event)\"\n (cdkDragMoved)=\"emitItemDragMoved($event)\"\n class=\"gantt-table-item\"\n [class.gantt-table-item-with-group]=\"hasGroup\"\n [class.gantt-table-item-first-level-group]=\"item.level === 0 && (item.type | isGanttRangeItem)\"\n [style.height.px]=\"gantt.styles.lineHeight\"\n [style.lineHeight.px]=\"gantt.styles.lineHeight\"\n [class.gantt-table-item-active]=\"ganttUpper.isSelected(item.id)\"\n >\n <ng-template\n [ngTemplateOutlet]=\"rowBeforeTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: item.origin, item: item.origin }\"\n ></ng-template>\n\n <div [classList]=\"column.classList\" *ngFor=\"let column of columns; let first = first\" [style.width]=\"column.columnWidth\">\n <!-- drag icon -->\n <gantt-icon\n *ngIf=\"first && draggable\"\n class=\"gantt-drag-handle\"\n iconName=\"drag\"\n cdkDragHandle\n [cdkDragHandleDisabled]=\"(draggable && item.itemDraggable === false) || !draggable\"\n ></gantt-icon>\n <!-- expand icon -->\n <div\n *ngIf=\"column?.showExpandIcon || (!hasExpandIcon && first)\"\n class=\"gantt-expand-icon\"\n [style.marginLeft.px]=\"item.level * 20\"\n >\n <ng-container *ngIf=\"item.level < gantt.maxLevel - 1 && item.expandable\">\n <gantt-icon\n *ngIf=\"!item.loading\"\n class=\"expand-icon\"\n [iconName]=\"item.expanded ? 'angle-down' : 'angle-right'\"\n (click)=\"expandChildren($event, item)\"\n >\n </gantt-icon>\n <gantt-icon *ngIf=\"item.loading\" [iconName]=\"'loading'\"></gantt-icon>\n </ng-container>\n </div>\n <!-- column content -->\n <div class=\"gantt-table-column-content\">\n <ng-template\n [ngTemplateOutlet]=\"column.templateRef\"\n [ngTemplateOutletContext]=\"{ $implicit: item.origin, item: item.origin }\"\n ></ng-template>\n </div>\n </div>\n <ng-template\n [ngTemplateOutlet]=\"rowAfterTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: item.origin, item: item.origin }\"\n ></ng-template>\n </div>\n </ng-container>\n </ng-container>\n</div>\n" }]
|
|
1972
|
+
args: [{ selector: 'gantt-table-body', template: "<div\n class=\"gantt-table-body-container\"\n cdkDropList\n [cdkDropListAutoScrollStep]=\"6\"\n [cdkDropListData]=\"renderData\"\n [cdkDropListSortingDisabled]=\"true\"\n (cdkDropListDropped)=\"onListDropped($event)\"\n>\n <ng-container *ngIf=\"!renderData?.length\">\n <ng-container *ngIf=\"!emptyTemplate\">\n <gantt-icon class=\"empty-icon\" iconName=\"empty\"></gantt-icon>\n <div class=\"empty-text\">\u6CA1\u6709\u6570\u636E</div>\n </ng-container>\n <ng-template [ngTemplateOutlet]=\"emptyTemplate\"></ng-template>\n </ng-container>\n\n <ng-container *ngIf=\"renderData && renderData.length > 0\">\n <ng-container *ngFor=\"let item of renderData; trackBy: trackBy\">\n <div class=\"gantt-table-group\" [ngClass]=\"item.class\" *ngIf=\"item.items\">\n <div class=\"gantt-table-group-title\" [class.expanded]=\"item.expanded\" (click)=\"expandGroup(item)\">\n <gantt-icon class=\"expand-icon\" [iconName]=\"item.expanded ? 'angle-down' : 'angle-right'\"></gantt-icon>\n <ng-container *ngIf=\"groupTemplate; else default\">\n <ng-template\n [ngTemplateOutlet]=\"groupTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: item.origin, group: item.origin }\"\n ></ng-template>\n </ng-container>\n <ng-template #default>\n <span class=\"group-title\">{{ item.title }}</span>\n </ng-template>\n </div>\n </div>\n\n <div\n *ngIf=\"!item.items\"\n (click)=\"itemClick.emit({ event: $event, selectedValue: item.origin })\"\n cdkDrag\n [cdkDragData]=\"item\"\n [cdkDragDisabled]=\"(draggable && item.itemDraggable === false) || !draggable\"\n (cdkDragStarted)=\"onItemDragStarted($event)\"\n (cdkDragEnded)=\"onItemDragEnded($event)\"\n (cdkDragMoved)=\"emitItemDragMoved($event)\"\n class=\"gantt-table-item\"\n [class.gantt-table-item-with-group]=\"hasGroup\"\n [class.gantt-table-item-first-level-group]=\"item.level === 0 && (item.type | isGanttRangeItem)\"\n [style.height.px]=\"gantt.styles.lineHeight\"\n [style.lineHeight.px]=\"gantt.styles.lineHeight\"\n [class.gantt-table-item-active]=\"ganttUpper.isSelected(item.id)\"\n >\n <ng-template\n [ngTemplateOutlet]=\"rowBeforeTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: item.origin, item: item.origin }\"\n ></ng-template>\n\n <div [classList]=\"column.classList\" *ngFor=\"let column of columns; let first = first\" [style.width]=\"column.columnWidth\">\n <!-- drag icon -->\n <gantt-icon\n *ngIf=\"first && draggable\"\n class=\"gantt-drag-handle\"\n iconName=\"drag\"\n cdkDragHandle\n [cdkDragHandleDisabled]=\"(draggable && item.itemDraggable === false) || !draggable\"\n ></gantt-icon>\n <!-- expand icon -->\n <div\n *ngIf=\"column?.showExpandIcon || (!hasExpandIcon && first)\"\n class=\"gantt-expand-icon\"\n [style.marginLeft.px]=\"item.level * 20\"\n >\n <ng-container *ngIf=\"item.level < gantt.maxLevel - 1 && ((gantt.async && item.expandable) || item.children?.length > 0)\">\n <gantt-icon\n *ngIf=\"!item.loading\"\n class=\"expand-icon\"\n [iconName]=\"item.expanded ? 'angle-down' : 'angle-right'\"\n (click)=\"expandChildren($event, item)\"\n >\n </gantt-icon>\n <gantt-icon *ngIf=\"item.loading\" [iconName]=\"'loading'\"></gantt-icon>\n </ng-container>\n </div>\n <!-- column content -->\n <div class=\"gantt-table-column-content\">\n <ng-template\n [ngTemplateOutlet]=\"column.templateRef\"\n [ngTemplateOutletContext]=\"{ $implicit: item.origin, item: item.origin }\"\n ></ng-template>\n </div>\n </div>\n <ng-template\n [ngTemplateOutlet]=\"rowAfterTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: item.origin, item: item.origin }\"\n ></ng-template>\n </div>\n </ng-container>\n </ng-container>\n</div>\n" }]
|
|
1962
1973
|
}], ctorParameters: function () {
|
|
1963
1974
|
return [{ type: undefined, decorators: [{
|
|
1964
1975
|
type: Inject,
|
|
@@ -2294,7 +2305,7 @@ class GanttLinksComponent {
|
|
|
2294
2305
|
this.elementRef.nativeElement.style.visibility = 'hidden';
|
|
2295
2306
|
});
|
|
2296
2307
|
merge(this.ganttUpper.viewChange, this.ganttUpper.expandChange, this.ganttUpper.view.start$, this.ganttUpper.dragEnded, this.ganttUpper.linkDragEnded, this.ngZone.onStable.pipe(take(1)).pipe(switchMap(() => { var _a; return ((_a = this.ganttUpper.table) === null || _a === void 0 ? void 0 : _a.dragDropped) || EMPTY; })))
|
|
2297
|
-
.pipe(skip(1), debounceTime
|
|
2308
|
+
.pipe(skip(1), debounceTime(0), takeUntil(this.unsubscribe$))
|
|
2298
2309
|
.subscribe(() => {
|
|
2299
2310
|
this.elementRef.nativeElement.style.visibility = 'visible';
|
|
2300
2311
|
this.buildLinks();
|
|
@@ -2562,7 +2573,7 @@ class GanttDomService {
|
|
|
2562
2573
|
.subscribe(subscriber)));
|
|
2563
2574
|
}
|
|
2564
2575
|
getResize() {
|
|
2565
|
-
return isPlatformServer(this.platformId) ? EMPTY : fromEvent(window, 'resize').pipe(auditTime(150));
|
|
2576
|
+
return isPlatformServer(this.platformId) ? EMPTY : fromEvent(window, 'resize').pipe(auditTime$1(150));
|
|
2566
2577
|
}
|
|
2567
2578
|
scrollMainContainer(left) {
|
|
2568
2579
|
if (isNumber(left)) {
|