2023-12-19 18:08:17 +01:00
|
|
|
import { Component, OnInit } from '@angular/core';
|
|
|
|
import { FormArray, UntypedFormGroup } from '@angular/forms';
|
|
|
|
import { MatDialog } from '@angular/material/dialog';
|
|
|
|
import { AuthService } from '@app/core/services/auth/auth.service';
|
|
|
|
import { FormService } from '@common/forms/form-service';
|
|
|
|
import { ConfirmationDialogComponent } from '@common/modules/confirmation-dialog/confirmation-dialog.component';
|
|
|
|
import { HttpErrorHandlingService } from '@common/modules/errors/error-handling/http-error-handling.service';
|
|
|
|
import { SnackBarNotificationLevel, UiNotificationService } from '@app/core/services/notification/ui-notification-service';
|
|
|
|
import { TranslateService } from '@ngx-translate/core';
|
|
|
|
import { NotificationTemplateKind } from '@app/core/common/enum/notification-template-kind';
|
|
|
|
import { AppPermission } from '@app/core/common/enum/permission.enum';
|
|
|
|
import { NotificationTemplate, NotificationTemplatePersist } from '@app/core/model/notification-template/notification-template';
|
|
|
|
import { NotificationTemplateService } from '@app/core/services/notification-template/notification-template.service';
|
|
|
|
import { NotificationFieldInfoEditorModel, NotificationFieldOptionsEditorModel, NotificationTemplateEditorModel } from './notification-template-editor.model';
|
|
|
|
import { map, takeUntil } from 'rxjs/operators';
|
|
|
|
import { BaseEditor } from '@common/base/base-editor';
|
|
|
|
import { ActivatedRoute, Router } from '@angular/router';
|
|
|
|
import { FilterService } from '@common/modules/text-filter/filter-service';
|
|
|
|
import { DatePipe } from '@angular/common';
|
|
|
|
import { QueryParamsService } from '@app/core/services/utilities/query-params.service';
|
|
|
|
import { EnumUtils } from '@app/core/services/utilities/enum-utils.service';
|
|
|
|
import { MatomoService } from '@app/core/services/matomo/matomo-service';
|
|
|
|
import { NotificationTemplateEditorService } from './notification-template-editor.service';
|
|
|
|
import { Guid } from '@common/types/guid';
|
|
|
|
import { NotificationTemplateEditorResolver } from './notification-template-editor.resolver';
|
|
|
|
import { IsActive } from '@app/core/common/enum/is-active.enum';
|
|
|
|
import { LoggingService } from '@app/core/services/logging/logging-service';
|
|
|
|
import { LanguageHttpService } from '@app/core/services/language/language.http.service';
|
|
|
|
import { Language } from '@app/core/model/language/language';
|
|
|
|
import { nameof } from 'ts-simple-nameof';
|
|
|
|
import { NotificationTemplateChannel } from '@app/core/common/enum/notification-template-channel';
|
|
|
|
import { MatChipEditedEvent, MatChipInputEvent } from '@angular/material/chips';
|
|
|
|
import { MatCheckboxChange } from '@angular/material/checkbox';
|
|
|
|
import { NotificationDataType } from '@app/core/common/enum/notification-data-type';
|
|
|
|
import { EmailOverrideMode } from '@app/core/common/enum/email-override-mode';
|
|
|
|
|
|
|
|
@Component({
|
|
|
|
selector: 'app-notification-template-editor',
|
|
|
|
templateUrl: './notification-template-editor.component.html',
|
|
|
|
styleUrls: ['./notification-template-editor.component.scss'],
|
|
|
|
providers: [NotificationTemplateEditorService]
|
|
|
|
})
|
|
|
|
export class NotificationTemplateEditorComponent extends BaseEditor<NotificationTemplateEditorModel, NotificationTemplate> implements OnInit {
|
|
|
|
|
|
|
|
isNew = true;
|
|
|
|
isDeleted = false;
|
|
|
|
formGroup: UntypedFormGroup = null;
|
|
|
|
availableLanguageCodes: string[] = [];
|
|
|
|
subjectMandatoryFields: string[] = [];
|
|
|
|
bodyMandatoryFields: string[] = [];
|
|
|
|
subjectFieldOptionsEnabled: Boolean = false;
|
|
|
|
bodyFieldOptionsEnabled: Boolean = false;
|
|
|
|
ccValues: string[] = [];
|
|
|
|
bccValues: string[] = [];
|
|
|
|
extraDataKeys: string[] = [];
|
2023-12-20 17:02:55 +01:00
|
|
|
languageCode: string;
|
|
|
|
formatting: { [key: string]: string } = {};
|
2023-12-19 18:08:17 +01:00
|
|
|
public notificationTemplateKindEnum = this.enumUtils.getEnumValues(NotificationTemplateKind);
|
|
|
|
public notificationTemplateChannelEnum = this.enumUtils.getEnumValues(NotificationTemplateChannel);
|
|
|
|
public notificationDataTypeEnum = this.enumUtils.getEnumValues(NotificationDataType);
|
|
|
|
public emailOverrideModeEnum = this.enumUtils.getEnumValues(EmailOverrideMode);
|
|
|
|
|
|
|
|
protected get canDelete(): boolean {
|
|
|
|
return !this.isDeleted && !this.isNew && this.hasPermission(this.authService.permissionEnum.DeleteNotificationTemplate);
|
|
|
|
}
|
|
|
|
|
|
|
|
protected get canSave(): boolean {
|
|
|
|
return !this.isDeleted && this.hasPermission(this.authService.permissionEnum.EditNotificationTemplate);
|
|
|
|
}
|
|
|
|
|
|
|
|
private hasPermission(permission: AppPermission): boolean {
|
|
|
|
return this.authService.hasPermission(permission) || this.editorModel?.permissions?.includes(permission);
|
|
|
|
}
|
|
|
|
|
|
|
|
constructor(
|
|
|
|
// BaseFormEditor injected dependencies
|
|
|
|
protected dialog: MatDialog,
|
|
|
|
protected language: TranslateService,
|
|
|
|
protected formService: FormService,
|
|
|
|
protected router: Router,
|
|
|
|
protected uiNotificationService: UiNotificationService,
|
|
|
|
protected httpErrorHandlingService: HttpErrorHandlingService,
|
|
|
|
protected filterService: FilterService,
|
|
|
|
protected datePipe: DatePipe,
|
|
|
|
protected route: ActivatedRoute,
|
|
|
|
protected queryParamsService: QueryParamsService,
|
|
|
|
// Rest dependencies. Inject any other needed deps here:
|
|
|
|
public authService: AuthService,
|
|
|
|
public enumUtils: EnumUtils,
|
|
|
|
private languageHttpService: LanguageHttpService,
|
|
|
|
private notificationTemplateService: NotificationTemplateService,
|
|
|
|
private notificationTemplateEditorService: NotificationTemplateEditorService,
|
|
|
|
private logger: LoggingService,
|
|
|
|
private matomoService: MatomoService
|
|
|
|
) {
|
|
|
|
super(dialog, language, formService, router, uiNotificationService, httpErrorHandlingService, filterService, datePipe, route, queryParamsService);
|
|
|
|
}
|
|
|
|
|
|
|
|
// ngOnInit(): void {
|
|
|
|
// this.editorModel = new NotificationTemplateEditorModel().fromModel(this.notificationTemplate);
|
|
|
|
// this.formGroup = this.editorModel.buildForm(null, this.editorModel.kind === NotificationTemplateKind.Default ? true : !this.authService.permissionEnum.EditDescription);
|
|
|
|
// }
|
|
|
|
|
|
|
|
ngOnInit(): void {
|
|
|
|
this.matomoService.trackPageView('Admin: Notification Tempplates');
|
|
|
|
super.ngOnInit();
|
|
|
|
this.languageHttpService.queryAvailableCodes(this.languageHttpService.buildAutocompleteLookup())
|
|
|
|
.pipe(takeUntil(this._destroyed))
|
|
|
|
.subscribe(
|
|
|
|
data => this.availableLanguageCodes = data.items,
|
|
|
|
);
|
|
|
|
}
|
|
|
|
|
|
|
|
getItem(itemId: Guid, successFunction: (item: NotificationTemplate) => void) {
|
|
|
|
this.notificationTemplateService.getSingle(itemId, NotificationTemplateEditorResolver.lookupFields())
|
|
|
|
.pipe(map(data => data as NotificationTemplate), takeUntil(this._destroyed))
|
|
|
|
.subscribe(
|
|
|
|
data => successFunction(data),
|
|
|
|
error => this.onCallbackError(error)
|
|
|
|
);
|
|
|
|
}
|
|
|
|
|
|
|
|
prepareForm(data: NotificationTemplate) {
|
|
|
|
try {
|
|
|
|
this.editorModel = data ? new NotificationTemplateEditorModel().fromModel(data) : new NotificationTemplateEditorModel();
|
|
|
|
|
|
|
|
if(data){
|
|
|
|
if(data.value && data.value.subjectFieldOptions){
|
|
|
|
this.subjectFieldOptionsEnabled = true;
|
2023-12-20 17:02:55 +01:00
|
|
|
this.subjectMandatoryFields = data.value.subjectFieldOptions.mandatory;
|
2023-12-19 18:08:17 +01:00
|
|
|
}
|
2023-12-20 17:02:55 +01:00
|
|
|
if(data.value && data.value.bodyFieldOptions){
|
|
|
|
this.bodyFieldOptionsEnabled = true;
|
|
|
|
this.bodyMandatoryFields = data.value.bodyFieldOptions.mandatory;
|
|
|
|
}
|
|
|
|
this.ccValues = this.editorModel.value.cc;
|
|
|
|
this.bccValues = this.editorModel.value.bcc;
|
|
|
|
this.extraDataKeys = this.editorModel.value.extraDataKeys;
|
|
|
|
this.languageCode = data.language.code;
|
2023-12-19 18:08:17 +01:00
|
|
|
}
|
|
|
|
this.isDeleted = data ? data.isActive === IsActive.Inactive : false;
|
|
|
|
this.buildForm();
|
|
|
|
} catch (error) {
|
2023-12-20 17:02:55 +01:00
|
|
|
this.logger.error('Could not parse Notification Template item: ' + data + error);
|
2023-12-19 18:08:17 +01:00
|
|
|
this.uiNotificationService.snackBarNotification(this.language.instant('COMMONS.ERRORS.DEFAULT'), SnackBarNotificationLevel.Error);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
buildForm() {
|
|
|
|
this.formGroup = this.editorModel.buildForm(null, this.isDeleted || !this.authService.hasPermission(AppPermission.EditNotificationTemplate));
|
|
|
|
this.notificationTemplateEditorService.setValidationErrorModel(this.editorModel.validationErrorModel);
|
|
|
|
}
|
|
|
|
|
|
|
|
refreshData(): void {
|
|
|
|
this.getItem(this.editorModel.id, (data: NotificationTemplate) => this.prepareForm(data));
|
|
|
|
}
|
|
|
|
|
|
|
|
refreshOnNavigateToData(id?: Guid): void {
|
|
|
|
this.formGroup.markAsPristine();
|
|
|
|
let route = [];
|
|
|
|
|
|
|
|
if (id === null) {
|
|
|
|
route.push('../..');
|
|
|
|
} else if (this.isNew) {
|
|
|
|
route.push('../' + id);
|
|
|
|
} else {
|
|
|
|
route.push('..');
|
|
|
|
}
|
|
|
|
|
|
|
|
this.router.navigate(route, { queryParams: { 'lookup': this.queryParamsService.serializeLookup(this.lookupParams), 'lv': ++this.lv }, replaceUrl: true, relativeTo: this.route });
|
|
|
|
}
|
|
|
|
|
|
|
|
persistEntity(onSuccess?: (response) => void): void {
|
|
|
|
const formData = this.formService.getValue(this.formGroup.value) as NotificationTemplatePersist;
|
|
|
|
|
|
|
|
this.notificationTemplateService.persist(formData)
|
|
|
|
.pipe(takeUntil(this._destroyed)).subscribe(
|
|
|
|
complete => onSuccess ? onSuccess(complete) : this.onCallbackSuccess(complete),
|
|
|
|
error => this.onCallbackError(error)
|
|
|
|
);
|
|
|
|
}
|
|
|
|
|
|
|
|
formSubmit(): void {
|
|
|
|
this.formService.touchAllFormFields(this.formGroup);
|
|
|
|
if (!this.isFormValid()) {
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
|
|
|
|
this.persistEntity();
|
|
|
|
}
|
|
|
|
|
|
|
|
public delete() {
|
|
|
|
const value = this.formGroup.value;
|
|
|
|
if (value.id) {
|
|
|
|
const dialogRef = this.dialog.open(ConfirmationDialogComponent, {
|
|
|
|
maxWidth: '300px',
|
|
|
|
data: {
|
|
|
|
message: this.language.instant('GENERAL.CONFIRMATION-DIALOG.DELETE-ITEM'),
|
|
|
|
confirmButton: this.language.instant('GENERAL.CONFIRMATION-DIALOG.ACTIONS.CONFIRM'),
|
|
|
|
cancelButton: this.language.instant('GENERAL.CONFIRMATION-DIALOG.ACTIONS.CANCEL')
|
|
|
|
}
|
|
|
|
});
|
|
|
|
dialogRef.afterClosed().pipe(takeUntil(this._destroyed)).subscribe(result => {
|
|
|
|
if (result) {
|
|
|
|
this.notificationTemplateService.delete(value.id).pipe(takeUntil(this._destroyed))
|
|
|
|
.subscribe(
|
|
|
|
complete => this.onCallbackSuccess(),
|
|
|
|
error => this.onCallbackError(error)
|
|
|
|
);
|
|
|
|
}
|
|
|
|
});
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
clearErrorModel() {
|
|
|
|
this.editorModel.validationErrorModel.clear();
|
|
|
|
this.formService.validateAllFormFields(this.formGroup);
|
|
|
|
}
|
|
|
|
|
|
|
|
selectedLangChanged(code: string){
|
|
|
|
|
|
|
|
this.languageHttpService.getSingleWithCode(code, [nameof<Language>(x => x.id),nameof<Language>(x => x.code)])
|
|
|
|
.pipe(takeUntil(this._destroyed))
|
|
|
|
.subscribe(
|
|
|
|
data => {
|
2023-12-20 17:02:55 +01:00
|
|
|
this.formGroup.get('languageId').patchValue(data.id);
|
|
|
|
console.log(this.formGroup);
|
|
|
|
}
|
2023-12-19 18:08:17 +01:00
|
|
|
);
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
subjectFieldOptionsSelectionChanged(matCheckBox: MatCheckboxChange){
|
|
|
|
if(matCheckBox.checked == true){
|
|
|
|
this.subjectFieldOptionsEnabled = true;
|
|
|
|
}else{
|
|
|
|
this.subjectFieldOptionsEnabled = false;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
bodyFieldOptionsSelectionChanged(matCheckBox: MatCheckboxChange){
|
|
|
|
if(matCheckBox.checked == true){
|
|
|
|
this.bodyFieldOptionsEnabled = true;
|
|
|
|
}else{
|
|
|
|
this.bodyFieldOptionsEnabled = false;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
// chip lists
|
|
|
|
|
|
|
|
addChipListValues(type: string, event: MatChipInputEvent){
|
|
|
|
if(type == "cc"){
|
|
|
|
this.ccValues = this.add(event, this.ccValues);
|
|
|
|
}else if(type == "bcc"){
|
|
|
|
this.bccValues = this.add(event, this.bccValues);
|
|
|
|
}else if(type == "extraDataKeys"){
|
|
|
|
this.extraDataKeys = this.add(event, this.extraDataKeys);
|
|
|
|
}else if(type == "subject"){
|
|
|
|
this.subjectMandatoryFields = this.add(event, this.subjectMandatoryFields);
|
|
|
|
}else if(type == "body"){
|
|
|
|
this.bodyMandatoryFields = this.add(event, this.bodyMandatoryFields);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
editChipListValues(type: string, event: MatChipEditedEvent, field: string){
|
|
|
|
if(type == "cc"){
|
|
|
|
this.ccValues = this.edit(field, this.ccValues, event);
|
|
|
|
}else if(type == "bcc"){
|
|
|
|
this.bccValues = this.edit(field, this.bccValues, event);
|
|
|
|
}else if(type == "extraDataKeys"){
|
|
|
|
this.extraDataKeys = this.edit(field, this.extraDataKeys, event);
|
|
|
|
}else if(type == "subject"){
|
|
|
|
this.subjectMandatoryFields = this.edit(field, this.subjectMandatoryFields, event);
|
|
|
|
}else if(type == "body"){
|
|
|
|
this.bodyMandatoryFields = this.edit(field, this.bodyMandatoryFields, event);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
removeChipListValues(type: string, field: string){
|
|
|
|
if(type == "cc"){
|
|
|
|
this.ccValues = this.remove(field, this.ccValues);
|
|
|
|
}else if(type == "bcc"){
|
|
|
|
this.bccValues = this.remove(field, this.bccValues);
|
|
|
|
}else if(type == "extraDataKeys"){
|
|
|
|
this.extraDataKeys = this.remove(field, this.extraDataKeys);
|
|
|
|
}else if(type == "subject"){
|
|
|
|
this.subjectMandatoryFields = this.remove(field, this.subjectMandatoryFields);
|
|
|
|
}else if(type == "body"){
|
|
|
|
this.bodyMandatoryFields = this.remove(field, this.bodyMandatoryFields);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
add(event: MatChipInputEvent, values: string[]) {
|
|
|
|
const value = (event.value || '').trim();
|
|
|
|
|
|
|
|
if (value) values.push(value)
|
|
|
|
event.chipInput!.clear();
|
|
|
|
return values;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
remove(field: string, values: string[]) {
|
|
|
|
const index = values.indexOf(field);
|
|
|
|
|
|
|
|
if (index >= 0) values.splice(index, 1);
|
|
|
|
return values;
|
|
|
|
}
|
|
|
|
|
|
|
|
edit(field: string, values: string[], event: MatChipEditedEvent) {
|
|
|
|
const value = event.value.trim();
|
|
|
|
|
|
|
|
if (!value) {
|
|
|
|
values = this.remove(field, values);
|
|
|
|
return values;
|
|
|
|
}
|
|
|
|
|
|
|
|
const index = values.indexOf(field);
|
|
|
|
if (index >= 0) values[index] = value
|
|
|
|
|
|
|
|
return values;
|
|
|
|
}
|
|
|
|
|
|
|
|
//options fields
|
|
|
|
|
|
|
|
addOptionalItem(formGroup: UntypedFormGroup) {
|
|
|
|
const fieldInfo: NotificationFieldInfoEditorModel = new NotificationFieldInfoEditorModel();
|
2023-12-20 17:02:55 +01:00
|
|
|
(formGroup.get('optional') as FormArray).push(fieldInfo.buildForm());
|
2023-12-19 18:08:17 +01:00
|
|
|
}
|
|
|
|
|
|
|
|
removeOptionalItem(formGroup: UntypedFormGroup, optionalIndex: number): void {
|
2023-12-20 17:02:55 +01:00
|
|
|
(formGroup.get('optional') as FormArray).removeAt(optionalIndex);
|
|
|
|
}
|
|
|
|
|
|
|
|
insertFormattingItem(key: string, value: string){
|
|
|
|
this.formatting[key] = value;
|
|
|
|
// this.formGroup.get('value').get('subjectFieldOptions').get('formatting').patchValue(this.formatting); TODO
|
|
|
|
|
|
|
|
return key;
|
2023-12-19 18:08:17 +01:00
|
|
|
}
|
|
|
|
|
|
|
|
}
|