@progress/kendo-angular-gantt
Version:
Kendo UI Angular Gantt
228 lines (227 loc) • 10.3 kB
JavaScript
/**-----------------------------------------------------------------------------------------
* Copyright © 2025 Progress Software Corporation. All rights reserved.
* Licensed under commercial license. See LICENSE.md in the project root for more information
*-------------------------------------------------------------------------------------------*/
import { ChangeDetectorRef, Component, forwardRef, Input, TemplateRef } from '@angular/core';
import { MappingService } from '../common/mapping.service';
import { NavigationService } from '../navigation/navigation.service';
import { EditService } from '../editing/edit.service';
import { DependencyDomService } from '../dependencies/dependency-dom.service';
import { OptionChangesService } from '../common/option-changes.service';
import { TimelineViewService } from './../timeline/timeline-view.service';
import { GanttTaskBase } from './gantt-task-base';
import { xIcon } from '@progress/kendo-svg-icons';
import { NgClass, NgTemplateOutlet } from '@angular/common';
import { EventsOutsideAngularDirective, isPresent } from '@progress/kendo-angular-common';
import { IconWrapperComponent } from '@progress/kendo-angular-icons';
import { touchEnabled } from '@progress/kendo-common';
import * as i0 from "@angular/core";
import * as i1 from "../editing/edit.service";
import * as i2 from "../common/mapping.service";
import * as i3 from "./../timeline/timeline-view.service";
import * as i4 from "../dependencies/dependency-dom.service";
import * as i5 from "../common/option-changes.service";
import * as i6 from "../navigation/navigation.service";
/**
* @hidden
*/
export class GanttTaskComponent extends GanttTaskBase {
editService;
taskContentTemplate;
taskTemplate;
xIcon = xIcon;
touchEnabled = touchEnabled;
get showDragHandles() {
return isPresent(this.taskDragService);
}
constructor(editService, mapper, timelineViewService, dependencyDomService, optionChangesService, cdr, navigationService) {
super(mapper, timelineViewService, dependencyDomService, optionChangesService, cdr, navigationService);
this.editService = editService;
}
onTaskDelete() {
this.editService.dataItem = this.dataItem;
this.editService.taskDelete.next(this.dataItem);
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: GanttTaskComponent, deps: [{ token: i1.EditService }, { token: i2.MappingService }, { token: i3.TimelineViewService }, { token: i4.DependencyDomService }, { token: i5.OptionChangesService }, { token: i0.ChangeDetectorRef }, { token: i6.NavigationService }], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: GanttTaskComponent, isStandalone: true, selector: "kendo-gantt-task", inputs: { taskContentTemplate: "taskContentTemplate", taskTemplate: "taskTemplate" }, providers: [
{
provide: GanttTaskBase,
useExisting: forwardRef(() => GanttTaskComponent)
}
], usesInheritance: true, ngImport: i0, template: `
<div
#task
class="k-task k-task-single"
role="treeitem"
[ngClass]="taskClass(dataItem)"
[style.width.px]="taskWidth"
[attr.title]="mapper.extractFromTask(dataItem, 'title')"
[class.k-selected]="isSelected(dataItem)"
[attr.aria-selected]="ariaSelected"
[attr.aria-level]="level + 1"
>
(!taskTemplate) {
<div
class="k-task-complete"
[style.width.px]="draggedCompletionWidth ?? completionOverlayWidth"
aria-hidden="true"
>
</div>
<div class="k-task-content">
<div class="k-task-template">
(!taskContentTemplate) {
{{ mapper.extractFromTask(dataItem, 'title') }}
} {
<ng-template
[ngTemplateOutlet]="taskContentTemplate"
[ngTemplateOutletContext]="{ $implicit: dataItem }"
></ng-template>
}
</div>
<span
class="k-task-actions"
aria-hidden="true"
>
<span
class="k-link k-task-delete"
[kendoEventsOutsideAngular]="{
click: onTaskDelete
}"
[scope]="this"
>
<kendo-icon-wrapper
icon="x"
[svgIcon]="xIcon"></kendo-icon-wrapper>
</span>
</span>
(showDragHandles) {
<span class="k-resize-handle k-resize-w"></span>
<span class="k-resize-handle k-resize-e"></span>
}
</div>
}
(taskTemplate) {
<ng-template
[ngTemplateOutlet]="taskTemplate"
[ngTemplateOutletContext]="{
$implicit: dataItem,
elementWidth: taskWidth
}"
></ng-template>
}
</div>
(showDragHandles) {
<div class="k-task-draghandle"
[style.left.px]="draggedCompletionWidth ?? completionOverlayWidth"></div>
}
(renderDependencyDragClues) {
<div
class="k-task-dot k-task-start k-touch-action-none"
[class.k-display-block]="touchEnabled"
>
</div>
<div
class="k-task-dot k-task-end k-touch-action-none"
[class.k-display-block]="touchEnabled"
>
</div>
}
`, isInline: true, dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: EventsOutsideAngularDirective, selector: "[kendoEventsOutsideAngular]", inputs: ["kendoEventsOutsideAngular", "scope"] }, { kind: "component", type: IconWrapperComponent, selector: "kendo-icon-wrapper", inputs: ["name", "svgIcon", "innerCssClass", "customFontClass", "size"], exportAs: ["kendoIconWrapper"] }] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: GanttTaskComponent, decorators: [{
type: Component,
args: [{
selector: 'kendo-gantt-task',
providers: [
{
provide: GanttTaskBase,
useExisting: forwardRef(() => GanttTaskComponent)
}
],
template: `
<div
#task
class="k-task k-task-single"
role="treeitem"
[ngClass]="taskClass(dataItem)"
[style.width.px]="taskWidth"
[attr.title]="mapper.extractFromTask(dataItem, 'title')"
[class.k-selected]="isSelected(dataItem)"
[attr.aria-selected]="ariaSelected"
[attr.aria-level]="level + 1"
>
(!taskTemplate) {
<div
class="k-task-complete"
[style.width.px]="draggedCompletionWidth ?? completionOverlayWidth"
aria-hidden="true"
>
</div>
<div class="k-task-content">
<div class="k-task-template">
(!taskContentTemplate) {
{{ mapper.extractFromTask(dataItem, 'title') }}
} {
<ng-template
[ngTemplateOutlet]="taskContentTemplate"
[ngTemplateOutletContext]="{ $implicit: dataItem }"
></ng-template>
}
</div>
<span
class="k-task-actions"
aria-hidden="true"
>
<span
class="k-link k-task-delete"
[kendoEventsOutsideAngular]="{
click: onTaskDelete
}"
[scope]="this"
>
<kendo-icon-wrapper
icon="x"
[svgIcon]="xIcon"></kendo-icon-wrapper>
</span>
</span>
(showDragHandles) {
<span class="k-resize-handle k-resize-w"></span>
<span class="k-resize-handle k-resize-e"></span>
}
</div>
}
(taskTemplate) {
<ng-template
[ngTemplateOutlet]="taskTemplate"
[ngTemplateOutletContext]="{
$implicit: dataItem,
elementWidth: taskWidth
}"
></ng-template>
}
</div>
(showDragHandles) {
<div class="k-task-draghandle"
[style.left.px]="draggedCompletionWidth ?? completionOverlayWidth"></div>
}
(renderDependencyDragClues) {
<div
class="k-task-dot k-task-start k-touch-action-none"
[class.k-display-block]="touchEnabled"
>
</div>
<div
class="k-task-dot k-task-end k-touch-action-none"
[class.k-display-block]="touchEnabled"
>
</div>
}
`,
standalone: true,
imports: [NgClass, NgTemplateOutlet, EventsOutsideAngularDirective, IconWrapperComponent]
}]
}], ctorParameters: () => [{ type: i1.EditService }, { type: i2.MappingService }, { type: i3.TimelineViewService }, { type: i4.DependencyDomService }, { type: i5.OptionChangesService }, { type: i0.ChangeDetectorRef }, { type: i6.NavigationService }], propDecorators: { taskContentTemplate: [{
type: Input
}], taskTemplate: [{
type: Input
}] } });