Commit d9c84de3 by GD-A-150752

list-workflow-templates

parent 720edbff
.messageTemplate {
background: #fff none repeat scroll 0 0;
display: inline-block;
width: 100%;
border-left: 5px solid #03ac66;
box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.02);
margin-bottom: 10px;
.messageRow {
height: 40px;
padding: 15px;
display: flex;
.templateName {
width: 95%;
align-self: center;
text-overflow: ellipsis;
word-break: break-all;
span {
cursor: pointer;
font-weight: bold;
color: #4e5258;
font-size: 18px;
}
}
}
}
...@@ -11,8 +11,7 @@ import { BaseComponent } from '../base/base.component'; ...@@ -11,8 +11,7 @@ import { BaseComponent } from '../base/base.component';
@Component({ @Component({
selector: 'app-list-message-template', selector: 'app-list-message-template',
templateUrl: './list-message-template.component.html', templateUrl: './list-message-template.component.html'
styleUrls: ['./list-message-template.component.scss']
}) })
export class ListMessageTemplateComponent extends BaseComponent implements OnInit { export class ListMessageTemplateComponent extends BaseComponent implements OnInit {
......
...@@ -6,81 +6,54 @@ ...@@ -6,81 +6,54 @@
<a routerLink="/admin/edit-workflow-template" class="add-more-btn">Add Workflow Template</a> <a routerLink="/admin/edit-workflow-template" class="add-more-btn">Add Workflow Template</a>
</div> </div>
</div> </div>
<div class="ui-g-12"> <div class="ui-g-12 pt-0 pb-0">
<div class="ui-g-4 pull-right"> <div class="ui-g-4 pull-right">
<div class="ui-g-4"><label class="order-label">Sort By</label></div> <div class="ui-g-4"><label class="order-label">Sort By</label></div>
<div class="ui-g-8"> <div class="ui-g-8">
<p-dropdown [options]="sortOptions" name="sort" [(ngModel)]="sortSelected" <app-select-2 [data]="sortOptions" [value]="sortSelected" fieldLabel="description"
(onChange)="sortWorkFlowTemplates()" (valChange)="sortWorkFlowTemplates($event)">
optionLabel="description"> </app-select-2>
</p-dropdown>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div class="ui-g form-group"> <div class="ui-g form-group pt-0">
<div class="ui-g-12 ui-md-12 pt-0"> <div class="ui-g-12 ui-md-12 pt-0">
<div class="ui-g-12 card card-w-title"> <h3>My Templates</h3>
<h4>My Templates</h4> <hr/>
<div *ngFor="let workflow of myTemplates" class="ui-g form-group"> <div *ngFor="let workflow of myTemplates" class="messageTemplate">
<div class="ui-g-12 ui-md-12"> <div class="messageRow">
<div class="ui-g form-group"> <div class="templateName">
<div class="ui-g-12 ui-md-1"> <span (click)="onRowSelect(workflow)">{{workflow.TemplateName}}</span>
<label> </label> </div>
</div>
<div class="ui-g-12 ui-md-8">
<label>{{workflow.TemplateName}}</label><br/>
</div>
<div class="ui-g-12 ui-md-3 ui-fluid">
<button pButton type="button" icon="ui-icon-edit" title="Edit" <button pButton type="button" icon="ui-icon-edit" title="Edit"
(click)="onRowSelect(workflow)" [disabled]="showLoader"> (click)="onRowSelect(workflow)" [disabled]="showLoader">
</button> </button>
</div> </div>
</div> </div>
</div> <div *ngIf="myTemplates.length === 0" class="messageTemplate">
</div> <div class="messageRow">
<div *ngIf="myTemplates.length === 0" class="ui-g form-group"> <div class="templateName">
<div class="ui-g-12 ui-md-12"> <span>No records found.</span>
<div class="ui-g form-group">
<div class="ui-g-12 ui-md-1">
<label> </label>
</div>
<div class="ui-g-12 ui-md-8">
<label>No records found.</label><br/>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>
<div class="ui-g-12 card card-w-title"> <h3>Shared Templates</h3>
<h4>Shared Templates</h4> <hr/>
<div *ngFor="let workflow of sharedTemplates" class="ui-g form-group"> <div *ngFor="let workflow of sharedTemplates" class="messageTemplate">
<div class="ui-g-12 ui-md-12"> <div class="messageRow">
<div class="ui-g form-group"> <div class="templateName">
<div class="ui-g-12 ui-md-1"> <span (click)="onRowSelect(workflow)">{{workflow.TemplateName}}</span>
<label> </label>
</div> </div>
<div class="ui-g-12 ui-md-8">
<label>{{workflow.TemplateName}}</label><br/>
</div>
<div class="ui-g-12 ui-md-3 ui-fluid">
<button pButton type="button" icon="ui-icon-edit" title="Edit" <button pButton type="button" icon="ui-icon-edit" title="Edit"
(click)="onRowSelect(workflow)" [disabled]="showLoader"> (click)="onRowSelect(workflow)" [disabled]="showLoader">
</button> </button>
</div> </div>
</div> </div>
</div> <div *ngIf="sharedTemplates.length === 0" class="messageTemplate">
</div> <div class="messageRow">
<div *ngIf="sharedTemplates.length === 0" class="ui-g form-group"> <div class="templateName">
<div class="ui-g-12 ui-md-12"> <span>No records found.</span>
<div class="ui-g form-group">
<div class="ui-g-12 ui-md-1">
<label> </label>
</div>
<div class="ui-g-12 ui-md-8">
<label>No records found.</label><br/>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>
......
...@@ -45,6 +45,7 @@ export class ListWorkFlowsComponent extends BaseComponent implements OnInit { ...@@ -45,6 +45,7 @@ export class ListWorkFlowsComponent extends BaseComponent implements OnInit {
.subscribe( .subscribe(
messages => { messages => {
this.myTemplates = messages; this.myTemplates = messages;
this.sortSpecificTemplate('myTemplates');
}, },
error => { error => {
this.showLoader = false; this.showLoader = false;
...@@ -57,6 +58,7 @@ export class ListWorkFlowsComponent extends BaseComponent implements OnInit { ...@@ -57,6 +58,7 @@ export class ListWorkFlowsComponent extends BaseComponent implements OnInit {
.subscribe( .subscribe(
messages => { messages => {
this.sharedTemplates = messages; this.sharedTemplates = messages;
this.sortSpecificTemplate('sharedTemplates');
}, },
error => { error => {
this.showLoader = false; this.showLoader = false;
...@@ -67,13 +69,23 @@ export class ListWorkFlowsComponent extends BaseComponent implements OnInit { ...@@ -67,13 +69,23 @@ export class ListWorkFlowsComponent extends BaseComponent implements OnInit {
setTimeout(() => (this.showLoader = false), 0); setTimeout(() => (this.showLoader = false), 0);
} }
sortWorkFlowTemplates(): void { sortSpecificTemplate(arrayName: string): void {
this[arrayName] = this.utilsService.sort(this[arrayName],
['TemplateName'], [this.sortOptions[0].ascending ? 1 : -1], false);
}
sortWorkFlowTemplates($event): void {
if (!$event.data[0]) {
return;
}
const sort = $event.data[0];
this.showLoader = true; this.showLoader = true;
this.myTemplates = this.utilsService.sort(this.myTemplates, this.myTemplates = this.utilsService.sort(this.myTemplates,
['TemplateName'], [this.sortSelected.ascending ? 1 : -1], false); ['TemplateName'], [sort.ascending ? 1 : -1], false);
this.sharedTemplates = this.utilsService.sort(this.sharedTemplates, this.sharedTemplates = this.utilsService.sort(this.sharedTemplates,
['TemplateName'], [this.sortSelected.ascending ? 1 : -1], false); ['TemplateName'], [sort.ascending ? 1 : -1], false);
this.showLoader = false; this.showLoader = false;
} }
onRowSelect(data: WorkflowTemplateModel): void { onRowSelect(data: WorkflowTemplateModel): void {
......
...@@ -19,3 +19,37 @@ ...@@ -19,3 +19,37 @@
.w-100 { .w-100 {
width: 100% !important; width: 100% !important;
} }
/* Listing of message and workflow templates */
.messageTemplate {
background: #fff none repeat scroll 0 0;
display: inline-block;
width: 100%;
box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.02);
margin-bottom: 10px;
.messageRow {
height: 40px;
padding: 15px;
display: flex;
.templateName {
width: 95%;
align-self: center;
text-overflow: ellipsis;
word-break: break-all;
border-left: 3px solid #03ac66;
padding-left: 5px;
span {
cursor: pointer;
font-weight: bold;
color: #4e5258;
font-size: 18px;
}
}
}
}
/* End listing of message and workflow template styling */
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