taubem
/
ChangeCalendar
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

new layout

main
Said Gedik 2024-05-13 16:39:49 +02:00
parent c9b773aa8d
commit cd3ef057bb
3 changed files with 260 additions and 225 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

153
frontend/src/app/ntt-gantt/ntt-gantt.component.css
View File

@ -1,3 +1,18 @@
#topbar {
display: flex;
flex-direction: row;
justify-content: space-between;
height: 57px;
margin-bottom: 20px;
border: dashed green 1px;
}
.restartButton {
width: 60px;
}
.example-radio-group { .example-radio-group {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
@ -9,22 +24,18 @@
margin: 5px; margin: 5px;
} }
#topbar {
display: flex;
flex-direction: row;
margin: 0px 0;
align-items: flex-start;
height: 3%;
}
.mat-mdc-form-field + .mat-mdc-form-field {
.mat-mdc-form-field+.mat-mdc-form-field {
margin-left: 8px; margin-left: 8px;
} }
.mat-button-toggle-group .mat-button-toggle-button {
height: 100%!important; .mat-button-toggle-group .mat-button-toggle-button {
height: 100% !important;
} }
.toggleContainer{
.toggleContainer {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: flex-start; align-items: flex-start;
@ -32,88 +43,108 @@
width: 100%; width: 100%;
} }
.filterContainer{ .filterContainer {
width: 100%; width: 100%;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
align-items: flex-start; align-items: flex-start;
} }
.clearFilter{ .clearFilter {
margin-left: 10px; margin-left: 10px;
} }
.showDetails{ .showDetails {
margin-left: 80px; margin-left: 80px;
margin-top: 8.5px; margin-top: 8.5px;
} }
.filter{
.filter {
margin-top: 0.5%; margin-top: 0.5%;
margin-left: 1%; margin-left: 1%;
} }
.checkbox{ .checkbox {
margin: 0 0.5%; margin: 0 0.5%;
} }
.scalarContainer{
margin-left: 0.5%; .dateButton {
margin-right: 0.5%; width: 59px;
background-color: rgba(0, 0, 0, 0.04);
border-width: 1px;
border: none;
border-bottom: 1px;
border-top-right-radius: 4px;
} }
.filterButton{ .dateButton:hover {
border-width: 2px;
} border-top-right-radius: 4px;
.dateButton{
height: 59px; width: 59px; background-color: rgba(0, 0, 0, 0.04); border-width: 1px; border-top: none; border-left: none; border-right: none; border-top-right-radius: 4px; margin-right: 15px;
}
.dateButton:hover{
height: 59px; width: 59px; background-color: rgba(0, 0, 0, 0.04); border-width: 2px; border-top: 1px; border-left: 1px; border-right: 1px; border-top-right-radius: 4px;
background-color: rgba(0, 0, 0, 0.08); background-color: rgba(0, 0, 0, 0.08);
} }
.dateButton:checked{ .editButton {
height: 59px; width: 59px; background-color: rgba(0, 0, 0, 0.04); border-width: 2px; border-top: 1px; border-left: 1px; border-right: 1px; border-top-right-radius: 4px; height: 59px;
background-color: red; width: 59px;
} background-color: rgba(0, 0, 0, 0.04);
border: none;
border-top-right-radius: 4px;
margin-right: 15px;
}
.editButton{ .editButton:hover {
height: 59px; width: 59px; background-color: rgba(0, 0, 0, 0.04); border: none; border-top-right-radius: 4px; margin-right: 15px; height: 59px;
} width: 59px;
background-color: rgba(0, 0, 0, 0.04);
.editButton:hover{ border-top-right-radius: 4px;
height: 59px; width: 59px; background-color: rgba(0, 0, 0, 0.04); border-top-right-radius: 4px;
background-color: rgba(0, 0, 0, 0.08); background-color: rgba(0, 0, 0, 0.08);
} }
.editButton:checked{ .editButton:checked {
height: 59px; width: 59px; background-color: rgba(0, 0, 0, 0.04); border-top-right-radius: 4px; height: 59px;
width: 59px;
background-color: rgba(0, 0, 0, 0.04);
border-top-right-radius: 4px;
background-color: red; background-color: red;
} }
.deleteButton{ .deleteButton {
height: 59px; width: 59px; background-color: rgba(0, 0, 0, 0.04); border-width: 1px; border: none; border-top-right-radius: 4px; margin-right: 15px; margin-left: -15px; height: 59px;
} width: 59px;
background-color: rgba(0, 0, 0, 0.04);
border-width: 1px;
border: none;
border-top-right-radius: 4px;
margin-right: 15px;
margin-left: -15px;
}
.deleteButton:hover{ .deleteButton:hover {
height: 59px; width: 59px; background-color: rgba(0, 0, 0, 0.04); border-width: 2px; border-top-right-radius: 4px; height: 59px;
width: 59px;
background-color: rgba(0, 0, 0, 0.04);
border-width: 2px;
border-top-right-radius: 4px;
background-color: rgba(0, 0, 0, 0.08); background-color: rgba(0, 0, 0, 0.08);
} }
.deleteButton:checked{ .deleteButton:checked {
height: 59px; width: 59px; background-color: rgba(0, 0, 0, 0.04); border-width: 2px; border-top-right-radius: 4px; height: 59px;
width: 59px;
background-color: rgba(0, 0, 0, 0.04);
border-width: 2px;
border-top-right-radius: 4px;
background-color: red; background-color: red;
} }
/* .datePickerContainer{ /* .datePickerContainer{
height: 20px; height: 20px;
width: 400px; width: 400px;
} */ } */
/* /*
::ng-deep .mat-slide-toggle.mat-checked:not(.mat-disabled) .mat-slide-toggle-bar { ::ng-deep .mat-slide-toggle.mat-checked:not(.mat-disabled) .mat-slide-toggle-bar {
background-color: #d56100; background-color: #d56100;
} }
@ -136,12 +167,16 @@
background-color: #ef6c00; background-color: #ef6c00;
} }
.dot-badge { .dot-badge {
background-color: #00a79d; background-color: #00a79d;
color: #00a79d; color: #00a79d;
width: 15px; /* Breite des Punkts */ width: 15px;
height: 15px; /* Höhe des Punkts */ /* Breite des Punkts */
border-radius: 50%; /* Rundung des Punkts */ height: 15px;
/* Höhe des Punkts */
border-radius: 50%;
/* Rundung des Punkts */
} }
/* ::ng-deep .mat-calendar{ /* ::ng-deep .mat-calendar{
@ -149,7 +184,7 @@
} */ } */
/* ::ng-deep .mat-calendar-body-label{ */ /* ::ng-deep .mat-calendar-body-label{ */
/* color: white; */ /* color: white; */
/* } /* }
::ng-deep .mat-calendar-cell-content{ ::ng-deep .mat-calendar-cell-content{

242
frontend/src/app/ntt-gantt/ntt-gantt.component.html
View File

@ -1,6 +1,9 @@
<div *ngIf="!errorService.rsso && !rssoInit" id="topbar"> <div *ngIf="!errorService.rsso && !rssoInit" id="topbar">
<mat-form-field class="datePicker" appearance="fill" > <!-- Date Range Picker -->
<div style="display: flex; gap: 10px;">
<div style="display: flex;">
<mat-form-field appearance="fill" style="width: 237px;">
<mat-label>{{languageService.lMap.get('dateRangeLabel')}}</mat-label> <mat-label>{{languageService.lMap.get('dateRangeLabel')}}</mat-label>
<mat-date-range-input [formGroup]="range" [rangePicker]="picker"> <mat-date-range-input [formGroup]="range" [rangePicker]="picker">
<input matStartDate formControlName="start" placeholder="Start date" (dateChange)="startDateChanged($event)"> <input matStartDate formControlName="start" placeholder="Start date" (dateChange)="startDateChanged($event)">
@ -11,9 +14,13 @@
<mat-error *ngIf="range.controls.start.hasError('matStartDateInvalid')">Invalid start date</mat-error> <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-error *ngIf="range.controls.end.hasError('matEndDateInvalid')">Invalid end date</mat-error>
</mat-form-field> </mat-form-field>
<button mat-basic-button class="dateButton" color="" style="" (click)="picker.open()"><mat-icon>calendar_today</mat-icon></button>
<mat-form-field style="width: 90px; height: 59px;" appearance="fill"> <button mat-basic-button class="dateButton" color=""
(click)="picker.open()"><mat-icon>calendar_today</mat-icon></button>
</div>
<!-- Language Picker -->
<mat-form-field style="width: 90px;" appearance="fill">
<mat-label>{{languageService.lMap.get('language')}}</mat-label> <mat-label>{{languageService.lMap.get('language')}}</mat-label>
<mat-select (selectionChange)="languageChange($event)" [(value)]="languageService.language"> <mat-select (selectionChange)="languageChange($event)" [(value)]="languageService.language">
<mat-option *ngFor="let lang of languageService.languages" [value]="lang"> <mat-option *ngFor="let lang of languageService.languages" [value]="lang">
@ -21,28 +28,21 @@
</mat-option> </mat-option>
</mat-select> </mat-select>
</mat-form-field> </mat-form-field>
<div class="scalarContainer">
<mat-button-toggle-group style="margin-top: 5px;" (change)="changeScalar()" name="fontStyle" aria-label="Font Style" [(ngModel)]="selectedScalar"> <!-- Scale Picker -->
<mat-button-toggle value="bold"*ngFor="let scalar of scalars" [value]="scalar"> <mat-button-toggle-group style="height: 100%;" (change)="changeScalar()" name="fontStyle" aria-label="Font Style"
[(ngModel)]="selectedScalar">
<mat-button-toggle style="display: flex; align-items: center;" value="bold" *ngFor="let scalar of scalars"
[value]="scalar">
{{scalar}} {{scalar}}
</mat-button-toggle> </mat-button-toggle>
</mat-button-toggle-group> </mat-button-toggle-group>
</div>
<!-- <mat-form-field appearance="fill" >
<mat-label>Preset</mat-label>
<mat-select [(value)]="selectedPreset">
<mat-option *ngFor="let preset of presets" [value]="preset">
{{preset.name}}
</mat-option>
</mat-select>
</mat-form-field> -->
<!-- Preset Picker -->
<mat-form-field appearance="fill" style="width: 300px;"> <mat-form-field appearance="fill" style="width: 300px;">
<mat-label>Preset</mat-label> <mat-label>Preset</mat-label>
<mat-select [(value)]="selectedPreset" (selectionChange)="selectPreset($event)"> <mat-select [(value)]="selectedPreset" (selectionChange)="selectPreset($event)">
<mat-optgroup *ngFor="let group of presetGroups" [label]="group.name" <mat-optgroup *ngFor="let group of presetGroups" [label]="group.name" [disabled]="group.disabled">
[disabled]="group.disabled">
<mat-option *ngFor="let preset of group.presets" [value]="preset"> <mat-option *ngFor="let preset of group.presets" [value]="preset">
{{preset.name}} {{preset.name}}
<!-- <button style="align-self: right;" *ngIf="group.name == 'User'" mat-icon-button><mat-icon>delete_forever</mat-icon></button> <!-- <button style="align-self: right;" *ngIf="group.name == 'User'" mat-icon-button><mat-icon>delete_forever</mat-icon></button>
@ -52,15 +52,31 @@
</mat-select> </mat-select>
</mat-form-field> </mat-form-field>
<button mat-basic-button *ngIf="isUserPreset" class="editButton"
(click)="openRenameDialog()"><mat-icon>edit</mat-icon></button>
<button mat-basic-button *ngIf="isUserPreset" class="deleteButton"
(click)="openDeleteDialog()"><mat-icon>delete_forever</mat-icon></button>
<button mat-basic-button *ngIf="isUserPreset" class="editButton" (click)="openRenameDialog()" color="" style="" ><mat-icon>edit</mat-icon></button> <!-- Restart Button -->
<button mat-basic-button *ngIf="isUserPreset" class="deleteButton" (click)="openDeleteDialog()" color="" style="" ><mat-icon>delete_forever</mat-icon></button> <button class="restartButton" aria-label="Refresh" (click)="refreshGanttWithFilters()">
<button mat-raised-button style="margin-top: 5px; margin-left: 10px; height: 50px; margin-right: 5px;" aria-label="Refresh" (click)="refreshGanttWithFilters()"> <mat-icon>restart_alt</mat-icon>
<mat-icon >restart_alt</mat-icon>
</button> </button>
<h3 *ngIf="userId" style="font-family: Arial, Helvetica, sans-serif;"><mat-icon style="color: green;">verified_user</mat-icon>{{this.userId}}</h3>
<h3 *ngIf="errorService.rsso" style="font-family: Arial, Helvetica, sans-serif;"><mat-icon style="color: red;">verified_user</mat-icon> RSSO Auth Failed</h3> </div>
<h3 *ngIf="!errorService.rsso &&rssoInit" style="font-family: Arial, Helvetica, sans-serif;"><mat-icon style="color: orange;">verified_user</mat-icon> RSSO: initializing</h3>
<!-- User -->
<div style="display: flex; justify-content: center; align-items: center; border: dashed blue 1px;">
<h3 *ngIf="userId" style="font-family: Arial, Helvetica, sans-serif; display: flex; align-items: center; gap: 5px;">
<mat-icon style="color: green;">verified_user</mat-icon>{{this.userId}}
</h3>
<h3 *ngIf="errorService.rsso"
style="font-family: Arial, Helvetica, sans-serif; display: flex; align-items: center; gap: 5px;"><mat-icon
style="color: red;">verified_user</mat-icon> RSSO Auth Failed</h3>
<h3 *ngIf="!errorService.rsso &&rssoInit"
style="font-family: Arial, Helvetica, sans-serif; display: flex; align-items: center; gap: 5px;"><mat-icon
style="color: orange;">verified_user</mat-icon> RSSO: initializing</h3>
</div>
@ -68,82 +84,61 @@
<div *ngIf="!errorService.rsso && !rssoInit" class="filterContainer"> <div *ngIf="!errorService.rsso && !rssoInit" class="filterContainer">
<button *ngIf="transitionButton" mat-raised-button style="margin-bottom: 2px; background-color: #00a79d; margin-left: 1px; margin-right: 1px;" class="filterButton" aria-label="Filtern" (click)=" openStatTransitionDialog()">{{languageService.lMap.get('stateChange')}}</button> <button *ngIf="transitionButton" mat-raised-button
<button *ngIf="approveButton" mat-raised-button style="margin-bottom: 2px; margin-left: 1px; margin-right: 1px;" class="filterButton" aria-label="Filtern" (click)="approve()">{{languageService.lMap.get('genehmigen')}}</button> style="margin-bottom: 2px; background-color: #00a79d; margin-left: 1px; margin-right: 1px;" class="filterButton"
<button *ngIf="rejectButton" mat-raised-button style="margin-bottom: 2px; margin-left: 1px; margin-right: 1px;" class="filterButton" aria-label="Filtern" (click)="reject()">{{languageService.lMap.get('ablehnen')}}</button> aria-label="Filtern" (click)=" openStatTransitionDialog()">{{languageService.lMap.get('stateChange')}}</button>
<button *ngIf="cancelButton" mat-raised-button style="margin-bottom: 2px; margin-left: 1px; margin-right: 1px;" class="filterButton" aria-label="Filtern" (click)="cancel()">{{languageService.lMap.get('stornieren')}}</button> <button *ngIf="approveButton" mat-raised-button style="margin-bottom: 2px; margin-left: 1px; margin-right: 1px;"
<button *ngIf="reApproveButton" mat-raised-button style="margin-bottom: 2px; margin-left: 1px; margin-right: 1px;" class="filterButton" aria-label="Filtern" (click)="reApprove()">Erneut zur Genehmigung</button> class="filterButton" aria-label="Filtern" (click)="approve()">{{languageService.lMap.get('genehmigen')}}</button>
<button *ngIf="implementerButton" mat-raised-button style="margin-bottom: 2px; margin-left: 1px; margin-right: 1px;" class="filterButton" aria-label="Filtern" (click)="openImplementerDialog()">{{languageService.lMap.get('implementerDialogHeading')}}</button> <button *ngIf="rejectButton" mat-raised-button style="margin-bottom: 2px; margin-left: 1px; margin-right: 1px;"
class="filterButton" aria-label="Filtern" (click)="reject()">{{languageService.lMap.get('ablehnen')}}</button>
<button *ngIf="cancelButton" mat-raised-button style="margin-bottom: 2px; margin-left: 1px; margin-right: 1px;"
class="filterButton" aria-label="Filtern" (click)="cancel()">{{languageService.lMap.get('stornieren')}}</button>
<button *ngIf="reApproveButton" mat-raised-button style="margin-bottom: 2px; margin-left: 1px; margin-right: 1px;"
class="filterButton" aria-label="Filtern" (click)="reApprove()">Erneut zur Genehmigung</button>
<button *ngIf="implementerButton" mat-raised-button style="margin-bottom: 2px; margin-left: 1px; margin-right: 1px;"
class="filterButton" aria-label="Filtern"
(click)="openImplementerDialog()">{{languageService.lMap.get('implementerDialogHeading')}}</button>
<button mat-raised-button class="filterButton" aria-label="Filtern" (click)="openFilterDialog()"> <button mat-raised-button class="filterButton" aria-label="Filtern" (click)="openFilterDialog()">
{{languageService.lMap.get('nttGanttFilterButton')}} <mat-icon style="color: #00a79d;">filter_alt</mat-icon> {{languageService.lMap.get('nttGanttFilterButton')}} <mat-icon style="color: #00a79d;">filter_alt</mat-icon>
</button> </button>
<mat-badge *ngIf="filterBadge" [matBadge]="''" class="dot-badge"></mat-badge> <mat-badge *ngIf="filterBadge" [matBadge]="''" class="dot-badge"></mat-badge>
<button *ngIf="showSaveButton" mat-raised-button (click)="updatePreset()">Speichern</button> <button *ngIf="showSaveButton" mat-raised-button (click)="updatePreset()">Speichern</button>
<button *ngIf="showSaveUnderButton" mat-raised-button (click)="openSaveUnderDialog()" >Speichern unter</button> <button *ngIf="showSaveUnderButton" mat-raised-button (click)="openSaveUnderDialog()">Speichern unter</button>
<button [disabled]="!filterEnabled" mat-icon-button aria-label="clear Filters and Sort" class="clearFilter" (click)="clearFilter()"> <button [disabled]="!filterEnabled" mat-icon-button aria-label="clear Filters and Sort" class="clearFilter"
{{languageService.lMap.get('clearFilter')}} <mat-icon >close</mat-icon> (click)="clearFilter()">
{{languageService.lMap.get('clearFilter')}} <mat-icon>close</mat-icon>
</button> </button>
<mat-slide-toggle class="showDetails" color="primary" [(ngModel)]="showDetails" [checked]="showDetails" (change)="refreshData()">{{languageService.lMap.get('detailButton')}}</mat-slide-toggle> <mat-slide-toggle class="showDetails" color="primary" [(ngModel)]="showDetails" [checked]="showDetails"
(change)="refreshData()">{{languageService.lMap.get('detailButton')}}</mat-slide-toggle>
</div> </div>
<div <div
*ngIf="!this.disableSpin && !this.showNoResultsError && !this.errorService.critical && !this.errorService.rsso && !this.errorService.error" id="showSpin" data-bind="visible: spin" *ngIf="!this.disableSpin && !this.showNoResultsError && !this.errorService.critical && !this.errorService.rsso && !this.errorService.error"
style=" position: absolute; top: auto; left: 30%;"> id="showSpin" data-bind="visible: spin" style=" position: absolute; top: auto; left: 30%;">
<img src="https://upload.wikimedia.org/wikipedia/commons/b/b1/Loading_icon.gif" rel="stylesheet"/> <img src="https://upload.wikimedia.org/wikipedia/commons/b/b1/Loading_icon.gif" rel="stylesheet" />
</div> </div>
<!-- <button ejs-button id='filterRecord' (click)='filter()'>Filter</button> --> <!-- <button ejs-button id='filterRecord' (click)='filter()'>Filter</button> -->
<ejs-gantt *ngIf="renderGantt" #ganttObject id="ganttDefault" <ejs-gantt *ngIf="renderGantt" #ganttObject id="ganttDefault" [enableVirtualization]="true"
[enableVirtualization]="true" [ngStyle]="{'visibility':spin ? 'hidden' : 'visible'}" [dataSource]="data" [allowSorting]='true'
[ngStyle]="{'visibility':spin ? 'hidden' : 'visible'}" [resources]="resources" [taskFields]="taskSettings" [resourceFields]="resourceFields" [editSettings]="editSettings"
[dataSource]="data" [columns]="columns" [toolbar]="toolbar" [labelSettings]="labelSettings" [allowSelection]='true' [allowResizing]='true'
[allowSorting] = 'true' [highlightWeekends]='true' [treeColumnIndex]="1" [projectStartDate]="this.projectStartDate"
[resources]="resources" [projectEndDate]="this.projectEndDate" viewType="ResourceView" [showOverAllocation]='true' [enableMultiTaskbar]='true'
[taskFields]="taskSettings" [collapseAllParentTasks]='true' [enableVirtualization]="false" [allowSorting]="true" [allowFiltering]="false"
[resourceFields]="resourceFields" [timelineSettings]="timelineSettings" [selectionSettings]="selectionSettings" [tooltipSettings]="tooltipSettings"
[editSettings]="editSettings" [splitterSettings]="splitterSettings" (actionComplete)="actionComplete($event)" gridLines="Both"
[columns]="columns" (splitterResizing)="splitterResizing($event)" (actionBegin)="actionBegin($event)"
[toolbar]="toolbar" (taskbarEditing)="taskbarEditing($event)" (taskbarEdited)="taskbarEdited($event)"
[labelSettings]="labelSettings" (toolbarClick)="toolbarBtnClicked($event)" (rowSelected)="rowSelected($event)" (rowDeselected)="rowDeselected($event)"
[allowSelection]='true' (created)="created($event)" (dataBound)="dataBound($event)" (load)="load($event)"
[allowResizing] = 'true' (queryTaskbarInfo)="queryTaskbarInfo($event)" (expanding)="onExpand($event)">
[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"
(splitterResizing)="splitterResizing($event)"
(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)"
>
<ng-template #tooltipSettingsTaskbar let-data> <ng-template #tooltipSettingsTaskbar let-data>
@ -151,25 +146,32 @@
<table> <table>
<ng-container> <ng-container>
<tr> <tr>
<td style="padding:3px">{{languageService.lMap.get('tooltipSummary')}}: {{data.taskData.resources[0].resourceName}}</td> <td style="padding:3px">{{languageService.lMap.get('tooltipSummary')}}:
{{data.taskData.resources[0].resourceName}}</td>
</tr> </tr>
<tr> <tr>
<td style="padding:3px">{{languageService.lMap.get('tooltipState')}}: {{dataService.getStateNameById(data.taskData.resources[0].state)}}</td> <td style="padding:3px">{{languageService.lMap.get('tooltipState')}}:
{{dataService.getStateNameById(data.taskData.resources[0].state)}}</td>
</tr> </tr>
<tr> <tr>
<td style="padding:3px">{{languageService.lMap.get('tooltipPaketType')}}: {{data.taskData.resources[0].packageName}}</td> <td style="padding:3px">{{languageService.lMap.get('tooltipPaketType')}}:
{{data.taskData.resources[0].packageName}}</td>
</tr> </tr>
<tr> <tr>
<td style="padding:3px">{{languageService.lMap.get('tooltipContract')}}: {{data.taskData.resources[0].vertragName}}</td> <td style="padding:3px">{{languageService.lMap.get('tooltipContract')}}:
{{data.taskData.resources[0].vertragName}}</td>
</tr> </tr>
<tr> <tr>
<td style="padding:3px">{{languageService.lMap.get('tooltipSupportGroupKv')}}: {{data.taskData.resources[0].supportGroup}}</td> <td style="padding:3px">{{languageService.lMap.get('tooltipSupportGroupKv')}}:
{{data.taskData.resources[0].supportGroup}}</td>
</tr> </tr>
<tr> <tr>
<td style="padding:3px">{{languageService.lMap.get('tooltipSupportGroupIh')}}: {{data.taskData.resources[0].coordinatorSg}}</td> <td style="padding:3px">{{languageService.lMap.get('tooltipSupportGroupIh')}}:
{{data.taskData.resources[0].coordinatorSg}}</td>
</tr> </tr>
<tr> <tr>
<td style="padding:3px">{{languageService.lMap.get('tooltipDate')}}: {{data.taskData.resources[0].tasks[1].StartDate | date:'dd.MM.yyyy'}}</td> <td style="padding:3px">{{languageService.lMap.get('tooltipDate')}}:
{{data.taskData.resources[0].tasks[1].StartDate | date:'dd.MM.yyyy'}}</td>
</tr> </tr>
<!-- <tr> <!-- <tr>
<td style="padding:3px"> Date: {{data.TaskID}}</td> <td style="padding:3px"> Date: {{data.TaskID}}</td>
@ -182,61 +184,53 @@
</ejs-gantt> </ejs-gantt>
<app-plan-time-bar #plantimeComponent *ngIf="!errorService.rsso && renderplanTime && renderGantt" <app-plan-time-bar #plantimeComponent *ngIf="!errorService.rsso && renderplanTime && renderGantt"
[inputData]="inputForTimeline" [inputData]="inputForTimeline" [splitterSettings]="splitterSettings" [parentResources]="allResources"
[splitterSettings]="splitterSettings" [filters]="filters"></app-plan-time-bar>
[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" -->
<div *ngIf="this.showNoResultsError && this.languageService.language =='DE'"><h2>Die Suche lieferte keine Ergebnisse</h2></div> <mat-paginator #paginator [ngStyle]="{'visibility':renderGantt ? 'visible' : 'hidden'}" class="demo-paginator"
<div *ngIf="this.showNoResultsError && this.languageService.language =='EN'"><h2>The search did not return any results</h2></div> (page)="handlePageEvent($event)" [length]="this.dataService.getTotalSize()" [pageSize]="20" [disabled]="false"
<!-- [filterSettings]="filterSettings" --> [showFirstLastButtons]="true" [pageSizeOptions]="[10, 20, 50, 70, 100, 200, 500]" [hidePageSize]="false"
[pageIndex]="0" aria-label="Seite auswählen">
</mat-paginator>
<mat-paginator #paginator <mat-card style="width: 50%; margin: auto;" *ngIf="errorService.rsso">
[ngStyle]="{'visibility':renderGantt ? 'visible' : 'hidden'}"
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>
<mat-card style="width: 50%; margin: auto;" *ngIf="errorService.rsso">
<mat-card-header> <mat-card-header>
<mat-card-title><mat-icon style="color: red;">error</mat-icon> {{errorService.getLastError('rsso').name}}</mat-card-title> <mat-card-title><mat-icon style="color: red;">error</mat-icon>
{{errorService.getLastError('rsso').name}}</mat-card-title>
<mat-card-subtitle>{{errorService.getLastError('rsso').userInfo}}</mat-card-subtitle> <mat-card-subtitle>{{errorService.getLastError('rsso').userInfo}}</mat-card-subtitle>
</mat-card-header> </mat-card-header>
<mat-card-content> <mat-card-content>
<p style="padding-left: 15px;">{{errorService.getLastError('rsso').message}}</p> <p style="padding-left: 15px;">{{errorService.getLastError('rsso').message}}</p>
</mat-card-content> </mat-card-content>
</mat-card> </mat-card>
<mat-card style="width: 50%; margin: auto;" *ngIf="!errorService.rsso && errorService.critical"> <mat-card style="width: 50%; margin: auto;" *ngIf="!errorService.rsso && errorService.critical">
<mat-card-header> <mat-card-header>
<mat-card-title><mat-icon style="color: red;">error</mat-icon> {{errorService.getLastError('critical').name}}</mat-card-title> <mat-card-title><mat-icon style="color: red;">error</mat-icon>
{{errorService.getLastError('critical').name}}</mat-card-title>
<mat-card-subtitle>{{errorService.getLastError('critical').userInfo}}</mat-card-subtitle> <mat-card-subtitle>{{errorService.getLastError('critical').userInfo}}</mat-card-subtitle>
</mat-card-header> </mat-card-header>
<mat-card-content> <mat-card-content>
<p style="padding-left: 15px;">{{errorService.getLastError('critical').message}}</p> <p style="padding-left: 15px;">{{errorService.getLastError('critical').message}}</p>
</mat-card-content> </mat-card-content>
</mat-card> </mat-card>
<mat-card style="width: 50%; margin: auto;" *ngIf="!errorService.rsso && !errorService.critical && errorService.error"> <mat-card style="width: 50%; margin: auto;" *ngIf="!errorService.rsso && !errorService.critical && errorService.error">
<mat-card-header> <mat-card-header>
<mat-card-title><mat-icon style="color: red;">error</mat-icon> {{errorService.getLastError('error').name}}</mat-card-title> <mat-card-title><mat-icon style="color: red;">error</mat-icon>
{{errorService.getLastError('error').name}}</mat-card-title>
<mat-card-subtitle>{{errorService.getLastError('error').userInfo}}</mat-card-subtitle> <mat-card-subtitle>{{errorService.getLastError('error').userInfo}}</mat-card-subtitle>
</mat-card-header> </mat-card-header>
<mat-card-content> <mat-card-content>
<p style="padding-left: 15px;">{{errorService.getLastError('error').message}}</p> <p style="padding-left: 15px;">{{errorService.getLastError('error').message}}</p>
</mat-card-content> </mat-card-content>
</mat-card> </mat-card>

6
frontend/src/theme.scss
View File

@ -8,3 +8,9 @@ $my-warn: mat-palette($mat-red, 600);
$my-theme: mat-light-theme($my-primary, $my-accent, $my-warn); $my-theme: mat-light-theme($my-primary, $my-accent, $my-warn);
@include angular-material-theme($my-theme); @include angular-material-theme($my-theme);
.dateButton.mat-button {
background-color: blue !important; /* Use !important as a last resort */
color: white;
}