MaDgiK-CITE
/
argos
13
0
Fork 0
Code Issues Pull Requests Projects Releases 3 Wiki Activity

styling changes

This commit is contained in:
Sofia Papacharalampous 2024-03-13 17:26:47 +02:00
parent 99a870ff84
commit cf1cc0a4fb
8 changed files with 375 additions and 356 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
dmp-frontend/src/app/library/auto-complete/multiple/multiple-auto-complete.component.scss
View File

@ -1,6 +1,6 @@
.multiple-auto-complete { .multiple-auto-complete {
margin-left: inherit; // margin-left: inherit;
margin-right: inherit; // margin-right: inherit;
.not-loading { .not-loading {
display: none; display: none;

8
dmp-frontend/src/app/ui/admin/language/listing/filters/language-listing-filters.component.html
View File

@ -10,22 +10,22 @@
<div class="p-3" (click)="$event?.stopPropagation?.()"> <div class="p-3" (click)="$event?.stopPropagation?.()">
<div class="search-listing-filters-container"> <div class="search-listing-filters-container">
<div class="d-flex align-items-center justify-content-between"> <div class="d-flex align-items-center justify-content-between">
<h4>{{'TENANT-LISTING.FILTER.TITLE' | translate}}</h4> <h4>{{'LANGUAGE-LISTING.FILTER.TITLE' | translate}}</h4>
<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>
<mat-slide-toggle labelPosition="before" [(ngModel)]="internalFilters.isActive"> <mat-slide-toggle labelPosition="before" [(ngModel)]="internalFilters.isActive">
{{'TENANT-LISTING.FILTER.IS-ACTIVE' | translate}} {{'LANGUAGE-LISTING.FILTER.IS-ACTIVE' | translate}}
</mat-slide-toggle> </mat-slide-toggle>
<div class="d-flex justify-content-end align-items-center mt-4 gap-1-rem"> <div class="d-flex justify-content-end align-items-center mt-4 gap-1-rem">
<button mat-stroked-button color="primary" (click)="filterMenuTrigger?.closeMenu()"> <button mat-stroked-button color="primary" (click)="filterMenuTrigger?.closeMenu()">
{{'TENANT-LISTING.FILTER.CANCEL' | translate}} {{'LANGUAGE-LISTING.FILTER.CANCEL' | translate}}
</button> </button>
<button mat-raised-button color="primary" (click)="filterMenuTrigger.closeMenu(); applyFilters();"> <button mat-raised-button color="primary" (click)="filterMenuTrigger.closeMenu(); applyFilters();">
{{'TENANT-LISTING.FILTER.APPLY-FILTERS' | translate}} {{'LANGUAGE-LISTING.FILTER.APPLY-FILTERS' | translate}}
</button> </button>
</div> </div>
</div> </div>

5
dmp-frontend/src/app/ui/admin/maintenance-tasks/maintenance-tasks.component.html
View File

@ -1,5 +1,6 @@
<div class="row root"> <!-- <div class="row root"> -->
<mat-card class="col-md-3 offset-md-4"> <div class="d-flex justify-content-center">
<mat-card class="p-4 mt-4">
<div style="color: red;">Warning: Danger zone. Irreversible actions!</div> <div style="color: red;">Warning: Danger zone. Irreversible actions!</div>
<div> <div>
<!-- <button mat-raised-button color="primary" (click)="migrateSemantics($event)" class="lightblue-btn button">Migrate semantics</button> --> <!-- <button mat-raised-button color="primary" (click)="migrateSemantics($event)" class="lightblue-btn button">Migrate semantics</button> -->

76
dmp-frontend/src/app/ui/admin/notification-template/editor/field-options/notification-template-field-options.component.html
View File

@ -20,19 +20,21 @@
<mat-error *ngIf="form.get('mandatory').hasError('backendError')">{{form.get('mandatory').getError('backendError').message}}</mat-error> <mat-error *ngIf="form.get('mandatory').hasError('backendError')">{{form.get('mandatory').getError('backendError').message}}</mat-error>
</mat-form-field> </mat-form-field>
</div> </div>
<h4 class="col-md-12">{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.OPTIONAL-TITLE' | translate}}</h4> <h4 class="col-md-12">{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.OPTIONAL-TITLE' | translate}}</h4>
<div class="col-12"> <div class="d-flex flex-column">
<div class="row" *ngFor="let options of form.get('optional')['controls']; let i = index"> <ng-container *ngFor="let options of form.get('optional')['controls']; let i = index">
<div class="col-4"> <div class="d-flex flex-wrap">
<mat-form-field class="col-auto"> <div class="col-md-4">
<mat-form-field class="w-100">
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.KEY' | translate}}</mat-label> <mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.KEY' | translate}}</mat-label>
<input matInput [formControl]="options.get('key')"> <input matInput [formControl]="options.get('key')">
<mat-error *ngIf="options.get('key').hasError('backendError')">{{options.get('key').getError('backendError').message}}</mat-error> <mat-error *ngIf="options.get('key').hasError('backendError')">{{options.get('key').getError('backendError').message}}</mat-error>
<mat-error *ngIf="options.get('key').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-error *ngIf="options.get('key').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field> </mat-form-field>
</div> </div>
<div class="col-4"> <div class="col-auto">
<mat-form-field class="col-auto"> <mat-form-field class="w-100">
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.DATA-TYPE' | translate}}</mat-label> <mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.DATA-TYPE' | translate}}</mat-label>
<mat-select name="channel" [formControl]="options.get('type')"> <mat-select name="channel" [formControl]="options.get('type')">
<mat-option *ngFor="let type of notificationDataTypeEnum" [value]="type"> <mat-option *ngFor="let type of notificationDataTypeEnum" [value]="type">
@ -43,50 +45,50 @@
<mat-error *ngIf="options.get('type').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-error *ngIf="options.get('type').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field> </mat-form-field>
</div> </div>
<div class="col-4"> <div class="col-auto">
<mat-form-field class="col"> <mat-form-field class="w-100">
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.VALUE' | translate}}</mat-label> <mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.VALUE' | translate}}</mat-label>
<input matInput [formControl]="options.get('value')"> <input matInput [formControl]="options.get('value')">
<mat-error *ngIf="options.get('value').hasError('backendError')">{{options.get('value').getError('backendError').message}}</mat-error> <mat-error *ngIf="options.get('value').hasError('backendError')">{{options.get('value').getError('backendError').message}}</mat-error>
<mat-error *ngIf="options.get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-error *ngIf="options.get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field> </mat-form-field>
<div class="col-auto">
<button mat-icon-button (click)="removeSubjectOptionalItem(i)" [disabled]="form.disabled">
<mat-icon>remove</mat-icon>
</button>
</div>
</div> </div>
</div> </div>
<div class="row"> <div class="col-auto">
<div class="col-auto"> <button mat-icon-button (click)="removeSubjectOptionalItem(i)" [disabled]="form.disabled">
<button mat-icon-button (click)="addOptionalItem()" [disabled]="form.disabled"> <mat-icon>remove</mat-icon>
<mat-icon>add</mat-icon> </button>
</button>
</div>
</div> </div>
</ng-container>
<div class="col-auto">
<button mat-icon-button (click)="addOptionalItem()" [disabled]="form.disabled">
<mat-icon>add</mat-icon>
</button>
</div> </div>
<h4 class="col-md-12">{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.FORMATTING' | translate}}</h4> </div>
<div class="row" *ngFor="let item of form.get('mandatory').value; let i = index">
<h4 class="col-md-12">{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.FORMATTING' | translate}}</h4>
<div class="d-flex flex-wrap" *ngFor="let item of form.get('mandatory').value; let i = index">
<mat-form-field class="col-md-4">
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.KEY' | translate}}</mat-label>
<input matInput [value]="item" [disabled] = "true">
</mat-form-field>
<mat-form-field class="col-md-4">
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.VALUE' | translate}}</mat-label>
<input matInput [value] ="formatting[item]" (change)="formattingValueChange($event, item)">
<mat-error *ngIf="form.get('formatting').hasError('backendError')">{{form.get('formatting').getError('backendError').message}}</mat-error>
</mat-form-field>
</div>
<div class="d-flex flex-wrap" *ngFor="let item of form.get('optional')['controls']; let i = index">
<ng-container *ngIf="item.valid">
<mat-form-field class="col-md-4"> <mat-form-field class="col-md-4">
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.KEY' | translate}}</mat-label> <mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.KEY' | translate}}</mat-label>
<input matInput [value]="item" [disabled] = "true"> <input matInput [value]="item.value.key" [disabled] = "true">
</mat-form-field> </mat-form-field>
<mat-form-field class="col-md-4"> <mat-form-field class="col-md-4">
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.VALUE' | translate}}</mat-label> <mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.VALUE' | translate}}</mat-label>
<input matInput [value] ="formatting[item]" (change)="formattingValueChange($event, item)"> <input matInput [value]="formatting[item]" (change)="formattingValueChange($event, item)">
<mat-error *ngIf="form.get('formatting').hasError('backendError')">{{form.get('formatting').getError('backendError').message}}</mat-error> <mat-error *ngIf="form.get('formatting').hasError('backendError')">{{form.get('formatting').getError('backendError').message}}</mat-error>
</mat-form-field> </mat-form-field>
</div> </ng-container>
<div class="row" *ngFor="let item of form.get('optional')['controls']; let i = index"> </div>
<div *ngIf="item.valid">
<mat-form-field class="col-md-4">
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.KEY' | translate}}</mat-label>
<input matInput [value]="item.value.key" [disabled] = "true">
</mat-form-field>
<mat-form-field class="col-md-4">
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.VALUE' | translate}}</mat-label>
<input matInput [value]="formatting[item]" (change)="formattingValueChange($event, item)">
<mat-error *ngIf="form.get('formatting').hasError('backendError')">{{form.get('formatting').getError('backendError').message}}</mat-error>
</mat-form-field>
</div>
</div>

525
dmp-frontend/src/app/ui/admin/notification-template/editor/notification-template-editor.component.html
View File

@ -1,276 +1,275 @@
<div class="notification-template-editor"> <div class="notification-template-editor">
<div class="col-md-10 offset-md-1 colums-gapped"> <div class="col-md-10 offset-md-1 colums-gapped">
<div class="row align-items-center mb-4" *ngIf="formGroup">
<div class="col-auto">
<h3 *ngIf="isNew && !isClone">{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.NEW' | translate}}</h3>
<app-navigation-breadcrumb />
</div>
<div class="col-auto">
<button mat-button class="action-btn" (click)="cancel()" type="button">{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.ACTIONS.CANCEL' | translate}}</button>
</div>
<div class="col-auto" *ngIf="!isNew">
<button mat-button class="action-btn" type="button" (click)="delete()">
<mat-icon>delete</mat-icon>
{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.ACTIONS.DELETE' | translate}}
</button>
</div>
<div class="col-auto" *ngIf="canSave">
<button mat-button class="action-btn" (click)="formSubmit()">
<mat-icon>save</mat-icon>
{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.ACTIONS.SAVE' | translate}}
</button>
</div>
</div>
<div class="row align-items-center mb-4" *ngIf="formGroup"> <form *ngIf="formGroup" (ngSubmit)="formSubmit()" >
<div class="col-auto"> <mat-card appearance="outlined">
<h3 *ngIf="isNew && !isClone">{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.NEW' | translate}}</h3> <mat-card-header>
<app-navigation-breadcrumb /> <mat-card-title *ngIf="isNew">{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.NEW' | translate}}</mat-card-title>
</div> </mat-card-header>
<div class="col-auto"> <mat-card-content>
<button mat-button class="action-btn" (click)="cancel()" type="button">{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.ACTIONS.CANCEL' | translate}}</button> <div class="row mt-4">
</div> <div class="col-6">
<div class="col-auto" *ngIf="!isNew"> <mat-form-field class="col-md-12">
<button mat-button class="action-btn" type="button" (click)="delete()"> <mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.NOTIFICATION-TYPE' | translate}}</mat-label>
<mat-icon>delete</mat-icon> <mat-select [formControl]="formGroup.get('notificationType')" name="notificationType" required>
{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.ACTIONS.DELETE' | translate}} <mat-option *ngFor="let type of notificationTypeEnum" [value]="type">
</button> {{enumUtils.toNotificationTypeString(type)}}
</div> </mat-option>
<div class="col-auto" *ngIf="canSave"> </mat-select>
<button mat-button class="action-btn" (click)="formSubmit()"> <mat-error *ngIf="formGroup.get('notificationType').hasError('backendError')">{{formGroup.get('notificationType').getError('backendError').message}}</mat-error>
<mat-icon>save</mat-icon> <mat-error *ngIf="formGroup.get('notificationType').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.ACTIONS.SAVE' | translate}} </mat-form-field>
</button> </div>
</div> <div class="col-4">
</div> <mat-form-field class="w-100">
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.LANGUAGE' | translate}}</mat-label>
<mat-select [formControl]="formGroup.get('languageId')" name="language" required>
<mat-option *ngFor="let language of languages" [value]="language.id">
{{language.code}}
</mat-option>
</mat-select>
<mat-error *ngIf="formGroup.get('languageId').hasError('backendError')">{{formGroup.get('languageId').getError('backendError').message}}</mat-error>
<mat-error *ngIf="formGroup.get('languageId').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field>
</div>
<div class="col-4">
<mat-form-field class="w-100">
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.KIND' | translate}}</mat-label>
<mat-select name="kind" [formControl]="formGroup.get('kind')" required>
<mat-option *ngFor="let kind of notificationTemplateKindEnum" [value]="kind">
{{enumUtils.toNotificationTemplateKindString(kind)}}
</mat-option>
</mat-select>
<mat-error *ngIf="formGroup.get('kind').hasError('backendError')">{{formGroup.get('kind').getError('backendError').message}}</mat-error>
<mat-error *ngIf="formGroup.get('kind').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field>
</div>
<div class="col-4">
<mat-form-field class="w-100">
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.CHANNEL' | translate}}</mat-label>
<mat-select name="channel" [formControl]="formGroup.get('channel')" required>
<mat-option *ngFor="let channel of notificationTemplateChannelEnum" [value]="channel">
{{enumUtils.toNotificationTemplateChannelString(channel)}}
</mat-option>
</mat-select>
<mat-error *ngIf="formGroup.get('channel').hasError('backendError')">{{formGroup.get('channel').getError('backendError').message}}</mat-error>
<mat-error *ngIf="formGroup.get('channel').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field>
</div>
</div>
<form *ngIf="formGroup" (ngSubmit)="formSubmit()"> <!-- Subject -->
<mat-card appearance="outlined"> <div class="row">
<mat-card-header> <h3 class="col-md-12">{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.SUBJECT-SECTION' | translate}}</h3>
<mat-card-title *ngIf="isNew">{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.NEW' | translate}}</mat-card-title>
</mat-card-header>
<mat-card-content>
<div class="row">
<div class="col-4">
<mat-form-field class="w-100">
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.NOTIFICATION-TYPE' | translate}}</mat-label>
<mat-select [formControl]="formGroup.get('notificationType')" name="notificationType" required>
<mat-option *ngFor="let type of notificationTypeEnum" [value]="type">
{{enumUtils.toNotificationTypeString(type)}}
</mat-option>
</mat-select>
<mat-error *ngIf="formGroup.get('notificationType').hasError('backendError')">{{formGroup.get('notificationType').getError('backendError').message}}</mat-error>
<mat-error *ngIf="formGroup.get('notificationType').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field>
</div>
<div class="col-4">
<mat-form-field class="w-100">
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.LANGUAGE' | translate}}</mat-label>
<mat-select [formControl]="formGroup.get('languageId')" name="language" required>
<mat-option *ngFor="let language of languages" [value]="language.id">
{{language.code}}
</mat-option>
</mat-select>
<mat-error *ngIf="formGroup.get('languageId').hasError('backendError')">{{formGroup.get('languageId').getError('backendError').message}}</mat-error>
<mat-error *ngIf="formGroup.get('languageId').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field>
</div>
<div class="col-4">
<mat-form-field class="w-100">
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.KIND' | translate}}</mat-label>
<mat-select name="kind" [formControl]="formGroup.get('kind')" required>
<mat-option *ngFor="let kind of notificationTemplateKindEnum" [value]="kind">
{{enumUtils.toNotificationTemplateKindString(kind)}}
</mat-option>
</mat-select>
<mat-error *ngIf="formGroup.get('kind').hasError('backendError')">{{formGroup.get('kind').getError('backendError').message}}</mat-error>
<mat-error *ngIf="formGroup.get('kind').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field>
</div>
<div class="col-4">
<mat-form-field class="w-100">
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.CHANNEL' | translate}}</mat-label>
<mat-select name="channel" [formControl]="formGroup.get('channel')" required>
<mat-option *ngFor="let channel of notificationTemplateChannelEnum" [value]="channel">
{{enumUtils.toNotificationTemplateChannelString(channel)}}
</mat-option>
</mat-select>
<mat-error *ngIf="formGroup.get('channel').hasError('backendError')">{{formGroup.get('channel').getError('backendError').message}}</mat-error>
<mat-error *ngIf="formGroup.get('channel').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field>
</div>
</div>
<!-- Subject -->
<div class="row">
<h3 class="col-md-12">{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.SUBJECT-SECTION' | translate}}</h3>
<mat-form-field class="col-md-12">
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.SUBJECT-TEXT' | translate}}</mat-label>
<input matInput [formControl]="formGroup.get('value').get('subjectText')">
<mat-error *ngIf="formGroup.get('value').get('subjectText').hasError('backendError')">{{formGroup.get('value').get('subjectText').getError('backendError').message}}</mat-error>
<mat-error *ngIf="formGroup.get('value').get('subjectText').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field>
<div class="col-4">
<mat-form-field class="col-md-12"> <mat-form-field class="col-md-12">
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.SUBJECT-KEY' | translate}}</mat-label> <mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.SUBJECT-TEXT' | translate}}</mat-label>
<input matInput [formControl]="formGroup.get('value').get('subjectKey')"> <input matInput [formControl]="formGroup.get('value').get('subjectText')">
<mat-error *ngIf="formGroup.get('value').get('subjectKey').hasError('backendError')">{{formGroup.get('value').get('subjectKey').getError('backendError').message}}</mat-error> <mat-error *ngIf="formGroup.get('value').get('subjectText').hasError('backendError')">{{formGroup.get('value').get('subjectText').getError('backendError').message}}</mat-error>
<mat-error *ngIf="formGroup.get('value').get('subjectKey').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-error *ngIf="formGroup.get('value').get('subjectText').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field> </mat-form-field>
<div class="col-4">
<mat-form-field class="col-md-12">
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.SUBJECT-KEY' | translate}}</mat-label>
<input matInput [formControl]="formGroup.get('value').get('subjectKey')">
<mat-error *ngIf="formGroup.get('value').get('subjectKey').hasError('backendError')">{{formGroup.get('value').get('subjectKey').getError('backendError').message}}</mat-error>
<mat-error *ngIf="formGroup.get('value').get('subjectKey').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field>
</div>
</div> </div>
</div> <h4 class="col-md-12">{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.SUBJECT-FIELD-OPTIONS' | translate}}
<h4 class="col-md-12">{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.SUBJECT-FIELD-OPTIONS' | translate}} <mat-checkbox [checked]="subjectFieldOptionsEnabled" (change)="subjectFieldOptionsSelectionChanged($event)"></mat-checkbox>
<mat-checkbox [checked]="subjectFieldOptionsEnabled" (change)="subjectFieldOptionsSelectionChanged($event)"></mat-checkbox> </h4>
</h4> <ng-container *ngIf="subjectFieldOptionsEnabled == true">
<div *ngIf="subjectFieldOptionsEnabled == true"> <app-notification-template-field-options-component
<app-notification-template-field-options-component [form]="formGroup.get('value').get('subjectFieldOptions')"
[form]="formGroup.get('value').get('subjectFieldOptions')" [validationErrorModel]="editorModel.validationErrorModel"
[validationErrorModel]="editorModel.validationErrorModel" [validationRootPath]="'value.subjectFieldOptions.'"
[validationRootPath]="'value.subjectFieldOptions.'" [mandatoryFields]="subjectMandatoryFields"
[mandatoryFields]="subjectMandatoryFields" [formatting]="subjectFormatting">
[formatting]="subjectFormatting"> </app-notification-template-field-options-component>
</app-notification-template-field-options-component> </ng-container>
</div>
<!-- Body --> <!-- Body -->
<div>
<h3 class="col-md-12">{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.BODY-SECTION' | translate}}</h3>
<div class="col-4">
<mat-form-field class="col-md-12">
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.BODY-KEY' | translate}}</mat-label>
<input matInput [formControl]="formGroup.get('value').get('bodyKey')">
<mat-error *ngIf="formGroup.get('value').get('bodyKey').hasError('backendError')">{{formGroup.get('value').get('bodyKey').getError('backendError').message}}</mat-error>
<mat-error *ngIf="formGroup.get('value').get('bodyKey').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field>
</div>
<div class="col-12">
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.BODY-TEXT' | translate}}</mat-label>
<editor class="w-100" [init]="{
base_url: '/tinymce',
suffix: '.min',
height: 800,
menubar: true,
plugins: [
'advlist', 'autolink', 'lists', 'link', 'image', 'charmap', 'print', 'preview', 'anchor',
'searchreplace', 'visualblocks', 'fullpage',
'insertdatetime', 'media', 'table' ,'paste', 'code', 'help', 'wordcount','importcss',
],
extended_valid_elements: '*[*]',
forced_root_block: '',
valid_children: '+body[script],ol[li|div|p|a|ol|table],h2[span],h3[span]',
save_enablewhendirty: false,
toolbar:
'undo redo | formatselect | bold italic backcolor | \
alignleft aligncenter alignright alignjustify | \
bullist numlist outdent indent | code | searchreplace | preview | removeformat | help | link | image'
}" [formControl]="formGroup.get('value').get('bodyText')"></editor>
<mat-error *ngIf="formGroup.get('value').get('bodyText').hasError('backendError')">{{formGroup.get('value').get('bodyText').getError('backendError').message}}</mat-error>
<mat-error *ngIf="formGroup.get('value').get('bodyText').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</div>
</div>
<h4 class="col-md-12">{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.BODY-FIELD-OPTIONS' | translate}}
<mat-checkbox [checked]="bodyFieldOptionsEnabled" (change)="bodyFieldOptionsSelectionChanged($event)"></mat-checkbox>
</h4>
<div *ngIf="bodyFieldOptionsEnabled == true">
<app-notification-template-field-options-component
[form]="formGroup.get('value').get('bodyFieldOptions')"
[validationErrorModel]="editorModel.validationErrorModel"
[validationRootPath]="'value.bodyFieldOptions.'"
[bodyMandatoryFields]="subjectMandatoryFields"
[formatting]="bodyFormatting">
</app-notification-template-field-options-component>
</div>
<!--Extra Options -->
<div class="row">
<h3 class="col-md-12">{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.EXTRA-OPTIONS' | translate}}</h3>
<div> <div>
<h4 class="col-md-12">{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.ALLOW-ATTACHMENTS' | translate}} <h3 class="col-md-12">{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.BODY-SECTION' | translate}}</h3>
<mat-checkbox [formControl]="formGroup.get('value').get('allowAttachments')"></mat-checkbox> <div class="col-4">
<mat-error *ngIf="formGroup.get('value').get('allowAttachments').hasError('backendError')">{{formGroup.get('value').get('allowAttachments').getError('backendError').message}}</mat-error> <mat-form-field class="col-md-12">
</h4> <mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.BODY-KEY' | translate}}</mat-label>
<input matInput [formControl]="formGroup.get('value').get('bodyKey')">
<mat-error *ngIf="formGroup.get('value').get('bodyKey').hasError('backendError')">{{formGroup.get('value').get('bodyKey').getError('backendError').message}}</mat-error>
<mat-error *ngIf="formGroup.get('value').get('bodyKey').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field>
</div>
<div class="col-12">
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.BODY-TEXT' | translate}}</mat-label>
<editor class="w-100" [init]="{
base_url: '/tinymce',
suffix: '.min',
height: 800,
menubar: true,
plugins: [
'advlist', 'autolink', 'lists', 'link', 'image', 'charmap', 'print', 'preview', 'anchor',
'searchreplace', 'visualblocks', 'fullpage',
'insertdatetime', 'media', 'table' ,'paste', 'code', 'help', 'wordcount','importcss',
],
extended_valid_elements: '*[*]',
forced_root_block: '',
valid_children: '+body[script],ol[li|div|p|a|ol|table],h2[span],h3[span]',
save_enablewhendirty: false,
toolbar:
'undo redo | formatselect | bold italic backcolor | \
alignleft aligncenter alignright alignjustify | \
bullist numlist outdent indent | code | searchreplace | preview | removeformat | help | link | image'
}" [formControl]="formGroup.get('value').get('bodyText')"></editor>
<mat-error *ngIf="formGroup.get('value').get('bodyText').hasError('backendError')">{{formGroup.get('value').get('bodyText').getError('backendError').message}}</mat-error>
<mat-error *ngIf="formGroup.get('value').get('bodyText').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</div>
</div> </div>
<div class="col-4"> <h4 class="col-md-12">{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.BODY-FIELD-OPTIONS' | translate}}
<mat-form-field class="col-md-12"> <mat-checkbox [checked]="bodyFieldOptionsEnabled" (change)="bodyFieldOptionsSelectionChanged($event)"></mat-checkbox>
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.PRIORITY-KEY' | translate}}</mat-label> </h4>
<input matInput [formControl]="formGroup.get('value').get('priorityKey')"> <div *ngIf="bodyFieldOptionsEnabled == true">
<mat-error *ngIf="formGroup.get('value').get('priorityKey').hasError('backendError')">{{formGroup.get('value').get('priorityKey').getError('backendError').message}}</mat-error> <app-notification-template-field-options-component
<mat-error *ngIf="formGroup.get('value').get('priorityKey').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> [form]="formGroup.get('value').get('bodyFieldOptions')"
</mat-form-field> [validationErrorModel]="editorModel.validationErrorModel"
</div> [validationRootPath]="'value.bodyFieldOptions.'"
<div class="col-4" > [bodyMandatoryFields]="subjectMandatoryFields"
<mat-form-field class="chip-list"> [formatting]="bodyFormatting">
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.CC' | translate}}</mat-label> </app-notification-template-field-options-component>
<mat-chip-grid #cc [formControl]="formGroup.get('value').get('cc')"> </div>
<mat-chip-row *ngFor="let field of ccValues" <!--Extra Options -->
(removed)="removeChipListValues('cc', field)" <div class="row">
[editable]="true" <h3 class="col-md-12">{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.EXTRA-OPTIONS' | translate}}</h3>
(edited)="editChipListValues('cc', $event, field)"> <div>
{{field}} <h4 class="col-md-12">{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.ALLOW-ATTACHMENTS' | translate}}
<button matChipRemove> <mat-checkbox [formControl]="formGroup.get('value').get('allowAttachments')"></mat-checkbox>
<mat-icon>cancel</mat-icon> <mat-error *ngIf="formGroup.get('value').get('allowAttachments').hasError('backendError')">{{formGroup.get('value').get('allowAttachments').getError('backendError').message}}</mat-error>
</button> </h4>
</mat-chip-row> </div>
<input placeholder="{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.MANDATORY-PLACEHOLDER' | translate}}" <div class="col-4">
[matChipInputFor]="cc" <mat-form-field class="col-md-12">
[matChipInputSeparatorKeyCodes]="separatorKeysCodes" <mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.PRIORITY-KEY' | translate}}</mat-label>
[matChipInputAddOnBlur]="true" <input matInput [formControl]="formGroup.get('value').get('priorityKey')">
(matChipInputTokenEnd)="addChipListValues('cc',$event)"/> <mat-error *ngIf="formGroup.get('value').get('priorityKey').hasError('backendError')">{{formGroup.get('value').get('priorityKey').getError('backendError').message}}</mat-error>
</mat-chip-grid> <mat-error *ngIf="formGroup.get('value').get('priorityKey').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
<mat-error *ngIf="formGroup.get('value').get('cc').hasError('backendError')">{{formGroup.get('value').get('cc').getError('backendError').message}}</mat-error> </mat-form-field>
</mat-form-field> </div>
</div> <div class="col-4" >
<div class="col-4"> <mat-form-field class="chip-list">
<mat-form-field class="col-auto"> <mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.CC' | translate}}</mat-label>
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.CC-MODE' | translate}}</mat-label> <mat-chip-grid #cc [formControl]="formGroup.get('value').get('cc')">
<mat-select name="ccMode" [formControl]="formGroup.get('value').get('ccMode')"> <mat-chip-row *ngFor="let field of ccValues"
<mat-option *ngFor="let emailOverrideMode of emailOverrideModeEnum" [value]="emailOverrideMode"> (removed)="removeChipListValues('cc', field)"
{{enumUtils.toEmailOverrideModeString(emailOverrideMode)}} [editable]="true"
</mat-option> (edited)="editChipListValues('cc', $event, field)">
</mat-select> {{field}}
<mat-error *ngIf="formGroup.get('value').get('ccMode').hasError('backendError')">{{formGroup.get('value').get('ccMode').getError('backendError').message}}</mat-error> <button matChipRemove>
<mat-error *ngIf="formGroup.get('value').get('ccMode').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-icon>cancel</mat-icon>
</mat-form-field> </button>
</div> </mat-chip-row>
<div class="col-4" > <input placeholder="{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.MANDATORY-PLACEHOLDER' | translate}}"
<mat-form-field class="chip-list"> [matChipInputFor]="cc"
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.BCC' | translate}}</mat-label> [matChipInputSeparatorKeyCodes]="separatorKeysCodes"
<mat-chip-grid #bcc [formControl]="formGroup.get('value').get('bcc')"> [matChipInputAddOnBlur]="true"
<mat-chip-row *ngFor="let field of bccValues" (matChipInputTokenEnd)="addChipListValues('cc',$event)"/>
(removed)="removeChipListValues('bcc', field)" </mat-chip-grid>
[editable]="true" <mat-error *ngIf="formGroup.get('value').get('cc').hasError('backendError')">{{formGroup.get('value').get('cc').getError('backendError').message}}</mat-error>
(edited)="editChipListValues('bcc', $event, field)"> </mat-form-field>
{{field}} </div>
<button matChipRemove> <div class="col-4">
<mat-icon>cancel</mat-icon> <mat-form-field class="col-auto">
</button> <mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.CC-MODE' | translate}}</mat-label>
</mat-chip-row> <mat-select name="ccMode" [formControl]="formGroup.get('value').get('ccMode')">
<input placeholder="{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.MANDATORY-PLACEHOLDER' | translate}}" <mat-option *ngFor="let emailOverrideMode of emailOverrideModeEnum" [value]="emailOverrideMode">
[matChipInputFor]="bcc" {{enumUtils.toEmailOverrideModeString(emailOverrideMode)}}
[matChipInputSeparatorKeyCodes]="separatorKeysCodes" </mat-option>
[matChipInputAddOnBlur]="true" </mat-select>
(matChipInputTokenEnd)="addChipListValues('bcc',$event)"/> <mat-error *ngIf="formGroup.get('value').get('ccMode').hasError('backendError')">{{formGroup.get('value').get('ccMode').getError('backendError').message}}</mat-error>
</mat-chip-grid> <mat-error *ngIf="formGroup.get('value').get('ccMode').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
<mat-error *ngIf="formGroup.get('value').get('bcc').hasError('backendError')">{{formGroup.get('value').get('bcc').getError('backendError').message}}</mat-error> </mat-form-field>
</mat-form-field> </div>
</div> <div class="col-4" >
<div class="col-4"> <mat-form-field class="chip-list">
<mat-form-field class="col-auto"> <mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.BCC' | translate}}</mat-label>
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.BCC-MODE' | translate}}</mat-label> <mat-chip-grid #bcc [formControl]="formGroup.get('value').get('bcc')">
<mat-select name="bccMode" [formControl]="formGroup.get('value').get('bccMode')"> <mat-chip-row *ngFor="let field of bccValues"
<mat-option *ngFor="let emailOverrideMode of emailOverrideModeEnum" [value]="emailOverrideMode"> (removed)="removeChipListValues('bcc', field)"
{{enumUtils.toEmailOverrideModeString(emailOverrideMode)}} [editable]="true"
</mat-option> (edited)="editChipListValues('bcc', $event, field)">
</mat-select> {{field}}
<mat-error *ngIf="formGroup.get('value').get('bccMode').hasError('backendError')">{{formGroup.get('value').get('bccMode').getError('backendError').message}}</mat-error> <button matChipRemove>
<mat-error *ngIf="formGroup.get('value').get('bccMode').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-icon>cancel</mat-icon>
</mat-form-field> </button>
</div> </mat-chip-row>
<div class="col-4" > <input placeholder="{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.MANDATORY-PLACEHOLDER' | translate}}"
<mat-form-field class="chip-list"> [matChipInputFor]="bcc"
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.EXTRA-DATA-KEYS' | translate}}</mat-label> [matChipInputSeparatorKeyCodes]="separatorKeysCodes"
<mat-chip-grid #extraDataKeys [formControl]="formGroup.get('value').get('extraDataKeys')"> [matChipInputAddOnBlur]="true"
<mat-chip-row *ngFor="let field of extraDataKeys" (matChipInputTokenEnd)="addChipListValues('bcc',$event)"/>
(removed)="removeChipListValues('extraDataKeys', field)" </mat-chip-grid>
[editable]="true" <mat-error *ngIf="formGroup.get('value').get('bcc').hasError('backendError')">{{formGroup.get('value').get('bcc').getError('backendError').message}}</mat-error>
(edited)="editChipListValues('extraDataKeys', $event, field)"> </mat-form-field>
{{field}} </div>
<button matChipRemove> <div class="col-4">
<mat-icon>cancel</mat-icon> <mat-form-field class="col-auto">
</button> <mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.BCC-MODE' | translate}}</mat-label>
</mat-chip-row> <mat-select name="bccMode" [formControl]="formGroup.get('value').get('bccMode')">
<input placeholder="{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.MANDATORY-PLACEHOLDER' | translate}}" <mat-option *ngFor="let emailOverrideMode of emailOverrideModeEnum" [value]="emailOverrideMode">
[matChipInputFor]="extraDataKeys" {{enumUtils.toEmailOverrideModeString(emailOverrideMode)}}
[matChipInputSeparatorKeyCodes]="separatorKeysCodes" </mat-option>
[matChipInputAddOnBlur]="true" </mat-select>
(matChipInputTokenEnd)="addChipListValues('extraDataKeys',$event)"/> <mat-error *ngIf="formGroup.get('value').get('bccMode').hasError('backendError')">{{formGroup.get('value').get('bccMode').getError('backendError').message}}</mat-error>
</mat-chip-grid> <mat-error *ngIf="formGroup.get('value').get('bccMode').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
<mat-error *ngIf="formGroup.get('value').get('extraDataKeys').hasError('backendError')">{{formGroup.get('value').get('extraDataKeys').getError('backendError').message}}</mat-error> </mat-form-field>
</mat-form-field> </div>
</div> <div class="col-4" >
</div> <mat-form-field class="chip-list">
</mat-card-content> <mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.EXTRA-DATA-KEYS' | translate}}</mat-label>
</mat-card> <mat-chip-grid #extraDataKeys [formControl]="formGroup.get('value').get('extraDataKeys')">
</form> <mat-chip-row *ngFor="let field of extraDataKeys"
(removed)="removeChipListValues('extraDataKeys', field)"
[editable]="true"
(edited)="editChipListValues('extraDataKeys', $event, field)">
{{field}}
<button matChipRemove>
<mat-icon>cancel</mat-icon>
</button>
</mat-chip-row>
<input placeholder="{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.MANDATORY-PLACEHOLDER' | translate}}"
[matChipInputFor]="extraDataKeys"
[matChipInputSeparatorKeyCodes]="separatorKeysCodes"
[matChipInputAddOnBlur]="true"
(matChipInputTokenEnd)="addChipListValues('extraDataKeys',$event)"/>
</mat-chip-grid>
<mat-error *ngIf="formGroup.get('value').get('extraDataKeys').hasError('backendError')">{{formGroup.get('value').get('extraDataKeys').getError('backendError').message}}</mat-error>
</mat-form-field>
</div>
</div>
</mat-card-content>
</mat-card>
</form>
</div> </div>
</div> </div>

101
dmp-frontend/src/app/ui/admin/notification/filters/notification-listing-filters.component.html
View File

@ -20,55 +20,62 @@
{{'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.FILTER.IS-ACTIVE' | translate}} {{'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.FILTER.IS-ACTIVE' | translate}}
</mat-slide-toggle> </mat-slide-toggle>
<div> <div class="mt-4">
<mat-form-field class="col-12"> <div>
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.FILTER.USERS' | translate}}</mat-label> <mat-form-field class="col-12">
<app-multiple-auto-complete [(ngModel)]="internalFilters.userIds" [hidePlaceholder]="true" [separatorKeysCodes]="separatorKeysCodes" [configuration]="userAutoCompleteConfiguration"> <mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.FILTER.USERS' | translate}}</mat-label>
</app-multiple-auto-complete> <app-multiple-auto-complete [(ngModel)]="internalFilters.userIds" [hidePlaceholder]="true" [separatorKeysCodes]="separatorKeysCodes" [configuration]="userAutoCompleteConfiguration">
</mat-form-field> </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">
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.FILTER.NOTIFICATION-TYPE' | translate}}
<mat-select multiple [(ngModel)]="internalFilters.type">
<mat-option *ngFor="let type of notificationTypeEnumValues" [value]="type">{{enumUtils.toNotificationTypeString(type)}}</mat-option>
</mat-select>
</mat-label>
</div>
<div>
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.FILTER.CONTACT-TYPE' | translate}}
<mat-select multiple [(ngModel)]="internalFilters.contactType">
<mat-option *ngFor="let contactType of notificationContactTypeEnumValues" [value]="contactType">{{enumUtils.toNotificationContactTypeString(contactType)}}</mat-option>
</mat-select>
</mat-label>
</div>
<div>
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.FILTER.NOTIFY-STATE' | translate}}
<mat-select multiple [(ngModel)]="internalFilters.notifyState">
<mat-option *ngFor="let notifyState of notificationNotifyStateEnumValues" [value]="notifyState">{{enumUtils.toNotificationNotifyStateString(notifyState)}}</mat-option>
</mat-select>
</mat-label>
</div>
<div>
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.FILTER.TRACKING-STATE' | translate}}
<mat-select multiple [(ngModel)]="internalFilters.trackingState">
<mat-option *ngFor="let trackingState of notificationTrackingStateEnumValues" [value]="trackingState">{{enumUtils.toNotificationTrackingStateString(trackingState)}}</mat-option>
</mat-select>
</mat-label>
</div>
<div>
<mat-label>{{'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.FILTER.TRACKING-PROCESS' | translate}}
<mat-select multiple [(ngModel)]="internalFilters.trackingProcess">
<mat-option *ngFor="let trackingProcess of notificationTrackingProcessEnumValues" [value]="trackingProcess">{{enumUtils.toNotificationTrackingProcessString(trackingProcess)}}</mat-option>
</mat-select>
</mat-label>
</div>
<div class="d-flex justify-content-end align-items-center mt-4 gap-1-rem">
<button mat-stroked-button color="primary" (click)="filterMenuTrigger?.closeMenu()"> <button mat-stroked-button color="primary" (click)="filterMenuTrigger?.closeMenu()">
{{'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.FILTER.CANCEL' | translate}} {{'NOTIFICATION-SERVICE.NOTIFICATION-LISTING.FILTER.CANCEL' | translate}}
</button> </button>

9
dmp-frontend/src/app/ui/admin/notification/notification-listing.component.scss
View File

@ -1,3 +1,12 @@
::ng-deep datatable-header-cell {
width: fit-content !important;
padding: 0.9rem 0.7rem !important;
}
::ng-deep .datatable-header-cell-template-wrap {
width: fit-content !important;
}
.notification-listing { .notification-listing {
margin-top: 1.3rem; margin-top: 1.3rem;
margin-left: 1rem; margin-left: 1rem;

3
dmp-frontend/src/assets/i18n/en.json
View File

@ -2052,7 +2052,8 @@
}, },
"SUCCESSFUL-DELETE": "Successful Delete", "SUCCESSFUL-DELETE": "Successful Delete",
"UNSUCCESSFUL-DELETE": "This item could not be deleted.", "UNSUCCESSFUL-DELETE": "This item could not be deleted.",
"TEMPLATE-UPLOAD-SUCCESS": "Template successfully uploaded" "TEMPLATE-UPLOAD-SUCCESS": "Template successfully uploaded",
"MESSAGES": "Template successfully uploaded"
}, },
"DYNAMIC-FORM": { "DYNAMIC-FORM": {
"FIELDS": { "FIELDS": {