ui fixes on listing screens > filters
This commit is contained in:
parent
e43327a86c
commit
5268051a0d
|
@ -7,32 +7,47 @@
|
||||||
|
|
||||||
|
|
||||||
<mat-menu #filterMenu>
|
<mat-menu #filterMenu>
|
||||||
<div class="p-3" (click)="$event?.stopPropagation?.()">
|
<div class="container-fluid" (click)="$event?.stopPropagation?.()">
|
||||||
<div class="search-listing-filters-container">
|
<div class="row justify-content-between">
|
||||||
<div class="d-flex align-items-center justify-content-between">
|
<div class="col-auto mt-2">
|
||||||
<h4>{{'DESCRIPTION-TEMPLATE-LISTING.FILTER.TITLE' | translate}}</h4>
|
<h4>{{'DESCRIPTION-TEMPLATE-LISTING.FILTER.TITLE' | translate}}</h4>
|
||||||
|
</div>
|
||||||
|
<div class="col-auto">
|
||||||
<button color="accent" mat-button (click)="clearFilters()">
|
<button color="accent" mat-button (click)="clearFilters()">
|
||||||
{{'COMMONS.LISTING-COMPONENT.CLEAR-ALL-FILTERS' | translate}}
|
{{'COMMONS.LISTING-COMPONENT.CLEAR-ALL-FILTERS' | translate}}
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<mat-slide-toggle labelPosition="before" [(ngModel)]="internalFilters.isActive">
|
<div class="row mt-3">
|
||||||
{{'DESCRIPTION-TEMPLATE-LISTING.FILTER.IS-ACTIVE' | translate}}
|
<div class="col-12">
|
||||||
</mat-slide-toggle>
|
<section class="w-100">
|
||||||
|
<mat-slide-toggle labelPosition="before" [(ngModel)]="internalFilters.isActive">
|
||||||
|
{{'DESCRIPTION-TEMPLATE-LISTING.FILTER.IS-ACTIVE' | translate}}
|
||||||
|
</mat-slide-toggle>
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div>
|
<div class="row mt-3">
|
||||||
<mat-label>{{'DESCRIPTION-TEMPLATE-LISTING.FILTER.STATUS' | translate}}
|
<div class="col-12">
|
||||||
|
<mat-form-field class="w-100">
|
||||||
|
<mat-label>{{'DESCRIPTION-TEMPLATE-LISTING.FILTER.STATUS' | translate}}</mat-label>
|
||||||
<mat-select multiple [(ngModel)]="internalFilters.statuses">
|
<mat-select multiple [(ngModel)]="internalFilters.statuses">
|
||||||
<mat-option *ngFor="let descriptionTemplateStatus of descriptionTemplateStatusEnumValues" [value]="descriptionTemplateStatus">{{enumUtils.toDescriptionTemplateTypeStatusString(descriptionTemplateStatus)}}</mat-option>
|
<mat-option *ngFor="let descriptionTemplateStatus of descriptionTemplateStatusEnumValues" [value]="descriptionTemplateStatus">{{enumUtils.toDescriptionTemplateTypeStatusString(descriptionTemplateStatus)}}</mat-option>
|
||||||
</mat-select>
|
</mat-select>
|
||||||
</mat-label>
|
</mat-form-field>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div class="d-flex justify-content-end align-items-center mt-4 gap-1-rem">
|
<div class="row justify-content-end align-items-center mt-4 mb-1 gap-1-rem">
|
||||||
<button mat-stroked-button color="primary" (click)="filterMenuTrigger?.closeMenu()">
|
<div class="col-auto">
|
||||||
|
<button class="normal-btn-light-sm" (click)="filterMenuTrigger?.closeMenu()">
|
||||||
{{'DESCRIPTION-TEMPLATE-LISTING.FILTER.CANCEL' | translate}}
|
{{'DESCRIPTION-TEMPLATE-LISTING.FILTER.CANCEL' | translate}}
|
||||||
</button>
|
</button>
|
||||||
<button mat-raised-button color="primary" (click)="filterMenuTrigger.closeMenu(); applyFilters();">
|
</div>
|
||||||
|
<div class="col-auto">
|
||||||
|
<button class="normal-btn-sm" (click)="filterMenuTrigger.closeMenu(); applyFilters();">
|
||||||
{{'DESCRIPTION-TEMPLATE-LISTING.FILTER.APPLY-FILTERS' | translate}}
|
{{'DESCRIPTION-TEMPLATE-LISTING.FILTER.APPLY-FILTERS' | translate}}
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -22,4 +22,8 @@
|
||||||
// }
|
// }
|
||||||
}
|
}
|
||||||
|
|
||||||
|
::ng-deep .mdc-form-field {
|
||||||
|
label {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
|
@ -7,32 +7,47 @@
|
||||||
|
|
||||||
|
|
||||||
<mat-menu #filterMenu>
|
<mat-menu #filterMenu>
|
||||||
<div class="p-3" (click)="$event?.stopPropagation?.()">
|
<div class="container-fluid" (click)="$event?.stopPropagation?.()">
|
||||||
<div class="search-listing-filters-container">
|
<div class="row justify-content-between">
|
||||||
<div class="d-flex align-items-center justify-content-between">
|
<div class="col-auto mt-2">
|
||||||
<h4>{{'DESCRIPTION-TEMPLATE-TYPE-LISTING.FILTER.TITLE' | translate}}</h4>
|
<h4>{{'DESCRIPTION-TEMPLATE-TYPE-LISTING.FILTER.TITLE' | translate}}</h4>
|
||||||
|
</div>
|
||||||
|
<div class="col-auto">
|
||||||
<button color="accent" mat-button (click)="clearFilters()">
|
<button color="accent" mat-button (click)="clearFilters()">
|
||||||
{{'DESCRIPTION-TEMPLATE-TYPE-LISTING.FILTER.CLEAR-ALL-FILTERS' | translate}}
|
{{'DESCRIPTION-TEMPLATE-TYPE-LISTING.FILTER.CLEAR-ALL-FILTERS' | translate}}
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<mat-slide-toggle labelPosition="before" [(ngModel)]="internalFilters.isActive">
|
<div class="row mt-3">
|
||||||
{{'DESCRIPTION-TEMPLATE-TYPE-LISTING.FILTER.IS-ACTIVE' | translate}}
|
<div class="col-12">
|
||||||
</mat-slide-toggle>
|
<section class="w-100">
|
||||||
|
<mat-slide-toggle labelPosition="before" [(ngModel)]="internalFilters.isActive">
|
||||||
|
{{'DESCRIPTION-TEMPLATE-TYPE-LISTING.FILTER.IS-ACTIVE' | translate}}
|
||||||
|
</mat-slide-toggle>
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div>
|
<div class="row mt-3">
|
||||||
<mat-label>{{'DESCRIPTION-TEMPLATE-TYPE-LISTING.FILTER.STATUS' | translate}}
|
<div class="col-12">
|
||||||
|
<mat-form-field class="w-100">
|
||||||
|
<mat-label>{{'DESCRIPTION-TEMPLATE-TYPE-LISTING.FILTER.STATUS' | translate}}</mat-label>
|
||||||
<mat-select multiple [(ngModel)]="internalFilters.statuses">
|
<mat-select multiple [(ngModel)]="internalFilters.statuses">
|
||||||
<mat-option *ngFor="let descriptionTemplateTypeStatus of descriptionTemplateTypeStatusEnumValues" [value]="descriptionTemplateTypeStatus">{{enumUtils.toDescriptionTemplateTypeStatusString(descriptionTemplateTypeStatus)}}</mat-option>
|
<mat-option *ngFor="let descriptionTemplateTypeStatus of descriptionTemplateTypeStatusEnumValues" [value]="descriptionTemplateTypeStatus">{{enumUtils.toDescriptionTemplateTypeStatusString(descriptionTemplateTypeStatus)}}</mat-option>
|
||||||
</mat-select>
|
</mat-select>
|
||||||
</mat-label>
|
</mat-form-field>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div class="d-flex justify-content-end align-items-center mt-4 gap-1-rem">
|
<div class="row justify-content-end align-items-center mt-4 mb-1 gap-1-rem">
|
||||||
<button mat-stroked-button color="primary" (click)="filterMenuTrigger?.closeMenu()">
|
<div class="col-auto">
|
||||||
|
<button class="normal-btn-light-sm" (click)="filterMenuTrigger?.closeMenu()">
|
||||||
{{'DESCRIPTION-TEMPLATE-TYPE-LISTING.FILTER.CANCEL' | translate}}
|
{{'DESCRIPTION-TEMPLATE-TYPE-LISTING.FILTER.CANCEL' | translate}}
|
||||||
</button>
|
</button>
|
||||||
<button mat-raised-button color="primary" (click)="filterMenuTrigger.closeMenu(); applyFilters();">
|
</div>
|
||||||
|
<div class="col-auto">
|
||||||
|
<button class="normal-btn-sm" (click)="filterMenuTrigger.closeMenu(); applyFilters();">
|
||||||
{{'DESCRIPTION-TEMPLATE-TYPE-LISTING.FILTER.APPLY-FILTERS' | translate}}
|
{{'DESCRIPTION-TEMPLATE-TYPE-LISTING.FILTER.APPLY-FILTERS' | translate}}
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -22,4 +22,8 @@
|
||||||
// }
|
// }
|
||||||
}
|
}
|
||||||
|
|
||||||
|
::ng-deep .mdc-form-field {
|
||||||
|
label {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
|
@ -39,7 +39,7 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="row justify-content-end align-items-center mt-4 gap-1-rem">
|
<div class="row justify-content-end align-items-center mt-4 mb-1 gap-1-rem">
|
||||||
<div class="col-auto">
|
<div class="col-auto">
|
||||||
<button class="normal-btn-light-sm" (click)="filterMenuTrigger?.closeMenu()">
|
<button class="normal-btn-light-sm" (click)="filterMenuTrigger?.closeMenu()">
|
||||||
{{'DMP-BLUEPRINT-LISTING.FILTER.CANCEL' | translate}}
|
{{'DMP-BLUEPRINT-LISTING.FILTER.CANCEL' | translate}}
|
||||||
|
|
|
@ -7,39 +7,47 @@
|
||||||
|
|
||||||
|
|
||||||
<mat-menu #filterMenu>
|
<mat-menu #filterMenu>
|
||||||
<div class="p-3" (click)="$event?.stopPropagation?.()">
|
<div class="container-fluid" (click)="$event?.stopPropagation?.()">
|
||||||
<div class="search-listing-filters-container">
|
<div class="row justify-content-between">
|
||||||
<div class="d-flex align-items-center justify-content-between">
|
<div class="col-auto mt-2">
|
||||||
<h4>{{'LOCK-LISTING.FILTER.TITLE' | translate}}</h4>
|
<h4>{{'LOCK-LISTING.FILTER.TITLE' | translate}}</h4>
|
||||||
|
</div>
|
||||||
|
<div class="col-auto">
|
||||||
<button color="accent" mat-button (click)="clearFilters()">
|
<button color="accent" mat-button (click)="clearFilters()">
|
||||||
{{'COMMONS.LISTING-COMPONENT.CLEAR-ALL-FILTERS' | translate}}
|
{{'COMMONS.LISTING-COMPONENT.CLEAR-ALL-FILTERS' | translate}}
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div class="mt-4">
|
<div class="row mt-3">
|
||||||
<div>
|
<div class="col-12">
|
||||||
<mat-form-field class="col-12">
|
<mat-form-field class="w-100">
|
||||||
<mat-label>{{'LOCK-LISTING.FILTER.USERS' | translate}}</mat-label>
|
<mat-label>{{'LOCK-LISTING.FILTER.USERS' | translate}}</mat-label>
|
||||||
<app-multiple-auto-complete [(ngModel)]="internalFilters.userIds" [hidePlaceholder]="true" [separatorKeysCodes]="separatorKeysCodes" [configuration]="userService.multipleAutocompleteConfiguration">
|
<app-multiple-auto-complete [(ngModel)]="internalFilters.userIds" [hidePlaceholder]="true" [separatorKeysCodes]="separatorKeysCodes" [configuration]="userService.multipleAutocompleteConfiguration">
|
||||||
</app-multiple-auto-complete>
|
</app-multiple-auto-complete>
|
||||||
</mat-form-field>
|
</mat-form-field>
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<mat-form-field class="col-12">
|
|
||||||
<mat-label>{{'LOCK-LISTING.FILTER.TARGET-TYPE' | translate}}
|
|
||||||
<mat-select multiple [(ngModel)]="internalFilters.targetTypes">
|
|
||||||
<mat-option *ngFor="let targetType of lockTargetTypeEnumValues" [value]="targetType">{{enumUtils.toLockTargetTypeString(targetType)}}</mat-option>
|
|
||||||
</mat-select>
|
|
||||||
</mat-label>
|
|
||||||
</mat-form-field>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div class="d-flex justify-content-between mt-4 gap-1-rem">
|
<div class="row mt-3">
|
||||||
<button mat-stroked-button color="primary" (click)="filterMenuTrigger?.closeMenu()">
|
<div class="col-12">
|
||||||
|
<mat-form-field class="w-100">
|
||||||
|
<mat-label>{{'LOCK-LISTING.FILTER.TARGET-TYPE' | translate}}</mat-label>
|
||||||
|
<mat-select multiple [(ngModel)]="internalFilters.targetTypes">
|
||||||
|
<mat-option *ngFor="let targetType of lockTargetTypeEnumValues" [value]="targetType">{{enumUtils.toLockTargetTypeString(targetType)}}</mat-option>
|
||||||
|
</mat-select>
|
||||||
|
</mat-form-field>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="row justify-content-between mt-4 mb-1 gap-1-rem">
|
||||||
|
<div class="col-auto">
|
||||||
|
<button class="normal-btn-light-sm" (click)="filterMenuTrigger?.closeMenu()">
|
||||||
{{'LOCK-LISTING.FILTER.CANCEL' | translate}}
|
{{'LOCK-LISTING.FILTER.CANCEL' | translate}}
|
||||||
</button>
|
</button>
|
||||||
<button mat-raised-button color="primary" (click)="filterMenuTrigger.closeMenu(); applyFilters();">
|
</div>
|
||||||
|
<div class="col-auto">
|
||||||
|
<button class="normal-btn-sm" (click)="filterMenuTrigger.closeMenu(); applyFilters();">
|
||||||
{{'LOCK-LISTING.FILTER.APPLY-FILTERS' | translate}}
|
{{'LOCK-LISTING.FILTER.APPLY-FILTERS' | translate}}
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -17,5 +17,3 @@
|
||||||
// height: 1.2em;
|
// height: 1.2em;
|
||||||
// }
|
// }
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
|
@ -7,24 +7,36 @@
|
||||||
|
|
||||||
|
|
||||||
<mat-menu #filterMenu>
|
<mat-menu #filterMenu>
|
||||||
<div class="p-3" (click)="$event?.stopPropagation?.()">
|
<div class="container-fluid" (click)="$event?.stopPropagation?.()">
|
||||||
<div class="search-listing-filters-container">
|
<div class="row justify-content-between">
|
||||||
<div class="d-flex align-items-center justify-content-between">
|
<div class="col-auto mt-2">
|
||||||
<h4>{{'LANGUAGE-LISTING.FILTER.TITLE' | translate}}</h4>
|
<h4>{{'LANGUAGE-LISTING.FILTER.TITLE' | translate}}</h4>
|
||||||
|
</div>
|
||||||
|
<div class="col-auto">
|
||||||
<button color="accent" mat-button (click)="clearFilters()">
|
<button color="accent" mat-button (click)="clearFilters()">
|
||||||
{{'COMMONS.LISTING-COMPONENT.CLEAR-ALL-FILTERS' | translate}}
|
{{'COMMONS.LISTING-COMPONENT.CLEAR-ALL-FILTERS' | translate}}
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<mat-slide-toggle labelPosition="before" [(ngModel)]="internalFilters.isActive">
|
<div class="row mt-3">
|
||||||
{{'LANGUAGE-LISTING.FILTER.IS-ACTIVE' | translate}}
|
<div class="col-12">
|
||||||
</mat-slide-toggle>
|
<section class="w-100">
|
||||||
|
<mat-slide-toggle labelPosition="before" [(ngModel)]="internalFilters.isActive">
|
||||||
|
{{'LANGUAGE-LISTING.FILTER.IS-ACTIVE' | translate}}
|
||||||
|
</mat-slide-toggle>
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div class="d-flex justify-content-end align-items-center mt-4 gap-1-rem">
|
<div class="row justify-content-end align-items-center mt-4 mb-1 gap-1-rem">
|
||||||
<button mat-stroked-button color="primary" (click)="filterMenuTrigger?.closeMenu()">
|
<div class="col-auto">
|
||||||
|
<button class="normal-btn-light-sm" (click)="filterMenuTrigger?.closeMenu()">
|
||||||
{{'LANGUAGE-LISTING.FILTER.CANCEL' | translate}}
|
{{'LANGUAGE-LISTING.FILTER.CANCEL' | translate}}
|
||||||
</button>
|
</button>
|
||||||
<button mat-raised-button color="primary" (click)="filterMenuTrigger.closeMenu(); applyFilters();">
|
</div>
|
||||||
|
<div class="col-auto">
|
||||||
|
<button class="normal-btn-sm" (click)="filterMenuTrigger.closeMenu(); applyFilters();">
|
||||||
{{'LANGUAGE-LISTING.FILTER.APPLY-FILTERS' | translate}}
|
{{'LANGUAGE-LISTING.FILTER.APPLY-FILTERS' | translate}}
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -18,4 +18,8 @@
|
||||||
// }
|
// }
|
||||||
}
|
}
|
||||||
|
|
||||||
|
::ng-deep .mdc-form-field {
|
||||||
|
label {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
|
@ -7,24 +7,36 @@
|
||||||
|
|
||||||
|
|
||||||
<mat-menu #filterMenu>
|
<mat-menu #filterMenu>
|
||||||
<div class="p-3" (click)="$event?.stopPropagation?.()">
|
<div class="container-fluid" (click)="$event?.stopPropagation?.()">
|
||||||
<div class="search-listing-filters-container">
|
<div class="row justify-content-between">
|
||||||
<div class="d-flex align-items-center justify-content-between">
|
<div class="col-auto mt-2">
|
||||||
<h4>{{'PREFILLING-SOURCE-LISTING.FILTER.TITLE' | translate}}</h4>
|
<h4>{{'PREFILLING-SOURCE-LISTING.FILTER.TITLE' | translate}}</h4>
|
||||||
|
</div>
|
||||||
|
<div class="col-auto">
|
||||||
<button color="accent" mat-button (click)="clearFilters()">
|
<button color="accent" mat-button (click)="clearFilters()">
|
||||||
{{'COMMONS.LISTING-COMPONENT.CLEAR-ALL-FILTERS' | translate}}
|
{{'COMMONS.LISTING-COMPONENT.CLEAR-ALL-FILTERS' | translate}}
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<mat-slide-toggle labelPosition="before" [(ngModel)]="internalFilters.isActive">
|
<div class="row mt-3">
|
||||||
{{'PREFILLING-SOURCE-LISTING.FILTER.IS-ACTIVE' | translate}}
|
<div class="col-12">
|
||||||
</mat-slide-toggle>
|
<section class="w-100">
|
||||||
|
<mat-slide-toggle labelPosition="before" [(ngModel)]="internalFilters.isActive">
|
||||||
|
{{'PREFILLING-SOURCE-LISTING.FILTER.IS-ACTIVE' | translate}}
|
||||||
|
</mat-slide-toggle>
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div class="d-flex justify-content-end align-items-center mt-4 gap-1-rem">
|
<div class="row justify-content-end align-items-center mt-4 mb-1 gap-1-rem">
|
||||||
<button mat-stroked-button color="primary" (click)="filterMenuTrigger?.closeMenu()">
|
<div class="col-auto">
|
||||||
|
<button class="normal-btn-light-sm" (click)="filterMenuTrigger?.closeMenu()">
|
||||||
{{'PREFILLING-SOURCE-LISTING.FILTER.CANCEL' | translate}}
|
{{'PREFILLING-SOURCE-LISTING.FILTER.CANCEL' | translate}}
|
||||||
</button>
|
</button>
|
||||||
<button mat-raised-button color="primary" (click)="filterMenuTrigger.closeMenu(); applyFilters();">
|
</div>
|
||||||
|
<div class="col-auto">
|
||||||
|
<button class="normal-btn-sm" (click)="filterMenuTrigger.closeMenu(); applyFilters();">
|
||||||
{{'PREFILLING-SOURCE-LISTING.FILTER.APPLY-FILTERS' | translate}}
|
{{'PREFILLING-SOURCE-LISTING.FILTER.APPLY-FILTERS' | translate}}
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -22,4 +22,8 @@
|
||||||
// }
|
// }
|
||||||
}
|
}
|
||||||
|
|
||||||
|
::ng-deep .mdc-form-field {
|
||||||
|
label {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
|
@ -7,24 +7,36 @@
|
||||||
|
|
||||||
|
|
||||||
<mat-menu #filterMenu>
|
<mat-menu #filterMenu>
|
||||||
<div class="p-3" (click)="$event?.stopPropagation?.()">
|
<div class="container-fluid" (click)="$event?.stopPropagation?.()">
|
||||||
<div class="search-listing-filters-container">
|
<div class="row justify-content-between">
|
||||||
<div class="d-flex align-items-center justify-content-between">
|
<div class="col-auto mt-2">
|
||||||
<h4>{{'REFERENCE-TYPE-LISTING.FILTER.TITLE' | translate}}</h4>
|
<h4>{{'REFERENCE-TYPE-LISTING.FILTER.TITLE' | translate}}</h4>
|
||||||
|
</div>
|
||||||
|
<div class="col-auto">
|
||||||
<button color="accent" mat-button (click)="clearFilters()">
|
<button color="accent" mat-button (click)="clearFilters()">
|
||||||
{{'COMMONS.LISTING-COMPONENT.CLEAR-ALL-FILTERS' | translate}}
|
{{'COMMONS.LISTING-COMPONENT.CLEAR-ALL-FILTERS' | translate}}
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<mat-slide-toggle labelPosition="before" [(ngModel)]="internalFilters.isActive">
|
<div class="row mt-3">
|
||||||
{{'REFERENCE-TYPE-LISTING.FILTER.IS-ACTIVE' | translate}}
|
<div class="col-12">
|
||||||
</mat-slide-toggle>
|
<section class="w-100">
|
||||||
|
<mat-slide-toggle labelPosition="before" [(ngModel)]="internalFilters.isActive">
|
||||||
|
{{'REFERENCE-TYPE-LISTING.FILTER.IS-ACTIVE' | translate}}
|
||||||
|
</mat-slide-toggle>
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div class="d-flex justify-content-end align-items-center mt-4 gap-1-rem">
|
<div class="row justify-content-end align-items-center mt-4 mb-1 gap-1-rem">
|
||||||
<button mat-stroked-button color="primary" (click)="filterMenuTrigger?.closeMenu()">
|
<div class="col-auto">
|
||||||
|
<button class="normal-btn-light-sm" (click)="filterMenuTrigger?.closeMenu()">
|
||||||
{{'REFERENCE-TYPE-LISTING.FILTER.CANCEL' | translate}}
|
{{'REFERENCE-TYPE-LISTING.FILTER.CANCEL' | translate}}
|
||||||
</button>
|
</button>
|
||||||
<button mat-raised-button color="primary" (click)="filterMenuTrigger.closeMenu(); applyFilters();">
|
</div>
|
||||||
|
<div class="col-auto">
|
||||||
|
<button class="normal-btn-sm" (click)="filterMenuTrigger.closeMenu(); applyFilters();">
|
||||||
{{'REFERENCE-TYPE-LISTING.FILTER.APPLY-FILTERS' | translate}}
|
{{'REFERENCE-TYPE-LISTING.FILTER.APPLY-FILTERS' | translate}}
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -22,4 +22,8 @@
|
||||||
// }
|
// }
|
||||||
}
|
}
|
||||||
|
|
||||||
|
::ng-deep .mdc-form-field {
|
||||||
|
label {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
|
@ -7,39 +7,58 @@
|
||||||
|
|
||||||
|
|
||||||
<mat-menu #filterMenu>
|
<mat-menu #filterMenu>
|
||||||
<div class="p-3" (click)="$event?.stopPropagation?.()">
|
<div class="container-fluid" (click)="$event?.stopPropagation?.()">
|
||||||
<div class="search-listing-filters-container">
|
<div class="row justify-content-between">
|
||||||
<div class="d-flex align-items-center justify-content-between">
|
<div class="col-auto mt-2">
|
||||||
<h4>{{'REFERENCE-LISTING.FILTER.TITLE' | translate}}</h4>
|
<h4>{{'REFERENCE-LISTING.FILTER.TITLE' | translate}}</h4>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="col-auto">
|
||||||
<button color="accent" mat-button (click)="clearFilters()">
|
<button color="accent" mat-button (click)="clearFilters()">
|
||||||
{{'COMMONS.LISTING-COMPONENT.CLEAR-ALL-FILTERS' | translate}}
|
{{'COMMONS.LISTING-COMPONENT.CLEAR-ALL-FILTERS' | translate}}
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<mat-slide-toggle labelPosition="before" [(ngModel)]="internalFilters.isActive">
|
<div class="row mt-3">
|
||||||
{{'REFERENCE-LISTING.FILTER.IS-ACTIVE' | translate}}
|
<div class="col-12">
|
||||||
</mat-slide-toggle>
|
<section class="w-100">
|
||||||
|
<mat-slide-toggle labelPosition="before" [(ngModel)]="internalFilters.isActive">
|
||||||
|
{{'REFERENCE-LISTING.FILTER.IS-ACTIVE' | translate}}
|
||||||
|
</mat-slide-toggle>
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div>
|
<div class="row mt-3">
|
||||||
<mat-label>{{'REFERENCE-LISTING.FILTER.TYPE' | translate}}
|
<div class="col-12">
|
||||||
|
<mat-form-field class="w-100">
|
||||||
|
<mat-label>{{'REFERENCE-LISTING.FILTER.TYPE' | translate}}</mat-label>
|
||||||
<app-single-auto-complete [(ngModel)]="internalFilters.typeIds" placeholder="{{'REFERENCE-LISTING.FILTER.TYPE' | translate}}" [configuration]="referenceTypeService.singleAutocompleteConfiguration">
|
<app-single-auto-complete [(ngModel)]="internalFilters.typeIds" placeholder="{{'REFERENCE-LISTING.FILTER.TYPE' | translate}}" [configuration]="referenceTypeService.singleAutocompleteConfiguration">
|
||||||
</app-single-auto-complete>
|
</app-single-auto-complete>
|
||||||
</mat-label>
|
</mat-form-field>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div>
|
<div class="row mt-3">
|
||||||
<mat-label>{{'REFERENCE-LISTING.FILTER.SOURCE-TYPE' | translate}}
|
<div class="col-12">
|
||||||
|
<mat-form-field class="w-100">
|
||||||
|
<mat-label>{{'REFERENCE-LISTING.FILTER.SOURCE-TYPE' | translate}}</mat-label>
|
||||||
<mat-select multiple [(ngModel)]="internalFilters.sourceTypes">
|
<mat-select multiple [(ngModel)]="internalFilters.sourceTypes">
|
||||||
<mat-option *ngFor="let referenceSourceType of referenceSourceTypeEnumValues" [value]="referenceSourceType">{{enumUtils.toReferenceSourceTypeString(referenceSourceType)}}</mat-option>
|
<mat-option *ngFor="let referenceSourceType of referenceSourceTypeEnumValues" [value]="referenceSourceType">{{enumUtils.toReferenceSourceTypeString(referenceSourceType)}}</mat-option>
|
||||||
</mat-select>
|
</mat-select>
|
||||||
</mat-label>
|
</mat-form-field>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div class="d-flex justify-content-end align-items-center mt-4 gap-1-rem">
|
<div class="row justify-content-end align-items-center mt-4 mb-1 gap-1-rem">
|
||||||
<button mat-stroked-button color="primary" (click)="filterMenuTrigger?.closeMenu()">
|
<div class="col-auto">
|
||||||
|
<button class="normal-btn-light-sm" (click)="filterMenuTrigger?.closeMenu()">
|
||||||
{{'REFERENCE-LISTING.FILTER.CANCEL' | translate}}
|
{{'REFERENCE-LISTING.FILTER.CANCEL' | translate}}
|
||||||
</button>
|
</button>
|
||||||
<button mat-raised-button color="primary" (click)="filterMenuTrigger.closeMenu(); applyFilters();">
|
</div>
|
||||||
|
<div class="col-auto">
|
||||||
|
<button class="normal-btn-sm" (click)="filterMenuTrigger.closeMenu(); applyFilters();">
|
||||||
{{'REFERENCE-LISTING.FILTER.APPLY-FILTERS' | translate}}
|
{{'REFERENCE-LISTING.FILTER.APPLY-FILTERS' | translate}}
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -18,4 +18,8 @@
|
||||||
// }
|
// }
|
||||||
}
|
}
|
||||||
|
|
||||||
|
::ng-deep .mdc-form-field {
|
||||||
|
label {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
|
@ -7,24 +7,36 @@
|
||||||
|
|
||||||
|
|
||||||
<mat-menu #filterMenu>
|
<mat-menu #filterMenu>
|
||||||
<div class="p-3" (click)="$event?.stopPropagation?.()">
|
<div class="container-fluid" (click)="$event?.stopPropagation?.()">
|
||||||
<div class="search-listing-filters-container">
|
<div class="row justify-content-between">
|
||||||
<div class="d-flex align-items-center justify-content-between">
|
<div class="col-auto mt-2">
|
||||||
<h4>{{'TENANT-LISTING.FILTER.TITLE' | translate}}</h4>
|
<h4>{{'TENANT-LISTING.FILTER.TITLE' | translate}}</h4>
|
||||||
|
</div>
|
||||||
|
<div class="col-auto">
|
||||||
<button color="accent" mat-button (click)="clearFilters()">
|
<button color="accent" mat-button (click)="clearFilters()">
|
||||||
{{'COMMONS.LISTING-COMPONENT.CLEAR-ALL-FILTERS' | translate}}
|
{{'COMMONS.LISTING-COMPONENT.CLEAR-ALL-FILTERS' | translate}}
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<mat-slide-toggle labelPosition="before" [(ngModel)]="internalFilters.isActive">
|
<div class="row">
|
||||||
{{'TENANT-LISTING.FILTER.IS-ACTIVE' | translate}}
|
<div class="col-12">
|
||||||
</mat-slide-toggle>
|
<section class="w-100">
|
||||||
|
<mat-slide-toggle labelPosition="before" [(ngModel)]="internalFilters.isActive">
|
||||||
|
{{'TENANT-LISTING.FILTER.IS-ACTIVE' | translate}}
|
||||||
|
</mat-slide-toggle>
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div class="d-flex justify-content-end align-items-center mt-4 gap-1-rem">
|
<div class="row justify-content-end align-items-center mt-4 mb-1 gap-1-rem">
|
||||||
<button mat-stroked-button color="primary" (click)="filterMenuTrigger?.closeMenu()">
|
<div class="col-auto">
|
||||||
|
<button class="normal-btn-light-sm" (click)="filterMenuTrigger?.closeMenu()">
|
||||||
{{'TENANT-LISTING.FILTER.CANCEL' | translate}}
|
{{'TENANT-LISTING.FILTER.CANCEL' | translate}}
|
||||||
</button>
|
</button>
|
||||||
<button mat-raised-button color="primary" (click)="filterMenuTrigger.closeMenu(); applyFilters();">
|
</div>
|
||||||
|
<div class="col-auto">
|
||||||
|
<button class="normal-btn-sm" (click)="filterMenuTrigger.closeMenu(); applyFilters();">
|
||||||
{{'TENANT-LISTING.FILTER.APPLY-FILTERS' | translate}}
|
{{'TENANT-LISTING.FILTER.APPLY-FILTERS' | translate}}
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -22,4 +22,8 @@
|
||||||
// }
|
// }
|
||||||
}
|
}
|
||||||
|
|
||||||
|
::ng-deep .mdc-form-field {
|
||||||
|
label {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
|
@ -7,32 +7,47 @@
|
||||||
|
|
||||||
|
|
||||||
<mat-menu #filterMenu>
|
<mat-menu #filterMenu>
|
||||||
<div class="p-3" (click)="$event?.stopPropagation?.()">
|
<div class="container-fluid" (click)="$event?.stopPropagation?.()">
|
||||||
<div class="search-listing-filters-container">
|
<div class="row justify-content-between">
|
||||||
<div class="d-flex align-items-center justify-content-between">
|
<div class="col-auto mt-2">
|
||||||
<h4>{{'USER-LISTING.FILTER.TITLE' | translate}}</h4>
|
<h4>{{'USER-LISTING.FILTER.TITLE' | translate}}</h4>
|
||||||
|
</div>
|
||||||
|
<div class="col-auto">
|
||||||
<button color="accent" mat-button (click)="clearFilters()">
|
<button color="accent" mat-button (click)="clearFilters()">
|
||||||
{{'COMMONS.LISTING-COMPONENT.CLEAR-ALL-FILTERS' | translate}}
|
{{'COMMONS.LISTING-COMPONENT.CLEAR-ALL-FILTERS' | translate}}
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<mat-slide-toggle labelPosition="before" [(ngModel)]="internalFilters.isActive">
|
<div class="row mt-3">
|
||||||
{{'USER-LISTING.FILTER.IS-ACTIVE' | translate}}
|
<div class="col-12">
|
||||||
</mat-slide-toggle>
|
<section class="w-100">
|
||||||
|
<mat-slide-toggle labelPosition="before" [(ngModel)]="internalFilters.isActive">
|
||||||
|
{{'USER-LISTING.FILTER.IS-ACTIVE' | translate}}
|
||||||
|
</mat-slide-toggle>
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div>
|
<div class="row mt-3">
|
||||||
<mat-label>{{'USER-LISTING.FILTER.ROLES' | translate}}
|
<div class="col-12">
|
||||||
|
<mat-form-field class="w-100">
|
||||||
|
<mat-label>{{'USER-LISTING.FILTER.ROLES' | translate}}</mat-label>
|
||||||
<mat-select multiple [(ngModel)]="internalFilters.userRoleSubQuery.roles">
|
<mat-select multiple [(ngModel)]="internalFilters.userRoleSubQuery.roles">
|
||||||
<mat-option *ngFor="let appRole of appRoleEnumValues" [value]="appRole">{{enumUtils.toAppRoleString(appRole)}}</mat-option>
|
<mat-option *ngFor="let appRole of appRoleEnumValues" [value]="appRole">{{enumUtils.toAppRoleString(appRole)}}</mat-option>
|
||||||
</mat-select>
|
</mat-select>
|
||||||
</mat-label>
|
</mat-form-field>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div class="d-flex justify-content-end align-items-center mt-4 gap-1-rem">
|
<div class="row justify-content-end align-items-center mt-4 mb-1 gap-1-rem">
|
||||||
<button mat-stroked-button color="primary" (click)="filterMenuTrigger?.closeMenu()">
|
<div class="col-auto">
|
||||||
|
<button class="normal-btn-light-sm" (click)="filterMenuTrigger?.closeMenu()">
|
||||||
{{'USER-LISTING.FILTER.CANCEL' | translate}}
|
{{'USER-LISTING.FILTER.CANCEL' | translate}}
|
||||||
</button>
|
</button>
|
||||||
<button mat-raised-button color="primary" (click)="filterMenuTrigger.closeMenu(); applyFilters();">
|
</div>
|
||||||
|
<div class="col-auto">
|
||||||
|
<button class="normal-btn-sm" (click)="filterMenuTrigger.closeMenu(); applyFilters();">
|
||||||
{{'USER-LISTING.FILTER.APPLY-FILTERS' | translate}}
|
{{'USER-LISTING.FILTER.APPLY-FILTERS' | translate}}
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -22,4 +22,8 @@
|
||||||
// }
|
// }
|
||||||
}
|
}
|
||||||
|
|
||||||
|
::ng-deep .mdc-form-field {
|
||||||
|
label {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
|
@ -7,48 +7,69 @@
|
||||||
|
|
||||||
|
|
||||||
<mat-menu #filterMenu>
|
<mat-menu #filterMenu>
|
||||||
<div class="p-3" (click)="$event?.stopPropagation?.()">
|
<div class="container-fluid" (click)="$event?.stopPropagation?.()">
|
||||||
<div class="search-listing-filters-container">
|
<div class="row justify-content-between">
|
||||||
<div class="d-flex align-items-center justify-content-between">
|
<div class="col-auto mt-2">
|
||||||
<h4>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-LISTING.FILTER.TITLE' | translate}}</h4>
|
<h4>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-LISTING.FILTER.TITLE' | translate}}</h4>
|
||||||
|
</div>
|
||||||
|
<div class="col-auto">
|
||||||
<button color="accent" mat-button (click)="clearFilters()">
|
<button color="accent" mat-button (click)="clearFilters()">
|
||||||
{{'COMMONS.LISTING-COMPONENT.CLEAR-ALL-FILTERS' | translate}}
|
{{'COMMONS.LISTING-COMPONENT.CLEAR-ALL-FILTERS' | translate}}
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<mat-slide-toggle labelPosition="before" [(ngModel)]="internalFilters.isActive">
|
<div class="row mt-3">
|
||||||
{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-LISTING.FILTER.IS-ACTIVE' | translate}}
|
<div class="col-12">
|
||||||
</mat-slide-toggle>
|
<section class="w-100">
|
||||||
|
<mat-slide-toggle labelPosition="before" [(ngModel)]="internalFilters.isActive">
|
||||||
|
{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-LISTING.FILTER.IS-ACTIVE' | translate}}
|
||||||
|
</mat-slide-toggle>
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div>
|
<div class="row mt-3">
|
||||||
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-LISTING.FILTER.NOTIFICATION-TYPE' | translate}}
|
<div class="col-12">
|
||||||
|
<mat-form-field class="w-100">
|
||||||
|
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-LISTING.FILTER.NOTIFICATION-TYPE' | translate}}</mat-label>
|
||||||
<mat-select multiple [(ngModel)]="internalFilters.notificationTypes">
|
<mat-select multiple [(ngModel)]="internalFilters.notificationTypes">
|
||||||
<mat-option *ngFor="let type of notificationTypeEnumValues" [value]="type">{{enumUtils.toNotificationTypeString(type)}}</mat-option>
|
<mat-option *ngFor="let type of notificationTypeEnumValues" [value]="type">{{enumUtils.toNotificationTypeString(type)}}</mat-option>
|
||||||
</mat-select>
|
</mat-select>
|
||||||
</mat-label>
|
</mat-form-field>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div>
|
<div class="row mt-3">
|
||||||
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-LISTING.FILTER.KIND' | translate}}
|
<div class="col-12">
|
||||||
|
<mat-form-field class="w-100">
|
||||||
|
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-LISTING.FILTER.KIND' | translate}}</mat-label>
|
||||||
<mat-select multiple [(ngModel)]="internalFilters.kinds">
|
<mat-select multiple [(ngModel)]="internalFilters.kinds">
|
||||||
<mat-option *ngFor="let kind of notificationTemplateKindEnumValues" [value]="kind">{{enumUtils.toNotificationTemplateKindString(kind)}}</mat-option>
|
<mat-option *ngFor="let kind of notificationTemplateKindEnumValues" [value]="kind">{{enumUtils.toNotificationTemplateKindString(kind)}}</mat-option>
|
||||||
</mat-select>
|
</mat-select>
|
||||||
</mat-label>
|
</mat-form-field>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div>
|
<div class="row mt-3">
|
||||||
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-LISTING.FILTER.CHANNEL' | translate}}
|
<div class="col-12">
|
||||||
|
<mat-form-field class="w-100">
|
||||||
|
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-LISTING.FILTER.CHANNEL' | translate}}</mat-label>
|
||||||
<mat-select multiple [(ngModel)]="internalFilters.channels">
|
<mat-select multiple [(ngModel)]="internalFilters.channels">
|
||||||
<mat-option *ngFor="let channel of notificationTemplateChannelEnumValues" [value]="channel">{{enumUtils.toNotificationTemplateChannelString(channel)}}</mat-option>
|
<mat-option *ngFor="let channel of notificationTemplateChannelEnumValues" [value]="channel">{{enumUtils.toNotificationTemplateChannelString(channel)}}</mat-option>
|
||||||
</mat-select>
|
</mat-select>
|
||||||
</mat-label>
|
</mat-form-field>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div class="d-flex justify-content-end align-items-center mt-4 gap-1-rem">
|
<div class="row justify-content-end align-items-center mt-4 mb-1 gap-1-rem">
|
||||||
<button mat-stroked-button color="primary" (click)="filterMenuTrigger?.closeMenu()">
|
<div class="col-auto">
|
||||||
|
<button class="normal-btn-light-sm" (click)="filterMenuTrigger?.closeMenu()">
|
||||||
{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-LISTING.FILTER.CANCEL' | translate}}
|
{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-LISTING.FILTER.CANCEL' | translate}}
|
||||||
</button>
|
</button>
|
||||||
<button mat-raised-button color="primary" (click)="filterMenuTrigger.closeMenu(); applyFilters();">
|
</div>
|
||||||
|
<div class="col-auto">
|
||||||
|
<button class="normal-btn-sm" (click)="filterMenuTrigger.closeMenu(); applyFilters();">
|
||||||
{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-LISTING.FILTER.APPLY-FILTERS' | translate}}
|
{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-LISTING.FILTER.APPLY-FILTERS' | translate}}
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -22,4 +22,8 @@
|
||||||
// }
|
// }
|
||||||
}
|
}
|
||||||
|
|
||||||
|
::ng-deep .mdc-form-field {
|
||||||
|
label {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
|
@ -7,79 +7,101 @@
|
||||||
|
|
||||||
|
|
||||||
<mat-menu #filterMenu>
|
<mat-menu #filterMenu>
|
||||||
<div class="p-3" (click)="$event?.stopPropagation?.()">
|
<div class="container-fluid" (click)="$event?.stopPropagation?.()">
|
||||||
<div class="search-listing-filters-container">
|
<div class="row justify-content-between">
|
||||||
<div class="d-flex align-items-center justify-content-between">
|
<div class="col-auto mt-2">
|
||||||
<h4>{{'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.FILTER.TITLE' | translate}}</h4>
|
<h4>{{'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.FILTER.TITLE' | translate}}</h4>
|
||||||
|
</div>
|
||||||
|
<div class="col-auto">
|
||||||
<button color="accent" mat-button (click)="clearFilters()">
|
<button color="accent" mat-button (click)="clearFilters()">
|
||||||
{{'COMMONS.LISTING-COMPONENT.CLEAR-ALL-FILTERS' | translate}}
|
{{'COMMONS.LISTING-COMPONENT.CLEAR-ALL-FILTERS' | translate}}
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<mat-slide-toggle labelPosition="before" [(ngModel)]="internalFilters.isActive">
|
<div class="row mt-3">
|
||||||
{{'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.FILTER.IS-ACTIVE' | translate}}
|
<div class="col-12">
|
||||||
</mat-slide-toggle>
|
<section class="w-100">
|
||||||
|
<mat-slide-toggle labelPosition="before" [(ngModel)]="internalFilters.isActive">
|
||||||
<div class="mt-4">
|
{{'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.FILTER.IS-ACTIVE' | translate}}
|
||||||
<div>
|
</mat-slide-toggle>
|
||||||
<mat-form-field class="col-12">
|
</section>
|
||||||
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.FILTER.USERS' | translate}}</mat-label>
|
|
||||||
<app-multiple-auto-complete [(ngModel)]="internalFilters.userIds" [hidePlaceholder]="true" [separatorKeysCodes]="separatorKeysCodes" [configuration]="userAutoCompleteConfiguration">
|
|
||||||
</app-multiple-auto-complete>
|
|
||||||
</mat-form-field>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
<mat-form-field class="col-12">
|
|
||||||
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.FILTER.NOTIFICATION-TYPE' | translate}}</mat-label>
|
|
||||||
<mat-select multiple [(ngModel)]="internalFilters.type">
|
|
||||||
<mat-option *ngFor="let type of notificationTypeEnumValues" [value]="type">{{enumUtils.toNotificationTypeString(type)}}</mat-option>
|
|
||||||
</mat-select>
|
|
||||||
</mat-form-field>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
<mat-form-field class="col-12">
|
|
||||||
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.FILTER.CONTACT-TYPE' | translate}}</mat-label>
|
|
||||||
<mat-select multiple [(ngModel)]="internalFilters.contactType">
|
|
||||||
<mat-option *ngFor="let contactType of notificationContactTypeEnumValues" [value]="contactType">{{enumUtils.toNotificationContactTypeString(contactType)}}</mat-option>
|
|
||||||
</mat-select>
|
|
||||||
</mat-form-field>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
<mat-form-field class="col-12">
|
|
||||||
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.FILTER.NOTIFY-STATE' | translate}}</mat-label>
|
|
||||||
<mat-select multiple [(ngModel)]="internalFilters.notifyState">
|
|
||||||
<mat-option *ngFor="let notifyState of notificationNotifyStateEnumValues" [value]="notifyState">{{enumUtils.toNotificationNotifyStateString(notifyState)}}</mat-option>
|
|
||||||
</mat-select>
|
|
||||||
</mat-form-field>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
<mat-form-field class="col-12">
|
|
||||||
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.FILTER.TRACKING-STATE' | translate}}</mat-label>
|
|
||||||
<mat-select multiple [(ngModel)]="internalFilters.trackingState">
|
|
||||||
<mat-option *ngFor="let trackingState of notificationTrackingStateEnumValues" [value]="trackingState">{{enumUtils.toNotificationTrackingStateString(trackingState)}}</mat-option>
|
|
||||||
</mat-select>
|
|
||||||
</mat-form-field>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
<mat-form-field class="col-12">
|
|
||||||
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.FILTER.TRACKING-PROCESS' | translate}}</mat-label>
|
|
||||||
<mat-select multiple [(ngModel)]="internalFilters.trackingProcess">
|
|
||||||
<mat-option *ngFor="let trackingProcess of notificationTrackingProcessEnumValues" [value]="trackingProcess">{{enumUtils.toNotificationTrackingProcessString(trackingProcess)}}</mat-option>
|
|
||||||
</mat-select>
|
|
||||||
</mat-form-field>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div class="d-flex justify-content-between mt-4 gap-1-rem">
|
<div class="row mt-3">
|
||||||
<button mat-stroked-button color="primary" (click)="filterMenuTrigger?.closeMenu()">
|
<div class="col-12">
|
||||||
|
<mat-form-field class="w-100">
|
||||||
|
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.FILTER.USERS' | translate}}</mat-label>
|
||||||
|
<app-multiple-auto-complete [(ngModel)]="internalFilters.userIds" [hidePlaceholder]="true" [separatorKeysCodes]="separatorKeysCodes" [configuration]="userAutoCompleteConfiguration">
|
||||||
|
</app-multiple-auto-complete>
|
||||||
|
</mat-form-field>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="row mt-3">
|
||||||
|
<div class="col-12">
|
||||||
|
<mat-form-field class="w-100">
|
||||||
|
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.FILTER.NOTIFICATION-TYPE' | translate}}</mat-label>
|
||||||
|
<mat-select multiple [(ngModel)]="internalFilters.type">
|
||||||
|
<mat-option *ngFor="let type of notificationTypeEnumValues" [value]="type">{{enumUtils.toNotificationTypeString(type)}}</mat-option>
|
||||||
|
</mat-select>
|
||||||
|
</mat-form-field>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="row mt-3">
|
||||||
|
<div class="col-12">
|
||||||
|
<mat-form-field class="w-100">
|
||||||
|
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.FILTER.CONTACT-TYPE' | translate}}</mat-label>
|
||||||
|
<mat-select multiple [(ngModel)]="internalFilters.contactType">
|
||||||
|
<mat-option *ngFor="let contactType of notificationContactTypeEnumValues" [value]="contactType">{{enumUtils.toNotificationContactTypeString(contactType)}}</mat-option>
|
||||||
|
</mat-select>
|
||||||
|
</mat-form-field>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="row mt-3">
|
||||||
|
<div class="col-12">
|
||||||
|
<mat-form-field class="w-100">
|
||||||
|
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.FILTER.NOTIFY-STATE' | translate}}</mat-label>
|
||||||
|
<mat-select multiple [(ngModel)]="internalFilters.notifyState">
|
||||||
|
<mat-option *ngFor="let notifyState of notificationNotifyStateEnumValues" [value]="notifyState">{{enumUtils.toNotificationNotifyStateString(notifyState)}}</mat-option>
|
||||||
|
</mat-select>
|
||||||
|
</mat-form-field>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="row mt-3">
|
||||||
|
<div class="col-12">
|
||||||
|
<mat-form-field class="w-100">
|
||||||
|
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.FILTER.TRACKING-STATE' | translate}}</mat-label>
|
||||||
|
<mat-select multiple [(ngModel)]="internalFilters.trackingState">
|
||||||
|
<mat-option *ngFor="let trackingState of notificationTrackingStateEnumValues" [value]="trackingState">{{enumUtils.toNotificationTrackingStateString(trackingState)}}</mat-option>
|
||||||
|
</mat-select>
|
||||||
|
</mat-form-field>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="row mt-3">
|
||||||
|
<div class="col-12">
|
||||||
|
<mat-form-field class="w-100">
|
||||||
|
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.FILTER.TRACKING-PROCESS' | translate}}</mat-label>
|
||||||
|
<mat-select multiple [(ngModel)]="internalFilters.trackingProcess">
|
||||||
|
<mat-option *ngFor="let trackingProcess of notificationTrackingProcessEnumValues" [value]="trackingProcess">{{enumUtils.toNotificationTrackingProcessString(trackingProcess)}}</mat-option>
|
||||||
|
</mat-select>
|
||||||
|
</mat-form-field>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="row justify-content-end align-items-center mt-4 mb-1 gap-1-rem">
|
||||||
|
<div class="col-auto">
|
||||||
|
<button class="normal-btn-light-sm" (click)="filterMenuTrigger?.closeMenu()">
|
||||||
{{'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.FILTER.CANCEL' | translate}}
|
{{'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.FILTER.CANCEL' | translate}}
|
||||||
</button>
|
</button>
|
||||||
<button mat-raised-button color="primary" (click)="filterMenuTrigger.closeMenu(); applyFilters();">
|
</div>
|
||||||
|
<div class="col-auto">
|
||||||
|
<button class="normal-btn-sm" (click)="filterMenuTrigger.closeMenu(); applyFilters();">
|
||||||
{{'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.FILTER.APPLY-FILTERS' | translate}}
|
{{'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.FILTER.APPLY-FILTERS' | translate}}
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -1,11 +1,11 @@
|
||||||
// ::ng-deep.mat-mdc-menu-panel {
|
::ng-deep.mat-mdc-menu-panel {
|
||||||
// max-width: 100% !important;
|
max-width: 100% !important;
|
||||||
// height: 100% !important;
|
height: 100% !important;
|
||||||
// }
|
}
|
||||||
|
|
||||||
// :host::ng-deep.mat-mdc-menu-content:not(:empty) {
|
:host::ng-deep.mat-mdc-menu-content:not(:empty) {
|
||||||
// padding-top: 0 !important;
|
padding-top: 0 !important;
|
||||||
// }
|
}
|
||||||
|
|
||||||
|
|
||||||
.filter-button{
|
.filter-button{
|
||||||
|
@ -18,4 +18,8 @@
|
||||||
// }
|
// }
|
||||||
}
|
}
|
||||||
|
|
||||||
|
::ng-deep .mdc-form-field {
|
||||||
|
label {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
|
@ -2,7 +2,7 @@ import { COMMA, ENTER } from '@angular/cdk/keycodes';
|
||||||
import { Component, EventEmitter, Input, OnChanges, OnInit, Output, SimpleChanges } from '@angular/core';
|
import { Component, EventEmitter, Input, OnChanges, OnInit, Output, SimpleChanges } from '@angular/core';
|
||||||
import { NotificationFilter } from '@notification-service/core/query/notification.lookup';
|
import { NotificationFilter } from '@notification-service/core/query/notification.lookup';
|
||||||
import { UserService } from '@app/core/services/user/user.service';
|
import { UserService } from '@app/core/services/user/user.service';
|
||||||
import { EnumUtils } from '@app/core/services/utilities/enum-utils.service';
|
import { NotificationServiceEnumUtils } from '@notification-service/core/formatting/enum-utils.service';
|
||||||
import { MultipleAutoCompleteConfiguration } from '@app/library/auto-complete/multiple/multiple-auto-complete-configuration';
|
import { MultipleAutoCompleteConfiguration } from '@app/library/auto-complete/multiple/multiple-auto-complete-configuration';
|
||||||
import { BaseComponent } from '@common/base/base.component';
|
import { BaseComponent } from '@common/base/base.component';
|
||||||
import { Guid } from '@common/types/guid';
|
import { Guid } from '@common/types/guid';
|
||||||
|
@ -37,7 +37,7 @@ export class NotificationListingFiltersComponent extends BaseComponent implement
|
||||||
|
|
||||||
protected appliedFilterCount: number = 0;
|
protected appliedFilterCount: number = 0;
|
||||||
constructor(
|
constructor(
|
||||||
public enumUtils: EnumUtils,
|
public enumUtils: NotificationServiceEnumUtils,
|
||||||
private userService: UserService,
|
private userService: UserService,
|
||||||
) { super(); }
|
) { super(); }
|
||||||
|
|
||||||
|
|
|
@ -40,7 +40,7 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="row justify-content-end align-items-center mt-4 gap-1-rem">
|
<div class="row justify-content-end align-items-center mt-4 mb-1 gap-1-rem">
|
||||||
<div class="col-auto">
|
<div class="col-auto">
|
||||||
<button class="normal-btn-light-sm" (click)="filterMenuTrigger?.closeMenu()">
|
<button class="normal-btn-light-sm" (click)="filterMenuTrigger?.closeMenu()">
|
||||||
{{'NOTIFICATION-SERVICE.INAPP-NOTIFICATION-LISTING.FILTER.CANCEL' | translate}}
|
{{'NOTIFICATION-SERVICE.INAPP-NOTIFICATION-LISTING.FILTER.CANCEL' | translate}}
|
||||||
|
|
Loading…
Reference in New Issue