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

datepicker

main
Said Gedik 2024-05-14 17:22:45 +02:00
parent b0145b20d7
commit 3e0c0b9063
2 changed files with 143 additions and 138 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -259,12 +259,19 @@
height: 70%;
width: 59px;
background-color: rgb(255, 255, 255);
border-width: 1px;
border: none;
border-bottom: 1px;
border-top-right-radius: 4px;
border: solid 1px rgba(0, 0, 0, 0.124);
border-radius: 8px;
border-radius: 0px 8px 8px 0px;
border-left: none;
}
.dateButton mat-icon {
transform: scale(0.8);
opacity: 0.75;
margin-right: 0px;
}
.dateButton:hover>mat-icon {
opacity: 1;
}
.dateButton:hover {

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

@ -103,12 +103,12 @@
<div class="right">
<!-- Date Range Picker -->
<div style="display: flex; height: 100%; align-items: center; font-size: 13px; ">
<div style="height: 70%; display: flex; align-items: center; width: 160px; font-family: Arial, sans-serif; font-weight: 600;">
<div style="height: 70%; display: flex; align-items: center; width: 180px; font-family: Arial, sans-serif; border: solid 1px rgba(0, 0, 0, 0.124);
background-color: white; padding-left: 10px; border-radius: 5px 0px 0px 5px;">
<!-- <mat-label>{{languageService.lMap.get('dateRangeLabel')}}</mat-label> -->
<mat-date-range-input [formGroup]="range" [rangePicker]="picker">
<input matStartDate formControlName="start"
(dateChange)="startDateChanged($event)">
<input matEndDate formControlName="end"(dateChange)="endDateChanged($event)">
<input matStartDate formControlName="start" (dateChange)="startDateChanged($event)">
<input matEndDate formControlName="end" (dateChange)="endDateChanged($event)">
</mat-date-range-input>
<!-- <mat-datepicker-toggle matIconSuffix [for]="picker"></mat-datepicker-toggle> -->
<mat-date-range-picker #picker></mat-date-range-picker>
@ -116,8 +116,7 @@
<mat-error *ngIf="range.controls.end.hasError('matEndDateInvalid')">Invalid end date</mat-error>
</div>
<button class="dateButton"
(click)="picker.open()"><mat-icon>calendar_today</mat-icon></button>
<button class="dateButton" (click)="picker.open()"><mat-icon>calendar_today</mat-icon></button>
</div>
<!-- Scale Picker -->
@ -135,32 +134,32 @@
(change)="refreshData()"></mat-slide-toggle>
</div>
</div>
</div>
</div>
<div
<div
*ngIf="!this.disableSpin && !this.showNoResultsError && !this.errorService.critical && !this.errorService.rsso && !this.errorService.error"
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" />
</div>
</div>
<!-- <button ejs-button id='filterRecord' (click)='filter()'>Filter</button> -->
<ejs-gantt *ngIf="renderGantt" #ganttObject id="ganttDefault" [enableVirtualization]="true"
<!-- <button ejs-button id='filterRecord' (click)='filter()'>Filter</button> -->
<ejs-gantt *ngIf="renderGantt" #ganttObject id="ganttDefault" [enableVirtualization]="true"
[ngStyle]="{'visibility':spin ? 'hidden' : 'visible'}" [dataSource]="data" [allowSorting]='true'
[resources]="resources" [taskFields]="taskSettings" [resourceFields]="resourceFields" [editSettings]="editSettings"
[columns]="columns" [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" (splitterResizing)="splitterResizing($event)" (actionBegin)="actionBegin($event)"
[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)">
(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>
@ -203,27 +202,27 @@
</table>
</div>
</ng-template>
</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" [splitterSettings]="splitterSettings" [parentResources]="allResources"
[filters]="filters"></app-plan-time-bar>
<div *ngIf="this.showNoResultsError && this.languageService.language =='DE'">
<div *ngIf="this.showNoResultsError && this.languageService.language =='DE'">
<h2>Die Suche lieferte keine Ergebnisse</h2>
</div>
<div *ngIf="this.showNoResultsError && this.languageService.language =='EN'">
</div>
<div *ngIf="this.showNoResultsError && this.languageService.language =='EN'">
<h2>The search did not return any results</h2>
</div>
<!-- [filterSettings]="filterSettings" -->
</div>
<!-- [filterSettings]="filterSettings" -->
<mat-paginator #paginator [ngStyle]="{'visibility':renderGantt ? 'visible' : 'hidden'}" class="demo-paginator"
<mat-paginator #paginator [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-paginator>
<mat-card style="width: 50%; margin: auto;" *ngIf="errorService.rsso">
<mat-card style="width: 50%; margin: auto;" *ngIf="errorService.rsso">
<mat-card-header>
<mat-card-title><mat-icon style="color: red;">error</mat-icon>
{{errorService.getLastError('rsso').name}}</mat-card-title>
@ -232,10 +231,10 @@
<mat-card-content>
<p style="padding-left: 15px;">{{errorService.getLastError('rsso').message}}</p>
</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-title><mat-icon style="color: red;">error</mat-icon>
{{errorService.getLastError('critical').name}}</mat-card-title>
@ -244,10 +243,9 @@
<mat-card-content>
<p style="padding-left: 15px;">{{errorService.getLastError('critical').message}}</p>
</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-title><mat-icon style="color: red;">error</mat-icon>
{{errorService.getLastError('error').name}}</mat-card-title>
@ -256,4 +254,4 @@
<mat-card-content>
<p style="padding-left: 15px;">{{errorService.getLastError('error').message}}</p>
</mat-card-content>
</mat-card>
</mat-card>