185 lines
7.2 KiB
HTML
185 lines
7.2 KiB
HTML
<div id="topbar">
|
||
<mat-form-field class="datePicker" appearance="fill">
|
||
<mat-label>{{languageService.lMap.get('dateRangeLabel')}}</mat-label>
|
||
<mat-date-range-input [formGroup]="range" [rangePicker]="picker">
|
||
<input matStartDate formControlName="start" placeholder="Start date" (dateChange)="startDateChanged($event)">
|
||
<input matEndDate formControlName="end" placeholder="End date" (dateChange)="endDateChanged($event)">
|
||
</mat-date-range-input>
|
||
<!-- <mat-hint>tt.mm.yyyy – tt.mm.yyyy</mat-hint> -->
|
||
<mat-datepicker-toggle matIconSuffix [for]="picker"></mat-datepicker-toggle>
|
||
<mat-date-range-picker #picker></mat-date-range-picker>
|
||
|
||
<mat-error *ngIf="range.controls.start.hasError('matStartDateInvalid')">Invalid start date</mat-error>
|
||
<mat-error *ngIf="range.controls.end.hasError('matEndDateInvalid')">Invalid end date</mat-error>
|
||
</mat-form-field>
|
||
|
||
|
||
<!-- <mat-radio-group
|
||
(change)="changeScalar()"
|
||
aria-labelledby="example-radio-group-label"
|
||
class="example-radio-group"
|
||
[(ngModel)]="selectedScalar">
|
||
<mat-radio-button color="primary" class="example-radio-button" *ngFor="let scalar of scalars" [value]="scalar" >
|
||
{{scalar}}
|
||
</mat-radio-button>
|
||
</mat-radio-group> -->
|
||
<div class="scalarContainer">
|
||
<mat-button-toggle-group (change)="changeScalar()" name="fontStyle" aria-label="Font Style" [(ngModel)]="selectedScalar">
|
||
<mat-button-toggle value="bold"*ngFor="let scalar of scalars" [value]="scalar">
|
||
{{scalar}}
|
||
</mat-button-toggle>
|
||
</mat-button-toggle-group>
|
||
<br>
|
||
<mat-slide-toggle color="primary" [(ngModel)]="showDetails" [checked]="showDetails" (change)="refreshData()">{{languageService.lMap.get('detailButton')}}</mat-slide-toggle>
|
||
<br>
|
||
|
||
</div>
|
||
|
||
<!-- <p>Selected range: {{range.value | json}}</p> -->
|
||
<!-- <div class="toggleContainer">
|
||
|
||
<mat-slide-toggle [disabled]="filters == null" (change)="refreshData()" color="primary" [(ngModel)]="filterEnabled" [checked]="filterEnabled" (change)="applyFilter()">{{languageService.lMap.get('filterButton')}}</mat-slide-toggle>
|
||
<mat-slide-toggle color="primary" [(ngModel)]="sortEnabled" [checked]="sortEnabled" >{{languageService.lMap.get('sortButton')}}</mat-slide-toggle>
|
||
|
||
</div> -->
|
||
|
||
|
||
|
||
<mat-form-field style="width: 5%;">
|
||
<mat-label>{{languageService.lMap.get('language')}}</mat-label>
|
||
<mat-select (selectionChange)="languageChange($event)" [(value)]="languageService.language">
|
||
<mat-option *ngFor="let lang of languageService.languages" [value]="lang">
|
||
{{lang}}
|
||
</mat-option>
|
||
</mat-select>
|
||
</mat-form-field>
|
||
</div>
|
||
<br>
|
||
<div>
|
||
<button mat-raised-button class="filterButton" aria-label="Filtern" (click)="openFilterDialog()">
|
||
{{languageService.lMap.get('nttGanttFilterButton')}} <mat-icon>filter_list</mat-icon>
|
||
</button>
|
||
<button [disabled]="filterEnabled" mat-icon-button aria-label="clear Filters and Sort" (click)="clearFilter()">
|
||
{{languageService.lMap.get('clearFilter')}} <mat-icon>close</mat-icon>
|
||
</button>
|
||
</div>
|
||
|
||
|
||
<div
|
||
*ngIf="!this.showNoResultsError" id="showSpin" data-bind="visible: spin"
|
||
style=" position: absolute; top: auto; left: 45%;">
|
||
<img src="https://upload.wikimedia.org/wikipedia/commons/b/b1/Loading_icon.gif" rel="stylesheet"/>
|
||
</div>
|
||
|
||
|
||
|
||
<!-- <button ejs-button id='filterRecord' (click)='filter()'>Filter</button> -->
|
||
<ejs-gantt *ngIf="renderGantt" #ganttObject id="ganttDefault"
|
||
[ngStyle]="{'visibility':spin ? 'hidden' : 'visible'}"
|
||
[dataSource]="data"
|
||
[allowSorting] = 'true'
|
||
[resources]="resources"
|
||
[taskFields]="taskSettings"
|
||
[resourceFields]="resourceFields"
|
||
[editSettings]="editSettings"
|
||
[columns]="columns"
|
||
[toolbar]="toolbar"
|
||
[labelSettings]="labelSettings"
|
||
[allowSelection]='true'
|
||
[allowResizing] = 'true'
|
||
[highlightWeekends] = 'true'
|
||
[treeColumnIndex]="1"
|
||
[projectStartDate]="this.projectStartDate"
|
||
[projectEndDate]="this.projectEndDate"
|
||
viewType="ResourceView"
|
||
[showOverAllocation] = 'true'
|
||
[enableMultiTaskbar]= 'true'
|
||
[collapseAllParentTasks]= 'true'
|
||
[enableVirtualization]="false"
|
||
[allowSorting]= "true"
|
||
[allowFiltering]="false"
|
||
[timelineSettings]="timelineSettings"
|
||
[selectionSettings]="selectionSettings"
|
||
[tooltipSettings]="tooltipSettings"
|
||
[splitterSettings] = "splitterSettings"
|
||
(actionComplete)="actionComplete($event)"
|
||
gridLines="Both"
|
||
|
||
(actionBegin)="actionBegin($event)"
|
||
(taskbarEditing)="taskbarEditing($event)"
|
||
(taskbarEdited)="taskbarEdited($event)"
|
||
(toolbarClick)="toolbarBtnClicked($event)"
|
||
(rowSelected) = "rowSelected($event)"
|
||
(rowDeselected) = "rowDeselected($event)"
|
||
(created)="created($event)"
|
||
(dataBound)="dataBound($event)"
|
||
(load)="load($event)"
|
||
(queryTaskbarInfo) = "queryTaskbarInfo($event)"
|
||
(expanding)="onExpand($event)"
|
||
(splitterResized)="onResizing($event)"
|
||
>
|
||
<ng-template #tooltipSettingsTaskbar let-data>
|
||
<div>
|
||
<table>
|
||
<ng-container>
|
||
<tr>
|
||
<td style="padding:3px">{{languageService.lMap.get('tooltipSummary')}}: {{data.taskData.resources[0].resourceName}}</td>
|
||
</tr>
|
||
<tr>
|
||
<td style="padding:3px">{{languageService.lMap.get('tooltipState')}}: {{dataService.getStateNameById(data.taskData.resources[0].state)}}</td>
|
||
</tr>
|
||
<tr>
|
||
<td style="padding:3px">{{languageService.lMap.get('tooltipPaketType')}}: {{data.taskData.resources[0].packageName}}</td>
|
||
</tr>
|
||
<tr>
|
||
<td style="padding:3px">{{languageService.lMap.get('tooltipContract')}}: {{data.taskData.resources[0].vertragName}}</td>
|
||
</tr>
|
||
<tr>
|
||
<td style="padding:3px">{{languageService.lMap.get('tooltipSupportGroupKv')}}: {{data.taskData.resources[0].supportGroup}}</td>
|
||
</tr>
|
||
<tr>
|
||
<td style="padding:3px">{{languageService.lMap.get('tooltipSupportGroupIh')}}: {{data.taskData.resources[0].coordinatorSg}}</td>
|
||
</tr>
|
||
<tr>
|
||
<td style="padding:3px">{{languageService.lMap.get('tooltipDate')}}: {{data.taskData.resources[0].tasks[1].StartDate | date:'dd.MM.yyyy'}}</td>
|
||
</tr>
|
||
<!-- <tr>
|
||
<td style="padding:3px"> Date: {{data.TaskID}}</td>
|
||
</tr> -->
|
||
|
||
</ng-container>
|
||
</table>
|
||
</div>
|
||
</ng-template>
|
||
</ejs-gantt>
|
||
|
||
<app-plan-time-bar #plantimeComponent *ngIf="renderplanTime"
|
||
[inputData]="inputForTimeline"
|
||
[splitterSettings]="splitterSettings"
|
||
[parentResources]="allResources"
|
||
[filters]="filters"
|
||
|
||
></app-plan-time-bar>
|
||
|
||
<div *ngIf="this.showNoResultsError && this.languageService.language =='DE'"><h2>Die Suche lieferte keine Ergebnisse</h2></div>
|
||
<div *ngIf="this.showNoResultsError && this.languageService.language =='EN'"><h2>The search did not return any results</h2></div>
|
||
<!-- [filterSettings]="filterSettings" -->
|
||
|
||
<mat-paginator #paginator
|
||
[ngStyle]="{'visibility':spin ? 'hidden' : 'visible'}"
|
||
class="demo-paginator"
|
||
(page)="handlePageEvent($event)"
|
||
[length]="this.dataService.getTotalSize()"
|
||
[pageSize]="20"
|
||
[disabled]="false"
|
||
[showFirstLastButtons]="true"
|
||
[pageSizeOptions]="[10, 20, 50, 70, 100, 200, 500]"
|
||
[hidePageSize]="false"
|
||
[pageIndex]="0"
|
||
aria-label="Seite auswählen">
|
||
</mat-paginator>
|
||
|
||
|
||
|
||
|