diff --git a/frontend/src/app/app.module.ts b/frontend/src/app/app.module.ts
index f202db1..f300b9f 100644
--- a/frontend/src/app/app.module.ts
+++ b/frontend/src/app/app.module.ts
@@ -44,7 +44,6 @@ import {MatBadgeModule} from '@angular/material/badge';
import { CustomPaginatorIntl } from './custom-paginator-intl.service';
-
@NgModule({
declarations: [
AppComponent,
@@ -88,10 +87,8 @@ import { CustomPaginatorIntl } from './custom-paginator-intl.service';
MatButtonToggleModule,
MatCardModule,
MatBadgeModule
-
],
-
providers: [ToolbarService,
EditService,
SelectionService,
@@ -99,6 +96,7 @@ import { CustomPaginatorIntl } from './custom-paginator-intl.service';
SortService,
FilterService,
{ provide: MatPaginatorIntl, useClass: CustomPaginatorIntl },
+ ReactiveFormsModule
],
bootstrap: [AppComponent]
})
diff --git a/frontend/src/app/filter-dialog/filter-dialog.component.html b/frontend/src/app/filter-dialog/filter-dialog.component.html
index 7e0e498..2e60ff8 100644
--- a/frontend/src/app/filter-dialog/filter-dialog.component.html
+++ b/frontend/src/app/filter-dialog/filter-dialog.component.html
@@ -23,7 +23,7 @@
-
+
@@ -68,6 +68,27 @@
[matBadge]="''" class="dot-badge">
{{this.languageService.lMap.get('filterDilogDateText')}}
+
+
+ {{this.languageService.lMap.get('filterDilogDate')}}
+
+
+
+
+
+
+
+
+
+
diff --git a/frontend/src/app/filter-dialog/filter-dialog.component.ts b/frontend/src/app/filter-dialog/filter-dialog.component.ts
index d53eadc..41a65ca 100644
--- a/frontend/src/app/filter-dialog/filter-dialog.component.ts
+++ b/frontend/src/app/filter-dialog/filter-dialog.component.ts
@@ -4,9 +4,10 @@ import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
import { MatSnackBar } from '@angular/material/snack-bar';
import { DataService } from '../data.service';
import { MAT_DATE_FORMATS } from '@angular/material/core'
+import { FormGroup, FormBuilder } from '@angular/forms';
-export interface FilterAttribute{
-name: string,
+export interface FilterAttribute {
+ name: string,
}
export const MY_DATE_FORMATS = {
@@ -53,7 +54,7 @@ export class FilterDialogComponent implements OnInit {
public dateFilter = [];
public intervallFilter: boolean;
- public prevFilters: any[]=[];
+ public prevFilters: any[] = [];
public prevFilterText: string;
public prevFiltersSg: string[] = [];
@@ -75,6 +76,7 @@ export class FilterDialogComponent implements OnInit {
public IntervallEnabled: boolean = false;
public filterObj;
+ public range: FormGroup;
/**
@@ -84,17 +86,21 @@ export class FilterDialogComponent implements OnInit {
* @param data contains an array of Changes which should be sent to the backend for a status transition
* @param dataService injects the dataService for data management and backend communication
*/
- constructor(public languageService: LanguageService, public dialogRef: MatDialogRef, @Inject(MAT_DIALOG_DATA) public data: any, private dataService: DataService, private _snackBar: MatSnackBar) {
+ constructor(public languageService: LanguageService, public dialogRef: MatDialogRef, @Inject(MAT_DIALOG_DATA) public data: any, private dataService: DataService, private _snackBar: MatSnackBar, private fb: FormBuilder) {
//dialogRef.beforeClosed().subscribe(() => dialogRef.close(this.dataToReturn));
+ this.range = this.fb.group({
+ start: [null],
+ end: [null]
+ });
- if(data[0].filters){
+ if (data[0].filters) {
////console.log(data[0].filters.filterElement);
this.prevFilters = data[0].filters.filterElement;
}
- if(data[0].userSg){
+ if (data[0].userSg) {
this.userSupportGroup = data[0].userSg;
}
- this.dataService.fetchUserSupportGroup().then((res:any)=>{
+ this.dataService.fetchUserSupportGroup().then((res: any) => {
console.log("\nNEW FETCHED USER SG IN FILTERCOMPONEN");
this.userSupportGroup = res.name;
});
@@ -105,31 +111,31 @@ export class FilterDialogComponent implements OnInit {
*/
ngOnInit(): void {
//console.log(this.prevFilters);
- if(this.prevFilters.length > 0){
+ if (this.prevFilters.length > 0) {
for (const filter of this.prevFilters) {
//console.log(filter);
- if(filter.column == "SupportGroup"){
+ if (filter.column == "SupportGroup") {
console.log("\nPREVSUPPORTGROUPSFILTER")
console.log(filter);
this.prevFiltersSg = filter.criteria;
this.FiltersSgEnabled = false;
}
- if(filter.column == "State"){
+ if (filter.column == "State") {
this.StateEnabled = true;
console.log("\nStatesfilter prev")
console.log(filter);
- if(this.languageService.language == "DE"){
+ if (this.languageService.language == "DE") {
for (const crit of filter.criteria) {
- this.prevFiltersState.push(this.dataService.getStates().find((item)=> {return item.stateNameEN == crit;}).stateNameDE);
+ this.prevFiltersState.push(this.dataService.getStates().find((item) => { return item.stateNameEN == crit; }).stateNameDE);
}
- }else{
- this.prevFiltersState = filter.criteria;
+ } else {
+ this.prevFiltersState = filter.criteria;
}
}
- if(filter.column == "Contract"){
+ if (filter.column == "Contract") {
this.ContractEnabled = true;
//console.log(filter);
for (const crit of filter.criteria) {
@@ -149,53 +155,53 @@ export class FilterDialogComponent implements OnInit {
// //this.prevFiltersPaketType = filter.criteria;
// }
- if(filter.column == "D2"){
+ if (filter.column == "D2") {
this.DateEnabled = true;
this.filterStartDate = filter.criteria[0];
this.filterEndDate = filter.criteria[1];
}
- if(filter.column == "ResourceName"){
+ if (filter.column == "ResourceName") {
this.TextEnabled = true;
this.criteria = filter.criteria[0];
}
- if(filter.column == "ASF_WI_HighestIntervall"){
+ if (filter.column == "ASF_WI_HighestIntervall") {
this.IntervallEnabled = true;
this.intervallFilter = true;
}
}
}
- if(this.prevFiltersSg.length == 0){
+ if (this.prevFiltersSg.length == 0) {
this.prevFiltersSg[0] = this.userSupportGroup;
}
- //console.log(this.userSupportGroup);
- if(this.languageService.language == 'DE'){
- for (const state of this.dataService.getStates()) {
- this.states.push(state.stateNameDE);
- }
- }else{
- for (const state of this.dataService.getStates()) {
- this.states.push(state.stateNameEN);
- }
+ //console.log(this.userSupportGroup);
+ if (this.languageService.language == 'DE') {
+ for (const state of this.dataService.getStates()) {
+ this.states.push(state.stateNameDE);
}
+ } else {
+ for (const state of this.dataService.getStates()) {
+ this.states.push(state.stateNameEN);
+ }
+ }
- for (const supportGroup of this.dataService.getSupportGroups()) {
- console.log("\nPUSHING SUPPORTGROUPS STORED IN DATASERVICE");
- this.supportGroups.push(supportGroup.name);
- }
- // this.supportGroups.push(this.userSupportGroup);
+ for (const supportGroup of this.dataService.getSupportGroups()) {
+ console.log("\nPUSHING SUPPORTGROUPS STORED IN DATASERVICE");
+ this.supportGroups.push(supportGroup.name);
+ }
+ // this.supportGroups.push(this.userSupportGroup);
- for (const contract of this.dataService.getContracts()) {
- this.contracts.push(contract.name);
- }
- // for (const paketType of this.dataService.getPaketTypes()) {
- // this.paketTypes.push(paketType.name);
- // }
+ for (const contract of this.dataService.getContracts()) {
+ this.contracts.push(contract.name);
+ }
+ // for (const paketType of this.dataService.getPaketTypes()) {
+ // this.paketTypes.push(paketType.name);
+ // }
}
/**
@@ -204,159 +210,162 @@ export class FilterDialogComponent implements OnInit {
* @param event selection event from the multiselect-autocomplete-component
*/
onResult(event: any) {
- //console.log(event);
- switch (event.key) {
- case 'supportGroup':
- this.supportGroupsFilter = event.data;
- this.supportGroupsFilter = [...new Set(this.supportGroupsFilter)];
+ //console.log(event);
+ switch (event.key) {
+ case 'supportGroup':
+ this.supportGroupsFilter = event.data;
+ this.supportGroupsFilter = [...new Set(this.supportGroupsFilter)];
break;
- case 'state':
- if(event.data[0]){
- this.StateEnabled = true;
- }else{
- this.StateEnabled = false;
- }
+ case 'state':
+ if (event.data[0]) {
+ this.StateEnabled = true;
+ } else {
+ this.StateEnabled = false;
+ }
- this.statesFilter = [];
- if(this.languageService.language == 'DE'){
- // console.log(event.data);
- for (const state of event.data) {
- if(this.dataService.getStates().find((item)=> {return item.stateNameDE == state;})){
- this.statesFilter.push(this.dataService.getStates().find((item)=> {return item.stateNameDE == state;}).stateNameEN);
- }
- // console.log(this.statesFilter);
- }
- }else{
- //console.log(event.data);
- for (const state of event.data) {
- if(this.dataService.getStates().find((item)=> {return item.stateNameEN == state;})){
- this.statesFilter.push(this.dataService.getStates().find((item)=> {return item.stateNameEN == state;}).stateNameEN);
- }
- // console.log(this.statesFilter);
+ this.statesFilter = [];
+ if (this.languageService.language == 'DE') {
+ // console.log(event.data);
+ for (const state of event.data) {
+ if (this.dataService.getStates().find((item) => { return item.stateNameDE == state; })) {
+ this.statesFilter.push(this.dataService.getStates().find((item) => { return item.stateNameDE == state; }).stateNameEN);
}
+ // console.log(this.statesFilter);
}
- this.statesFilter = [...new Set(this.statesFilter)];
-
- // console.log("\nRESULT Statesfilter");
- // console.log(this.statesFilter);
-
- break;
- case 'contract':
- if(event.data[0]){
- this.ContractEnabled = true;
- }else{
- this.ContractEnabled = false;
+ } else {
+ //console.log(event.data);
+ for (const state of event.data) {
+ if (this.dataService.getStates().find((item) => { return item.stateNameEN == state; })) {
+ this.statesFilter.push(this.dataService.getStates().find((item) => { return item.stateNameEN == state; }).stateNameEN);
+ }
+ // console.log(this.statesFilter);
}
- //this.contractsFilter = event.data;
- this.contractsFilter = [];
- //console.log(event.data);
- for (const contract of event.data) {
- if(this.dataService.getContracts().find((item)=> {return item.name == contract;})){
- this.contractsFilter.push(this.dataService.getContracts().find((item)=> {return item.name == contract;}).id);
- }
+ }
+ this.statesFilter = [...new Set(this.statesFilter)];
- }
- //this.contractsFilter = [...new Set(this.contractsFilter)];
- //console.log(this.contractsFilter);
- break;
- // case 'paketType':
- // //this.paketTypesFilter = event.data;
- // this.paketTypesFilter = [];
- // //console.log(event.data);
- // for (const paketType of event.data) {
- // if(this.dataService.getPaketTypeIdByName(paketType)){
- // this.paketTypesFilter.push(this.dataService.getPaketTypeIdByName(paketType));
- // }
+ // console.log("\nRESULT Statesfilter");
+ // console.log(this.statesFilter);
- // }
- // // this.paketTypesFilter = [...new Set(this.paketTypesFilter)];
- // //console.log(this.paketTypesFilter);
- // break;
- default:
- break;
- }
+ break;
+ case 'contract':
+ if (event.data[0]) {
+ this.ContractEnabled = true;
+ } else {
+ this.ContractEnabled = false;
+ }
+ //this.contractsFilter = event.data;
+ this.contractsFilter = [];
+ //console.log(event.data);
+ for (const contract of event.data) {
+ if (this.dataService.getContracts().find((item) => { return item.name == contract; })) {
+ this.contractsFilter.push(this.dataService.getContracts().find((item) => { return item.name == contract; }).id);
+ }
+
+ }
+ //this.contractsFilter = [...new Set(this.contractsFilter)];
+ //console.log(this.contractsFilter);
+ break;
+ // case 'paketType':
+ // //this.paketTypesFilter = event.data;
+ // this.paketTypesFilter = [];
+ // //console.log(event.data);
+ // for (const paketType of event.data) {
+ // if(this.dataService.getPaketTypeIdByName(paketType)){
+ // this.paketTypesFilter.push(this.dataService.getPaketTypeIdByName(paketType));
+ // }
+
+ // }
+ // // this.paketTypesFilter = [...new Set(this.paketTypesFilter)];
+ // //console.log(this.paketTypesFilter);
+ // break;
+ default:
+ break;
+ }
}
- public onDateSelect(){
- console.log("################################")
- if(this.filterStartDate && this.filterEndDate){
+ public onDateSelect() {
+ if (this.range.controls['start'].value && this.range.controls['end'].value) {
this.DateEnabled = true;
- }else{
+ } else {
this.DateEnabled = false;
}
}
-
/**
* The function mapFilter builds a filterElement out of all the selected filters, delivers it back and closes the dialog
*/
- mapFilter(){
+ mapFilter() {
let filterElement = []
- if(this.paketTypesFilter.length > 0){
+ if (this.paketTypesFilter.length > 0) {
filterElement.push({
"column": "PackageType",
- "filter": "equals",
- "criteria": this.paketTypesFilter
- });
+ "filter": "equals",
+ "criteria": this.paketTypesFilter
+ });
}
-
- if(this.statesFilter.length > 0){
+ if (this.statesFilter.length > 0) {
filterElement.push({
"column": "State",
- "filter": "equals",
- "criteria": this.statesFilter
- });
+ "filter": "equals",
+ "criteria": this.statesFilter
+ });
}
-
-
- if(this.contractsFilter.length > 0){
+ if (this.contractsFilter.length > 0) {
filterElement.push({
"column": "Contract",
- "filter": "equals",
- "criteria": this.contractsFilter
- });
+ "filter": "equals",
+ "criteria": this.contractsFilter
+ });
}
- if(this.supportGroupsFilter.length > 0){
+ if (this.supportGroupsFilter.length > 0) {
filterElement.push({
"column": "SupportGroup",
- "filter": "equals",
- "criteria": this.supportGroupsFilter
- });
- //console.log(this.supportGroupsFilter);
- }else{
+ "filter": "equals",
+ "criteria": this.supportGroupsFilter
+ });
+ //console.log(this.supportGroupsFilter);
+ } else {
filterElement.push({
"column": "SupportGroup",
- "filter": "equals",
- "criteria": [this.userSupportGroup]
- });
+ "filter": "equals",
+ "criteria": [this.userSupportGroup]
+ });
}
- if(this.filterStartDate != null && this.filterEndDate != null){
+ if (this.range.controls['start'].value && this.range.controls['end'].value) {
filterElement.push({
"column": "D2",
- "filter": "dateRange",
- "criteria": [new Date(this.filterStartDate), new Date(this.filterEndDate)]
- });
+ "filter": "dateRange",
+ "criteria": [new Date(this.range.controls['start'].value), new Date(this.range.controls['end'].value)]
+ });
+ }
+
+ if (this.filterStartDate != null && this.filterEndDate != null) {
+ filterElement.push({
+ "column": "D2",
+ "filter": "dateRange",
+ "criteria": [new Date(this.filterStartDate), new Date(this.filterEndDate)]
+ });
}
- if(this.criteria != null && this.criteria != ""){
+ if (this.criteria != null && this.criteria != "") {
filterElement.push({
"column": "ResourceName",
- "filter": "contains",
- "criteria": [this.criteria]
- });
+ "filter": "contains",
+ "criteria": [this.criteria]
+ });
}
- if(this.intervallFilter){
+ if (this.intervallFilter) {
filterElement.push({
"column": "ASF_WI_HighestIntervall",
- "filter": ">",
- "criteria": [365]
- });
+ "filter": ">",
+ "criteria": [365]
+ });
}
- let filter = {filterElement: filterElement};
+ let filter = { filterElement: filterElement };
console.log(filter);
this.dialogRef.close(filter);
}