@seniorsistemas/exclusion-process-component 0.1.0 → 0.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (25) hide show
  1. package/bundles/seniorsistemas-exclusion-process-component.umd.js +117 -24
  2. package/bundles/seniorsistemas-exclusion-process-component.umd.js.map +1 -1
  3. package/bundles/seniorsistemas-exclusion-process-component.umd.min.js +2 -2
  4. package/bundles/seniorsistemas-exclusion-process-component.umd.min.js.map +1 -1
  5. package/esm2015/exclusion-details/exclusion-details.component.js +86 -9
  6. package/esm2015/exclusion-details/protocols/exclusion-process-status-changed.js +1 -0
  7. package/esm2015/exclusion-details/protocols/web-socket-event-data.js +1 -0
  8. package/esm2015/exclusions-list/exclusions-list.component.js +15 -4
  9. package/esm2015/services/logical-delete.service.js +10 -11
  10. package/esm5/exclusion-details/exclusion-details.component.js +91 -9
  11. package/esm5/exclusion-details/protocols/exclusion-process-status-changed.js +1 -0
  12. package/esm5/exclusion-details/protocols/web-socket-event-data.js +1 -0
  13. package/esm5/exclusions-list/exclusions-list.component.js +16 -5
  14. package/esm5/services/logical-delete.service.js +13 -12
  15. package/exclusion-details/exclusion-details.component.d.ts +11 -1
  16. package/exclusion-details/protocols/exclusion-process-status-changed.d.ts +8 -0
  17. package/exclusion-details/protocols/web-socket-event-data.d.ts +6 -0
  18. package/exclusions-list/exclusions-list.component.d.ts +1 -0
  19. package/fesm2015/seniorsistemas-exclusion-process-component.js +107 -20
  20. package/fesm2015/seniorsistemas-exclusion-process-component.js.map +1 -1
  21. package/fesm5/seniorsistemas-exclusion-process-component.js +116 -22
  22. package/fesm5/seniorsistemas-exclusion-process-component.js.map +1 -1
  23. package/package.json +14 -6
  24. package/seniorsistemas-exclusion-process-component.metadata.json +1 -1
  25. package/services/logical-delete.service.d.ts +1 -1
@@ -6,10 +6,11 @@ import { TableModule } from 'primeng/table';
6
6
  import { EnumColumnFieldType, EnumBadgeColors, SidebarModule, ButtonModule, TableModule as TableModule$1, LoadingStateModule, LocaleModule, EmptyStateModule, FieldType, FormField, LocaleService, ControlErrorsModule, InfoSignModule, DynamicFormModule, TokenListModule } from '@seniorsistemas/angular-components';
7
7
  import * as moment from 'moment';
8
8
  import { Router, ActivatedRoute, RouterModule } from '@angular/router';
9
+ import { TranslateService, TranslateModule } from '@ngx-translate/core';
9
10
  import { throwError, Subject } from 'rxjs';
10
11
  import { catchError, map, takeUntil, finalize } from 'rxjs/operators';
12
+ import { WebsocketService } from '@senior-gestao-empresarial/angular-components';
11
13
  import { HttpParams, HttpClient } from '@angular/common/http';
12
- import { TranslateService, TranslateModule } from '@ngx-translate/core';
13
14
  import { MessageService } from 'primeng/api';
14
15
  import { Validators, FormBuilder, FormsModule, ReactiveFormsModule } from '@angular/forms';
15
16
  import { DialogModule } from 'primeng/dialog';
@@ -62,7 +63,6 @@ let LogicalDeleteService = class LogicalDeleteService {
62
63
  this.projectConfigs = projectConfigs;
63
64
  const entityUrl = `${projectConfigs.getDomain()}/${projectConfigs.getService()}`;
64
65
  this.exclusionProcessUrl = `${entityUrl}/entities/exclusionProcess`;
65
- this.listExclusionsUrl = `${entityUrl}/entities/exclusionProcess`;
66
66
  this.defaultCatch = this.defaultCatch.bind(this);
67
67
  }
68
68
  defaultCatch() {
@@ -131,9 +131,16 @@ let LogicalDeleteService = class LogicalDeleteService {
131
131
  if (!((_a = value.contents) === null || _a === void 0 ? void 0 : _a.length)) {
132
132
  return null;
133
133
  }
134
- return value.contents[0];
134
+ return this.mapExclusionsDates(value.contents[0]);
135
135
  }));
136
136
  }
137
+ mapExclusionsDates(exclusionProcess) {
138
+ var _a;
139
+ return Object.assign(Object.assign({}, exclusionProcess), { startDate: exclusionProcess.startDate ? moment(exclusionProcess.startDate).toDate() : null, finishDate: exclusionProcess.finishDate ? moment(exclusionProcess.finishDate).toDate() : null, groups: (_a = exclusionProcess.groups) === null || _a === void 0 ? void 0 : _a.map(group => {
140
+ var _a;
141
+ return (Object.assign(Object.assign({}, group), { startDate: group.startDate ? moment(group.startDate).toDate() : null, finishDate: group.finishDate ? moment(group.finishDate).toDate() : null, steps: (_a = group.steps) === null || _a === void 0 ? void 0 : _a.map(step => (Object.assign(Object.assign({}, step), { startDate: step.startDate ? moment(step.startDate).toDate() : null, finishDate: step.finishDate ? moment(step.finishDate).toDate() : null }))) }));
142
+ }) });
143
+ }
137
144
  listExclusions(entityName, params = {}) {
138
145
  if (params.filterQuery) {
139
146
  params.filterQuery += ` and lower(entityName) eq lower('${entityName}')`;
@@ -144,14 +151,7 @@ let LogicalDeleteService = class LogicalDeleteService {
144
151
  return this.http.get(this.exclusionProcessUrl, { params: this.getListQueryParams(params) })
145
152
  .pipe(this.defaultCatch())
146
153
  .pipe(map(value => {
147
- value.contents.forEach(p => {
148
- if (p.startDate) {
149
- p.startDate = moment(p.startDate).toDate();
150
- }
151
- if (p.finishDate) {
152
- p.finishDate = moment(p.finishDate).toDate();
153
- }
154
- });
154
+ value.contents = value.contents.map(this.mapExclusionsDates);
155
155
  return value;
156
156
  }));
157
157
  }
@@ -203,17 +203,26 @@ let ExclusionDetailsComponent = class ExclusionDetailsComponent {
203
203
  ngOnDestroy() {
204
204
  this.ngUnsubscribe.next();
205
205
  this.ngUnsubscribe.complete();
206
+ this.disconnectWebSocket();
206
207
  }
207
208
  showDetails(details) {
208
- this.processDetails = null;
209
+ this._exclusionDetails = details;
209
210
  this._entityName = details.entityName;
210
211
  this._isVisible = true;
211
212
  this._processSummaryData = [];
213
+ this.processDetails = null;
212
214
  this.entityDescription = details.entityDescription;
213
215
  this.loadProcessDetails(details);
216
+ this.connectWebSocket();
217
+ }
218
+ onVisibilityChanged(event) {
219
+ this.closeDetails();
214
220
  }
215
221
  closeDetails() {
216
222
  this._isVisible = false;
223
+ this._exclusionDetails = null;
224
+ this._processSummaryData = [];
225
+ this.disconnectWebSocket();
217
226
  }
218
227
  openExclusions() {
219
228
  this.closeDetails();
@@ -235,14 +244,14 @@ let ExclusionDetailsComponent = class ExclusionDetailsComponent {
235
244
  if (!((_a = this.processDetails) === null || _a === void 0 ? void 0 : _a.startDate)) {
236
245
  return "";
237
246
  }
238
- return moment(this.processDetails.startDate).format("DD/MM/YYYY HH:mm");
247
+ return moment(this.processDetails.startDate).format("DD/MM/YYYY HH:mm:ss");
239
248
  }
240
249
  getFinishDate() {
241
250
  var _a;
242
251
  if (!((_a = this.processDetails) === null || _a === void 0 ? void 0 : _a.finishDate)) {
243
252
  return "";
244
253
  }
245
- return moment(this.processDetails.finishDate).format("DD/MM/YYYY HH:mm");
254
+ return moment(this.processDetails.finishDate).format("DD/MM/YYYY HH:mm:ss");
246
255
  }
247
256
  isFinished() {
248
257
  var _a;
@@ -329,14 +338,34 @@ let ExclusionDetailsComponent = class ExclusionDetailsComponent {
329
338
  .pipe(takeUntil(this.ngUnsubscribe))
330
339
  .pipe(finalize(() => this._isLoading = false))
331
340
  .subscribe((process) => {
341
+ if (!process) {
342
+ return;
343
+ }
332
344
  this.processDetails = process;
333
345
  this.loadProcessSummary(process);
334
346
  });
335
347
  }
348
+ sortByDate(startDate, finishDate) {
349
+ if (startDate.getTime() > finishDate.getTime()) {
350
+ return 1;
351
+ }
352
+ if (startDate.getTime() < finishDate.getTime()) {
353
+ return -1;
354
+ }
355
+ return 0;
356
+ }
357
+ sortGroupsByStartDate(groups) {
358
+ return groups.sort((a, b) => this.sortByDate(a.startDate, b.finishDate));
359
+ }
360
+ sortStepsByStartDate(steps) {
361
+ return steps.sort((a, b) => this.sortByDate(a.startDate, b.finishDate));
362
+ }
336
363
  loadProcessSummary(process) {
337
364
  const stepLogs = [];
338
- process.groups.forEach(group => {
339
- const steps = group.steps.map(step => ({
365
+ this.sortGroupsByStartDate(process.groups)
366
+ .forEach(group => {
367
+ const steps = this.sortStepsByStartDate(group.steps)
368
+ .map(step => ({
340
369
  description: step.description,
341
370
  status: step.status,
342
371
  errorMessage: step.errorMessage
@@ -345,6 +374,53 @@ let ExclusionDetailsComponent = class ExclusionDetailsComponent {
345
374
  });
346
375
  this._processSummaryData = stepLogs;
347
376
  }
377
+ disconnectWebSocket() {
378
+ if (this._exclusionProcessStatusChangedSubscribe) {
379
+ this._exclusionProcessStatusChangedSubscribe.unsubscribe();
380
+ this._exclusionProcessStatusChangedSubscribe = null;
381
+ }
382
+ if (this._websocketService) {
383
+ this._websocketService.disconnect();
384
+ this._websocketService = null;
385
+ }
386
+ }
387
+ connectWebSocket() {
388
+ if (this._websocketService) {
389
+ this.disconnectWebSocket();
390
+ }
391
+ this._websocketService = new WebsocketService();
392
+ this._websocketService
393
+ .onConnect()
394
+ .pipe(takeUntil(this.ngUnsubscribe))
395
+ .subscribe(() => {
396
+ this.startListeningWebhookEvents();
397
+ });
398
+ }
399
+ startListeningWebhookEvents() {
400
+ this._websocketService
401
+ .onError()
402
+ .pipe(takeUntil(this.ngUnsubscribe))
403
+ .subscribe((data) => {
404
+ console.error('onError', data);
405
+ });
406
+ this._exclusionProcessStatusChangedSubscribe = this._websocketService
407
+ .onEvent({
408
+ domain: "erpx_fnd",
409
+ service: "produto",
410
+ primitive: "exclusionProcessStatusChanged"
411
+ })
412
+ .pipe(takeUntil(this.ngUnsubscribe))
413
+ .subscribe((event) => {
414
+ const { data } = event;
415
+ if (this._exclusionDetails.processId && data.pid === this._exclusionDetails.processId) {
416
+ this.loadProcessDetails(this._exclusionDetails);
417
+ return;
418
+ }
419
+ if (this._exclusionDetails.recordId && data.recordId === this._exclusionDetails.recordId) {
420
+ this.loadProcessDetails(this._exclusionDetails);
421
+ }
422
+ });
423
+ }
348
424
  };
349
425
  ExclusionDetailsComponent.ctorParameters = () => [
350
426
  { type: Router },
@@ -374,7 +450,7 @@ __decorate([
374
450
  ExclusionDetailsComponent = __decorate([
375
451
  Component({
376
452
  selector: "s-exclusion-details",
377
- template: "<s-sidebar [visible]=\"isVisible\" (visibleChange)=\"closeDetails()\" [header]=\"getSidebarTitle()\">\n <s-loading-state [loading]=\"isLoading\">\n <p-panel [showHeader]=\"false\" styleClass=\"s-exclusion-details-record-details-panel\">\n <div class=\"s-exclusion-details-record-details-container\">\n <div class=\"s-exclusion-details-record-icon-background\">\n <em class=\"far fa-file-alt s-exclusion-details-record-icon\"></em>\n </div>\n\n <div class=\"s-exclusion-details-record-details-recordinfo\">\n <span class=\"s-exclusion-details-record-details-type\">\n {{entityDescription}}\n </span>\n <span>\n {{getRecordDescription()}}\n </span>\n </div>\n\n <div class=\"s-exclusion-details-record-details-dateinfo\">\n <span>\n {{getStartDateLabel()}}: {{getInicialDate()}}\n </span>\n <span *ngIf=\"isFinished()\">\n {{getFinishDateLabel()}}: {{getFinishDate()}}\n </span>\n </div>\n </div>\n </p-panel>\n\n <p-panel>\n <p-header>\n {{getSummaryLabel()}}\n </p-header>\n\n <s-empty-state\n *ngIf=\"processSummaryData && !processSummaryData.length\"\n [title]=\"getEmptyStateTitle()\"\n [description]=\"getEmptyStateDescription()\">\n [showPrimaryAction]=\"false\"\n </s-empty-state>\n\n <p-table\n [value]=\"processSummaryData\"\n [columns]=\"processSummaryColumns\"\n dataKey=\"id\"\n [lazy]=\"false\"\n [scrollable]=\"false\"\n [paginator]=\"false\"\n *ngIf=\"processSummaryData && processSummaryData.length\">\n\n <ng-template pTemplate=\"colgroup\" let-columns>\n <colgroup>\n <col *ngFor=\"let col of columns\"\n [style.width]=\"col.width\"\n />\n </colgroup>\n </ng-template>\n\n <ng-template pTemplate=\"header\" let-columns>\n <tr>\n <th *ngFor=\"let col of columns\"\n [id]=\"col.field\"\n [ngStyle]=\"col.style\"\n [pSortableColumn]=\"col.field\">\n <div class=\"senior-header\">\n <span class=\"senior-header-title\">{{ col.header }}</span>\n <p-sortIcon [field]=\"col.field\" ></p-sortIcon>\n </div>\n </th>\n </tr>\n </ng-template>\n\n <ng-template pTemplate=\"body\" let-rowData let-columns=\"columns\">\n <tr>\n <s-table-columns\n [columns]=\"columns\"\n [rowValue]=\"rowData\"\n [locale]=\"locale\">\n </s-table-columns>\n </tr>\n </ng-template>\n </p-table>\n </p-panel>\n </s-loading-state>\n\n <s-footer>\n <div class=\"ui-fluid\">\n <div class=\"ui-g\">\n <s-button [label]=\"getShowExclusionsButtonLabel()\" (onClick)=\"openExclusions()\"></s-button>\n <s-button [label]=\"getCloseButtonLabel()\" priority=\"link\" (onClick)=\"closeDetails()\"></s-button>\n </div>\n </div>\n </s-footer>\n</s-sidebar>\n",
453
+ template: "<s-sidebar [visible]=\"isVisible\" (visibleChange)=\"onVisibilityChanged($event)\" [header]=\"getSidebarTitle()\">\n <s-loading-state [loading]=\"isLoading\">\n <p-panel [showHeader]=\"false\" styleClass=\"s-exclusion-details-record-details-panel\">\n <div class=\"s-exclusion-details-record-details-container\">\n <div class=\"s-exclusion-details-record-icon-background\">\n <em class=\"far fa-file-alt s-exclusion-details-record-icon\"></em>\n </div>\n\n <div class=\"s-exclusion-details-record-details-recordinfo\">\n <span class=\"s-exclusion-details-record-details-type\">\n {{entityDescription}}\n </span>\n <span>\n {{getRecordDescription()}}\n </span>\n </div>\n\n <div class=\"s-exclusion-details-record-details-dateinfo\">\n <span>\n {{getStartDateLabel()}}: {{getInicialDate()}}\n </span>\n <span *ngIf=\"isFinished()\">\n {{getFinishDateLabel()}}: {{getFinishDate()}}\n </span>\n </div>\n </div>\n </p-panel>\n\n <p-panel>\n <p-header>\n {{getSummaryLabel()}}\n </p-header>\n\n <s-empty-state\n *ngIf=\"processSummaryData && !processSummaryData.length\"\n [title]=\"getEmptyStateTitle()\"\n [description]=\"getEmptyStateDescription()\">\n [showPrimaryAction]=\"false\"\n </s-empty-state>\n\n <p-table\n [value]=\"processSummaryData\"\n [columns]=\"processSummaryColumns\"\n dataKey=\"id\"\n [lazy]=\"false\"\n [scrollable]=\"false\"\n [paginator]=\"false\"\n *ngIf=\"processSummaryData && processSummaryData.length\">\n\n <ng-template pTemplate=\"colgroup\" let-columns>\n <colgroup>\n <col *ngFor=\"let col of columns\"\n [style.width]=\"col.width\"\n />\n </colgroup>\n </ng-template>\n\n <ng-template pTemplate=\"header\" let-columns>\n <tr>\n <th *ngFor=\"let col of columns\"\n [id]=\"col.field\"\n [ngStyle]=\"col.style\"\n [pSortableColumn]=\"col.field\">\n <div class=\"senior-header\">\n <span class=\"senior-header-title\">{{ col.header }}</span>\n <p-sortIcon [field]=\"col.field\" ></p-sortIcon>\n </div>\n </th>\n </tr>\n </ng-template>\n\n <ng-template pTemplate=\"body\" let-rowData let-columns=\"columns\">\n <tr>\n <s-table-columns\n [columns]=\"columns\"\n [rowValue]=\"rowData\"\n [locale]=\"locale\">\n </s-table-columns>\n </tr>\n </ng-template>\n </p-table>\n </p-panel>\n </s-loading-state>\n\n <s-footer>\n <div class=\"ui-fluid\">\n <div class=\"ui-g\">\n <s-button [label]=\"getShowExclusionsButtonLabel()\" (onClick)=\"openExclusions()\"></s-button>\n <s-button [label]=\"getCloseButtonLabel()\" priority=\"link\" (onClick)=\"closeDetails()\"></s-button>\n </div>\n </div>\n </s-footer>\n</s-sidebar>\n",
378
454
  encapsulation: ViewEncapsulation.None,
379
455
  styles: [".s-exclusion-details-record-details-panel{margin-bottom:10px}.s-exclusion-details-record-details-container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center}.s-exclusion-details-record-details-recordinfo{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;margin-left:10px;-ms-flex:1;flex:1}.s-exclusion-details-record-details-dateinfo{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;margin-left:10px;-ms-flex-align:end;align-items:flex-end;font-size:12px}.s-exclusion-details-record-details-type{color:#999}.s-exclusion-details-record-icon{font-size:22pt;color:#7e8d95}.s-exclusion-details-record-icon-background{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;padding:16px;background-color:#c1cad1;border-radius:50%;height:60px;width:60px}"]
380
456
  })
@@ -585,6 +661,7 @@ let ExclusionsListComponent = ExclusionsListComponent_1 = class ExclusionsListCo
585
661
  style: {
586
662
  width: "100px"
587
663
  },
664
+ tooltip: this.getColumnStatusTooltip,
588
665
  badgeConfigs: [
589
666
  {
590
667
  enumValue: EnumExclusionProcessStatus.ERROR,
@@ -609,7 +686,7 @@ let ExclusionsListComponent = ExclusionsListComponent_1 = class ExclusionsListCo
609
686
  attributes: ["startDate"],
610
687
  header: this.translate.instant(`${this.projectConfigs.getTranslationPrefix()}.logical_delete_start`),
611
688
  type: EnumColumnFieldType.DATE,
612
- dateFormat: "DD/MM/YYYY HH:mm",
689
+ dateFormat: "DD/MM/YYYY HH:mm:ss",
613
690
  style: {
614
691
  width: "100px"
615
692
  }
@@ -619,13 +696,19 @@ let ExclusionsListComponent = ExclusionsListComponent_1 = class ExclusionsListCo
619
696
  attributes: ["finishDate"],
620
697
  header: this.translate.instant(`${this.projectConfigs.getTranslationPrefix()}.logical_delete_finish`),
621
698
  type: EnumColumnFieldType.DATE,
622
- dateFormat: "DD/MM/YYYY HH:mm",
699
+ dateFormat: "DD/MM/YYYY HH:mm:ss",
623
700
  style: {
624
701
  width: "100px"
625
702
  }
626
703
  }
627
704
  ];
628
705
  }
706
+ getColumnStatusTooltip(rowValue) {
707
+ if (rowValue.errorMessage) {
708
+ return rowValue.errorMessage;
709
+ }
710
+ return null;
711
+ }
629
712
  getFilterFields() {
630
713
  const translationPrefix = this.projectConfigs.getTranslationPrefix();
631
714
  return [
@@ -768,8 +851,12 @@ let ExclusionsListComponent = ExclusionsListComponent_1 = class ExclusionsListCo
768
851
  const filterQuery = this.getFilterQuery();
769
852
  const displayFields = [
770
853
  "recordId",
854
+ "errorMessage",
771
855
  ...this.gridColumns.map(column => column.field)
772
856
  ];
857
+ if (!sort.length) {
858
+ sort.push({ field: 'startDate', order: -1 });
859
+ }
773
860
  this.listExclusions({ page, size, sort, filterQuery, displayFields });
774
861
  }
775
862
  listExclusions(params) {
@@ -828,7 +915,7 @@ __decorate([
828
915
  ], ExclusionsListComponent.prototype, "exclusionDetailsComponent", void 0);
829
916
  ExclusionsListComponent = ExclusionsListComponent_1 = __decorate([
830
917
  Component({
831
- template: "<div>\n <form [formGroup]=\"filterFormGroup\" autocomplete=\"off\">\n <p-panel\n *sLoadingState=\"showLoader\"\n styleClass=\"form-group\"\n [toggleable]=\"true\"\n [(collapsed)]=\"filtersPanelCollapsed\"\n (onAfterToggle)=\"focusInput('description')\"\n >\n <p-header>\n {{ getFiltersTitle() }}\n <s-token-list\n [tokens]=\"searchTokens\"\n (tokenRemoved)=\"onRemoveToken($event)\"\n [removableTokens]=\"true\"\n ></s-token-list>\n </p-header>\n <div>\n <s-dynamic-form\n [fields]=\"filterFields\"\n [form]=\"filterFormGroup\"\n [errorMessages]=\"{ pattern: getErrorInvalid() }\"\n ></s-dynamic-form>\n </div>\n <p-footer>\n <div class=\"ui-g\">\n <div class=\"ui-g-12\">\n <button\n id=\"filter-button\"\n class=\"ui-button\"\n type=\"submit\"\n pButton\n [label]=\"getFilterButtonTitle()\"\n (click)=\"onSearch()\"\n ></button>\n <button\n id=\"clear-button\"\n class=\"ui-button ui-button-link\"\n type=\"button\"\n pButton\n [label]=\"getClearButtonTitle()\"\n (click)=\"onClear()\"\n ></button>\n </div>\n </div>\n </p-footer>\n </p-panel>\n </form>\n <p-panel *sLoadingState=\"showLoader\">\n <p-header>\n {{ getTitle() }}\n </p-header>\n <ng-container>\n <s-empty-state\n *ngIf=\"serverError && !showLoader\"\n iconClass=\"fa fa-exclamation-triangle\"\n title=\"{{ getErrorServerTitle() | translate }}\"\n primaryActionLabel=\"{{ 'error_server_try_again' | translate }}\"\n (primaryAction)=\"resetGrid()\"\n description=\"{{ getErrorServerDescription() | translate }}\"\n ></s-empty-state>\n\n <s-empty-state\n *ngIf=\"!showLoader && !serverError && totalRecords === 0\"\n [title]=\"getEmptyStateTitle()\"\n [showPrimaryAction]=\"false\"\n [description]=\"getEmptyStateDescription()\"\n ></s-empty-state>\n\n <div class=\"ui-g\">\n <div class=\"ui-g-12\">\n <p-table\n #exclusionsTable\n id=\"exclusionsTable\"\n [hidden]=\"totalRecords === 0 || serverError\"\n [value]=\"gridData\"\n [columns]=\"gridColumns\"\n dataKey=\"id\"\n [lazy]=\"true\"\n [scrollable]=\"true\"\n [resizableColumns]=\"true\"\n sortMode=\"multiple\"\n [paginator]=\"true\"\n [totalRecords]=\"totalRecords\"\n [rows]=\"10\"\n rows=\"10\"\n [rowsPerPageOptions]=\"[10, 20, 50, 100]\"\n (onLazyLoad)=\"onGridChange($event)\"\n >\n <ng-template pTemplate=\"colgroup\" let-columns>\n <colgroup>\n <col\n *ngFor=\"let col of columns\"\n [style.width]=\"col.width\"\n />\n </colgroup>\n </ng-template>\n\n <ng-template\n pTemplate=\"header\"\n let-columns\n >\n <tr>\n <th *ngFor=\"let col of columns\"\n [id]=\"col.field\"\n [pSortableColumn]=\"col.field\"\n [ngStyle]=\"col.style\"\n pResizableColumn\n >\n <div class=\"senior-header\">\n <span class=\"senior-header-title\">\n {{ col.header }}\n </span>\n <p-sortIcon [field]=\"col.field\"></p-sortIcon>\n </div>\n </th>\n <th id=\"action-column\" style=\"width: 100px\">\n <div class=\"senior-header\">\n <span class=\"senior-header-title\">{{ getActionsColumnLabel() }}</span>\n </div>\n </th>\n </tr>\n </ng-template>\n\n <ng-template pTemplate=\"body\" let-rowData let-columns=\"columns\">\n <tr [pSelectableRow]=\"rowData\">\n <s-table-columns\n [columns]=\"columns\"\n [rowValue]=\"rowData\"\n [locale]=\"locale\">\n </s-table-columns>\n <td style=\"width: 100px\">\n <s-button\n id=\"details-button\"\n priority=\"default\"\n [label]=\"getDetailsButtonTitle()\"\n [auxiliary]=\"true\"\n (onClick)=\"onClickDetails(rowData)\">\n </s-button>\n </td>\n </tr>\n </ng-template>\n\n <ng-template pTemplate=\"paginatorright\">\n <s-table-paging\n [table]=\"exclusionsTable\"\n [totalRecords]=\"totalRecords\"\n ></s-table-paging>\n </ng-template>\n </p-table>\n </div>\n </div>\n </ng-container>\n </p-panel>\n</div>\n\n<s-exclusion-details></s-exclusion-details>\n",
918
+ template: "<div>\n <form [formGroup]=\"filterFormGroup\" autocomplete=\"off\">\n <p-panel\n *sLoadingState=\"showLoader\"\n styleClass=\"form-group\"\n [toggleable]=\"true\"\n [(collapsed)]=\"filtersPanelCollapsed\"\n (onAfterToggle)=\"focusInput('description')\"\n >\n <p-header>\n {{ getFiltersTitle() }}\n <s-token-list\n [tokens]=\"searchTokens\"\n (tokenRemoved)=\"onRemoveToken($event)\"\n [removableTokens]=\"true\"\n ></s-token-list>\n </p-header>\n <div>\n <s-dynamic-form\n [fields]=\"filterFields\"\n [form]=\"filterFormGroup\"\n [errorMessages]=\"{ pattern: getErrorInvalid() }\"\n ></s-dynamic-form>\n </div>\n <p-footer>\n <div class=\"ui-g\">\n <div class=\"ui-g-12\">\n <button\n id=\"filter-button\"\n class=\"ui-button\"\n type=\"submit\"\n pButton\n [label]=\"getFilterButtonTitle()\"\n (click)=\"onSearch()\"\n ></button>\n <button\n id=\"clear-button\"\n class=\"ui-button ui-button-link\"\n type=\"button\"\n pButton\n [label]=\"getClearButtonTitle()\"\n (click)=\"onClear()\"\n ></button>\n </div>\n </div>\n </p-footer>\n </p-panel>\n </form>\n <p-panel *sLoadingState=\"showLoader\">\n <p-header>\n {{ getTitle() }}\n </p-header>\n <ng-container>\n <s-empty-state\n *ngIf=\"serverError && !showLoader\"\n iconClass=\"fa fa-exclamation-triangle\"\n title=\"{{ getErrorServerTitle() | translate }}\"\n primaryActionLabel=\"{{ 'error_server_try_again' | translate }}\"\n (primaryAction)=\"resetGrid()\"\n description=\"{{ getErrorServerDescription() | translate }}\"\n ></s-empty-state>\n\n <s-empty-state\n *ngIf=\"!showLoader && !serverError && totalRecords === 0\"\n [title]=\"getEmptyStateTitle()\"\n [showPrimaryAction]=\"false\"\n [description]=\"getEmptyStateDescription()\"\n ></s-empty-state>\n\n <div class=\"ui-g\">\n <div class=\"ui-g-12\">\n <p-table\n #exclusionsTable\n id=\"exclusionsTable\"\n [hidden]=\"totalRecords === 0 || serverError\"\n [value]=\"gridData\"\n [columns]=\"gridColumns\"\n dataKey=\"id\"\n [lazy]=\"true\"\n [scrollable]=\"true\"\n [resizableColumns]=\"true\"\n sortMode=\"multiple\"\n [paginator]=\"true\"\n [totalRecords]=\"totalRecords\"\n [rows]=\"10\"\n sortField=\"startDate\"\n sortOrder=\"-1\"\n rows=\"10\"\n [rowsPerPageOptions]=\"[10, 20, 50, 100]\"\n (onLazyLoad)=\"onGridChange($event)\"\n >\n <ng-template pTemplate=\"colgroup\" let-columns>\n <colgroup>\n <col\n *ngFor=\"let col of columns\"\n [style.width]=\"col.width\"\n />\n </colgroup>\n </ng-template>\n\n <ng-template\n pTemplate=\"header\"\n let-columns\n >\n <tr>\n <th *ngFor=\"let col of columns\"\n [id]=\"col.field\"\n [pSortableColumn]=\"col.field\"\n [ngStyle]=\"col.style\"\n pResizableColumn\n >\n <div class=\"senior-header\">\n <span class=\"senior-header-title\">\n {{ col.header }}\n </span>\n <p-sortIcon [field]=\"col.field\"></p-sortIcon>\n </div>\n </th>\n <th id=\"action-column\" style=\"width: 100px\">\n <div class=\"senior-header\">\n <span class=\"senior-header-title\">{{ getActionsColumnLabel() }}</span>\n </div>\n </th>\n </tr>\n </ng-template>\n\n <ng-template pTemplate=\"body\" let-rowData let-columns=\"columns\">\n <tr [pSelectableRow]=\"rowData\">\n <s-table-columns\n [columns]=\"columns\"\n [rowValue]=\"rowData\"\n [locale]=\"locale\">\n </s-table-columns>\n <td style=\"width: 100px\">\n <s-button\n id=\"details-button\"\n priority=\"default\"\n [label]=\"getDetailsButtonTitle()\"\n [auxiliary]=\"true\"\n (onClick)=\"onClickDetails(rowData)\">\n </s-button>\n </td>\n </tr>\n </ng-template>\n\n <ng-template pTemplate=\"paginatorright\">\n <s-table-paging\n [table]=\"exclusionsTable\"\n [totalRecords]=\"totalRecords\"\n ></s-table-paging>\n </ng-template>\n </p-table>\n </div>\n </div>\n </ng-container>\n </p-panel>\n</div>\n\n<s-exclusion-details></s-exclusion-details>\n",
832
919
  providers: []
833
920
  })
834
921
  ], ExclusionsListComponent);