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

presets

main
manueltauber 2023-10-23 17:45:54 +02:00
parent 56e77f1660
commit ed97c3d18c
3 changed files with 254 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

102
frontend/src/app/data.service.ts
View File

@ -4,10 +4,24 @@ import { Injectable } from '@angular/core';
import { ResourceFields } from '@syncfusion/ej2-angular-gantt'; import { ResourceFields } from '@syncfusion/ej2-angular-gantt';
import { LanguageService } from './language.service'; import { LanguageService } from './language.service';
interface Preset {
id: string;
name: string;
presetType: string;
definition: any;
}
interface presetGroup {
disabled?: boolean;
name: string;
presets: Preset[];
}
@Injectable({ @Injectable({
providedIn: 'root' providedIn: 'root'
}) })
/** /**
* The DataService manages the communication between Frontend and Backend, fetches Data from the Backend and maps it to the Frontend Data Structure. Additionally it updates data on the Backend. * The DataService manages the communication between Frontend and Backend, fetches Data from the Backend and maps it to the Frontend Data Structure. Additionally it updates data on the Backend.
* *
@ -124,9 +138,10 @@ export class DataService {
*/ */
public async initPresets(){ public async initPresets(){
const promise = new Promise(resolve=>{ const promise = new Promise(resolve=>{
let res = {presets: [], selectedPreset: '', userPreferences: {}}; let res = {presets: [], selectedPreset: '', userPreferences: {}, presetGroups: []};
this.http.get('http://localhost:8080/api/initPresets') this.http.get('http://localhost:8080/api/initPresets')
.subscribe((response: any)=>{ .subscribe((response: any)=>{
console.log(response);
res.selectedPreset = response.selectedPreset; res.selectedPreset = response.selectedPreset;
let userPreferences = {language: 'DE', showDetails: true, view: 2}; let userPreferences = {language: 'DE', showDetails: true, view: 2};
if(response.userPreferences.language == "EN"){ if(response.userPreferences.language == "EN"){
@ -136,13 +151,13 @@ export class DataService {
userPreferences.showDetails = false; userPreferences.showDetails = false;
} }
if(response.userPreferences.view == 1){ if(response.userPreferences.view == 1){
userPreferences.view = 1; userPreferences.view = 0;
} }
if(response.userPreferences.view == 2){ if(response.userPreferences.view == 2){
userPreferences.view = 2; userPreferences.view = 1;
} }
if(response.userPreferences.view == 3){ if(response.userPreferences.view == 3){
userPreferences.view = 3; userPreferences.view = 2;
} }
res.userPreferences = userPreferences; res.userPreferences = userPreferences;
response.presets.forEach(preset => { response.presets.forEach(preset => {
@ -154,18 +169,66 @@ export class DataService {
definition: JSON.parse(preset.definition) definition: JSON.parse(preset.definition)
}); });
for (const preset of res.presets) { for (const preset of res.presets) {
if(preset.id == 'AGGAA5V0G2LS6ASCSVD9SBS7MO40RV'){ if(preset.id == response.selectedPreset){
res.selectedPreset = preset; res.selectedPreset = preset;
} }
} }
}); });
resolve(res); let presetGroups : presetGroup[] = [];
}) let system = [];
}) let user = [];
let admin = [];
for (const preset of res.presets) {
if(preset.presetType == "Sysdemdefault"){
system.push(preset);
}else{
user.push(preset);
}
}
presetGroups = [
{
name: 'Sysdemdefault',
presets: system,
},
{
name: 'Admin',
presets: admin
},
{
name: 'User',
presets: user,
},
];
res.presetGroups = presetGroups;
console.log(res.presetGroups);
resolve(res);
})
})
return promise; return promise;
} }
/** /**
* The function updateDatePerChange sends the new date to the backend if the date was moved
* @param change the Change (the Resource) from which the date should be changed
*/
public async selectPreset(preset: any){
const promise = new Promise(resolve=>{
let serializableResource = {guid: preset.id};
let strigifiedResource = JSON.stringify(serializableResource);
let resJson = JSON.parse(strigifiedResource) as typeof strigifiedResource;
console.log(resJson);
this.http.post('http://localhost:8080/api/selectPreset', resJson).subscribe((response:any)=>{
resolve(response);
console.log(response);
},(error:any)=>{
resolve(error);
});
});
return promise;
}
/**
* The function updateDatePerChange sends the new date to the backend if the date was moved * The function updateDatePerChange sends the new date to the backend if the date was moved
* @param change the Change (the Resource) from which the date should be changed * @param change the Change (the Resource) from which the date should be changed
*/ */
@ -191,7 +254,7 @@ export class DataService {
*/ */
public async updatePreset(preset: any){ public async updatePreset(preset: any){
const promise = new Promise(resolve=>{ const promise = new Promise(resolve=>{
let serializableResource = {id: preset.id, definition: preset.definition}; let serializableResource = {id: preset.id, definition: JSON.stringify(preset.definition)};
let strigifiedResource = JSON.stringify(serializableResource); let strigifiedResource = JSON.stringify(serializableResource);
let resJson = JSON.parse(strigifiedResource) as typeof strigifiedResource; let resJson = JSON.parse(strigifiedResource) as typeof strigifiedResource;
this.http.post('http://localhost:8080/api/updatePreset', resJson).subscribe((response:any)=>{ this.http.post('http://localhost:8080/api/updatePreset', resJson).subscribe((response:any)=>{
@ -203,6 +266,25 @@ export class DataService {
return promise; return promise;
} }
/**
* The function updateDatePerChange sends the new date to the backend if the date was moved
* @param change the Change (the Resource) from which the date should be changed
*/
public async editUserPreferences(userPreferences: any){
const promise = new Promise(resolve=>{
let serializableResource = {details: userPreferences.showDetails, view: userPreferences.view, language: userPreferences.language };
let strigifiedResource = JSON.stringify(serializableResource);
let resJson = JSON.parse(strigifiedResource) as typeof strigifiedResource;
console.log(resJson);
this.http.post('http://localhost:8080/api/editUserPreferences', resJson).subscribe((response:any)=>{
resolve(response);
},(error:any)=>{
resolve(error);
});
});
return promise;
}
/** /**
* The function fetchStates fetches an array from the possible statuses per state * The function fetchStates fetches an array from the possible statuses per state
* @returns promise for the fetched Status Array * @returns promise for the fetched Status Array

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

@ -22,19 +22,34 @@
</mat-select> </mat-select>
</mat-form-field> </mat-form-field>
<div class="scalarContainer"> <div class="scalarContainer">
<mat-button-toggle-group style="margin-top: 5px;" (change)="changeScalar()" name="fontStyle" aria-label="Font Style" [(ngModel)]="selectedScalar"> <mat-button-toggle-group style="margin-top: 5px;" (change)="changeScalar()" name="fontStyle" aria-label="Font Style" [(ngModel)]="selectedScalar">
<mat-button-toggle value="bold"*ngFor="let scalar of scalars" [value]="scalar"> <mat-button-toggle 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> </div>
<mat-form-field appearance="fill">
<!-- <mat-form-field appearance="fill" >
<mat-label>Preset</mat-label> <mat-label>Preset</mat-label>
<mat-select> <mat-select [(value)]="selectedPreset">
<mat-option *ngFor="let preset of presets" [value]="preset.id" > <mat-option *ngFor="let preset of presets" [value]="preset">
{{preset.name}} {{preset.name}}
</mat-option> </mat-option>
</mat-select> </mat-select>
</mat-form-field> -->
<mat-form-field appearance="fill" style="width: 300px;">
<mat-label>Preset</mat-label>
<mat-select [(value)]="selectedPreset" (selectionChange)="selectPreset($event)">
<mat-optgroup *ngFor="let group of presetGroups" [label]="group.name"
[disabled]="group.disabled">
<mat-option *ngFor="let preset of group.presets" [value]="preset">
{{preset.name}}
<!-- <button style="align-self: right;" *ngIf="group.name == 'User'" mat-icon-button><mat-icon>delete_forever</mat-icon></button>
<button *ngIf="group.name == 'User'" mat-icon-button><mat-icon>edit</mat-icon></button> -->
</mat-option>
</mat-optgroup>
</mat-select>
</mat-form-field> </mat-form-field>
</div> </div>
@ -42,9 +57,12 @@
<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>
<button *ngIf="showSaveButton" mat-raised-button (click)="updatePreset()">Speichern</button>
<button *ngIf="showSaveUnderButton" mat-raised-button >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" (click)="clearFilter()">
{{languageService.lMap.get('clearFilter')}} <mat-icon>close</mat-icon> {{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>

166
frontend/src/app/ntt-gantt/ntt-gantt.component.ts
View File

@ -27,6 +27,19 @@ export const MY_DATE_FORMATS = {
monthYearA11yLabel: 'MMMM YYYY' monthYearA11yLabel: 'MMMM YYYY'
}, },
}; };
interface Preset {
id: string;
name: string;
presetType: string;
definition: any;
}
interface presetGroup {
disabled?: boolean;
name: string;
presets: Preset[];
}
@Component({ @Component({
selector: 'ntt-gantt', selector: 'ntt-gantt',
@ -118,7 +131,35 @@ export class NttGanttComponent implements OnInit {
public sortSelectorName: any; public sortSelectorName: any;
public presets : any[] = []; public presets : any[] = [];
public selectedPreset: any; public selectedPreset: Preset = {id: 'test', name : 'test', presetType: 'test', definition: {}};
public presetControl: FormControl = new FormControl('');;
public presetGroups: presetGroup[] = [
{
name: 'Sysdemdefault',
presets: [
{id: '0', name: 'TEST', presetType: 'Sysdemdefault', definition: {}},
],
},
{
name: 'Admin',
presets: [
{id: '1', name: 'TEST1', presetType: 'Admin', definition: {}},
],
},
{
name: 'User',
presets: [
{id: '2', name: 'TEST2', presetType: 'User', definition: {}},
],
},
];
public userPreferences: {language:'', showDetails: false, view: ''};
public showSaveButton: boolean = false;
public showSaveUnderButton: boolean = false;
/**###################################################################### Initial Loading functions ######################################################################*/ /**###################################################################### Initial Loading functions ######################################################################*/
@ -143,28 +184,29 @@ export class NttGanttComponent implements OnInit {
this.sliceStart = 0; this.sliceStart = 0;
this.sliceEnd = 20; this.sliceEnd = 20;
this.dataService.initPresets().then((res: any)=>{ // this.dataService.initPresets().then((res: any)=>{
this.presets = res.presets; // this.presets = res.presets;
this.selectedPreset = res.selectedPreset; // this.selectedPreset = res.selectedPreset;
this.filters = this.selectedPreset.definition; // this.presetGroups = res.presetGroups;
this.filterEnabled = true; // this.filters = this.selectedPreset.definition;
this.showDetails = res.userPreferences.showDetails; // this.filterEnabled = true;
this.selectedScalar = this.scalars[res.userPreferences.view]; // this.showDetails = res.userPreferences.showDetails;
// this.selectedScalar = this.scalars[res.userPreferences.view];
// this.dataService.fetchUserSupportGroup().then((res: any)=>{
this.dataService.fetchUserSupportGroup().then((res: any)=>{ // this.userSupportGroup = res.name;
this.userSupportGroup = res.name; // this.refreshData();
this.refreshData(); // this.states = this.dataService.getStates();
this.states = this.dataService.getStates(); // this.dataService.fetchStates().then((res: any [])=>{
this.dataService.fetchStates().then((res: any [])=>{ // this.states = res;
this.states = res; // this.stateList = res;
this.stateList = res; // this.spin = false;
this.spin = false; // console.log(this.states);
console.log(this.states); // this.inputForTimeline = [this.splitterSettings, this.projectStartDate, this.projectEndDate];
this.inputForTimeline = [this.splitterSettings, this.projectStartDate, this.projectEndDate]; // });
}); // });
}); // });
}); this.refreshGanttwithPresets();
this.taskSettings = { this.taskSettings = {
@ -222,16 +264,29 @@ export class NttGanttComponent implements OnInit {
this.inputForTimeline = [this.splitterSettings, this.projectStartDate, this.projectEndDate]; this.inputForTimeline = [this.splitterSettings, this.projectStartDate, this.projectEndDate];
} }
public selectPreset(preset: any){ public selectPreset(event: any){
this.showSaveButton = false;
this.showSaveUnderButton = false;
console.log(event);
this.dataService.selectPreset(event.value).then((res)=>{
this.refreshGanttwithPresets();
});
} }
public savePreset(preset: any){ public savePreset(preset: any){
this.showSaveButton = false;
this.showSaveUnderButton = false;
this.dataService.savePreset(preset).then((res)=>{{ this.dataService.savePreset(preset).then((res)=>{{
console.log(res); console.log(res);
}}) }})
} }
public updatePreset(preset: any){ public updatePreset(){
this.showSaveButton = false;
this.selectedPreset.definition = this.filters;
this.dataService.updatePreset(this.selectedPreset).then((res)=>{
console.log(res);
});
} }
public renamePreset(preset: any){ public renamePreset(preset: any){
@ -240,8 +295,55 @@ export class NttGanttComponent implements OnInit {
} }
public editUserPreferences(language: any, showDetails: any, view: any){ public editUserPreferences(){
let showDetails = 0;
if(this.showDetails){
showDetails = 1;
}
let view;
let index = 0;
for (const scalar of this.scalars) {
index++;
if(scalar == this.selectedScalar){
view = index;
}
}
if(this.userPreferences.language == this.languageService.language && this.userPreferences.showDetails == this.showDetails && this.userPreferences.view == view){
}else{
this.dataService.editUserPreferences({language: this.languageService.language, showDetails: showDetails, view: view}).then((res)=>{
console.log(res);
});
}
}
public refreshGanttwithPresets(){
this.showSaveButton = false;
this.showSaveUnderButton = false;
this.dataService.initPresets().then((res: any)=>{
this.presets = res.presets;
this.selectedPreset = res.selectedPreset;
this.presetGroups = res.presetGroups;
this.filters = this.selectedPreset.definition;
this.filterEnabled = true;
this.userPreferences = res.userPreferences;
this.showDetails = res.userPreferences.showDetails;
this.selectedScalar = this.scalars[res.userPreferences.view];
this.changeScalar();
this.dataService.fetchUserSupportGroup().then((res: any)=>{
this.userSupportGroup = res.name;
this.refreshData();
this.states = this.dataService.getStates();
this.dataService.fetchStates().then((res: any [])=>{
this.states = res;
this.stateList = res;
this.spin = false;
console.log(this.states);
this.inputForTimeline = [this.splitterSettings, this.projectStartDate, this.projectEndDate];
});
});
});
} }
@ -269,6 +371,7 @@ export class NttGanttComponent implements OnInit {
* This function is the most called Funktion in the whole project, it is triggered by a pageEvent, when a filter gets applied and much more... * This function is the most called Funktion in the whole project, it is triggered by a pageEvent, when a filter gets applied and much more...
*/ */
refreshData(){ refreshData(){
this.editUserPreferences();
this.showNoResultsError = false; this.showNoResultsError = false;
this.renderGantt = false; this.renderGantt = false;
this.dataService.fetchChanges(this.mapRequestJSON()).then((res: any[])=>{ this.dataService.fetchChanges(this.mapRequestJSON()).then((res: any[])=>{
@ -356,6 +459,14 @@ export class NttGanttComponent implements OnInit {
// this.dataService.updatePreset({id: 'AGGAA5V0G2LS6ASCSUZZSBS79E40O5', definition: JSON.stringify(this.filters)}).then((res)=>{ // this.dataService.updatePreset({id: 'AGGAA5V0G2LS6ASCSUZZSBS79E40O5', definition: JSON.stringify(this.filters)}).then((res)=>{
// console.log(res); // console.log(res);
// }); // });
if(this.filters !== this.selectedPreset.definition){
if(this.selectedPreset.presetType == ''){
this.showSaveButton = true;
}else{
this.showSaveUnderButton = true;
}
}
this.refreshData(); this.refreshData();
} }
}); });
@ -373,6 +484,7 @@ export class NttGanttComponent implements OnInit {
this.languageService.languageChange(args.value), this.languageService.languageChange(args.value),
this.initLanguge(); this.initLanguge();
this.plantimeComponent.changeLanguage(); this.plantimeComponent.changeLanguage();
this.editUserPreferences();
} }
/** /**
@ -414,6 +526,8 @@ export class NttGanttComponent implements OnInit {
this.timelineSettings = {topTier: {unit: 'Year'}, bottomTier: {format: 'MM',unit: 'Month',count: 1}}; this.timelineSettings = {topTier: {unit: 'Year'}, bottomTier: {format: 'MM',unit: 'Month',count: 1}};
this.renderplanTime = false; this.renderplanTime = false;
} }
this.editUserPreferences();
} }
/**############################### NTT Gantt Component EVENTS /**###############################*/ /**############################### NTT Gantt Component EVENTS /**###############################*/