From 8913bebd32d8a251017b415d08f654b3de3b245e Mon Sep 17 00:00:00 2001
From: manueltauber <manuel.tauber@emea.nttdata.com>
Date: Tue, 27 Jun 2023 16:31:31 +0200
Subject: [PATCH] Sourcecode Structure Updated

---
 frontend/src/app/data.service.ts              |   20 +-
 .../src/ntt-gantt/ntt-gantt.component.html    |    3 +-
 frontend/src/ntt-gantt/ntt-gantt.component.ts | 1229 +++++++----------
 3 files changed, 501 insertions(+), 751 deletions(-)

diff --git a/frontend/src/app/data.service.ts b/frontend/src/app/data.service.ts
index 0891346..6bb2c3c 100644
--- a/frontend/src/app/data.service.ts
+++ b/frontend/src/app/data.service.ts
@@ -356,7 +356,6 @@ export class DataService {
               packageName: resp.packageName,
               coordinatorSg: resp.coordinatorSg,
               plantime: resp.planTime,
-              calenderWeek: this.getWeekNumber(new Date(resp.d2))
             });
 
 
@@ -368,26 +367,12 @@ export class DataService {
     return promise;
   }
 
-  getWeekNumber(d) {
-    // Copy date so don't modify original
-    d = new Date(Date.UTC(d.getFullYear(), d.getMonth(), d.getDate()));
-    // Set to nearest Thursday: current date + 4 - current day number
-    // Make Sunday's day number 7
-    d.setUTCDate(d.getUTCDate() + 4 - (d.getUTCDay()||7));
-    // Get first day of year
-    let yearStart : any;
-    yearStart = new Date(Date.UTC(d.getUTCFullYear(),0,1));
-    // Calculate full weeks to nearest Thursday
-    let weekNo = Math.ceil(( ( (d - yearStart) / 86400000) + 1)/7);
-    // Return array of year and week number
-    return '' + d.getUTCFullYear() + weekNo;
-}
 
   validateImplementerEdit(state):boolean{
     if(state == 1 || state == 3 || state == 6){
-      return true
+      return true;
     }else{
-      return true
+      return false;
     }
   }
 
@@ -430,7 +415,6 @@ export class DataService {
         }
       }
     }
-
     return "";
   }
 
diff --git a/frontend/src/ntt-gantt/ntt-gantt.component.html b/frontend/src/ntt-gantt/ntt-gantt.component.html
index 58a36cc..a82d01f 100644
--- a/frontend/src/ntt-gantt/ntt-gantt.component.html
+++ b/frontend/src/ntt-gantt/ntt-gantt.component.html
@@ -25,7 +25,7 @@
   </mat-radio-group>
   <!-- <p>Selected range: {{range.value | json}}</p> -->
   <div class="toggleContainer">
-    <mat-slide-toggle color="primary" [(ngModel)]="showDetails" [checked]="showDetails" (change)="renderDetails()">{{languageService.lMap.get('detailButton')}}</mat-slide-toggle>
+    <mat-slide-toggle color="primary" [(ngModel)]="showDetails" [checked]="showDetails" (change)="refreshData()">{{languageService.lMap.get('detailButton')}}</mat-slide-toggle>
     <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>
     <button mat-icon-button aria-label="clear Filters and Sort" (click)="clearFilter()">
@@ -100,7 +100,6 @@
     (created)="created($event)"
     (dataBound)="dataBound($event)"
     (load)="load($event)"
-    (onIntlChange)="onChange($event)"
     (queryTaskbarInfo) = "queryTaskbarInfo($event)"
     (expanding)="onExpand($event)"
     (splitterResized)="onResizing($event)"
diff --git a/frontend/src/ntt-gantt/ntt-gantt.component.ts b/frontend/src/ntt-gantt/ntt-gantt.component.ts
index 0cf091c..7471b90 100644
--- a/frontend/src/ntt-gantt/ntt-gantt.component.ts
+++ b/frontend/src/ntt-gantt/ntt-gantt.component.ts
@@ -112,76 +112,9 @@ export class NttGanttComponent implements OnInit {
    * @param matDialog injects the matDialog
    */
   constructor(public languageService: LanguageService,public dataService: DataService, public matDialog : MatDialog, private _snackBar: MatSnackBar ) {
-    // this.deMap.set('detailButton', 'Details anzeigen');
-    // this.enMap.set('detailButton', 'Show Details');
-    // this.deMap.set('filterButton', 'Filter anwenden');
-    // this.enMap.set('filterButton', 'Apply Filters');
-    // this.deMap.set('sortButton', 'Sortierung anwenden');
-    // this.enMap.set('sortButton', 'Apply Sort');
-    // this.deMap.set('field1', 'Kurzbeschreibung');
-    // this.enMap.set('field1', 'Summary');
-    // this.deMap.set('dateRangeLabel', 'Datumsbereich auswählen');
-    // this.enMap.set('dateRangeLabel', 'Select Date Range');
-    // this.deMap.set('language', 'Sprache');
-    // this.enMap.set('language', 'Language');
-    // this.deMap.set('clearFilter', 'Filter Löschen');
-    // this.enMap.set('clearFilter', 'Clear Filter');
-
-    // this.deMap.set('tooltipSummary', 'Name');
-    // this.enMap.set('tooltipSummary', 'Name');
-    // this.deMap.set('tooltipState', 'Status');
-    // this.enMap.set('tooltipState', 'State');
-    // this.deMap.set('tooltipPaketType', 'Paket Typ');
-    // this.enMap.set('tooltipPaketType', 'Package Type');
-    // this.deMap.set('tooltipContract', 'Vertrag / Provider Cluster');
-    // this.enMap.set('tooltipContract', 'Contract / Provider Cluster');
-    // this.deMap.set('tooltipSupportGroupKv', 'KV SG');
-    // this.enMap.set('tooltipSupportGroupKv', 'KV SG');
-    // this.deMap.set('tooltipSupportGroupIh', 'IH SG');
-    // this.enMap.set('tooltipSupportGroupIh', 'IH SG');
-    // this.deMap.set('tooltipDate', 'Geplantes Start Datum');
-    // this.enMap.set('tooltipDate', 'Planned Start Date');
-
-    // this.deMap.set('permit', 'Zur Genehmigung');
-    // this.enMap.set('permit', 'Permit');
-    // this.deMap.set('genehmigen', 'Genehmigen');
-    // this.enMap.set('genehmigen', 'Approve');
-    // this.deMap.set('ablehnen', 'Ablehnen');
-    // this.enMap.set('ablehnen', 'Reject');
-    // this.deMap.set('stornieren', 'Stornieren');
-    // this.enMap.set('stornieren', 'Cancel');
-    // this.deMap.set('implementer', 'Implementer Eintragen');
-    // this.enMap.set('implementer', 'Enter Implementer');
-    // this.deMap.set('stateChange', 'Statusübergang');
-    // this.enMap.set('stateChange', 'State Transition');
-
-    // if(navigator.language=='de-DE'){
-    //   this.language = 'DE';
-    // }else{
-    //   this.language = 'EN';
-    // }
-
     this.initLanguge(true);
   }
 
-  initLanguge(initial: boolean = false){
-
-    if(this.languageService.language == 'DE'){
-      this.scalars = ['Woche-Tag', 'Monat-Woche', 'Jahr-Monat'];
-      this.selectedScalar = 'Monat-Woche';
-    }
-    else{
-      this.scalars = ['Week-Day', 'Month-Week', 'Year-Month'];
-      this.selectedScalar = 'Month-Week';
-
-    }
-    this.columns = this.languageService.getColumns();
-    if(!initial){
-      this.refreshData();
-    }
-  }
-
-
   /**
    * The function ngOnInit sets values which are required for rendering the gantt Chart. Furthermore it trims the resources (Changes Array) and sets the paginator to the first page.
    */
@@ -247,17 +180,7 @@ export class NttGanttComponent implements OnInit {
       { field: 'plantime', headerText: 'Planzeit in H', width: 100 },
     ];
 
-    this.timelineSettings= {
-      topTier: {
-          //format: 'YYYY',
-          unit: 'Month'
-      },
-      bottomTier: {
-          format: 'WW',
-          unit: 'Week',
-          count: 1
-      }
-    };
+    this.timelineSettings = {topTier: {unit: 'Month'}, bottomTier: {format: 'WW', unit: 'Week', count: 1}};
     this.editSettings = {allowAdding: true, allowEditing: true, allowDeleting: true, allowTaskbarEditing: true, showDeleteConfirmDialog: true};
     this.filterSettings = {ignoreAccent: true};
     this.selectionSettings = {mode: 'Row',type: 'Multiple'};
@@ -266,113 +189,274 @@ export class NttGanttComponent implements OnInit {
     this.tooltipSettings = {showTooltip: true}
     this.projectStartDate = this.range.controls.start.value;
     this.projectEndDate = this.range.controls.end.value;
-    this.splitterSettings = {position: 647+'px'};
+    this.splitterSettings = {position: 647 + 'px'};
     this.inputForTimeline = [this.splitterSettings, this.projectStartDate, this.projectEndDate];
   }
 
-  languageChange(args: any){
+
+  /**###################################################################### Data Mapping, Filter and Sorting Functions  ######################################################################*/
+
+  /**
+   * The function mapTasksToResources slices the allResources array to the resources array according the actual page conditions maps the actual tasks (Dates) to the actual resources (Changes)
+   * This function is triggered when a pageEvent is thrown respectively a user changes the page on the paginator
+   * @param start begin of slice
+   * @param end end of slice
+   */
+  public mapTasksToResources(start : number, end : number){
+    this.data = [];
+    this.resources = this.allResources;
+    for (const resource of this.resources) {
+      for (const task of resource.tasks) {
+        this.data.push(task);
+      }
+    }
+  }
+
+  refreshData(){
+    this.showNoResultsError = false;
+    this.renderGantt = false;
+    this.dataService.fetchChanges(this.mapRequestJSON()).then((res: any[])=>{
+      this.allResources = res;
+        this.mapTasksToResources(this.sliceStart,this.sliceEnd);
+        if(res.length > 0){
+          this.spin = true;
+          this.renderGantt = true;
+          this.showNoResultsError = false;
+          this.renderplanTime = true;
+        }else{
+          this.renderGantt = false;
+          this.spin = false;
+          this.showNoResultsError = true;
+          this.renderplanTime = false;
+        }
+    });
+  }
+
+  clearFilter(){
+      this.filters = null;
+      this.filterEnabled = false;
+      this.sort = null;
+      this.sortEnabled = false;
+      this.refreshData();
+  }
+  mapRequestJSON(){
+    let request =
+    {
+      'sliceStart': this.sliceStart,
+      'sliceEnd': this.sliceEnd,
+      filter: this.filterEnabled ? this.filters : {filterElement: [{column: "SupportGroup", filter: "equals", criteria: [this.userSupportGroup]}]},
+      sort: this.sortEnabled ? this.sort : {
+        'column': 'ChangeNr',
+        'mode': 'asc'
+      },
+    }
+    return request;
+  }
+
+  applyFilter(){
+    if(this.filterEnabled){
+      this.oldFilters = this.filters
+      this.filters = null;
+      this.refreshData();
+      this.plantimeComponent.fetchPlanTimes(this.filters);
+    }else{
+      this.filters = this.oldFilters;
+      this.refreshData();
+      this.plantimeComponent.fetchPlanTimes(this.filters);
+    }
+
+  }
+  openFilterDialog(){
+    let dialogRef = FilterDialogComponent;
+      this.matDialog.open(dialogRef,
+      {data : [], height: '70%', width: '80%'}).afterClosed().subscribe((res)=>{
+        if(res){
+          this.filters = res;
+          this.filterEnabled = true;
+          this.refreshData();
+        }
+      });
+  }
+
+  /**###################################################################### Reaction on EVENTS ######################################################################*/
+
+  /**############################### NTT Gantt Component Helper Functions /**###############################*/
+
+  public languageChange(args: any){
     this.languageService.languageChange(args.value),
     this.initLanguge();
   }
 
-  /**
-   * The function taskbarEditing catches the corresponding syncfsuions event and cancels the user action if the isFixed flag of a task (Date) is set true
-   * @param args event arguments from the syncfusion gantt chart
-   */
-  public taskbarEditing(args: any) {
-    if(args.data.taskData.isFixed !== false ) {
-      args.cancel = true;
-    }
-  }
-
-  public renderDetails(){
-    if(this.showDetails == false){
-      this.refreshData();
-    }else{
-      this.refreshData();
-    }
-
-  }
-  public actionComplete(args: any){
-    if (args.action === 'HorizontalScroll') {
-      let elem = document.querySelector(
-        '#'+'ganttDefaultSum'+ 'GanttChart > div.e-chart-root-container > div'
-      );
-      elem.scrollLeft = args.scrollLeft;
-      this.planTimeScrollLeft = args.scrollLeft;
-    }
-  }
-
   public changeScalar(){
     if(this.selectedScalar == this.scalars[0]){
-      this.timelineSettings= {
-        topTier: {
-            //format: 'WW',
-            unit: 'Week'
-        },
-        bottomTier: {
-            format: 'dd',
-            unit: 'Day',
-            count: 1
-        }
-      };
+      this.timelineSettings = {topTier: {unit: 'Week'}, bottomTier: {format: 'dd', unit: 'Day', count: 1}};
       this.renderplanTime = false;
     }
-
     if(this.selectedScalar == this.scalars[1]){
-      this.timelineSettings= {
-        topTier: {
-            //format: 'YYYY',
-            unit: 'Month'
-        },
-        bottomTier: {
-            format: 'WW',
-            unit: 'Week',
-            count: 1
-        }
-      };
+      this.timelineSettings = {topTier: {unit: 'Month'}, bottomTier: {format: 'WW', unit: 'Week', count: 1}};
       this.renderplanTime = true;
     }
-
     if(this.selectedScalar == this.scalars[2]){
-      this.timelineSettings= {
-        topTier: {
-            //format: 'YYYY',
-            unit: 'Year'
-        },
-        bottomTier: {
-            format: 'MM',
-            unit: 'Month',
-            count: 1
-        }
-      };
+      this.timelineSettings = {topTier: {unit: 'Year'}, bottomTier: {format: 'MM',unit: 'Month',count: 1}};
       this.renderplanTime = false;
     }
+  }
 
+  initLanguge(initial: boolean = false){
+
+    if(this.languageService.language == 'DE'){
+      this.scalars = ['Woche-Tag', 'Monat-Woche', 'Jahr-Monat'];
+      this.selectedScalar = 'Monat-Woche';
+    }
+    else{
+      this.scalars = ['Week-Day', 'Month-Week', 'Year-Month'];
+      this.selectedScalar = 'Month-Week';
+
+    }
+    this.columns = this.languageService.getColumns();
+    if(!initial){
+      this.refreshData();
+    }
+  }
+
+
+  /**############################### NTT Gantt Component EVENTS /**###############################*/
+
+  /**
+   * The function handlePageEvent catches the corresponding matpaginator event and slices the gantt chart, that it fits to the actual page
+   * @param e pageEvent from the matpaginator
+   */
+  public handlePageEvent(e: PageEvent):void {
+    let start = e.pageSize*e.pageIndex;
+    let end = start+ e.pageSize;
+    this.sliceStart = start;
+    this.sliceEnd = end;
+    this.refreshData();
+  }
+
+    /**
+   * The function startDateChanged catches the corresponding date-range-picker event
+   * @param startDate new startDate from date-range-picker
+   */
+  public startDateChanged(startDate: any){
+      this.renderplanTime = false;
   }
 
   /**
-   * The function taskbarEdited catches the corresponding syncfsuions event and cancels the user action if the isFixed flag of a task (Date) is set true
-   * If the isFixed flag is false, it triggers the dataService to update the moved date
-   * @param args event arguments from the syncfusion gantt chart
+  * The function endDateChanged catches the corresponding date-range-picker event and validates the selected start- and enddate bacause the gantt chart needs a valid Date to be displayed
+  * @param endDate new endDate from date-range-picker
+  */
+  public endDateChanged(endDate: any){
+      if(this.range.status == 'VALID' && this.range.controls.start.value && this.range.controls.end.value){ //event for Requesting new Records based on the Dates
+        this.projectStartDate = new Date(this.range.controls.start.value);
+        this.projectEndDate = new Date(this.range.controls.end.value);
+        this.renderplanTime = true;
+      }
+  }
+  /**
+   * The function toolbarBtnClicked catches the corresponding syncfsuions event and executes the button logic when a button is clicked
+   * @param args
    */
-  public taskbarEdited(args: any){
-    if(args.data.taskData.isFixed !== false ) {
-    args.cancel = true;
-    }else{
-      const found = this.allResources.find((resource) => {
-        return resource.resourceId == args.data.taskData.resources[0].resourceId;
-      });
-      this.dataService.updateDatePerChange(found);
-      this.plantimeComponent.fetchPlanTimes();
+  public toolbarBtnClicked(args :any){
+      if(args.item.text === "Statusübergang" || args.item.text === "State Transition"){
+        let data = {changes: [], states: this.states};
+        for (const selectedRescourceId of this.selectedRescourceIds) {
+          for (const iterator of this.resources) {
+            if(iterator.resourceId == selectedRescourceId){
+              data.changes.push({resourceId: iterator.resourceId, changeNr: iterator.changeNr, currentState: iterator.state});
+            }
+          }
+        }
+        let dialogRef = StateDialogComponent;
+        this.matDialog.open(dialogRef,{data : data}).afterClosed().subscribe((res)=>{
+          if(res == "Success"){
+            this.refreshData();
+          }
+        });
+      }
 
-        let elem = document.querySelector(
-          '#'+'ganttDefaultSum'+ 'GanttChart > div.e-chart-root-container > div'
-        );
-        elem.scrollLeft = this.planTimeScrollLeft;
-    }
+      if(args.item.text === "Implementer Eintragen" || args.item.text === "Enter Implementer"){
+        let data = {changes: []};
+        for (const selectedRescourceId of this.selectedRescourceIds) {
+          for (const change of this.resources) {
+            if(change.resourceId == selectedRescourceId){
+              data.changes.push({resourceId: change.resourceId, pkgId: change.changeNr, supportGroupId: change.supportGroupId});
+            }
+          }
+        }
+        this.matDialog.open(ImplementerDialogComponent,{data : data});
+      }
+
+      if(args.item.text === "Genehmigen" || args.item.text === "Approve"){
+        for (const selectedRescourceId of this.selectedRescourceIds) {
+          for (const change of this.resources) {
+            if(change.resourceId == selectedRescourceId){
+              this.dataService.updateApproval(change, 1).then((res: any)=>{
+                if(res.status == 200){
+                  this._snackBar.open("Genehmigung erfolgreich", 'Schließen', { horizontalPosition: this.horizontalPosition, verticalPosition: this.verticalPosition,panelClass: ['mat-primary']});
+                }else{
+                  this._snackBar.open(res.HttpErrorResponse.message, 'Schließen', {horizontalPosition: this.horizontalPosition, verticalPosition: this.verticalPosition, panelClass: ['mat-primary']});
+                }
+                this.refreshData();
+              });
+            }
+          }
+        }
+      }
+
+      if(args.item.text === "Zur Genehmigung" || args.item.text === "Permit"){
+        let data = {changes: [], states: this.states};
+        for (const selectedRescourceId of this.selectedRescourceIds) {
+          for (const iterator of this.resources) {
+            if(iterator.resourceId == selectedRescourceId){
+              data.changes.push({resourceId: iterator.resourceId, changeNr: iterator.changeNr, currentState: iterator.state});
+            }
+          }
+        }
+        let dialogRef = StateDialogComponent;
+        this.matDialog.open(dialogRef, {data : data}).afterClosed().subscribe((res)=>{
+          if(res.status == 200){
+            this.refreshData();
+          }
+        });
+      }
+
+      if(args.item.text === "Ablehnen" || args.item.text === "Reject"){
+        for (const selectedRescourceId of this.selectedRescourceIds) {
+          for (const change of this.resources) {
+            if(change.resourceId == selectedRescourceId){
+              this.dataService.updateApproval(change, 2).then((res: any)=>{
+                if(res.status == 200){
+                  this._snackBar.open("Ablehnen erfolgreich", 'Schließen', {horizontalPosition: this.horizontalPosition,verticalPosition: this.verticalPosition,panelClass: ['mat-primary']});
+                  this.refreshData();
+                }else{
+                  this._snackBar.open(res.HttpErrorResponse.message, 'Schließen', {horizontalPosition: this.horizontalPosition, verticalPosition: this.verticalPosition, panelClass: ['mat-primary']});
+                }
+              });
+            }
+          }
+        }
+      }
+
+      if(args.item.text === "stornieren" || args.item.text === "Cancel"){
+        for (const selectedRescourceId of this.selectedRescourceIds) {
+          for (const change of this.resources) {
+            if(change.resourceId == selectedRescourceId){
+              this.dataService.updateApproval(change, 3).then((res: any)=>{
+                if(res.status == 200){
+                  this._snackBar.open("Stornieren erfolgreich", 'Schließen', {horizontalPosition: this.horizontalPosition, verticalPosition: this.verticalPosition, panelClass: ['mat-primary']});
+                  this.refreshData();
+                }else{
+                  this._snackBar.open(res.HttpErrorResponse.message, 'Schließen', {horizontalPosition: this.horizontalPosition, verticalPosition: this.verticalPosition, panelClass: ['mat-primary']});
+                }
+              });
+            }
+          }
+        }
+      }
   }
 
+  /**############################### Syncfusion Framework EVENTS /**###############################*/
   /**
    * The function queryTaskbarInfo catches the corresponding syncfsuions event and colors the respective diamond depending on the status
    * @param args event arguments from the syncfusion gantt chart
@@ -416,607 +500,91 @@ export class NttGanttComponent implements OnInit {
   }
 
   /**
-   * The function onExpand catches the corresponding syncfsuions event and avoids a chart row from beeing expanded by the user
+   * The function taskbarEdited catches the corresponding syncfsuions event and cancels the user action if the isFixed flag of a task (Date) is set true
+   * If the isFixed flag is false, it triggers the dataService to update the moved date
    * @param args event arguments from the syncfusion gantt chart
    */
-  public onExpand(args: any){
+  public taskbarEdited(args: any){
+    if(args.data.taskData.isFixed !== false ) {
     args.cancel = true;
-  }
-
-  /**
-   * The function actionBegin catches the corresponding syncfsuions event
-   * @param event event arguments from the syncfusion gantt chart
-   */
-
-
-  /**
-   * The function mapTasksToResources slices the allResources array to the resources array according the actual page conditions maps the actual tasks (Dates) to the actual resources (Changes)
-   * This function is triggered when a pageEvent is thrown respectively a user changes the page on the paginator
-   * @param start begin of slice
-   * @param end end of slice
-   */
-  public mapTasksToResources(start : number, end : number){
-    this.data = [];
-    this.resources = this.allResources; //.slice(start, end);
-    for (const resource of this.resources) {
-      for (const task of resource.tasks) {
-        this.data.push(task);
-      }
+    }else{
+      const found = this.allResources.find((resource) => {
+        return resource.resourceId == args.data.taskData.resources[0].resourceId;
+      });
+      this.dataService.updateDatePerChange(found);
+      this.plantimeComponent.fetchPlanTimes();
+        let elem = document.querySelector(
+          '#'+'ganttDefaultSum'+ 'GanttChart > div.e-chart-root-container > div'
+        );
+        elem.scrollLeft = this.planTimeScrollLeft;
     }
-    // console.log(this.resources[this.resources.length-1]);
-    // this.resources.push({resourceId: 'Timeline', resourceName: 'Planzeit Summen pro Woche'})
   }
 
   /**
-   *  The function load catches the corresponding syncfsuions event and triggers the loading spinner to start while the gantt chart is refrehshing
+   * The function taskbarEditing catches the corresponding syncfsuions event and cancels the user action if the isFixed flag of a task (Date) is set true
    * @param args event arguments from the syncfusion gantt chart
    */
+  public taskbarEditing(args: any) {
+    if(args.data.taskData.isFixed !== false ) {
+      args.cancel = true;
+    }
+  }
+
+  public actionComplete(args: any){
+    if (args.action === 'HorizontalScroll') {
+      let elem = document.querySelector(
+        '#'+'ganttDefaultSum'+ 'GanttChart > div.e-chart-root-container > div'
+      );
+      elem.scrollLeft = args.scrollLeft;
+      this.planTimeScrollLeft = args.scrollLeft;
+    }
+  }
+
+  /**
+    *  The function load catches the corresponding syncfsuions event and triggers the loading spinner to start while the gantt chart is refrehshing
+    * @param args event arguments from the syncfusion gantt chart
+    */
   public load(args: any) {
     this.spin = true;
   }
 
   /**
-   * The function dataBound catches the corresponding syncfsuions event and stops the loading spinner
-   * @param args event arguments from the syncfusion gantt chart
-   */
+    * The function dataBound catches the corresponding syncfsuions event and stops the loading spinner
+    * @param args event arguments from the syncfusion gantt chart
+    */
   public dataBound(args: any) {
     this.spin = false;
   }
 
   /**
-   * The function created catches the corresponding syncfsuions event and stops the internal loading spinner
-   * @param args event arguments from the syncfusion gantt chart
-   */
+    * The function created catches the corresponding syncfsuions event and stops the internal loading spinner
+    * @param args event arguments from the syncfusion gantt chart
+    */
   public created(args: any) {
     this.ganttDefault.hideSpinner();
     this.ganttDefault.treeGrid.grid.hideSpinner();
-
   }
 
   /**
-   * The function onChange catches the corresponding syncfsuions event
-   * @param args event arguments from the syncfusion gantt chart
-   */
-  public onChange(args: any){
-
+  * The function onExpand catches the corresponding syncfsuions event and avoids a chart row from beeing expanded by the user
+  * @param args event arguments from the syncfusion gantt chart
+  */
+  public onExpand(args: any){
+    args.cancel = true;
   }
-
-  /**
-   * The function handlePageEvent catches the corresponding matpaginator event and slices the gantt chart, that it fits to the actual page
-   * @param e pageEvent from the matpaginator
-   */
-  public handlePageEvent(e: PageEvent):void {
-    let start = e.pageSize*e.pageIndex;
-    let end = start+ e.pageSize;
-    this.sliceStart = start;
-    this.sliceEnd = end;
-    //this.mapTasksToResources(start, end);
-    //this.quickRefresh();
-    this.refreshData();
-    // this.ganttDefault.dataSource = this.data;
-    // this.ganttDefault.resources = this.resources;
-    // this.ganttDefault.refresh();
-
-  }
-
-  /**
-   * The function startDateChanged catches the corresponding date-range-picker event
-   * @param startDate new startDate from date-range-picker
-   */
-  public startDateChanged(startDate: any){
-    this.renderplanTime = false;
-  }
-
-  /**
-   * The function endDateChanged catches the corresponding date-range-picker event and validates the selected start- and enddate bacause the gantt chart needs a valid Date to be displayed
-   * @param endDate new endDate from date-range-picker
-   */
-  public endDateChanged(endDate: any){
-    if(this.range.status == 'VALID' && this.range.controls.start.value && this.range.controls.end.value){ //event for Requesting new Records based on the Dates
-      this.projectStartDate = new Date(this.range.controls.start.value);
-      this.projectEndDate = new Date(this.range.controls.end.value);
-      this.renderplanTime = true;
-    }
-  }
-
-  // public rowSelecting(args: any){
-  //   console.log(args)
-  //   if(args.data.length){
-  //     // if((args.data.length == this.resources.length+1)){
-  //     //   console.log("all")
-  //     // }else{
-  //     //   if(args.data[args.data.length-1].TaskID == 'Timeline'){
-  //     //     args.cancel = true;
-  //     //   }
-  //     // }
-  //     if(args.data[args.data.length-1].TaskID == 'Timeline'){
-  //       let data = args.data;
-  //       data.pop();
-  //       args.data = data;
-  //     }
-
-  //   }else{
-  //     if(args.data.TaskID == 'Timeline'){
-  //       args.cancel = true;
-  //     }
-  //   }
-
-  // }
-
-  /**
-   * The function rowSelected catches the corresponding syncfsuions event and checks if all selected resources (changes) have the same status, then it displays the corresponding buttons
-   * @param args event arguments from the syncfusion gantt chart
-   */
-  public rowSelected(args: any) {
-
-    this.approvalPending = false;
-    this.selectedrowindex = this.ganttDefault.selectionModule.getSelectedRowIndexes();  // get the selected row indexes.
-    this.selectedrecords = this.ganttDefault.selectionModule.getSelectedRecords();  // get the selected records.
-    this.selRecs=[];
-    if(this.selectedrowindex.length>this.resources.length-1){
-      for (const record of this.selectedrecords) {
-        if(record.taskData.isRes == true){
-          this.selRecs.push(record);
-        }
-      }
-    }else{
-      this.selRecs = this.selectedrecords;
-    }
-    let allStates: boolean = true;
-    let allPermit: boolean = true;
-    let allApprove: boolean = true;
-    let allReject: boolean = true;
-    let allCancel: boolean = true;
-    let allImplementer: boolean = true;
-    let allTransition: boolean = true;
-    this.selectedRescourceIds = [];
-    for (const change of this.selRecs) {
-      if(change.taskData.approvalStatus == 1){
-        this.approvalPending = true;
-        }
-      if(change.taskData.state == this.selRecs[0].taskData.state){
-        if(allStates){
-          allStates = true;
-        }
-        this.selectedRescourceIds.push(change.taskData.resourceId);
-        }else{
-          allStates = false;
-        }
-
-      if(change.taskData.flagPermit == true && allPermit == true){
-        allPermit = true;
-      }else{
-        allPermit = false;
-      }
-      if(change.taskData.flagApproval == true && allApprove == true){
-        allApprove = true;
-      }else{
-        allApprove = false;
-      }
-      if(change.taskData.flagReject == true && allReject == true){
-        allReject = true;
-      }else{
-        allReject = false;
-      }
-      if(change.taskData.flagCancel == true && allCancel == true){
-        allCancel = true;
-      }else{
-        allCancel = false;
-      }
-      if(change.taskData.implementerEdit == true && allImplementer == true){
-        allImplementer = true;
-      }else{
-        allImplementer = false;
-      }
-      if(change.taskData.state > 0 && allTransition == true){
-        allTransition = true;
-      }else{
-        allTransition = false;
-      }
-    }
-
-    if(allStates){
-      this.toolbar = [];
-      if(allTransition){
-        this.toolbar.push({text:this.languageService.lMap.get("stateChange"), id: "6"});
-      }
-      if(allPermit){
-        this.toolbar.push({text: this.languageService.lMap.get("permit"), id: "5"});
-      }
-      if(allApprove){
-        this.toolbar.push({text: this.languageService.lMap.get("genehmigen"), id: "7"});
-      }
-      if(allReject){
-        this.toolbar.push({text: this.languageService.lMap.get("ablehnen"), id: "8"});
-      }
-      if(allCancel){
-        this.toolbar.push({text: this.languageService.lMap.get("stornieren"), id: "11"});
-      }
-      if(allImplementer){
-        this.toolbar.push({text: this.languageService.lMap.get("implementer"), id: "10"});
-      }
-
-    }else{
-      this.toolbar = [];
-    }
-
-
-    this.approvalPending = false;
-    this.selRecs = [];
-    this.selectedrecords = [];
-    this.selectedrowindex = [];
-  }
-
-  /**
-   * The function rowDeselected catches the corresponding syncfsuions event
-   * When a line is deselected, it is checked if all resource states are equal after deselecting a resource, if they are equal then the respective buttons are displayed
-   * @param args event arguments from the syncfusion gantt chart
-   */
-  public rowDeselected(args: any){
-    this.selectedRescourceIds.forEach((element,index)=>{
-      if(element == args.data.taskData.resourceId) delete this.selectedRescourceIds[index]; //TODO: auf memoryLeak prüfen
-    });
-
-      this.selectedrowindex= this.ganttDefault.selectionModule.getSelectedRowIndexes();  // get the selected row indexes.
-      this.selectedrecords= this.ganttDefault.selectionModule.getSelectedRecords();  // get the selected records.
-      this.selRecs = [];
-      if(this.selectedrowindex.length>this.resources.length-1){
-        for (const record of this.selectedrecords) {
-          if(record.taskData.isRes == true){
-            this.selRecs.push(record);
-          }
-        }
-      }else{
-        this.selRecs = this.selectedrecords;
-      }
-        let allStates: boolean = true;
-        let allPermit: boolean = true;
-        let allApprove: boolean = true;
-        let allReject: boolean = true;
-        let allCancel: boolean = true;
-        let allImplementer: boolean = true;
-        let allTransition: boolean = true;
-        this.selectedRescourceIds = [];
-        for (const change of this.selRecs) {
-          if(change.taskData.state == this.selRecs[0].taskData.state){
-            if(change.taskData.approvalStatus == 1){
-              this.approvalPending = true;
-              }
-          if(allStates){
-            allStates = true;
-          }
-            this.selectedRescourceIds.push(change.taskData.resourceId);
-          }else{
-            allStates = false;
-          }
-
-
-      if(change.taskData.flagPermit == true && allPermit == true){
-        allPermit = true;
-      }else{
-        allPermit = false;
-      }
-      if(change.taskData.flagApproval == true && allApprove == true){
-        allApprove = true;
-      }else{
-        allApprove = false;
-      }
-      if(change.taskData.flagReject == true && allReject == true){
-        allReject = true;
-      }else{
-        allReject = false;
-      }
-      if(change.taskData.flagCancel == true && allCancel == true){
-        allCancel = true;
-      }else{
-        allCancel = false;
-      }
-      if(change.taskData.implementerEdit == true && allImplementer == true){
-        allImplementer = true;
-      }else{
-        allImplementer = false;
-      }
-      if(change.taskData.state > 0 && allTransition == true){
-        allTransition = true;
-      }else{
-        allTransition = false;
-      }
-
-    }
-    if(allStates){
-      this.toolbar = [];
-      if(allTransition){
-        this.toolbar.push({text:this.languageService.lMap.get("stateChange"), id: "6"});
-      }
-      if(allPermit){
-        this.toolbar.push({text: this.languageService.lMap.get("permit"), id: "5"});
-      }
-      if(allApprove){
-        this.toolbar.push({text: this.languageService.lMap.get("genehmigen"), id: "7"});
-      }
-      if(allReject){
-        this.toolbar.push({text: this.languageService.lMap.get("ablehnen"), id: "8"});
-      }
-      if(allCancel){
-        this.toolbar.push({text: this.languageService.lMap.get("stornieren"), id: "11"});
-      }
-      if(allImplementer){
-        this.toolbar.push({text: this.languageService.lMap.get("implementer"), id: "10"});
-      }
-
-    }else{
-      this.toolbar = [];
-    }
-        this.selRecs = [];
-        this.selectedrecords = [];
-        this.selectedrowindex = [];
-        this.approvalPending = false;
-
-  }
-
-  /**
-   * The function toolbarBtnClicked catches the corresponding syncfsuions event and executes the button logic when a button is clicked
-   * @param args
-   */
-  public toolbarBtnClicked(args :any){
-
-    if(args.item.text === "Statusübergang" || args.item.text === "State Transition"){
-      let data = {changes: [], states: this.states};
-      for (const selectedRescourceId of this.selectedRescourceIds) {
-        for (const iterator of this.resources) {
-          if(iterator.resourceId == selectedRescourceId){
-            data.changes.push({resourceId: iterator.resourceId, changeNr: iterator.changeNr, currentState: iterator.state});
-          }
-        }
-      }
-      let dialogRef = StateDialogComponent;
-      this.matDialog.open(dialogRef,
-      {
-        data : data,
-      }).afterClosed().subscribe((res)=>{
-        if(res=="Success"){
-          this.refreshData();
-        }
-
-      });
-    }
-
-    if(args.item.text === "Implementer Eintragen" || args.item.text === "Enter Implementer"){
-      let data = {changes: []};
-      for (const selectedRescourceId of this.selectedRescourceIds) {
-        for (const change of this.resources) {
-          if(change.resourceId == selectedRescourceId){
-            // console.log(change);
-            data.changes.push({resourceId: change.resourceId, pkgId: change.changeNr, supportGroupId: change.supportGroupId});
-          }
-        }
-      }
-      this.matDialog.open(ImplementerDialogComponent,
-      {
-        data : data,
-      });
-
-    }
-
-    if(args.item.text === "Genehmigen" || args.item.text === "Approve"){
-
-      for (const selectedRescourceId of this.selectedRescourceIds) {
-        for (const change of this.resources) {
-          if(change.resourceId == selectedRescourceId){
-            this.dataService.updateApproval(change, 1).then((res: any)=>{
-              if(res.status == 200){
-                this._snackBar.open("Genehmigung erfolgreich", 'Schließen', {
-                  horizontalPosition: this.horizontalPosition,
-                  verticalPosition: this.verticalPosition,
-                  panelClass: ['mat-primary']
-                });
-              }else{
-                this._snackBar.open(res.HttpErrorResponse.message, 'Schließen', {
-                  horizontalPosition: this.horizontalPosition,
-                  verticalPosition: this.verticalPosition,
-                  panelClass: ['mat-primary']
-                });
-              }
-              this.refreshData();
-            });
-          }
-        }
-      }
-      //this.ganttDefault.refresh();
-    }
-
-    if(args.item.text === "Zur Genehmigung" || args.item.text === "Permit"){
-      let data = {changes: [], states: this.states};
-      for (const selectedRescourceId of this.selectedRescourceIds) {
-        for (const iterator of this.resources) {
-          if(iterator.resourceId == selectedRescourceId){
-            data.changes.push({resourceId: iterator.resourceId, changeNr: iterator.changeNr, currentState: iterator.state});
-          }
-        }
-      }
-      let dialogRef = StateDialogComponent;
-      this.matDialog.open(dialogRef,
-      {
-        data : data,
-      }).afterClosed().subscribe((res)=>{
-        if(res.status == 200){
-          this.refreshData();
-        }
-
-      });
-    }
-
-
-
-    if(args.item.text === "Ablehnen" || args.item.text === "Reject"){
-      for (const selectedRescourceId of this.selectedRescourceIds) {
-        for (const change of this.resources) {
-          if(change.resourceId == selectedRescourceId){
-            this.dataService.updateApproval(change, 2).then((res: any)=>{
-              if(res.status == 200){
-                this._snackBar.open("Ablehnen erfolgreich", 'Schließen', {
-                  horizontalPosition: this.horizontalPosition,
-                  verticalPosition: this.verticalPosition,
-                  panelClass: ['mat-primary']
-                });
-              }else{
-                this._snackBar.open(res.HttpErrorResponse.message, 'Schließen', {
-                  horizontalPosition: this.horizontalPosition,
-                  verticalPosition: this.verticalPosition,
-                  panelClass: ['mat-primary']
-                });
-              }
-              this.refreshData();
-            });
-          }
-        }
-      }
-      //this.ganttDefault.refresh();
-    }
-
-    if(args.item.text === "stornieren" || args.item.text === "Cancel"){
-      for (const selectedRescourceId of this.selectedRescourceIds) {
-        for (const change of this.resources) {
-          if(change.resourceId == selectedRescourceId){
-            this.dataService.updateApproval(change, 3).then((res: any)=>{
-              if(res.status == 200){
-                this._snackBar.open("Stornieren erfolgreich", 'Schließen', {
-                  horizontalPosition: this.horizontalPosition,
-                  verticalPosition: this.verticalPosition,
-                  panelClass: ['mat-primary']
-                });
-              }else{
-                this._snackBar.open(res.HttpErrorResponse.message, 'Schließen', {
-                  horizontalPosition: this.horizontalPosition,
-                  verticalPosition: this.verticalPosition,
-                  panelClass: ['mat-primary']
-                });
-              }
-              this.refreshData();
-            });
-          }
-        }
-      }
-      //this.ganttDefault.refresh();
-    }
-  }
-
-
-
-
-
-  quickRefresh(){
-    this.renderGantt = false;
-    let newData = [];
-    for (const dat of this.data) {
-      newData.push(dat);
-    }
-    this.data = newData;
-    this.renderGantt = true;
-  }
-
-  refreshData(){
-    //console.log(this.ganttDefault.splitterModule);
-    this.showNoResultsError = false;
-    this.renderGantt = false;
-    this.dataService.fetchChanges(this.mapRequestJSON()).then((res: any[])=>{
-      this.allResources = res;
-        this.mapTasksToResources(this.sliceStart,this.sliceEnd);
-        // console.log(this.allResources)
-        if(res.length > 0){
-          this.spin = true;
-          this.renderGantt = true;
-          this.showNoResultsError = false;
-          this.renderplanTime = true;
-        }else{
-          this.renderGantt = false;
-          this.spin = false;
-          this.showNoResultsError = true;
-          this.renderplanTime = false;
-        }
-
-    });
-
-
-
-    // this.mapTasksToResources(this.sliceStart, this.sliceEnd);
-    // this.data = [];
-    // this.resources = this.allResources.slice(this.sliceStart, this.sliceEnd);
-    // for (const resource of this.resources) {
-    //   for (const task of resource.tasks) {
-    //     this.data.push(task);
-    //   }
-    // }
-
-  }
-  clearFilter(){
-      this.filters = null;
-      this.filterEnabled = false;
-      this.sort = null;
-      this.sortEnabled = false;
-      this.refreshData();
-  }
-  mapRequestJSON(){
-    let request =
-    {
-      'sliceStart': this.sliceStart,
-      'sliceEnd': this.sliceEnd,
-      filter: this.filterEnabled ? this.filters : {filterElement: [{column: "SupportGroup", filter: "equals", criteria: [this.userSupportGroup]}]},
-      sort: this.sortEnabled ? this.sort : {
-        'column': 'ChangeNr',
-        'mode': 'asc'
-      },
-    }
-    return request;
-  }
-
-  applyFilter(){
-    if(this.filterEnabled){
-      this.oldFilters = this.filters
-      this.filters = null;
-      this.refreshData();
-      this.plantimeComponent.fetchPlanTimes(this.filters);
-    }else{
-      this.filters = this.oldFilters;
-      this.refreshData();
-      this.plantimeComponent.fetchPlanTimes(this.filters);
-    }
-
-  }
-  openFilterDialog(){
-    let dialogRef = FilterDialogComponent;
-      this.matDialog.open(dialogRef,
-      {
-        data : [],
-        height: '70%',
-        width: '80%'
-      }).afterClosed().subscribe((res)=>{
-        if(res){
-          this.filters = res;
-          this.filterEnabled = true;
-          this.refreshData();
-        }
-      });
-
-
-  }
-
   public onResizing(args){
-    let width ='' + args.paneSize[0]+'px';
-    this.splitterSettings = {
-      position: width
-    };
+    let width = '' + args.paneSize[0]+'px';
+    this.splitterSettings = {position: width};
   }
   public actionBegin(args: any) {
-     if(args.dialogModel){
+    if(args.dialogModel){
       args.cancel = true;
       if(args.rowData.taskData.resources[0].state == 0){
         window.open("https://itsm-dev.asfinag.at/arsys/forms/itsm-app-dev/SHR%3ALandingConsole/Default+Administrator+View/?mode=search&F304255500=ASF:WI_TAS_Paket&F1000000076=FormOpenNoAppList&F303647600=SearchTicketWithQual&F304255610='1000000182' =\""+args.rowData.taskData.resources[0].changeNr+"\"", "_blank");
       }else{
         window.open("https://itsm-dev.asfinag.at/arsys/forms/itsm-app-dev/SHR%3ALandingConsole/Default+Administrator+View/?mode=search&F304255500=CHG:Infrastructure Change&F1000000076=FormOpenNoAppList&F303647600=SearchTicketWithQual&F304255610='1000000182' =\""+args.rowData.taskData.resources[0].changeNr+"\"", "_blank");
       }
-
-     }else{
+    }else{
       if(args.requestType=='sorting'){
         let colName = "";
         let mode = "asc";
@@ -1044,14 +612,213 @@ export class NttGanttComponent implements OnInit {
             mode = 'dsc'
           }
           this.oldSort = this.sort;
-          this.sort = {
-            'column': colName,
-            'mode': mode
-          }
+          this.sort = {'column': colName, 'mode': mode}
           this.refreshData();
         }
       }
-     }
+    }
+  }
 
+  /**
+  * The function rowSelected catches the corresponding syncfsuions event and checks if all selected resources (changes) have the same status, then it displays the corresponding buttons
+  * @param args event arguments from the syncfusion gantt chart
+  */
+  public rowSelected(args: any) {
+      this.approvalPending = false;
+      this.selectedrowindex = this.ganttDefault.selectionModule.getSelectedRowIndexes();  // get the selected row indexes.
+      this.selectedrecords = this.ganttDefault.selectionModule.getSelectedRecords();  // get the selected records.
+      this.selRecs=[];
+      if(this.selectedrowindex.length>this.resources.length-1){
+        for (const record of this.selectedrecords) {
+          if(record.taskData.isRes == true){
+            this.selRecs.push(record);
+          }
+        }
+      }else{
+        this.selRecs = this.selectedrecords;
+      }
+      let allStates: boolean = true;
+      let allPermit: boolean = true;
+      let allApprove: boolean = true;
+      let allReject: boolean = true;
+      let allCancel: boolean = true;
+      let allImplementer: boolean = true;
+      let allTransition: boolean = true;
+      this.selectedRescourceIds = [];
+      for (const change of this.selRecs) {
+        if(change.taskData.approvalStatus == 1){
+          this.approvalPending = true;
+          }
+        if(change.taskData.state == this.selRecs[0].taskData.state){
+          if(allStates){
+            allStates = true;
+          }
+          this.selectedRescourceIds.push(change.taskData.resourceId);
+          }else{
+            allStates = false;
+          }
+        if(change.taskData.flagPermit == true && allPermit == true){
+          allPermit = true;
+        }else{
+          allPermit = false;
+        }
+        if(change.taskData.flagApproval == true && allApprove == true){
+          allApprove = true;
+        }else{
+          allApprove = false;
+        }
+        if(change.taskData.flagReject == true && allReject == true){
+          allReject = true;
+        }else{
+          allReject = false;
+        }
+        if(change.taskData.flagCancel == true && allCancel == true){
+          allCancel = true;
+        }else{
+          allCancel = false;
+        }
+        if(change.taskData.implementerEdit == true && allImplementer == true){
+          allImplementer = true;
+        }else{
+          allImplementer = false;
+        }
+        if(change.taskData.state > 0 && allTransition == true){
+          allTransition = true;
+        }else{
+          allTransition = false;
+        }
+      }
+
+      if(allStates){
+        this.toolbar = [];
+        if(allTransition){
+          this.toolbar.push({text:this.languageService.lMap.get("stateChange"), id: "6"});
+        }
+        if(allPermit){
+          this.toolbar.push({text: this.languageService.lMap.get("permit"), id: "5"});
+        }
+        if(allApprove){
+          this.toolbar.push({text: this.languageService.lMap.get("genehmigen"), id: "7"});
+        }
+        if(allReject){
+          this.toolbar.push({text: this.languageService.lMap.get("ablehnen"), id: "8"});
+        }
+        if(allCancel){
+          this.toolbar.push({text: this.languageService.lMap.get("stornieren"), id: "11"});
+        }
+        if(allImplementer){
+          this.toolbar.push({text: this.languageService.lMap.get("implementer"), id: "10"});
+        }
+
+      }else{
+        this.toolbar = [];
+      }
+      this.approvalPending = false;
+      this.selRecs = [];
+      this.selectedrecords = [];
+      this.selectedrowindex = [];
+  }
+
+  /**
+  * The function rowDeselected catches the corresponding syncfsuions event
+  * When a line is deselected, it is checked if all resource states are equal after deselecting a resource, if they are equal then the respective buttons are displayed
+  * @param args event arguments from the syncfusion gantt chart
+  */
+  public rowDeselected(args: any){
+      this.selectedRescourceIds.forEach((element,index)=>{
+        if(element == args.data.taskData.resourceId) delete this.selectedRescourceIds[index]; //TODO: auf memoryLeak prüfen
+      });
+
+        this.selectedrowindex= this.ganttDefault.selectionModule.getSelectedRowIndexes();  // get the selected row indexes.
+        this.selectedrecords= this.ganttDefault.selectionModule.getSelectedRecords();  // get the selected records.
+        this.selRecs = [];
+        if(this.selectedrowindex.length>this.resources.length-1){
+          for (const record of this.selectedrecords) {
+            if(record.taskData.isRes == true){
+              this.selRecs.push(record);
+            }
+          }
+        }else{
+          this.selRecs = this.selectedrecords;
+        }
+          let allStates: boolean = true;
+          let allPermit: boolean = true;
+          let allApprove: boolean = true;
+          let allReject: boolean = true;
+          let allCancel: boolean = true;
+          let allImplementer: boolean = true;
+          let allTransition: boolean = true;
+          this.selectedRescourceIds = [];
+          for (const change of this.selRecs) {
+            if(change.taskData.state == this.selRecs[0].taskData.state){
+              if(change.taskData.approvalStatus == 1){
+                this.approvalPending = true;
+                }
+            if(allStates){
+              allStates = true;
+            }
+              this.selectedRescourceIds.push(change.taskData.resourceId);
+            }else{
+              allStates = false;
+            }
+        if(change.taskData.flagPermit == true && allPermit == true){
+          allPermit = true;
+        }else{
+          allPermit = false;
+        }
+        if(change.taskData.flagApproval == true && allApprove == true){
+          allApprove = true;
+        }else{
+          allApprove = false;
+        }
+        if(change.taskData.flagReject == true && allReject == true){
+          allReject = true;
+        }else{
+          allReject = false;
+        }
+        if(change.taskData.flagCancel == true && allCancel == true){
+          allCancel = true;
+        }else{
+          allCancel = false;
+        }
+        if(change.taskData.implementerEdit == true && allImplementer == true){
+          allImplementer = true;
+        }else{
+          allImplementer = false;
+        }
+        if(change.taskData.state > 0 && allTransition == true){
+          allTransition = true;
+        }else{
+          allTransition = false;
+        }
+
+      }
+      if(allStates){
+        this.toolbar = [];
+        if(allTransition){
+          this.toolbar.push({text:this.languageService.lMap.get("stateChange"), id: "6"});
+        }
+        if(allPermit){
+          this.toolbar.push({text: this.languageService.lMap.get("permit"), id: "5"});
+        }
+        if(allApprove){
+          this.toolbar.push({text: this.languageService.lMap.get("genehmigen"), id: "7"});
+        }
+        if(allReject){
+          this.toolbar.push({text: this.languageService.lMap.get("ablehnen"), id: "8"});
+        }
+        if(allCancel){
+          this.toolbar.push({text: this.languageService.lMap.get("stornieren"), id: "11"});
+        }
+        if(allImplementer){
+          this.toolbar.push({text: this.languageService.lMap.get("implementer"), id: "10"});
+        }
+      }else{
+        this.toolbar = [];
+      }
+      this.selRecs = [];
+      this.selectedrecords = [];
+      this.selectedrowindex = [];
+      this.approvalPending = false;
   }
 }