bpm-core 0.0.29 → 0.0.30

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.
@@ -26,7 +26,8 @@ import { MatAutocomplete, MatOption, MatAutocompleteTrigger, MatAutocompleteModu
26
26
  import * as i3 from '@angular/material/input';
27
27
  import { MatInputModule, MatInput } from '@angular/material/input';
28
28
  import { MomentDateAdapter, MAT_MOMENT_DATE_ADAPTER_OPTIONS } from '@angular/material-moment-adapter';
29
- import { MatDatepicker, MatDatepickerToggle, MatDatepickerInput } from '@angular/material/datepicker';
29
+ import * as i2$2 from '@angular/material/datepicker';
30
+ import { MatDatepicker, MatDatepickerModule, MatDatepickerToggle, MatDatepickerInput } from '@angular/material/datepicker';
30
31
  import * as moment from 'moment';
31
32
  import { MatIcon } from '@angular/material/icon';
32
33
  import * as i1$3 from '@ncstate/sat-popover';
@@ -35,11 +36,11 @@ import { NgxMaskDirective } from 'ngx-mask';
35
36
  import { MatSelect, MatOption as MatOption$1, MatLabel, MatError as MatError$1, MatFormField as MatFormField$1 } from '@angular/material/select';
36
37
  import { MatProgressSpinner } from '@angular/material/progress-spinner';
37
38
  import { MatButtonToggleGroup, MatButtonToggle } from '@angular/material/button-toggle';
38
- import * as i2$2 from '@angular/material/table';
39
+ import * as i2$3 from '@angular/material/table';
39
40
  import { MatTableDataSource, MatTableModule } from '@angular/material/table';
40
41
  import * as i1$5 from '@angular/material/paginator';
41
42
  import { MatPaginatorModule } from '@angular/material/paginator';
42
- import * as i2$5 from '@angular/router';
43
+ import * as i2$6 from '@angular/router';
43
44
  import { RouterLink, RouterModule, RouterLinkActive, RouterOutlet } from '@angular/router';
44
45
  import * as i5 from '@angular/material/menu';
45
46
  import { MatMenu, MatMenuTrigger, MatMenuItem, MatMenuModule } from '@angular/material/menu';
@@ -47,8 +48,8 @@ import { moveItemInArray, CdkDropList, CdkDrag } from '@angular/cdk/drag-drop';
47
48
  import * as i3$2 from '@angular/material/tooltip';
48
49
  import { MatTooltip, MatTooltipModule } from '@angular/material/tooltip';
49
50
  import { MatRadioButton, MatRadioGroup } from '@angular/material/radio';
50
- import * as i2$3 from 'ngx-toastr';
51
- import * as i2$4 from '@angular/material/expansion';
51
+ import * as i2$4 from 'ngx-toastr';
52
+ import * as i2$5 from '@angular/material/expansion';
52
53
  import { MatAccordion, MatExpansionPanel, MatExpansionPanelTitle, MatExpansionModule } from '@angular/material/expansion';
53
54
  import { MatDivider } from '@angular/material/divider';
54
55
  import * as i3$1 from 'ng-dynamic-component';
@@ -3000,7 +3001,7 @@ class DatePickerComponent extends ControlValueAccessorDirective {
3000
3001
  useExisting: forwardRef(() => DatePickerComponent),
3001
3002
  multi: true,
3002
3003
  },
3003
- ], viewQueries: [{ propertyName: "datepicker", first: true, predicate: MatDatepicker, descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ng-container *ngIf=\"!isReadOnly\">\r\n <div class=\"d-flex justify-content-between mb-1\" *ngIf=\"label\">\r\n <span class=\"form-label mb-0\">{{label}}</span>\r\n <span *ngIf=\"!required\" class=\"fs-11 fc-dark-gray\"> {{i18n.translate('optional')}} </span>\r\n </div>\r\n <div class=\"justify-content-between mb-1\">\r\n <mat-form-field [ngClass]=\"{'input-disabled' : isDisabled }\" [floatLabel]=\"floatLabel\">\r\n <label class=\"mat-form-content\">\r\n <input matInput (dateInput)=\"dateChange($event)\" [placeholder]=\"label ? (i18n.translate('select') + ' ' + labelTextWriteMode) : ''\" (focus)=\"focusPicker(dp)\" [min]=\"minDateValue\"\r\n [max]=\"maxDateValue\" readonly [matDatepicker]=\"dp\" [formControl]=\"control\">\r\n </label>\r\n <ds-icon *ngIf=\"control?.value\" matSuffix icon=\"close\" class=\"fc-onyx fs-10 mx-2 cursor-pointer\" (click)=\"clearDateValue($event)\"></ds-icon>\r\n <mat-datepicker-toggle matSuffix [for]=\"dp\">\r\n <ds-icon icon=\"calendar-o\" class=\"fc-black fs-18\" matDatepickerToggleIcon></ds-icon>\r\n </mat-datepicker-toggle>\r\n <mat-datepicker #dp>\r\n </mat-datepicker>\r\n <!-- <mat-error *ngIf=\"errorMessage\">{{errorMessage}}</mat-error> -->\r\n </mat-form-field>\r\n <app-validation-errors [errors]=\"control.errors\"></app-validation-errors>\r\n </div>\r\n\r\n</ng-container>\r\n\r\n<ng-container *ngIf=\"isReadOnly && control\">\r\n <app-info-item class=\"info-item w-100\" type=\"date\" [insideTable]=\"insideTable\" [dateType]=\"calendarType\" [label]=\"labelTextReadMode\"\r\n [value]=\"control.value\" [hasLabel]=\"!!label\">\r\n </app-info-item>\r\n</ng-container>\r\n", styles: [":host{flex-grow:1}::ng-deep .year-only .mat-calendar-period-button{pointer-events:none}::ng-deep .year-only .mat-calendar-arrow{display:none}\n"], dependencies: [{ kind: "component", type: MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "component", type: MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: InfoItemComponent, selector: "app-info-item", inputs: ["label", "value", "name", "type", "dateType", "multiple", "insideTable", "hasLabel", "arrayList", "actionType", "download"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: ValidationErrorsComponent, selector: "app-validation-errors", inputs: ["errors", "customErrorMessages"] }] });
3004
+ ], viewQueries: [{ propertyName: "datepicker", first: true, predicate: MatDatepicker, descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ng-container *ngIf=\"!isReadOnly\">\r\n <div class=\"d-flex justify-content-between mb-1\" *ngIf=\"label\">\r\n <span class=\"form-label mb-0\">{{label}}</span>\r\n <span *ngIf=\"!required\" class=\"fs-11 fc-dark-gray\"> {{i18n.translate('optional')}} </span>\r\n </div>\r\n <div class=\"justify-content-between mb-1\">\r\n <mat-form-field [ngClass]=\"{'input-disabled' : isDisabled }\" [floatLabel]=\"floatLabel\">\r\n <label class=\"mat-form-content\">\r\n <input matInput (dateInput)=\"dateChange($event)\" [placeholder]=\"label ? (i18n.translate('select') + ' ' + labelTextWriteMode) : ''\" (focus)=\"focusPicker(dp)\" [min]=\"minDateValue\"\r\n [max]=\"maxDateValue\" readonly [matDatepicker]=\"dp\" [formControl]=\"control\">\r\n </label>\r\n <ds-icon *ngIf=\"control?.value\" matSuffix icon=\"close\" class=\"fc-onyx fs-10 mx-2 cursor-pointer\" (click)=\"clearDateValue($event)\"></ds-icon>\r\n <mat-datepicker-toggle matSuffix [for]=\"dp\">\r\n <ds-icon icon=\"calendar-o\" class=\"fc-black fs-18\" matDatepickerToggleIcon></ds-icon>\r\n </mat-datepicker-toggle>\r\n <mat-datepicker #dp>\r\n </mat-datepicker>\r\n <!-- <mat-error *ngIf=\"errorMessage\">{{errorMessage}}</mat-error> -->\r\n </mat-form-field>\r\n <app-validation-errors [errors]=\"control.errors\"></app-validation-errors>\r\n </div>\r\n\r\n</ng-container>\r\n\r\n<ng-container *ngIf=\"isReadOnly && control\">\r\n <app-info-item class=\"info-item w-100\" type=\"date\" [insideTable]=\"insideTable\" [dateType]=\"calendarType\" [label]=\"labelTextReadMode\"\r\n [value]=\"control.value\" [hasLabel]=\"label? true: false\">\r\n </app-info-item>\r\n</ng-container>\r\n", styles: [":host{flex-grow:1}::ng-deep .year-only .mat-calendar-period-button{pointer-events:none}::ng-deep .year-only .mat-calendar-arrow{display:none}\n"], dependencies: [{ kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i2$2.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i2$2.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i2$2.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "directive", type: i2$2.MatDatepickerToggleIcon, selector: "[matDatepickerToggleIcon]" }, { kind: "directive", type: MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: InfoItemComponent, selector: "app-info-item", inputs: ["label", "value", "name", "type", "dateType", "multiple", "insideTable", "hasLabel", "arrayList", "actionType", "download"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: ValidationErrorsComponent, selector: "app-validation-errors", inputs: ["errors", "customErrorMessages"] }] });
3004
3005
  }
3005
3006
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: DatePickerComponent, decorators: [{
3006
3007
  type: Component,
@@ -3020,6 +3021,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImpor
3020
3021
  multi: true,
3021
3022
  },
3022
3023
  ], imports: [
3024
+ MatFormFieldModule,
3025
+ MatDatepickerModule,
3023
3026
  MatFormField,
3024
3027
  MatInput,
3025
3028
  MatIcon,
@@ -3031,7 +3034,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImpor
3031
3034
  InfoItemComponent,
3032
3035
  ReactiveFormsModule,
3033
3036
  ValidationErrorsComponent
3034
- ], template: "<ng-container *ngIf=\"!isReadOnly\">\r\n <div class=\"d-flex justify-content-between mb-1\" *ngIf=\"label\">\r\n <span class=\"form-label mb-0\">{{label}}</span>\r\n <span *ngIf=\"!required\" class=\"fs-11 fc-dark-gray\"> {{i18n.translate('optional')}} </span>\r\n </div>\r\n <div class=\"justify-content-between mb-1\">\r\n <mat-form-field [ngClass]=\"{'input-disabled' : isDisabled }\" [floatLabel]=\"floatLabel\">\r\n <label class=\"mat-form-content\">\r\n <input matInput (dateInput)=\"dateChange($event)\" [placeholder]=\"label ? (i18n.translate('select') + ' ' + labelTextWriteMode) : ''\" (focus)=\"focusPicker(dp)\" [min]=\"minDateValue\"\r\n [max]=\"maxDateValue\" readonly [matDatepicker]=\"dp\" [formControl]=\"control\">\r\n </label>\r\n <ds-icon *ngIf=\"control?.value\" matSuffix icon=\"close\" class=\"fc-onyx fs-10 mx-2 cursor-pointer\" (click)=\"clearDateValue($event)\"></ds-icon>\r\n <mat-datepicker-toggle matSuffix [for]=\"dp\">\r\n <ds-icon icon=\"calendar-o\" class=\"fc-black fs-18\" matDatepickerToggleIcon></ds-icon>\r\n </mat-datepicker-toggle>\r\n <mat-datepicker #dp>\r\n </mat-datepicker>\r\n <!-- <mat-error *ngIf=\"errorMessage\">{{errorMessage}}</mat-error> -->\r\n </mat-form-field>\r\n <app-validation-errors [errors]=\"control.errors\"></app-validation-errors>\r\n </div>\r\n\r\n</ng-container>\r\n\r\n<ng-container *ngIf=\"isReadOnly && control\">\r\n <app-info-item class=\"info-item w-100\" type=\"date\" [insideTable]=\"insideTable\" [dateType]=\"calendarType\" [label]=\"labelTextReadMode\"\r\n [value]=\"control.value\" [hasLabel]=\"!!label\">\r\n </app-info-item>\r\n</ng-container>\r\n", styles: [":host{flex-grow:1}::ng-deep .year-only .mat-calendar-period-button{pointer-events:none}::ng-deep .year-only .mat-calendar-arrow{display:none}\n"] }]
3037
+ ], template: "<ng-container *ngIf=\"!isReadOnly\">\r\n <div class=\"d-flex justify-content-between mb-1\" *ngIf=\"label\">\r\n <span class=\"form-label mb-0\">{{label}}</span>\r\n <span *ngIf=\"!required\" class=\"fs-11 fc-dark-gray\"> {{i18n.translate('optional')}} </span>\r\n </div>\r\n <div class=\"justify-content-between mb-1\">\r\n <mat-form-field [ngClass]=\"{'input-disabled' : isDisabled }\" [floatLabel]=\"floatLabel\">\r\n <label class=\"mat-form-content\">\r\n <input matInput (dateInput)=\"dateChange($event)\" [placeholder]=\"label ? (i18n.translate('select') + ' ' + labelTextWriteMode) : ''\" (focus)=\"focusPicker(dp)\" [min]=\"minDateValue\"\r\n [max]=\"maxDateValue\" readonly [matDatepicker]=\"dp\" [formControl]=\"control\">\r\n </label>\r\n <ds-icon *ngIf=\"control?.value\" matSuffix icon=\"close\" class=\"fc-onyx fs-10 mx-2 cursor-pointer\" (click)=\"clearDateValue($event)\"></ds-icon>\r\n <mat-datepicker-toggle matSuffix [for]=\"dp\">\r\n <ds-icon icon=\"calendar-o\" class=\"fc-black fs-18\" matDatepickerToggleIcon></ds-icon>\r\n </mat-datepicker-toggle>\r\n <mat-datepicker #dp>\r\n </mat-datepicker>\r\n <!-- <mat-error *ngIf=\"errorMessage\">{{errorMessage}}</mat-error> -->\r\n </mat-form-field>\r\n <app-validation-errors [errors]=\"control.errors\"></app-validation-errors>\r\n </div>\r\n\r\n</ng-container>\r\n\r\n<ng-container *ngIf=\"isReadOnly && control\">\r\n <app-info-item class=\"info-item w-100\" type=\"date\" [insideTable]=\"insideTable\" [dateType]=\"calendarType\" [label]=\"labelTextReadMode\"\r\n [value]=\"control.value\" [hasLabel]=\"label? true: false\">\r\n </app-info-item>\r\n</ng-container>\r\n", styles: [":host{flex-grow:1}::ng-deep .year-only .mat-calendar-period-button{pointer-events:none}::ng-deep .year-only .mat-calendar-arrow{display:none}\n"] }]
3035
3038
  }], propDecorators: { tooltip: [{
3036
3039
  type: Input
3037
3040
  }], className: [{
@@ -4157,7 +4160,7 @@ class TableListComponent extends BaseComponent {
4157
4160
  sentBack() {
4158
4161
  }
4159
4162
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: TableListComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
4160
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: TableListComponent, isStandalone: true, selector: "app-table-list", inputs: { columns: "columns", columnsConfig: "columnsConfig", rows: "rows", actions: "actions", totalRecords: "totalRecords", className: "className" }, outputs: { pageChanged: "pageChanged", buttonAction: "buttonAction", emitDataRow: "emitDataRow" }, usesInheritance: true, ngImport: i0, template: "<div class=\"overflow-auto\">\r\n <!-- #table (scroll)=\"onPageChange($event)\" -->\r\n <ng-container >\r\n <!-- (matSortChange)=\"sortData($event)\" -->\r\n <table mat-table [dataSource]=\"dataSource\" class=\"primary-table {{className}}\" matSort >\r\n <ng-container *ngFor=\"let column of columns; let i = index;\">\r\n <ng-container [matColumnDef]=\"column\">\r\n <th mat-header-cell *matHeaderCellDef [ngClass]=\"{'last-column' : columnsConfig[i].type === 'actions', 'sortArrow': columnsConfig[i]?.sortName?.length }\" mat-sort-header>\r\n {{i18n.translate(columnsConfig[i].label)}} </th>\r\n \r\n <td mat-cell [ngClass]=\"{'account-disabled': element?.user?.disabledCleanUp===true}\" *matCellDef=\"let element\">\r\n <ng-container [ngSwitch]=\"columnsConfig[i].type\" *ngIf=\"rows.length\">\r\n <a [ngClass]=\"columnsConfig[i].type\" [href]=\"element[column]\" *ngSwitchCase=\"'link'\">\r\n {{ element[column] }}\r\n </a>\r\n \r\n <a [ngClass]=\"columnsConfig[i].type\" [routerLink]=\"[element.id]\" [href]=\"element[column]\"\r\n *ngSwitchCase=\"'rout'\">\r\n {{ element[column] }}\r\n </a>\r\n \r\n <span class=\"d-inline-flex align-items-center\" [ngClass]=\"columnsConfig[i].type\" *ngSwitchCase=\"'date'\">\r\n <span class=\"sfi sfi-clock text-color-coral\" *ngIf=\"!loading\"></span>\r\n <span class=\"mx-2\">\r\n <!-- {{ element?.Date.from }}\r\n <ng-container *ngIf=\"element?.Date.to\">\r\n : {{ element?.Date.to }}\r\n </ng-container> -->\r\n {{ element[column] | date: 'dd/MM/YYYY' }}\r\n </span>\r\n </span>\r\n \r\n <div class=\"d-inline-flex align-items-center\" [ngClass]=\"columnsConfig[i].type\" *ngSwitchCase=\"'sla'\">\r\n <app-sla [value]=\"element?.SLA.value\" [maxValue]=\"element?.SLA.max\" [canvasScale]=\"45\"\r\n [outerLineColor]=\"getSlaColor(element?.SLA.value, element?.SLA.max)\"></app-sla>\r\n </div>\r\n \r\n <div class=\"img-card table-img\" [ngClass]=\"columnsConfig[i].type\" *ngSwitchCase=\"'image'\">\r\n <img [src]=\"element?.image\" alt=\"\">\r\n </div>\r\n \r\n <span class=\"{{ element[column].type }}\" [ngClass]=\"columnsConfig[i].type\" *ngSwitchCase=\"'status'\">\r\n {{ element[column].label }}\r\n </span>\r\n \r\n \r\n <div class=\"d-flex mx-n1\" *ngSwitchCase=\"'RequestType'\">\r\n <div class=\"request-type mx-1 {{item.status}}\" *ngFor=\"let item of element?.RequestType\">\r\n {{ item.label }}\r\n <span class=\"mx-1\" *ngIf=\"item.status === 'need-action'\"></span>\r\n <span class=\"sfi sfi-info \" *ngIf=\"item.status === 'need-action'\"></span>\r\n </div>\r\n </div>\r\n \r\n \r\n <span class=\"{{ element[column].type }} {{ element[column] ? 'text-color-coral underline' : '' }}\"\r\n [ngClass]=\"columnsConfig[i].type\" *ngSwitchCase=\"'number'\">\r\n {{ element[column] ? element[column] : '-' }}\r\n </span>\r\n \r\n <div class=\"text-nowrap d-flex align-items-center\" [ngClass]=\"columnsConfig[i].type\"\r\n *ngSwitchCase=\"'group'\">\r\n <span>{{element?.Group.groupName}}</span>\r\n <span class=\"mx-2\"></span>\r\n <app-repeated-list type=\"users-avatar\" [listOfItems]=\"element?.Group.users\"></app-repeated-list>\r\n </div>\r\n \r\n <div class=\"d-flex align-items-center gap-2\" [ngClass]=\"columnsConfig[i].type\" *ngSwitchCase=\"'user'\">\r\n <span class=\"img-card circled-img small\" *ngIf=\"!loading\">\r\n <img src=\"{{'data:image/png;base64,' + element?.user?.personalPhoto}}\"\r\n onerror=\"this.onerror=null;this.src='assets/images/user.svg';\" alt=\"\">\r\n </span>\r\n <div class=\"d-flex flex-column\">\r\n <span class=\"font-14 font-weight-medium\">{{element?.user?.name}}</span>\r\n <span class=\"font-12 font-weight-normal text-color-dark-gray mt-1\">{{element?.user?.email}}</span>\r\n </div>\r\n </div>\r\n \r\n \r\n <div class=\"delegate d-flex align-items-center\" [ngClass]=\"columnsConfig[i].type\"\r\n *ngSwitchCase=\"'assigned'\">\r\n <div class=\"img-card x-small circled-img\">\r\n <img [src]=\"element?.AssignedTo.image\" alt=\"\">\r\n </div>\r\n <span class=\"mx-1\"></span>\r\n <span class=\"font-14 font-weight-medium text-color-onyx\">{{element?.AssignedTo.name}}</span>\r\n <span class=\"sfi sfi-close text-color-coral\"></span>\r\n </div>\r\n \r\n \r\n <ng-container *ngSwitchCase=\"'statusAction'\">\r\n <div class=\"table-action\">\r\n \r\n <div class=\"count-down mx-n1\" *ngIf=\"element[column] === 'need-action'\">\r\n <div class=\"item mx-1\">\r\n <span class=\"font-12 font-weight-medium text-color-onyx d-block\">01</span>\r\n <span class=\"font-8 font-weight-light text-color-onyx d-block\">Days</span>\r\n </div>\r\n <div class=\"item mx-1\">\r\n <span class=\"font-12 font-weight-medium text-color-onyx d-block\">18</span>\r\n <span class=\"font-8 font-weight-light text-color-onyx d-block\">Hours</span>\r\n </div>\r\n <div class=\"item mx-1\">\r\n <span class=\"font-12 font-weight-medium text-color-onyx d-block\">44</span>\r\n <span class=\"font-8 font-weight-light text-color-onyx d-block\">Mins</span>\r\n </div>\r\n </div>\r\n \r\n <div class=\"d-flex align-items-center\" *ngIf=\"element[column] === 'approved'\">\r\n <span class=\"status approved\">\r\n Approved\r\n </span>\r\n </div>\r\n \r\n <div class=\"d-flex align-items-center\" *ngIf=\"element[column] === 'sent-back'\">\r\n <span class=\"status rejected\">\r\n Sent Back\r\n </span>\r\n <span class=\"mx-2\"></span>\r\n <button mat-stroked-button class=\"btn button-primary square br-w-1 font-14 font-weight-medium\"\r\n (click)=\"sentBack()\">\r\n <span class=\"sfi sfi-chat-o\"></span>\r\n </button>\r\n </div>\r\n \r\n <div class=\"d-flex align-items-center\" *ngIf=\"element[column] === 'pending'\">\r\n <span class=\"status pending\">\r\n Pending\r\n </span>\r\n <span class=\"mx-2\"></span>\r\n \r\n <div class=\"d-flex align-items-center mx-n1\">\r\n <div class=\"img-card circled-img x-small mx-1\">\r\n <img [src]=\"element?.pendingWith.image\" alt=\"\">\r\n </div>\r\n \r\n <div class=\"d-flex flex-column mx-1\">\r\n <span class=\"font-8 font-weight-medium text-color-yellow text-nowrap\">Pending With</span>\r\n <span class=\"font-11 font-weight-medium text-nowrap\">{{element?.pendingWith.name}}</span>\r\n </div>\r\n </div>\r\n </div>\r\n \r\n \r\n </div>\r\n </ng-container>\r\n \r\n \r\n <ng-container *ngSwitchCase=\"'actions'\">\r\n \r\n <div class=\"d-flex justify-content-between mx-n2\">\r\n <ng-container *ngFor=\"let action of element[column]\">\r\n \r\n <div class=\"flex-grow-1\">\r\n <ng-container *ngIf=\"action.type.buttonType === 'stroked'\">\r\n <button mat-stroked-button (click)=\"buttonClicked(element,action.fn, $event)\"\r\n class=\"btn button-{{action.type.buttonClass}} mx-2\">\r\n {{action.label}}\r\n </button>\r\n </ng-container>\r\n \r\n <ng-container *ngIf=\"action.type.buttonType === 'flat'\">\r\n <button mat-flat-button (click)=\"buttonClicked(element,action.fn, $event)\"\r\n class=\"btn button-{{action.type.buttonClass}} mx-2\">\r\n {{action.label}}\r\n </button>\r\n </ng-container>\r\n \r\n <ng-container *ngIf=\"action.type.buttonType === 'icon'\">\r\n <button mat-icon-button (click)=\"buttonClicked(element,action.fn, $event)\"\r\n class=\"btn button-{{action.type.buttonClass}} mx-2\">\r\n <span class=\"sfi sfi-{{action.type.icon}}\"></span>\r\n </button>\r\n </ng-container>\r\n </div>\r\n \r\n <ng-container *ngIf=\"action.type.buttonType === 'all'\">\r\n <button mat-icon-button class=\"btn button-transparent square medium mx-2 text-end\"\r\n [matMenuTriggerFor]=\"menuAction\" (click)=\"$event.stopPropagation()\">\r\n <span class=\"sfi sfi-dots text-color-onyx\"></span>\r\n </button>\r\n <mat-menu #menuAction=\"matMenu\" xPosition=\"before\" class=\"actions-menu\">\r\n <button *ngIf=\"!element?.user?.email && element?.user?.disabledCleanUp!==true\" mat-menu-item class=\"text-color-onyx font-12\"\r\n (click)=\"buttonClicked(element,'CreateEmail', $event)\">\r\n {{i18n.translate('createEmail')}} \r\n </button>\r\n <button *ngIf=\"element?.user?.email && element?.user?.enabled==='true'\" mat-menu-item class=\"text-color-red font-12\"\r\n (click)=\"buttonClicked(element,'DisableEmail', $event)\">\r\n {{ i18n.translate('disableEmail')}}\r\n </button>\r\n <button *ngIf=\"element?.user?.email && element?.user?.disabledCleanUp===true\" mat-menu-item class=\"text-color-red font-12\"\r\n (click)=\"buttonClicked(element,'EnableEmail', $event)\">\r\n {{ i18n.translate('enableEmail')}}\r\n </button>\r\n <button *ngIf=\"element?.user!==null && element?.user?.disabledCleanUp!==true\" mat-menu-item class=\"text-color-onyx font-12\"\r\n (click)=\"buttonClicked(element,'CreateEntryPermission', $event)\">\r\n {{ i18n.translate('createCEP')}}\r\n </button>\r\n <!-- <button *ngIf=\"!element?.user?.email\" mat-menu-item class=\"text-color-red font-12\"\r\n (click)=\"buttonClicked(element,'DisableEntryPermission', $event)\">\r\n {{i18n.translate('disableEntryPermission')}}\r\n </button> -->\r\n <button *ngIf=\"!element?.user?.email && element?.user?.disabledCleanUp!==true\" mat-menu-item class=\"text-color-red font-12\"\r\n (click)=\"buttonClicked(element,'DeleteAccount', $event)\">\r\n {{i18n.translate('deleteAccount')}}\r\n </button>\r\n\r\n <button *ngIf=\"element?.user?.email && element?.user?.disabledCleanUp!==true\" [disabled]=\"!element?.mailExtensionAllowed\" mat-menu-item class=\"text-color-onyx font-12\"\r\n (click)=\"buttonClicked(element,'ExtendAccount', $event)\">\r\n {{ i18n.translate('extendAccount')}}\r\n </button>\r\n <button mat-menu-item class=\"text-color-onyx font-12\" *ngIf=\"element?.user?.disabledCleanUp!==true\" (click)=\"buttonClicked(element,'update', $event)\">\r\n {{ i18n.translate('updateEmploymentInformation')}}\r\n </button>\r\n </mat-menu>\r\n </ng-container>\r\n </ng-container>\r\n </div>\r\n </ng-container>\r\n \r\n <span class=\"text-nowrap\" [ngClass]=\"columnsConfig[i].type\" *ngSwitchDefault>\r\n {{ element[column] }}\r\n </span>\r\n </ng-container>\r\n <ng-container *ngIf=\"loading\">\r\n <span class=\" d-block loading-bg\"></span>\r\n </ng-container>\r\n \r\n </td>\r\n \r\n \r\n </ng-container>\r\n </ng-container>\r\n \r\n <tr mat-header-row *matHeaderRowDef=\"columns\"></tr>\r\n <tr mat-row *matRowDef=\"let row; columns: columns;\" class=\"cursor-pointer\" (click)=\"selectedRow(row)\"></tr>\r\n </table>\r\n </ng-container>\r\n <!-- <ng-container *ngIf=\"loading\">\r\n <span>loading...</span>\r\n </ng-container> -->\r\n <!-- <ng-container *ngIf=\"loading\">-->\r\n <!-- <td *matCellDef=\"let element\" >loading....</td>-->\r\n <!-- </ng-container>-->\r\n <!--{{this.rows | json}}-->\r\n \r\n<!-- <app-no-data-placeholder *ngIf=\"noData && !loading\" [noDataPlaceholder]=\"noDataObj\"></app-no-data-placeholder> -->\r\n\r\n <mat-paginator [pageSize]=\"10\" [length]=\"totalRecords\" (page)=\"onPageChange($event)\" \r\n [pageSizeOptions]=\"[5, 10, 25, 100]\" aria-label=\"Select page of users\"></mat-paginator>\r\n <!-- style-paginator -->\r\n <!-- showFirstLastButtons -->\r\n</div>", styles: [""], dependencies: [{ kind: "ngmodule", type: MatPaginatorModule }, { kind: "component", type: i1$5.MatPaginator, selector: "mat-paginator", inputs: ["color", "pageIndex", "length", "pageSize", "pageSizeOptions", "hidePageSize", "showFirstLastButtons", "selectConfig", "disabled"], outputs: ["page"], exportAs: ["matPaginator"] }, { kind: "ngmodule", type: MatTableModule }, { kind: "component", type: i2$2.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i2$2.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i2$2.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i2$2.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i2$2.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i2$2.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i2$2.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i2$2.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i2$2.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i2$2.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: DatePipe, name: "date" }, { kind: "component", type: RepeatedListComponent, selector: "app-repeated-list", inputs: ["listOfItems", "type"] }, { kind: "component", type: MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "component", type: MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "directive", type: MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "component", type: MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: NgSwitchDefault, selector: "[ngSwitchDefault]" }] });
4163
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: TableListComponent, isStandalone: true, selector: "app-table-list", inputs: { columns: "columns", columnsConfig: "columnsConfig", rows: "rows", actions: "actions", totalRecords: "totalRecords", className: "className" }, outputs: { pageChanged: "pageChanged", buttonAction: "buttonAction", emitDataRow: "emitDataRow" }, usesInheritance: true, ngImport: i0, template: "<div class=\"overflow-auto\">\r\n <!-- #table (scroll)=\"onPageChange($event)\" -->\r\n <ng-container >\r\n <!-- (matSortChange)=\"sortData($event)\" -->\r\n <table mat-table [dataSource]=\"dataSource\" class=\"primary-table {{className}}\" matSort >\r\n <ng-container *ngFor=\"let column of columns; let i = index;\">\r\n <ng-container [matColumnDef]=\"column\">\r\n <th mat-header-cell *matHeaderCellDef [ngClass]=\"{'last-column' : columnsConfig[i].type === 'actions', 'sortArrow': columnsConfig[i]?.sortName?.length }\" mat-sort-header>\r\n {{i18n.translate(columnsConfig[i].label)}} </th>\r\n \r\n <td mat-cell [ngClass]=\"{'account-disabled': element?.user?.disabledCleanUp===true}\" *matCellDef=\"let element\">\r\n <ng-container [ngSwitch]=\"columnsConfig[i].type\" *ngIf=\"rows.length\">\r\n <a [ngClass]=\"columnsConfig[i].type\" [href]=\"element[column]\" *ngSwitchCase=\"'link'\">\r\n {{ element[column] }}\r\n </a>\r\n \r\n <a [ngClass]=\"columnsConfig[i].type\" [routerLink]=\"[element.id]\" [href]=\"element[column]\"\r\n *ngSwitchCase=\"'rout'\">\r\n {{ element[column] }}\r\n </a>\r\n \r\n <span class=\"d-inline-flex align-items-center\" [ngClass]=\"columnsConfig[i].type\" *ngSwitchCase=\"'date'\">\r\n <span class=\"sfi sfi-clock text-color-coral\" *ngIf=\"!loading\"></span>\r\n <span class=\"mx-2\">\r\n <!-- {{ element?.Date.from }}\r\n <ng-container *ngIf=\"element?.Date.to\">\r\n : {{ element?.Date.to }}\r\n </ng-container> -->\r\n {{ element[column] | date: 'dd/MM/YYYY' }}\r\n </span>\r\n </span>\r\n \r\n <div class=\"d-inline-flex align-items-center\" [ngClass]=\"columnsConfig[i].type\" *ngSwitchCase=\"'sla'\">\r\n <app-sla [value]=\"element?.SLA.value\" [maxValue]=\"element?.SLA.max\" [canvasScale]=\"45\"\r\n [outerLineColor]=\"getSlaColor(element?.SLA.value, element?.SLA.max)\"></app-sla>\r\n </div>\r\n \r\n <div class=\"img-card table-img\" [ngClass]=\"columnsConfig[i].type\" *ngSwitchCase=\"'image'\">\r\n <img [src]=\"element?.image\" alt=\"\">\r\n </div>\r\n \r\n <span class=\"{{ element[column].type }}\" [ngClass]=\"columnsConfig[i].type\" *ngSwitchCase=\"'status'\">\r\n {{ element[column].label }}\r\n </span>\r\n \r\n \r\n <div class=\"d-flex mx-n1\" *ngSwitchCase=\"'RequestType'\">\r\n <div class=\"request-type mx-1 {{item.status}}\" *ngFor=\"let item of element?.RequestType\">\r\n {{ item.label }}\r\n <span class=\"mx-1\" *ngIf=\"item.status === 'need-action'\"></span>\r\n <span class=\"sfi sfi-info \" *ngIf=\"item.status === 'need-action'\"></span>\r\n </div>\r\n </div>\r\n \r\n \r\n <span class=\"{{ element[column].type }} {{ element[column] ? 'text-color-coral underline' : '' }}\"\r\n [ngClass]=\"columnsConfig[i].type\" *ngSwitchCase=\"'number'\">\r\n {{ element[column] ? element[column] : '-' }}\r\n </span>\r\n \r\n <div class=\"text-nowrap d-flex align-items-center\" [ngClass]=\"columnsConfig[i].type\"\r\n *ngSwitchCase=\"'group'\">\r\n <span>{{element?.Group.groupName}}</span>\r\n <span class=\"mx-2\"></span>\r\n <app-repeated-list type=\"users-avatar\" [listOfItems]=\"element?.Group.users\"></app-repeated-list>\r\n </div>\r\n \r\n <div class=\"d-flex align-items-center gap-2\" [ngClass]=\"columnsConfig[i].type\" *ngSwitchCase=\"'user'\">\r\n <span class=\"img-card circled-img small\" *ngIf=\"!loading\">\r\n <img src=\"{{'data:image/png;base64,' + element?.user?.personalPhoto}}\"\r\n onerror=\"this.onerror=null;this.src='assets/images/user.svg';\" alt=\"\">\r\n </span>\r\n <div class=\"d-flex flex-column\">\r\n <span class=\"font-14 font-weight-medium\">{{element?.user?.name}}</span>\r\n <span class=\"font-12 font-weight-normal text-color-dark-gray mt-1\">{{element?.user?.email}}</span>\r\n </div>\r\n </div>\r\n \r\n \r\n <div class=\"delegate d-flex align-items-center\" [ngClass]=\"columnsConfig[i].type\"\r\n *ngSwitchCase=\"'assigned'\">\r\n <div class=\"img-card x-small circled-img\">\r\n <img [src]=\"element?.AssignedTo.image\" alt=\"\">\r\n </div>\r\n <span class=\"mx-1\"></span>\r\n <span class=\"font-14 font-weight-medium text-color-onyx\">{{element?.AssignedTo.name}}</span>\r\n <span class=\"sfi sfi-close text-color-coral\"></span>\r\n </div>\r\n \r\n \r\n <ng-container *ngSwitchCase=\"'statusAction'\">\r\n <div class=\"table-action\">\r\n \r\n <div class=\"count-down mx-n1\" *ngIf=\"element[column] === 'need-action'\">\r\n <div class=\"item mx-1\">\r\n <span class=\"font-12 font-weight-medium text-color-onyx d-block\">01</span>\r\n <span class=\"font-8 font-weight-light text-color-onyx d-block\">Days</span>\r\n </div>\r\n <div class=\"item mx-1\">\r\n <span class=\"font-12 font-weight-medium text-color-onyx d-block\">18</span>\r\n <span class=\"font-8 font-weight-light text-color-onyx d-block\">Hours</span>\r\n </div>\r\n <div class=\"item mx-1\">\r\n <span class=\"font-12 font-weight-medium text-color-onyx d-block\">44</span>\r\n <span class=\"font-8 font-weight-light text-color-onyx d-block\">Mins</span>\r\n </div>\r\n </div>\r\n \r\n <div class=\"d-flex align-items-center\" *ngIf=\"element[column] === 'approved'\">\r\n <span class=\"status approved\">\r\n Approved\r\n </span>\r\n </div>\r\n \r\n <div class=\"d-flex align-items-center\" *ngIf=\"element[column] === 'sent-back'\">\r\n <span class=\"status rejected\">\r\n Sent Back\r\n </span>\r\n <span class=\"mx-2\"></span>\r\n <button mat-stroked-button class=\"btn button-primary square br-w-1 font-14 font-weight-medium\"\r\n (click)=\"sentBack()\">\r\n <span class=\"sfi sfi-chat-o\"></span>\r\n </button>\r\n </div>\r\n \r\n <div class=\"d-flex align-items-center\" *ngIf=\"element[column] === 'pending'\">\r\n <span class=\"status pending\">\r\n Pending\r\n </span>\r\n <span class=\"mx-2\"></span>\r\n \r\n <div class=\"d-flex align-items-center mx-n1\">\r\n <div class=\"img-card circled-img x-small mx-1\">\r\n <img [src]=\"element?.pendingWith.image\" alt=\"\">\r\n </div>\r\n \r\n <div class=\"d-flex flex-column mx-1\">\r\n <span class=\"font-8 font-weight-medium text-color-yellow text-nowrap\">Pending With</span>\r\n <span class=\"font-11 font-weight-medium text-nowrap\">{{element?.pendingWith.name}}</span>\r\n </div>\r\n </div>\r\n </div>\r\n \r\n \r\n </div>\r\n </ng-container>\r\n \r\n \r\n <ng-container *ngSwitchCase=\"'actions'\">\r\n \r\n <div class=\"d-flex justify-content-between mx-n2\">\r\n <ng-container *ngFor=\"let action of element[column]\">\r\n \r\n <div class=\"flex-grow-1\">\r\n <ng-container *ngIf=\"action.type.buttonType === 'stroked'\">\r\n <button mat-stroked-button (click)=\"buttonClicked(element,action.fn, $event)\"\r\n class=\"btn button-{{action.type.buttonClass}} mx-2\">\r\n {{action.label}}\r\n </button>\r\n </ng-container>\r\n \r\n <ng-container *ngIf=\"action.type.buttonType === 'flat'\">\r\n <button mat-flat-button (click)=\"buttonClicked(element,action.fn, $event)\"\r\n class=\"btn button-{{action.type.buttonClass}} mx-2\">\r\n {{action.label}}\r\n </button>\r\n </ng-container>\r\n \r\n <ng-container *ngIf=\"action.type.buttonType === 'icon'\">\r\n <button mat-icon-button (click)=\"buttonClicked(element,action.fn, $event)\"\r\n class=\"btn button-{{action.type.buttonClass}} mx-2\">\r\n <span class=\"sfi sfi-{{action.type.icon}}\"></span>\r\n </button>\r\n </ng-container>\r\n </div>\r\n \r\n <ng-container *ngIf=\"action.type.buttonType === 'all'\">\r\n <button mat-icon-button class=\"btn button-transparent square medium mx-2 text-end\"\r\n [matMenuTriggerFor]=\"menuAction\" (click)=\"$event.stopPropagation()\">\r\n <span class=\"sfi sfi-dots text-color-onyx\"></span>\r\n </button>\r\n <mat-menu #menuAction=\"matMenu\" xPosition=\"before\" class=\"actions-menu\">\r\n <button *ngIf=\"!element?.user?.email && element?.user?.disabledCleanUp!==true\" mat-menu-item class=\"text-color-onyx font-12\"\r\n (click)=\"buttonClicked(element,'CreateEmail', $event)\">\r\n {{i18n.translate('createEmail')}} \r\n </button>\r\n <button *ngIf=\"element?.user?.email && element?.user?.enabled==='true'\" mat-menu-item class=\"text-color-red font-12\"\r\n (click)=\"buttonClicked(element,'DisableEmail', $event)\">\r\n {{ i18n.translate('disableEmail')}}\r\n </button>\r\n <button *ngIf=\"element?.user?.email && element?.user?.disabledCleanUp===true\" mat-menu-item class=\"text-color-red font-12\"\r\n (click)=\"buttonClicked(element,'EnableEmail', $event)\">\r\n {{ i18n.translate('enableEmail')}}\r\n </button>\r\n <button *ngIf=\"element?.user!==null && element?.user?.disabledCleanUp!==true\" mat-menu-item class=\"text-color-onyx font-12\"\r\n (click)=\"buttonClicked(element,'CreateEntryPermission', $event)\">\r\n {{ i18n.translate('createCEP')}}\r\n </button>\r\n <!-- <button *ngIf=\"!element?.user?.email\" mat-menu-item class=\"text-color-red font-12\"\r\n (click)=\"buttonClicked(element,'DisableEntryPermission', $event)\">\r\n {{i18n.translate('disableEntryPermission')}}\r\n </button> -->\r\n <button *ngIf=\"!element?.user?.email && element?.user?.disabledCleanUp!==true\" mat-menu-item class=\"text-color-red font-12\"\r\n (click)=\"buttonClicked(element,'DeleteAccount', $event)\">\r\n {{i18n.translate('deleteAccount')}}\r\n </button>\r\n\r\n <button *ngIf=\"element?.user?.email && element?.user?.disabledCleanUp!==true\" [disabled]=\"!element?.mailExtensionAllowed\" mat-menu-item class=\"text-color-onyx font-12\"\r\n (click)=\"buttonClicked(element,'ExtendAccount', $event)\">\r\n {{ i18n.translate('extendAccount')}}\r\n </button>\r\n <button mat-menu-item class=\"text-color-onyx font-12\" *ngIf=\"element?.user?.disabledCleanUp!==true\" (click)=\"buttonClicked(element,'update', $event)\">\r\n {{ i18n.translate('updateEmploymentInformation')}}\r\n </button>\r\n </mat-menu>\r\n </ng-container>\r\n </ng-container>\r\n </div>\r\n </ng-container>\r\n \r\n <span class=\"text-nowrap\" [ngClass]=\"columnsConfig[i].type\" *ngSwitchDefault>\r\n {{ element[column] }}\r\n </span>\r\n </ng-container>\r\n <ng-container *ngIf=\"loading\">\r\n <span class=\" d-block loading-bg\"></span>\r\n </ng-container>\r\n \r\n </td>\r\n \r\n \r\n </ng-container>\r\n </ng-container>\r\n \r\n <tr mat-header-row *matHeaderRowDef=\"columns\"></tr>\r\n <tr mat-row *matRowDef=\"let row; columns: columns;\" class=\"cursor-pointer\" (click)=\"selectedRow(row)\"></tr>\r\n </table>\r\n </ng-container>\r\n <!-- <ng-container *ngIf=\"loading\">\r\n <span>loading...</span>\r\n </ng-container> -->\r\n <!-- <ng-container *ngIf=\"loading\">-->\r\n <!-- <td *matCellDef=\"let element\" >loading....</td>-->\r\n <!-- </ng-container>-->\r\n <!--{{this.rows | json}}-->\r\n \r\n<!-- <app-no-data-placeholder *ngIf=\"noData && !loading\" [noDataPlaceholder]=\"noDataObj\"></app-no-data-placeholder> -->\r\n\r\n <mat-paginator [pageSize]=\"10\" [length]=\"totalRecords\" (page)=\"onPageChange($event)\" \r\n [pageSizeOptions]=\"[5, 10, 25, 100]\" aria-label=\"Select page of users\"></mat-paginator>\r\n <!-- style-paginator -->\r\n <!-- showFirstLastButtons -->\r\n</div>", styles: [""], dependencies: [{ kind: "ngmodule", type: MatPaginatorModule }, { kind: "component", type: i1$5.MatPaginator, selector: "mat-paginator", inputs: ["color", "pageIndex", "length", "pageSize", "pageSizeOptions", "hidePageSize", "showFirstLastButtons", "selectConfig", "disabled"], outputs: ["page"], exportAs: ["matPaginator"] }, { kind: "ngmodule", type: MatTableModule }, { kind: "component", type: i2$3.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i2$3.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i2$3.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i2$3.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i2$3.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i2$3.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i2$3.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i2$3.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i2$3.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i2$3.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: DatePipe, name: "date" }, { kind: "component", type: RepeatedListComponent, selector: "app-repeated-list", inputs: ["listOfItems", "type"] }, { kind: "component", type: MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "component", type: MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "directive", type: MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "component", type: MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: NgSwitchDefault, selector: "[ngSwitchDefault]" }] });
4161
4164
  }
4162
4165
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: TableListComponent, decorators: [{
4163
4166
  type: Component,
@@ -4569,7 +4572,7 @@ class ApprovalsWorkflowComponent {
4569
4572
  this.coreService.approvals = JSON.stringify(this.approvals);
4570
4573
  this.sidenavService.publish('open', ApprovalsComponent);
4571
4574
  }
4572
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: ApprovalsWorkflowComponent, deps: [{ token: CoreI18nService }, { token: SidenavService }, { token: CoreService }, { token: i2$3.ToastrService }], target: i0.ɵɵFactoryTarget.Component });
4575
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: ApprovalsWorkflowComponent, deps: [{ token: CoreI18nService }, { token: SidenavService }, { token: CoreService }, { token: i2$4.ToastrService }], target: i0.ɵɵFactoryTarget.Component });
4573
4576
  static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.8", type: ApprovalsWorkflowComponent, isStandalone: true, selector: "lib-approvals-workflow", inputs: { section: "section", form: "form" }, ngImport: i0, template: "<ds-button\r\n color=\"white\" shape=\"text\" square size=\"small\"\r\n (click)=\"getApproves()\">\r\n <slot name=\"prefix\">\r\n @if (loading) {\r\n <ds-icon class=\"sfi sfi-spinner d-inline-block spin fc-coral fs-30-imp\"></ds-icon>\r\n } @else {\r\n <ds-icon icon=\"workflow\" class=\"fs-24\"></ds-icon>\r\n }\r\n </slot>\r\n</ds-button>\r\n", styles: ["::ng-deep .sat-popover-container.sat-popover-before .default-popover:before{display:none}\n"], dependencies: [{ kind: "ngmodule", type: SatPopoverModule }] });
4574
4577
  }
4575
4578
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: ApprovalsWorkflowComponent, decorators: [{
@@ -4578,7 +4581,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImpor
4578
4581
  SatPopoverModule,
4579
4582
  NgIf
4580
4583
  ], schemas: [CUSTOM_ELEMENTS_SCHEMA], template: "<ds-button\r\n color=\"white\" shape=\"text\" square size=\"small\"\r\n (click)=\"getApproves()\">\r\n <slot name=\"prefix\">\r\n @if (loading) {\r\n <ds-icon class=\"sfi sfi-spinner d-inline-block spin fc-coral fs-30-imp\"></ds-icon>\r\n } @else {\r\n <ds-icon icon=\"workflow\" class=\"fs-24\"></ds-icon>\r\n }\r\n </slot>\r\n</ds-button>\r\n", styles: ["::ng-deep .sat-popover-container.sat-popover-before .default-popover:before{display:none}\n"] }]
4581
- }], ctorParameters: () => [{ type: CoreI18nService }, { type: SidenavService }, { type: CoreService }, { type: i2$3.ToastrService }], propDecorators: { section: [{
4584
+ }], ctorParameters: () => [{ type: CoreI18nService }, { type: SidenavService }, { type: CoreService }, { type: i2$4.ToastrService }], propDecorators: { section: [{
4582
4585
  type: Input
4583
4586
  }], form: [{
4584
4587
  type: Input
@@ -4677,7 +4680,7 @@ class ActionButtonsComponent {
4677
4680
  }
4678
4681
  return '';
4679
4682
  }
4680
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: ActionButtonsComponent, deps: [{ token: CoreI18nService }, { token: ActionStateService }, { token: CoreService }, { token: i1$1.MatDialog }, { token: i2$3.ToastrService }, { token: i0.ChangeDetectorRef }, { token: SidenavService }], target: i0.ɵɵFactoryTarget.Component });
4683
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: ActionButtonsComponent, deps: [{ token: CoreI18nService }, { token: ActionStateService }, { token: CoreService }, { token: i1$1.MatDialog }, { token: i2$4.ToastrService }, { token: i0.ChangeDetectorRef }, { token: SidenavService }], target: i0.ɵɵFactoryTarget.Component });
4681
4684
  static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.8", type: ActionButtonsComponent, isStandalone: true, selector: "lib-action-buttons", inputs: { lovOptions: "lovOptions", lovType: "lovType", fieldsForm: "fieldsForm", form: "form", section: "section", sections: "sections", showApprovalCycle: "showApprovalCycle", customCall: "customCall" }, outputs: { resetFormEmit: "resetFormEmit", customCallEmit: "customCallEmit" }, ngImport: i0, template: "<div class=\"mt-4\">\r\n @if (lovType === 'button') {\r\n <div class=\"d-flex align-items-center gap-3\">\r\n <ds-button shape=\"text\" color=\"red\" (click)=\"resetForm()\">\r\n <span class=\"fs-16 fw-medium\">{{ i18n.translate('reset') }}</span>\r\n </ds-button>\r\n @if (form?.sections?.length == 1 && showApprovalCycle) {\r\n <lib-approvals-workflow [section]=\"section\" [form]=\"form\"></lib-approvals-workflow>\r\n }\r\n <div class=\"d-flex flex-wrap align-items-center flex-grow-1 flex-row-reverse gap-3\">\r\n @for (item of lovOptions; track $index) {\r\n <ds-button\r\n loading=\"{{isSubmitting[item.value]}}\"\r\n [ngClass]=\"{'disabled': !actionStates[item.value] || submittingForm}\"\r\n shape=\"{{ buttonShape(item) }}\"\r\n color=\"{{ buttonColor(item) }}\"\r\n (click)=\"onSubmit(item?.value)\">\r\n {{ item?.['description'] }}\r\n </ds-button>\r\n }\r\n </div>\r\n </div>\r\n } @else {\r\n <div class=\"d-flex align-items-center gap-3\">\r\n <ds-button shape=\"text\" color=\"red\" (click)=\"resetForm()\">\r\n <span class=\"fs-16 fw-medium\">{{ i18n.translate('reset') }}</span>\r\n </ds-button>\r\n @if (form?.sections?.length == 1 && showApprovalCycle) {\r\n <lib-approvals-workflow [section]=\"section\" [form]=\"form\"></lib-approvals-workflow>\r\n }\r\n <div class=\"d-flex flex-wrap align-items-center flex-grow-1 flex-row-reverse gap-3\">\r\n <ds-button\r\n [ngClass]=\"{'disabled': !actionStates['SUBMIT'] || submittingForm}\"\r\n loading=\"{{isSubmitting['SUBMIT']}}\"\r\n (click)=\"onSubmit('SUBMIT')\">\r\n {{ i18n.translate('submit') }}\r\n </ds-button>\r\n </div>\r\n </div>\r\n }\r\n</div>\r\n", styles: [""], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ApprovalsWorkflowComponent, selector: "lib-approvals-workflow", inputs: ["section", "form"] }] });
4682
4685
  }
4683
4686
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: ActionButtonsComponent, decorators: [{
@@ -4689,7 +4692,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImpor
4689
4692
  NgForOf,
4690
4693
  ApprovalsWorkflowComponent
4691
4694
  ], template: "<div class=\"mt-4\">\r\n @if (lovType === 'button') {\r\n <div class=\"d-flex align-items-center gap-3\">\r\n <ds-button shape=\"text\" color=\"red\" (click)=\"resetForm()\">\r\n <span class=\"fs-16 fw-medium\">{{ i18n.translate('reset') }}</span>\r\n </ds-button>\r\n @if (form?.sections?.length == 1 && showApprovalCycle) {\r\n <lib-approvals-workflow [section]=\"section\" [form]=\"form\"></lib-approvals-workflow>\r\n }\r\n <div class=\"d-flex flex-wrap align-items-center flex-grow-1 flex-row-reverse gap-3\">\r\n @for (item of lovOptions; track $index) {\r\n <ds-button\r\n loading=\"{{isSubmitting[item.value]}}\"\r\n [ngClass]=\"{'disabled': !actionStates[item.value] || submittingForm}\"\r\n shape=\"{{ buttonShape(item) }}\"\r\n color=\"{{ buttonColor(item) }}\"\r\n (click)=\"onSubmit(item?.value)\">\r\n {{ item?.['description'] }}\r\n </ds-button>\r\n }\r\n </div>\r\n </div>\r\n } @else {\r\n <div class=\"d-flex align-items-center gap-3\">\r\n <ds-button shape=\"text\" color=\"red\" (click)=\"resetForm()\">\r\n <span class=\"fs-16 fw-medium\">{{ i18n.translate('reset') }}</span>\r\n </ds-button>\r\n @if (form?.sections?.length == 1 && showApprovalCycle) {\r\n <lib-approvals-workflow [section]=\"section\" [form]=\"form\"></lib-approvals-workflow>\r\n }\r\n <div class=\"d-flex flex-wrap align-items-center flex-grow-1 flex-row-reverse gap-3\">\r\n <ds-button\r\n [ngClass]=\"{'disabled': !actionStates['SUBMIT'] || submittingForm}\"\r\n loading=\"{{isSubmitting['SUBMIT']}}\"\r\n (click)=\"onSubmit('SUBMIT')\">\r\n {{ i18n.translate('submit') }}\r\n </ds-button>\r\n </div>\r\n </div>\r\n }\r\n</div>\r\n" }]
4692
- }], ctorParameters: () => [{ type: CoreI18nService }, { type: ActionStateService }, { type: CoreService }, { type: i1$1.MatDialog }, { type: i2$3.ToastrService }, { type: i0.ChangeDetectorRef }, { type: SidenavService }], propDecorators: { lovOptions: [{
4695
+ }], ctorParameters: () => [{ type: CoreI18nService }, { type: ActionStateService }, { type: CoreService }, { type: i1$1.MatDialog }, { type: i2$4.ToastrService }, { type: i0.ChangeDetectorRef }, { type: SidenavService }], propDecorators: { lovOptions: [{
4693
4696
  type: Input
4694
4697
  }], lovType: [{
4695
4698
  type: Input
@@ -5276,12 +5279,15 @@ class ServiceHeaderComponent {
5276
5279
  const resultData = [];
5277
5280
  for (const element of comments) {
5278
5281
  const item = element;
5282
+ console.log('item[\'commentDate\']', item['commentDate']);
5283
+ let commentDate = moment(item['commentDate']);
5284
+ console.log('commentDate', commentDate);
5279
5285
  const obj = {
5280
5286
  name: item['employeeName'],
5281
5287
  title: item.jobPosition,
5282
5288
  image: item['profilePicture'],
5283
- date: moment(item['commentDate']).locale('en-US').format('YYYY-MM-DD'),
5284
- time: moment(item['commentDate']).locale('en-US').format('h:mm a'),
5289
+ date: commentDate.locale('en-US').format('YYYY-MM-DD'),
5290
+ time: commentDate.locale('en-US').format('h:mm a'),
5285
5291
  comment: item['commentBody'],
5286
5292
  attachments: item['attachment']
5287
5293
  };
@@ -5560,7 +5566,7 @@ class FormSectionComponent {
5560
5566
  }
5561
5567
  }
5562
5568
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: FormSectionComponent, deps: [{ token: CoreI18nService }, { token: CoreService }, { token: SidenavService }], target: i0.ɵɵFactoryTarget.Component });
5563
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: FormSectionComponent, isStandalone: true, selector: "app-form-section", inputs: { requestDetails: "requestDetails", section: "section", form: "form", lov: "lov", isReadOnly: "isReadOnly", controllers: "controllers", segmentDynamicLoaderService: "segmentDynamicLoaderService", sectionFormComponent: "sectionFormComponent", sectionName: "sectionName" }, ngImport: i0, template: "<mat-expansion-panel\r\n class=\"mb-4\" [expanded]=\"isExpanded\" *ngIf=\"form?.header?.status?.['key'] !== 'NEW' \" hideToggle\r\n #approvalPanel=\"matExpansionPanel\">\r\n <mat-expansion-panel-header>\r\n\r\n <div class=\"approval-panel-container\">\r\n <div class=\"d-flex gap-2 flex-grow-1 approval-panel-title\">\r\n <ds-status\r\n status=\"{{statusClass(sectionStatusKey)}}\" no-opacity icon\r\n class=\"circle-status d-none d-sm-inline-block\">\r\n <ds-icon icon=\"{{statusIcon(sectionStatusKey)}}\"></ds-icon>\r\n </ds-status>\r\n <div class=\"d-flex flex-column flex-grow-1\">\r\n <span class=\"fs-16 fw-medium m-0\"> {{ sectionName }}</span>\r\n <bdi class=\"fs-12 fc-dark-gray fw-normal line-height-1 d-block mt-1\" *ngIf=\"section.header?.processedBy\">\r\n {{ processingDate }}\r\n </bdi>\r\n </div>\r\n </div>\r\n <div class=\"approval-panel-details gap-1\">\r\n\r\n <ng-container *ngIf=\"(!section?.body?.details?.['stage0']?.['isStage0'] || section?.body?.details?.['stage0']?.['isStage0'] === 'false')\">\r\n <div\r\n class=\"d-flex align-items-center gap-3\" *ngIf=\"section?.header?.personTo;\"\r\n (click)=\"$event.stopImmediatePropagation();\">\r\n <div\r\n (click)=\"toggleSmallProfileInfo($event, 'recipient')\"\r\n class=\"d-flex align-items-center gap-2 radius-3 h-40\"\r\n [ngClass]=\"{'user-avatar-name px-0 px-md-2': !section?.header?.delegatedTo, 'p-0': section?.header?.delegatedTo}\">\r\n <ds-avatar image=\"{{section?.header?.personToThumbnail}}\" size=\"small\" class=\"user-avatar\"></ds-avatar>\r\n <span\r\n class=\"fs-14 fw-medium d-inline-block panel-user-name text-truncate\" [ngClass]=\"{'panel-user-only': !section?.header?.delegatedTo}\"\r\n *ngIf=\"!section?.header?.delegatedTo\">{{ section?.header?.personTo }}</span>\r\n </div>\r\n\r\n <div\r\n *ngIf=\"section?.header?.delegatedTo\" class=\"d-flex align-items-center gap-3\"\r\n (click)=\"toggleSmallProfileInfo($event, 'delegate')\">\r\n <img\r\n class=\"rotate-arrow\"\r\n alt=\"\"\r\n src=\"data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMSIgaGVpZ2h0PSIxMyIgdmlld0JveD0iMCAwIDIxIDEzIj48cGF0aCBkPSJNMjEsNy43NjNhMS42MjEsMS42MjEsMCwwLDEtLjQ0Ny41OTMsMS4zMDYsMS4zMDYsMCwwLDEtLjc1LjE5NGMtNy4yODQsMC04LjU2OCwwLTE1Ljg1MywwSDMuNjY5TDMuNjMsOC42Yy4wNzcuMDY0LjE1OC4xMjQuMjI5LjE5NHExLjcxLDEuNjksMy40MiwzLjM4MWExLjAyMywxLjAyMywwLDAsMSwuMjkxLDEuMDc5Ljk5Mi45OTIsMCwwLDEtLjguNzE5LDEuMDUzLDEuMDUzLDAsMCwxLTEtLjMzMVEzLjgzMSwxMS43MTksMS44ODYsOS44Yy0uNDQyLS40MzctLjg3OS0uODgxLTEuMzMtMS4zMDlBNC41NzIsNC41NzIsMCwwLDEsMCw3LjgxNFY3LjE4NUEzMC43ODMsMzAuNzgzLDAsMCwxLDIuNzMsNC4zNzFjMS0xLjAyNywyLjAzOC0yLjAyNSwzLjA2My0zLjAzMkExLjA0OSwxLjA0OSwwLDEsMSw3LjI3NywyLjgyQzYuNCwzLjcsNS41MDksNC41Nyw0LjYyNSw1LjQ0NmMtLjMyMy4zMjEtLjY0NC42NDUtLjk3My45NzYuMDg0LjA1OS4xODEuMDI3LjI3LjAyNyw3LjI1OCwwLDguNTE2LDAsMTUuNzc1LDBBMS4xMjksMS4xMjksMCwwLDEsMjEsNy4yOXYuNDcyWiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMCAtMC45OTkpIiBmaWxsPSIjYTU0ZWUxIi8+PC9zdmc+\"/>\r\n <div class=\"d-flex align-items-center gap-2 px-0 px-md-2 radius-3 user-avatar-name h-40\">\r\n <ds-avatar image=\"{{section?.header?.delegatedToThumbnail}}\" size=\"small\" class=\"user-avatar\"></ds-avatar>\r\n <span\r\n class=\"fs-14 fw-medium d-inline-block panel-user-name text-truncate\">{{ section?.header?.delegatedTo }}</span>\r\n </div>\r\n\r\n </div>\r\n </div>\r\n </ng-container>\r\n <ds-status\r\n class=\"main-status\" *ngIf=\"section?.body?.details?.['decision']?.key;\"\r\n status=\"{{statusClass(section?.body?.details?.['decision']?.key)}}\">{{ section?.body?.details?.['decision']?.value }}\r\n </ds-status>\r\n </div>\r\n\r\n <div class=\"approval-panel-toggle\">\r\n <ds-icon icon=\"plus-1\" class=\"fs-20 fc-coral\" *ngIf=\"!approvalPanel.expanded\"></ds-icon>\r\n <ds-icon icon=\"minus\" class=\"fs-20 fc-dark-gray\" *ngIf=\"approvalPanel.expanded\"></ds-icon>\r\n </div>\r\n\r\n </div>\r\n </mat-expansion-panel-header>\r\n <section class=\"border-top pt-4\">\r\n <ng-container *ngComponentOutlet=\"sectionFormComponent; ndcDynamicInputs: input\"></ng-container>\r\n </section>\r\n\r\n</mat-expansion-panel>\r\n<ng-container *ngIf=\"form?.header?.status?.['key'] == 'NEW' \">\r\n <ng-container *ngComponentOutlet=\"sectionFormComponent; ndcDynamicInputs: input\"></ng-container>\r\n</ng-container>\r\n", styles: [":host ::ng-deep .mat-expansion-panel-content{background:#fff!important}:host .mat-expansion-panel-content{background:#fff!important}:host .approval-panel-container{display:grid;grid-template-columns:40% calc(60% - 45px) 20px;grid-template-areas:\"title details toggle\";gap:.75rem;place-content:space-between;align-items:center;flex-grow:1;width:100%}@media (max-width: 991px){:host .approval-panel-container{grid-template-columns:calc(100% - 45px) 20px;grid-template-areas:\"title toggle\" \"details details\"}}:host .approval-panel-container .approval-panel-title{grid-area:title}:host .approval-panel-container .panel-user-name{max-width:120px}@media (max-width: 768px){:host .approval-panel-container .panel-user-name.panel-ueser-only{max-width:140px}:host .approval-panel-container .panel-user-name:not(.panel-ueser-only){max-width:90px}}:host .approval-panel-container .approval-panel-details{display:flex;align-items:center;justify-content:space-between;grid-area:details}:host .approval-panel-container .approval-panel-toggle{grid-area:toggle;display:flex;align-items:center;justify-content:center;width:20px}:host ::ng-deep ds-avatar.user-avatar .avatar{--default-size: 25px}@media (min-width: 768px){:host ::ng-deep ds-avatar.user-avatar .avatar{--default-size: 31px;--avatar-border: 3px solid var(--light-gray)}}@media (min-width: 768px){:host ::ng-deep .user-avatar-name{padding-inline-end:1rem!important}}:host .circle-status::part(base){--status-radius: 50%;--status-size: 18px;--status-fs: 80% }:host .panel-title{min-width:40%;width:40%}@media (max-width: 576px){:host .panel-title{min-width:100%!important;width:100%!important}}:host .panel-user-status{min-width:60%;width:60%;display:flex;align-items:center;justify-content:space-between}@media (max-width: 576px){:host .panel-user-status{min-width:100%!important;width:100%!important}:host .panel-user-status .user-delegate{min-width:auto}:host .panel-user-status .main-status::part(base){--status-width: 50px}}\n"], dependencies: [{ kind: "ngmodule", type: MatExpansionModule }, { kind: "component", type: i2$4.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["hideToggle", "togglePosition"], outputs: ["afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "component", type: i2$4.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["expandedHeight", "collapsedHeight", "tabIndex"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"] }, { kind: "directive", type: ComponentOutletIoDirective, selector: "[ngComponentOutletNdcDynamicInputs],[ngComponentOutletNdcDynamicOutputs]", inputs: ["ngComponentOutletNdcDynamicInputs", "ngComponentOutletNdcDynamicOutputs"], exportAs: ["ndcDynamicIo"] }, { kind: "ngmodule", type: SatPopoverModule }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: DynamicModule }, { kind: "directive", type: i3$1.ComponentOutletInjectorDirective, selector: "[ngComponentOutlet]", exportAs: ["ndcComponentOutletInjector"] }] });
5569
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: FormSectionComponent, isStandalone: true, selector: "app-form-section", inputs: { requestDetails: "requestDetails", section: "section", form: "form", lov: "lov", isReadOnly: "isReadOnly", controllers: "controllers", segmentDynamicLoaderService: "segmentDynamicLoaderService", sectionFormComponent: "sectionFormComponent", sectionName: "sectionName" }, ngImport: i0, template: "<mat-expansion-panel\r\n class=\"mb-4\" [expanded]=\"isExpanded\" *ngIf=\"form?.header?.status?.['key'] !== 'NEW' \" hideToggle\r\n #approvalPanel=\"matExpansionPanel\">\r\n <mat-expansion-panel-header>\r\n\r\n <div class=\"approval-panel-container\">\r\n <div class=\"d-flex gap-2 flex-grow-1 approval-panel-title\">\r\n <ds-status\r\n status=\"{{statusClass(sectionStatusKey)}}\" no-opacity icon\r\n class=\"circle-status d-none d-sm-inline-block\">\r\n <ds-icon icon=\"{{statusIcon(sectionStatusKey)}}\"></ds-icon>\r\n </ds-status>\r\n <div class=\"d-flex flex-column flex-grow-1\">\r\n <span class=\"fs-16 fw-medium m-0\"> {{ sectionName }}</span>\r\n <bdi class=\"fs-12 fc-dark-gray fw-normal line-height-1 d-block mt-1\" *ngIf=\"section.header?.processedBy\">\r\n {{ processingDate }}\r\n </bdi>\r\n </div>\r\n </div>\r\n <div class=\"approval-panel-details gap-1\">\r\n\r\n <ng-container *ngIf=\"(!section?.body?.details?.['stage0']?.['isStage0'] || section?.body?.details?.['stage0']?.['isStage0'] === 'false')\">\r\n <div\r\n class=\"d-flex align-items-center gap-3\" *ngIf=\"section?.header?.personTo;\"\r\n (click)=\"$event.stopImmediatePropagation();\">\r\n <div\r\n (click)=\"toggleSmallProfileInfo($event, 'recipient')\"\r\n class=\"d-flex align-items-center gap-2 radius-3 h-40\"\r\n [ngClass]=\"{'user-avatar-name px-0 px-md-2': !section?.header?.delegatedTo, 'p-0': section?.header?.delegatedTo}\">\r\n <ds-avatar image=\"{{section?.header?.personToThumbnail}}\" size=\"small\" class=\"user-avatar\"></ds-avatar>\r\n <span\r\n class=\"fs-14 fw-medium d-inline-block panel-user-name text-truncate\" [ngClass]=\"{'panel-user-only': !section?.header?.delegatedTo}\"\r\n *ngIf=\"!section?.header?.delegatedTo\">{{ section?.header?.personTo }}</span>\r\n </div>\r\n\r\n <div\r\n *ngIf=\"section?.header?.delegatedTo\" class=\"d-flex align-items-center gap-3\"\r\n (click)=\"toggleSmallProfileInfo($event, 'delegate')\">\r\n <img\r\n class=\"rotate-arrow\"\r\n alt=\"\"\r\n src=\"data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMSIgaGVpZ2h0PSIxMyIgdmlld0JveD0iMCAwIDIxIDEzIj48cGF0aCBkPSJNMjEsNy43NjNhMS42MjEsMS42MjEsMCwwLDEtLjQ0Ny41OTMsMS4zMDYsMS4zMDYsMCwwLDEtLjc1LjE5NGMtNy4yODQsMC04LjU2OCwwLTE1Ljg1MywwSDMuNjY5TDMuNjMsOC42Yy4wNzcuMDY0LjE1OC4xMjQuMjI5LjE5NHExLjcxLDEuNjksMy40MiwzLjM4MWExLjAyMywxLjAyMywwLDAsMSwuMjkxLDEuMDc5Ljk5Mi45OTIsMCwwLDEtLjguNzE5LDEuMDUzLDEuMDUzLDAsMCwxLTEtLjMzMVEzLjgzMSwxMS43MTksMS44ODYsOS44Yy0uNDQyLS40MzctLjg3OS0uODgxLTEuMzMtMS4zMDlBNC41NzIsNC41NzIsMCwwLDEsMCw3LjgxNFY3LjE4NUEzMC43ODMsMzAuNzgzLDAsMCwxLDIuNzMsNC4zNzFjMS0xLjAyNywyLjAzOC0yLjAyNSwzLjA2My0zLjAzMkExLjA0OSwxLjA0OSwwLDEsMSw3LjI3NywyLjgyQzYuNCwzLjcsNS41MDksNC41Nyw0LjYyNSw1LjQ0NmMtLjMyMy4zMjEtLjY0NC42NDUtLjk3My45NzYuMDg0LjA1OS4xODEuMDI3LjI3LjAyNyw3LjI1OCwwLDguNTE2LDAsMTUuNzc1LDBBMS4xMjksMS4xMjksMCwwLDEsMjEsNy4yOXYuNDcyWiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMCAtMC45OTkpIiBmaWxsPSIjYTU0ZWUxIi8+PC9zdmc+\"/>\r\n <div class=\"d-flex align-items-center gap-2 px-0 px-md-2 radius-3 user-avatar-name h-40\">\r\n <ds-avatar image=\"{{section?.header?.delegatedToThumbnail}}\" size=\"small\" class=\"user-avatar\"></ds-avatar>\r\n <span\r\n class=\"fs-14 fw-medium d-inline-block panel-user-name text-truncate\">{{ section?.header?.delegatedTo }}</span>\r\n </div>\r\n\r\n </div>\r\n </div>\r\n </ng-container>\r\n <ds-status\r\n class=\"main-status\" *ngIf=\"section?.body?.details?.['decision']?.key;\"\r\n status=\"{{statusClass(section?.body?.details?.['decision']?.key)}}\">{{ section?.body?.details?.['decision']?.value }}\r\n </ds-status>\r\n </div>\r\n\r\n <div class=\"approval-panel-toggle\">\r\n <ds-icon icon=\"plus-1\" class=\"fs-20 fc-coral\" *ngIf=\"!approvalPanel.expanded\"></ds-icon>\r\n <ds-icon icon=\"minus\" class=\"fs-20 fc-dark-gray\" *ngIf=\"approvalPanel.expanded\"></ds-icon>\r\n </div>\r\n\r\n </div>\r\n </mat-expansion-panel-header>\r\n <section class=\"border-top pt-4\">\r\n <ng-container *ngComponentOutlet=\"sectionFormComponent; ndcDynamicInputs: input\"></ng-container>\r\n </section>\r\n\r\n</mat-expansion-panel>\r\n<ng-container *ngIf=\"form?.header?.status?.['key'] == 'NEW' \">\r\n <ng-container *ngComponentOutlet=\"sectionFormComponent; ndcDynamicInputs: input\"></ng-container>\r\n</ng-container>\r\n", styles: [":host ::ng-deep .mat-expansion-panel-content{background:#fff!important}:host .mat-expansion-panel-content{background:#fff!important}:host .approval-panel-container{display:grid;grid-template-columns:40% calc(60% - 45px) 20px;grid-template-areas:\"title details toggle\";gap:.75rem;place-content:space-between;align-items:center;flex-grow:1;width:100%}@media (max-width: 991px){:host .approval-panel-container{grid-template-columns:calc(100% - 45px) 20px;grid-template-areas:\"title toggle\" \"details details\"}}:host .approval-panel-container .approval-panel-title{grid-area:title}:host .approval-panel-container .panel-user-name{max-width:120px}@media (max-width: 768px){:host .approval-panel-container .panel-user-name.panel-ueser-only{max-width:140px}:host .approval-panel-container .panel-user-name:not(.panel-ueser-only){max-width:90px}}:host .approval-panel-container .approval-panel-details{display:flex;align-items:center;justify-content:space-between;grid-area:details}:host .approval-panel-container .approval-panel-toggle{grid-area:toggle;display:flex;align-items:center;justify-content:center;width:20px}:host ::ng-deep ds-avatar.user-avatar .avatar{--default-size: 25px}@media (min-width: 768px){:host ::ng-deep ds-avatar.user-avatar .avatar{--default-size: 31px;--avatar-border: 3px solid var(--light-gray)}}@media (min-width: 768px){:host ::ng-deep .user-avatar-name{padding-inline-end:1rem!important}}:host .circle-status::part(base){--status-radius: 50%;--status-size: 18px;--status-fs: 80% }:host .panel-title{min-width:40%;width:40%}@media (max-width: 576px){:host .panel-title{min-width:100%!important;width:100%!important}}:host .panel-user-status{min-width:60%;width:60%;display:flex;align-items:center;justify-content:space-between}@media (max-width: 576px){:host .panel-user-status{min-width:100%!important;width:100%!important}:host .panel-user-status .user-delegate{min-width:auto}:host .panel-user-status .main-status::part(base){--status-width: 50px}}\n"], dependencies: [{ kind: "ngmodule", type: MatExpansionModule }, { kind: "component", type: i2$5.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["hideToggle", "togglePosition"], outputs: ["afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "component", type: i2$5.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["expandedHeight", "collapsedHeight", "tabIndex"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"] }, { kind: "directive", type: ComponentOutletIoDirective, selector: "[ngComponentOutletNdcDynamicInputs],[ngComponentOutletNdcDynamicOutputs]", inputs: ["ngComponentOutletNdcDynamicInputs", "ngComponentOutletNdcDynamicOutputs"], exportAs: ["ndcDynamicIo"] }, { kind: "ngmodule", type: SatPopoverModule }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: DynamicModule }, { kind: "directive", type: i3$1.ComponentOutletInjectorDirective, selector: "[ngComponentOutlet]", exportAs: ["ndcComponentOutletInjector"] }] });
5564
5570
  }
5565
5571
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: FormSectionComponent, decorators: [{
5566
5572
  type: Component,
@@ -5606,7 +5612,7 @@ class MainRequestDetailsComponent {
5606
5612
  return this.section?.body?.details?.expandStage === 'true';
5607
5613
  }
5608
5614
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: MainRequestDetailsComponent, deps: [{ token: CoreI18nService }], target: i0.ɵɵFactoryTarget.Component });
5609
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: MainRequestDetailsComponent, isStandalone: true, selector: "app-main-request-details", inputs: { section: "section", lov: "lov", form: "form" }, ngImport: i0, template: "<mat-accordion class=\"primary-accordion main-request-accordion border-top\">\r\n <mat-expansion-panel [expanded]=\"isExpanded || (form?.sections?.length === 1 )\" class=\"mb-3\" hideToggle #requestPanel=\"matExpansionPanel\">\r\n <mat-expansion-panel-header>\r\n <h2 class=\"fs-16 fw-medium fc-coral m-0 flex-grow-1\">{{i18n.translate('requestDetailsTitle')}}</h2>\r\n <div class=\"d-inline-flex align-items-center gap-2\" *ngIf=\"!requestPanel.expanded\">\r\n <ds-icon icon=\"plus-1\" class=\"fs-20 fc-coral\"></ds-icon>\r\n </div>\r\n <div class=\"d-inline-flex align-items-center gap-2\" *ngIf=\"requestPanel.expanded\">\r\n <ds-icon icon=\"minus\" class=\"fs-20 fc-dark-gray\"></ds-icon>\r\n </div>\r\n </mat-expansion-panel-header>\r\n <section class=\"default-box box-shadow p-4\">\r\n <ng-content ></ng-content>\r\n </section>\r\n </mat-expansion-panel>\r\n</mat-accordion>\r\n", styles: [".main-request-accordion{--accordion-height: 65px;--accordion-radius: 0 0 4px 4px;--accordion-shadow: 0 7px 10px rgba(var(--rgb-black), 3%);--accordion-border: 1px solid var(--light-gray);--accordion-border-active: 1px solid var(--gray);--panel-padding: 0 1.5rem;--panel-body-padding: 0 0 1.5rem;position:relative;z-index:1}@media (max-width: 576px){.main-request-accordion{--accordion-height: 55px;--panel-padding: 0 1rem;--panel-body-padding: 0 1rem 1rem}}.main-request-accordion .inner-accordion{--accordion-height: 44px;--accordion-bc: var(--light-gray);--accordion-bc-active: var(--white);--accordion-border: 1px solid var(--light-gray);--accordion-border-active: 1px solid var(--light-gray);--panel-body-padding: 0;--accordion-shadow: none;--panel-padding: 0 1.5rem}\n"], dependencies: [{ kind: "ngmodule", type: MatExpansionModule }, { kind: "directive", type: i2$4.MatAccordion, selector: "mat-accordion", inputs: ["hideToggle", "displayMode", "togglePosition"], exportAs: ["matAccordion"] }, { kind: "component", type: i2$4.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["hideToggle", "togglePosition"], outputs: ["afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "component", type: i2$4.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["expandedHeight", "collapsedHeight", "tabIndex"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
5615
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: MainRequestDetailsComponent, isStandalone: true, selector: "app-main-request-details", inputs: { section: "section", lov: "lov", form: "form" }, ngImport: i0, template: "<mat-accordion class=\"primary-accordion main-request-accordion border-top\">\r\n <mat-expansion-panel [expanded]=\"isExpanded || (form?.sections?.length === 1 )\" class=\"mb-3\" hideToggle #requestPanel=\"matExpansionPanel\">\r\n <mat-expansion-panel-header>\r\n <h2 class=\"fs-16 fw-medium fc-coral m-0 flex-grow-1\">{{i18n.translate('requestDetailsTitle')}}</h2>\r\n <div class=\"d-inline-flex align-items-center gap-2\" *ngIf=\"!requestPanel.expanded\">\r\n <ds-icon icon=\"plus-1\" class=\"fs-20 fc-coral\"></ds-icon>\r\n </div>\r\n <div class=\"d-inline-flex align-items-center gap-2\" *ngIf=\"requestPanel.expanded\">\r\n <ds-icon icon=\"minus\" class=\"fs-20 fc-dark-gray\"></ds-icon>\r\n </div>\r\n </mat-expansion-panel-header>\r\n <section class=\"default-box box-shadow p-4\">\r\n <ng-content ></ng-content>\r\n </section>\r\n </mat-expansion-panel>\r\n</mat-accordion>\r\n", styles: [".main-request-accordion{--accordion-height: 65px;--accordion-radius: 0 0 4px 4px;--accordion-shadow: 0 7px 10px rgba(var(--rgb-black), 3%);--accordion-border: 1px solid var(--light-gray);--accordion-border-active: 1px solid var(--gray);--panel-padding: 0 1.5rem;--panel-body-padding: 0 0 1.5rem;position:relative;z-index:1}@media (max-width: 576px){.main-request-accordion{--accordion-height: 55px;--panel-padding: 0 1rem;--panel-body-padding: 0 1rem 1rem}}.main-request-accordion .inner-accordion{--accordion-height: 44px;--accordion-bc: var(--light-gray);--accordion-bc-active: var(--white);--accordion-border: 1px solid var(--light-gray);--accordion-border-active: 1px solid var(--light-gray);--panel-body-padding: 0;--accordion-shadow: none;--panel-padding: 0 1.5rem}\n"], dependencies: [{ kind: "ngmodule", type: MatExpansionModule }, { kind: "directive", type: i2$5.MatAccordion, selector: "mat-accordion", inputs: ["hideToggle", "displayMode", "togglePosition"], exportAs: ["matAccordion"] }, { kind: "component", type: i2$5.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["hideToggle", "togglePosition"], outputs: ["afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "component", type: i2$5.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["expandedHeight", "collapsedHeight", "tabIndex"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
5610
5616
  }
5611
5617
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: MainRequestDetailsComponent, decorators: [{
5612
5618
  type: Component,
@@ -5910,7 +5916,7 @@ class HeaderComponent {
5910
5916
  // this.sidenavSubscription.unsubscribe()
5911
5917
  }
5912
5918
  location = location;
5913
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: HeaderComponent, deps: [{ token: CoreI18nService }, { token: SidenavService }, { token: CoreService }, { token: i2$5.Router }, { token: PLATFORM_ID }], target: i0.ɵɵFactoryTarget.Component });
5919
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: HeaderComponent, deps: [{ token: CoreI18nService }, { token: SidenavService }, { token: CoreService }, { token: i2$6.Router }, { token: PLATFORM_ID }], target: i0.ɵɵFactoryTarget.Component });
5914
5920
  static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: HeaderComponent, isStandalone: true, selector: "app-header", ngImport: i0, template: "<ng-container *ngIf=\"!isMobile\">\r\n <mat-toolbar\r\n class=\"align-items-center justify-content-between gap-3 border-bottom\"\r\n >\r\n <div class=\"d-flex align-items-center gap-3\">\r\n <ds-button\r\n shape=\"flat\"\r\n icon\r\n color=\"light-gray\"\r\n square\r\n (click)=\"toggleSideNav()\"\r\n >\r\n <ds-icon icon=\"burger-menu-1\" class=\"fs-24 fc-dark-gray\"></ds-icon>\r\n </ds-button>\r\n\r\n <a [href]=\"location.origin\">\r\n <figure class=\"m-0 d-flex\">\r\n <img class=\"main-logo\" src=\"assets/images/hub.svg\" alt=\"\" />\r\n </figure>\r\n </a>\r\n </div>\r\n\r\n <div class=\"d-flex align-items-center gap-3\">\r\n <ds-button\r\n shape=\"flat\"\r\n color=\"light-gray\"\r\n class=\"user-menu-btn\"\r\n [matMenuTriggerFor]=\"userMenu\"\r\n >\r\n <ds-avatar\r\n image=\"/group/i-gate/wm-bpm/forms/-/proxy/portrait?email={{userData?.email}}\"\r\n onerror=\"this.onerror=null;this.src='assets/images/user2.jpg'\"\r\n slot=\"prefix\"\r\n class=\"avatar\"\r\n >\r\n </ds-avatar>\r\n\r\n <span class=\"fs-14 fw-medium fc-black\">\r\n {{ coreService.getShortName( coreService?.loggedInUserData?.['name']) }}\r\n </span>\r\n\r\n <ds-icon\r\n slot=\"suffix\"\r\n icon=\"arrow\"\r\n class=\"fc-dark-gray fs-16\"\r\n ></ds-icon>\r\n </ds-button>\r\n </div>\r\n </mat-toolbar>\r\n\r\n <!-- User Menu -->\r\n <mat-menu #userMenu=\"matMenu\" class=\"user-menu\">\r\n <div mat-menu-item>\r\n <span class=\"fs-14\">{{ translate.translate('welcome') }}, </span>\r\n <br />\r\n <span class=\"fs-14 fw-medium line-height-1\">{{ coreService.getShortName( coreService?.loggedInUserData?.['name']) }}</span>\r\n </div>\r\n <button mat-menu-item (click)=\"setLanguage()\">\r\n <div class=\"d-flex align-items-center gap-2\">\r\n <ds-icon icon=\"globe\" class=\"fs-25 fc-purple\"></ds-icon>\r\n <span class=\"fs-14 fw-medium fc-black\">{{\r\n translate.translate('otherLang')\r\n }}</span>\r\n </div>\r\n </button>\r\n <button mat-menu-item (click)=\"logout()\">\r\n <div class=\"d-flex align-items-center gap-2\">\r\n <ds-icon icon=\"logout\" class=\"fs-25 fc-red\"></ds-icon>\r\n <span class=\"fs-14 fw-medium fc-black\">{{\r\n translate.translate('logout')\r\n }}</span>\r\n </div>\r\n </button>\r\n </mat-menu>\r\n</ng-container>\r\n", styles: [".test-user-agent{position:fixed;top:90px;width:100%;z-index:99999;color:#fff}ds-button[square].burger-menu::part(base){--btn-padding: 10px;margin-bottom:-1px;width:37px;height:37px;--default-size: 37px}[dir=rtl] :host ds-button::part(overlay){inset:0}mat-toolbar{background-color:var(--main-toolbar-bc);height:var(--main-toolbar-height);position:fixed;top:0;z-index:var(--main-toolbar-zIndex);border-bottom:1px solid var(--light-gray)!important}mat-toolbar .logo img{min-width:100px}@media (max-width: 991px){.user-menu-btn::part(base){border:0px;padding:0;--default-size: 40px}.user-menu-btn::part(overlay){border-radius:50%}.user-menu-btn::part(label),.user-menu-btn::part(suffix){display:none}}:host::ng-deep .avatar{min-width:24px;width:24px;height:24px;background-color:transparent}:host::ng-deep ds-button.add::part(base){--btn-bg-color: var(--coral)}@media (max-width: 991px){:host::ng-deep .avatar{min-width:40px;width:40px;height:40px}:host::ng-deep .avatar .avatar--x-small{--default-size: 40px}}.linkS{position:fixed;z-index:2;bottom:100px;right:20px}.dashboard-menu-icon{display:inline-flex;align-items:center;justify-content:center;min-width:56px;width:56px;height:56px;border-radius:50%;background-color:var(--coral);margin-bottom:10px}::ng-deep .inside-mobile-app{--main-toolbar-height: 0px}::ng-deep ds-button.transparent::part(base){--btn-bg-color: transparent;--btn-border-color: transparent;--btn-overlay-color: transparent}::ng-deep .mat-divider-vertical{border-right-color:var(--black)}.mat-divider{--mat-divider-width: 1px;--mat-divider-color: var(--dark-gray)}.header-search{width:500px}@media (max-width: 1130px){.header-search{width:200px}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: RouterModule }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i5.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i5.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i5.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "ngmodule", type: MatToolbarModule }, { kind: "component", type: i6.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }] });
5915
5921
  }
5916
5922
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: HeaderComponent, decorators: [{
@@ -5922,7 +5928,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImpor
5922
5928
  MatMenuModule,
5923
5929
  MatToolbarModule
5924
5930
  ], schemas: [CUSTOM_ELEMENTS_SCHEMA], template: "<ng-container *ngIf=\"!isMobile\">\r\n <mat-toolbar\r\n class=\"align-items-center justify-content-between gap-3 border-bottom\"\r\n >\r\n <div class=\"d-flex align-items-center gap-3\">\r\n <ds-button\r\n shape=\"flat\"\r\n icon\r\n color=\"light-gray\"\r\n square\r\n (click)=\"toggleSideNav()\"\r\n >\r\n <ds-icon icon=\"burger-menu-1\" class=\"fs-24 fc-dark-gray\"></ds-icon>\r\n </ds-button>\r\n\r\n <a [href]=\"location.origin\">\r\n <figure class=\"m-0 d-flex\">\r\n <img class=\"main-logo\" src=\"assets/images/hub.svg\" alt=\"\" />\r\n </figure>\r\n </a>\r\n </div>\r\n\r\n <div class=\"d-flex align-items-center gap-3\">\r\n <ds-button\r\n shape=\"flat\"\r\n color=\"light-gray\"\r\n class=\"user-menu-btn\"\r\n [matMenuTriggerFor]=\"userMenu\"\r\n >\r\n <ds-avatar\r\n image=\"/group/i-gate/wm-bpm/forms/-/proxy/portrait?email={{userData?.email}}\"\r\n onerror=\"this.onerror=null;this.src='assets/images/user2.jpg'\"\r\n slot=\"prefix\"\r\n class=\"avatar\"\r\n >\r\n </ds-avatar>\r\n\r\n <span class=\"fs-14 fw-medium fc-black\">\r\n {{ coreService.getShortName( coreService?.loggedInUserData?.['name']) }}\r\n </span>\r\n\r\n <ds-icon\r\n slot=\"suffix\"\r\n icon=\"arrow\"\r\n class=\"fc-dark-gray fs-16\"\r\n ></ds-icon>\r\n </ds-button>\r\n </div>\r\n </mat-toolbar>\r\n\r\n <!-- User Menu -->\r\n <mat-menu #userMenu=\"matMenu\" class=\"user-menu\">\r\n <div mat-menu-item>\r\n <span class=\"fs-14\">{{ translate.translate('welcome') }}, </span>\r\n <br />\r\n <span class=\"fs-14 fw-medium line-height-1\">{{ coreService.getShortName( coreService?.loggedInUserData?.['name']) }}</span>\r\n </div>\r\n <button mat-menu-item (click)=\"setLanguage()\">\r\n <div class=\"d-flex align-items-center gap-2\">\r\n <ds-icon icon=\"globe\" class=\"fs-25 fc-purple\"></ds-icon>\r\n <span class=\"fs-14 fw-medium fc-black\">{{\r\n translate.translate('otherLang')\r\n }}</span>\r\n </div>\r\n </button>\r\n <button mat-menu-item (click)=\"logout()\">\r\n <div class=\"d-flex align-items-center gap-2\">\r\n <ds-icon icon=\"logout\" class=\"fs-25 fc-red\"></ds-icon>\r\n <span class=\"fs-14 fw-medium fc-black\">{{\r\n translate.translate('logout')\r\n }}</span>\r\n </div>\r\n </button>\r\n </mat-menu>\r\n</ng-container>\r\n", styles: [".test-user-agent{position:fixed;top:90px;width:100%;z-index:99999;color:#fff}ds-button[square].burger-menu::part(base){--btn-padding: 10px;margin-bottom:-1px;width:37px;height:37px;--default-size: 37px}[dir=rtl] :host ds-button::part(overlay){inset:0}mat-toolbar{background-color:var(--main-toolbar-bc);height:var(--main-toolbar-height);position:fixed;top:0;z-index:var(--main-toolbar-zIndex);border-bottom:1px solid var(--light-gray)!important}mat-toolbar .logo img{min-width:100px}@media (max-width: 991px){.user-menu-btn::part(base){border:0px;padding:0;--default-size: 40px}.user-menu-btn::part(overlay){border-radius:50%}.user-menu-btn::part(label),.user-menu-btn::part(suffix){display:none}}:host::ng-deep .avatar{min-width:24px;width:24px;height:24px;background-color:transparent}:host::ng-deep ds-button.add::part(base){--btn-bg-color: var(--coral)}@media (max-width: 991px){:host::ng-deep .avatar{min-width:40px;width:40px;height:40px}:host::ng-deep .avatar .avatar--x-small{--default-size: 40px}}.linkS{position:fixed;z-index:2;bottom:100px;right:20px}.dashboard-menu-icon{display:inline-flex;align-items:center;justify-content:center;min-width:56px;width:56px;height:56px;border-radius:50%;background-color:var(--coral);margin-bottom:10px}::ng-deep .inside-mobile-app{--main-toolbar-height: 0px}::ng-deep ds-button.transparent::part(base){--btn-bg-color: transparent;--btn-border-color: transparent;--btn-overlay-color: transparent}::ng-deep .mat-divider-vertical{border-right-color:var(--black)}.mat-divider{--mat-divider-width: 1px;--mat-divider-color: var(--dark-gray)}.header-search{width:500px}@media (max-width: 1130px){.header-search{width:200px}}\n"] }]
5925
- }], ctorParameters: () => [{ type: CoreI18nService }, { type: SidenavService }, { type: CoreService }, { type: i2$5.Router }, { type: undefined, decorators: [{
5931
+ }], ctorParameters: () => [{ type: CoreI18nService }, { type: SidenavService }, { type: CoreService }, { type: i2$6.Router }, { type: undefined, decorators: [{
5926
5932
  type: Inject,
5927
5933
  args: [PLATFORM_ID]
5928
5934
  }] }] });
@@ -6064,13 +6070,13 @@ class SideNavComponent {
6064
6070
  }
6065
6071
  this.router.navigate([url]);
6066
6072
  }
6067
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SideNavComponent, deps: [{ token: SidenavService }, { token: i2$5.Router }], target: i0.ɵɵFactoryTarget.Component });
6073
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SideNavComponent, deps: [{ token: SidenavService }, { token: i2$6.Router }], target: i0.ɵɵFactoryTarget.Component });
6068
6074
  static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.8", type: SideNavComponent, isStandalone: true, selector: "app-side-nav", inputs: { isOpened: "isOpened" }, viewQueries: [{ propertyName: "MenuTrigger", first: true, predicate: ["MenuTrigger"], descendants: true }], ngImport: i0, template: "<aside>\r\n <div class=\"header d-flex d-lg-none\">\r\n <div class=\"d-flex h-100 mt-auto justify-content-between w-100\">\r\n <h1 class=\"fs-26 fw-bold fc-white logo\">academy</h1>\r\n <ds-button size=\"small\" color=\"purple\" class=\"close purple\" (click)=\"closeSidenav()\">\r\n <ds-icon icon=\"close\" class=\"fs-15 fc-white\"></ds-icon>\r\n </ds-button>\r\n </div>\r\n </div>\r\n <nav>\r\n <ul>\r\n <!-- (mouseenter)=\"menuMobile ? null : MenuTrigger.openMenu()\"-->\r\n <!-- (click)=\"goto(item.routerLink,item.matmenu) -->\r\n @for (item of Menu; track $index) {\r\n @if (item.matmenu) {\r\n <li\r\n (click)=\"closeSidenav();navigateTo(item)\" matTooltipPosition=\"right\" matTooltip=\"{{item.name }}\"\r\n [routerLinkActive]=\"'active'\" (click)=\"goto(item.routerLink!,item.matmenu)\" #MenuTrigger=\"matMenuTrigger\"\r\n [matMenuTriggerFor]=\"menuMenu\" [routerLinkActiveOptions]=\"{ exact: true }\" class=\"cursor-pointer\">\r\n <ds-icon icon=\"{{item.icon}}\" class=\"icon\"></ds-icon>\r\n <span class=\"menu-label\">\r\n {{ item.name }}\r\n </span>\r\n </li>\r\n <mat-menu #menuMenu=\"matMenu\" class=\"aside-menu visible-{{item.matmenu}}\">\r\n <app-mat-menu [title]=\"item.name \" [icon]=\"item.icon\" [list]=\"item.List\"></app-mat-menu>\r\n </mat-menu>\r\n } @else {\r\n <li\r\n (click)=\"closeSidenav();navigateTo(item)\" matTooltipPosition=\"right\" matTooltip=\"{{item.name }}\"\r\n [routerLinkActive]=\"'active'\" [routerLinkActiveOptions]=\"{ exact: true }\" class=\"cursor-pointer\">\r\n <ds-icon icon=\"{{item.icon}}\" class=\"icon\"></ds-icon>\r\n <span class=\"menu-label\">\r\n {{ item.name }}\r\n </span>\r\n </li>\r\n }\r\n }\r\n </ul>\r\n </nav>\r\n</aside>\r\n", styles: [":host ::ng-deep aside{min-width:var(--main-aside-width);width:var(--main-aside-width);height:calc(100vh - var(--main-toolbar-height));display:flex;position:var(--main-aside-position);right:var(--main-aside-right);left:var(--main-aside-left);top:var(--main-toolbar-height);z-index:var(--main-toolbar-zIndex);background-color:var(--main-aside-bc);transform:var(--main-aside-transform);transition:all .5s cubic-bezier(.685,.0473,.346,1)}@media (max-width: 1024px){:host ::ng-deep aside{height:100%;flex-direction:column;--main-toolbar-height: 0}}:host ::ng-deep aside nav{width:100%}:host ::ng-deep aside ul{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:20px;padding:0rem;margin:37px 0;list-style:none;counter-reset:itemCounter}:host ::ng-deep aside ul li{display:flex;align-items:center;flex-wrap:nowrap;overflow:hidden;max-width:calc(var(--main-aside-width-active) - 15px);width:100%;gap:var(--gap-width, 2.5rem);padding:3px 0 3px 10px;cursor:pointer;color:var(--main-aside-item-fc);border-radius:0;transition:var(--default-transition)}[dir=rtl] :host ::ng-deep aside ul li{padding:3px 10px 3px 0!important}@media (max-width: 1024px){@keyframes liAnimation{0%{transform:translateY(-500px)}to{transform:translateY(0)}}}:host ::ng-deep aside ul li.active,:host ::ng-deep aside ul li:hover{background-color:var(--main-aside-item-bc)}[dir=ltr] :host ::ng-deep aside ul li.active,[dir=ltr] :host ::ng-deep aside ul li:hover{border-left:5px solid var(--coral)}[dir=rtl] :host ::ng-deep aside ul li.active,[dir=rtl] :host ::ng-deep aside ul li:hover{border-right:5px solid var(--coral)}:host ::ng-deep aside ul li .menu-label{font-size:var(--main-aside-item-fs);flex-grow:1;opacity:1;min-width:calc(var(--main-aside-width-active) - 2rem - 40px);display:var(--main-aside-item-display)}:host ::ng-deep aside .header{background-color:#0003!important;padding:15px;flex-direction:row}:host ::ng-deep aside .header div{display:flex;align-items:center;margin-top:auto}:host ::ng-deep aside .footer{margin-top:auto;margin-bottom:80px;padding:0 30px}:host ::ng-deep aside ds-icon{font-size:1.55rem;display:inline-flex;align-items:center;justify-content:center;border-radius:3px;min-width:40px;width:40px;height:40px}:host ::ng-deep ds-button.close::part(base){height:37px;width:37px}:host ::ng-deep ds-button.close ds-icon{font-size:18px;min-width:18px;width:18px;height:18px}:host ::ng-deep .viewAll:hover{background-color:var(--purple)}:host ::ng-deep .viewAll:hover span{color:var(--white)}:host ::ng-deep .justify-content-between{justify-content:space-between}:host ::ng-deep .flex-column{flex-direction:column}:host ::ng-deep .d-flex{display:flex}:host ::ng-deep .w-100{width:100%}:host ::ng-deep .gap-3{gap:1rem!important}:host ::ng-deep ds-button.purple::part(base){--btn-border-color: var(--purple)}:host ::ng-deep ds-button.purple::part(overlay){--btn-overlay-color: var(--purple)}:host ::ng-deep ds-button.secondary::part(base){--btn-border-color: var(--secondary)}:host ::ng-deep ds-button.secondary::part(overlay){--btn-overlay-color: var(--secondary)}@media (min-width: 1024px){:host ::ng-deep .d-md-none{display:none!important}}@media (max-height: 430px){:host ::ng-deep aside .header{margin-bottom:50px}:host ::ng-deep aside nav{padding:15px 0 0;overflow:auto}:host ::ng-deep aside .footer{margin-bottom:20px}}@media (max-height: 300px){:host ::ng-deep aside .header{margin-bottom:5px}}:host ::ng-deep .logo{color:#fff}::ng-deep .aside-menu .mat-mdc-menu-content{border:none;box-shadow:none;padding:0!important}\n"], dependencies: [{ kind: "directive", type: RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i3$2.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "directive", type: MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }] });
6069
6075
  }
6070
6076
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SideNavComponent, decorators: [{
6071
6077
  type: Component,
6072
6078
  args: [{ selector: 'app-side-nav', standalone: true, imports: [RouterLinkActive, RouterLink, MatTooltipModule, MatMenu, MatMenuTrigger], schemas: [CUSTOM_ELEMENTS_SCHEMA], template: "<aside>\r\n <div class=\"header d-flex d-lg-none\">\r\n <div class=\"d-flex h-100 mt-auto justify-content-between w-100\">\r\n <h1 class=\"fs-26 fw-bold fc-white logo\">academy</h1>\r\n <ds-button size=\"small\" color=\"purple\" class=\"close purple\" (click)=\"closeSidenav()\">\r\n <ds-icon icon=\"close\" class=\"fs-15 fc-white\"></ds-icon>\r\n </ds-button>\r\n </div>\r\n </div>\r\n <nav>\r\n <ul>\r\n <!-- (mouseenter)=\"menuMobile ? null : MenuTrigger.openMenu()\"-->\r\n <!-- (click)=\"goto(item.routerLink,item.matmenu) -->\r\n @for (item of Menu; track $index) {\r\n @if (item.matmenu) {\r\n <li\r\n (click)=\"closeSidenav();navigateTo(item)\" matTooltipPosition=\"right\" matTooltip=\"{{item.name }}\"\r\n [routerLinkActive]=\"'active'\" (click)=\"goto(item.routerLink!,item.matmenu)\" #MenuTrigger=\"matMenuTrigger\"\r\n [matMenuTriggerFor]=\"menuMenu\" [routerLinkActiveOptions]=\"{ exact: true }\" class=\"cursor-pointer\">\r\n <ds-icon icon=\"{{item.icon}}\" class=\"icon\"></ds-icon>\r\n <span class=\"menu-label\">\r\n {{ item.name }}\r\n </span>\r\n </li>\r\n <mat-menu #menuMenu=\"matMenu\" class=\"aside-menu visible-{{item.matmenu}}\">\r\n <app-mat-menu [title]=\"item.name \" [icon]=\"item.icon\" [list]=\"item.List\"></app-mat-menu>\r\n </mat-menu>\r\n } @else {\r\n <li\r\n (click)=\"closeSidenav();navigateTo(item)\" matTooltipPosition=\"right\" matTooltip=\"{{item.name }}\"\r\n [routerLinkActive]=\"'active'\" [routerLinkActiveOptions]=\"{ exact: true }\" class=\"cursor-pointer\">\r\n <ds-icon icon=\"{{item.icon}}\" class=\"icon\"></ds-icon>\r\n <span class=\"menu-label\">\r\n {{ item.name }}\r\n </span>\r\n </li>\r\n }\r\n }\r\n </ul>\r\n </nav>\r\n</aside>\r\n", styles: [":host ::ng-deep aside{min-width:var(--main-aside-width);width:var(--main-aside-width);height:calc(100vh - var(--main-toolbar-height));display:flex;position:var(--main-aside-position);right:var(--main-aside-right);left:var(--main-aside-left);top:var(--main-toolbar-height);z-index:var(--main-toolbar-zIndex);background-color:var(--main-aside-bc);transform:var(--main-aside-transform);transition:all .5s cubic-bezier(.685,.0473,.346,1)}@media (max-width: 1024px){:host ::ng-deep aside{height:100%;flex-direction:column;--main-toolbar-height: 0}}:host ::ng-deep aside nav{width:100%}:host ::ng-deep aside ul{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:20px;padding:0rem;margin:37px 0;list-style:none;counter-reset:itemCounter}:host ::ng-deep aside ul li{display:flex;align-items:center;flex-wrap:nowrap;overflow:hidden;max-width:calc(var(--main-aside-width-active) - 15px);width:100%;gap:var(--gap-width, 2.5rem);padding:3px 0 3px 10px;cursor:pointer;color:var(--main-aside-item-fc);border-radius:0;transition:var(--default-transition)}[dir=rtl] :host ::ng-deep aside ul li{padding:3px 10px 3px 0!important}@media (max-width: 1024px){@keyframes liAnimation{0%{transform:translateY(-500px)}to{transform:translateY(0)}}}:host ::ng-deep aside ul li.active,:host ::ng-deep aside ul li:hover{background-color:var(--main-aside-item-bc)}[dir=ltr] :host ::ng-deep aside ul li.active,[dir=ltr] :host ::ng-deep aside ul li:hover{border-left:5px solid var(--coral)}[dir=rtl] :host ::ng-deep aside ul li.active,[dir=rtl] :host ::ng-deep aside ul li:hover{border-right:5px solid var(--coral)}:host ::ng-deep aside ul li .menu-label{font-size:var(--main-aside-item-fs);flex-grow:1;opacity:1;min-width:calc(var(--main-aside-width-active) - 2rem - 40px);display:var(--main-aside-item-display)}:host ::ng-deep aside .header{background-color:#0003!important;padding:15px;flex-direction:row}:host ::ng-deep aside .header div{display:flex;align-items:center;margin-top:auto}:host ::ng-deep aside .footer{margin-top:auto;margin-bottom:80px;padding:0 30px}:host ::ng-deep aside ds-icon{font-size:1.55rem;display:inline-flex;align-items:center;justify-content:center;border-radius:3px;min-width:40px;width:40px;height:40px}:host ::ng-deep ds-button.close::part(base){height:37px;width:37px}:host ::ng-deep ds-button.close ds-icon{font-size:18px;min-width:18px;width:18px;height:18px}:host ::ng-deep .viewAll:hover{background-color:var(--purple)}:host ::ng-deep .viewAll:hover span{color:var(--white)}:host ::ng-deep .justify-content-between{justify-content:space-between}:host ::ng-deep .flex-column{flex-direction:column}:host ::ng-deep .d-flex{display:flex}:host ::ng-deep .w-100{width:100%}:host ::ng-deep .gap-3{gap:1rem!important}:host ::ng-deep ds-button.purple::part(base){--btn-border-color: var(--purple)}:host ::ng-deep ds-button.purple::part(overlay){--btn-overlay-color: var(--purple)}:host ::ng-deep ds-button.secondary::part(base){--btn-border-color: var(--secondary)}:host ::ng-deep ds-button.secondary::part(overlay){--btn-overlay-color: var(--secondary)}@media (min-width: 1024px){:host ::ng-deep .d-md-none{display:none!important}}@media (max-height: 430px){:host ::ng-deep aside .header{margin-bottom:50px}:host ::ng-deep aside nav{padding:15px 0 0;overflow:auto}:host ::ng-deep aside .footer{margin-bottom:20px}}@media (max-height: 300px){:host ::ng-deep aside .header{margin-bottom:5px}}:host ::ng-deep .logo{color:#fff}::ng-deep .aside-menu .mat-mdc-menu-content{border:none;box-shadow:none;padding:0!important}\n"] }]
6073
- }], ctorParameters: () => [{ type: SidenavService }, { type: i2$5.Router }], propDecorators: { isOpened: [{
6079
+ }], ctorParameters: () => [{ type: SidenavService }, { type: i2$6.Router }], propDecorators: { isOpened: [{
6074
6080
  type: Input
6075
6081
  }], MenuTrigger: [{
6076
6082
  type: ViewChild,
@@ -6129,7 +6135,7 @@ class LayoutComponent {
6129
6135
  closeSideNav() {
6130
6136
  this.sidenav.close().then(r => { });
6131
6137
  }
6132
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: LayoutComponent, deps: [{ token: DOCUMENT }, { token: i2$5.Router }, { token: SidenavService }], target: i0.ɵɵFactoryTarget.Component });
6138
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: LayoutComponent, deps: [{ token: DOCUMENT }, { token: i2$6.Router }, { token: SidenavService }], target: i0.ɵɵFactoryTarget.Component });
6133
6139
  static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: LayoutComponent, isStandalone: true, selector: "core-layout", inputs: { form: "form", formTitle: "formTitle", isLoading: "isLoading", serviceBrief: "serviceBrief" }, viewQueries: [{ propertyName: "sidenav", first: true, predicate: ["sidenav"], descendants: true, static: true }], ngImport: i0, template: "<app-header></app-header>\r\n<section class=\"d-flex\">\r\n <app-side-nav></app-side-nav>\r\n <mat-sidenav-container\r\n class=\"flex-grow-1\"\r\n [hasBackdrop]=\"true\"\r\n (backdropClick)=\"backdropClick()\"\r\n >\r\n <mat-sidenav\r\n #sidenav\r\n autoFocus=\"false\"\r\n fixedInViewport\r\n [position]=\"'end'\"\r\n (closedStart)=\"onClose()\"\r\n >\r\n <ng-container *ngComponentOutlet=\"sideContent\">\r\n <app-side-nav></app-side-nav>\r\n </ng-container>\r\n </mat-sidenav>\r\n <mat-sidenav-content>\r\n <main\r\n class=\"hadPadding service-wrapper\"\r\n [ngClass]=\"form?.header?.status?.key == 'NEW' ? 'hub-container-mini' : 'hub-container'\">\r\n\r\n <ng-content ></ng-content>\r\n <ng-content select=\"[workflow]\"></ng-content>\r\n\r\n </main>\r\n </mat-sidenav-content>\r\n </mat-sidenav-container>\r\n</section>\r\n", styles: [":host ::ng-deep .mat-drawer-container{overflow:visible;margin-top:var(--main-toolbar-height);min-height:calc(100vh - var(--main-toolbar-height));background-color:var(--body-bg)!important;z-index:initial!important;min-width:calc(100% - var(--main-aside-width));width:calc(100% - var(--main-aside-width))}:host ::ng-deep .mat-drawer-container .mat-drawer-content{display:flex;flex-direction:column;overflow:visible}.hup-wrapper :host ::ng-deep .mat-drawer-container .mat-drawer-content{min-height:auto}:host ::ng-deep footer{bottom:-65px}.mat-drawer{border-radius:10px!important;margin:1rem;box-shadow:0 8px 16px 7px rgba(var(--rgb-black),.06);background-color:var(--white)}@media (max-width: 767px){.mat-drawer{padding:0;border-radius:0;margin:0;width:100%}}.customize-btn{min-width:166px}.zer-pt{padding-top:0!important}\n"], dependencies: [{ kind: "component", type: HeaderComponent, selector: "app-header" }, { kind: "component", type: SideNavComponent, selector: "app-side-nav", inputs: ["isOpened"] }, { kind: "ngmodule", type: MatSidenavModule }, { kind: "component", type: i3$3.MatSidenav, selector: "mat-sidenav", inputs: ["fixedInViewport", "fixedTopGap", "fixedBottomGap"], exportAs: ["matSidenav"] }, { kind: "component", type: i3$3.MatSidenavContainer, selector: "mat-sidenav-container", exportAs: ["matSidenavContainer"] }, { kind: "component", type: i3$3.MatSidenavContent, selector: "mat-sidenav-content" }, { kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
6134
6140
  }
6135
6141
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: LayoutComponent, decorators: [{
@@ -6138,7 +6144,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImpor
6138
6144
  }], ctorParameters: () => [{ type: Document, decorators: [{
6139
6145
  type: Inject,
6140
6146
  args: [DOCUMENT]
6141
- }] }, { type: i2$5.Router }, { type: SidenavService }], propDecorators: { sidenav: [{
6147
+ }] }, { type: i2$6.Router }, { type: SidenavService }], propDecorators: { sidenav: [{
6142
6148
  type: ViewChild,
6143
6149
  args: ["sidenav", { static: true }]
6144
6150
  }], form: [{
@@ -6481,7 +6487,7 @@ class CoreAppComponent {
6481
6487
  }
6482
6488
  window.scrollTo(0, 0);
6483
6489
  }
6484
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: CoreAppComponent, deps: [{ token: SegmentDynamicLoaderService }, { token: DOCUMENT }, { token: i2$5.Router }, { token: SidenavService }, { token: CoreService }], target: i0.ɵɵFactoryTarget.Component });
6490
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: CoreAppComponent, deps: [{ token: SegmentDynamicLoaderService }, { token: DOCUMENT }, { token: i2$6.Router }, { token: SidenavService }, { token: CoreService }], target: i0.ɵɵFactoryTarget.Component });
6485
6491
  static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.8", type: CoreAppComponent, isStandalone: true, selector: "lib-app", providers: [
6486
6492
  { provide: DynamicComponentInjectorToken, useValue: { /* your value here */} }
6487
6493
  ], ngImport: i0, template: "<core-layout>\r\n @if (!loading['form']) {\r\n <core-service-header\r\n [isLoading]=\"false\"\r\n [formTitle]=\"formTitle\"\r\n [form]=\"form\">\r\n </core-service-header>\r\n <app-workflow-section\r\n workflow\r\n [form]=\"form\"\r\n [segmentDynamicLoaderService]=\"segmentDynamicLoader\"\r\n [sections]=\"form?.sections\">\r\n\r\n <app-request-details-section [form]=\"form\" [section]=\"form?.sections[0]\" [lov]=\"form?.lovs\" className=\"form-section\"></app-request-details-section>\r\n <!-- [isReadOnly]=\"form.sections[0].header.readOnly\"-->\r\n </app-workflow-section>\r\n } @else {\r\n <core-service-header header [formTitle]=\"formTitle\" [isLoading]=\"true\">\r\n </core-service-header>\r\n }\r\n</core-layout>\r\n", styles: [""], dependencies: [{ kind: "component", type:
@@ -6502,7 +6508,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImpor
6502
6508
  }], ctorParameters: () => [{ type: SegmentDynamicLoaderService }, { type: Document, decorators: [{
6503
6509
  type: Inject,
6504
6510
  args: [DOCUMENT]
6505
- }] }, { type: i2$5.Router }, { type: SidenavService }, { type: CoreService }] });
6511
+ }] }, { type: i2$6.Router }, { type: SidenavService }, { type: CoreService }] });
6506
6512
 
6507
6513
  function encodePassword(formId, password) {
6508
6514
  const formIdString = Array.from(new TextEncoder().encode(formId), (x) => String.fromCodePoint(x)).join('');