Skip to content

P
PERFORMA_REPLICA
Commit 94835b32 by GD-A-150752
Options

edit-message-template

parent d9c84de3
Showing with 121 additions and 62 deletions
frontend/angular/src/app/app.service.ts
......@@ -23,7 +23,7 @@ export class AppService {
}
getPlaceholderOptionsEnum(): Observable<Array<PlaceholderOptionsEnum>> {
return this.enumService.getEnums('PlaceholderOptions', true);
return this.enumService.getEnumsWithNULLOptionLabel('PlaceholderOptions', 'Select variable');
}
getTypes(serviceName: string): Observable<Array<any>> {
......
frontend/angular/src/app/components/edit-message-template/edit-message-template.component.html
<form #form="ngForm">
<div class="ui-g ui-fluid">
<div class="ui-g-12 nopad">
<p-toolbar>
<div class="ui-toolbar-group-left">
{{editMode ? "Edit" : "Add"}} Message Template
</div>
</p-toolbar>
</div>
<div class="ui-g ui-fluid mt-80">
<div class="ui-g-10 listing-title pt-0 pb-0">{{editMode ? "Edit" : "Add"}} Message Template</div>
</div>
<div class="ui-g form-group">
<div class="ui-g-12 ui-md-12">
......@@ -24,13 +18,13 @@
<div class="ui-g-12 ui-md-4">
<label>Message Template Type</label>
</div>
<div class="ui-g-12 ui-md-4 ui-fluid">
<p-dropdown [(ngModel)]="messageTemplate.TemplateType"
name="MessageTemplateType{{messageTemplate.ObjectID}}"
fieldLabel="Message Template Type"
[options]="messageTemplateTypes" optionLabel="Description" [disabled]="showLoader"
(onChange)="storeMessageContent()">
</p-dropdown>
<div class="ui-g-12 ui-md-4 ui-fluid" *ngIf="this.messageTemplateTypes.length">
<div class="header-select custom-dropdown w-100">
<select2 [data]="messageTemplateTypes" [value]="messageTemplateTypes[0].id"
(valueChanged)="storeMessageContent($event)"
[options]="options">
</select2>
</div>
</div>
</div>
<div class="ui-g form-group" *ngIf="emailTemplateType()">
......@@ -44,11 +38,13 @@
class="form-control ui-inputtext"
[disabled]="showLoader">
</div>
<div class="ui-g-12 ui-md-4">
<p-dropdown [(ngModel)]="subjectPlaceholder" name="SubjectOption{{messageTemplate.ObjectID}}"
[options]="subjectPlaceholderOptions" optionLabel="Description"
(onHide)="addPlaceholderInSubject()" [disabled]="showLoader">
</p-dropdown>
<div class="ui-g-12 ui-md-4" *ngIf="subjectPlaceholderOptions.length">
<div class="header-select custom-dropdown w-100">
<select2 [data]="subjectPlaceholderOptions" [value]="subjectPlaceholderOptions[0].id"
(valueChanged)="addPlaceholderInSubject($event)"
[options]="options">
</select2>
</div>
</div>
</div>
<div class="ui-g form-group">
......@@ -67,12 +63,12 @@
<label class="ui-g-12" style="padding-left: 0;">Please enter anchor text</label>
<input pInputText name="contentLinkModal" type="text" class="ui-g-12"
style="font-size:15px !important;height:25px !important;" [(ngModel)]="this.linkText"
id="overlay">
id="contentLinkModal">
<p-button class="ui-button-success"
(click)="addAnchorText(true); contentLinkModal.hide()">Add
(click)="addAnchorText(true)">Add
</p-button>
<p-button class="ui-button-danger"
(click)="addAnchorText(false); contentLinkModal.hide()">Cancel
(click)="addAnchorText(false)">Cancel
</p-button>
</p-overlayPanel>
</div>
......
frontend/angular/src/app/components/edit-message-template/edit-message-template.component.ts
......@@ -30,10 +30,10 @@ export class EditMessageTemplateComponent extends BaseComponent implements OnIni
deletedObjs;
messageTemplate = new MessageTemplateModel();
messageTemplateTypes: Array<TemplateTypeEnum>;
subjectPlaceholderOptions: Array<PlaceholderOptionsEnum>;
contentPlaceholderOptions: Array<PlaceholderOptionsEnum>;
ContentPlaceholderOptionsEnum: Array<PlaceholderOptionsEnum>;
messageTemplateTypes: Array<TemplateTypeEnum> = [];
subjectPlaceholderOptions: Array<PlaceholderOptionsEnum> = [];
contentPlaceholderOptions: Array<PlaceholderOptionsEnum> = [];
ContentPlaceholderOptionsEnum: Array<PlaceholderOptionsEnum> = [];
subjectPlaceholder: PlaceholderOptionsEnum;
contentPlaceholder: PlaceholderOptionsEnum;
contentCursorPoint;
......@@ -41,6 +41,7 @@ export class EditMessageTemplateComponent extends BaseComponent implements OnIni
linkText = '';
showLoader = false;
editMode = false;
options = {minimumResultsForSearch: Infinity};
constructor(
private router: Router,
......@@ -62,6 +63,7 @@ export class EditMessageTemplateComponent extends BaseComponent implements OnIni
this.utilsService.resetCounter();
this.getPlaceholderOptions();
if (!this.adminPortalLayoutService.userData) {
this.subscriptions.push(this.adminPortalLayoutService.userDataUpdated
.subscribe(
......@@ -70,6 +72,7 @@ export class EditMessageTemplateComponent extends BaseComponent implements OnIni
}
));
}
this.startComponent();
}
......@@ -78,7 +81,17 @@ export class EditMessageTemplateComponent extends BaseComponent implements OnIni
this.subscriptions.push(this.appService.getMessageTemplateTypeEnum()
.subscribe(
data => {
if (this.createdExists()) {
return;
}
this.messageTemplateTypes = data;
this.messageTemplateTypes.map((elem, index) => {
elem.id = index;
elem.text = elem.Description;
});
this.subscriptions.push(this.activatedRoute.params
.subscribe(
(params: Params) => {
......@@ -155,37 +168,56 @@ export class EditMessageTemplateComponent extends BaseComponent implements OnIni
addAnchorText(show: boolean): void {
if (show) {
const delta = {
ops: [
{retain: this.contentCursorPoint},
{insert: this.contentPlaceholder.Placeholder, attributes: {link: this.linkText}}
]
};
if (!show || this.linkText === '') {
this.contentLinkModal.hide();
return;
}
const delta = {
ops: [
{retain: this.contentCursorPoint > 0 ? this.contentCursorPoint : this.contentCursorPoint + 1},
{insert: this.contentPlaceholder.Placeholder, attributes: {link: this.linkText}}
]
};
if (this.contentCursorPoint === 0) {
this.messageContentEditor.getQuill()
.insertText(this.contentCursorPoint, ' ');
this.contentCursorPoint++;
}
try {
this.messageContentEditor.getQuill()
.updateContents(delta);
} else {
this.linkText = '';
} catch (e) {
this.utilsService.handleError(e);
}
this.linkText = '';
this.contentLinkModal.hide();
}
addPlaceholderInMessageContent($event): void {
if (typeof this.contentCursorPoint === 'number') {
if (!this.contentPlaceholder || !this.contentPlaceholder.Value) {
return;
}
if (this.emailTemplateType()) {
if (this.contentPlaceholder.IsLink) {
this.contentLinkModal.toggle($event);
} else {
this.messageContentEditor.getQuill()
.insertText(this.contentCursorPoint, this.contentPlaceholder.Placeholder);
}
if (typeof this.contentCursorPoint !== 'number') {
return;
}
if (this.emailTemplateType()) {
if (this.contentPlaceholder.IsLink) {
this.contentLinkModal.toggle($event);
} else {
const textarea: HTMLTextAreaElement = document.getElementById('messageContentTxtAreaId') as HTMLTextAreaElement;
this.setValueAndFocus(textarea, 'messageContentTxtArea', this.contentPlaceholder.Placeholder);
this.messageContentEditor.getQuill()
.insertText(this.contentCursorPoint, this.contentPlaceholder.Placeholder);
}
} else {
const textarea: HTMLTextAreaElement = document.getElementById('messageContentTxtAreaId') as HTMLTextAreaElement;
this.setValueAndFocus(textarea, 'messageContentTxtArea', this.contentPlaceholder.Placeholder);
}
}
......@@ -199,10 +231,13 @@ export class EditMessageTemplateComponent extends BaseComponent implements OnIni
return title;
}
storeMessageContent(): void {
storeMessageContent($event): void {
if (!$event.data[0]) {
return;
}
this.messageTemplate.TemplateType = $event.data[0];
if (this.messageTemplate.MessageContent !== undefined) {
if (this.messageTemplate.TemplateType.Description === 'SMS') {
this.temporaryMessageContent = this.messageTemplate.MessageContent;
this.messageTemplate.MessageContent = this.showPlainText(this.temporaryMessageContent);
......@@ -210,24 +245,24 @@ export class EditMessageTemplateComponent extends BaseComponent implements OnIni
this.messageTemplate.MessageContent = this.temporaryMessageContent !== '' ? this.temporaryMessageContent
: this.messageTemplate.MessageContent;
}
}
if (this.ContentPlaceholderOptionsEnum) {
if (this.emailTemplateType()) {
this.contentPlaceholderOptions = this.ContentPlaceholderOptionsEnum.filter(option => option.ShowForContent);
this.contentPlaceholderOptions = this.ContentPlaceholderOptionsEnum.filter(option => option.ShowForContent ||
option.Value === null);
} else {
this.contentPlaceholderOptions = this.ContentPlaceholderOptionsEnum
.filter(option => option.ShowForContent && option.Value !== 'JOB_LINK');
.filter(option => option.ShowForContent && option.Value !== 'JOB_LINK' || option.Value === null);
}
}
this.setInputListener();
}
addPlaceholderInSubject(): void {
if (this.emailTemplateType()) {
addPlaceholderInSubject($event): void {
this.subjectPlaceholder = $event.data[0];
if (this.emailTemplateType() && this.subjectPlaceholder && this.subjectPlaceholder.Value) {
const input: HTMLInputElement = document.getElementById('subjectInputId') as HTMLInputElement;
this.setValueAndFocus(input, 'subjectInput', this.subjectPlaceholder.Placeholder);
}
......@@ -294,8 +329,22 @@ export class EditMessageTemplateComponent extends BaseComponent implements OnIni
this.subscriptions.push(this.appService.getPlaceholderOptionsEnum()
.subscribe(options => {
this.ContentPlaceholderOptionsEnum = options;
this.contentPlaceholderOptions = this.ContentPlaceholderOptionsEnum.filter(option => option.ShowForContent);
this.subjectPlaceholderOptions = this.ContentPlaceholderOptionsEnum.filter(option => option.ShowForSubject);
this.contentPlaceholderOptions =
this.ContentPlaceholderOptionsEnum.filter(option => option.ShowForContent || option.Value === null)
.map((elem, index) => {
elem.id = index;
elem.text = elem.Description;
return elem;
});
this.subjectPlaceholderOptions =
this.ContentPlaceholderOptionsEnum.filter(option => option.ShowForSubject || option.Value === null)
.map((elem, index) => {
elem.id = index;
elem.text = elem.Description;
return elem;
});
})
);
}
......@@ -333,4 +382,8 @@ export class EditMessageTemplateComponent extends BaseComponent implements OnIni
}
}, 0);
}
createdExists(): boolean {
return Object.keys(this.createdObjs).length > 0;
}
}
frontend/angular/src/app/components/select-2/select-2.component.ts
......@@ -19,14 +19,20 @@ export class SelectTwoComponent {
}
ngOnInit(): void {
this.data.map(elem => {
elem.id = elem.ObjectID;
this.options = {minimumResultsForSearch: Infinity};
if (!this.data) {
return;
}
this.data.map((elem, index) => {
elem.id = elem.ObjectID ? elem.ObjectID : index;
elem.text = elem[this.fieldLabel];
return elem;
});
this.selectedData = this.data[0] ? this.data[0].ObjectID : '';
this.options = {minimumResultsForSearch: Infinity};
this.selectedData = this.data[0] ? this.data[0].id : '';
}
}
frontend/angular/src/app/models/placeholderOptions.enum.ts
......@@ -7,4 +7,6 @@ export class PlaceholderOptionsEnum {
ShowForSubject: boolean;
ShowForContent: boolean;
IsLink: boolean;
id: number;
text: string;
}
frontend/angular/src/app/models/templateType.enum.ts
......@@ -3,4 +3,6 @@ export class TemplateTypeEnum {
Value: string;
Description: string;
Disabled: boolean;
id: number;
text: string;
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment