Skip to content

P
PERFORMA_REPLICA
Commit 6cba2294 by GD-A-150752
Options

listing UI

parent 151fa4ed
Showing with 187 additions and 117 deletions
frontend/angular/src/app/components/edit-message-template/edit-message-template.component.html
......@@ -11,20 +11,22 @@
<label>Message Template</label>
</div>
<div class="ui-g-12 ui-md-4 ui-fluid">
<input [(ngModel)]="messageTemplate.TemplateName" name="MessageTemplate{{messageTemplate.ObjectID}}"
fieldLabel="Message Template" type="text" [disabled]="showLoader" pInputText
class="form-control ui-inputtext" id="MessageTemplate{{messageTemplate.ObjectID}}">
<input [(ngModel)]="messageTemplate.TemplateName"
name="MessageTemplate{{messageTemplate.ObjectID}}"
fieldLabel="Message Template" type="text" [disabled]="showLoader" pInputText
class="form-control ui-inputtext" id="MessageTemplate{{messageTemplate.ObjectID}}">
</div>
</div>
<div class="ui-g form-group">
<div class="ui-g-12 ui-md-4">
<label>Message Template Type</label>
</div>
<div class="ui-g-12 ui-md-4 ui-fluid" *ngIf="this.messageTemplateTypes.length">
<div class="ui-g-12 ui-md-4 ui-fluid"
*ngIf="this.messageTemplateTypes.length && this.messageTemplate && this.messageTemplate.TemplateType">
<div class="header-select custom-dropdown w-100">
<select2 [data]="messageTemplateTypes" [value]="messageTemplateTypes[0].id"
(valueChanged)="storeMessageContent($event)"
[options]="options">
<select2 [data]="messageTemplateTypes" [value]="this.messageTemplate.TemplateType.id"
(valueChanged)="storeMessageContent($event)"
[options]="options">
</select2>
</div>
</div>
......@@ -35,16 +37,16 @@
</div>
<div class="ui-g-12 ui-md-4 ui-fluid">
<input id="subjectInputId" [(ngModel)]="messageTemplate.Subject"
name="Subject{{messageTemplate.ObjectID}}"
fieldLabel="Subject" placeholder="Subject" type="text" pInputText
class="form-control ui-inputtext"
[disabled]="showLoader">
name="Subject{{messageTemplate.ObjectID}}"
fieldLabel="Subject" placeholder="Subject" type="text" pInputText
class="form-control ui-inputtext"
[disabled]="showLoader">
</div>
<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">
(valueChanged)="addPlaceholderInSubject($event)"
[options]="options">
</select2>
</div>
</div>
......@@ -55,22 +57,24 @@
</div>
<div class="ui-g-12 ui-md-4" *ngIf="emailTemplateType()">
</div>
<div class="ui-g-12 ui-md-4">
<p-dropdown [(ngModel)]="contentPlaceholder"
name="ContentOption{{messageTemplate.ObjectID}}"
[options]="contentPlaceholderOptions" optionLabel="Description"
(onChange)="addPlaceholderInMessageContent($event)" [disabled]="showLoader">
</p-dropdown>
<div class="ui-g-12 ui-md-4" *ngIf="contentPlaceholderOptions.length">
<div class="header-select custom-dropdown w-100">
<select2 [data]="contentPlaceholderOptions" [value]="contentPlaceholderOptions[0].id"
(valueChanged)="addPlaceholderInMessageContent($event)"
[options]="options">
</select2>
</div>
<p-overlayPanel #contentLinkModal>
<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="contentLinkModal">
style="font-size:15px !important;height:25px !important;margin-bottom: 20px;"
[(ngModel)]="this.linkText"
id="contentLinkModal">
<p-button class="ui-button-success"
(click)="addAnchorText(true)">Add
(click)="addAnchorText(true)">Add
</p-button>
<p-button class="ui-button-danger"
(click)="addAnchorText(false)">Cancel
(click)="addAnchorText(false)">Cancel
</p-button>
</p-overlayPanel>
</div>
......@@ -78,25 +82,26 @@
<div class="ui-g form-group">
<div class="ui-g-12 ui-md-12">
<p-editor *ngIf="emailTemplateType()" [(ngModel)]="messageTemplate.MessageContent"
name="MessageContent{{messageTemplate.ObjectID}}"
#messageContent
fieldLabel="Message Content">
name="MessageContent{{messageTemplate.ObjectID}}"
#messageContent
fieldLabel="Message Content">
<p-header>
<span class="ql-formats">
<button class="ql-bold" aria-label="Bold"></button>
<button class="ql-italic" aria-label="Italic"></button>
<button class="ql-underline" aria-label="Underline"></button>
</span>
<span class="ql-formats">
<button class="ql-bold" aria-label="Bold"></button>
<button class="ql-italic" aria-label="Italic"></button>
<button class="ql-underline" aria-label="Underline"></button>
</span>
<span class="ql-formats">
<button class="ql-list" aria-label="Bullet" value="bullet"></button>
<button class="ql-link" aria-label="Link"></button>
</span>
<button class="ql-list" aria-label="Bullet" value="bullet"></button>
<button class="ql-link" aria-label="Link"></button>
</span>
</p-header>
</p-editor>
<textarea id="messageContentTxtAreaId" *ngIf="smsTemplateType()" pInputTextarea
[(ngModel)]="messageTemplate.MessageContent"
name="MessageContent{{messageTemplate.ObjectID}}"
fieldLabel="Message Content" style="width: 100%" placeholder="Message Content"></textarea>
[(ngModel)]="messageTemplate.MessageContent"
name="MessageContent{{messageTemplate.ObjectID}}"
fieldLabel="Message Content" style="width: 100%"
placeholder="Message Content"></textarea>
</div>
</div>
<div class="ui-g form-group">
......@@ -104,16 +109,16 @@
<div class="ui-g form-group">
<div class="ui-g-12 ui-md-3 ui-fluid">
<p-button label="Cancel" [disabled]="showLoader"
routerLink="/admin/list-message-templates"></p-button>
routerLink="/admin/list-message-templates"></p-button>
</div>
<div class="ui-g-12 ui-md-3 ui-fluid">
<p-button *ngIf="showSaveBtn()" label="Save" [disabled]="showLoader"
(onClick)="saveMessageTemplate()">
(onClick)="saveMessageTemplate()">
</p-button>
</div>
<div class="ui-g-12 ui-md-3 ui-fluid">
<p-button *ngIf="showSaveCopyBtn()" label="Save As a Copy" [disabled]="showLoader"
(onClick)="saveMessageTemplate(true)">
(onClick)="saveMessageTemplate(true)">
</p-button>
</div>
</div>
......@@ -124,4 +129,4 @@
<div id="showPlainText"></div>
<p-progressSpinner *ngIf="showLoader"></p-progressSpinner>
</form>
</div>
\ No newline at end of file
</div>
frontend/angular/src/app/components/edit-message-template/edit-message-template.component.ts
......@@ -199,6 +199,7 @@ export class EditMessageTemplateComponent extends BaseComponent implements OnIni
}
addPlaceholderInMessageContent($event): void {
this.contentPlaceholder = $event.data[0];
if (!this.contentPlaceholder || !this.contentPlaceholder.Value) {
return;
......@@ -290,7 +291,8 @@ export class EditMessageTemplateComponent extends BaseComponent implements OnIni
.subscribe(
data => {
this.messageTemplate = data;
this.updatedObjs[this.messageTemplate.ObjectID] = this.messageTemplate;
this.messageTemplate.TemplateType =
this.messageTemplateTypes.find(elem => elem.Value === this.messageTemplate.TemplateType.Value);
this.showLoader = false;
setTimeout(() => this.setInputListener(), 0);
},
......
frontend/angular/src/app/components/list-message-template/list-message-template.component.html
<form #form="ngForm">
<form #form="ngForm" class="bg-grey">
<div class="ui-g ui-fluid mt-80">
<div class="ui-g-12">
<div class="ui-g-2 listing-title">Messages</div>
<div class="ui-g-3 pull-right">
<div class="jobs-list-shorting">
<div class="ui-g-3 d-job-title all-jobs-title">Messages</div>
<div class="ui-g-3">
<a routerLink="/admin/edit-message-template" class="add-more-btn">Add Message Template</a>
</div>
</div>
<div class="ui-g-12 pt-0 pb-0">
<div class="ui-g-4 pull-right">
<div class="ui-g-4"><label class="order-label">Sort By</label></div>
<div class="ui-g-8">
<app-select-2 [data]="sortOptions" [value]="sortSelected" fieldLabel="description"
(valChange)="sortMessageTemplates($event)">
</app-select-2>
</div>
<div class="shorting-dropdown">
<div class="order-label">order by</div>
<app-select-2 [data]="sortOptions" [value]="sortSelected" fieldLabel="description"
(valChange)="sortMessageTemplates($event)">
</app-select-2>
</div>
</div>
</div>
......@@ -21,39 +17,71 @@
<div class="ui-g-12 ui-md-12 pt-0">
<h3>My Templates</h3>
<hr/>
<div *ngFor="let message of myTemplates" class="messageTemplate">
<div class="messageRow">
<div class="templateName">
<span (click)="onRowSelect(message)">{{message.TemplateName}}</span>
<div class="main-client-list">
<div class="template-list" *ngFor="let message of myTemplates" id="{{message.ObjectID}}">
<div class="template-row">
<div class="job-template-left job-template-cl1 ">
<div class="template-name heading">
<span class="calcField" (click)="onRowSelect(message)">{{message.TemplateName}}</span>
</div>
</div>
<div class="job-template-left job-template-cl2 no-border">
</div>
<div class="job-template-left job-template-cl3 no-border">
</div>
<div class="job-template-left job-template-cl4">
<div class="m-user-right-padlock">
<a>
<span (click)="onRowSelect(message)" class="m-user-right-padlockicon">
<span class="pencil"></span>
</span>
</a>
</div>
</div>
</div>
<button pButton type="button" icon="ui-icon-edit" title="Edit"
(click)="onRowSelect(message)" [disabled]="showLoader">
</button>
</div>
</div>
<div *ngIf="myTemplates.length === 0" class="messageTemplate">
<div class="messageRow">
<div class="templateName">
<span>No records found.</span>
<div class="template-list" *ngIf="myTemplates.length === 0">
<div class="template-row">
<div class="job-template-left job-template-cl1 no-border">
<div class="template-name heading">
<span class="calcField">No records found.</span>
</div>
</div>
</div>
</div>
</div>
<h3>Shared Templates</h3>
<hr/>
<div *ngFor="let message of sharedTemplates" class="messageTemplate">
<div class="messageRow">
<div class="templateName">
<span (click)="onRowSelect(message)">{{message.TemplateName}}</span>
<div class="main-client-list">
<div class="template-list" *ngFor="let message of sharedTemplates" id="{{message.ObjectID}}">
<div class="template-row">
<div class="job-template-left job-template-cl1 ">
<div class="template-name heading">
<span class="calcField" (click)="onRowSelect(message)">{{message.TemplateName}}</span>
</div>
</div>
<div class="job-template-left job-template-cl2 no-border">
</div>
<div class="job-template-left job-template-cl3 no-border">
</div>
<div class="job-template-left job-template-cl4">
<div class="m-user-right-padlock">
<a>
<span (click)="onRowSelect(message)" class="m-user-right-padlockicon">
<span class="pencil"></span>
</span>
</a>
</div>
</div>
</div>
<button pButton type="button" icon="ui-icon-edit" title="Edit"
(click)="onRowSelect(message)" [disabled]="showLoader">
</button>
</div>
</div>
<div *ngIf="sharedTemplates.length === 0" class="messageTemplate">
<div class="messageRow">
<div class="templateName">
<span>No records found.</span>
<div class="template-list" *ngIf="sharedTemplates.length === 0">
<div class="template-row">
<div class="job-template-left job-template-cl1 no-border">
<div class="template-name heading">
<span class="calcField">No records found.</span>
</div>
</div>
</div>
</div>
</div>
......
frontend/angular/src/app/components/list-work-flows/list-work-flows.component.html
<form #form="ngForm">
<form #form="ngForm" class="bg-grey">
<div class="ui-g ui-fluid mt-80">
<div class="ui-g-12">
<div class="ui-g-2 listing-title">Workflows</div>
<div class="ui-g-3 pull-right">
<div class="jobs-list-shorting">
<div class="ui-g-3 d-job-title all-jobs-title">Workflows</div>
<div class="ui-g-3">
<a routerLink="/admin/edit-workflow-template" class="add-more-btn">Add Workflow Template</a>
</div>
</div>
<div class="ui-g-12 pt-0 pb-0">
<div class="ui-g-4 pull-right">
<div class="ui-g-4"><label class="order-label">Sort By</label></div>
<div class="ui-g-8">
<app-select-2 [data]="sortOptions" [value]="sortSelected" fieldLabel="description"
(valChange)="sortWorkFlowTemplates($event)">
</app-select-2>
</div>
<div class="shorting-dropdown">
<div class="order-label">order by</div>
<app-select-2 [data]="sortOptions" [value]="sortSelected" fieldLabel="description"
(valChange)="sortWorkFlowTemplates($event)">
</app-select-2>
</div>
</div>
</div>
......@@ -21,39 +17,71 @@
<div class="ui-g-12 ui-md-12 pt-0">
<h3>My Templates</h3>
<hr/>
<div *ngFor="let workflow of myTemplates" class="messageTemplate">
<div class="messageRow">
<div class="templateName">
<span (click)="onRowSelect(workflow)">{{workflow.TemplateName}}</span>
<div class="main-client-list">
<div class="template-list" *ngFor="let workflow of myTemplates" id="{{workflow.ObjectID}}">
<div class="template-row">
<div class="job-template-left job-template-cl1 ">
<div class="template-name heading">
<span class="calcField" (click)="onRowSelect(workflow)">{{workflow.TemplateName}}</span>
</div>
</div>
<div class="job-template-left job-template-cl2 no-border">
</div>
<div class="job-template-left job-template-cl3 no-border">
</div>
<div class="job-template-left job-template-cl4">
<div class="m-user-right-padlock">
<a>
<span (click)="onRowSelect(workflow)" class="m-user-right-padlockicon">
<span class="pencil"></span>
</span>
</a>
</div>
</div>
</div>
<button pButton type="button" icon="ui-icon-edit" title="Edit"
(click)="onRowSelect(workflow)" [disabled]="showLoader">
</button>
</div>
</div>
<div *ngIf="myTemplates.length === 0" class="messageTemplate">
<div class="messageRow">
<div class="templateName">
<span>No records found.</span>
<div class="template-list" *ngIf="myTemplates.length === 0">
<div class="template-row">
<div class="job-template-left job-template-cl1 no-border">
<div class="template-name heading">
<span class="calcField">No records found.</span>
</div>
</div>
</div>
</div>
</div>
<h3>Shared Templates</h3>
<hr/>
<div *ngFor="let workflow of sharedTemplates" class="messageTemplate">
<div class="messageRow">
<div class="templateName">
<span (click)="onRowSelect(workflow)">{{workflow.TemplateName}}</span>
<div class="main-client-list">
<div class="template-list" *ngFor="let workflow of sharedTemplates" id="{{workflow.ObjectID}}">
<div class="template-row">
<div class="job-template-left job-template-cl1 ">
<div class="template-name heading">
<span class="calcField" (click)="onRowSelect(workflow)">{{workflow.TemplateName}}</span>
</div>
</div>
<div class="job-template-left job-template-cl2 no-border">
</div>
<div class="job-template-left job-template-cl3 no-border">
</div>
<div class="job-template-left job-template-cl4">
<div class="m-user-right-padlock">
<a>
<span (click)="onRowSelect(workflow)" class="m-user-right-padlockicon">
<span class="pencil"></span>
</span>
</a>
</div>
</div>
</div>
<button pButton type="button" icon="ui-icon-edit" title="Edit"
(click)="onRowSelect(workflow)" [disabled]="showLoader">
</button>
</div>
</div>
<div *ngIf="sharedTemplates.length === 0" class="messageTemplate">
<div class="messageRow">
<div class="templateName">
<span>No records found.</span>
<div class="template-list" *ngIf="sharedTemplates.length === 0">
<div class="template-row">
<div class="job-template-left job-template-cl1 no-border">
<div class="template-name heading">
<span class="calcField">No records found.</span>
</div>
</div>
</div>
</div>
</div>
......
frontend/angular/src/assets/css/common.css
This source diff could not be displayed because it is too large. You can view the blob instead.
frontend/angular/src/assets/css/custom.scss
......@@ -20,6 +20,14 @@
width: 100% !important;
}
.no-border {
border: 0 !important;
}
.bg-grey {
background-color: #e9ecef;
}
/* Listing of message and workflow templates */
.messageTemplate {
......
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