128 lines
4.0 KiB
TypeScript
128 lines
4.0 KiB
TypeScript
import { Component, Input, OnInit } from '@angular/core';
|
|
import { UntypedFormArray } from '@angular/forms';
|
|
import { NotificationServiceEnumUtils } from '@notification-service/core/formatting/enum-utils.service';
|
|
import { BaseComponent } from '@common/base/base.component';
|
|
import { ValidationErrorModel } from '@common/forms/validation/error-model/validation-error-model';
|
|
import { NotificationFieldInfoEditorModel, NotificationFieldOptionsEditorModel } from '../notification-template-editor.model';
|
|
import { MatChipEditedEvent, MatChipInputEvent } from '@angular/material/chips';
|
|
import { COMMA, ENTER } from '@angular/cdk/keycodes';
|
|
import { NotificationDataType } from '@notification-service/core/enum/notification-data-type';
|
|
|
|
@Component({
|
|
selector: 'app-notification-template-field-options-component',
|
|
templateUrl: 'notification-template-field-options.component.html',
|
|
styleUrls: ['./notification-template-field-options.component.scss']
|
|
})
|
|
export class NotificationTemplateFieldOptionsComponent extends BaseComponent implements OnInit {
|
|
|
|
@Input() form;
|
|
@Input() validationErrorModel: ValidationErrorModel = null;
|
|
@Input() validationRootPath: string = null;
|
|
@Input() mandatoryFields: string[] = [];
|
|
@Input() formatting: { [key: string]: string } = {};
|
|
|
|
public notificationDataTypeEnum = this.enumUtils.getEnumValues(NotificationDataType);
|
|
readonly separatorKeysCodes: number[] = [ENTER, COMMA];
|
|
|
|
constructor(
|
|
public enumUtils: NotificationServiceEnumUtils,
|
|
) { super(); }
|
|
|
|
ngOnInit() {
|
|
}
|
|
|
|
addChipListValues(event: MatChipInputEvent){
|
|
this.mandatoryFields = this.add(event, this.mandatoryFields);
|
|
}
|
|
|
|
editChipListValues(event: MatChipEditedEvent, field: string){
|
|
this.mandatoryFields = this.edit(field, this.mandatoryFields, event);
|
|
this.editFormmattingKey(field, event.value.trim());
|
|
}
|
|
|
|
removeChipListValues(field: string){
|
|
this.mandatoryFields = this.remove(field, this.mandatoryFields);
|
|
this.deleteFormattingItem(field);
|
|
}
|
|
|
|
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() {
|
|
const formArray = (this.form.get('optional') as UntypedFormArray);
|
|
const optional: NotificationFieldInfoEditorModel = new NotificationFieldInfoEditorModel(this.validationErrorModel);
|
|
|
|
formArray.push(optional.buildForm({ rootPath: this.validationRootPath + 'optional[' + formArray.length + '].' }));
|
|
}
|
|
|
|
removeSubjectOptionalItem(optionalIndex: number): void {
|
|
const key = (this.form.get('optional') as UntypedFormArray).at(optionalIndex).get("key").value;
|
|
this.deleteFormattingItem(key);
|
|
|
|
(this.form.get('optional') as UntypedFormArray).removeAt(optionalIndex);
|
|
|
|
//Reapply validators
|
|
NotificationFieldOptionsEditorModel.reapplyValidators(
|
|
{
|
|
formGroup: this.form,
|
|
validationErrorModel: this.validationErrorModel,
|
|
rootPath: this.validationRootPath
|
|
}
|
|
);
|
|
this.form.get('optional').markAsDirty();
|
|
}
|
|
|
|
// subject formatting
|
|
insertFormattingItem(key: string, value: string){
|
|
this.formatting[key] = value;
|
|
this.form.get('formatting').setValue(this.formatting);
|
|
}
|
|
|
|
formattingValueChange(event: Event, key: string){
|
|
this.formatting[key] = (event.target as HTMLInputElement).value;
|
|
this.form.get('formatting').setValue(this.formatting);
|
|
}
|
|
|
|
editFormmattingKey(oldKey: string, newKey: string){
|
|
this.insertFormattingItem(newKey, this.formatting[oldKey]);
|
|
this.deleteFormattingItem(oldKey);
|
|
}
|
|
|
|
deleteFormattingItem(key:string){
|
|
if (key in this.formatting) {
|
|
delete this.formatting[key];
|
|
this.form.get('formatting').setValue(this.formatting);
|
|
}
|
|
}
|
|
|
|
}
|