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

fix formatting notification template UI

This commit is contained in:
amentis 2024-01-03 16:46:57 +02:00
parent b87612c783
commit 438333786b
5 changed files with 96 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
dmp-backend/notification-service/notification/src/main/java/gr/cite/notification/service/message/builder/EmailMessageBuilder.java
View File

@ -80,15 +80,16 @@ public class EmailMessageBuilder extends MessageBuilderBase implements MessageBu
String bodyTemplate = null;
ReplaceResult bodyResult = null;
// fallback
if (template != null && template.getValue() != null){
if (!StringUtils.isNullOrEmpty(template.getValue().getSubjectKey())) subjectTemplate = messageInfo.getFields().stream().filter(fieldInfo -> fieldInfo.getKey().equals(template.getValue().getSubjectKey())).findFirst().orElse(new FieldInfo()).getValue();
if (StringUtils.isNullOrEmpty(subjectTemplate)) subjectTemplate = template.getValue().getSubjectText();
//TODO add formatting function with db fields
subjectResult = this.buildTemplate(notification.getId(), subjectTemplate, messageInfo, template.getValue().getSubjectFieldOptions(), null, cipherFields.get(notification.getType()));
FieldFormatting subjectFormatting = this.buildFieldFormatting(template.getValue().getSubjectFieldOptions());
subjectResult = this.buildTemplate(notification.getId(), subjectTemplate, messageInfo, template.getValue().getSubjectFieldOptions(), subjectFormatting, cipherFields.get(notification.getType()));
if(!StringUtils.isNullOrEmpty(template.getValue().getBodyKey())) bodyTemplate = messageInfo.getFields().stream().filter(fieldInfo -> fieldInfo.getKey().equals(template.getValue().getBodyKey())).findFirst().orElse(new FieldInfo()).getValue();
if (StringUtils.isNullOrEmpty(bodyTemplate)) bodyTemplate = template.getValue().getBodyText();
FieldFormatting bodyFormatting = this.buildFieldFormatting(flow.getBodyFieldOptions());
FieldFormatting bodyFormatting = this.buildFieldFormatting(template.getValue().getBodyFieldOptions());
bodyResult = this.buildTemplate(notification.getId(), bodyTemplate, messageInfo, template.getValue().getBodyFieldOptions(), bodyFormatting, cipherFields.get(notification.getType()));
}else {
if(!StringUtils.isNullOrEmpty(flow.getSubjectKey())) subjectTemplate = messageInfo.getFields().stream().filter(fieldInfo -> fieldInfo.getKey().equals(flow.getSubjectKey())).findFirst().orElse(new FieldInfo()).getValue();

11
dmp-backend/notification-service/notification/src/main/java/gr/cite/notification/service/message/common/MessageBuilderBase.java
View File

@ -154,6 +154,17 @@ public abstract class MessageBuilderBase {
return formatting;
}
protected FieldFormatting buildFieldFormatting(FieldOptions options) {
FieldFormatting formatting = new FieldFormatting();
if (options == null || options.getFormatting() == null) return formatting;
for (Map.Entry<String, String> pair : options.getFormatting().entrySet()) {
if (StringUtils.isNullOrEmpty(pair.getValue())) continue;
formatting.put(pair.getKey(), pair.getValue());
}
return formatting;
}
//TODO: Here check with a language accepted list and fallback to default
protected String lookupOrReadLocalizedFile(NotificationProperties.Template.TemplateCache templateCache, String path, String language) {
String filename = path.replace("{language}", language);

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

@ -134,7 +134,7 @@
<mat-error *ngIf="subjectOptions.get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field>
<div class="col-auto">
<button mat-icon-button (click)="removeOptionalItem(formGroup.get('value').get('subjectFieldOptions'),i)" [disabled]="formGroup.disabled">
<button mat-icon-button (click)="removeSubjectOptionalItem(i)" [disabled]="formGroup.disabled">
<mat-icon>remove</mat-icon>
</button>
</div>
@ -152,22 +152,22 @@
<div class="row" *ngFor="let item of formGroup.get('value').get('subjectFieldOptions').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]="insertFormattingItem(item, null)" [disabled] = "true">
<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>
<input matInput [value] ="subjectFormatting[item]" (change)="subjectFormattingValueChange($event, item)">
</mat-form-field>
</div>
<div class="row" *ngFor="let item of formGroup.get('value').get('subjectFieldOptions').get('optional')['controls']; let i = index">
<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]="insertFormattingItem(item.value.key, null)" [disabled] = "true">
<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>
<input matInput [value]="subjectFormatting[item]" (change)="subjectFormattingValueChange($event, item)">
</mat-form-field>
</div>
</div>
@ -261,7 +261,7 @@
<mat-error *ngIf="bodyOptions.get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field>
<div class="col-auto">
<button mat-icon-button (click)="removeOptionalItem(formGroup.get('value').get('bodyFieldOptions'),i)" [disabled]="formGroup.disabled">
<button mat-icon-button (click)="removeBodyOptionalItem(i)" [disabled]="formGroup.disabled">
<mat-icon>remove</mat-icon>
</button>
</div>
@ -275,25 +275,25 @@
</div>
</div>
<h4 class="col-md-12">{{'NOTIFICATION-SERVICE.NOTIFICATION-TEMPLATE-EDITOR.FIELDS.FORMATTING' | translate}}</h4>
<div class="row" *ngFor="let item of formGroup.get('value').get('subjectFieldOptions').get('mandatory').value; let i = index">
<div class="row" *ngFor="let item of formGroup.get('value').get('bodyFieldOptions').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]="insertFormattingItem(item, null)" [disabled] = "true">
<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>
<input matInput [value] ="bodyFormatting[item]" (change)="bodyFormattingValueChange($event, item)">
</mat-form-field>
</div>
<div class="row" *ngFor="let item of formGroup.get('value').get('subjectFieldOptions').get('optional')['controls']; let i = index">
<div class="row" *ngFor="let item of formGroup.get('value').get('bodyFieldOptions').get('optional')['controls']; let i = index">
<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]="insertFormattingItem(item.value.key, null)" [disabled] = "true">
<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>
<input matInput [value]="bodyFormatting[item]" (change)="bodyFormattingValueChange($event, item)">
</mat-form-field>
</div>
</div>

81
dmp-frontend/src/app/ui/admin/notification-template/editor/notification-template-editor.component.ts
View File

@ -54,7 +54,8 @@ export class NotificationTemplateEditorComponent extends BaseEditor<Notification
bccValues: string[] = [];
extraDataKeys: string[] = [];
languageCode: string;
formatting: { [key: string]: string } = {};
subjectFormatting: { [key: string]: string } = {};
bodyFormatting: { [key: string]: string } = {};
public notificationTemplateKindEnum = this.enumUtils.getEnumValues(NotificationTemplateKind);
public notificationTemplateChannelEnum = this.enumUtils.getEnumValues(NotificationTemplateChannel);
public notificationDataTypeEnum = this.enumUtils.getEnumValues(NotificationDataType);
@ -96,11 +97,6 @@ export class NotificationTemplateEditorComponent extends BaseEditor<Notification
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();
@ -133,6 +129,12 @@ export class NotificationTemplateEditorComponent extends BaseEditor<Notification
this.bodyFieldOptionsEnabled = true;
this.bodyMandatoryFields = data.value.bodyFieldOptions.mandatory;
}
if(data.value && data.value.subjectFieldOptions && data.value.subjectFieldOptions.formatting){
this.subjectFormatting = data.value.subjectFieldOptions.formatting;
}
if(data.value && data.value.bodyFieldOptions && data.value.bodyFieldOptions.formatting){
this.bodyFormatting = data.value.bodyFieldOptions.formatting;
}
this.ccValues = this.editorModel.value.cc;
this.bccValues = this.editorModel.value.bcc;
this.extraDataKeys = this.editorModel.value.extraDataKeys;
@ -181,6 +183,7 @@ export class NotificationTemplateEditorComponent extends BaseEditor<Notification
}
formSubmit(): void {
console.log(this.formGroup);
this.formService.touchAllFormFields(this.formGroup);
if (!this.isFormValid()) {
return;
@ -224,7 +227,6 @@ export class NotificationTemplateEditorComponent extends BaseEditor<Notification
.subscribe(
data => {
this.formGroup.get('languageId').patchValue(data.id);
console.log(this.formGroup);
}
);
}
@ -271,8 +273,10 @@ export class NotificationTemplateEditorComponent extends BaseEditor<Notification
this.extraDataKeys = this.edit(field, this.extraDataKeys, event);
}else if(type == "subject"){
this.subjectMandatoryFields = this.edit(field, this.subjectMandatoryFields, event);
this.editSubjectFormmattingKey(field, event.value.trim());
}else if(type == "body"){
this.bodyMandatoryFields = this.edit(field, this.bodyMandatoryFields, event);
this.editBodyFormmattingKey(field, event.value.trim());
}
}
@ -285,8 +289,10 @@ export class NotificationTemplateEditorComponent extends BaseEditor<Notification
this.extraDataKeys = this.remove(field, this.extraDataKeys);
}else if(type == "subject"){
this.subjectMandatoryFields = this.remove(field, this.subjectMandatoryFields);
this.deleteSubjectFormattingItem(field);
}else if(type == "body"){
this.bodyMandatoryFields = this.remove(field, this.bodyMandatoryFields);
this.deleteBodyFormattingItem(field);
}
}
@ -327,15 +333,64 @@ export class NotificationTemplateEditorComponent extends BaseEditor<Notification
(formGroup.get('optional') as FormArray).push(fieldInfo.buildForm());
}
removeOptionalItem(formGroup: UntypedFormGroup, optionalIndex: number): void {
(formGroup.get('optional') as FormArray).removeAt(optionalIndex);
removeSubjectOptionalItem(optionalIndex: number): void {
const key = (this.formGroup.get('value').get('subjectFieldOptions').get('optional') as FormArray).at(optionalIndex).get("key").value;
this.deleteSubjectFormattingItem(key);
(this.formGroup.get('value').get('subjectFieldOptions').get('optional') as FormArray).removeAt(optionalIndex);
}
removeBodyOptionalItem(optionalIndex: number): void {
const key = (this.formGroup.get('value').get('bodyFieldOptions').get('optional') as FormArray).at(optionalIndex).get("key").value;
this.deleteBodyFormattingItem(key);
(this.formGroup.get('value').get('bodyFieldOptions').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
// subject formatting
insertSubjectFormattingItem(key: string, value: string){
this.subjectFormatting[key] = value;
this.formGroup.get('value').get('subjectFieldOptions').get('formatting').setValue(this.subjectFormatting);
}
return key;
subjectFormattingValueChange(event: Event, key: string){
this.bodyFormatting[key] = (event.target as HTMLInputElement).value;
this.formGroup.get('value').get('subjectFieldOptions').get('formatting').setValue(this.bodyFormatting);
}
editSubjectFormmattingKey(oldKey: string, newKey: string){
this.insertSubjectFormattingItem(newKey, this.subjectFormatting[oldKey]);
this.deleteSubjectFormattingItem(oldKey);
}
deleteSubjectFormattingItem(key:string){
if (key in this.subjectFormatting) {
delete this.subjectFormatting[key];
this.formGroup.get('value').get('subjectFieldOptions').get('formatting').setValue(this.subjectFormatting);
}
}
// body formatting
insertBodyFormattingItem(key: string, value: string){
this.bodyFormatting[key] = value;
this.formGroup.get('value').get('bodyFieldOptions').get('formatting').setValue(this.bodyFormatting);
}
bodyFormattingValueChange(event: Event, key: string){
this.bodyFormatting[key] = (event.target as HTMLInputElement).value;
this.formGroup.get('value').get('bodyFieldOptions').get('formatting').setValue(this.bodyFormatting);
}
editBodyFormmattingKey(oldKey: string, newKey: string){
this.insertBodyFormattingItem(newKey, this.bodyFormatting[oldKey]);
this.deleteBodyFormattingItem(oldKey);
}
deleteBodyFormattingItem(key:string){
if (key in this.bodyFormatting) {
delete this.bodyFormatting[key];
this.formGroup.get('value').get('bodyFieldOptions').get('formatting').setValue(this.bodyFormatting);
}
}
}

2
dmp-frontend/src/app/ui/admin/notification-template/editor/notification-template-editor.model.ts
View File

@ -169,7 +169,7 @@ export class NotificationTemplateValueEditorModel implements NotificationTemplat
export class NotificationFieldOptionsEditorModel implements NotificationFieldOptionsPersist {
mandatory?: string[] = [];
optional?: NotificationFieldInfoEditorModel[] = [];
formatting?: { [key: string]: string };
formatting?: { [key: string]: string } = {};
protected formBuilder: UntypedFormBuilder = new UntypedFormBuilder();