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

filterDialog Anpassung

main
manueltauber 2023-10-12 15:24:43 +02:00
parent 200bdcf8e0
commit ef7d840f82
6 changed files with 133 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -480,9 +480,9 @@ export class DataService {
* @returns true or false for a boolean flag
*/
private validateApproval(resp):boolean{
console.log(resp.changeNr);
console.log(resp.approvalStatus);
console.log('\n');
// console.log(resp.changeNr);
// console.log(resp.approvalStatus);
// console.log('\n');
if(resp.approvalStatus!=undefined && resp.approvalStatus!="0"){
return true;
}else{
@ -512,6 +512,30 @@ export class DataService {
}
return "";
}
public getContractNameByID(contractId){
for (let contract of this.contracts) {
if(contractId == contract.id){
return contract.name;
}
}
}
public getPaketTypeNameByID(paketTypeId){
for (let paketType of this.paketTypes) {
if(paketTypeId == paketType.id){
return paketType.name;
}
}
}
public getPaketTypeIdByName(paketTypeName){
for (let paketType of this.paketTypes) {
if(paketTypeName == paketType.name){
return paketType.id;
}
}
}
}

6
frontend/src/app/filter-dialog/filter-dialog.component.html
View File

@ -22,8 +22,7 @@
[placeholder]="userSupportGroup"
[data]="supportGroups"
[key]="'supportGroup'"
[appliedFilters]= "appliedFiltersSg"
[appliedFilters]= "prevFiltersSg"
(result)="onResult($event)">
</multiselect-autocomplete>
</mat-expansion-panel>
@ -37,6 +36,7 @@
[placeholder]="languageService.lMap.get('filterDilogSearchState')"
[data]="states"
[key]="'state'"
[appliedFilters]= "prevFiltersState"
(result)="onResult($event)">
</multiselect-autocomplete>
</mat-expansion-panel>
@ -50,6 +50,7 @@
[placeholder]="languageService.lMap.get('filterDilogSearchContract')"
[data]="contracts"
[key]="'contract'"
[appliedFilters]= "prevFiltersContract"
(result)="onResult($event)">
</multiselect-autocomplete>
</mat-expansion-panel>
@ -63,6 +64,7 @@
[placeholder]="languageService.lMap.get('filterDilogSearchPt')"
[data]="paketTypes"
[key]="'paketType'"
[appliedFilters]= "prevFiltersPaketType"
(result)="onResult($event)">
</multiselect-autocomplete>
</mat-expansion-panel>

112
frontend/src/app/filter-dialog/filter-dialog.component.ts
View File

@ -40,6 +40,8 @@ export class FilterDialogComponent implements OnInit {
public contracts: string[] = [];
public userSupportGroup: string;
public prevFilters: any[]=[];
public criteria: string;
public filterStartDate: Date;
public filterEndDate: Date;
@ -52,13 +54,13 @@ export class FilterDialogComponent implements OnInit {
public dateFilter = [];
public filterLabels: string[] = [];
public appliedFilterText: string;
public appliedFiltersSg: string[] = ["Vertrieb - Vertriebsstellenbetreuung Nord", "Vertrieb - Vertriebsstellenbetreuung West", "Vertrieb - Vertriebsstellenbetreuung Süd", "Vertrieb - Vertriebsstellenbetreuung Ost"];
public appliedFiltersStatus: string[] = ["Vertrieb - Vertriebsstellenbetreuung Nord", "Vertrieb - Vertriebsstellenbetreuung West", "Vertrieb - Vertriebsstellenbetreuung Süd", "Vertrieb - Vertriebsstellenbetreuung Ost"];
public appliedFiltersContract: string[] = ["Vertrieb - Vertriebsstellenbetreuung Nord", "Vertrieb - Vertriebsstellenbetreuung West", "Vertrieb - Vertriebsstellenbetreuung Süd", "Vertrieb - Vertriebsstellenbetreuung Ost"];
public appliedFiltersPaketType: string[] = ["Vertrieb - Vertriebsstellenbetreuung Nord", "Vertrieb - Vertriebsstellenbetreuung West", "Vertrieb - Vertriebsstellenbetreuung Süd", "Vertrieb - Vertriebsstellenbetreuung Ost"];
public appliedFilterDateFrom: Date;
public appliedFilterDateTo: Date;
public prevFilterText: string;
public prevFiltersSg: string[] = [];
public prevFiltersState: string[] = [];
public prevFiltersContract: string[] = [];
public prevFiltersPaketType: string[] = [];
public prevFilterDateFrom: Date;
public prevFilterDateTo: Date;
public filterObj;
@ -71,16 +73,71 @@ export class FilterDialogComponent implements OnInit {
*/
constructor(public languageService: LanguageService, public dialogRef: MatDialogRef<FilterDialogComponent>, @Inject(MAT_DIALOG_DATA) public data: any, private dataService: DataService, private _snackBar: MatSnackBar) {
//dialogRef.beforeClosed().subscribe(() => dialogRef.close(this.dataToReturn));
if(data[0].filters){
////console.log(data[0].filters.filterElement);
this.prevFilters = data[0].filters.filterElement;
}
if(data[0].userSg){
this.userSupportGroup = data[0].userSg;
}
}
/**
* The function ngOnInit initialized the component by fetching all relevant data via the dataService
*/
ngOnInit(): void {
console.log(this.prevFilters);
if(this.prevFilters.length > 0){
for (const filter of this.prevFilters) {
//console.log(filter);
if(filter.column == "SupportGroup"){
//console.log(filter);
this.prevFiltersSg = filter.criteria;
}
if(filter.column == "State"){
//console.log(filter);
if(this.languageService.language == "DE"){
for (const crit of filter.criteria) {
this.prevFiltersState.push(this.dataService.getStates().find((item)=> {return item.stateNameEN == crit;}).stateNameDE);
}
}else{
this.prevFiltersState = filter.criteria;
}
}
if(filter.column == "Contract"){
//console.log(filter);
for (const crit of filter.criteria) {
this.prevFiltersContract.push(this.dataService.getContractName(crit));
}
//this.prevFiltersContract = filter.criteria;
}
if(filter.column == "PackageType"){
//console.log("FFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFFF");
//console.log(this.dataService.getPaketTypes());
for (const crit of filter.criteria) {
console.log(crit);
this.prevFiltersPaketType.push(this.dataService.getPaketTypeNameByID(crit));
}
console.log(this.prevFiltersPaketType);
//this.prevFiltersPaketType = filter.criteria;
}
}
}
if(this.prevFiltersSg.length == 0){
this.prevFiltersSg[0] = this.userSupportGroup;
}
this.dataService.fetchUserSupportGroup().then((res:any)=>{
this.userSupportGroup = res.name;
});
console.log(this.userSupportGroup);
//console.log(this.userSupportGroup);
if(this.languageService.language == 'DE'){
for (const state of this.dataService.getStates()) {
this.states.push(state.stateNameDE);
@ -108,55 +165,62 @@ export class FilterDialogComponent implements OnInit {
* @param event selection event from the multiselect-autocomplete-component
*/
onResult(event: any) {
console.log(event);
//console.log(event);
switch (event.key) {
case 'supportGroup':
this.supportGroupsFilter = event.data;
this.supportGroupsFilter = [...new Set(this.supportGroupsFilter)];
break;
case 'state':
if(this.languageService.language == 'DE'){
console.log(event.data);
//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);
// //console.log(this.statesFilter);
}
}else{
console.log(event.data);
//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);
// //console.log(this.statesFilter);
}
}
this.statesFilter = [...new Set(this.statesFilter)];
//console.log(this.statesFilter);
break;
case 'contract':
case 'contract':
//this.contractsFilter = event.data;
console.log(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);
}
console.log(this.contractsFilter);
}
//this.contractsFilter = [...new Set(this.contractsFilter)];
//console.log(this.contractsFilter);
break;
case 'paketType':
case 'paketType':
//this.paketTypesFilter = event.data;
console.log(event.data);
this.paketTypesFilter = [];
//console.log(event.data);
for (const paketType of event.data) {
if(this.dataService.getPaketTypes().find((item)=> {return item.name == paketType;})){
this.paketTypesFilter.push(this.dataService.getPaketTypes().find((item)=> {return item.name == paketType;}).id);
if(this.dataService.getPaketTypeIdByName(paketType)){
this.paketTypesFilter.push(this.dataService.getPaketTypeIdByName(paketType));
}
console.log(this.paketTypesFilter);
}
// this.paketTypesFilter = [...new Set(this.paketTypesFilter)];
//console.log(this.paketTypesFilter);
break;
default:
break;
}
}
/**
@ -194,7 +258,7 @@ export class FilterDialogComponent implements OnInit {
      "filter": "equals",
      "criteria": this.supportGroupsFilter
});
console.log(this.supportGroupsFilter);
//console.log(this.supportGroupsFilter);
}else{
filterElement.push({
"column": "SupportGroup",

4
frontend/src/app/multiselect-autocomplete/multiselect-autocomplete.component.html
View File

@ -1,12 +1,14 @@
<div class="chip-list-wrapper">
<mat-chip-list #chipList>
<ng-container *ngFor="let select of selectData">
<ng-container *ngFor="let select of selectData | slice:0:20; let i =index">
<mat-chip class="cardinal-colors" (click)="removeChip(select)" style="background-color: #00a79d;">
{{ select.item }}
<mat-icon class="mat-chip-remove">cancel</mat-icon>
</mat-chip>
</ng-container>
<mat-chip *ngIf="selectData.length>20" class="cardinal-colors" style="background-color: #00a79d;">... {{selectData.length-20}} weitere
</mat-chip>
</mat-chip-list>
</div>

18
frontend/src/app/multiselect-autocomplete/multiselect-autocomplete.component.ts
View File

@ -5,7 +5,6 @@ import { Observable } from 'rxjs';
import { map, startWith } from 'rxjs/operators';
​
export interface ItemData {
item: string;
selected: boolean;
@ -54,8 +53,6 @@ export class MultiselectAutocompleteComponent implements OnInit {
* The function ngOnInit imports the data (filter options) and maps it
*/
ngOnInit(): void {
this.data.forEach((item: string) => {
this.rawData.push({ item, selected: false });
});
@ -75,12 +72,14 @@ export class MultiselectAutocompleteComponent implements OnInit {
for (const filter of this.appliedFilters) {
for (const item of this.rawData) {
if(item.item == filter){
console.log("MATCH"+item.item);
item.selected = true;
this.toggleSelection({'item': filter, selected: false});
}
}
}
}
console.log(this.selectData);
this.evaluateIndeterminate();
}
@ -116,8 +115,8 @@ export class MultiselectAutocompleteComponent implements OnInit {
* it builds the base for many filter select option
*/
toggleSelection = (data: ItemData): void => {
console.log(data);
console.log(this.selectData);
//console.log(data);
//console.log(this.selectData);
data.selected = !data.selected;
if (data.selected === true) {
this.selectData.push(data);
@ -146,7 +145,8 @@ export class MultiselectAutocompleteComponent implements OnInit {
* The removeChip removes a option from the selection list if the user presses the remove button on the chip list
*/
removeChip = (data: ItemData): void => {
this.toggleSelection(data);
let dat = {item: data.item, selected: true};
this.toggleSelection(dat);
for (const rawItem of this.rawData) {
if(data.item == rawItem.item){
rawItem.selected = false;
@ -157,7 +157,7 @@ export class MultiselectAutocompleteComponent implements OnInit {
public toggleAll(): void{
this.allSelected = !this.allSelected;
if(this.allSelected == false){
console.log('####false'+this.allSelected);
//console.log('####false'+this.allSelected);
for (const item of this.rawData) {
item.selected = false;
@ -170,7 +170,7 @@ export class MultiselectAutocompleteComponent implements OnInit {
}
this.emitAdjustedData();
}else{
console.log('####true'+this.allSelected);
//console.log('####true'+this.allSelected);
for (const item of this.rawData) {
item.selected = true;
@ -189,7 +189,7 @@ export class MultiselectAutocompleteComponent implements OnInit {
public showCheckBox(): void{
this.showCheckbox = true;
console.log("####")
//console.log("####")
}
public hideCheckBox(): void{
this.showCheckbox = false;

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

@ -305,9 +305,10 @@ export class NttGanttComponent implements OnInit {
* This function is triggered by the filter button.
*/
openFilterDialog(){
console.log(this.filters);
let dialogRef = FilterDialogComponent;
this.matDialog.open(dialogRef,
{data : [], width: '50%', maxWidth: '800px'}).afterClosed().subscribe((res)=>{
{data : [{filters: this.filters, userSg: this.userSupportGroup}], width: '50%', maxWidth: '800px'}).afterClosed().subscribe((res)=>{
if(res){
this.filters = res;
this.filterEnabled = true;