bpm-core 0.0.33 → 0.0.34
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.
- package/esm2022/lib/components/app-component-sections/previous-requests/previous-requests.component.mjs +67 -0
- package/esm2022/lib/components/app-component-sections/service-header/service-header.component.mjs +8 -4
- package/esm2022/lib/i18n/ar.mjs +3 -2
- package/esm2022/lib/i18n/en.mjs +3 -2
- package/esm2022/lib/pipes/status-style.pipe.mjs +57 -0
- package/esm2022/lib/services/core.service.ts.mjs +20 -7
- package/fesm2022/bpm-core.mjs +176 -48
- package/fesm2022/bpm-core.mjs.map +1 -1
- package/lib/components/app-component-sections/previous-requests/previous-requests.component.d.ts +22 -0
- package/lib/components/app-component-sections/service-header/service-header.component.d.ts +1 -0
- package/lib/i18n/ar.d.ts +1 -0
- package/lib/i18n/en.d.ts +1 -0
- package/lib/pipes/status-style.pipe.d.ts +7 -0
- package/lib/services/core.service.ts.d.ts +1 -0
- package/package.json +2 -2
package/fesm2022/bpm-core.mjs
CHANGED
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
2
|
import { Injectable, Inject, Component, CUSTOM_ELEMENTS_SCHEMA, Pipe, forwardRef, EventEmitter, Input, Output, ViewChild, Directive, inject, HostListener, NO_ERRORS_SCHEMA, PLATFORM_ID, InjectionToken } from '@angular/core';
|
|
3
3
|
import * as i1$1 from '@angular/material/dialog';
|
|
4
|
-
import { MAT_DIALOG_DATA, MatDialogContent, MatDialogActions, MatDialogClose, MatDialogTitle, MatDialog } from '@angular/material/dialog';
|
|
4
|
+
import { MAT_DIALOG_DATA, MatDialogContent, MatDialogActions, MatDialogClose, MatDialogTitle, MatDialog, MatDialogModule } from '@angular/material/dialog';
|
|
5
5
|
import { Subject, ReplaySubject, BehaviorSubject, catchError, throwError, switchMap, of, from } from 'rxjs';
|
|
6
6
|
import * as i1 from '@angular/common/http';
|
|
7
7
|
import { HttpHeaders } from '@angular/common/http';
|
|
8
8
|
import { map } from 'rxjs/operators';
|
|
9
|
-
import * as
|
|
9
|
+
import * as i3 from '@angular/common';
|
|
10
10
|
import { NgIf, NgClass, NgForOf, NgTemplateOutlet, NgSwitchCase, DecimalPipe, DatePipe, NgSwitchDefault, NgSwitch, CommonModule, NgFor, SlicePipe, NgComponentOutlet, DOCUMENT } from '@angular/common';
|
|
11
11
|
import { MatButton } from '@angular/material/button';
|
|
12
12
|
import { NoopScrollStrategy } from '@angular/cdk/overlay';
|
|
@@ -17,45 +17,47 @@ import { NG_VALUE_ACCESSOR, FormControl, ControlContainer, NgForm, NgControl, Fo
|
|
|
17
17
|
import * as i7 from '@angular/platform-browser';
|
|
18
18
|
import * as FileSaver from 'file-saver';
|
|
19
19
|
import { ImageCropperComponent } from 'ngx-image-cropper';
|
|
20
|
-
import * as i1$
|
|
20
|
+
import * as i1$2 from '@angular/material/form-field';
|
|
21
21
|
import { MatError, MatHint, MatFormField, MatFormFieldModule } from '@angular/material/form-field';
|
|
22
22
|
import { MatCheckbox } from '@angular/material/checkbox';
|
|
23
23
|
import { MatSlideToggle } from '@angular/material/slide-toggle';
|
|
24
|
-
import * as i1$
|
|
24
|
+
import * as i1$4 from '@angular/material/autocomplete';
|
|
25
25
|
import { MatAutocomplete, MatOption, MatAutocompleteTrigger, MatAutocompleteModule } from '@angular/material/autocomplete';
|
|
26
|
-
import * as i3 from '@angular/material/input';
|
|
26
|
+
import * as i3$1 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
29
|
import * as i2$1 from '@angular/material/datepicker';
|
|
30
30
|
import { MatDatepicker, MatDatepickerModule, MatDatepickerToggle, MatDatepickerInput } from '@angular/material/datepicker';
|
|
31
31
|
import * as moment from 'moment';
|
|
32
32
|
import { MatIcon } from '@angular/material/icon';
|
|
33
|
-
import * as i1$
|
|
33
|
+
import * as i1$3 from '@ncstate/sat-popover';
|
|
34
34
|
import { SatPopoverModule } from '@ncstate/sat-popover';
|
|
35
35
|
import { NgxMaskDirective } from 'ngx-mask';
|
|
36
36
|
import { MatSelect, MatOption as MatOption$1, MatLabel, MatError as MatError$1, MatFormField as MatFormField$1 } from '@angular/material/select';
|
|
37
37
|
import { MatProgressSpinner } from '@angular/material/progress-spinner';
|
|
38
|
-
import
|
|
38
|
+
import * as i4$1 from '@angular/material/button-toggle';
|
|
39
|
+
import { MatButtonToggleGroup, MatButtonToggle, MatButtonToggleModule } from '@angular/material/button-toggle';
|
|
39
40
|
import * as i2$2 from '@angular/material/table';
|
|
40
41
|
import { MatTableDataSource, MatTableModule } from '@angular/material/table';
|
|
41
|
-
import * as i1$
|
|
42
|
+
import * as i1$5 from '@angular/material/paginator';
|
|
42
43
|
import { MatPaginatorModule } from '@angular/material/paginator';
|
|
43
44
|
import * as i2$4 from '@angular/router';
|
|
44
|
-
import { RouterLink, RouterModule, RouterLinkActive, RouterOutlet } from '@angular/router';
|
|
45
|
+
import { RouterLink, Router, RouterModule, RouterLinkActive, RouterOutlet } from '@angular/router';
|
|
45
46
|
import * as i5 from '@angular/material/menu';
|
|
46
47
|
import { MatMenu, MatMenuTrigger, MatMenuItem, MatMenuModule } from '@angular/material/menu';
|
|
47
48
|
import { moveItemInArray, CdkDropList, CdkDrag } from '@angular/cdk/drag-drop';
|
|
48
|
-
import * as i3$
|
|
49
|
+
import * as i3$4 from '@angular/material/tooltip';
|
|
49
50
|
import { MatTooltip, MatTooltipModule } from '@angular/material/tooltip';
|
|
50
51
|
import { MatRadioButton, MatRadioGroup } from '@angular/material/radio';
|
|
51
|
-
import * as i3$
|
|
52
|
+
import * as i3$2 from 'ngx-toastr';
|
|
52
53
|
import * as i2$3 from '@angular/material/expansion';
|
|
53
54
|
import { MatAccordion, MatExpansionPanel, MatExpansionPanelTitle, MatExpansionModule } from '@angular/material/expansion';
|
|
54
55
|
import { MatDivider } from '@angular/material/divider';
|
|
55
56
|
import { format } from 'date-fns';
|
|
56
|
-
import
|
|
57
|
+
import { TranslateModule } from '@ngx-translate/core';
|
|
58
|
+
import * as i3$3 from 'ng-dynamic-component';
|
|
57
59
|
import { ComponentOutletIoDirective, DynamicModule, DynamicComponentInjectorToken } from 'ng-dynamic-component';
|
|
58
|
-
import * as i3$
|
|
60
|
+
import * as i3$5 from '@angular/material/sidenav';
|
|
59
61
|
import { MatSidenavModule } from '@angular/material/sidenav';
|
|
60
62
|
import * as i6 from '@angular/material/toolbar';
|
|
61
63
|
import { MatToolbarModule } from '@angular/material/toolbar';
|
|
@@ -394,7 +396,8 @@ var en = {
|
|
|
394
396
|
NORMAL: '3 days',
|
|
395
397
|
select: 'Select',
|
|
396
398
|
addMultiAttachments: "Add Multi Attachments",
|
|
397
|
-
flagStatusUpdated: "Flag status updated successfully"
|
|
399
|
+
flagStatusUpdated: "Flag status updated successfully",
|
|
400
|
+
"AllRequests": "All Requests",
|
|
398
401
|
};
|
|
399
402
|
|
|
400
403
|
var ar = {
|
|
@@ -578,7 +581,8 @@ var ar = {
|
|
|
578
581
|
"welcome": "مرحبا ",
|
|
579
582
|
"logout": "تسجيل خروج",
|
|
580
583
|
"otherLang": "English",
|
|
581
|
-
flagStatusUpdated: "تم التحديث بنجاح"
|
|
584
|
+
flagStatusUpdated: "تم التحديث بنجاح",
|
|
585
|
+
"AllRequests": "عدد الطلبات",
|
|
582
586
|
};
|
|
583
587
|
|
|
584
588
|
/* eslint-disable @typescript-eslint/no-explicit-any */
|
|
@@ -1217,14 +1221,27 @@ class CoreService {
|
|
|
1217
1221
|
let options = this.getRequestOptions();
|
|
1218
1222
|
return this.generalCallApi(body, STATE_MACHINE_ACTION_SUCCESS_RESPONSE, options);
|
|
1219
1223
|
}
|
|
1224
|
+
myRequests(details) {
|
|
1225
|
+
let body = {
|
|
1226
|
+
method: HTTP_METHOD_GET,
|
|
1227
|
+
destination: TARGET_SERVER_WM,
|
|
1228
|
+
serviceName: "form" //, //this.getServiceName(),
|
|
1229
|
+
,
|
|
1230
|
+
formName: "history",
|
|
1231
|
+
queryParameters: {
|
|
1232
|
+
formName: this.config.formName,
|
|
1233
|
+
year: details.year,
|
|
1234
|
+
month: details.month,
|
|
1235
|
+
email: this.loggedInUserId()
|
|
1236
|
+
}
|
|
1237
|
+
};
|
|
1238
|
+
let options = this.getRequestOptions();
|
|
1239
|
+
return this.generalCallApi(body, STATE_MACHINE_ACTION_SUCCESS_RESPONSE, options);
|
|
1240
|
+
}
|
|
1220
1241
|
generalCallApi(body, type, options) {
|
|
1221
1242
|
let apiUrl = this.config.proxyServiceBaseUrl + this.language + this.config.proxyFullAddress + this.config.proxyServiceExecute;
|
|
1222
1243
|
return this.http.post(apiUrl, encodeURIComponent(JSON.stringify(body)), options).pipe(map((responseObject) => {
|
|
1223
1244
|
return responseObject;
|
|
1224
|
-
/*switch (type) {
|
|
1225
|
-
case constants.STATE_MACHINE_ACTION_LOAD_HISTORY:
|
|
1226
|
-
return responseObject
|
|
1227
|
-
}*/
|
|
1228
1245
|
}), catchError((httpError) => {
|
|
1229
1246
|
return throwError(httpError);
|
|
1230
1247
|
}));
|
|
@@ -1268,12 +1285,12 @@ class CoreService {
|
|
|
1268
1285
|
return window.wmConfig.outlook;
|
|
1269
1286
|
}
|
|
1270
1287
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: CoreService, deps: [{ token: i1.HttpClient }, { token: MY_LIB_CONFIG_TOKEN }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
1271
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: CoreService, providedIn: "
|
|
1288
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: CoreService, providedIn: "root" });
|
|
1272
1289
|
}
|
|
1273
1290
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: CoreService, decorators: [{
|
|
1274
1291
|
type: Injectable,
|
|
1275
1292
|
args: [{
|
|
1276
|
-
providedIn: "
|
|
1293
|
+
providedIn: "root"
|
|
1277
1294
|
}]
|
|
1278
1295
|
}], ctorParameters: () => [{ type: i1.HttpClient }, { type: undefined, decorators: [{
|
|
1279
1296
|
type: Inject,
|
|
@@ -2762,7 +2779,7 @@ class ValidationErrorsComponent extends ControlValueAccessorDirective {
|
|
|
2762
2779
|
}
|
|
2763
2780
|
}
|
|
2764
2781
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: ValidationErrorsComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
2765
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.8", type: ValidationErrorsComponent, isStandalone: true, selector: "app-validation-errors", inputs: { errors: "errors", customErrorMessages: "customErrorMessages" }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: " @if(control.touched) {\r\n @for(error of errors | keyvalue; track error ) {\r\n <mat-error class=\"mb-2\">\r\n {{ errorMessages[error.key] }} {{errors['maxlength']?.requiredLength}} {{errors['minlength']?.requiredLength}}\r\n </mat-error>\r\n }\r\n }", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type:
|
|
2782
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.8", type: ValidationErrorsComponent, isStandalone: true, selector: "app-validation-errors", inputs: { errors: "errors", customErrorMessages: "customErrorMessages" }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: " @if(control.touched) {\r\n @for(error of errors | keyvalue; track error ) {\r\n <mat-error class=\"mb-2\">\r\n {{ errorMessages[error.key] }} {{errors['maxlength']?.requiredLength}} {{errors['minlength']?.requiredLength}}\r\n </mat-error>\r\n }\r\n }", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i3.KeyValuePipe, name: "keyvalue" }, { kind: "directive", type: MatError, selector: "mat-error, [matError]", inputs: ["id"] }] });
|
|
2766
2783
|
}
|
|
2767
2784
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: ValidationErrorsComponent, decorators: [{
|
|
2768
2785
|
type: Component,
|
|
@@ -2848,7 +2865,7 @@ class CustomSearchableComponent extends ControlValueAccessorDirective {
|
|
|
2848
2865
|
useExisting: forwardRef(() => CustomSearchableComponent),
|
|
2849
2866
|
multi: true,
|
|
2850
2867
|
},
|
|
2851
|
-
], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ng-container *ngIf=\"isReadOnly && control?.value\">\r\n <app-info-item class=\"info-item w-100\" [label]=\"label\" [insideTable]=\"insideTable\" [hasLabel]=\"label ? true: false\" [value]=\"control?.value\"></app-info-item>\r\n</ng-container>\r\n\r\n<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\">\r\n {{i18n.translate('Optional')}}\r\n </span>\r\n </div>\r\n <mat-form-field class=\"primary-form {{className}}\" [ngClass]=\"{'input-disabled' : (disabled || loading) }\"\r\n [floatLabel]=\"floatLabel\" >\r\n <!-- (click)=\"clearInput()\" -->\r\n <span class=\"sfi sfi-search fc-coral fs-18\" matPrefix></span>\r\n <label class=\"mat-form-content\">\r\n <!-- <bdi> -->\r\n <input #autocompleteInput type=\"text\" (keydown)=\"onKeyDown($event, autocompleteInput)\" [attr.disabled]=\"disabled \" [placeholder]=\"label\" aria-label=\"Number\" matInput\r\n (input)=\"onValueChange($event)\" [formControl]=\"searchControl\"\r\n ngDefaultControl [name]=\"'test'\" [matAutocomplete]=\"auto\" [value]=\"value\" (focusout)=\"onFocusOut()\">\r\n <!-- </bdi> -->\r\n </label>\r\n <span class=\"sfi sfi-spinner d-inline-block spin fc-coral\" matSuffix *ngIf=\"loading\"></span>\r\n <span class=\"sfi sfi-close d-inline-block fc-black cursor-pointer\" (click)=\"clearInput()\" matSuffix\r\n *ngIf=\"!loading && control?.value\"></span>\r\n <mat-autocomplete autoActiveFirstOption #auto=\"matAutocomplete\" [displayWith]=\"displayFn\" \r\n (optionSelected)='getAutoComplete($event.option.value)'>\r\n <ng-container *ngIf=\"!noData\">\r\n <mat-option *ngFor=\"let option of filteredOptions\" [value]=\"option\">\r\n <div class=\"d-flex align-items-center\">\r\n <figure *ngIf=\"option['avatar_url']\" class=\"img-card small circled-img p-0 m-0\">\r\n <img [src]=\"option['avatar_url']\" alt=\"\">\r\n </figure>\r\n <span *ngIf=\"option['avatar_url']\" class=\"mx-2\"></span>\r\n <!-- <bdi> -->\r\n {{option[displayedLable]}}\r\n <!-- </bdi> -->\r\n </div>\r\n </mat-option>\r\n </ng-container>\r\n <ng-container *ngIf=\"noData\">\r\n <mat-option [disabled]=\"true\" class=\"text-center\">No Data</mat-option>\r\n </ng-container>\r\n </mat-autocomplete>\r\n <!-- <mat-error class=\"mb-2\" *ngIf=\"(!control?.valid)\">{{i18n.translate('validSelectError')}}{{label}}\r\n </mat-error> -->\r\n\r\n <mat-hint *ngIf=\"showHint\">\r\n <span class=\"sfi sfi-check-circle font-10 fc-dark-gray\" [ngClass]=\"{'fc-oasis-light-imp':value}\"></span>\r\n <span class=\"mx-1\"></span>\r\n <span class=\"fs-12 fc-onyx\">{{hint}}</span>\r\n </mat-hint>\r\n </mat-form-field>\r\n <app-validation-errors [errors]=\"control.errors\"></app-validation-errors>\r\n\r\n</ng-container>\r\n", styles: [".small-input~.btn{height:41px}:host{flex-grow:1}\n"], dependencies: [{ kind: "component", type: InfoItemComponent, selector: "app-info-item", inputs: ["label", "value", "name", "type", "dateType", "multiple", "insideTable", "hasLabel", "arrayList", "actionType", "download"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { 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: MatAutocomplete, selector: "mat-autocomplete", inputs: ["aria-label", "aria-labelledby", "displayWith", "autoActiveFirstOption", "autoSelectActiveOption", "requireSelection", "panelWidth", "disableRipple", "class", "hideSingleSelectionIndicator"], outputs: ["optionSelected", "opened", "closed", "optionActivated"], exportAs: ["matAutocomplete"] }, { kind: "component", type: MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "directive", type: MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "directive", type: i1$
|
|
2868
|
+
], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ng-container *ngIf=\"isReadOnly && control?.value\">\r\n <app-info-item class=\"info-item w-100\" [label]=\"label\" [insideTable]=\"insideTable\" [hasLabel]=\"label ? true: false\" [value]=\"control?.value\"></app-info-item>\r\n</ng-container>\r\n\r\n<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\">\r\n {{i18n.translate('Optional')}}\r\n </span>\r\n </div>\r\n <mat-form-field class=\"primary-form {{className}}\" [ngClass]=\"{'input-disabled' : (disabled || loading) }\"\r\n [floatLabel]=\"floatLabel\" >\r\n <!-- (click)=\"clearInput()\" -->\r\n <span class=\"sfi sfi-search fc-coral fs-18\" matPrefix></span>\r\n <label class=\"mat-form-content\">\r\n <!-- <bdi> -->\r\n <input #autocompleteInput type=\"text\" (keydown)=\"onKeyDown($event, autocompleteInput)\" [attr.disabled]=\"disabled \" [placeholder]=\"label\" aria-label=\"Number\" matInput\r\n (input)=\"onValueChange($event)\" [formControl]=\"searchControl\"\r\n ngDefaultControl [name]=\"'test'\" [matAutocomplete]=\"auto\" [value]=\"value\" (focusout)=\"onFocusOut()\">\r\n <!-- </bdi> -->\r\n </label>\r\n <span class=\"sfi sfi-spinner d-inline-block spin fc-coral\" matSuffix *ngIf=\"loading\"></span>\r\n <span class=\"sfi sfi-close d-inline-block fc-black cursor-pointer\" (click)=\"clearInput()\" matSuffix\r\n *ngIf=\"!loading && control?.value\"></span>\r\n <mat-autocomplete autoActiveFirstOption #auto=\"matAutocomplete\" [displayWith]=\"displayFn\" \r\n (optionSelected)='getAutoComplete($event.option.value)'>\r\n <ng-container *ngIf=\"!noData\">\r\n <mat-option *ngFor=\"let option of filteredOptions\" [value]=\"option\">\r\n <div class=\"d-flex align-items-center\">\r\n <figure *ngIf=\"option['avatar_url']\" class=\"img-card small circled-img p-0 m-0\">\r\n <img [src]=\"option['avatar_url']\" alt=\"\">\r\n </figure>\r\n <span *ngIf=\"option['avatar_url']\" class=\"mx-2\"></span>\r\n <!-- <bdi> -->\r\n {{option[displayedLable]}}\r\n <!-- </bdi> -->\r\n </div>\r\n </mat-option>\r\n </ng-container>\r\n <ng-container *ngIf=\"noData\">\r\n <mat-option [disabled]=\"true\" class=\"text-center\">No Data</mat-option>\r\n </ng-container>\r\n </mat-autocomplete>\r\n <!-- <mat-error class=\"mb-2\" *ngIf=\"(!control?.valid)\">{{i18n.translate('validSelectError')}}{{label}}\r\n </mat-error> -->\r\n\r\n <mat-hint *ngIf=\"showHint\">\r\n <span class=\"sfi sfi-check-circle font-10 fc-dark-gray\" [ngClass]=\"{'fc-oasis-light-imp':value}\"></span>\r\n <span class=\"mx-1\"></span>\r\n <span class=\"fs-12 fc-onyx\">{{hint}}</span>\r\n </mat-hint>\r\n </mat-form-field>\r\n <app-validation-errors [errors]=\"control.errors\"></app-validation-errors>\r\n\r\n</ng-container>\r\n", styles: [".small-input~.btn{height:41px}:host{flex-grow:1}\n"], dependencies: [{ kind: "component", type: InfoItemComponent, selector: "app-info-item", inputs: ["label", "value", "name", "type", "dateType", "multiple", "insideTable", "hasLabel", "arrayList", "actionType", "download"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { 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: MatAutocomplete, selector: "mat-autocomplete", inputs: ["aria-label", "aria-labelledby", "displayWith", "autoActiveFirstOption", "autoSelectActiveOption", "requireSelection", "panelWidth", "disableRipple", "class", "hideSingleSelectionIndicator"], outputs: ["optionSelected", "opened", "closed", "optionActivated"], exportAs: ["matAutocomplete"] }, { kind: "component", type: MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "directive", type: MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "directive", type: i1$2.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i1$2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i3$1.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: ValidationErrorsComponent, selector: "app-validation-errors", inputs: ["errors", "customErrorMessages"] }] });
|
|
2852
2869
|
}
|
|
2853
2870
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: CustomSearchableComponent, decorators: [{
|
|
2854
2871
|
type: Component,
|
|
@@ -2988,7 +3005,7 @@ class DatePickerComponent extends ControlValueAccessorDirective {
|
|
|
2988
3005
|
useExisting: forwardRef(() => DatePickerComponent),
|
|
2989
3006
|
multi: true,
|
|
2990
3007
|
},
|
|
2991
|
-
], viewQueries: [{ propertyName: "datepicker", first: true, predicate: MatDatepicker, descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@if(!isReadOnly){\r\n <ng-container>\r\n @if(label){\r\n <div class=\"d-flex justify-content-between mb-1\">\r\n <span class=\"form-label mb-0\">{{label}}</span>\r\n @if(!required){\r\n <span class=\"fs-11 fc-dark-gray\"> {{i18n.translate('optional')}} </span>\r\n }\r\n </div>\r\n }\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') + ' ' + label) : ''\" (focus)=\"focusPicker(dp)\" [min]=\"minDateValue\"\r\n [max]=\"maxDateValue\" readonly [matDatepicker]=\"dp\" [formControl]=\"control\">\r\n </label>\r\n @if(control?.value){\r\n <ds-icon matSuffix icon=\"close\" class=\"fc-onyx fs-10 mx-2 cursor-pointer\" (click)=\"clearDateValue($event)\"></ds-icon>\r\n }\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@if(isReadOnly && control){\r\n <ng-container>\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}\r\n\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: i1$
|
|
3008
|
+
], viewQueries: [{ propertyName: "datepicker", first: true, predicate: MatDatepicker, descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@if(!isReadOnly){\r\n <ng-container>\r\n @if(label){\r\n <div class=\"d-flex justify-content-between mb-1\">\r\n <span class=\"form-label mb-0\">{{label}}</span>\r\n @if(!required){\r\n <span class=\"fs-11 fc-dark-gray\"> {{i18n.translate('optional')}} </span>\r\n }\r\n </div>\r\n }\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') + ' ' + label) : ''\" (focus)=\"focusPicker(dp)\" [min]=\"minDateValue\"\r\n [max]=\"maxDateValue\" readonly [matDatepicker]=\"dp\" [formControl]=\"control\">\r\n </label>\r\n @if(control?.value){\r\n <ds-icon matSuffix icon=\"close\" class=\"fc-onyx fs-10 mx-2 cursor-pointer\" (click)=\"clearDateValue($event)\"></ds-icon>\r\n }\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@if(isReadOnly && control){\r\n <ng-container>\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}\r\n\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: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i2$1.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i2$1.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i2$1.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "directive", type: i2$1.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: "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"] }] });
|
|
2992
3009
|
}
|
|
2993
3010
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: DatePickerComponent, decorators: [{
|
|
2994
3011
|
type: Component,
|
|
@@ -3155,7 +3172,7 @@ class DateRangePickerComponent extends ControlValueAccessorDirective {
|
|
|
3155
3172
|
provide: MAT_DATE_FORMATS,
|
|
3156
3173
|
useClass: CustomDateFormat
|
|
3157
3174
|
},
|
|
3158
|
-
], viewQueries: [{ propertyName: "datepicker", first: true, predicate: MatDatepicker, descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@if(label){\r\n <div class=\"d-flex justify-content-between mb-1\">\r\n <span class=\"form-label mb-0\">{{label}}</span>\r\n @if(!required){\r\n <span class=\"fs-11 fc-dark-gray\"> {{i18n.translate('optional')}} </span>\r\n }\r\n </div>\r\n}\r\n<mat-form-field class=\"date-range primary-form {{className}}\">\r\n <label class=\"mat-form-content\">\r\n <mat-date-range-input [rangePicker]=\"picker\">\r\n <input matStartDate placeholder=\"Start date\" [formControl]=\"startControl\" [value]=\"value?.startDate ? value?.startDate : null\" (dateInput)=\"dateChange($event)\" (focus)=\"focusPicker(picker)\" [min]=\"minDateValue\"\r\n [max]=\"maxDateValue\">\r\n <input matEndDate placeholder=\"End date\" [formControl]=\"endControl\" [value]=\"value?.endDate ? value?.endDate : null\" (dateInput)=\"dateChange($event)\" (focus)=\"focusPicker(picker)\" [min]=\"minDateValue\"\r\n [max]=\"maxDateValue\">\r\n </mat-date-range-input>\r\n </label>\r\n @if(control?.value){\r\n <ds-icon matSuffix icon=\"close\" class=\"fc-onyx fs-10 mx-2 cursor-pointer\" (click)=\"clearDateValue($event)\"></ds-icon>\r\n }\r\n <mat-datepicker-toggle matSuffix [for]=\"picker\" [disableRipple]=\"true\">\r\n <i class=\"sfi sfi-calendar-o fc-onyx font-18\" matDatepickerToggleIcon></i>\r\n </mat-datepicker-toggle>\r\n <mat-date-range-picker #picker></mat-date-range-picker>\r\n</mat-form-field>\r\n<app-validation-errors [errors]=\"control.errors\"></app-validation-errors>\r\n", styles: [":host{flex-grow:1}\n"], dependencies: [{ kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$
|
|
3175
|
+
], viewQueries: [{ propertyName: "datepicker", first: true, predicate: MatDatepicker, descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@if(label){\r\n <div class=\"d-flex justify-content-between mb-1\">\r\n <span class=\"form-label mb-0\">{{label}}</span>\r\n @if(!required){\r\n <span class=\"fs-11 fc-dark-gray\"> {{i18n.translate('optional')}} </span>\r\n }\r\n </div>\r\n}\r\n<mat-form-field class=\"date-range primary-form {{className}}\">\r\n <label class=\"mat-form-content\">\r\n <mat-date-range-input [rangePicker]=\"picker\">\r\n <input matStartDate placeholder=\"Start date\" [formControl]=\"startControl\" [value]=\"value?.startDate ? value?.startDate : null\" (dateInput)=\"dateChange($event)\" (focus)=\"focusPicker(picker)\" [min]=\"minDateValue\"\r\n [max]=\"maxDateValue\">\r\n <input matEndDate placeholder=\"End date\" [formControl]=\"endControl\" [value]=\"value?.endDate ? value?.endDate : null\" (dateInput)=\"dateChange($event)\" (focus)=\"focusPicker(picker)\" [min]=\"minDateValue\"\r\n [max]=\"maxDateValue\">\r\n </mat-date-range-input>\r\n </label>\r\n @if(control?.value){\r\n <ds-icon matSuffix icon=\"close\" class=\"fc-onyx fs-10 mx-2 cursor-pointer\" (click)=\"clearDateValue($event)\"></ds-icon>\r\n }\r\n <mat-datepicker-toggle matSuffix [for]=\"picker\" [disableRipple]=\"true\">\r\n <i class=\"sfi sfi-calendar-o fc-onyx font-18\" matDatepickerToggleIcon></i>\r\n </mat-datepicker-toggle>\r\n <mat-date-range-picker #picker></mat-date-range-picker>\r\n</mat-form-field>\r\n<app-validation-errors [errors]=\"control.errors\"></app-validation-errors>\r\n", styles: [":host{flex-grow:1}\n"], dependencies: [{ kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1$2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i1$2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i2$1.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "directive", type: i2$1.MatDatepickerToggleIcon, selector: "[matDatepickerToggleIcon]" }, { kind: "component", type: i2$1.MatDateRangeInput, selector: "mat-date-range-input", inputs: ["rangePicker", "required", "dateFilter", "min", "max", "disabled", "separator", "comparisonStart", "comparisonEnd"], exportAs: ["matDateRangeInput"] }, { kind: "directive", type: i2$1.MatStartDate, selector: "input[matStartDate]", outputs: ["dateChange", "dateInput"] }, { kind: "directive", type: i2$1.MatEndDate, selector: "input[matEndDate]", outputs: ["dateChange", "dateInput"] }, { kind: "component", type: i2$1.MatDateRangePicker, selector: "mat-date-range-picker", exportAs: ["matDateRangePicker"] }, { 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"] }] });
|
|
3159
3176
|
}
|
|
3160
3177
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: DateRangePickerComponent, decorators: [{
|
|
3161
3178
|
type: Component,
|
|
@@ -3348,7 +3365,7 @@ class InputComponent extends ControlValueAccessorDirective {
|
|
|
3348
3365
|
useExisting: forwardRef(() => InputComponent),
|
|
3349
3366
|
multi: true,
|
|
3350
3367
|
},
|
|
3351
|
-
], usesInheritance: true, ngImport: i0, template: "@if(!isReadOnly){\r\n@if(label){\r\n<div class=\"d-flex justify-content-between mb-1\">\r\n <span class=\"form-label mb-0\">{{ label }}</span\r\n > @if(!required){<span class=\"fs-11 fc-dark-gray\">{{\r\n i18n.translate(\"Optional\")\r\n }}</span\r\n >} @if(hasTooltip){\r\n <span class=\"form-label mb-0\">\r\n {{ tooltip }}\r\n <ds-icon\r\n icon=\"info fs-22\"\r\n class=\"cursor-pointer\"\r\n [satPopoverAnchor]=\"popover\"\r\n (click)=\"popover.toggle(); $event.stopImmediatePropagation()\"\r\n ></ds-icon>\r\n </span>\r\n }\r\n</div>\r\n}\r\n<mat-form-field\r\n class=\"primary-form {{ className }}\"\r\n [ngClass]=\"{ 'input-disabled': control.disabled }\"\r\n [floatLabel]=\"floatLabel\"\r\n>\r\n @if(iconPrefixName){<span class=\"sfi {{ iconPrefixName }}\"></span>}\r\n <label class=\"mat-form-content\">\r\n <!-- add input for ar && en custom directive with add type = arOnly || type = enOnly-->\r\n @if(type === 'arOnly'){\r\n <input\r\n arOnly\r\n matInput\r\n [value]=\"value\"\r\n oninput=\"validity.valid || (value='');\"\r\n [formControl]=\"control\"\r\n [required]=\"required\"\r\n [placeholder]=\"placeholder\"\r\n />\r\n } @else if(type === 'enOnly'){\r\n <input\r\n enOnly\r\n matInput\r\n [value]=\"value\"\r\n oninput=\"validity.valid || (value='');\"\r\n [formControl]=\"control\"\r\n [required]=\"required\"\r\n [placeholder]=\"placeholder\"\r\n />\r\n }\r\n @else{\r\n <input\r\n matInput\r\n [value]=\"value\"\r\n oninput=\"validity.valid || (value='');\"\r\n [formControl]=\"control\"\r\n [type]=\"type\"\r\n [placeholder]=\"placeholder\"\r\n />\r\n }\r\n </label>\r\n \r\n @if(iconSuffixName){<span matSuffix class=\"sfi {{ iconSuffixName }}\"></span>}\r\n @if(hint){\r\n <mat-hint class=\"d-flex align-items-center gap-1 mt-1\">\r\n <span\r\n class=\"sfi sfi-info fs-17 fc-dark-gray\"\r\n [ngClass]=\"{ 'fc-oasis-light-imp': value }\"\r\n ></span>\r\n <span class=\"fs-12 fc-black line-height-1\">{{ hint }}</span>\r\n </mat-hint>\r\n }\r\n</mat-form-field>\r\n<app-validation-errors [errors]=\"control.errors\"></app-validation-errors>\r\n\r\n} @if(isReadOnly && (showIfEmpty || control)){\r\n<ng-container class=\"info-section\">\r\n <app-info-item\r\n class=\"info-item w-100\"\r\n [label]=\"label\"\r\n [insideTable]=\"insideTable\"\r\n [hasLabel]=\"!!label\"\r\n [type]=\"type\"\r\n [value]=\"control.value\"\r\n ></app-info-item>\r\n</ng-container>\r\n}\r\n\r\n<sat-popover #popover [hasBackdrop]=\"true\" verticalAlign=\"below\">\r\n <div class=\"default-popover p-3 fs-14\">\r\n <span class=\"fs-14 fw-bold signature-notes\" [innerHTML]=\"tooltip\"></span>\r\n </div>\r\n</sat-popover>\r\n", styles: [":host{flex-grow:1}.input-disabled{pointer-events:none;opacity:1.5}\n"], dependencies: [{ kind: "ngmodule", type: SatPopoverModule }, { kind: "component", type: i1$
|
|
3368
|
+
], usesInheritance: true, ngImport: i0, template: "@if(!isReadOnly){\r\n@if(label){\r\n<div class=\"d-flex justify-content-between mb-1\">\r\n <span class=\"form-label mb-0\">{{ label }}</span\r\n > @if(!required){<span class=\"fs-11 fc-dark-gray\">{{\r\n i18n.translate(\"Optional\")\r\n }}</span\r\n >} @if(hasTooltip){\r\n <span class=\"form-label mb-0\">\r\n {{ tooltip }}\r\n <ds-icon\r\n icon=\"info fs-22\"\r\n class=\"cursor-pointer\"\r\n [satPopoverAnchor]=\"popover\"\r\n (click)=\"popover.toggle(); $event.stopImmediatePropagation()\"\r\n ></ds-icon>\r\n </span>\r\n }\r\n</div>\r\n}\r\n<mat-form-field\r\n class=\"primary-form {{ className }}\"\r\n [ngClass]=\"{ 'input-disabled': control.disabled }\"\r\n [floatLabel]=\"floatLabel\"\r\n>\r\n @if(iconPrefixName){<span class=\"sfi {{ iconPrefixName }}\"></span>}\r\n <label class=\"mat-form-content\">\r\n <!-- add input for ar && en custom directive with add type = arOnly || type = enOnly-->\r\n @if(type === 'arOnly'){\r\n <input\r\n arOnly\r\n matInput\r\n [value]=\"value\"\r\n oninput=\"validity.valid || (value='');\"\r\n [formControl]=\"control\"\r\n [required]=\"required\"\r\n [placeholder]=\"placeholder\"\r\n />\r\n } @else if(type === 'enOnly'){\r\n <input\r\n enOnly\r\n matInput\r\n [value]=\"value\"\r\n oninput=\"validity.valid || (value='');\"\r\n [formControl]=\"control\"\r\n [required]=\"required\"\r\n [placeholder]=\"placeholder\"\r\n />\r\n }\r\n @else{\r\n <input\r\n matInput\r\n [value]=\"value\"\r\n oninput=\"validity.valid || (value='');\"\r\n [formControl]=\"control\"\r\n [type]=\"type\"\r\n [placeholder]=\"placeholder\"\r\n />\r\n }\r\n </label>\r\n \r\n @if(iconSuffixName){<span matSuffix class=\"sfi {{ iconSuffixName }}\"></span>}\r\n @if(hint){\r\n <mat-hint class=\"d-flex align-items-center gap-1 mt-1\">\r\n <span\r\n class=\"sfi sfi-info fs-17 fc-dark-gray\"\r\n [ngClass]=\"{ 'fc-oasis-light-imp': value }\"\r\n ></span>\r\n <span class=\"fs-12 fc-black line-height-1\">{{ hint }}</span>\r\n </mat-hint>\r\n }\r\n</mat-form-field>\r\n<app-validation-errors [errors]=\"control.errors\"></app-validation-errors>\r\n\r\n} @if(isReadOnly && (showIfEmpty || control)){\r\n<ng-container class=\"info-section\">\r\n <app-info-item\r\n class=\"info-item w-100\"\r\n [label]=\"label\"\r\n [insideTable]=\"insideTable\"\r\n [hasLabel]=\"!!label\"\r\n [type]=\"type\"\r\n [value]=\"control.value\"\r\n ></app-info-item>\r\n</ng-container>\r\n}\r\n\r\n<sat-popover #popover [hasBackdrop]=\"true\" verticalAlign=\"below\">\r\n <div class=\"default-popover p-3 fs-14\">\r\n <span class=\"fs-14 fw-bold signature-notes\" [innerHTML]=\"tooltip\"></span>\r\n </div>\r\n</sat-popover>\r\n", styles: [":host{flex-grow:1}.input-disabled{pointer-events:none;opacity:1.5}\n"], dependencies: [{ kind: "ngmodule", type: SatPopoverModule }, { kind: "component", type: i1$3.SatPopoverComponent, selector: "sat-popover", inputs: ["anchor", "horizontalAlign", "xAlign", "verticalAlign", "yAlign", "forceAlignment", "lockAlignment", "autoFocus", "restoreFocus", "scrollStrategy", "hasBackdrop", "interactiveClose", "openTransition", "closeTransition", "openAnimationStartAtScale", "closeAnimationEndAtScale", "backdropClass", "panelClass"], outputs: ["opened", "closed", "afterOpen", "afterClose", "backdropClicked", "overlayKeydown"] }, { kind: "directive", type: i1$3.SatPopoverAnchorDirective, selector: "[satPopoverAnchor]", inputs: ["satPopoverAnchor"], exportAs: ["satPopoverAnchor"] }, { 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.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: InfoItemComponent, selector: "app-info-item", inputs: ["label", "value", "name", "type", "dateType", "multiple", "insideTable", "hasLabel", "arrayList", "actionType", "download"] }, { 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: ValidationErrorsComponent, selector: "app-validation-errors", inputs: ["errors", "customErrorMessages"] }, { kind: "directive", type: EnOnlyDirective, selector: "[enOnly]" }, { kind: "directive", type: ArOnlyDirective, selector: "[arOnly]" }] });
|
|
3352
3369
|
}
|
|
3353
3370
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: InputComponent, decorators: [{
|
|
3354
3371
|
type: Component,
|
|
@@ -3471,7 +3488,7 @@ class InputNumberComponent extends ControlValueAccessorDirective {
|
|
|
3471
3488
|
useExisting: forwardRef(() => InputNumberComponent),
|
|
3472
3489
|
multi: true,
|
|
3473
3490
|
},
|
|
3474
|
-
], usesInheritance: true, ngImport: i0, template: "@if(!isReadOnly){\r\n @if(label){\r\n <div class=\"d-flex justify-content-between mb-1\">\r\n <span class=\"form-label mb-0\">{{ label }}</span\r\n > @if(!required){<span class=\"fs-11 fc-dark-gray\">{{\r\n i18n.translate(\"Optional\")\r\n }}</span\r\n >} @if(hasTooltip){\r\n <span class=\"form-label mb-0\">\r\n {{ tooltip }}\r\n <ds-icon\r\n icon=\"info fs-22\"\r\n class=\"cursor-pointer\"\r\n [satPopoverAnchor]=\"popover\"\r\n (click)=\"popover.toggle(); $event.stopImmediatePropagation()\"\r\n ></ds-icon>\r\n </span>\r\n }\r\n </div>\r\n }\r\n <mat-form-field\r\n class=\"primary-form {{ className }}\"\r\n [ngClass]=\"{ 'input-disabled': control.disabled }\"\r\n [floatLabel]=\"floatLabel\"\r\n >\r\n @if(iconPrefixName){<span class=\"sfi {{ iconPrefixName }}\"></span>}\r\n @if(loading){<span\r\n class=\"sfi sfi-spinner d-inline-block spin fc-coral\"\r\n matSuffix\r\n ></span\r\n >}\r\n <label class=\"mat-form-content\">\r\n <!-- add input for ar && en custom directive with add type = arOnly || type = enOnly-->\r\n <input\r\n matInput\r\n [value]=\"value\"\r\n oninput=\"validity.valid || (value='');\"\r\n [formControl]=\"control\"\r\n [type]=\"type\"\r\n [placeholder]=\"placeholder\"\r\n numberOnly\r\n />\r\n </label>\r\n @if(iconSuffixName){<span matSuffix class=\"sfi {{ iconSuffixName }}\"></span>}\r\n @if(hint){\r\n <mat-hint class=\"d-flex align-items-center gap-1 mt-1\">\r\n <span\r\n class=\"sfi sfi-info fs-17 fc-dark-gray\"\r\n [ngClass]=\"{ 'fc-oasis-light-imp': value }\"\r\n ></span>\r\n <span class=\"fs-12 fc-black line-height-1\">{{ hint }}</span>\r\n </mat-hint>\r\n }\r\n </mat-form-field>\r\n <app-validation-errors [errors]=\"control.errors\"></app-validation-errors>\r\n } @if(isReadOnly && (showIfEmpty || control)){\r\n <ng-container class=\"info-section\">\r\n <app-info-item\r\n class=\"info-item w-100\"\r\n [label]=\"label\"\r\n [insideTable]=\"insideTable\"\r\n [hasLabel]=\"!!label\"\r\n [type]=\"type\"\r\n [value]=\"control.value\"\r\n ></app-info-item>\r\n </ng-container>\r\n }\r\n <sat-popover #popover [hasBackdrop]=\"true\" verticalAlign=\"below\">\r\n <div class=\"default-popover p-3 fs-14\">\r\n <span class=\"fs-14 fw-bold signature-notes\" [innerHTML]=\"tooltip\"></span>\r\n </div>\r\n </sat-popover>\r\n ", styles: [":host{flex-grow:1}.input-disabled{pointer-events:none;opacity:1.5}\n"], dependencies: [{ kind: "component", type: MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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: InfoItemComponent, selector: "app-info-item", inputs: ["label", "value", "name", "type", "dateType", "multiple", "insideTable", "hasLabel", "arrayList", "actionType", "download"] }, { kind: "ngmodule", type: SatPopoverModule }, { kind: "component", type: i1$
|
|
3491
|
+
], usesInheritance: true, ngImport: i0, template: "@if(!isReadOnly){\r\n @if(label){\r\n <div class=\"d-flex justify-content-between mb-1\">\r\n <span class=\"form-label mb-0\">{{ label }}</span\r\n > @if(!required){<span class=\"fs-11 fc-dark-gray\">{{\r\n i18n.translate(\"Optional\")\r\n }}</span\r\n >} @if(hasTooltip){\r\n <span class=\"form-label mb-0\">\r\n {{ tooltip }}\r\n <ds-icon\r\n icon=\"info fs-22\"\r\n class=\"cursor-pointer\"\r\n [satPopoverAnchor]=\"popover\"\r\n (click)=\"popover.toggle(); $event.stopImmediatePropagation()\"\r\n ></ds-icon>\r\n </span>\r\n }\r\n </div>\r\n }\r\n <mat-form-field\r\n class=\"primary-form {{ className }}\"\r\n [ngClass]=\"{ 'input-disabled': control.disabled }\"\r\n [floatLabel]=\"floatLabel\"\r\n >\r\n @if(iconPrefixName){<span class=\"sfi {{ iconPrefixName }}\"></span>}\r\n @if(loading){<span\r\n class=\"sfi sfi-spinner d-inline-block spin fc-coral\"\r\n matSuffix\r\n ></span\r\n >}\r\n <label class=\"mat-form-content\">\r\n <!-- add input for ar && en custom directive with add type = arOnly || type = enOnly-->\r\n <input\r\n matInput\r\n [value]=\"value\"\r\n oninput=\"validity.valid || (value='');\"\r\n [formControl]=\"control\"\r\n [type]=\"type\"\r\n [placeholder]=\"placeholder\"\r\n numberOnly\r\n />\r\n </label>\r\n @if(iconSuffixName){<span matSuffix class=\"sfi {{ iconSuffixName }}\"></span>}\r\n @if(hint){\r\n <mat-hint class=\"d-flex align-items-center gap-1 mt-1\">\r\n <span\r\n class=\"sfi sfi-info fs-17 fc-dark-gray\"\r\n [ngClass]=\"{ 'fc-oasis-light-imp': value }\"\r\n ></span>\r\n <span class=\"fs-12 fc-black line-height-1\">{{ hint }}</span>\r\n </mat-hint>\r\n }\r\n </mat-form-field>\r\n <app-validation-errors [errors]=\"control.errors\"></app-validation-errors>\r\n } @if(isReadOnly && (showIfEmpty || control)){\r\n <ng-container class=\"info-section\">\r\n <app-info-item\r\n class=\"info-item w-100\"\r\n [label]=\"label\"\r\n [insideTable]=\"insideTable\"\r\n [hasLabel]=\"!!label\"\r\n [type]=\"type\"\r\n [value]=\"control.value\"\r\n ></app-info-item>\r\n </ng-container>\r\n }\r\n <sat-popover #popover [hasBackdrop]=\"true\" verticalAlign=\"below\">\r\n <div class=\"default-popover p-3 fs-14\">\r\n <span class=\"fs-14 fw-bold signature-notes\" [innerHTML]=\"tooltip\"></span>\r\n </div>\r\n </sat-popover>\r\n ", styles: [":host{flex-grow:1}.input-disabled{pointer-events:none;opacity:1.5}\n"], dependencies: [{ kind: "component", type: MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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: InfoItemComponent, selector: "app-info-item", inputs: ["label", "value", "name", "type", "dateType", "multiple", "insideTable", "hasLabel", "arrayList", "actionType", "download"] }, { kind: "ngmodule", type: SatPopoverModule }, { kind: "component", type: i1$3.SatPopoverComponent, selector: "sat-popover", inputs: ["anchor", "horizontalAlign", "xAlign", "verticalAlign", "yAlign", "forceAlignment", "lockAlignment", "autoFocus", "restoreFocus", "scrollStrategy", "hasBackdrop", "interactiveClose", "openTransition", "closeTransition", "openAnimationStartAtScale", "closeAnimationEndAtScale", "backdropClass", "panelClass"], outputs: ["opened", "closed", "afterOpen", "afterClose", "backdropClicked", "overlayKeydown"] }, { kind: "directive", type: i1$3.SatPopoverAnchorDirective, selector: "[satPopoverAnchor]", inputs: ["satPopoverAnchor"], exportAs: ["satPopoverAnchor"] }, { 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: NumberDirective, selector: "[numberOnly]", inputs: ["decimals"] }, { kind: "component", type: ValidationErrorsComponent, selector: "app-validation-errors", inputs: ["errors", "customErrorMessages"] }] });
|
|
3475
3492
|
}
|
|
3476
3493
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: InputNumberComponent, decorators: [{
|
|
3477
3494
|
type: Component,
|
|
@@ -3532,7 +3549,7 @@ class InputEmailComponent extends ControlValueAccessorDirective {
|
|
|
3532
3549
|
useExisting: forwardRef(() => InputEmailComponent),
|
|
3533
3550
|
multi: true,
|
|
3534
3551
|
},
|
|
3535
|
-
], usesInheritance: true, ngImport: i0, template: "@if(!isReadOnly){\r\n @if(label){\r\n <div class=\"d-flex justify-content-between mb-1\">\r\n <span class=\"form-label mb-0\">{{ label }}</span\r\n > @if(!required){<span class=\"fs-11 fc-dark-gray\">{{\r\n i18n.translate(\"Optional\")\r\n }}</span\r\n >} @if(hasTooltip){\r\n <span class=\"form-label mb-0\">\r\n {{ tooltip }}\r\n <ds-icon\r\n icon=\"info fs-22\"\r\n class=\"cursor-pointer\"\r\n [satPopoverAnchor]=\"popover\"\r\n (click)=\"popover.toggle(); $event.stopImmediatePropagation()\"\r\n ></ds-icon>\r\n </span>\r\n }\r\n </div>\r\n }\r\n <mat-form-field\r\n class=\"primary-form {{ className }}\"\r\n [ngClass]=\"{ 'input-disabled': control.disabled }\"\r\n [floatLabel]=\"floatLabel\"\r\n >\r\n @if(iconPrefixName){<span class=\"sfi {{ iconPrefixName }}\"></span>}\r\n @if(loading){<span\r\n class=\"sfi sfi-spinner d-inline-block spin fc-coral\"\r\n matSuffix\r\n ></span\r\n >}\r\n <label class=\"mat-form-content\">\r\n <!-- add input for ar && en custom directive with add type = arOnly || type = enOnly-->\r\n <input\r\n matInput\r\n [value]=\"value\"\r\n oninput=\"validity.valid || (value='');\"\r\n [formControl]=\"control\"\r\n [type]=\"type\"\r\n [placeholder]=\"placeholder\"\r\n (change)=\"displayErrors($event)\"\r\n />\r\n </label>\r\n @if(iconSuffixName){<span matSuffix class=\"sfi {{ iconSuffixName }}\"></span>}\r\n @if(hint){\r\n <mat-hint class=\"d-flex align-items-center gap-1 mt-1\">\r\n <span\r\n class=\"sfi sfi-info fs-17 fc-dark-gray\"\r\n [ngClass]=\"{ 'fc-oasis-light-imp': value }\"\r\n ></span>\r\n <span class=\"fs-12 fc-black line-height-1\">{{ hint }}</span>\r\n </mat-hint>\r\n }\r\n </mat-form-field>\r\n <app-validation-errors [errors]=\"control.errors\"></app-validation-errors>\r\n } @if(isReadOnly && (showIfEmpty || control)){\r\n <ng-container class=\"info-section\">\r\n <app-info-item\r\n class=\"info-item w-100\"\r\n [label]=\"label\"\r\n [insideTable]=\"insideTable\"\r\n [hasLabel]=\"!!label\"\r\n [type]=\"type\"\r\n [value]=\"control.value\"\r\n ></app-info-item>\r\n </ng-container>\r\n }\r\n <sat-popover #popover [hasBackdrop]=\"true\" verticalAlign=\"below\">\r\n <div class=\"default-popover p-3 fs-14\">\r\n <span class=\"fs-14 fw-bold signature-notes\" [innerHTML]=\"tooltip\"></span>\r\n </div>\r\n </sat-popover>\r\n ", styles: [":host{flex-grow:1}.input-disabled{pointer-events:none;opacity:1.5}\n"], dependencies: [{ kind: "component", type: MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "component", type: InfoItemComponent, selector: "app-info-item", inputs: ["label", "value", "name", "type", "dateType", "multiple", "insideTable", "hasLabel", "arrayList", "actionType", "download"] }, { kind: "ngmodule", type: SatPopoverModule }, { kind: "component", type: i1$
|
|
3552
|
+
], usesInheritance: true, ngImport: i0, template: "@if(!isReadOnly){\r\n @if(label){\r\n <div class=\"d-flex justify-content-between mb-1\">\r\n <span class=\"form-label mb-0\">{{ label }}</span\r\n > @if(!required){<span class=\"fs-11 fc-dark-gray\">{{\r\n i18n.translate(\"Optional\")\r\n }}</span\r\n >} @if(hasTooltip){\r\n <span class=\"form-label mb-0\">\r\n {{ tooltip }}\r\n <ds-icon\r\n icon=\"info fs-22\"\r\n class=\"cursor-pointer\"\r\n [satPopoverAnchor]=\"popover\"\r\n (click)=\"popover.toggle(); $event.stopImmediatePropagation()\"\r\n ></ds-icon>\r\n </span>\r\n }\r\n </div>\r\n }\r\n <mat-form-field\r\n class=\"primary-form {{ className }}\"\r\n [ngClass]=\"{ 'input-disabled': control.disabled }\"\r\n [floatLabel]=\"floatLabel\"\r\n >\r\n @if(iconPrefixName){<span class=\"sfi {{ iconPrefixName }}\"></span>}\r\n @if(loading){<span\r\n class=\"sfi sfi-spinner d-inline-block spin fc-coral\"\r\n matSuffix\r\n ></span\r\n >}\r\n <label class=\"mat-form-content\">\r\n <!-- add input for ar && en custom directive with add type = arOnly || type = enOnly-->\r\n <input\r\n matInput\r\n [value]=\"value\"\r\n oninput=\"validity.valid || (value='');\"\r\n [formControl]=\"control\"\r\n [type]=\"type\"\r\n [placeholder]=\"placeholder\"\r\n (change)=\"displayErrors($event)\"\r\n />\r\n </label>\r\n @if(iconSuffixName){<span matSuffix class=\"sfi {{ iconSuffixName }}\"></span>}\r\n @if(hint){\r\n <mat-hint class=\"d-flex align-items-center gap-1 mt-1\">\r\n <span\r\n class=\"sfi sfi-info fs-17 fc-dark-gray\"\r\n [ngClass]=\"{ 'fc-oasis-light-imp': value }\"\r\n ></span>\r\n <span class=\"fs-12 fc-black line-height-1\">{{ hint }}</span>\r\n </mat-hint>\r\n }\r\n </mat-form-field>\r\n <app-validation-errors [errors]=\"control.errors\"></app-validation-errors>\r\n } @if(isReadOnly && (showIfEmpty || control)){\r\n <ng-container class=\"info-section\">\r\n <app-info-item\r\n class=\"info-item w-100\"\r\n [label]=\"label\"\r\n [insideTable]=\"insideTable\"\r\n [hasLabel]=\"!!label\"\r\n [type]=\"type\"\r\n [value]=\"control.value\"\r\n ></app-info-item>\r\n </ng-container>\r\n }\r\n <sat-popover #popover [hasBackdrop]=\"true\" verticalAlign=\"below\">\r\n <div class=\"default-popover p-3 fs-14\">\r\n <span class=\"fs-14 fw-bold signature-notes\" [innerHTML]=\"tooltip\"></span>\r\n </div>\r\n </sat-popover>\r\n ", styles: [":host{flex-grow:1}.input-disabled{pointer-events:none;opacity:1.5}\n"], dependencies: [{ kind: "component", type: MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "component", type: InfoItemComponent, selector: "app-info-item", inputs: ["label", "value", "name", "type", "dateType", "multiple", "insideTable", "hasLabel", "arrayList", "actionType", "download"] }, { kind: "ngmodule", type: SatPopoverModule }, { kind: "component", type: i1$3.SatPopoverComponent, selector: "sat-popover", inputs: ["anchor", "horizontalAlign", "xAlign", "verticalAlign", "yAlign", "forceAlignment", "lockAlignment", "autoFocus", "restoreFocus", "scrollStrategy", "hasBackdrop", "interactiveClose", "openTransition", "closeTransition", "openAnimationStartAtScale", "closeAnimationEndAtScale", "backdropClass", "panelClass"], outputs: ["opened", "closed", "afterOpen", "afterClose", "backdropClicked", "overlayKeydown"] }, { kind: "directive", type: i1$3.SatPopoverAnchorDirective, selector: "[satPopoverAnchor]", inputs: ["satPopoverAnchor"], exportAs: ["satPopoverAnchor"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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: "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"] }] });
|
|
3536
3553
|
}
|
|
3537
3554
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: InputEmailComponent, decorators: [{
|
|
3538
3555
|
type: Component,
|
|
@@ -3588,7 +3605,7 @@ class InputMaskComponent extends ControlValueAccessorDirective {
|
|
|
3588
3605
|
useExisting: forwardRef(() => InputMaskComponent),
|
|
3589
3606
|
multi: true,
|
|
3590
3607
|
},
|
|
3591
|
-
], usesInheritance: true, ngImport: i0, template: "\r\n@if(!isReadOnly){\r\n <ng-container>\r\n <!-- <app-form-label [label]=\"label\" [optional]=\"!required\" [hideOption]=\"hideOption\" [showLabel]=\"showLabel\"></app-form-label> -->\r\n @if(label){\r\n <div class=\"d-flex justify-content-between mb-1\">\r\n <span class=\"form-label mb-0\">{{label}}</span>\r\n @if(!required){\r\n <span class=\"fs-11 fc-dark-gray\">{{i18n.translate('Optional')}}\r\n </span>\r\n }\r\n </div>\r\n }\r\n \r\n <mat-form-field class=\"primary-form {{className}}\" [ngClass]=\"{'input-disabled' : isDisabled }\"\r\n [floatLabel]=\"floatLabel\">\r\n \r\n @if(iconPrefixName){\r\n <span matPrefix class=\"sfi {{iconPrefixName}}\"></span>\r\n }\r\n <label class=\"mat-form-content\">\r\n <input matInput [placeholder]=\"placeholder\" [value]=\"value\" [attr.disabled]=\"isDisabled\" [mask]=\"mask\"\r\n [showMaskTyped]=\"false\" oninput=\"validity.valid || (value='');\" [formControl]=\"control\"\r\n [required]=\"required\" [placeholder]=\"placeholder\">\r\n </label>\r\n \r\n @if(matSuffix){\r\n <span matSuffix class=\"sfi {{iconSuffixName}}\"></span>\r\n }\r\n @if(type === 'number'){\r\n <div matSuffix class=\"d-flex align-items-center gap-2\">\r\n @if(numberSuffixName){\r\n <span class=\"fs-14 fw-medium\">{{numberSuffixName}}</span>\r\n }\r\n <!-- <span class=\"sfi sfi-minus p-2 bc-light-gray fc-black\"></span>\r\n <span class=\"sfi sfi-plus p-2 bc-light-gray fc-black\"></span> -->\r\n </div>\r\n }\r\n <!-- @if((!control?.valid)){\r\n <mat-error class=\"mb-2\">\r\n {{i18n.translate('validFieldError')}}{{label}}\r\n </mat-error>\r\n } -->\r\n \r\n \r\n <!-- <mat-error *ngIf=\"(type ==='email' && !control?.valid)\">\r\n {{i18n.translate('validEmailError')}}\r\n </mat-error> -->\r\n @if(showHint){\r\n <mat-hint>\r\n <span class=\"sfi sfi-check-circle font-10 fc-dark-gray\" [ngClass]=\"{'fc-oasis-light-imp':value}\"></span>\r\n <span class=\"mx-1\"></span>\r\n <span class=\"fs-12 fc-onyx\">{{hint}}</span>\r\n </mat-hint>\r\n }\r\n </mat-form-field>\r\n <!-- <span class=\"fc-coral\" style=\"color:#f44336\" *ngIf=\"( showErrorMessage && control.value)\">\r\n {{errorMessage}}\r\n </span> -->\r\n \r\n </ng-container>\r\n}\r\n\r\n@if(isReadOnly && control){\r\n <ng-container class=\"info-section\">\r\n <app-info-item class=\"info-item w-100\" [label]=\"label\" [insideTable]=\"insideTable\" [hasLabel]=\"label ? true: false\"\r\n [value]=\"control\"></app-info-item>\r\n </ng-container>\r\n \r\n}\r\n\r\n\r\n<!-- section tooltip -->\r\n<sat-popover #popover [hasBackdrop]=\"true\" verticalAlign=\"below\">\r\n <div class=\"deafult-tooltip\">\r\n {{tooltip}}\r\n </div>\r\n</sat-popover>\r\n", styles: [":host{flex-grow:1}\n"], dependencies: [{ kind: "ngmodule", type: SatPopoverModule }, { kind: "component", type: i1$
|
|
3608
|
+
], usesInheritance: true, ngImport: i0, template: "\r\n@if(!isReadOnly){\r\n <ng-container>\r\n <!-- <app-form-label [label]=\"label\" [optional]=\"!required\" [hideOption]=\"hideOption\" [showLabel]=\"showLabel\"></app-form-label> -->\r\n @if(label){\r\n <div class=\"d-flex justify-content-between mb-1\">\r\n <span class=\"form-label mb-0\">{{label}}</span>\r\n @if(!required){\r\n <span class=\"fs-11 fc-dark-gray\">{{i18n.translate('Optional')}}\r\n </span>\r\n }\r\n </div>\r\n }\r\n \r\n <mat-form-field class=\"primary-form {{className}}\" [ngClass]=\"{'input-disabled' : isDisabled }\"\r\n [floatLabel]=\"floatLabel\">\r\n \r\n @if(iconPrefixName){\r\n <span matPrefix class=\"sfi {{iconPrefixName}}\"></span>\r\n }\r\n <label class=\"mat-form-content\">\r\n <input matInput [placeholder]=\"placeholder\" [value]=\"value\" [attr.disabled]=\"isDisabled\" [mask]=\"mask\"\r\n [showMaskTyped]=\"false\" oninput=\"validity.valid || (value='');\" [formControl]=\"control\"\r\n [required]=\"required\" [placeholder]=\"placeholder\">\r\n </label>\r\n \r\n @if(matSuffix){\r\n <span matSuffix class=\"sfi {{iconSuffixName}}\"></span>\r\n }\r\n @if(type === 'number'){\r\n <div matSuffix class=\"d-flex align-items-center gap-2\">\r\n @if(numberSuffixName){\r\n <span class=\"fs-14 fw-medium\">{{numberSuffixName}}</span>\r\n }\r\n <!-- <span class=\"sfi sfi-minus p-2 bc-light-gray fc-black\"></span>\r\n <span class=\"sfi sfi-plus p-2 bc-light-gray fc-black\"></span> -->\r\n </div>\r\n }\r\n <!-- @if((!control?.valid)){\r\n <mat-error class=\"mb-2\">\r\n {{i18n.translate('validFieldError')}}{{label}}\r\n </mat-error>\r\n } -->\r\n \r\n \r\n <!-- <mat-error *ngIf=\"(type ==='email' && !control?.valid)\">\r\n {{i18n.translate('validEmailError')}}\r\n </mat-error> -->\r\n @if(showHint){\r\n <mat-hint>\r\n <span class=\"sfi sfi-check-circle font-10 fc-dark-gray\" [ngClass]=\"{'fc-oasis-light-imp':value}\"></span>\r\n <span class=\"mx-1\"></span>\r\n <span class=\"fs-12 fc-onyx\">{{hint}}</span>\r\n </mat-hint>\r\n }\r\n </mat-form-field>\r\n <!-- <span class=\"fc-coral\" style=\"color:#f44336\" *ngIf=\"( showErrorMessage && control.value)\">\r\n {{errorMessage}}\r\n </span> -->\r\n \r\n </ng-container>\r\n}\r\n\r\n@if(isReadOnly && control){\r\n <ng-container class=\"info-section\">\r\n <app-info-item class=\"info-item w-100\" [label]=\"label\" [insideTable]=\"insideTable\" [hasLabel]=\"label ? true: false\"\r\n [value]=\"control\"></app-info-item>\r\n </ng-container>\r\n \r\n}\r\n\r\n\r\n<!-- section tooltip -->\r\n<sat-popover #popover [hasBackdrop]=\"true\" verticalAlign=\"below\">\r\n <div class=\"deafult-tooltip\">\r\n {{tooltip}}\r\n </div>\r\n</sat-popover>\r\n", styles: [":host{flex-grow:1}\n"], dependencies: [{ kind: "ngmodule", type: SatPopoverModule }, { kind: "component", type: i1$3.SatPopoverComponent, selector: "sat-popover", inputs: ["anchor", "horizontalAlign", "xAlign", "verticalAlign", "yAlign", "forceAlignment", "lockAlignment", "autoFocus", "restoreFocus", "scrollStrategy", "hasBackdrop", "interactiveClose", "openTransition", "closeTransition", "openAnimationStartAtScale", "closeAnimationEndAtScale", "backdropClass", "panelClass"], outputs: ["opened", "closed", "afterOpen", "afterClose", "backdropClicked", "overlayKeydown"] }, { kind: "component", type: MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: NgxMaskDirective, selector: "input[mask], textarea[mask]", inputs: ["mask", "specialCharacters", "patterns", "prefix", "suffix", "thousandSeparator", "decimalMarker", "dropSpecialCharacters", "hiddenInput", "showMaskTyped", "placeHolderCharacter", "shownMaskExpression", "showTemplate", "clearIfNotMatch", "validation", "separatorLimit", "allowNegativeNumbers", "leadZeroDateTime", "leadZero", "triggerOnMaskChange", "apm", "inputTransformFn", "outputTransformFn", "keepCharacterPositions"], outputs: ["maskFilled"], exportAs: ["mask", "ngxMask"] }, { 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.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
|
|
3592
3609
|
}
|
|
3593
3610
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: InputMaskComponent, decorators: [{
|
|
3594
3611
|
type: Component,
|
|
@@ -3707,7 +3724,7 @@ class InputCurrencyComponent extends ControlValueAccessorDirective {
|
|
|
3707
3724
|
multi: true,
|
|
3708
3725
|
},
|
|
3709
3726
|
MycurrencyPipe
|
|
3710
|
-
], usesInheritance: true, ngImport: i0, template: "@if(!isReadOnly){\r\n @if(label){\r\n <div class=\"d-flex justify-content-between mb-1\">\r\n <span class=\"form-label mb-0\">{{ label }}</span\r\n > @if(!required){<span class=\"fs-11 fc-dark-gray\">{{\r\n i18n.translate(\"Optional\")\r\n }}</span\r\n >} @if(hasTooltip){\r\n <span class=\"form-label mb-0\">\r\n {{ tooltip }}\r\n <ds-icon\r\n icon=\"info fs-22\"\r\n class=\"cursor-pointer\"\r\n [satPopoverAnchor]=\"popover\"\r\n (click)=\"popover.toggle(); $event.stopImmediatePropagation()\"\r\n ></ds-icon>\r\n </span>\r\n }\r\n </div>\r\n }\r\n <mat-form-field\r\n class=\"primary-form {{ className }}\"\r\n [ngClass]=\"{ 'input-disabled': control.disabled }\"\r\n [floatLabel]=\"floatLabel\"\r\n >\r\n @if(iconPrefixName){<span class=\"sfi {{ iconPrefixName }}\"></span>}\r\n @if(loading){<span\r\n class=\"sfi sfi-spinner d-inline-block spin fc-coral\"\r\n matSuffix\r\n ></span\r\n >}\r\n <label class=\"mat-form-content\">\r\n <!-- add input for ar && en custom directive with add type = arOnly || type = enOnly-->\r\n <input\r\n matInput\r\n [value]=\"value\"\r\n oninput=\"validity.valid || (value='');\"\r\n [formControl]=\"control\"\r\n [type]=\"type\"\r\n [placeholder]=\"placeholder\"\r\n appMycurrency\r\n />\r\n </label>\r\n @if(iconSuffixName){<span matSuffix class=\"sfi {{ iconSuffixName }}\"></span>}\r\n @if(hint){\r\n <mat-hint class=\"d-flex align-items-center gap-1 mt-1\">\r\n <span\r\n class=\"sfi sfi-info fs-17 fc-dark-gray\"\r\n [ngClass]=\"{ 'fc-oasis-light-imp': value }\"\r\n ></span>\r\n <span class=\"fs-12 fc-black line-height-1\">{{ hint }}</span>\r\n </mat-hint>\r\n }\r\n </mat-form-field>\r\n <app-validation-errors [errors]=\"control.errors\"></app-validation-errors>\r\n } @if(isReadOnly && (showIfEmpty || control)){\r\n <ng-container class=\"info-section\">\r\n <app-info-item\r\n class=\"info-item w-100\"\r\n [label]=\"label\"\r\n [insideTable]=\"insideTable\"\r\n [hasLabel]=\"!!label\"\r\n [type]=\"type\"\r\n [value]=\"control.value\"\r\n ></app-info-item>\r\n </ng-container>\r\n }\r\n <sat-popover #popover [hasBackdrop]=\"true\" verticalAlign=\"below\">\r\n <div class=\"default-popover p-3 fs-14\">\r\n <span class=\"fs-14 fw-bold signature-notes\" [innerHTML]=\"tooltip\"></span>\r\n </div>\r\n </sat-popover>\r\n ", styles: [":host{flex-grow:1}.input-disabled{pointer-events:none!important;opacity:1.5}\n"], dependencies: [{ 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: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "component", type: InfoItemComponent, selector: "app-info-item", inputs: ["label", "value", "name", "type", "dateType", "multiple", "insideTable", "hasLabel", "arrayList", "actionType", "download"] }, { kind: "ngmodule", type: SatPopoverModule }, { kind: "component", type: i1$
|
|
3727
|
+
], usesInheritance: true, ngImport: i0, template: "@if(!isReadOnly){\r\n @if(label){\r\n <div class=\"d-flex justify-content-between mb-1\">\r\n <span class=\"form-label mb-0\">{{ label }}</span\r\n > @if(!required){<span class=\"fs-11 fc-dark-gray\">{{\r\n i18n.translate(\"Optional\")\r\n }}</span\r\n >} @if(hasTooltip){\r\n <span class=\"form-label mb-0\">\r\n {{ tooltip }}\r\n <ds-icon\r\n icon=\"info fs-22\"\r\n class=\"cursor-pointer\"\r\n [satPopoverAnchor]=\"popover\"\r\n (click)=\"popover.toggle(); $event.stopImmediatePropagation()\"\r\n ></ds-icon>\r\n </span>\r\n }\r\n </div>\r\n }\r\n <mat-form-field\r\n class=\"primary-form {{ className }}\"\r\n [ngClass]=\"{ 'input-disabled': control.disabled }\"\r\n [floatLabel]=\"floatLabel\"\r\n >\r\n @if(iconPrefixName){<span class=\"sfi {{ iconPrefixName }}\"></span>}\r\n @if(loading){<span\r\n class=\"sfi sfi-spinner d-inline-block spin fc-coral\"\r\n matSuffix\r\n ></span\r\n >}\r\n <label class=\"mat-form-content\">\r\n <!-- add input for ar && en custom directive with add type = arOnly || type = enOnly-->\r\n <input\r\n matInput\r\n [value]=\"value\"\r\n oninput=\"validity.valid || (value='');\"\r\n [formControl]=\"control\"\r\n [type]=\"type\"\r\n [placeholder]=\"placeholder\"\r\n appMycurrency\r\n />\r\n </label>\r\n @if(iconSuffixName){<span matSuffix class=\"sfi {{ iconSuffixName }}\"></span>}\r\n @if(hint){\r\n <mat-hint class=\"d-flex align-items-center gap-1 mt-1\">\r\n <span\r\n class=\"sfi sfi-info fs-17 fc-dark-gray\"\r\n [ngClass]=\"{ 'fc-oasis-light-imp': value }\"\r\n ></span>\r\n <span class=\"fs-12 fc-black line-height-1\">{{ hint }}</span>\r\n </mat-hint>\r\n }\r\n </mat-form-field>\r\n <app-validation-errors [errors]=\"control.errors\"></app-validation-errors>\r\n } @if(isReadOnly && (showIfEmpty || control)){\r\n <ng-container class=\"info-section\">\r\n <app-info-item\r\n class=\"info-item w-100\"\r\n [label]=\"label\"\r\n [insideTable]=\"insideTable\"\r\n [hasLabel]=\"!!label\"\r\n [type]=\"type\"\r\n [value]=\"control.value\"\r\n ></app-info-item>\r\n </ng-container>\r\n }\r\n <sat-popover #popover [hasBackdrop]=\"true\" verticalAlign=\"below\">\r\n <div class=\"default-popover p-3 fs-14\">\r\n <span class=\"fs-14 fw-bold signature-notes\" [innerHTML]=\"tooltip\"></span>\r\n </div>\r\n </sat-popover>\r\n ", styles: [":host{flex-grow:1}.input-disabled{pointer-events:none!important;opacity:1.5}\n"], dependencies: [{ 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: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "component", type: InfoItemComponent, selector: "app-info-item", inputs: ["label", "value", "name", "type", "dateType", "multiple", "insideTable", "hasLabel", "arrayList", "actionType", "download"] }, { kind: "ngmodule", type: SatPopoverModule }, { kind: "component", type: i1$3.SatPopoverComponent, selector: "sat-popover", inputs: ["anchor", "horizontalAlign", "xAlign", "verticalAlign", "yAlign", "forceAlignment", "lockAlignment", "autoFocus", "restoreFocus", "scrollStrategy", "hasBackdrop", "interactiveClose", "openTransition", "closeTransition", "openAnimationStartAtScale", "closeAnimationEndAtScale", "backdropClass", "panelClass"], outputs: ["opened", "closed", "afterOpen", "afterClose", "backdropClicked", "overlayKeydown"] }, { kind: "directive", type: i1$3.SatPopoverAnchorDirective, selector: "[satPopoverAnchor]", inputs: ["satPopoverAnchor"], exportAs: ["satPopoverAnchor"] }, { 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: "directive", type: MycurrencyDirective, selector: "[appMycurrency]", inputs: ["decimals"] }, { kind: "component", type: ValidationErrorsComponent, selector: "app-validation-errors", inputs: ["errors", "customErrorMessages"] }] });
|
|
3711
3728
|
}
|
|
3712
3729
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: InputCurrencyComponent, decorators: [{
|
|
3713
3730
|
type: Component,
|
|
@@ -4064,7 +4081,7 @@ class SearchEmployeeComponent extends BaseComponent {
|
|
|
4064
4081
|
// this.sidenavService.publish('open', FaqSidenavComponent, 'end', 'over');
|
|
4065
4082
|
}
|
|
4066
4083
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SearchEmployeeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
4067
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: SearchEmployeeComponent, isStandalone: true, selector: "app-search-employee", inputs: { valueName: "valueName", label: "label", tooltip: "tooltip", className: "className", showLabel: "showLabel", optional: "optional", data: "data", floatLabel: "floatLabel", error: "error", showEdit: "showEdit", arrayList: "arrayList", isUniqueUsers: "isUniqueUsers" }, outputs: { selectedEmp: "selectedEmp", onInputChange: "onInputChange", editDirectManger: "editDirectManger", deleteDirectManger: "deleteDirectManger", emitedDeletedValue: "emitedDeletedValue" }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ng-container *ngIf=\"!isReadOnly\">\r\n <div class=\"d-flex justify-content-between mb-1\" *ngIf=\"hasLabel\">\r\n <span class=\"form-label mb-0\">\r\n {{labelTextWriteMode}}\r\n <ds-icon icon=\"info\" class=\"cursor-pointer\" [satPopoverAnchor]=\"searchEmpPopover\"\r\n ></ds-icon>\r\n <!-- (click)=\"searchEmpPopover.toggle(); $event.stopImmediatePropagation()\" -->\r\n </span>\r\n\r\n <span *ngIf=\"optional && !hideOption\" class=\"fs-11 fc-dark-gray\"> {{i18n.translate('Optional')}}\r\n </span>\r\n </div>\r\n <mat-form-field class=\"primary-form {{className}}\" [floatLabel]=\"floatLabel\">\r\n <mat-label>\r\n {{label}}\r\n </mat-label>\r\n <ds-icon matPrefix icon=\"search\" class=\"fc-coral fs-18\"></ds-icon>\r\n <label class=\"mat-form-content\">\r\n <input type=\"text\" aria-label=\"Number\" (input)=\"onLoadOptions($event)\" matInput [disabled]=\"disabled\"\r\n [formControl]=\"controller\" [matAutocomplete]=\"auto\">\r\n \r\n </label>\r\n <mat-error class=\"mb-2\" *ngIf=\"showErrorMessage\">{{errorMessage}}\r\n </mat-error>\r\n <span class=\"sfi sfi-spinner d-inline-block spin fc-coral\" matSuffix *ngIf=\"loading\"></span>\r\n <mat-autocomplete #auto=\"matAutocomplete\">\r\n <mat-option *ngFor=\"let option of data\" [value]=\"option?.['personName']\"\r\n (onSelectionChange)=\"selectOption(option , $event)\">\r\n <div class=\"d-flex align-items-center\">\r\n <div class=\"img-card circled-img small\">\r\n <img [src]=\"getImage(option?.email)\" onerror=\"this.onerror=null;this.src='assets/images/user.svg';\" alt=\"\">\r\n </div>\r\n <span class=\"mx-2\"></span>\r\n <div class=\"line-height-1\">\r\n <h6 class=\"fs-17 fw-medium fc-onyx mb-0 line-height-1\">{{option?.name}}</h6>\r\n <span class=\"fs-13 fw-normal fc-dark-gray\">\r\n {{option?.description}}\r\n </span>\r\n </div>\r\n </div>\r\n </mat-option>\r\n </mat-autocomplete>\r\n <mat-error class=\"mb-2\" *ngIf=\"(!controller?.valid)\">{{i18n.translate('validSearchError')}}{{label}}\r\n </mat-error>\r\n <mat-hint *ngIf=\"showHint\">\r\n <span class=\"sfi sfi-check-circle font-10 fc-dark-gray\" [ngClass]=\"{'fc-oasis-light-imp':value}\"></span>\r\n <span class=\"mx-1\"></span>\r\n <span class=\"fs-12 fc-onyx\">{{hint}}</span>\r\n </mat-hint>\r\n </mat-form-field>\r\n <mat-error class=\"mb-2\" *ngIf=\"showErrorMessage\">{{errorMessage}}\r\n </mat-error>\r\n\r\n <mat-error class=\"mb-2\" *ngIf=\"userAlreadyExist\">\r\n {{ i18n.translate('userAlreadyExist') }}\r\n </mat-error>\r\n\r\n <div class=\"col-12\" *ngIf=\"arrayList?.length && !isReadOnly && multiple\">\r\n <div class=\"example-list n-results\">\r\n <div class=\"example-box n-col px-3\" [ngClass]=\"{'mt-0': ind === 0}\"\r\n *ngFor=\"let emails of arrayList; let ind = index\">\r\n <div class=\"d-flex flex-grow-1 w-100\">\r\n <div class=\"user-info flex-grow-1\">\r\n <img [src]=\"getImage(emails?.personEmail)\" onerror=\"this.onerror=null;this.src='assets/images/user.svg';\"\r\n alt=\"\" class=\"prof-img\" draggable=\"false\">\r\n <label *ngIf=\"emails?.personName\">\r\n {{(emails?.personName)}}\r\n <span class=\"title\">\r\n {{emails?.personEmail}}\r\n </span>\r\n </label>\r\n </div>\r\n <ds-button class=\"ds-btn-action\" size=\"small\" *ngIf=\"!(isReadOnly)\" (click)=\"deleteRow(ind,emails)\" icon>\r\n <ds-icon icon=\"trash\" class=\"fc-red fs-20\"></ds-icon>\r\n </ds-button>\r\n\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n</ng-container>\r\n\r\n<ng-container *ngIf=\"(isReadOnly && (field?.personName || multiple))\">\r\n <app-info-item class=\"d-flex flex-wrap align-items-center info-item w-100 mb-2\" type=\"user-picker\" [hasLabel]=\"hasLabel\"\r\n [multiple]=\"multiple\" [ngClass]=\"{'user-picker': !isReadOnly}\" [actionType]=\"!isReadOnly ? 'delete' : 'edit'\"\r\n [label]=\"labelTextReadMode\" [name]=\"field?.personName\" [value]=\"field?.personEmail\" [arrayList]=\"arrayList\">\r\n </app-info-item>\r\n</ng-container>\r\n\r\n<sat-popover #searchEmpPopover [hasBackdrop]=\"true\" verticalAlign=\"below\">\r\n <div class=\"default-popover p-3\">\r\n <ol class=\"px-3 m-0\">\r\n <li>{{i18n.translate('searchEmployeeTooltip_1')}}</li>\r\n <li>{{i18n.translate('searchEmployeeTooltip_2')}}</li>\r\n <li>{{i18n.translate('searchEmployeeTooltip_3')}}</li>\r\n <li>{{i18n.translate('searchEmployeeTooltip_4')}}</li>\r\n </ol>\r\n </div>\r\n</sat-popover>\r\n", styles: [".small-input~.btn{height:41px}:host{flex-grow:1}.agenda-list.inside .mat-list-item{display:flex;align-items:center;padding:0 1rem;background-color:#fff;border:1px solid silver;height:88px!important}.agenda-list.inside .mat-list-item:before{position:relative;left:auto;right:auto}.agenda-list .mat-list-item{height:66px!important;background-color:#d3d3d3;margin-bottom:1.5rem;cursor:move}.agenda-list .mat-list-item:hover:before{opacity:1}.agenda-list .mat-list-item:before{content:\"\\e928\";font-family:stc-font-icons;left:-1.5rem;color:#a9a9a9;position:absolute;font-size:1.5rem;opacity:0;transition:all .3s linear}[dir=rtl] .agenda-list .mat-list-item:before{left:auto;right:-1.5rem}.agenda-list .mat-list-item:last-child{margin-bottom:0}.example-list{width:500px;max-width:100%;border:solid 1px #ccc;min-height:60px;display:block;background:#fff;border-radius:0;overflow:hidden}.example-box{color:#000000de;display:flex;box-sizing:border-box;cursor:move;font-size:14px;position:relative;background-color:#f3f3f1;padding:18px;justify-content:space-between;align-items:flex-start;margin-top:10px;padding-inline-start:50px;border:0;flex-direction:column;width:100%}.example-box .user-info{display:flex;align-items:center}.example-box .user-info .drag-icon{position:absolute;left:18px;cursor:move}html[dir=rtl] .example-box .user-info .drag-icon{left:auto;right:18px}.example-box .user-info .prof-img{width:40px;height:40px;border-radius:50%;border:2px solid #fff;margin-inline-end:10px}.example-box .user-info label{font-size:13px;font-weight:500;color:#1d242d;flex-grow:1}.example-box .user-info label .title{display:block;color:#ff375e;font-size:9px}.example-box .user-info-reviewer{display:flex;gap:.5rem;width:calc(100% + 68px);padding:10px 15px;margin:10px 0 -18px -50px;background-color:#dde0e1}[dir=rtl] .example-box .user-info-reviewer{margin:10px -50px -18px 0}.example-box .user-info-reviewer .drag-icon{position:absolute;transform:translateY(-50%);cursor:move}.example-box .user-info-reviewer .reviewer-info{display:flex}.example-box .user-info-reviewer .reviewer-info .prof-img{width:20px;height:20px;border-radius:50%;border:1px solid #fff;margin:0 5px}.example-box .user-info-reviewer .reviewer-info label{font-size:11px;font-weight:500;color:#000;width:100px;margin-top:1px}.example-box .user-info-reviewer .reviewer-info label .title{display:block;color:#ff375e;font-size:11px}.example-box .user-info-reviewer span{color:#a54ee1;font-size:11px;padding:0;margin-bottom:0;display:block;text-align:start}.example-box .icon{width:30px;height:30px;background-color:#ff375e33;text-align:center;line-height:26px;cursor:pointer;flex-shrink:0}.cdk-drag-preview{box-sizing:border-box;border-radius:0;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f;overflow:hidden}.cdk-drag-preview .icon{display:none}.cdk-drag-placeholder{opacity:0}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.example-box:last-child{border:none}.example-list.cdk-drop-list-dragging .example-box:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}.n-content{max-width:700px;width:100%}.n-results{width:100%;border:0;counter-reset:section}.n-results .n-col{position:relative;background-color:#f3f3f1;padding:10px;justify-content:space-between;align-items:flex-start;margin-top:10px;padding-inline-start:50px;border:0;flex-direction:column;width:100%}.n-results .n-col:last-child{margin-bottom:30px}.n-results .n-col:after,.n-results .n-col:before{display:none}@media (max-width: 991px){.example-box .user-info:before{margin-inline-end:10px;flex-shrink:0}}@media (max-width: 767px){.n-col{padding-inline-start:40px}.n-col .user-info-reviewer span{margin-bottom:0}}@media (max-width: 321px){.n-results .n-col{flex-wrap:wrap;justify-content:center}.n-results .n-col .user-info{justify-content:center}.n-results .n-col .user-info:before{position:absolute;top:15px;left:15px}.n-results .n-col .user-info .prof-img{margin:0 10px 10px}.n-results .n-col .user-info label{width:100%;text-align:center}.n-results .n-col .icon{width:100%}}::ng-deep .default-popover{max-width:320px;right:-2.5rem!important}[dir=rtl] ::ng-deep .default-popover{left:-2.5rem!important;right:auto}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: MatAutocompleteModule }, { kind: "component", type: i1$5.MatAutocomplete, selector: "mat-autocomplete", inputs: ["aria-label", "aria-labelledby", "displayWith", "autoActiveFirstOption", "autoSelectActiveOption", "requireSelection", "panelWidth", "disableRipple", "class", "hideSingleSelectionIndicator"], outputs: ["optionSelected", "opened", "closed", "optionActivated"], exportAs: ["matAutocomplete"] }, { kind: "component", type: i4.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i1$5.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { 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"] }] });
|
|
4084
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: SearchEmployeeComponent, isStandalone: true, selector: "app-search-employee", inputs: { valueName: "valueName", label: "label", tooltip: "tooltip", className: "className", showLabel: "showLabel", optional: "optional", data: "data", floatLabel: "floatLabel", error: "error", showEdit: "showEdit", arrayList: "arrayList", isUniqueUsers: "isUniqueUsers" }, outputs: { selectedEmp: "selectedEmp", onInputChange: "onInputChange", editDirectManger: "editDirectManger", deleteDirectManger: "deleteDirectManger", emitedDeletedValue: "emitedDeletedValue" }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ng-container *ngIf=\"!isReadOnly\">\r\n <div class=\"d-flex justify-content-between mb-1\" *ngIf=\"hasLabel\">\r\n <span class=\"form-label mb-0\">\r\n {{labelTextWriteMode}}\r\n <ds-icon icon=\"info\" class=\"cursor-pointer\" [satPopoverAnchor]=\"searchEmpPopover\"\r\n ></ds-icon>\r\n <!-- (click)=\"searchEmpPopover.toggle(); $event.stopImmediatePropagation()\" -->\r\n </span>\r\n\r\n <span *ngIf=\"optional && !hideOption\" class=\"fs-11 fc-dark-gray\"> {{i18n.translate('Optional')}}\r\n </span>\r\n </div>\r\n <mat-form-field class=\"primary-form {{className}}\" [floatLabel]=\"floatLabel\">\r\n <mat-label>\r\n {{label}}\r\n </mat-label>\r\n <ds-icon matPrefix icon=\"search\" class=\"fc-coral fs-18\"></ds-icon>\r\n <label class=\"mat-form-content\">\r\n <input type=\"text\" aria-label=\"Number\" (input)=\"onLoadOptions($event)\" matInput [disabled]=\"disabled\"\r\n [formControl]=\"controller\" [matAutocomplete]=\"auto\">\r\n \r\n </label>\r\n <mat-error class=\"mb-2\" *ngIf=\"showErrorMessage\">{{errorMessage}}\r\n </mat-error>\r\n <span class=\"sfi sfi-spinner d-inline-block spin fc-coral\" matSuffix *ngIf=\"loading\"></span>\r\n <mat-autocomplete #auto=\"matAutocomplete\">\r\n <mat-option *ngFor=\"let option of data\" [value]=\"option?.['personName']\"\r\n (onSelectionChange)=\"selectOption(option , $event)\">\r\n <div class=\"d-flex align-items-center\">\r\n <div class=\"img-card circled-img small\">\r\n <img [src]=\"getImage(option?.email)\" onerror=\"this.onerror=null;this.src='assets/images/user.svg';\" alt=\"\">\r\n </div>\r\n <span class=\"mx-2\"></span>\r\n <div class=\"line-height-1\">\r\n <h6 class=\"fs-17 fw-medium fc-onyx mb-0 line-height-1\">{{option?.name}}</h6>\r\n <span class=\"fs-13 fw-normal fc-dark-gray\">\r\n {{option?.description}}\r\n </span>\r\n </div>\r\n </div>\r\n </mat-option>\r\n </mat-autocomplete>\r\n <mat-error class=\"mb-2\" *ngIf=\"(!controller?.valid)\">{{i18n.translate('validSearchError')}}{{label}}\r\n </mat-error>\r\n <mat-hint *ngIf=\"showHint\">\r\n <span class=\"sfi sfi-check-circle font-10 fc-dark-gray\" [ngClass]=\"{'fc-oasis-light-imp':value}\"></span>\r\n <span class=\"mx-1\"></span>\r\n <span class=\"fs-12 fc-onyx\">{{hint}}</span>\r\n </mat-hint>\r\n </mat-form-field>\r\n <mat-error class=\"mb-2\" *ngIf=\"showErrorMessage\">{{errorMessage}}\r\n </mat-error>\r\n\r\n <mat-error class=\"mb-2\" *ngIf=\"userAlreadyExist\">\r\n {{ i18n.translate('userAlreadyExist') }}\r\n </mat-error>\r\n\r\n <div class=\"col-12\" *ngIf=\"arrayList?.length && !isReadOnly && multiple\">\r\n <div class=\"example-list n-results\">\r\n <div class=\"example-box n-col px-3\" [ngClass]=\"{'mt-0': ind === 0}\"\r\n *ngFor=\"let emails of arrayList; let ind = index\">\r\n <div class=\"d-flex flex-grow-1 w-100\">\r\n <div class=\"user-info flex-grow-1\">\r\n <img [src]=\"getImage(emails?.personEmail)\" onerror=\"this.onerror=null;this.src='assets/images/user.svg';\"\r\n alt=\"\" class=\"prof-img\" draggable=\"false\">\r\n <label *ngIf=\"emails?.personName\">\r\n {{(emails?.personName)}}\r\n <span class=\"title\">\r\n {{emails?.personEmail}}\r\n </span>\r\n </label>\r\n </div>\r\n <ds-button class=\"ds-btn-action\" size=\"small\" *ngIf=\"!(isReadOnly)\" (click)=\"deleteRow(ind,emails)\" icon>\r\n <ds-icon icon=\"trash\" class=\"fc-red fs-20\"></ds-icon>\r\n </ds-button>\r\n\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n</ng-container>\r\n\r\n<ng-container *ngIf=\"(isReadOnly && (field?.personName || multiple))\">\r\n <app-info-item class=\"d-flex flex-wrap align-items-center info-item w-100 mb-2\" type=\"user-picker\" [hasLabel]=\"hasLabel\"\r\n [multiple]=\"multiple\" [ngClass]=\"{'user-picker': !isReadOnly}\" [actionType]=\"!isReadOnly ? 'delete' : 'edit'\"\r\n [label]=\"labelTextReadMode\" [name]=\"field?.personName\" [value]=\"field?.personEmail\" [arrayList]=\"arrayList\">\r\n </app-info-item>\r\n</ng-container>\r\n\r\n<sat-popover #searchEmpPopover [hasBackdrop]=\"true\" verticalAlign=\"below\">\r\n <div class=\"default-popover p-3\">\r\n <ol class=\"px-3 m-0\">\r\n <li>{{i18n.translate('searchEmployeeTooltip_1')}}</li>\r\n <li>{{i18n.translate('searchEmployeeTooltip_2')}}</li>\r\n <li>{{i18n.translate('searchEmployeeTooltip_3')}}</li>\r\n <li>{{i18n.translate('searchEmployeeTooltip_4')}}</li>\r\n </ol>\r\n </div>\r\n</sat-popover>\r\n", styles: [".small-input~.btn{height:41px}:host{flex-grow:1}.agenda-list.inside .mat-list-item{display:flex;align-items:center;padding:0 1rem;background-color:#fff;border:1px solid silver;height:88px!important}.agenda-list.inside .mat-list-item:before{position:relative;left:auto;right:auto}.agenda-list .mat-list-item{height:66px!important;background-color:#d3d3d3;margin-bottom:1.5rem;cursor:move}.agenda-list .mat-list-item:hover:before{opacity:1}.agenda-list .mat-list-item:before{content:\"\\e928\";font-family:stc-font-icons;left:-1.5rem;color:#a9a9a9;position:absolute;font-size:1.5rem;opacity:0;transition:all .3s linear}[dir=rtl] .agenda-list .mat-list-item:before{left:auto;right:-1.5rem}.agenda-list .mat-list-item:last-child{margin-bottom:0}.example-list{width:500px;max-width:100%;border:solid 1px #ccc;min-height:60px;display:block;background:#fff;border-radius:0;overflow:hidden}.example-box{color:#000000de;display:flex;box-sizing:border-box;cursor:move;font-size:14px;position:relative;background-color:#f3f3f1;padding:18px;justify-content:space-between;align-items:flex-start;margin-top:10px;padding-inline-start:50px;border:0;flex-direction:column;width:100%}.example-box .user-info{display:flex;align-items:center}.example-box .user-info .drag-icon{position:absolute;left:18px;cursor:move}html[dir=rtl] .example-box .user-info .drag-icon{left:auto;right:18px}.example-box .user-info .prof-img{width:40px;height:40px;border-radius:50%;border:2px solid #fff;margin-inline-end:10px}.example-box .user-info label{font-size:13px;font-weight:500;color:#1d242d;flex-grow:1}.example-box .user-info label .title{display:block;color:#ff375e;font-size:9px}.example-box .user-info-reviewer{display:flex;gap:.5rem;width:calc(100% + 68px);padding:10px 15px;margin:10px 0 -18px -50px;background-color:#dde0e1}[dir=rtl] .example-box .user-info-reviewer{margin:10px -50px -18px 0}.example-box .user-info-reviewer .drag-icon{position:absolute;transform:translateY(-50%);cursor:move}.example-box .user-info-reviewer .reviewer-info{display:flex}.example-box .user-info-reviewer .reviewer-info .prof-img{width:20px;height:20px;border-radius:50%;border:1px solid #fff;margin:0 5px}.example-box .user-info-reviewer .reviewer-info label{font-size:11px;font-weight:500;color:#000;width:100px;margin-top:1px}.example-box .user-info-reviewer .reviewer-info label .title{display:block;color:#ff375e;font-size:11px}.example-box .user-info-reviewer span{color:#a54ee1;font-size:11px;padding:0;margin-bottom:0;display:block;text-align:start}.example-box .icon{width:30px;height:30px;background-color:#ff375e33;text-align:center;line-height:26px;cursor:pointer;flex-shrink:0}.cdk-drag-preview{box-sizing:border-box;border-radius:0;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f;overflow:hidden}.cdk-drag-preview .icon{display:none}.cdk-drag-placeholder{opacity:0}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.example-box:last-child{border:none}.example-list.cdk-drop-list-dragging .example-box:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}.n-content{max-width:700px;width:100%}.n-results{width:100%;border:0;counter-reset:section}.n-results .n-col{position:relative;background-color:#f3f3f1;padding:10px;justify-content:space-between;align-items:flex-start;margin-top:10px;padding-inline-start:50px;border:0;flex-direction:column;width:100%}.n-results .n-col:last-child{margin-bottom:30px}.n-results .n-col:after,.n-results .n-col:before{display:none}@media (max-width: 991px){.example-box .user-info:before{margin-inline-end:10px;flex-shrink:0}}@media (max-width: 767px){.n-col{padding-inline-start:40px}.n-col .user-info-reviewer span{margin-bottom:0}}@media (max-width: 321px){.n-results .n-col{flex-wrap:wrap;justify-content:center}.n-results .n-col .user-info{justify-content:center}.n-results .n-col .user-info:before{position:absolute;top:15px;left:15px}.n-results .n-col .user-info .prof-img{margin:0 10px 10px}.n-results .n-col .user-info label{width:100%;text-align:center}.n-results .n-col .icon{width:100%}}::ng-deep .default-popover{max-width:320px;right:-2.5rem!important}[dir=rtl] ::ng-deep .default-popover{left:-2.5rem!important;right:auto}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: MatAutocompleteModule }, { kind: "component", type: i1$4.MatAutocomplete, selector: "mat-autocomplete", inputs: ["aria-label", "aria-labelledby", "displayWith", "autoActiveFirstOption", "autoSelectActiveOption", "requireSelection", "panelWidth", "disableRipple", "class", "hideSingleSelectionIndicator"], outputs: ["optionSelected", "opened", "closed", "optionActivated"], exportAs: ["matAutocomplete"] }, { kind: "component", type: i4.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i1$4.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { 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"] }] });
|
|
4068
4085
|
}
|
|
4069
4086
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SearchEmployeeComponent, decorators: [{
|
|
4070
4087
|
type: Component,
|
|
@@ -4403,7 +4420,7 @@ class ToggleButtonComponent extends BaseComponent {
|
|
|
4403
4420
|
});
|
|
4404
4421
|
}
|
|
4405
4422
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: ToggleButtonComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
4406
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: ToggleButtonComponent, isStandalone: true, selector: "app-toggle-button", inputs: { label: "label", tooltip: "tooltip", className: "className", showLabel: "showLabel", data: "data", error: "error", optionAr: "optionAr", optionEn: "optionEn", hasHint: "hasHint" }, outputs: { onChange: "onChange" }, usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"!isReadOnly\">\r\n <div class=\"d-flex justify-content-between mb-1\" *ngIf=\"hasLabel\">\r\n <span class=\"form-label mb-0\">{{label}}</span>\r\n <span *ngIf=\"!required\" class=\"fs-11 fc-dark-gray\"> {{i18n.translate('Optional')}}\r\n </span>\r\n </div>\r\n\r\n <mat-button-toggle-group class=\"mb-3 secondary-toggle\" [value]=\"field?.key\" id=\"{{name}}{{randomID}}\"\r\n name=\"{{name}}{{randomID}}\" aria-label=\"Font Style\" *ngIf=\"lov?.options\" [multiple]=\"multiple\">\r\n <mat-button-toggle *ngFor=\"let item of lov?.options\" [value]=\"item?.value\" (click)=\"emitSelectedValue(item); hasHint ? hintSection?.toggle() : null\" [satPopoverAnchor]=\"hintSection\">\r\n <span>\r\n {{item?.description}}\r\n </span>\r\n <sat-popover #hintSection [hasBackdrop]=\" true\" verticalAlign=\"below\">\r\n <div class=\"default-tooltip\">\r\n <p class=\"m-0\" [innerHTML]=\"i18n.translate(item?.value)\"></p>\r\n </div>\r\n </sat-popover>\r\n </mat-button-toggle>\r\n </mat-button-toggle-group>\r\n\r\n</ng-container>\r\n\r\n<ng-container *ngIf=\"isReadOnly && field?.value\">\r\n <app-info-item class=\"info-item w-100\" [insideTable]=\"insideTable\" [type]=\"'toggleBtn'\" [label]=\"label\" [value]=\"field?.value\"></app-info-item>\r\n</ng-container>\r\n", styles: [":host{flex-grow:1}\n"], dependencies: [{ kind: "directive", type: MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled", "disabledInteractive", "hideSingleSelectionIndicator", "hideMultipleSelectionIndicator"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }, { kind: "component", type: MatButtonToggle, selector: "mat-button-toggle", inputs: ["aria-label", "aria-labelledby", "id", "name", "value", "tabIndex", "disableRipple", "appearance", "checked", "disabled", "disabledInteractive"], outputs: ["change"], exportAs: ["matButtonToggle"] }, { kind: "ngmodule", type: SatPopoverModule }, { kind: "component", type: i1$
|
|
4423
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: ToggleButtonComponent, isStandalone: true, selector: "app-toggle-button", inputs: { label: "label", tooltip: "tooltip", className: "className", showLabel: "showLabel", data: "data", error: "error", optionAr: "optionAr", optionEn: "optionEn", hasHint: "hasHint" }, outputs: { onChange: "onChange" }, usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"!isReadOnly\">\r\n <div class=\"d-flex justify-content-between mb-1\" *ngIf=\"hasLabel\">\r\n <span class=\"form-label mb-0\">{{label}}</span>\r\n <span *ngIf=\"!required\" class=\"fs-11 fc-dark-gray\"> {{i18n.translate('Optional')}}\r\n </span>\r\n </div>\r\n\r\n <mat-button-toggle-group class=\"mb-3 secondary-toggle\" [value]=\"field?.key\" id=\"{{name}}{{randomID}}\"\r\n name=\"{{name}}{{randomID}}\" aria-label=\"Font Style\" *ngIf=\"lov?.options\" [multiple]=\"multiple\">\r\n <mat-button-toggle *ngFor=\"let item of lov?.options\" [value]=\"item?.value\" (click)=\"emitSelectedValue(item); hasHint ? hintSection?.toggle() : null\" [satPopoverAnchor]=\"hintSection\">\r\n <span>\r\n {{item?.description}}\r\n </span>\r\n <sat-popover #hintSection [hasBackdrop]=\" true\" verticalAlign=\"below\">\r\n <div class=\"default-tooltip\">\r\n <p class=\"m-0\" [innerHTML]=\"i18n.translate(item?.value)\"></p>\r\n </div>\r\n </sat-popover>\r\n </mat-button-toggle>\r\n </mat-button-toggle-group>\r\n\r\n</ng-container>\r\n\r\n<ng-container *ngIf=\"isReadOnly && field?.value\">\r\n <app-info-item class=\"info-item w-100\" [insideTable]=\"insideTable\" [type]=\"'toggleBtn'\" [label]=\"label\" [value]=\"field?.value\"></app-info-item>\r\n</ng-container>\r\n", styles: [":host{flex-grow:1}\n"], dependencies: [{ kind: "directive", type: MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled", "disabledInteractive", "hideSingleSelectionIndicator", "hideMultipleSelectionIndicator"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }, { kind: "component", type: MatButtonToggle, selector: "mat-button-toggle", inputs: ["aria-label", "aria-labelledby", "id", "name", "value", "tabIndex", "disableRipple", "appearance", "checked", "disabled", "disabledInteractive"], outputs: ["change"], exportAs: ["matButtonToggle"] }, { kind: "ngmodule", type: SatPopoverModule }, { kind: "component", type: i1$3.SatPopoverComponent, selector: "sat-popover", inputs: ["anchor", "horizontalAlign", "xAlign", "verticalAlign", "yAlign", "forceAlignment", "lockAlignment", "autoFocus", "restoreFocus", "scrollStrategy", "hasBackdrop", "interactiveClose", "openTransition", "closeTransition", "openAnimationStartAtScale", "closeAnimationEndAtScale", "backdropClass", "panelClass"], outputs: ["opened", "closed", "afterOpen", "afterClose", "backdropClicked", "overlayKeydown"] }, { kind: "directive", type: i1$3.SatPopoverAnchorDirective, selector: "[satPopoverAnchor]", inputs: ["satPopoverAnchor"], exportAs: ["satPopoverAnchor"] }, { kind: "component", type: InfoItemComponent, selector: "app-info-item", inputs: ["label", "value", "name", "type", "dateType", "multiple", "insideTable", "hasLabel", "arrayList", "actionType", "download"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
4407
4424
|
}
|
|
4408
4425
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: ToggleButtonComponent, decorators: [{
|
|
4409
4426
|
type: Component,
|
|
@@ -4447,7 +4464,7 @@ class RepeatedListComponent {
|
|
|
4447
4464
|
return "/group/i-gate/wm-bpm/forms/-/proxy/portrait?email=" + email;
|
|
4448
4465
|
}
|
|
4449
4466
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: RepeatedListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4450
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: RepeatedListComponent, isStandalone: true, selector: "app-repeated-list", inputs: { listOfItems: "listOfItems", type: "type" }, ngImport: i0, template: "<div class=\"{{type}}\">\r\n <ng-container *ngFor=\"let item of listOfItems; let i = index\">\r\n <div class=\"item\" *ngIf=\"i <= 1\">\r\n <span class=\"img-card circled-img x-small\" *ngIf=\"item.image\">\r\n <img [src]=\"item.image\" [alt]=\"item.personName\">\r\n </span>\r\n <span class=\"name font-12\">\r\n {{item.personName}}\r\n </span>\r\n </div>\r\n </ng-container>\r\n\r\n <span class=\"text-color-onyx font-14 font-weight-medium cursor-pointer more\" *ngIf=\"listOfItems.length > 2\"\r\n [satPopoverAnchor]=\"tooltipOfItems\" (mouseenter)=\"tooltipOfItems.open()\" (mouseleave)=\"tooltipOfItems.close()\">\r\n {{listOfItems.length - 2 !== 0 ? '+' + (listOfItems.length - 2) : ''}}\r\n </span>\r\n <sat-popover #tooltipOfItems horizontalAlign=\"center\" verticalAlign=\"above\">\r\n <div class=\"border bg-color-white\">\r\n <div class=\"d-flex align-items-center border-bottom p-2\" [ngClass]=\"{'border-0': last}\"\r\n *ngFor=\"let item of listOfItems; let i = index; let last = last\">\r\n <span class=\"img-card circled-img x-small\" *ngIf=\"item.image\">\r\n <img [src]=\"item.image\" [alt]=\"item.personName\">\r\n </span>\r\n <span class=\"mx-1\" *ngIf=\"item.image\"></span>\r\n <span class=\"name font-12\">\r\n {{item.personName}}\r\n </span>\r\n\r\n </div>\r\n </div>\r\n </sat-popover>\r\n\r\n\r\n</div>\r\n", styles: [""], dependencies: [{ kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: SatPopoverModule }, { kind: "component", type: i1$
|
|
4467
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: RepeatedListComponent, isStandalone: true, selector: "app-repeated-list", inputs: { listOfItems: "listOfItems", type: "type" }, ngImport: i0, template: "<div class=\"{{type}}\">\r\n <ng-container *ngFor=\"let item of listOfItems; let i = index\">\r\n <div class=\"item\" *ngIf=\"i <= 1\">\r\n <span class=\"img-card circled-img x-small\" *ngIf=\"item.image\">\r\n <img [src]=\"item.image\" [alt]=\"item.personName\">\r\n </span>\r\n <span class=\"name font-12\">\r\n {{item.personName}}\r\n </span>\r\n </div>\r\n </ng-container>\r\n\r\n <span class=\"text-color-onyx font-14 font-weight-medium cursor-pointer more\" *ngIf=\"listOfItems.length > 2\"\r\n [satPopoverAnchor]=\"tooltipOfItems\" (mouseenter)=\"tooltipOfItems.open()\" (mouseleave)=\"tooltipOfItems.close()\">\r\n {{listOfItems.length - 2 !== 0 ? '+' + (listOfItems.length - 2) : ''}}\r\n </span>\r\n <sat-popover #tooltipOfItems horizontalAlign=\"center\" verticalAlign=\"above\">\r\n <div class=\"border bg-color-white\">\r\n <div class=\"d-flex align-items-center border-bottom p-2\" [ngClass]=\"{'border-0': last}\"\r\n *ngFor=\"let item of listOfItems; let i = index; let last = last\">\r\n <span class=\"img-card circled-img x-small\" *ngIf=\"item.image\">\r\n <img [src]=\"item.image\" [alt]=\"item.personName\">\r\n </span>\r\n <span class=\"mx-1\" *ngIf=\"item.image\"></span>\r\n <span class=\"name font-12\">\r\n {{item.personName}}\r\n </span>\r\n\r\n </div>\r\n </div>\r\n </sat-popover>\r\n\r\n\r\n</div>\r\n", styles: [""], dependencies: [{ kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: SatPopoverModule }, { kind: "component", type: i1$3.SatPopoverComponent, selector: "sat-popover", inputs: ["anchor", "horizontalAlign", "xAlign", "verticalAlign", "yAlign", "forceAlignment", "lockAlignment", "autoFocus", "restoreFocus", "scrollStrategy", "hasBackdrop", "interactiveClose", "openTransition", "closeTransition", "openAnimationStartAtScale", "closeAnimationEndAtScale", "backdropClass", "panelClass"], outputs: ["opened", "closed", "afterOpen", "afterClose", "backdropClicked", "overlayKeydown"] }, { kind: "directive", type: i1$3.SatPopoverAnchorDirective, selector: "[satPopoverAnchor]", inputs: ["satPopoverAnchor"], exportAs: ["satPopoverAnchor"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
4451
4468
|
}
|
|
4452
4469
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: RepeatedListComponent, decorators: [{
|
|
4453
4470
|
type: Component,
|
|
@@ -4525,7 +4542,7 @@ class TableListComponent extends BaseComponent {
|
|
|
4525
4542
|
sentBack() {
|
|
4526
4543
|
}
|
|
4527
4544
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: TableListComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
4528
|
-
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$6.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]" }] });
|
|
4545
|
+
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]" }] });
|
|
4529
4546
|
}
|
|
4530
4547
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: TableListComponent, decorators: [{
|
|
4531
4548
|
type: Component,
|
|
@@ -4704,7 +4721,7 @@ class AttachmentSectionComponent extends BaseComponent {
|
|
|
4704
4721
|
onmouseleave = onmouseleave;
|
|
4705
4722
|
isNaN = isNaN;
|
|
4706
4723
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: AttachmentSectionComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
4707
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.8", type: AttachmentSectionComponent, isStandalone: true, selector: "app-attachment-section", inputs: { className: "className", attachments: "attachments", label: "label", attachmentsMax: "attachmentsMax", isSortable: "isSortable", downloadAll: "downloadAll", isRequired: "isRequired" }, viewQueries: [{ propertyName: "placeholderElement", first: true, predicate: ["placeholder"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"mt-2 p-0\">\r\n\r\n @if(hasLabel){\r\n <div class=\"d-flex justify-content-between mb-1\">\r\n <span class=\"form-label mb-0\">{{ label }}</span>\r\n </div>\r\n }\r\n \r\n @if(!isReadOnly){\r\n <div style=\"text-align-last: end\">\r\n @if(!required && !hideOption){\r\n <span class=\"fs-11 fc-dark-gray\">\r\n {{ i18n.translate(\"Optional\") }}\r\n </span>\r\n }\r\n </div>\r\n } @if(!attachments?.length && !isReadOnly){\r\n <section\r\n [ngClass]=\"insideTable ? 'file-uploader-table' : 'file-uploader'\"\r\n class=\"mb-2\"\r\n [class.insideTableStyle]=\"insideTable\"\r\n (click)=\"addAttahment(); $event.stopPropagation()\"\r\n >\r\n <div\r\n [ngClass]=\"insideTable ? 'file-uploader-table-dev' : ''\"\r\n class=\"file-uploader-input\"\r\n >\r\n <div class=\"icon mb-1\">\r\n <svg\r\n [ngClass]=\"insideTable ? 'file-uploader-table-svg' : ''\"\r\n width=\"41\"\r\n height=\"38\"\r\n viewBox=\"0 0 41 38\"\r\n fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n >\r\n <path\r\n d=\"M0 22.1947V20.6736C0.0971303 20.1019 0.070094 19.5141 0.276371 18.9533C1.28372 16.2086 3.21231 14.5023 6.0421 13.8094C6.70499 13.6472 6.68497 13.6632 6.69899 12.9843C6.73203 11.3321 6.99839 9.71992 7.62423 8.17986C8.86289 5.13678 10.9467 2.83969 13.8816 1.39175C17.168 -0.230424 20.5956 -0.450719 24.0553 0.81598C27.4929 2.07467 29.9622 4.41581 31.4802 7.74828C31.7786 8.40316 32.027 9.08307 32.1712 9.79202C32.2402 10.1315 32.4035 10.2566 32.7529 10.3107C36.7012 10.9165 39.3358 13.1255 40.6946 16.8735C40.9069 17.4603 40.9199 18.0731 40.9599 18.6829C40.9649 18.7601 40.9389 18.8442 41 18.9113V20.5124C40.9109 20.995 40.969 21.4937 40.8608 21.9734C40.5244 23.4614 39.8454 24.7821 38.8501 25.9297C37.4522 27.5418 35.7059 28.5882 33.6161 29.0519C32.791 29.2351 31.9499 29.2521 31.1117 29.2922C30.6571 29.3142 30.584 29.193 30.592 28.7484C30.6451 25.8446 29.802 23.2571 27.8624 21.0591C25.9979 18.9463 23.6597 17.7167 20.867 17.4012C18.8553 17.1739 16.9057 17.4593 15.0612 18.3395C11.8319 19.8816 9.81416 22.4069 8.96102 25.8696C8.74273 26.7538 8.68265 27.658 8.70568 28.5702C8.7217 29.2111 8.60254 29.3122 7.95968 29.2972C5.95098 29.2511 4.10551 28.7234 2.58146 27.3596C1.07644 26.0168 0.0680913 24.3996 0.0400537 22.3028C0.0400537 22.2607 0.0250336 22.2257 0 22.1937V22.1947Z\"\r\n fill=\"#DEE0E2\"\r\n />\r\n <path\r\n d=\"M29.0303 28.2632C29.0604 33.4031 24.8657 37.6187 19.6838 37.6548C14.5169 37.6908 10.2852 33.4952 10.2521 28.3042C10.2201 23.1403 14.4297 18.9126 19.6227 18.8946C24.8037 18.8766 28.9993 23.0542 29.0303 28.2632Z\"\r\n fill=\"#8E9AA0\"\r\n />\r\n <path\r\n d=\"M20.5573 25.2644C20.4622 25.4477 20.5012 25.5939 20.5012 25.734C20.4982 28.2154 20.5002 30.6957 20.4982 33.177C20.4982 33.8099 20.2339 34.1704 19.7462 34.2234C19.2645 34.2765 18.88 33.9831 18.8169 33.5025C18.7959 33.3443 18.7969 33.183 18.7969 33.0238C18.7959 30.5826 18.7969 28.1423 18.7969 25.701C18.7969 25.5728 18.7969 25.4447 18.7969 25.2003C18.1971 25.8031 17.6774 26.3288 17.1527 26.8505C17.0115 26.9907 16.8683 27.1349 16.7061 27.2471C16.3566 27.4864 15.9341 27.4413 15.6457 27.154C15.3643 26.8746 15.3203 26.442 15.5486 26.0925C15.6207 25.9824 15.7128 25.8832 15.8069 25.7891C16.8613 24.7307 17.9167 23.6733 18.9732 22.6179C19.4017 22.1893 19.8784 22.1763 20.3039 22.5988C21.3914 23.6803 22.4739 24.7667 23.5533 25.8572C23.9809 26.2898 24.0129 26.8065 23.6534 27.167C23.299 27.5214 22.7753 27.4844 22.3437 27.0568C21.7499 26.47 21.1661 25.8732 20.5603 25.2644H20.5573Z\"\r\n fill=\"#F9F9F9\"\r\n />\r\n </svg>\r\n </div>\r\n <div class=\"f-14 fc-black fw-normal\">\r\n <span class=\"fc-coral fw-medium\">{{ i18n.translate(\"browse\") }}</span>\r\n </div>\r\n <div class=\"fs-10 fc-dark-gray\">\r\n {{ i18n.translate(\"addMultiAttachments\") }}\r\n </div>\r\n </div>\r\n </section>\r\n }\r\n\r\n <!-- <ds-message class=\"full\" *ngIf=\"!attachments?.length && !isReadOnly\" label=\"{{i18n.translate('NoAttachments')}}\"></ds-message>-->\r\n @if(attachments?.length){\r\n <div\r\n class=\"table-responsive full\"\r\n cdkDropList\r\n [cdkDropListData]=\"attachments\"\r\n (cdkDropListDropped)=\"drop($event)\"\r\n>\r\n <table>\r\n <thead>\r\n <tr>\r\n @if(downloadAll){\r\n <th>\r\n <ds-button\r\n square\r\n icon\r\n size=\"small\"\r\n (click)=\"downloadAllAttachments($event)\"\r\n class=\"icon-btn-shadow\"\r\n >\r\n <ds-icon\r\n icon=\"download\"\r\n class=\"fs-20 fs-md-17 fc-purple\"\r\n ></ds-icon>\r\n </ds-button>\r\n <a #placeholder></a>\r\n </th>\r\n }\r\n <th class=\"width30\">{{ i18n.translate(\"FileName\") }}</th>\r\n <th>{{ i18n.translate(\"FileDescription\") }}</th>\r\n <th>{{ i18n.translate(\"comment\") }}</th>\r\n @if(!isReadOnly){\r\n <th></th>\r\n }\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr\r\n *ngFor=\"let data of attachments; index as i\"\r\n cdkDrag\r\n [cdkDragDisabled]=\"\r\n attachments?.length == 0 || (!isSortable && !isReadOnly)\r\n \"\r\n >\r\n @if(downloadAll){\r\n <td>{{ i + 1 }}</td>\r\n }\r\n <td>\r\n <app-file-uploader\r\n [allowedExtensions]=\"allowedExtensions\"\r\n class=\"white-attached\"\r\n [field]=\"data\"\r\n name=\"attachment\"\r\n [hasLabel]=\"false\"\r\n [showActions]=\"true\"\r\n [isReadOnly]=\"true\"\r\n >\r\n </app-file-uploader>\r\n </td>\r\n <td class=\"maxWidth px-2\">\r\n <!-- (mouseover)=\"isSortable ? fileDescriptionAnchor.popover.open():$event.stopPropagation();\"-->\r\n <a\r\n class=\"fw-medium fc-black underline cursor-pointer fs-12\"\r\n [hidden]=\"!data?.fileDescription\"\r\n (click)=\"\r\n $event.stopPropagation(); fileDescriptionAnchor.popover.open()\r\n \"\r\n [satPopoverAnchor]=\"fileDescriptionPopover\"\r\n #fileDescriptionAnchor=\"satPopoverAnchor\"\r\n [matTooltip]=\"data?.fileDescription\"\r\n >\r\n {{ data?.fileDescription | slice : 0 : 10 }}....\r\n </a>\r\n <!-- {{ i18n.translate('View') }}-->\r\n <sat-popover\r\n #fileDescriptionPopover\r\n [anchor]=\"fileDescriptionAnchor\"\r\n [hasBackdrop]=\"true\"\r\n [restoreFocus]=\"false\"\r\n verticalAlign=\"below\"\r\n horizontalAlign=\"center\"\r\n >\r\n <div\r\n class=\"default-popover p-3 fs-14 text-break view-note-popover\"\r\n >\r\n <bdi class=\"fc-black\">\r\n {{ data?.fileDescription }}\r\n </bdi>\r\n </div>\r\n </sat-popover>\r\n </td>\r\n <td class=\"maxWidth px-2\">\r\n <!-- (mouseover)=\"isSortable ? commentsAnchor.popover.open():$event.stopPropagation();\"-->\r\n <a\r\n class=\"fw-medium fc-black underline cursor-pointer fs-12\"\r\n [hidden]=\"!data?.attachmentcomment\"\r\n (click)=\"$event.stopPropagation(); commentsAnchor.popover.open()\"\r\n [satPopoverAnchor]=\"commentsPopover\"\r\n [matTooltip]=\"data?.attachmentcomment\"\r\n #commentsAnchor=\"satPopoverAnchor\"\r\n >\r\n {{ data?.attachmentcomment | slice : 0 : 10 }}...\r\n </a>\r\n <!-- {{ i18n.translate('View') }}-->\r\n <sat-popover\r\n #commentsPopover\r\n [anchor]=\"commentsAnchor\"\r\n [hasBackdrop]=\"true\"\r\n [restoreFocus]=\"false\"\r\n verticalAlign=\"below\"\r\n horizontalAlign=\"center\"\r\n >\r\n <div\r\n class=\"default-popover p-3 fs-14 text-break view-note-popover\"\r\n >\r\n <bdi class=\"fc-black\">\r\n {{ data?.attachmentcomment }}\r\n </bdi>\r\n </div>\r\n </sat-popover>\r\n </td>\r\n @if(!isReadOnly){\r\n <td>\r\n <div class=\"d-flex gap-2\">\r\n <ds-button\r\n square\r\n icon\r\n size=\"small\"\r\n (click)=\"deleteAttachments(i, data)\"\r\n class=\"icon-btn-shadow\"\r\n >\r\n <ds-icon icon=\"trash\" class=\"fs-20 fs-md-17 fc-red\"></ds-icon>\r\n </ds-button>\r\n\r\n <ds-button\r\n square\r\n icon\r\n size=\"small\"\r\n (click)=\"editRow(data, i)\"\r\n class=\"icon-btn-shadow\"\r\n >\r\n <ds-icon icon=\"pen\" class=\"fs-20 fs-md-17 fc-purple\"></ds-icon>\r\n </ds-button>\r\n </div>\r\n </td>\r\n }\r\n </tr>\r\n </tbody>\r\n </table>\r\n</div>\r\n }\r\n\r\n @if(!isReadOnly && attachments?.length && attachments?.length < attachmentsMax){\r\n <div\r\n class=\"text-center full mt-3\"\r\n>\r\n <ds-button\r\n shape=\"{{ attachments?.length ? 'outline' : '' }}\"\r\n [ngClass]=\"{ 'full-add-btn w-100': attachments?.length }\"\r\n (click)=\"addAttahment(); $event.stopPropagation()\"\r\n >\r\n <ds-icon slot=\"prefix\" icon=\"plus\" class=\"fs-22\"></ds-icon>\r\n {{ i18n.translate(\"addAttachments\") }}\r\n </ds-button>\r\n</div>\r\n }\r\n \r\n</div>\r\n", styles: ["::ng-deep .add-attachment-dialog{--popup-max-width: 500px;--popup-width: 100%}::ng-deep .view-note-popover{max-width:250px;max-height:300px;overflow:auto;--popover-bc: var(--black);color:var(--white);--popover-before-width: .6rem}::ng-deep .mat-tooltip{max-width:500px;background:#1d252d}:host ::ng-deep .table-responsive table{--th-bg: var(--white);--th-fc: var(--dark-gray)}:host ::ng-deep .white-attached ds-attachments::part(base){--file-bg: transparent}:host ::ng-deep .full-add-btn::part(base){--btn-min-width: 100%;--btn-bg-color: var(--light-gray);--btn-height: 70px;--btn-radius: 6px;border:1px dashed var(--dark-gray)}.file-uploader{--uploader-height: 150px;--uploader-width: 100%;--uploader-bg: var(--off-white);--uploader-border: 1px dashed var(--dark-gray);--uploader-radius: var(--box-radius);--uploader-padding: 1rem;height:var(--uploader-height);background-color:var(--uploader-bg);border:var(--uploader-border);border-radius:var(--uploader-radius);padding:var(--uploader-padding);text-align:center;cursor:pointer}.insideTableWidth{width:250px!important}.file-uploader-table{--uploader-height: 45PX;--uploader-width: 100%;--uploader-bg: var(--off-white);--uploader-border: 1px dashed var(--dark-gray);--uploader-radius: var(--box-radius);--uploader-padding: 0 1rem;height:var(--uploader-height);background-color:var(--uploader-bg);border:var(--uploader-border);border-radius:var(--uploader-radius);padding:var(--uploader-padding);text-align:center;cursor:pointer;DISPLAY:FLEX;ALIGN-ITEMS:CENTER;JUSTIFY-CONTENT:CENTER}.file-uploader-table-dev{DISPLAY:FLEX;ALIGN-ITEMS:CENTER;GAP:1REM}.file-uploader-table-svg{width:70%}.insideTableStyle{width:272px}.files-list{--file-item-width: 300px;display:grid;grid-template-columns:repeat(auto-fill,var(--file-item-width));grid-gap:.5rem}@media (max-width: 768px){.files-list{grid-template-columns:repeat(auto-fill,minmax(var(--file-item-width),1fr))}}.files-list .file-item-container .uploaded-file-actions{margin-inline-start:20px}.files-list .file-item-container .uploaded-file-actions .button__wrapper{font-size:15px}.files-list .file-item-container .file-item{--file-bg: var(--off-white);--file-radius: var(--box-radius);--icon-color: var(--purple);--icon-size: 2rem;--file-border: transparent;display:flex;align-items:center;background-color:var(--file-bg);border:1px solid var(--file-border);border-radius:var(--file-radius);padding:0 1rem;height:70px;gap:.75rem}.files-list .file-item-container .file-item.error{--file-bg: rgba(var(--rgb-red), 10%);--file-border: var(--red);--icon-color: var(--red)}.files-list .file-item-container .file-item .icon{color:var(--icon-color);font-size:var(--icon-size)}.files-list .file-item-container .file-item .file-action{display:flex;align-items:center;gap:.5rem}ds-attachments::part(base){--file-width: 250px}.file-item-container-actions{display:flex;align-items:center}.file-item-container-actions .uploaded-file-actions{display:flex;align-items:center;gap:10px;margin-inline-start:25px}.file-item-container-actions .uploaded-file-actions .button__wrapper{font-size:15px}::ng-deep .file-item .name-size{display:flex;flex-direction:column;justify-content:center;flex-grow:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:120px}\n"], dependencies: [{ kind: "ngmodule", type: SatPopoverModule }, { kind: "component", type: i1$4.SatPopoverComponent, selector: "sat-popover", inputs: ["anchor", "horizontalAlign", "xAlign", "verticalAlign", "yAlign", "forceAlignment", "lockAlignment", "autoFocus", "restoreFocus", "scrollStrategy", "hasBackdrop", "interactiveClose", "openTransition", "closeTransition", "openAnimationStartAtScale", "closeAnimationEndAtScale", "backdropClass", "panelClass"], outputs: ["opened", "closed", "afterOpen", "afterClose", "backdropClicked", "overlayKeydown"] }, { kind: "directive", type: i1$4.SatPopoverAnchorDirective, selector: "[satPopoverAnchor]", inputs: ["satPopoverAnchor"], exportAs: ["satPopoverAnchor"] }, { kind: "directive", type: MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "component", type: DocsUploaderComponent, selector: "app-file-uploader", inputs: ["useCrop", "formKey", "showLabel", "downloadLink", "showActions", "styleHeight", "fileInputHeight", "styleWidth", "hints", "label", "callApi", "tooltip", "attachments", "optional", "display", "attachType", "error", "displayedFiles", "getDataFromTemplate", "allowFileContentsWithMultiAttachments", "accept", "signType", "showSignButton", "printType", "showPrintButton", "downloadType", "showDownloadButton", "preventFileContents", "maxSize"], outputs: ["selectedTemplateAttachment", "addSignatureClicked", "printActionClicked", "downloadActionClicked"] }, { kind: "directive", type: CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "pipe", type: SlicePipe, name: "slice" }, { kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
|
|
4724
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.8", type: AttachmentSectionComponent, isStandalone: true, selector: "app-attachment-section", inputs: { className: "className", attachments: "attachments", label: "label", attachmentsMax: "attachmentsMax", isSortable: "isSortable", downloadAll: "downloadAll", isRequired: "isRequired" }, viewQueries: [{ propertyName: "placeholderElement", first: true, predicate: ["placeholder"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"mt-2 p-0\">\r\n\r\n @if(hasLabel){\r\n <div class=\"d-flex justify-content-between mb-1\">\r\n <span class=\"form-label mb-0\">{{ label }}</span>\r\n </div>\r\n }\r\n \r\n @if(!isReadOnly){\r\n <div style=\"text-align-last: end\">\r\n @if(!required && !hideOption){\r\n <span class=\"fs-11 fc-dark-gray\">\r\n {{ i18n.translate(\"Optional\") }}\r\n </span>\r\n }\r\n </div>\r\n } @if(!attachments?.length && !isReadOnly){\r\n <section\r\n [ngClass]=\"insideTable ? 'file-uploader-table' : 'file-uploader'\"\r\n class=\"mb-2\"\r\n [class.insideTableStyle]=\"insideTable\"\r\n (click)=\"addAttahment(); $event.stopPropagation()\"\r\n >\r\n <div\r\n [ngClass]=\"insideTable ? 'file-uploader-table-dev' : ''\"\r\n class=\"file-uploader-input\"\r\n >\r\n <div class=\"icon mb-1\">\r\n <svg\r\n [ngClass]=\"insideTable ? 'file-uploader-table-svg' : ''\"\r\n width=\"41\"\r\n height=\"38\"\r\n viewBox=\"0 0 41 38\"\r\n fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n >\r\n <path\r\n d=\"M0 22.1947V20.6736C0.0971303 20.1019 0.070094 19.5141 0.276371 18.9533C1.28372 16.2086 3.21231 14.5023 6.0421 13.8094C6.70499 13.6472 6.68497 13.6632 6.69899 12.9843C6.73203 11.3321 6.99839 9.71992 7.62423 8.17986C8.86289 5.13678 10.9467 2.83969 13.8816 1.39175C17.168 -0.230424 20.5956 -0.450719 24.0553 0.81598C27.4929 2.07467 29.9622 4.41581 31.4802 7.74828C31.7786 8.40316 32.027 9.08307 32.1712 9.79202C32.2402 10.1315 32.4035 10.2566 32.7529 10.3107C36.7012 10.9165 39.3358 13.1255 40.6946 16.8735C40.9069 17.4603 40.9199 18.0731 40.9599 18.6829C40.9649 18.7601 40.9389 18.8442 41 18.9113V20.5124C40.9109 20.995 40.969 21.4937 40.8608 21.9734C40.5244 23.4614 39.8454 24.7821 38.8501 25.9297C37.4522 27.5418 35.7059 28.5882 33.6161 29.0519C32.791 29.2351 31.9499 29.2521 31.1117 29.2922C30.6571 29.3142 30.584 29.193 30.592 28.7484C30.6451 25.8446 29.802 23.2571 27.8624 21.0591C25.9979 18.9463 23.6597 17.7167 20.867 17.4012C18.8553 17.1739 16.9057 17.4593 15.0612 18.3395C11.8319 19.8816 9.81416 22.4069 8.96102 25.8696C8.74273 26.7538 8.68265 27.658 8.70568 28.5702C8.7217 29.2111 8.60254 29.3122 7.95968 29.2972C5.95098 29.2511 4.10551 28.7234 2.58146 27.3596C1.07644 26.0168 0.0680913 24.3996 0.0400537 22.3028C0.0400537 22.2607 0.0250336 22.2257 0 22.1937V22.1947Z\"\r\n fill=\"#DEE0E2\"\r\n />\r\n <path\r\n d=\"M29.0303 28.2632C29.0604 33.4031 24.8657 37.6187 19.6838 37.6548C14.5169 37.6908 10.2852 33.4952 10.2521 28.3042C10.2201 23.1403 14.4297 18.9126 19.6227 18.8946C24.8037 18.8766 28.9993 23.0542 29.0303 28.2632Z\"\r\n fill=\"#8E9AA0\"\r\n />\r\n <path\r\n d=\"M20.5573 25.2644C20.4622 25.4477 20.5012 25.5939 20.5012 25.734C20.4982 28.2154 20.5002 30.6957 20.4982 33.177C20.4982 33.8099 20.2339 34.1704 19.7462 34.2234C19.2645 34.2765 18.88 33.9831 18.8169 33.5025C18.7959 33.3443 18.7969 33.183 18.7969 33.0238C18.7959 30.5826 18.7969 28.1423 18.7969 25.701C18.7969 25.5728 18.7969 25.4447 18.7969 25.2003C18.1971 25.8031 17.6774 26.3288 17.1527 26.8505C17.0115 26.9907 16.8683 27.1349 16.7061 27.2471C16.3566 27.4864 15.9341 27.4413 15.6457 27.154C15.3643 26.8746 15.3203 26.442 15.5486 26.0925C15.6207 25.9824 15.7128 25.8832 15.8069 25.7891C16.8613 24.7307 17.9167 23.6733 18.9732 22.6179C19.4017 22.1893 19.8784 22.1763 20.3039 22.5988C21.3914 23.6803 22.4739 24.7667 23.5533 25.8572C23.9809 26.2898 24.0129 26.8065 23.6534 27.167C23.299 27.5214 22.7753 27.4844 22.3437 27.0568C21.7499 26.47 21.1661 25.8732 20.5603 25.2644H20.5573Z\"\r\n fill=\"#F9F9F9\"\r\n />\r\n </svg>\r\n </div>\r\n <div class=\"f-14 fc-black fw-normal\">\r\n <span class=\"fc-coral fw-medium\">{{ i18n.translate(\"browse\") }}</span>\r\n </div>\r\n <div class=\"fs-10 fc-dark-gray\">\r\n {{ i18n.translate(\"addMultiAttachments\") }}\r\n </div>\r\n </div>\r\n </section>\r\n }\r\n\r\n <!-- <ds-message class=\"full\" *ngIf=\"!attachments?.length && !isReadOnly\" label=\"{{i18n.translate('NoAttachments')}}\"></ds-message>-->\r\n @if(attachments?.length){\r\n <div\r\n class=\"table-responsive full\"\r\n cdkDropList\r\n [cdkDropListData]=\"attachments\"\r\n (cdkDropListDropped)=\"drop($event)\"\r\n>\r\n <table>\r\n <thead>\r\n <tr>\r\n @if(downloadAll){\r\n <th>\r\n <ds-button\r\n square\r\n icon\r\n size=\"small\"\r\n (click)=\"downloadAllAttachments($event)\"\r\n class=\"icon-btn-shadow\"\r\n >\r\n <ds-icon\r\n icon=\"download\"\r\n class=\"fs-20 fs-md-17 fc-purple\"\r\n ></ds-icon>\r\n </ds-button>\r\n <a #placeholder></a>\r\n </th>\r\n }\r\n <th class=\"width30\">{{ i18n.translate(\"FileName\") }}</th>\r\n <th>{{ i18n.translate(\"FileDescription\") }}</th>\r\n <th>{{ i18n.translate(\"comment\") }}</th>\r\n @if(!isReadOnly){\r\n <th></th>\r\n }\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr\r\n *ngFor=\"let data of attachments; index as i\"\r\n cdkDrag\r\n [cdkDragDisabled]=\"\r\n attachments?.length == 0 || (!isSortable && !isReadOnly)\r\n \"\r\n >\r\n @if(downloadAll){\r\n <td>{{ i + 1 }}</td>\r\n }\r\n <td>\r\n <app-file-uploader\r\n [allowedExtensions]=\"allowedExtensions\"\r\n class=\"white-attached\"\r\n [field]=\"data\"\r\n name=\"attachment\"\r\n [hasLabel]=\"false\"\r\n [showActions]=\"true\"\r\n [isReadOnly]=\"true\"\r\n >\r\n </app-file-uploader>\r\n </td>\r\n <td class=\"maxWidth px-2\">\r\n <!-- (mouseover)=\"isSortable ? fileDescriptionAnchor.popover.open():$event.stopPropagation();\"-->\r\n <a\r\n class=\"fw-medium fc-black underline cursor-pointer fs-12\"\r\n [hidden]=\"!data?.fileDescription\"\r\n (click)=\"\r\n $event.stopPropagation(); fileDescriptionAnchor.popover.open()\r\n \"\r\n [satPopoverAnchor]=\"fileDescriptionPopover\"\r\n #fileDescriptionAnchor=\"satPopoverAnchor\"\r\n [matTooltip]=\"data?.fileDescription\"\r\n >\r\n {{ data?.fileDescription | slice : 0 : 10 }}....\r\n </a>\r\n <!-- {{ i18n.translate('View') }}-->\r\n <sat-popover\r\n #fileDescriptionPopover\r\n [anchor]=\"fileDescriptionAnchor\"\r\n [hasBackdrop]=\"true\"\r\n [restoreFocus]=\"false\"\r\n verticalAlign=\"below\"\r\n horizontalAlign=\"center\"\r\n >\r\n <div\r\n class=\"default-popover p-3 fs-14 text-break view-note-popover\"\r\n >\r\n <bdi class=\"fc-black\">\r\n {{ data?.fileDescription }}\r\n </bdi>\r\n </div>\r\n </sat-popover>\r\n </td>\r\n <td class=\"maxWidth px-2\">\r\n <!-- (mouseover)=\"isSortable ? commentsAnchor.popover.open():$event.stopPropagation();\"-->\r\n <a\r\n class=\"fw-medium fc-black underline cursor-pointer fs-12\"\r\n [hidden]=\"!data?.attachmentcomment\"\r\n (click)=\"$event.stopPropagation(); commentsAnchor.popover.open()\"\r\n [satPopoverAnchor]=\"commentsPopover\"\r\n [matTooltip]=\"data?.attachmentcomment\"\r\n #commentsAnchor=\"satPopoverAnchor\"\r\n >\r\n {{ data?.attachmentcomment | slice : 0 : 10 }}...\r\n </a>\r\n <!-- {{ i18n.translate('View') }}-->\r\n <sat-popover\r\n #commentsPopover\r\n [anchor]=\"commentsAnchor\"\r\n [hasBackdrop]=\"true\"\r\n [restoreFocus]=\"false\"\r\n verticalAlign=\"below\"\r\n horizontalAlign=\"center\"\r\n >\r\n <div\r\n class=\"default-popover p-3 fs-14 text-break view-note-popover\"\r\n >\r\n <bdi class=\"fc-black\">\r\n {{ data?.attachmentcomment }}\r\n </bdi>\r\n </div>\r\n </sat-popover>\r\n </td>\r\n @if(!isReadOnly){\r\n <td>\r\n <div class=\"d-flex gap-2\">\r\n <ds-button\r\n square\r\n icon\r\n size=\"small\"\r\n (click)=\"deleteAttachments(i, data)\"\r\n class=\"icon-btn-shadow\"\r\n >\r\n <ds-icon icon=\"trash\" class=\"fs-20 fs-md-17 fc-red\"></ds-icon>\r\n </ds-button>\r\n\r\n <ds-button\r\n square\r\n icon\r\n size=\"small\"\r\n (click)=\"editRow(data, i)\"\r\n class=\"icon-btn-shadow\"\r\n >\r\n <ds-icon icon=\"pen\" class=\"fs-20 fs-md-17 fc-purple\"></ds-icon>\r\n </ds-button>\r\n </div>\r\n </td>\r\n }\r\n </tr>\r\n </tbody>\r\n </table>\r\n</div>\r\n }\r\n\r\n @if(!isReadOnly && attachments?.length && attachments?.length < attachmentsMax){\r\n <div\r\n class=\"text-center full mt-3\"\r\n>\r\n <ds-button\r\n shape=\"{{ attachments?.length ? 'outline' : '' }}\"\r\n [ngClass]=\"{ 'full-add-btn w-100': attachments?.length }\"\r\n (click)=\"addAttahment(); $event.stopPropagation()\"\r\n >\r\n <ds-icon slot=\"prefix\" icon=\"plus\" class=\"fs-22\"></ds-icon>\r\n {{ i18n.translate(\"addAttachments\") }}\r\n </ds-button>\r\n</div>\r\n }\r\n \r\n</div>\r\n", styles: ["::ng-deep .add-attachment-dialog{--popup-max-width: 500px;--popup-width: 100%}::ng-deep .view-note-popover{max-width:250px;max-height:300px;overflow:auto;--popover-bc: var(--black);color:var(--white);--popover-before-width: .6rem}::ng-deep .mat-tooltip{max-width:500px;background:#1d252d}:host ::ng-deep .table-responsive table{--th-bg: var(--white);--th-fc: var(--dark-gray)}:host ::ng-deep .white-attached ds-attachments::part(base){--file-bg: transparent}:host ::ng-deep .full-add-btn::part(base){--btn-min-width: 100%;--btn-bg-color: var(--light-gray);--btn-height: 70px;--btn-radius: 6px;border:1px dashed var(--dark-gray)}.file-uploader{--uploader-height: 150px;--uploader-width: 100%;--uploader-bg: var(--off-white);--uploader-border: 1px dashed var(--dark-gray);--uploader-radius: var(--box-radius);--uploader-padding: 1rem;height:var(--uploader-height);background-color:var(--uploader-bg);border:var(--uploader-border);border-radius:var(--uploader-radius);padding:var(--uploader-padding);text-align:center;cursor:pointer}.insideTableWidth{width:250px!important}.file-uploader-table{--uploader-height: 45PX;--uploader-width: 100%;--uploader-bg: var(--off-white);--uploader-border: 1px dashed var(--dark-gray);--uploader-radius: var(--box-radius);--uploader-padding: 0 1rem;height:var(--uploader-height);background-color:var(--uploader-bg);border:var(--uploader-border);border-radius:var(--uploader-radius);padding:var(--uploader-padding);text-align:center;cursor:pointer;DISPLAY:FLEX;ALIGN-ITEMS:CENTER;JUSTIFY-CONTENT:CENTER}.file-uploader-table-dev{DISPLAY:FLEX;ALIGN-ITEMS:CENTER;GAP:1REM}.file-uploader-table-svg{width:70%}.insideTableStyle{width:272px}.files-list{--file-item-width: 300px;display:grid;grid-template-columns:repeat(auto-fill,var(--file-item-width));grid-gap:.5rem}@media (max-width: 768px){.files-list{grid-template-columns:repeat(auto-fill,minmax(var(--file-item-width),1fr))}}.files-list .file-item-container .uploaded-file-actions{margin-inline-start:20px}.files-list .file-item-container .uploaded-file-actions .button__wrapper{font-size:15px}.files-list .file-item-container .file-item{--file-bg: var(--off-white);--file-radius: var(--box-radius);--icon-color: var(--purple);--icon-size: 2rem;--file-border: transparent;display:flex;align-items:center;background-color:var(--file-bg);border:1px solid var(--file-border);border-radius:var(--file-radius);padding:0 1rem;height:70px;gap:.75rem}.files-list .file-item-container .file-item.error{--file-bg: rgba(var(--rgb-red), 10%);--file-border: var(--red);--icon-color: var(--red)}.files-list .file-item-container .file-item .icon{color:var(--icon-color);font-size:var(--icon-size)}.files-list .file-item-container .file-item .file-action{display:flex;align-items:center;gap:.5rem}ds-attachments::part(base){--file-width: 250px}.file-item-container-actions{display:flex;align-items:center}.file-item-container-actions .uploaded-file-actions{display:flex;align-items:center;gap:10px;margin-inline-start:25px}.file-item-container-actions .uploaded-file-actions .button__wrapper{font-size:15px}::ng-deep .file-item .name-size{display:flex;flex-direction:column;justify-content:center;flex-grow:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:120px}\n"], dependencies: [{ kind: "ngmodule", type: SatPopoverModule }, { kind: "component", type: i1$3.SatPopoverComponent, selector: "sat-popover", inputs: ["anchor", "horizontalAlign", "xAlign", "verticalAlign", "yAlign", "forceAlignment", "lockAlignment", "autoFocus", "restoreFocus", "scrollStrategy", "hasBackdrop", "interactiveClose", "openTransition", "closeTransition", "openAnimationStartAtScale", "closeAnimationEndAtScale", "backdropClass", "panelClass"], outputs: ["opened", "closed", "afterOpen", "afterClose", "backdropClicked", "overlayKeydown"] }, { kind: "directive", type: i1$3.SatPopoverAnchorDirective, selector: "[satPopoverAnchor]", inputs: ["satPopoverAnchor"], exportAs: ["satPopoverAnchor"] }, { kind: "directive", type: MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "component", type: DocsUploaderComponent, selector: "app-file-uploader", inputs: ["useCrop", "formKey", "showLabel", "downloadLink", "showActions", "styleHeight", "fileInputHeight", "styleWidth", "hints", "label", "callApi", "tooltip", "attachments", "optional", "display", "attachType", "error", "displayedFiles", "getDataFromTemplate", "allowFileContentsWithMultiAttachments", "accept", "signType", "showSignButton", "printType", "showPrintButton", "downloadType", "showDownloadButton", "preventFileContents", "maxSize"], outputs: ["selectedTemplateAttachment", "addSignatureClicked", "printActionClicked", "downloadActionClicked"] }, { kind: "directive", type: CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "pipe", type: SlicePipe, name: "slice" }, { kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
|
|
4708
4725
|
}
|
|
4709
4726
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: AttachmentSectionComponent, decorators: [{
|
|
4710
4727
|
type: Component,
|
|
@@ -4937,7 +4954,7 @@ class ApprovalsWorkflowComponent {
|
|
|
4937
4954
|
this.coreService.approvals = JSON.stringify(this.approvals);
|
|
4938
4955
|
this.sidenavService.publish('open', ApprovalsComponent);
|
|
4939
4956
|
}
|
|
4940
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: ApprovalsWorkflowComponent, deps: [{ token: CoreI18nService }, { token: SidenavService }, { token: CoreService }, { token: i3$
|
|
4957
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: ApprovalsWorkflowComponent, deps: [{ token: CoreI18nService }, { token: SidenavService }, { token: CoreService }, { token: i3$2.ToastrService }], target: i0.ɵɵFactoryTarget.Component });
|
|
4941
4958
|
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 }] });
|
|
4942
4959
|
}
|
|
4943
4960
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: ApprovalsWorkflowComponent, decorators: [{
|
|
@@ -4946,7 +4963,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImpor
|
|
|
4946
4963
|
SatPopoverModule,
|
|
4947
4964
|
NgIf
|
|
4948
4965
|
], 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"] }]
|
|
4949
|
-
}], ctorParameters: () => [{ type: CoreI18nService }, { type: SidenavService }, { type: CoreService }, { type: i3$
|
|
4966
|
+
}], ctorParameters: () => [{ type: CoreI18nService }, { type: SidenavService }, { type: CoreService }, { type: i3$2.ToastrService }], propDecorators: { section: [{
|
|
4950
4967
|
type: Input
|
|
4951
4968
|
}], form: [{
|
|
4952
4969
|
type: Input
|
|
@@ -5045,7 +5062,7 @@ class ActionButtonsComponent {
|
|
|
5045
5062
|
}
|
|
5046
5063
|
return '';
|
|
5047
5064
|
}
|
|
5048
|
-
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: i3$
|
|
5065
|
+
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: i3$2.ToastrService }, { token: i0.ChangeDetectorRef }, { token: SidenavService }], target: i0.ɵɵFactoryTarget.Component });
|
|
5049
5066
|
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"] }] });
|
|
5050
5067
|
}
|
|
5051
5068
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: ActionButtonsComponent, decorators: [{
|
|
@@ -5057,7 +5074,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImpor
|
|
|
5057
5074
|
NgForOf,
|
|
5058
5075
|
ApprovalsWorkflowComponent
|
|
5059
5076
|
], 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" }]
|
|
5060
|
-
}], ctorParameters: () => [{ type: CoreI18nService }, { type: ActionStateService }, { type: CoreService }, { type: i1$1.MatDialog }, { type: i3$
|
|
5077
|
+
}], ctorParameters: () => [{ type: CoreI18nService }, { type: ActionStateService }, { type: CoreService }, { type: i1$1.MatDialog }, { type: i3$2.ToastrService }, { type: i0.ChangeDetectorRef }, { type: SidenavService }], propDecorators: { lovOptions: [{
|
|
5061
5078
|
type: Input
|
|
5062
5079
|
}], lovType: [{
|
|
5063
5080
|
type: Input
|
|
@@ -5599,6 +5616,114 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImpor
|
|
|
5599
5616
|
args: [{ selector: 'app-activities', standalone: true, imports: [], schemas: [CUSTOM_ELEMENTS_SCHEMA], template: "<section class=\"main-sidenav\">\r\n <div class=\"sidenav-title\">\r\n <h3>{{ i18n.translate('commentHistory') }}</h3>\r\n\r\n <ds-button (click)=\"closeSidenav()\" icon>\r\n <ds-icon icon=\"close\" class=\"fs-20 fc-black\"></ds-icon>\r\n </ds-button>\r\n\r\n </div>\r\n <div class=\"sidenav-body\">\r\n @if (coreService.activities) {\r\n <ds-activity-log activitiesData=\"{{parsedData}}\" readOnly (downloadEvent)=\"downloadFile($event)\">\r\n </ds-activity-log>\r\n } @else {\r\n <ds-message label=\"{{i18n.translate('NoData1')}}\"></ds-message>\r\n }\r\n </div>\r\n</section>\r\n" }]
|
|
5600
5617
|
}], ctorParameters: () => [{ type: SidenavService }, { type: CoreI18nService }, { type: CoreService }] });
|
|
5601
5618
|
|
|
5619
|
+
class StatusStylePipe {
|
|
5620
|
+
transform(status) {
|
|
5621
|
+
let statusClass = {
|
|
5622
|
+
APPROVED: 'success',
|
|
5623
|
+
STORED: 'success',
|
|
5624
|
+
GM_APPROVAL: 'success',
|
|
5625
|
+
COMPLETED: 'success',
|
|
5626
|
+
COMPLETE: 'success',
|
|
5627
|
+
ACCEPTED: 'success',
|
|
5628
|
+
SUBMIT: 'success',
|
|
5629
|
+
SUBMIT_TRAINING: 'success',
|
|
5630
|
+
VEHICLE_IS_AVAILABLE: 'success',
|
|
5631
|
+
VEHICLE_RECEIVED: 'success',
|
|
5632
|
+
RETRY: 'success',
|
|
5633
|
+
REJECT: 'danger',
|
|
5634
|
+
REJECTED: 'danger',
|
|
5635
|
+
AUTO_REJECT: 'danger',
|
|
5636
|
+
VEHICLE_IS_NOT_AVAILABLE: 'danger',
|
|
5637
|
+
SEND_TO_SAFETY_INSPECTOR: 'success',
|
|
5638
|
+
SEND_TO_DESIGN_TEAM: 'success',
|
|
5639
|
+
SEND_TO_SECURITY_SUPERVISOR: 'success',
|
|
5640
|
+
PENDING: 'warning',
|
|
5641
|
+
QUEUED: 'warning',
|
|
5642
|
+
UNACCEPTABLE: 'success',
|
|
5643
|
+
RECEIVED: 'success',
|
|
5644
|
+
CLOSED: 'success',
|
|
5645
|
+
SENT: 'info',
|
|
5646
|
+
SENDBACKTOREQUESTER: 'send_back',
|
|
5647
|
+
'COLLECT_SITE_FEEDBACK': 'success',
|
|
5648
|
+
'COLLECT_SITE_VISIT_FEEDBACK': 'success',
|
|
5649
|
+
'SUBMIT_FEEDBACK': 'success',
|
|
5650
|
+
'CONFIRM_SITE_HANDOVER': 'success',
|
|
5651
|
+
// "SENDBACKTOREQUESTER": "send_back",
|
|
5652
|
+
SEND_BACK_TO_REQUESTER: 'send_back',
|
|
5653
|
+
'SEND BACK TO REQUESTER': 'send_back',
|
|
5654
|
+
SENDBACK: 'send_back',
|
|
5655
|
+
EXPIRED: 'expired',
|
|
5656
|
+
CANCELLED: 'pending',
|
|
5657
|
+
CANCELED: 'pending',
|
|
5658
|
+
SHIPMENT_DELIVERY_REJECTED: 'danger'
|
|
5659
|
+
};
|
|
5660
|
+
// status == 'SEND BACK TO REQUESTER' ? 'SENDBACKTOREQUESTER' : status
|
|
5661
|
+
return statusClass[status?.toUpperCase()] || 'success';
|
|
5662
|
+
}
|
|
5663
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: StatusStylePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
|
|
5664
|
+
static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "18.2.8", ngImport: i0, type: StatusStylePipe, isStandalone: true, name: "statusClass" });
|
|
5665
|
+
}
|
|
5666
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: StatusStylePipe, decorators: [{
|
|
5667
|
+
type: Pipe,
|
|
5668
|
+
args: [{
|
|
5669
|
+
name: 'statusClass',
|
|
5670
|
+
standalone: true,
|
|
5671
|
+
}]
|
|
5672
|
+
}] });
|
|
5673
|
+
|
|
5674
|
+
class PreviousRequestsComponent {
|
|
5675
|
+
dialog;
|
|
5676
|
+
sidenavService;
|
|
5677
|
+
coreService;
|
|
5678
|
+
i18n;
|
|
5679
|
+
previousRequests = [];
|
|
5680
|
+
loading;
|
|
5681
|
+
router = inject(Router);
|
|
5682
|
+
totalLength;
|
|
5683
|
+
constructor(dialog, sidenavService, coreService, i18n) {
|
|
5684
|
+
this.dialog = dialog;
|
|
5685
|
+
this.sidenavService = sidenavService;
|
|
5686
|
+
this.coreService = coreService;
|
|
5687
|
+
this.i18n = i18n;
|
|
5688
|
+
}
|
|
5689
|
+
ngOnInit() {
|
|
5690
|
+
}
|
|
5691
|
+
ngAfterViewInit() {
|
|
5692
|
+
this.getRequests();
|
|
5693
|
+
}
|
|
5694
|
+
getRequests() {
|
|
5695
|
+
let searchData = {
|
|
5696
|
+
year: new Date().getFullYear(),
|
|
5697
|
+
month: ""
|
|
5698
|
+
};
|
|
5699
|
+
this.coreService.myRequests(searchData).subscribe((response) => {
|
|
5700
|
+
if (response) {
|
|
5701
|
+
this.previousRequests = (response.history);
|
|
5702
|
+
}
|
|
5703
|
+
});
|
|
5704
|
+
}
|
|
5705
|
+
viewForm(formId) {
|
|
5706
|
+
if (formId) {
|
|
5707
|
+
window.open('/group/i-gate/wm-bpm/forms?formId=' + formId);
|
|
5708
|
+
}
|
|
5709
|
+
}
|
|
5710
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: PreviousRequestsComponent, deps: [{ token: i1$1.MatDialog }, { token: SidenavService }, { token: CoreService }, { token: CoreI18nService }], target: i0.ɵɵFactoryTarget.Component });
|
|
5711
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: PreviousRequestsComponent, isStandalone: true, selector: "app-history", ngImport: i0, template: "<section class=\"main-sidenav history-sidenav\">\r\n <div class=\"sidenav-title\">\r\n <h3>{{ i18n.translate('PreviousRequests') }}</h3>\r\n <ds-button class=\"close-sidenav\" (click)=\"sidenavService.closeSidenav()\" icon>\r\n <ds-icon icon=\"close\" class=\"fs-20 fc-black\"></ds-icon>\r\n </ds-button>\r\n </div>\r\n\r\n <div\r\n class=\"sidenav-body bc-light-gray\"\r\n >\r\n <section class=\"p-3\">\r\n <!-- <app-request-statistics class=\"d-block mb-4\"></app-request-statistics>-->\r\n <header class=\"d-flex align-items-center justify-content-between gap-2 mb-3\">\r\n <h2 class=\"fs-20 fw-medium fc-black mb-0 d-flex align-items-center flex-grow-1 gap-3\">\r\n {{ i18n.translate('AllRequests') }}\r\n <span class=\"title-count fs-14 fw-normal\">{{ previousRequests?.length ? previousRequests?.length : '0' }}</span>\r\n </h2>\r\n <mat-button-toggle-group\r\n class=\"icon-toggle flex-nowrap\"\r\n #pageView=\"matButtonToggleGroup\"\r\n (click)=\"$event.stopImmediatePropagation()\"\r\n value=\"list\"\r\n >\r\n <mat-button-toggle value=\"card\">\r\n <span class=\"sfi sfi-card fs-20\"></span>\r\n </mat-button-toggle>\r\n <mat-button-toggle value=\"list\">\r\n <span class=\"sfi sfi-list-dots fs-20\"></span>\r\n </mat-button-toggle>\r\n </mat-button-toggle-group>\r\n </header>\r\n\r\n <div class=\"history-cards-container\" *ngIf=\"pageView.value === 'card'\">\r\n <div class=\"p-4 line-height-1 bc-white radius-6 box-shadow\" *ngFor=\"let row of previousRequests\">\r\n <div class=\"d-flex align-items-center gap-2 mb-3\">\r\n <h3\r\n class=\"fs-16 fw-medium flex-grow-1 mb-0 cursor-pointer underline fw-bold\"\r\n (click)=\"viewForm(row?.form?.['formId'])\">{{ row?.form?.['formId'] }}</h3>\r\n </div>\r\n <div class=\"row g-3\">\r\n <div class=\"d-flex flex-column col-6\">\r\n <span class=\"fs-11 fc-dark-gray mb-2\">{{ i18n.translate('formTableCreationDate') }}</span>\r\n <span class=\"fs-12 fw-medium fc-black\">{{ row?.form?.['creationDate'] | date: 'dd/MM/yyyy hh:mm a' }}</span>\r\n </div>\r\n <div class=\"d-flex flex-column col-6 justify-content-end align-items-end\">\r\n\r\n <ds-status [attr.status]=\"row?.form?.formStatus?.key | statusClass\">\r\n {{ row?.form?.formStatus?.value }}\r\n </ds-status>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"table-responsive\" *ngIf=\"pageView.value === 'list'\">\r\n <table *ngIf=\"previousRequests?.length\">\r\n <thead>\r\n <tr>\r\n <th>{{ i18n.translate('formTableFormId') }}</th>\r\n <th>{{ i18n.translate('formTableCreationDate') }}</th>\r\n <th>{{ i18n.translate('Status') }}</th>\r\n </tr>\r\n </thead>\r\n\r\n <tbody *ngFor=\"let row of previousRequests\">\r\n <tr>\r\n <td>\r\n <span class=\"fw-medium cursor-pointer underline fw-bold \" (click)=\"viewForm(row?.form?.['formId'])\">\r\n {{ row?.form?.['formId'] }}\r\n </span>\r\n </td>\r\n <td>{{ row?.form?.['creationDate'] | date: 'dd/MM/yyyy hh:mm a' }}</td>\r\n <td>\r\n <ds-status [attr.status]=\"row?.form?.formStatus?.key | statusClass\">\r\n {{ row?.form?.formStatus?.value }}\r\n </ds-status>\r\n </td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n <ds-loading-table *ngIf=\"loading\" [cols]=\"4\" [rows]=\"4\"></ds-loading-table>\r\n </div>\r\n <ds-message *ngIf=\"!previousRequests?.length && !loading\" type=\"emptyList\" [label]=\"i18n.translate('noData') \"></ds-message>\r\n </section>\r\n\r\n </div>\r\n</section>\r\n", styles: [".history-cards-container{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1rem;padding:1rem 0}.filter-section ::ng-deep .mat-form-field.mat-primary{margin-bottom:0}.filter-section ::ng-deep .select-form-field{--placeholder-fc: var(--dark-gray)}.filter-section ::ng-deep .select-datepicker{--input-width: 200px}table thead{display:none}:host .mat-button-toggle-group{--toggle-bg: var(--white);box-shadow:var(--box-shadow)}:host table{--th-bg: var(--gray);--td-bg: var(--white);--tr-even-bc: var(--white);--tr-odd-bc: var(--white)}ds-button[square]::part(base){--btn-padding: 0}@media (min-width: 768px){.history-sidenav{--sidenav-width: 800px}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i3.DatePipe, name: "date" }, { kind: "ngmodule", type: MatMenuModule }, { kind: "ngmodule", type: RouterModule }, { kind: "ngmodule", type: TranslateModule }, { kind: "ngmodule", type: MatDialogModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: MatButtonToggleModule }, { kind: "directive", type: i4$1.MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled", "disabledInteractive", "hideSingleSelectionIndicator", "hideMultipleSelectionIndicator"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }, { kind: "component", type: i4$1.MatButtonToggle, selector: "mat-button-toggle", inputs: ["aria-label", "aria-labelledby", "id", "name", "value", "tabIndex", "disableRipple", "appearance", "checked", "disabled", "disabledInteractive"], outputs: ["change"], exportAs: ["matButtonToggle"] }, { kind: "pipe", type: StatusStylePipe, name: "statusClass" }] });
|
|
5712
|
+
}
|
|
5713
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: PreviousRequestsComponent, decorators: [{
|
|
5714
|
+
type: Component,
|
|
5715
|
+
args: [{ selector: 'app-history', standalone: true, imports: [
|
|
5716
|
+
CommonModule,
|
|
5717
|
+
MatMenuModule,
|
|
5718
|
+
RouterModule,
|
|
5719
|
+
TranslateModule,
|
|
5720
|
+
MatDialogModule,
|
|
5721
|
+
ReactiveFormsModule,
|
|
5722
|
+
MatButtonToggleModule,
|
|
5723
|
+
StatusStylePipe
|
|
5724
|
+
], schemas: [CUSTOM_ELEMENTS_SCHEMA], template: "<section class=\"main-sidenav history-sidenav\">\r\n <div class=\"sidenav-title\">\r\n <h3>{{ i18n.translate('PreviousRequests') }}</h3>\r\n <ds-button class=\"close-sidenav\" (click)=\"sidenavService.closeSidenav()\" icon>\r\n <ds-icon icon=\"close\" class=\"fs-20 fc-black\"></ds-icon>\r\n </ds-button>\r\n </div>\r\n\r\n <div\r\n class=\"sidenav-body bc-light-gray\"\r\n >\r\n <section class=\"p-3\">\r\n <!-- <app-request-statistics class=\"d-block mb-4\"></app-request-statistics>-->\r\n <header class=\"d-flex align-items-center justify-content-between gap-2 mb-3\">\r\n <h2 class=\"fs-20 fw-medium fc-black mb-0 d-flex align-items-center flex-grow-1 gap-3\">\r\n {{ i18n.translate('AllRequests') }}\r\n <span class=\"title-count fs-14 fw-normal\">{{ previousRequests?.length ? previousRequests?.length : '0' }}</span>\r\n </h2>\r\n <mat-button-toggle-group\r\n class=\"icon-toggle flex-nowrap\"\r\n #pageView=\"matButtonToggleGroup\"\r\n (click)=\"$event.stopImmediatePropagation()\"\r\n value=\"list\"\r\n >\r\n <mat-button-toggle value=\"card\">\r\n <span class=\"sfi sfi-card fs-20\"></span>\r\n </mat-button-toggle>\r\n <mat-button-toggle value=\"list\">\r\n <span class=\"sfi sfi-list-dots fs-20\"></span>\r\n </mat-button-toggle>\r\n </mat-button-toggle-group>\r\n </header>\r\n\r\n <div class=\"history-cards-container\" *ngIf=\"pageView.value === 'card'\">\r\n <div class=\"p-4 line-height-1 bc-white radius-6 box-shadow\" *ngFor=\"let row of previousRequests\">\r\n <div class=\"d-flex align-items-center gap-2 mb-3\">\r\n <h3\r\n class=\"fs-16 fw-medium flex-grow-1 mb-0 cursor-pointer underline fw-bold\"\r\n (click)=\"viewForm(row?.form?.['formId'])\">{{ row?.form?.['formId'] }}</h3>\r\n </div>\r\n <div class=\"row g-3\">\r\n <div class=\"d-flex flex-column col-6\">\r\n <span class=\"fs-11 fc-dark-gray mb-2\">{{ i18n.translate('formTableCreationDate') }}</span>\r\n <span class=\"fs-12 fw-medium fc-black\">{{ row?.form?.['creationDate'] | date: 'dd/MM/yyyy hh:mm a' }}</span>\r\n </div>\r\n <div class=\"d-flex flex-column col-6 justify-content-end align-items-end\">\r\n\r\n <ds-status [attr.status]=\"row?.form?.formStatus?.key | statusClass\">\r\n {{ row?.form?.formStatus?.value }}\r\n </ds-status>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"table-responsive\" *ngIf=\"pageView.value === 'list'\">\r\n <table *ngIf=\"previousRequests?.length\">\r\n <thead>\r\n <tr>\r\n <th>{{ i18n.translate('formTableFormId') }}</th>\r\n <th>{{ i18n.translate('formTableCreationDate') }}</th>\r\n <th>{{ i18n.translate('Status') }}</th>\r\n </tr>\r\n </thead>\r\n\r\n <tbody *ngFor=\"let row of previousRequests\">\r\n <tr>\r\n <td>\r\n <span class=\"fw-medium cursor-pointer underline fw-bold \" (click)=\"viewForm(row?.form?.['formId'])\">\r\n {{ row?.form?.['formId'] }}\r\n </span>\r\n </td>\r\n <td>{{ row?.form?.['creationDate'] | date: 'dd/MM/yyyy hh:mm a' }}</td>\r\n <td>\r\n <ds-status [attr.status]=\"row?.form?.formStatus?.key | statusClass\">\r\n {{ row?.form?.formStatus?.value }}\r\n </ds-status>\r\n </td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n <ds-loading-table *ngIf=\"loading\" [cols]=\"4\" [rows]=\"4\"></ds-loading-table>\r\n </div>\r\n <ds-message *ngIf=\"!previousRequests?.length && !loading\" type=\"emptyList\" [label]=\"i18n.translate('noData') \"></ds-message>\r\n </section>\r\n\r\n </div>\r\n</section>\r\n", styles: [".history-cards-container{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1rem;padding:1rem 0}.filter-section ::ng-deep .mat-form-field.mat-primary{margin-bottom:0}.filter-section ::ng-deep .select-form-field{--placeholder-fc: var(--dark-gray)}.filter-section ::ng-deep .select-datepicker{--input-width: 200px}table thead{display:none}:host .mat-button-toggle-group{--toggle-bg: var(--white);box-shadow:var(--box-shadow)}:host table{--th-bg: var(--gray);--td-bg: var(--white);--tr-even-bc: var(--white);--tr-odd-bc: var(--white)}ds-button[square]::part(base){--btn-padding: 0}@media (min-width: 768px){.history-sidenav{--sidenav-width: 800px}}\n"] }]
|
|
5725
|
+
}], ctorParameters: () => [{ type: i1$1.MatDialog }, { type: SidenavService }, { type: CoreService }, { type: CoreI18nService }] });
|
|
5726
|
+
|
|
5602
5727
|
const StatusMap$1 = {
|
|
5603
5728
|
[FORM_STATUS_REJECTED]: { class: 'danger', icon: 'close' },
|
|
5604
5729
|
[FORM_STATUS_CANCELLED]: { class: 'danger', icon: 'close' },
|
|
@@ -5739,7 +5864,7 @@ class ServiceHeaderComponent {
|
|
|
5739
5864
|
* @return {string} - The CSS class corresponding to the given status.
|
|
5740
5865
|
*/
|
|
5741
5866
|
statusClass(status) {
|
|
5742
|
-
status = status ? status.toLowerCase() : '';
|
|
5867
|
+
// status = status ? status.toLowerCase() : '';
|
|
5743
5868
|
let statusStrategy = StatusMap$1[status] || StatusMap$1['default'];
|
|
5744
5869
|
return statusStrategy.class;
|
|
5745
5870
|
}
|
|
@@ -5807,10 +5932,13 @@ class ServiceHeaderComponent {
|
|
|
5807
5932
|
getImageUrl(email) {
|
|
5808
5933
|
return '/group/i-gate/wm-bpm/forms/-/proxy/portrait?email=' + email;
|
|
5809
5934
|
}
|
|
5810
|
-
|
|
5935
|
+
showPreviousRequests() {
|
|
5936
|
+
this.sidenavService.publish('open', PreviousRequestsComponent);
|
|
5937
|
+
}
|
|
5938
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: ServiceHeaderComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: CoreService }, { token: CoreI18nService }, { token: FeedBackService }, { token: i1$1.MatDialog }, { token: SidenavService }, { token: i3$2.ToastrService }], target: i0.ɵɵFactoryTarget.Component });
|
|
5811
5939
|
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.8", type: ServiceHeaderComponent, isStandalone: true, selector: "core-service-header", inputs: { form: "form", showHistory: "showHistory", isLoading: "isLoading", showApprovalHistory: "showApprovalHistory", approvalHistory: "approvalHistory", creationDate: "creationDate", formTitle: "formTitle", section: "section", serviceFaq: "serviceFaq" }, providers: [FeedBackService,
|
|
5812
5940
|
{ provide: MAT_DIALOG_DATA, useValue: {} },
|
|
5813
|
-
], ngImport: i0, template: "@if (form?.header?.status?.['key'] === 'NEW') {\r\n <header class=\"mb-4 mt-4 d-flex align-items-center justify-content-between align-items-end gap-2\">\r\n <section>\r\n <h6 class=\"fs-14 fs-md-12 fw-normal fc-dark-gray mb-0\">\r\n {{ i18n.translate('Hello') }}\r\n {{ coreService.getShortName(form?.header?.requesterName) }}, {{ i18n.translate('welcomeBack') }}!\r\n </h6>\r\n <h1 class=\"fs-26 fs-md-20 fw-bold fc-black d-flex align-items-center gap-2 mb-1\">\r\n {{ formTitle }}\r\n @if (serviceFaq.length) {\r\n <ds-icon icon=\"info\" class=\"fs-22 fc-dark-gray cursor-pointer\" (click)=\"openFaq()\">\r\n </ds-icon>\r\n }\r\n </h1>\r\n </section>\r\n </header>\r\n} @else {\r\n\r\n <div class=\"w-100 mb-4\">\r\n\r\n <section class=\"request-main-info {{statusClass(form?.header?.status?.['key'])}}\">\r\n <section class=\"request-info\">\r\n <div class=\"request-info--body\">\r\n <div class=\"d-flex align-items-center gap-2 flex-grow-1\">\r\n <img\r\n alt=\"\"\r\n src=\"data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzAiIGhlaWdodD0iMjkiIHZpZXdCb3g9IjAgMCAzMCAyOSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTI1LjEgMEg0LjlDMi4yIDAgMCAyLjIgMCA0LjlWMjguNkgyNS4xQzI3LjggMjguNiAzMCAyNi40IDMwIDIzLjdWNC45QzMwIDIuMiAyNy44IDAgMjUuMSAwWk0yIDQuOUMyIDMuMyAzLjMgMiA0LjkgMkgyNS4xQzI2LjcgMiAyOCAzLjMgMjggNC45VjIzLjdDMjggMjUuMyAyNi43IDI2LjYgMjUuMSAyNi42SDJWNC45Wk0xMS41IDYuM0M3LjEgNi4zIDMuNSA5LjkgMy41IDE0LjNDMy41IDE4LjcgNy4xIDIyLjMgMTEuNSAyMi4zQzE1LjkgMjIuMyAxOS41IDE4LjcgMTkuNSAxNC4zQzE5LjUgOS45IDE1LjkgNi4zIDExLjUgNi4zWk0xNS4xIDE5QzE0LjEgMTkuOCAxMi44IDIwLjIgMTEuNSAyMC4yQzEwLjIgMjAuMiA4LjkgMTkuOCA3LjkgMTlDOC43IDE3LjcgMTAgMTcgMTEuNSAxN0MxMyAxNyAxNC40IDE3LjggMTUuMSAxOVpNMTMuMSAxMy40QzEzLjEgMTQuMyAxMi40IDE1IDExLjUgMTVDMTAuNiAxNSA5LjkgMTQuMyA5LjkgMTMuNEM5LjkgMTIuNSAxMC42IDExLjggMTEuNSAxMS44QzEyLjQgMTEuOCAxMy4xIDEyLjUgMTMuMSAxMy40Wk0xNS4xIDEzLjRDMTUuMSAxMS40IDEzLjUgOS44IDExLjUgOS44QzkuNSA5LjggNy45IDExLjQgNy45IDEzLjRDNy45IDE0LjIgOC4yIDE1IDguNyAxNS43QzcuOCAxNi4xIDcuMSAxNi44IDYuNSAxNy42QzUuOCAxNi42IDUuNSAxNS41IDUuNSAxNC4zQzUuNSAxMSA4LjIgOC4zIDExLjUgOC4zQzE0LjggOC4zIDE3LjUgMTEgMTcuNSAxNC4zQzE3LjUgMTUuNSAxNy4yIDE2LjYgMTYuNSAxNy42QzE1LjkgMTYuOCAxNS4yIDE2LjIgMTQuMyAxNS43QzE0LjggMTUuMSAxNS4xIDE0LjIgMTUuMSAxMy40Wk0yMSA5LjFDMjEgOC42IDIxLjQgOC4xIDIyIDguMUgyNS41QzI2IDguMSAyNi41IDguNSAyNi41IDkuMUMyNi41IDkuNiAyNi4xIDEwLjEgMjUuNSAxMC4xSDIyQzIxLjQgMTAuMSAyMSA5LjYgMjEgOS4xWk0yMSAxMi41QzIxIDEyIDIxLjQgMTEuNSAyMiAxMS41SDI1LjVDMjYgMTEuNSAyNi41IDExLjkgMjYuNSAxMi41QzI2LjUgMTMgMjYuMSAxMy41IDI1LjUgMTMuNUgyMkMyMS40IDEzLjUgMjEgMTMuMSAyMSAxMi41Wk0yMSAxNkMyMSAxNS41IDIxLjQgMTUgMjIgMTVIMjUuNUMyNiAxNSAyNi41IDE1LjQgMjYuNSAxNkMyNi41IDE2LjUgMjYuMSAxNyAyNS41IDE3SDIyQzIxLjQgMTcgMjEgMTYuNiAyMSAxNlpNMjUuNSAyMC41SDIyQzIxLjUgMjAuNSAyMSAyMC4xIDIxIDE5LjVDMjEgMTguOSAyMS40IDE4LjUgMjIgMTguNUgyNS41QzI2IDE4LjUgMjYuNSAxOC45IDI2LjUgMTkuNUMyNi41IDIwLjEgMjYuMSAyMC41IDI1LjUgMjAuNVoiIGZpbGw9IiNGRjM3NUUiLz4KPC9zdmc+Cg==\"/>\r\n <h4 class=\"fs-22 fs-md-16 fc-black fw-medium mb-0 flex-grow-1 line-height-1-2\">\r\n {{ formTitle }}\r\n </h4>\r\n </div>\r\n <div class=\"d-flex align-items-center gap-2 request-info--status-action\">\r\n <div class=\"d-inline-flex flex-column align-items-end\">\r\n @if (!isLoading) {\r\n <ds-status\r\n status=\"{{statusClass(form?.header?.status?.['key'])}}\" class=\"header-status\">{{ form?.header?.status?.['value'] }}\r\n </ds-status>\r\n }\r\n </div>\r\n <div class=\"d-flex align-items-center gap-2\">\r\n <ds-button\r\n *ngIf=\"form?.inboxItem && (form?.inboxItem?.canRequestFeedback =='true'|| form?.inboxItem?.hasFeedback=='true')\"\r\n square icon size=\"small\">\r\n <ds-icon icon=\"chat-o\" class=\"fs-20 fs-md-17 fc-coral\">\r\n <!-- [ngClass]=\"{'fc-green':feedBackIcon == 'feedbackResponded' , 'fc-red': feedBackIcon == 'respondToFeedback' , 'fc-yellow': feedBackIcon == 'waitingFeedback'}\"-->\r\n </ds-icon>\r\n </ds-button>\r\n <!-- comments-->\r\n <ds-button\r\n *ngIf=\"form?.commentsDrop?.length > 0 && !isLoading\" square icon size=\"small\"\r\n (click)=\"onCommentsFormClick()\" class=\"has-comments\">\r\n <ds-icon icon=\"clock\" class=\"fc-coral fs-20 fs-md-17\"></ds-icon>\r\n </ds-button>\r\n <ng-content></ng-content>\r\n <!-- <ds-button square icon size=\"small\" class=\"has-comments\">\r\n <ds-icon icon=\"clock\" class=\"fc-coral fs-20 fs-md-17\"></ds-icon>\r\n </ds-button>-->\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"request-info--footer\">\r\n <ds-avatar\r\n image=\"{{form?.header?.requesterPhoto}}\" size=\"xx-small\"\r\n class=\"d-inline-flex cursor-pointer\" (click)=\"showUserInfo()\"></ds-avatar>\r\n <div\r\n class=\"d-flex align-items-center flex-wrap flex-grow-1 gap-1 gap-sm-2 line-height-1 request-info--header__details\">\r\n\r\n <span\r\n class=\"fs-12 fw-medium d-none d-sm-inline-block\">{{ coreService.getShortName(form?.header?.['requesterName']) }}</span>\r\n <span class=\"fs-20\">•</span>\r\n <span class=\"fs-12\"> {{ form?.header?.formId }}</span>\r\n <span class=\"fs-20\" *ngIf=\"creationDate\">•</span>\r\n <span class=\"fs-12\"> {{ creationDate }}</span>\r\n </div>\r\n </div>\r\n </section>\r\n </section>\r\n\r\n </div>\r\n\r\n\r\n <!--<ng-container>\r\n <div class=\"d-flex align-items-center justify-content-end gap-2 my-2\">\r\n <ds-button\r\n *ngIf=\"form?.inboxItem && !form.sections[form.sections.length -1].header.readOnly && !isLoading\"\r\n square\r\n icon\r\n size=\"small\"\r\n [matMenuTriggerFor]=\"menu\"\r\n class=\"icon-btn-shadow\">\r\n <ds-icon\r\n [ngClass]=\"{'fc-purple' : (flagPriority === '0' || flagPriority === null),'fc-yellow' : flagPriority === '1','fc-green' : flagPriority === '2','fc-coral' : flagPriority === '3'}\"\r\n icon=\"flag-o\" class=\"fs-20 fs-md-17 fc-purple\">\r\n </ds-icon>\r\n </ds-button>\r\n <mat-menu #menu=\"matMenu\" panelClass=\"action-menu\">\r\n <button mat-menu-item (click)=\"setFlagPriority('0')\">\r\n <ds-icon icon=\"flag-o\" class=\"fc-purple fs-20 fs-md-17\"></ds-icon>\r\n </button>\r\n <button mat-menu-item (click)=\"setFlagPriority('1')\">\r\n <ds-icon icon=\"flag-o\" class=\"fc-yellow fs-20 fs-md-17\"></ds-icon>\r\n </button>\r\n <button mat-menu-item (click)=\"setFlagPriority('2')\">\r\n <ds-icon icon=\"flag-o\" class=\"fc-green fs-20 fs-md-17\"></ds-icon>\r\n </button>\r\n <button mat-menu-item (click)=\"setFlagPriority('3')\">\r\n <ds-icon icon=\"flag-o\" class=\"fc-coral fs-20 fs-md-17\"></ds-icon>\r\n </button>\r\n </mat-menu>\r\n\r\n <ng-content></ng-content>\r\n </div>\r\n <header class=\"service-header bc-white p-3 p-sm-4 py-4 gap-3 {{statusClass(form?.header?.status?.['key'])}}\">\r\n\r\n <div class=\"service-header-icon\">\r\n <img\r\n alt=\"\"\r\n src=\"data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzAiIGhlaWdodD0iMjkiIHZpZXdCb3g9IjAgMCAzMCAyOSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTI1LjEgMEg0LjlDMi4yIDAgMCAyLjIgMCA0LjlWMjguNkgyNS4xQzI3LjggMjguNiAzMCAyNi40IDMwIDIzLjdWNC45QzMwIDIuMiAyNy44IDAgMjUuMSAwWk0yIDQuOUMyIDMuMyAzLjMgMiA0LjkgMkgyNS4xQzI2LjcgMiAyOCAzLjMgMjggNC45VjIzLjdDMjggMjUuMyAyNi43IDI2LjYgMjUuMSAyNi42SDJWNC45Wk0xMS41IDYuM0M3LjEgNi4zIDMuNSA5LjkgMy41IDE0LjNDMy41IDE4LjcgNy4xIDIyLjMgMTEuNSAyMi4zQzE1LjkgMjIuMyAxOS41IDE4LjcgMTkuNSAxNC4zQzE5LjUgOS45IDE1LjkgNi4zIDExLjUgNi4zWk0xNS4xIDE5QzE0LjEgMTkuOCAxMi44IDIwLjIgMTEuNSAyMC4yQzEwLjIgMjAuMiA4LjkgMTkuOCA3LjkgMTlDOC43IDE3LjcgMTAgMTcgMTEuNSAxN0MxMyAxNyAxNC40IDE3LjggMTUuMSAxOVpNMTMuMSAxMy40QzEzLjEgMTQuMyAxMi40IDE1IDExLjUgMTVDMTAuNiAxNSA5LjkgMTQuMyA5LjkgMTMuNEM5LjkgMTIuNSAxMC42IDExLjggMTEuNSAxMS44QzEyLjQgMTEuOCAxMy4xIDEyLjUgMTMuMSAxMy40Wk0xNS4xIDEzLjRDMTUuMSAxMS40IDEzLjUgOS44IDExLjUgOS44QzkuNSA5LjggNy45IDExLjQgNy45IDEzLjRDNy45IDE0LjIgOC4yIDE1IDguNyAxNS43QzcuOCAxNi4xIDcuMSAxNi44IDYuNSAxNy42QzUuOCAxNi42IDUuNSAxNS41IDUuNSAxNC4zQzUuNSAxMSA4LjIgOC4zIDExLjUgOC4zQzE0LjggOC4zIDE3LjUgMTEgMTcuNSAxNC4zQzE3LjUgMTUuNSAxNy4yIDE2LjYgMTYuNSAxNy42QzE1LjkgMTYuOCAxNS4yIDE2LjIgMTQuMyAxNS43QzE0LjggMTUuMSAxNS4xIDE0LjIgMTUuMSAxMy40Wk0yMSA5LjFDMjEgOC42IDIxLjQgOC4xIDIyIDguMUgyNS41QzI2IDguMSAyNi41IDguNSAyNi41IDkuMUMyNi41IDkuNiAyNi4xIDEwLjEgMjUuNSAxMC4xSDIyQzIxLjQgMTAuMSAyMSA5LjYgMjEgOS4xWk0yMSAxMi41QzIxIDEyIDIxLjQgMTEuNSAyMiAxMS41SDI1LjVDMjYgMTEuNSAyNi41IDExLjkgMjYuNSAxMi41QzI2LjUgMTMgMjYuMSAxMy41IDI1LjUgMTMuNUgyMkMyMS40IDEzLjUgMjEgMTMuMSAyMSAxMi41Wk0yMSAxNkMyMSAxNS41IDIxLjQgMTUgMjIgMTVIMjUuNUMyNiAxNSAyNi41IDE1LjQgMjYuNSAxNkMyNi41IDE2LjUgMjYuMSAxNyAyNS41IDE3SDIyQzIxLjQgMTcgMjEgMTYuNiAyMSAxNlpNMjUuNSAyMC41SDIyQzIxLjUgMjAuNSAyMSAyMC4xIDIxIDE5LjVDMjEgMTguOSAyMS40IDE4LjUgMjIgMTguNUgyNS41QzI2IDE4LjUgMjYuNSAxOC45IDI2LjUgMTkuNUMyNi41IDIwLjEgMjYuMSAyMC41IDI1LjUgMjAuNVoiIGZpbGw9IiNGRjM3NUUiLz4KPC9zdmc+Cg==\"/>\r\n </div>\r\n\r\n <div class=\"flex-grow-1 d-flex flex-column flex-sm-row align-items-sm-center gap-2\">\r\n <div class=\"flex-grow-1\">\r\n <h1 class=\"fs-20 fs-md-16 fw-bold fc-black header-title m-0\">{{ formTitle }}\r\n @if (serviceFaq.length) {\r\n <ds-icon icon=\"info\" class=\"fs-22 fc-dark-gray cursor-pointer\" (click)=\"openFaq()\">\r\n </ds-icon>\r\n }\r\n </h1>\r\n <div class=\"header-user d-flex align-items-sm-center gap-2 mt-sm-1\">\r\n @if (!isLoading) {\r\n <ds-avatar\r\n image=\"{{form?.header?.requesterPhoto}}\" size=\"xx-small\"\r\n class=\"d-inline-flex cursor-pointer\" (click)=\"showUserInfo()\"></ds-avatar>\r\n }\r\n <span\r\n class=\"fs-12 text-truncate d-sm-block cursor-pointer\" (click)=\"showUserInfo()\"\r\n [ngClass]=\"{'loading-bg loading-width': isLoading}\">{{ coreService.getShortName(form?.header?.requesterName) }}</span>\r\n <mat-divider class=\"divider circle mx-2 d-none d-sm-block\"></mat-divider>\r\n <span class=\"fs-12\" [ngClass]=\"{'loading-bg loading-width': isLoading}\">{{ form?.header?.formId }}</span>\r\n @if (creationDate) {\r\n <mat-divider class=\"divider circle mx-2 d-none d-sm-block\"></mat-divider>\r\n <span class=\"fs-14\" [ngClass]=\"{'loading-bg loading-width': isLoading}\">{{ creationDate }}</span>\r\n }\r\n </div>\r\n\r\n </div>\r\n <div class=\"header-actions d-flex flex-row flex-sm-column justify-content-between justify-content-sm-center gap-2 mt-2 mt-sm-0\">\r\n @if (!isLoading) {\r\n <ds-status\r\n status=\"{{statusClass(form?.header?.status?.['key'])}}\" class=\"header-status\">{{ form?.header?.status?.['value'] }}\r\n </ds-status>\r\n }\r\n <div class=\"d-flex align-items-center justify-content-end gap-2\">\r\n <!– feedback–>\r\n <!– *ngIf=\"form?.inboxItem && (form?.inboxItem?.canRequestFeedback ==='true'|| form?.inboxItem?.hasFeedback==='true') && !isLoading\"–>\r\n <!– <ds-button\r\n square icon size=\"small\" (click)=\"feedback()\">\r\n <ds-icon\r\n icon=\"chat-o\" class=\"fs-20 fs-md-17 fc-coral\"\r\n [ngClass]=\"{'fc-green':feedBackIcon === 'feedbackResponded' , 'fc-red': feedBackIcon === 'respondToFeedback' , 'fc-yellow': feedBackIcon === 'waitingFeedback'}\">\r\n </ds-icon>\r\n </ds-button>–>\r\n <ds-button\r\n *ngIf=\"form?.commentsDrop?.length > 0 && !isLoading\" square icon size=\"small\"\r\n (click)=\"onCommentsFormClick()\" class=\"has-comments\">\r\n <ds-icon icon=\"clock\" class=\"fc-coral fs-20 fs-md-17\"></ds-icon>\r\n </ds-button>\r\n @if (showApprovalHistory) {\r\n <ng-container>\r\n <ds-button\r\n color=\"white\" shape=\"text\" square size=\"small\" [satPopoverAnchor]=\"workflow\"\r\n #workflowAnchor=\"satPopoverAnchor\" (click)=\"workflowAnchor.popover.open()\">\r\n <slot name=\"prefix\">\r\n <ds-icon icon=\"workflow\" class=\"fs-24\"></ds-icon>\r\n </slot>\r\n </ds-button>\r\n <sat-popover\r\n #workflow [anchor]=\"workflowAnchor\" [hasBackdrop]=\"true\" verticalAlign=\"below\"\r\n horizontalAlign=\"end\">\r\n <div class=\"default-popover p-3\" style=\"min-width: 330px;\">\r\n <ds-approvals *ngIf=\"approvalHistory\" class=\"popover-approvals\" approvalsData=\"{{approvals}}\">\r\n </ds-approvals>\r\n </div>\r\n </sat-popover>\r\n </ng-container>\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n\r\n </header>\r\n </ng-container>-->\r\n}\r\n", styles: [".request-main-info{--item-bg: var(--light-gray);--item-fc: var(--black);--status-container-bc: #e8ebec;--status-container-brc: var(--dark-gray)}.request-main-info.warning{--item-bg: var(--yellow);--status-container-bc: #fff8d9;--status-container-brc: var(--yellow)}.request-main-info.pending{--item-bg: #eff0f1;--status-container-bc: #e8ebec;--status-container-brc: #c8ced1}.request-main-info.expired{--item-bg: var(--dark-gray);--status-container-bc: #e8ebec;--status-container-brc: var(--dark-gray)}.request-main-info.success{--item-bg: var(--green);--status-container-bc: #e6f9f4;--status-container-brc: var(--green)}.request-main-info.info{--item-bg: var(--sea-light);--status-container-bc: #fff8d9;--status-container-brc: var(--sea-light)}.request-main-info.danger{--item-bg: var(--red);--status-container-bc: #fae9ec;--status-container-brc: var(--red)}.request-main-info.orange,.request-main-info.send_back{--item-bg: var(--orange);--status-container-bc: #fff0eb;--status-container-brc: var(--orange)}.request-info{border-radius:0;box-shadow:var(--box-shadow);background-color:var(--white);border-top:5px solid var(--item-bg)}.request-info--footer{padding:.3rem 2rem;min-height:45px;display:flex;align-items:center;gap:.75rem;border-top:1px solid var(--light-gray)}@media (max-width: 578px){.request-info--footer{padding:.3rem 1rem}}.request-info--footer__details{color:var(--item-fc)}.request-info--body{padding:2rem;display:flex;align-items:center;gap:.75rem;background-color:#fff}@media (max-width: 578px){.request-info--body{padding:1rem;flex-direction:column;align-items:stretch}}.request-info--body figure{min-width:30px;width:30px;text-align:center}.request-info--body figure svg{width:100%}@media (max-width: 578px){.request-info--status-action{justify-content:space-between}}.request-info--history{margin-top:-.5rem}.request-info--comment{background-color:#fff0eb;color:var(--orange);border-radius:0 0 4px 4px}.status-container{min-height:40px;padding:.5rem 1rem;display:flex;flex-direction:column;justify-content:center;gap:.5rem;margin-bottom:1.5rem;background-color:var(--status-container-bc);border-inline-start:4px solid var(--status-container-brc)}.status-container.danger{--item-bg: var(--red);--status-container-bc: #fae9ec;--status-container-brc: var(--red)}.status-container ::ng-deep ds-avatar .avatar{--default-size: 18px}.circle-status::part(base){--status-radius: 50%;--status-size: 19px;--status-fs: 100%}ds-button[square]::part(base){--btn-padding: 0;--default-size-sm: 30px}.send-back-container{background-color:#fff0eb;color:var(--orange);padding:.5rem;border-radius:4px}object,iframe,embed{height:79vh}::ng-deep .history-popup{--popup-width: 100vw;--popup-max-width: 100vw;--popup-radius: 15px 15px 0 0;position:absolute!important;bottom:0}: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}}.e-control.e-datepicker .e-control-wrapper{margin:0!important}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: SatPopoverModule }] });
|
|
5941
|
+
], ngImport: i0, template: "@if (form?.header?.status?.['key'] === 'NEW') {\r\n <section\r\n class=\"main-sidenav main-sidenav-full mb-4\"\r\n\r\n >\r\n <div class=\"sidenav-title\">\r\n <div class=\"d-flex align-items-center gap-3 w-100\">\r\n <!-- <ds-button icon class=\"rotate-arrow\" size=\"small\" (click)=\"goBack()\" *ngIf=\"!isInMobileApp() && showBack\">\r\n <ds-icon icon=\"arrow-right\" class=\"fs-19 fc-black\"></ds-icon>\r\n </ds-button>-->\r\n\r\n <!-- <h3 class=\"flex-grow-0\">\r\n {{ formTitle }}\r\n </h3>-->\r\n\r\n <section>\r\n <h6 class=\"fs-14 fs-md-12 fw-normal fc-dark-gray mb-0\">\r\n {{ i18n.translate('Hello') }}\r\n {{ coreService.getShortName(form?.header?.requesterName) }}, {{ i18n.translate('welcomeBack') }}!\r\n </h6>\r\n <h1 class=\"fs-26 fs-md-20 fw-bold fc-black d-flex align-items-center gap-2 mb-1\">\r\n {{ formTitle }}\r\n @if (serviceFaq.length) {\r\n <ds-icon icon=\"info\" class=\"fs-22 fc-dark-gray cursor-pointer\" (click)=\"openFaq()\">\r\n </ds-icon>\r\n }\r\n </h1>\r\n </section>\r\n <div class=\"d-flex align-items-center justify-content-end gap-2 flex-grow-1\">\r\n @if (serviceFaq.length) {\r\n <ds-button size=\"small\" icon>\r\n <ds-icon icon=\"info\" class=\"fs-22 fc-dark-gray cursor-pointer\" (click)=\"openFaq()\">\r\n </ds-icon>\r\n </ds-button>\r\n }\r\n <!-- <ds-button size=\"small\" icon (click)=\"openWorkflow()\">\r\n <ds-icon icon=\"bell-2-o\" class=\"fs-20 fc-coral\"></ds-icon>\r\n </ds-button> -->\r\n <ds-button size=\"small\" icon (click)=\"showPreviousRequests()\" >\r\n <ds-icon icon=\"clock\" class=\"fs-20 fc-coral\"></ds-icon>\r\n </ds-button>\r\n </div>\r\n </div>\r\n </div>\r\n </section>\r\n\r\n <!-- <header class=\"mb-4 mt-4 d-flex align-items-center justify-content-between align-items-end gap-2\">\r\n <section>\r\n <h6 class=\"fs-14 fs-md-12 fw-normal fc-dark-gray mb-0\">\r\n {{ i18n.translate('Hello') }}\r\n {{ coreService.getShortName(form?.header?.requesterName) }}, {{ i18n.translate('welcomeBack') }}!\r\n </h6>\r\n <h1 class=\"fs-26 fs-md-20 fw-bold fc-black d-flex align-items-center gap-2 mb-1\">\r\n {{ formTitle }}\r\n @if (serviceFaq.length) {\r\n <ds-icon icon=\"info\" class=\"fs-22 fc-dark-gray cursor-pointer\" (click)=\"openFaq()\">\r\n </ds-icon>\r\n }\r\n </h1>\r\n </section>\r\n </header>-->\r\n} @else {\r\n\r\n <div class=\"w-100\">\r\n <section class=\"request-main-info {{statusClass(form?.header?.status?.['key'])}}\">\r\n <section class=\"request-info\">\r\n <div class=\"request-info--body\">\r\n <div class=\"d-flex align-items-center gap-2 flex-grow-1\">\r\n <img\r\n alt=\"\"\r\n src=\"data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzAiIGhlaWdodD0iMjkiIHZpZXdCb3g9IjAgMCAzMCAyOSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTI1LjEgMEg0LjlDMi4yIDAgMCAyLjIgMCA0LjlWMjguNkgyNS4xQzI3LjggMjguNiAzMCAyNi40IDMwIDIzLjdWNC45QzMwIDIuMiAyNy44IDAgMjUuMSAwWk0yIDQuOUMyIDMuMyAzLjMgMiA0LjkgMkgyNS4xQzI2LjcgMiAyOCAzLjMgMjggNC45VjIzLjdDMjggMjUuMyAyNi43IDI2LjYgMjUuMSAyNi42SDJWNC45Wk0xMS41IDYuM0M3LjEgNi4zIDMuNSA5LjkgMy41IDE0LjNDMy41IDE4LjcgNy4xIDIyLjMgMTEuNSAyMi4zQzE1LjkgMjIuMyAxOS41IDE4LjcgMTkuNSAxNC4zQzE5LjUgOS45IDE1LjkgNi4zIDExLjUgNi4zWk0xNS4xIDE5QzE0LjEgMTkuOCAxMi44IDIwLjIgMTEuNSAyMC4yQzEwLjIgMjAuMiA4LjkgMTkuOCA3LjkgMTlDOC43IDE3LjcgMTAgMTcgMTEuNSAxN0MxMyAxNyAxNC40IDE3LjggMTUuMSAxOVpNMTMuMSAxMy40QzEzLjEgMTQuMyAxMi40IDE1IDExLjUgMTVDMTAuNiAxNSA5LjkgMTQuMyA5LjkgMTMuNEM5LjkgMTIuNSAxMC42IDExLjggMTEuNSAxMS44QzEyLjQgMTEuOCAxMy4xIDEyLjUgMTMuMSAxMy40Wk0xNS4xIDEzLjRDMTUuMSAxMS40IDEzLjUgOS44IDExLjUgOS44QzkuNSA5LjggNy45IDExLjQgNy45IDEzLjRDNy45IDE0LjIgOC4yIDE1IDguNyAxNS43QzcuOCAxNi4xIDcuMSAxNi44IDYuNSAxNy42QzUuOCAxNi42IDUuNSAxNS41IDUuNSAxNC4zQzUuNSAxMSA4LjIgOC4zIDExLjUgOC4zQzE0LjggOC4zIDE3LjUgMTEgMTcuNSAxNC4zQzE3LjUgMTUuNSAxNy4yIDE2LjYgMTYuNSAxNy42QzE1LjkgMTYuOCAxNS4yIDE2LjIgMTQuMyAxNS43QzE0LjggMTUuMSAxNS4xIDE0LjIgMTUuMSAxMy40Wk0yMSA5LjFDMjEgOC42IDIxLjQgOC4xIDIyIDguMUgyNS41QzI2IDguMSAyNi41IDguNSAyNi41IDkuMUMyNi41IDkuNiAyNi4xIDEwLjEgMjUuNSAxMC4xSDIyQzIxLjQgMTAuMSAyMSA5LjYgMjEgOS4xWk0yMSAxMi41QzIxIDEyIDIxLjQgMTEuNSAyMiAxMS41SDI1LjVDMjYgMTEuNSAyNi41IDExLjkgMjYuNSAxMi41QzI2LjUgMTMgMjYuMSAxMy41IDI1LjUgMTMuNUgyMkMyMS40IDEzLjUgMjEgMTMuMSAyMSAxMi41Wk0yMSAxNkMyMSAxNS41IDIxLjQgMTUgMjIgMTVIMjUuNUMyNiAxNSAyNi41IDE1LjQgMjYuNSAxNkMyNi41IDE2LjUgMjYuMSAxNyAyNS41IDE3SDIyQzIxLjQgMTcgMjEgMTYuNiAyMSAxNlpNMjUuNSAyMC41SDIyQzIxLjUgMjAuNSAyMSAyMC4xIDIxIDE5LjVDMjEgMTguOSAyMS40IDE4LjUgMjIgMTguNUgyNS41QzI2IDE4LjUgMjYuNSAxOC45IDI2LjUgMTkuNUMyNi41IDIwLjEgMjYuMSAyMC41IDI1LjUgMjAuNVoiIGZpbGw9IiNGRjM3NUUiLz4KPC9zdmc+Cg==\"/>\r\n <h4 class=\"fs-22 fs-md-16 fc-black fw-medium mb-0 flex-grow-1 line-height-1-2\">\r\n {{ formTitle }}\r\n </h4>\r\n </div>\r\n <div class=\"d-flex align-items-center gap-2 request-info--status-action\">\r\n <div class=\"d-inline-flex flex-column align-items-end\">\r\n @if (!isLoading) {\r\n <ds-status\r\n status=\"{{statusClass(form?.header?.status?.['key'])}}\" class=\"header-status\">{{ form?.header?.status?.['value'] }}\r\n </ds-status>\r\n }\r\n </div>\r\n <div class=\"d-flex align-items-center gap-2\">\r\n <!-- <ds-button\r\n *ngIf=\"form?.inboxItem && (form?.inboxItem?.canRequestFeedback =='true'|| form?.inboxItem?.hasFeedback=='true')\"\r\n square icon size=\"small\">\r\n <ds-icon icon=\"chat-o\" class=\"fs-20 fs-md-17 fc-coral\">\r\n <!– [ngClass]=\"{'fc-green':feedBackIcon == 'feedbackResponded' , 'fc-red': feedBackIcon == 'respondToFeedback' , 'fc-yellow': feedBackIcon == 'waitingFeedback'}\"–>\r\n </ds-icon>\r\n </ds-button>-->\r\n <!-- history-->\r\n <ds-button\r\n *ngIf=\"form?.commentsDrop?.length > 0 && !isLoading\" square icon size=\"small\"\r\n (click)=\"onCommentsFormClick()\" class=\"has-comments\">\r\n <ds-icon icon=\"clock\" class=\"fc-coral fs-20 fs-md-17\"></ds-icon>\r\n </ds-button>\r\n <ng-content></ng-content>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"request-info--footer\">\r\n @if (!isLoading) {\r\n <ds-avatar\r\n image=\"{{form?.header?.requesterPhoto}}\" size=\"xx-small\"\r\n class=\"d-inline-flex cursor-pointer\" (click)=\"showUserInfo()\"></ds-avatar>\r\n }\r\n <div\r\n class=\"d-flex align-items-center flex-wrap flex-grow-1 gap-1 gap-sm-2 line-height-1 request-info--header__details\">\r\n <span\r\n [ngClass]=\"{'loading-bg loading-width': isLoading}\"\r\n class=\"fs-12 fw-medium d-none d-sm-inline-block\">{{ coreService.getShortName(form?.header?.['requesterName']) }}</span>\r\n <span class=\"fs-20\">•</span>\r\n <span class=\"fs-12\" [ngClass]=\"{'loading-bg loading-width': isLoading}\"> {{ form?.header?.formId }}</span>\r\n <span class=\"fs-20\" *ngIf=\"creationDate\">•</span>\r\n <span class=\"fs-12\" [ngClass]=\"{'loading-bg loading-width': isLoading}\"> {{ creationDate }}</span>\r\n </div>\r\n </div>\r\n </section>\r\n </section>\r\n\r\n </div>\r\n\r\n\r\n <!--<ng-container>\r\n <div class=\"d-flex align-items-center justify-content-end gap-2 my-2\">\r\n <ds-button\r\n *ngIf=\"form?.inboxItem && !form.sections[form.sections.length -1].header.readOnly && !isLoading\"\r\n square\r\n icon\r\n size=\"small\"\r\n [matMenuTriggerFor]=\"menu\"\r\n class=\"icon-btn-shadow\">\r\n <ds-icon\r\n [ngClass]=\"{'fc-purple' : (flagPriority === '0' || flagPriority === null),'fc-yellow' : flagPriority === '1','fc-green' : flagPriority === '2','fc-coral' : flagPriority === '3'}\"\r\n icon=\"flag-o\" class=\"fs-20 fs-md-17 fc-purple\">\r\n </ds-icon>\r\n </ds-button>\r\n <mat-menu #menu=\"matMenu\" panelClass=\"action-menu\">\r\n <button mat-menu-item (click)=\"setFlagPriority('0')\">\r\n <ds-icon icon=\"flag-o\" class=\"fc-purple fs-20 fs-md-17\"></ds-icon>\r\n </button>\r\n <button mat-menu-item (click)=\"setFlagPriority('1')\">\r\n <ds-icon icon=\"flag-o\" class=\"fc-yellow fs-20 fs-md-17\"></ds-icon>\r\n </button>\r\n <button mat-menu-item (click)=\"setFlagPriority('2')\">\r\n <ds-icon icon=\"flag-o\" class=\"fc-green fs-20 fs-md-17\"></ds-icon>\r\n </button>\r\n <button mat-menu-item (click)=\"setFlagPriority('3')\">\r\n <ds-icon icon=\"flag-o\" class=\"fc-coral fs-20 fs-md-17\"></ds-icon>\r\n </button>\r\n </mat-menu>\r\n\r\n <ng-content></ng-content>\r\n </div>\r\n <header class=\"service-header bc-white p-3 p-sm-4 py-4 gap-3 {{statusClass(form?.header?.status?.['key'])}}\">\r\n\r\n <div class=\"service-header-icon\">\r\n <img\r\n alt=\"\"\r\n src=\"data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzAiIGhlaWdodD0iMjkiIHZpZXdCb3g9IjAgMCAzMCAyOSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTI1LjEgMEg0LjlDMi4yIDAgMCAyLjIgMCA0LjlWMjguNkgyNS4xQzI3LjggMjguNiAzMCAyNi40IDMwIDIzLjdWNC45QzMwIDIuMiAyNy44IDAgMjUuMSAwWk0yIDQuOUMyIDMuMyAzLjMgMiA0LjkgMkgyNS4xQzI2LjcgMiAyOCAzLjMgMjggNC45VjIzLjdDMjggMjUuMyAyNi43IDI2LjYgMjUuMSAyNi42SDJWNC45Wk0xMS41IDYuM0M3LjEgNi4zIDMuNSA5LjkgMy41IDE0LjNDMy41IDE4LjcgNy4xIDIyLjMgMTEuNSAyMi4zQzE1LjkgMjIuMyAxOS41IDE4LjcgMTkuNSAxNC4zQzE5LjUgOS45IDE1LjkgNi4zIDExLjUgNi4zWk0xNS4xIDE5QzE0LjEgMTkuOCAxMi44IDIwLjIgMTEuNSAyMC4yQzEwLjIgMjAuMiA4LjkgMTkuOCA3LjkgMTlDOC43IDE3LjcgMTAgMTcgMTEuNSAxN0MxMyAxNyAxNC40IDE3LjggMTUuMSAxOVpNMTMuMSAxMy40QzEzLjEgMTQuMyAxMi40IDE1IDExLjUgMTVDMTAuNiAxNSA5LjkgMTQuMyA5LjkgMTMuNEM5LjkgMTIuNSAxMC42IDExLjggMTEuNSAxMS44QzEyLjQgMTEuOCAxMy4xIDEyLjUgMTMuMSAxMy40Wk0xNS4xIDEzLjRDMTUuMSAxMS40IDEzLjUgOS44IDExLjUgOS44QzkuNSA5LjggNy45IDExLjQgNy45IDEzLjRDNy45IDE0LjIgOC4yIDE1IDguNyAxNS43QzcuOCAxNi4xIDcuMSAxNi44IDYuNSAxNy42QzUuOCAxNi42IDUuNSAxNS41IDUuNSAxNC4zQzUuNSAxMSA4LjIgOC4zIDExLjUgOC4zQzE0LjggOC4zIDE3LjUgMTEgMTcuNSAxNC4zQzE3LjUgMTUuNSAxNy4yIDE2LjYgMTYuNSAxNy42QzE1LjkgMTYuOCAxNS4yIDE2LjIgMTQuMyAxNS43QzE0LjggMTUuMSAxNS4xIDE0LjIgMTUuMSAxMy40Wk0yMSA5LjFDMjEgOC42IDIxLjQgOC4xIDIyIDguMUgyNS41QzI2IDguMSAyNi41IDguNSAyNi41IDkuMUMyNi41IDkuNiAyNi4xIDEwLjEgMjUuNSAxMC4xSDIyQzIxLjQgMTAuMSAyMSA5LjYgMjEgOS4xWk0yMSAxMi41QzIxIDEyIDIxLjQgMTEuNSAyMiAxMS41SDI1LjVDMjYgMTEuNSAyNi41IDExLjkgMjYuNSAxMi41QzI2LjUgMTMgMjYuMSAxMy41IDI1LjUgMTMuNUgyMkMyMS40IDEzLjUgMjEgMTMuMSAyMSAxMi41Wk0yMSAxNkMyMSAxNS41IDIxLjQgMTUgMjIgMTVIMjUuNUMyNiAxNSAyNi41IDE1LjQgMjYuNSAxNkMyNi41IDE2LjUgMjYuMSAxNyAyNS41IDE3SDIyQzIxLjQgMTcgMjEgMTYuNiAyMSAxNlpNMjUuNSAyMC41SDIyQzIxLjUgMjAuNSAyMSAyMC4xIDIxIDE5LjVDMjEgMTguOSAyMS40IDE4LjUgMjIgMTguNUgyNS41QzI2IDE4LjUgMjYuNSAxOC45IDI2LjUgMTkuNUMyNi41IDIwLjEgMjYuMSAyMC41IDI1LjUgMjAuNVoiIGZpbGw9IiNGRjM3NUUiLz4KPC9zdmc+Cg==\"/>\r\n </div>\r\n\r\n <div class=\"flex-grow-1 d-flex flex-column flex-sm-row align-items-sm-center gap-2\">\r\n <div class=\"flex-grow-1\">\r\n <h1 class=\"fs-20 fs-md-16 fw-bold fc-black header-title m-0\">{{ formTitle }}\r\n @if (serviceFaq.length) {\r\n <ds-icon icon=\"info\" class=\"fs-22 fc-dark-gray cursor-pointer\" (click)=\"openFaq()\">\r\n </ds-icon>\r\n }\r\n </h1>\r\n <div class=\"header-user d-flex align-items-sm-center gap-2 mt-sm-1\">\r\n @if (!isLoading) {\r\n <ds-avatar\r\n image=\"{{form?.header?.requesterPhoto}}\" size=\"xx-small\"\r\n class=\"d-inline-flex cursor-pointer\" (click)=\"showUserInfo()\"></ds-avatar>\r\n }\r\n <span\r\n class=\"fs-12 text-truncate d-sm-block cursor-pointer\" (click)=\"showUserInfo()\"\r\n [ngClass]=\"{'loading-bg loading-width': isLoading}\">{{ coreService.getShortName(form?.header?.requesterName) }}</span>\r\n <mat-divider class=\"divider circle mx-2 d-none d-sm-block\"></mat-divider>\r\n <span class=\"fs-12\" [ngClass]=\"{'loading-bg loading-width': isLoading}\">{{ form?.header?.formId }}</span>\r\n @if (creationDate) {\r\n <mat-divider class=\"divider circle mx-2 d-none d-sm-block\"></mat-divider>\r\n <span class=\"fs-14\" [ngClass]=\"{'loading-bg loading-width': isLoading}\">{{ creationDate }}</span>\r\n }\r\n </div>\r\n\r\n </div>\r\n <div class=\"header-actions d-flex flex-row flex-sm-column justify-content-between justify-content-sm-center gap-2 mt-2 mt-sm-0\">\r\n @if (!isLoading) {\r\n <ds-status\r\n status=\"{{statusClass(form?.header?.status?.['key'])}}\" class=\"header-status\">{{ form?.header?.status?.['value'] }}\r\n </ds-status>\r\n }\r\n <div class=\"d-flex align-items-center justify-content-end gap-2\">\r\n <!– feedback–>\r\n <!– *ngIf=\"form?.inboxItem && (form?.inboxItem?.canRequestFeedback ==='true'|| form?.inboxItem?.hasFeedback==='true') && !isLoading\"–>\r\n <!– <ds-button\r\n square icon size=\"small\" (click)=\"feedback()\">\r\n <ds-icon\r\n icon=\"chat-o\" class=\"fs-20 fs-md-17 fc-coral\"\r\n [ngClass]=\"{'fc-green':feedBackIcon === 'feedbackResponded' , 'fc-red': feedBackIcon === 'respondToFeedback' , 'fc-yellow': feedBackIcon === 'waitingFeedback'}\">\r\n </ds-icon>\r\n </ds-button>–>\r\n <ds-button\r\n *ngIf=\"form?.commentsDrop?.length > 0 && !isLoading\" square icon size=\"small\"\r\n (click)=\"onCommentsFormClick()\" class=\"has-comments\">\r\n <ds-icon icon=\"clock\" class=\"fc-coral fs-20 fs-md-17\"></ds-icon>\r\n </ds-button>\r\n @if (showApprovalHistory) {\r\n <ng-container>\r\n <ds-button\r\n color=\"white\" shape=\"text\" square size=\"small\" [satPopoverAnchor]=\"workflow\"\r\n #workflowAnchor=\"satPopoverAnchor\" (click)=\"workflowAnchor.popover.open()\">\r\n <slot name=\"prefix\">\r\n <ds-icon icon=\"workflow\" class=\"fs-24\"></ds-icon>\r\n </slot>\r\n </ds-button>\r\n <sat-popover\r\n #workflow [anchor]=\"workflowAnchor\" [hasBackdrop]=\"true\" verticalAlign=\"below\"\r\n horizontalAlign=\"end\">\r\n <div class=\"default-popover p-3\" style=\"min-width: 330px;\">\r\n <ds-approvals *ngIf=\"approvalHistory\" class=\"popover-approvals\" approvalsData=\"{{approvals}}\">\r\n </ds-approvals>\r\n </div>\r\n </sat-popover>\r\n </ng-container>\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n\r\n </header>\r\n </ng-container>-->\r\n}\r\n", styles: [".loading-width{min-width:100px;width:40px;flex-grow:1}.request-main-info{--item-bg: var(--light-gray);--item-fc: var(--black);--status-container-bc: #e8ebec;--status-container-brc: var(--dark-gray)}.request-main-info.warning{--item-bg: var(--yellow);--status-container-bc: #fff8d9;--status-container-brc: var(--yellow)}.request-main-info.pending{--item-bg: #eff0f1;--status-container-bc: #e8ebec;--status-container-brc: #c8ced1}.request-main-info.expired{--item-bg: var(--dark-gray);--status-container-bc: #e8ebec;--status-container-brc: var(--dark-gray)}.request-main-info.success{--item-bg: var(--green);--status-container-bc: #e6f9f4;--status-container-brc: var(--green)}.request-main-info.info{--item-bg: var(--sea-light);--status-container-bc: #fff8d9;--status-container-brc: var(--sea-light)}.request-main-info.danger{--item-bg: var(--red);--status-container-bc: #fae9ec;--status-container-brc: var(--red)}.request-main-info.orange,.request-main-info.send_back{--item-bg: var(--orange);--status-container-bc: #fff0eb;--status-container-brc: var(--orange)}.request-info{border-radius:0;box-shadow:var(--box-shadow);background-color:var(--white);border-top:5px solid var(--item-bg)}.request-info--footer{padding:.3rem 2rem;min-height:45px;display:flex;align-items:center;gap:.75rem;border-top:1px solid var(--light-gray)}@media (max-width: 578px){.request-info--footer{padding:.3rem 1rem}}.request-info--footer__details{color:var(--item-fc)}.request-info--body{padding:2rem;display:flex;align-items:center;gap:.75rem;background-color:#fff}@media (max-width: 578px){.request-info--body{padding:1rem;flex-direction:column;align-items:stretch}}.request-info--body figure{min-width:30px;width:30px;text-align:center}.request-info--body figure svg{width:100%}@media (max-width: 578px){.request-info--status-action{justify-content:space-between}}.request-info--history{margin-top:-.5rem}.request-info--comment{background-color:#fff0eb;color:var(--orange);border-radius:0 0 4px 4px}.status-container{min-height:40px;padding:.5rem 1rem;display:flex;flex-direction:column;justify-content:center;gap:.5rem;margin-bottom:1.5rem}.status-container.danger{--item-bg: var(--red);--status-container-bc: #fae9ec;--status-container-brc: var(--red)}.status-container ::ng-deep ds-avatar .avatar{--default-size: 18px}.circle-status::part(base){--status-radius: 50%;--status-size: 19px;--status-fs: 100%}ds-button[square]::part(base){--btn-padding: 0;--default-size-sm: 30px}.send-back-container{background-color:#fff0eb;color:var(--orange);padding:.5rem;border-radius:4px}object,iframe,embed{height:79vh}::ng-deep .history-popup{--popup-width: 100vw;--popup-max-width: 100vw;--popup-radius: 15px 15px 0 0;position:absolute!important;bottom:0}:host ::ng-deep .mat-expansion-panel-content{background:#fff!important}:host .main-sidenav.main-sidenav-full .sidenav-title{border-bottom:transparent!important}:host .main-sidenav .sidenav-title{background-color:transparent!important}:host .main-sidenav{height:60px;min-height:10px!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: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: SatPopoverModule }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
|
|
5814
5942
|
}
|
|
5815
5943
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: ServiceHeaderComponent, decorators: [{
|
|
5816
5944
|
type: Component,
|
|
@@ -5824,8 +5952,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImpor
|
|
|
5824
5952
|
MatMenuItem
|
|
5825
5953
|
], schemas: [CUSTOM_ELEMENTS_SCHEMA], providers: [FeedBackService,
|
|
5826
5954
|
{ provide: MAT_DIALOG_DATA, useValue: {} },
|
|
5827
|
-
], template: "@if (form?.header?.status?.['key'] === 'NEW') {\r\n <header class=\"mb-4 mt-4 d-flex align-items-center justify-content-between align-items-end gap-2\">\r\n <section>\r\n <h6 class=\"fs-14 fs-md-12 fw-normal fc-dark-gray mb-0\">\r\n {{ i18n.translate('Hello') }}\r\n {{ coreService.getShortName(form?.header?.requesterName) }}, {{ i18n.translate('welcomeBack') }}!\r\n </h6>\r\n <h1 class=\"fs-26 fs-md-20 fw-bold fc-black d-flex align-items-center gap-2 mb-1\">\r\n {{ formTitle }}\r\n @if (serviceFaq.length) {\r\n <ds-icon icon=\"info\" class=\"fs-22 fc-dark-gray cursor-pointer\" (click)=\"openFaq()\">\r\n </ds-icon>\r\n }\r\n </h1>\r\n </section>\r\n </header>\r\n} @else {\r\n\r\n <div class=\"w-100 mb-4\">\r\n\r\n <section class=\"request-main-info {{statusClass(form?.header?.status?.['key'])}}\">\r\n <section class=\"request-info\">\r\n <div class=\"request-info--body\">\r\n <div class=\"d-flex align-items-center gap-2 flex-grow-1\">\r\n <img\r\n alt=\"\"\r\n src=\"data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzAiIGhlaWdodD0iMjkiIHZpZXdCb3g9IjAgMCAzMCAyOSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTI1LjEgMEg0LjlDMi4yIDAgMCAyLjIgMCA0LjlWMjguNkgyNS4xQzI3LjggMjguNiAzMCAyNi40IDMwIDIzLjdWNC45QzMwIDIuMiAyNy44IDAgMjUuMSAwWk0yIDQuOUMyIDMuMyAzLjMgMiA0LjkgMkgyNS4xQzI2LjcgMiAyOCAzLjMgMjggNC45VjIzLjdDMjggMjUuMyAyNi43IDI2LjYgMjUuMSAyNi42SDJWNC45Wk0xMS41IDYuM0M3LjEgNi4zIDMuNSA5LjkgMy41IDE0LjNDMy41IDE4LjcgNy4xIDIyLjMgMTEuNSAyMi4zQzE1LjkgMjIuMyAxOS41IDE4LjcgMTkuNSAxNC4zQzE5LjUgOS45IDE1LjkgNi4zIDExLjUgNi4zWk0xNS4xIDE5QzE0LjEgMTkuOCAxMi44IDIwLjIgMTEuNSAyMC4yQzEwLjIgMjAuMiA4LjkgMTkuOCA3LjkgMTlDOC43IDE3LjcgMTAgMTcgMTEuNSAxN0MxMyAxNyAxNC40IDE3LjggMTUuMSAxOVpNMTMuMSAxMy40QzEzLjEgMTQuMyAxMi40IDE1IDExLjUgMTVDMTAuNiAxNSA5LjkgMTQuMyA5LjkgMTMuNEM5LjkgMTIuNSAxMC42IDExLjggMTEuNSAxMS44QzEyLjQgMTEuOCAxMy4xIDEyLjUgMTMuMSAxMy40Wk0xNS4xIDEzLjRDMTUuMSAxMS40IDEzLjUgOS44IDExLjUgOS44QzkuNSA5LjggNy45IDExLjQgNy45IDEzLjRDNy45IDE0LjIgOC4yIDE1IDguNyAxNS43QzcuOCAxNi4xIDcuMSAxNi44IDYuNSAxNy42QzUuOCAxNi42IDUuNSAxNS41IDUuNSAxNC4zQzUuNSAxMSA4LjIgOC4zIDExLjUgOC4zQzE0LjggOC4zIDE3LjUgMTEgMTcuNSAxNC4zQzE3LjUgMTUuNSAxNy4yIDE2LjYgMTYuNSAxNy42QzE1LjkgMTYuOCAxNS4yIDE2LjIgMTQuMyAxNS43QzE0LjggMTUuMSAxNS4xIDE0LjIgMTUuMSAxMy40Wk0yMSA5LjFDMjEgOC42IDIxLjQgOC4xIDIyIDguMUgyNS41QzI2IDguMSAyNi41IDguNSAyNi41IDkuMUMyNi41IDkuNiAyNi4xIDEwLjEgMjUuNSAxMC4xSDIyQzIxLjQgMTAuMSAyMSA5LjYgMjEgOS4xWk0yMSAxMi41QzIxIDEyIDIxLjQgMTEuNSAyMiAxMS41SDI1LjVDMjYgMTEuNSAyNi41IDExLjkgMjYuNSAxMi41QzI2LjUgMTMgMjYuMSAxMy41IDI1LjUgMTMuNUgyMkMyMS40IDEzLjUgMjEgMTMuMSAyMSAxMi41Wk0yMSAxNkMyMSAxNS41IDIxLjQgMTUgMjIgMTVIMjUuNUMyNiAxNSAyNi41IDE1LjQgMjYuNSAxNkMyNi41IDE2LjUgMjYuMSAxNyAyNS41IDE3SDIyQzIxLjQgMTcgMjEgMTYuNiAyMSAxNlpNMjUuNSAyMC41SDIyQzIxLjUgMjAuNSAyMSAyMC4xIDIxIDE5LjVDMjEgMTguOSAyMS40IDE4LjUgMjIgMTguNUgyNS41QzI2IDE4LjUgMjYuNSAxOC45IDI2LjUgMTkuNUMyNi41IDIwLjEgMjYuMSAyMC41IDI1LjUgMjAuNVoiIGZpbGw9IiNGRjM3NUUiLz4KPC9zdmc+Cg==\"/>\r\n <h4 class=\"fs-22 fs-md-16 fc-black fw-medium mb-0 flex-grow-1 line-height-1-2\">\r\n {{ formTitle }}\r\n </h4>\r\n </div>\r\n <div class=\"d-flex align-items-center gap-2 request-info--status-action\">\r\n <div class=\"d-inline-flex flex-column align-items-end\">\r\n @if (!isLoading) {\r\n <ds-status\r\n status=\"{{statusClass(form?.header?.status?.['key'])}}\" class=\"header-status\">{{ form?.header?.status?.['value'] }}\r\n </ds-status>\r\n }\r\n </div>\r\n <div class=\"d-flex align-items-center gap-2\">\r\n <ds-button\r\n *ngIf=\"form?.inboxItem && (form?.inboxItem?.canRequestFeedback =='true'|| form?.inboxItem?.hasFeedback=='true')\"\r\n square icon size=\"small\">\r\n <ds-icon icon=\"chat-o\" class=\"fs-20 fs-md-17 fc-coral\">\r\n <!-- [ngClass]=\"{'fc-green':feedBackIcon == 'feedbackResponded' , 'fc-red': feedBackIcon == 'respondToFeedback' , 'fc-yellow': feedBackIcon == 'waitingFeedback'}\"-->\r\n </ds-icon>\r\n </ds-button>\r\n <!-- comments-->\r\n <ds-button\r\n *ngIf=\"form?.commentsDrop?.length > 0 && !isLoading\" square icon size=\"small\"\r\n (click)=\"onCommentsFormClick()\" class=\"has-comments\">\r\n <ds-icon icon=\"clock\" class=\"fc-coral fs-20 fs-md-17\"></ds-icon>\r\n </ds-button>\r\n <ng-content></ng-content>\r\n <!-- <ds-button square icon size=\"small\" class=\"has-comments\">\r\n <ds-icon icon=\"clock\" class=\"fc-coral fs-20 fs-md-17\"></ds-icon>\r\n </ds-button>-->\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"request-info--footer\">\r\n <ds-avatar\r\n image=\"{{form?.header?.requesterPhoto}}\" size=\"xx-small\"\r\n class=\"d-inline-flex cursor-pointer\" (click)=\"showUserInfo()\"></ds-avatar>\r\n <div\r\n class=\"d-flex align-items-center flex-wrap flex-grow-1 gap-1 gap-sm-2 line-height-1 request-info--header__details\">\r\n\r\n <span\r\n class=\"fs-12 fw-medium d-none d-sm-inline-block\">{{ coreService.getShortName(form?.header?.['requesterName']) }}</span>\r\n <span class=\"fs-20\">•</span>\r\n <span class=\"fs-12\"> {{ form?.header?.formId }}</span>\r\n <span class=\"fs-20\" *ngIf=\"creationDate\">•</span>\r\n <span class=\"fs-12\"> {{ creationDate }}</span>\r\n </div>\r\n </div>\r\n </section>\r\n </section>\r\n\r\n </div>\r\n\r\n\r\n <!--<ng-container>\r\n <div class=\"d-flex align-items-center justify-content-end gap-2 my-2\">\r\n <ds-button\r\n *ngIf=\"form?.inboxItem && !form.sections[form.sections.length -1].header.readOnly && !isLoading\"\r\n square\r\n icon\r\n size=\"small\"\r\n [matMenuTriggerFor]=\"menu\"\r\n class=\"icon-btn-shadow\">\r\n <ds-icon\r\n [ngClass]=\"{'fc-purple' : (flagPriority === '0' || flagPriority === null),'fc-yellow' : flagPriority === '1','fc-green' : flagPriority === '2','fc-coral' : flagPriority === '3'}\"\r\n icon=\"flag-o\" class=\"fs-20 fs-md-17 fc-purple\">\r\n </ds-icon>\r\n </ds-button>\r\n <mat-menu #menu=\"matMenu\" panelClass=\"action-menu\">\r\n <button mat-menu-item (click)=\"setFlagPriority('0')\">\r\n <ds-icon icon=\"flag-o\" class=\"fc-purple fs-20 fs-md-17\"></ds-icon>\r\n </button>\r\n <button mat-menu-item (click)=\"setFlagPriority('1')\">\r\n <ds-icon icon=\"flag-o\" class=\"fc-yellow fs-20 fs-md-17\"></ds-icon>\r\n </button>\r\n <button mat-menu-item (click)=\"setFlagPriority('2')\">\r\n <ds-icon icon=\"flag-o\" class=\"fc-green fs-20 fs-md-17\"></ds-icon>\r\n </button>\r\n <button mat-menu-item (click)=\"setFlagPriority('3')\">\r\n <ds-icon icon=\"flag-o\" class=\"fc-coral fs-20 fs-md-17\"></ds-icon>\r\n </button>\r\n </mat-menu>\r\n\r\n <ng-content></ng-content>\r\n </div>\r\n <header class=\"service-header bc-white p-3 p-sm-4 py-4 gap-3 {{statusClass(form?.header?.status?.['key'])}}\">\r\n\r\n <div class=\"service-header-icon\">\r\n <img\r\n alt=\"\"\r\n src=\"data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzAiIGhlaWdodD0iMjkiIHZpZXdCb3g9IjAgMCAzMCAyOSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTI1LjEgMEg0LjlDMi4yIDAgMCAyLjIgMCA0LjlWMjguNkgyNS4xQzI3LjggMjguNiAzMCAyNi40IDMwIDIzLjdWNC45QzMwIDIuMiAyNy44IDAgMjUuMSAwWk0yIDQuOUMyIDMuMyAzLjMgMiA0LjkgMkgyNS4xQzI2LjcgMiAyOCAzLjMgMjggNC45VjIzLjdDMjggMjUuMyAyNi43IDI2LjYgMjUuMSAyNi42SDJWNC45Wk0xMS41IDYuM0M3LjEgNi4zIDMuNSA5LjkgMy41IDE0LjNDMy41IDE4LjcgNy4xIDIyLjMgMTEuNSAyMi4zQzE1LjkgMjIuMyAxOS41IDE4LjcgMTkuNSAxNC4zQzE5LjUgOS45IDE1LjkgNi4zIDExLjUgNi4zWk0xNS4xIDE5QzE0LjEgMTkuOCAxMi44IDIwLjIgMTEuNSAyMC4yQzEwLjIgMjAuMiA4LjkgMTkuOCA3LjkgMTlDOC43IDE3LjcgMTAgMTcgMTEuNSAxN0MxMyAxNyAxNC40IDE3LjggMTUuMSAxOVpNMTMuMSAxMy40QzEzLjEgMTQuMyAxMi40IDE1IDExLjUgMTVDMTAuNiAxNSA5LjkgMTQuMyA5LjkgMTMuNEM5LjkgMTIuNSAxMC42IDExLjggMTEuNSAxMS44QzEyLjQgMTEuOCAxMy4xIDEyLjUgMTMuMSAxMy40Wk0xNS4xIDEzLjRDMTUuMSAxMS40IDEzLjUgOS44IDExLjUgOS44QzkuNSA5LjggNy45IDExLjQgNy45IDEzLjRDNy45IDE0LjIgOC4yIDE1IDguNyAxNS43QzcuOCAxNi4xIDcuMSAxNi44IDYuNSAxNy42QzUuOCAxNi42IDUuNSAxNS41IDUuNSAxNC4zQzUuNSAxMSA4LjIgOC4zIDExLjUgOC4zQzE0LjggOC4zIDE3LjUgMTEgMTcuNSAxNC4zQzE3LjUgMTUuNSAxNy4yIDE2LjYgMTYuNSAxNy42QzE1LjkgMTYuOCAxNS4yIDE2LjIgMTQuMyAxNS43QzE0LjggMTUuMSAxNS4xIDE0LjIgMTUuMSAxMy40Wk0yMSA5LjFDMjEgOC42IDIxLjQgOC4xIDIyIDguMUgyNS41QzI2IDguMSAyNi41IDguNSAyNi41IDkuMUMyNi41IDkuNiAyNi4xIDEwLjEgMjUuNSAxMC4xSDIyQzIxLjQgMTAuMSAyMSA5LjYgMjEgOS4xWk0yMSAxMi41QzIxIDEyIDIxLjQgMTEuNSAyMiAxMS41SDI1LjVDMjYgMTEuNSAyNi41IDExLjkgMjYuNSAxMi41QzI2LjUgMTMgMjYuMSAxMy41IDI1LjUgMTMuNUgyMkMyMS40IDEzLjUgMjEgMTMuMSAyMSAxMi41Wk0yMSAxNkMyMSAxNS41IDIxLjQgMTUgMjIgMTVIMjUuNUMyNiAxNSAyNi41IDE1LjQgMjYuNSAxNkMyNi41IDE2LjUgMjYuMSAxNyAyNS41IDE3SDIyQzIxLjQgMTcgMjEgMTYuNiAyMSAxNlpNMjUuNSAyMC41SDIyQzIxLjUgMjAuNSAyMSAyMC4xIDIxIDE5LjVDMjEgMTguOSAyMS40IDE4LjUgMjIgMTguNUgyNS41QzI2IDE4LjUgMjYuNSAxOC45IDI2LjUgMTkuNUMyNi41IDIwLjEgMjYuMSAyMC41IDI1LjUgMjAuNVoiIGZpbGw9IiNGRjM3NUUiLz4KPC9zdmc+Cg==\"/>\r\n </div>\r\n\r\n <div class=\"flex-grow-1 d-flex flex-column flex-sm-row align-items-sm-center gap-2\">\r\n <div class=\"flex-grow-1\">\r\n <h1 class=\"fs-20 fs-md-16 fw-bold fc-black header-title m-0\">{{ formTitle }}\r\n @if (serviceFaq.length) {\r\n <ds-icon icon=\"info\" class=\"fs-22 fc-dark-gray cursor-pointer\" (click)=\"openFaq()\">\r\n </ds-icon>\r\n }\r\n </h1>\r\n <div class=\"header-user d-flex align-items-sm-center gap-2 mt-sm-1\">\r\n @if (!isLoading) {\r\n <ds-avatar\r\n image=\"{{form?.header?.requesterPhoto}}\" size=\"xx-small\"\r\n class=\"d-inline-flex cursor-pointer\" (click)=\"showUserInfo()\"></ds-avatar>\r\n }\r\n <span\r\n class=\"fs-12 text-truncate d-sm-block cursor-pointer\" (click)=\"showUserInfo()\"\r\n [ngClass]=\"{'loading-bg loading-width': isLoading}\">{{ coreService.getShortName(form?.header?.requesterName) }}</span>\r\n <mat-divider class=\"divider circle mx-2 d-none d-sm-block\"></mat-divider>\r\n <span class=\"fs-12\" [ngClass]=\"{'loading-bg loading-width': isLoading}\">{{ form?.header?.formId }}</span>\r\n @if (creationDate) {\r\n <mat-divider class=\"divider circle mx-2 d-none d-sm-block\"></mat-divider>\r\n <span class=\"fs-14\" [ngClass]=\"{'loading-bg loading-width': isLoading}\">{{ creationDate }}</span>\r\n }\r\n </div>\r\n\r\n </div>\r\n <div class=\"header-actions d-flex flex-row flex-sm-column justify-content-between justify-content-sm-center gap-2 mt-2 mt-sm-0\">\r\n @if (!isLoading) {\r\n <ds-status\r\n status=\"{{statusClass(form?.header?.status?.['key'])}}\" class=\"header-status\">{{ form?.header?.status?.['value'] }}\r\n </ds-status>\r\n }\r\n <div class=\"d-flex align-items-center justify-content-end gap-2\">\r\n <!– feedback–>\r\n <!– *ngIf=\"form?.inboxItem && (form?.inboxItem?.canRequestFeedback ==='true'|| form?.inboxItem?.hasFeedback==='true') && !isLoading\"–>\r\n <!– <ds-button\r\n square icon size=\"small\" (click)=\"feedback()\">\r\n <ds-icon\r\n icon=\"chat-o\" class=\"fs-20 fs-md-17 fc-coral\"\r\n [ngClass]=\"{'fc-green':feedBackIcon === 'feedbackResponded' , 'fc-red': feedBackIcon === 'respondToFeedback' , 'fc-yellow': feedBackIcon === 'waitingFeedback'}\">\r\n </ds-icon>\r\n </ds-button>–>\r\n <ds-button\r\n *ngIf=\"form?.commentsDrop?.length > 0 && !isLoading\" square icon size=\"small\"\r\n (click)=\"onCommentsFormClick()\" class=\"has-comments\">\r\n <ds-icon icon=\"clock\" class=\"fc-coral fs-20 fs-md-17\"></ds-icon>\r\n </ds-button>\r\n @if (showApprovalHistory) {\r\n <ng-container>\r\n <ds-button\r\n color=\"white\" shape=\"text\" square size=\"small\" [satPopoverAnchor]=\"workflow\"\r\n #workflowAnchor=\"satPopoverAnchor\" (click)=\"workflowAnchor.popover.open()\">\r\n <slot name=\"prefix\">\r\n <ds-icon icon=\"workflow\" class=\"fs-24\"></ds-icon>\r\n </slot>\r\n </ds-button>\r\n <sat-popover\r\n #workflow [anchor]=\"workflowAnchor\" [hasBackdrop]=\"true\" verticalAlign=\"below\"\r\n horizontalAlign=\"end\">\r\n <div class=\"default-popover p-3\" style=\"min-width: 330px;\">\r\n <ds-approvals *ngIf=\"approvalHistory\" class=\"popover-approvals\" approvalsData=\"{{approvals}}\">\r\n </ds-approvals>\r\n </div>\r\n </sat-popover>\r\n </ng-container>\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n\r\n </header>\r\n </ng-container>-->\r\n}\r\n", styles: [".request-main-info{--item-bg: var(--light-gray);--item-fc: var(--black);--status-container-bc: #e8ebec;--status-container-brc: var(--dark-gray)}.request-main-info.warning{--item-bg: var(--yellow);--status-container-bc: #fff8d9;--status-container-brc: var(--yellow)}.request-main-info.pending{--item-bg: #eff0f1;--status-container-bc: #e8ebec;--status-container-brc: #c8ced1}.request-main-info.expired{--item-bg: var(--dark-gray);--status-container-bc: #e8ebec;--status-container-brc: var(--dark-gray)}.request-main-info.success{--item-bg: var(--green);--status-container-bc: #e6f9f4;--status-container-brc: var(--green)}.request-main-info.info{--item-bg: var(--sea-light);--status-container-bc: #fff8d9;--status-container-brc: var(--sea-light)}.request-main-info.danger{--item-bg: var(--red);--status-container-bc: #fae9ec;--status-container-brc: var(--red)}.request-main-info.orange,.request-main-info.send_back{--item-bg: var(--orange);--status-container-bc: #fff0eb;--status-container-brc: var(--orange)}.request-info{border-radius:0;box-shadow:var(--box-shadow);background-color:var(--white);border-top:5px solid var(--item-bg)}.request-info--footer{padding:.3rem 2rem;min-height:45px;display:flex;align-items:center;gap:.75rem;border-top:1px solid var(--light-gray)}@media (max-width: 578px){.request-info--footer{padding:.3rem 1rem}}.request-info--footer__details{color:var(--item-fc)}.request-info--body{padding:2rem;display:flex;align-items:center;gap:.75rem;background-color:#fff}@media (max-width: 578px){.request-info--body{padding:1rem;flex-direction:column;align-items:stretch}}.request-info--body figure{min-width:30px;width:30px;text-align:center}.request-info--body figure svg{width:100%}@media (max-width: 578px){.request-info--status-action{justify-content:space-between}}.request-info--history{margin-top:-.5rem}.request-info--comment{background-color:#fff0eb;color:var(--orange);border-radius:0 0 4px 4px}.status-container{min-height:40px;padding:.5rem 1rem;display:flex;flex-direction:column;justify-content:center;gap:.5rem;margin-bottom:1.5rem;background-color:var(--status-container-bc);border-inline-start:4px solid var(--status-container-brc)}.status-container.danger{--item-bg: var(--red);--status-container-bc: #fae9ec;--status-container-brc: var(--red)}.status-container ::ng-deep ds-avatar .avatar{--default-size: 18px}.circle-status::part(base){--status-radius: 50%;--status-size: 19px;--status-fs: 100%}ds-button[square]::part(base){--btn-padding: 0;--default-size-sm: 30px}.send-back-container{background-color:#fff0eb;color:var(--orange);padding:.5rem;border-radius:4px}object,iframe,embed{height:79vh}::ng-deep .history-popup{--popup-width: 100vw;--popup-max-width: 100vw;--popup-radius: 15px 15px 0 0;position:absolute!important;bottom:0}: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}}.e-control.e-datepicker .e-control-wrapper{margin:0!important}\n"] }]
|
|
5828
|
-
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: CoreService }, { type: CoreI18nService }, { type: FeedBackService }, { type: i1$1.MatDialog }, { type: SidenavService }, { type: i3$
|
|
5955
|
+
], template: "@if (form?.header?.status?.['key'] === 'NEW') {\r\n <section\r\n class=\"main-sidenav main-sidenav-full mb-4\"\r\n\r\n >\r\n <div class=\"sidenav-title\">\r\n <div class=\"d-flex align-items-center gap-3 w-100\">\r\n <!-- <ds-button icon class=\"rotate-arrow\" size=\"small\" (click)=\"goBack()\" *ngIf=\"!isInMobileApp() && showBack\">\r\n <ds-icon icon=\"arrow-right\" class=\"fs-19 fc-black\"></ds-icon>\r\n </ds-button>-->\r\n\r\n <!-- <h3 class=\"flex-grow-0\">\r\n {{ formTitle }}\r\n </h3>-->\r\n\r\n <section>\r\n <h6 class=\"fs-14 fs-md-12 fw-normal fc-dark-gray mb-0\">\r\n {{ i18n.translate('Hello') }}\r\n {{ coreService.getShortName(form?.header?.requesterName) }}, {{ i18n.translate('welcomeBack') }}!\r\n </h6>\r\n <h1 class=\"fs-26 fs-md-20 fw-bold fc-black d-flex align-items-center gap-2 mb-1\">\r\n {{ formTitle }}\r\n @if (serviceFaq.length) {\r\n <ds-icon icon=\"info\" class=\"fs-22 fc-dark-gray cursor-pointer\" (click)=\"openFaq()\">\r\n </ds-icon>\r\n }\r\n </h1>\r\n </section>\r\n <div class=\"d-flex align-items-center justify-content-end gap-2 flex-grow-1\">\r\n @if (serviceFaq.length) {\r\n <ds-button size=\"small\" icon>\r\n <ds-icon icon=\"info\" class=\"fs-22 fc-dark-gray cursor-pointer\" (click)=\"openFaq()\">\r\n </ds-icon>\r\n </ds-button>\r\n }\r\n <!-- <ds-button size=\"small\" icon (click)=\"openWorkflow()\">\r\n <ds-icon icon=\"bell-2-o\" class=\"fs-20 fc-coral\"></ds-icon>\r\n </ds-button> -->\r\n <ds-button size=\"small\" icon (click)=\"showPreviousRequests()\" >\r\n <ds-icon icon=\"clock\" class=\"fs-20 fc-coral\"></ds-icon>\r\n </ds-button>\r\n </div>\r\n </div>\r\n </div>\r\n </section>\r\n\r\n <!-- <header class=\"mb-4 mt-4 d-flex align-items-center justify-content-between align-items-end gap-2\">\r\n <section>\r\n <h6 class=\"fs-14 fs-md-12 fw-normal fc-dark-gray mb-0\">\r\n {{ i18n.translate('Hello') }}\r\n {{ coreService.getShortName(form?.header?.requesterName) }}, {{ i18n.translate('welcomeBack') }}!\r\n </h6>\r\n <h1 class=\"fs-26 fs-md-20 fw-bold fc-black d-flex align-items-center gap-2 mb-1\">\r\n {{ formTitle }}\r\n @if (serviceFaq.length) {\r\n <ds-icon icon=\"info\" class=\"fs-22 fc-dark-gray cursor-pointer\" (click)=\"openFaq()\">\r\n </ds-icon>\r\n }\r\n </h1>\r\n </section>\r\n </header>-->\r\n} @else {\r\n\r\n <div class=\"w-100\">\r\n <section class=\"request-main-info {{statusClass(form?.header?.status?.['key'])}}\">\r\n <section class=\"request-info\">\r\n <div class=\"request-info--body\">\r\n <div class=\"d-flex align-items-center gap-2 flex-grow-1\">\r\n <img\r\n alt=\"\"\r\n src=\"data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzAiIGhlaWdodD0iMjkiIHZpZXdCb3g9IjAgMCAzMCAyOSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTI1LjEgMEg0LjlDMi4yIDAgMCAyLjIgMCA0LjlWMjguNkgyNS4xQzI3LjggMjguNiAzMCAyNi40IDMwIDIzLjdWNC45QzMwIDIuMiAyNy44IDAgMjUuMSAwWk0yIDQuOUMyIDMuMyAzLjMgMiA0LjkgMkgyNS4xQzI2LjcgMiAyOCAzLjMgMjggNC45VjIzLjdDMjggMjUuMyAyNi43IDI2LjYgMjUuMSAyNi42SDJWNC45Wk0xMS41IDYuM0M3LjEgNi4zIDMuNSA5LjkgMy41IDE0LjNDMy41IDE4LjcgNy4xIDIyLjMgMTEuNSAyMi4zQzE1LjkgMjIuMyAxOS41IDE4LjcgMTkuNSAxNC4zQzE5LjUgOS45IDE1LjkgNi4zIDExLjUgNi4zWk0xNS4xIDE5QzE0LjEgMTkuOCAxMi44IDIwLjIgMTEuNSAyMC4yQzEwLjIgMjAuMiA4LjkgMTkuOCA3LjkgMTlDOC43IDE3LjcgMTAgMTcgMTEuNSAxN0MxMyAxNyAxNC40IDE3LjggMTUuMSAxOVpNMTMuMSAxMy40QzEzLjEgMTQuMyAxMi40IDE1IDExLjUgMTVDMTAuNiAxNSA5LjkgMTQuMyA5LjkgMTMuNEM5LjkgMTIuNSAxMC42IDExLjggMTEuNSAxMS44QzEyLjQgMTEuOCAxMy4xIDEyLjUgMTMuMSAxMy40Wk0xNS4xIDEzLjRDMTUuMSAxMS40IDEzLjUgOS44IDExLjUgOS44QzkuNSA5LjggNy45IDExLjQgNy45IDEzLjRDNy45IDE0LjIgOC4yIDE1IDguNyAxNS43QzcuOCAxNi4xIDcuMSAxNi44IDYuNSAxNy42QzUuOCAxNi42IDUuNSAxNS41IDUuNSAxNC4zQzUuNSAxMSA4LjIgOC4zIDExLjUgOC4zQzE0LjggOC4zIDE3LjUgMTEgMTcuNSAxNC4zQzE3LjUgMTUuNSAxNy4yIDE2LjYgMTYuNSAxNy42QzE1LjkgMTYuOCAxNS4yIDE2LjIgMTQuMyAxNS43QzE0LjggMTUuMSAxNS4xIDE0LjIgMTUuMSAxMy40Wk0yMSA5LjFDMjEgOC42IDIxLjQgOC4xIDIyIDguMUgyNS41QzI2IDguMSAyNi41IDguNSAyNi41IDkuMUMyNi41IDkuNiAyNi4xIDEwLjEgMjUuNSAxMC4xSDIyQzIxLjQgMTAuMSAyMSA5LjYgMjEgOS4xWk0yMSAxMi41QzIxIDEyIDIxLjQgMTEuNSAyMiAxMS41SDI1LjVDMjYgMTEuNSAyNi41IDExLjkgMjYuNSAxMi41QzI2LjUgMTMgMjYuMSAxMy41IDI1LjUgMTMuNUgyMkMyMS40IDEzLjUgMjEgMTMuMSAyMSAxMi41Wk0yMSAxNkMyMSAxNS41IDIxLjQgMTUgMjIgMTVIMjUuNUMyNiAxNSAyNi41IDE1LjQgMjYuNSAxNkMyNi41IDE2LjUgMjYuMSAxNyAyNS41IDE3SDIyQzIxLjQgMTcgMjEgMTYuNiAyMSAxNlpNMjUuNSAyMC41SDIyQzIxLjUgMjAuNSAyMSAyMC4xIDIxIDE5LjVDMjEgMTguOSAyMS40IDE4LjUgMjIgMTguNUgyNS41QzI2IDE4LjUgMjYuNSAxOC45IDI2LjUgMTkuNUMyNi41IDIwLjEgMjYuMSAyMC41IDI1LjUgMjAuNVoiIGZpbGw9IiNGRjM3NUUiLz4KPC9zdmc+Cg==\"/>\r\n <h4 class=\"fs-22 fs-md-16 fc-black fw-medium mb-0 flex-grow-1 line-height-1-2\">\r\n {{ formTitle }}\r\n </h4>\r\n </div>\r\n <div class=\"d-flex align-items-center gap-2 request-info--status-action\">\r\n <div class=\"d-inline-flex flex-column align-items-end\">\r\n @if (!isLoading) {\r\n <ds-status\r\n status=\"{{statusClass(form?.header?.status?.['key'])}}\" class=\"header-status\">{{ form?.header?.status?.['value'] }}\r\n </ds-status>\r\n }\r\n </div>\r\n <div class=\"d-flex align-items-center gap-2\">\r\n <!-- <ds-button\r\n *ngIf=\"form?.inboxItem && (form?.inboxItem?.canRequestFeedback =='true'|| form?.inboxItem?.hasFeedback=='true')\"\r\n square icon size=\"small\">\r\n <ds-icon icon=\"chat-o\" class=\"fs-20 fs-md-17 fc-coral\">\r\n <!– [ngClass]=\"{'fc-green':feedBackIcon == 'feedbackResponded' , 'fc-red': feedBackIcon == 'respondToFeedback' , 'fc-yellow': feedBackIcon == 'waitingFeedback'}\"–>\r\n </ds-icon>\r\n </ds-button>-->\r\n <!-- history-->\r\n <ds-button\r\n *ngIf=\"form?.commentsDrop?.length > 0 && !isLoading\" square icon size=\"small\"\r\n (click)=\"onCommentsFormClick()\" class=\"has-comments\">\r\n <ds-icon icon=\"clock\" class=\"fc-coral fs-20 fs-md-17\"></ds-icon>\r\n </ds-button>\r\n <ng-content></ng-content>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"request-info--footer\">\r\n @if (!isLoading) {\r\n <ds-avatar\r\n image=\"{{form?.header?.requesterPhoto}}\" size=\"xx-small\"\r\n class=\"d-inline-flex cursor-pointer\" (click)=\"showUserInfo()\"></ds-avatar>\r\n }\r\n <div\r\n class=\"d-flex align-items-center flex-wrap flex-grow-1 gap-1 gap-sm-2 line-height-1 request-info--header__details\">\r\n <span\r\n [ngClass]=\"{'loading-bg loading-width': isLoading}\"\r\n class=\"fs-12 fw-medium d-none d-sm-inline-block\">{{ coreService.getShortName(form?.header?.['requesterName']) }}</span>\r\n <span class=\"fs-20\">•</span>\r\n <span class=\"fs-12\" [ngClass]=\"{'loading-bg loading-width': isLoading}\"> {{ form?.header?.formId }}</span>\r\n <span class=\"fs-20\" *ngIf=\"creationDate\">•</span>\r\n <span class=\"fs-12\" [ngClass]=\"{'loading-bg loading-width': isLoading}\"> {{ creationDate }}</span>\r\n </div>\r\n </div>\r\n </section>\r\n </section>\r\n\r\n </div>\r\n\r\n\r\n <!--<ng-container>\r\n <div class=\"d-flex align-items-center justify-content-end gap-2 my-2\">\r\n <ds-button\r\n *ngIf=\"form?.inboxItem && !form.sections[form.sections.length -1].header.readOnly && !isLoading\"\r\n square\r\n icon\r\n size=\"small\"\r\n [matMenuTriggerFor]=\"menu\"\r\n class=\"icon-btn-shadow\">\r\n <ds-icon\r\n [ngClass]=\"{'fc-purple' : (flagPriority === '0' || flagPriority === null),'fc-yellow' : flagPriority === '1','fc-green' : flagPriority === '2','fc-coral' : flagPriority === '3'}\"\r\n icon=\"flag-o\" class=\"fs-20 fs-md-17 fc-purple\">\r\n </ds-icon>\r\n </ds-button>\r\n <mat-menu #menu=\"matMenu\" panelClass=\"action-menu\">\r\n <button mat-menu-item (click)=\"setFlagPriority('0')\">\r\n <ds-icon icon=\"flag-o\" class=\"fc-purple fs-20 fs-md-17\"></ds-icon>\r\n </button>\r\n <button mat-menu-item (click)=\"setFlagPriority('1')\">\r\n <ds-icon icon=\"flag-o\" class=\"fc-yellow fs-20 fs-md-17\"></ds-icon>\r\n </button>\r\n <button mat-menu-item (click)=\"setFlagPriority('2')\">\r\n <ds-icon icon=\"flag-o\" class=\"fc-green fs-20 fs-md-17\"></ds-icon>\r\n </button>\r\n <button mat-menu-item (click)=\"setFlagPriority('3')\">\r\n <ds-icon icon=\"flag-o\" class=\"fc-coral fs-20 fs-md-17\"></ds-icon>\r\n </button>\r\n </mat-menu>\r\n\r\n <ng-content></ng-content>\r\n </div>\r\n <header class=\"service-header bc-white p-3 p-sm-4 py-4 gap-3 {{statusClass(form?.header?.status?.['key'])}}\">\r\n\r\n <div class=\"service-header-icon\">\r\n <img\r\n alt=\"\"\r\n src=\"data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzAiIGhlaWdodD0iMjkiIHZpZXdCb3g9IjAgMCAzMCAyOSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTI1LjEgMEg0LjlDMi4yIDAgMCAyLjIgMCA0LjlWMjguNkgyNS4xQzI3LjggMjguNiAzMCAyNi40IDMwIDIzLjdWNC45QzMwIDIuMiAyNy44IDAgMjUuMSAwWk0yIDQuOUMyIDMuMyAzLjMgMiA0LjkgMkgyNS4xQzI2LjcgMiAyOCAzLjMgMjggNC45VjIzLjdDMjggMjUuMyAyNi43IDI2LjYgMjUuMSAyNi42SDJWNC45Wk0xMS41IDYuM0M3LjEgNi4zIDMuNSA5LjkgMy41IDE0LjNDMy41IDE4LjcgNy4xIDIyLjMgMTEuNSAyMi4zQzE1LjkgMjIuMyAxOS41IDE4LjcgMTkuNSAxNC4zQzE5LjUgOS45IDE1LjkgNi4zIDExLjUgNi4zWk0xNS4xIDE5QzE0LjEgMTkuOCAxMi44IDIwLjIgMTEuNSAyMC4yQzEwLjIgMjAuMiA4LjkgMTkuOCA3LjkgMTlDOC43IDE3LjcgMTAgMTcgMTEuNSAxN0MxMyAxNyAxNC40IDE3LjggMTUuMSAxOVpNMTMuMSAxMy40QzEzLjEgMTQuMyAxMi40IDE1IDExLjUgMTVDMTAuNiAxNSA5LjkgMTQuMyA5LjkgMTMuNEM5LjkgMTIuNSAxMC42IDExLjggMTEuNSAxMS44QzEyLjQgMTEuOCAxMy4xIDEyLjUgMTMuMSAxMy40Wk0xNS4xIDEzLjRDMTUuMSAxMS40IDEzLjUgOS44IDExLjUgOS44QzkuNSA5LjggNy45IDExLjQgNy45IDEzLjRDNy45IDE0LjIgOC4yIDE1IDguNyAxNS43QzcuOCAxNi4xIDcuMSAxNi44IDYuNSAxNy42QzUuOCAxNi42IDUuNSAxNS41IDUuNSAxNC4zQzUuNSAxMSA4LjIgOC4zIDExLjUgOC4zQzE0LjggOC4zIDE3LjUgMTEgMTcuNSAxNC4zQzE3LjUgMTUuNSAxNy4yIDE2LjYgMTYuNSAxNy42QzE1LjkgMTYuOCAxNS4yIDE2LjIgMTQuMyAxNS43QzE0LjggMTUuMSAxNS4xIDE0LjIgMTUuMSAxMy40Wk0yMSA5LjFDMjEgOC42IDIxLjQgOC4xIDIyIDguMUgyNS41QzI2IDguMSAyNi41IDguNSAyNi41IDkuMUMyNi41IDkuNiAyNi4xIDEwLjEgMjUuNSAxMC4xSDIyQzIxLjQgMTAuMSAyMSA5LjYgMjEgOS4xWk0yMSAxMi41QzIxIDEyIDIxLjQgMTEuNSAyMiAxMS41SDI1LjVDMjYgMTEuNSAyNi41IDExLjkgMjYuNSAxMi41QzI2LjUgMTMgMjYuMSAxMy41IDI1LjUgMTMuNUgyMkMyMS40IDEzLjUgMjEgMTMuMSAyMSAxMi41Wk0yMSAxNkMyMSAxNS41IDIxLjQgMTUgMjIgMTVIMjUuNUMyNiAxNSAyNi41IDE1LjQgMjYuNSAxNkMyNi41IDE2LjUgMjYuMSAxNyAyNS41IDE3SDIyQzIxLjQgMTcgMjEgMTYuNiAyMSAxNlpNMjUuNSAyMC41SDIyQzIxLjUgMjAuNSAyMSAyMC4xIDIxIDE5LjVDMjEgMTguOSAyMS40IDE4LjUgMjIgMTguNUgyNS41QzI2IDE4LjUgMjYuNSAxOC45IDI2LjUgMTkuNUMyNi41IDIwLjEgMjYuMSAyMC41IDI1LjUgMjAuNVoiIGZpbGw9IiNGRjM3NUUiLz4KPC9zdmc+Cg==\"/>\r\n </div>\r\n\r\n <div class=\"flex-grow-1 d-flex flex-column flex-sm-row align-items-sm-center gap-2\">\r\n <div class=\"flex-grow-1\">\r\n <h1 class=\"fs-20 fs-md-16 fw-bold fc-black header-title m-0\">{{ formTitle }}\r\n @if (serviceFaq.length) {\r\n <ds-icon icon=\"info\" class=\"fs-22 fc-dark-gray cursor-pointer\" (click)=\"openFaq()\">\r\n </ds-icon>\r\n }\r\n </h1>\r\n <div class=\"header-user d-flex align-items-sm-center gap-2 mt-sm-1\">\r\n @if (!isLoading) {\r\n <ds-avatar\r\n image=\"{{form?.header?.requesterPhoto}}\" size=\"xx-small\"\r\n class=\"d-inline-flex cursor-pointer\" (click)=\"showUserInfo()\"></ds-avatar>\r\n }\r\n <span\r\n class=\"fs-12 text-truncate d-sm-block cursor-pointer\" (click)=\"showUserInfo()\"\r\n [ngClass]=\"{'loading-bg loading-width': isLoading}\">{{ coreService.getShortName(form?.header?.requesterName) }}</span>\r\n <mat-divider class=\"divider circle mx-2 d-none d-sm-block\"></mat-divider>\r\n <span class=\"fs-12\" [ngClass]=\"{'loading-bg loading-width': isLoading}\">{{ form?.header?.formId }}</span>\r\n @if (creationDate) {\r\n <mat-divider class=\"divider circle mx-2 d-none d-sm-block\"></mat-divider>\r\n <span class=\"fs-14\" [ngClass]=\"{'loading-bg loading-width': isLoading}\">{{ creationDate }}</span>\r\n }\r\n </div>\r\n\r\n </div>\r\n <div class=\"header-actions d-flex flex-row flex-sm-column justify-content-between justify-content-sm-center gap-2 mt-2 mt-sm-0\">\r\n @if (!isLoading) {\r\n <ds-status\r\n status=\"{{statusClass(form?.header?.status?.['key'])}}\" class=\"header-status\">{{ form?.header?.status?.['value'] }}\r\n </ds-status>\r\n }\r\n <div class=\"d-flex align-items-center justify-content-end gap-2\">\r\n <!– feedback–>\r\n <!– *ngIf=\"form?.inboxItem && (form?.inboxItem?.canRequestFeedback ==='true'|| form?.inboxItem?.hasFeedback==='true') && !isLoading\"–>\r\n <!– <ds-button\r\n square icon size=\"small\" (click)=\"feedback()\">\r\n <ds-icon\r\n icon=\"chat-o\" class=\"fs-20 fs-md-17 fc-coral\"\r\n [ngClass]=\"{'fc-green':feedBackIcon === 'feedbackResponded' , 'fc-red': feedBackIcon === 'respondToFeedback' , 'fc-yellow': feedBackIcon === 'waitingFeedback'}\">\r\n </ds-icon>\r\n </ds-button>–>\r\n <ds-button\r\n *ngIf=\"form?.commentsDrop?.length > 0 && !isLoading\" square icon size=\"small\"\r\n (click)=\"onCommentsFormClick()\" class=\"has-comments\">\r\n <ds-icon icon=\"clock\" class=\"fc-coral fs-20 fs-md-17\"></ds-icon>\r\n </ds-button>\r\n @if (showApprovalHistory) {\r\n <ng-container>\r\n <ds-button\r\n color=\"white\" shape=\"text\" square size=\"small\" [satPopoverAnchor]=\"workflow\"\r\n #workflowAnchor=\"satPopoverAnchor\" (click)=\"workflowAnchor.popover.open()\">\r\n <slot name=\"prefix\">\r\n <ds-icon icon=\"workflow\" class=\"fs-24\"></ds-icon>\r\n </slot>\r\n </ds-button>\r\n <sat-popover\r\n #workflow [anchor]=\"workflowAnchor\" [hasBackdrop]=\"true\" verticalAlign=\"below\"\r\n horizontalAlign=\"end\">\r\n <div class=\"default-popover p-3\" style=\"min-width: 330px;\">\r\n <ds-approvals *ngIf=\"approvalHistory\" class=\"popover-approvals\" approvalsData=\"{{approvals}}\">\r\n </ds-approvals>\r\n </div>\r\n </sat-popover>\r\n </ng-container>\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n\r\n </header>\r\n </ng-container>-->\r\n}\r\n", styles: [".loading-width{min-width:100px;width:40px;flex-grow:1}.request-main-info{--item-bg: var(--light-gray);--item-fc: var(--black);--status-container-bc: #e8ebec;--status-container-brc: var(--dark-gray)}.request-main-info.warning{--item-bg: var(--yellow);--status-container-bc: #fff8d9;--status-container-brc: var(--yellow)}.request-main-info.pending{--item-bg: #eff0f1;--status-container-bc: #e8ebec;--status-container-brc: #c8ced1}.request-main-info.expired{--item-bg: var(--dark-gray);--status-container-bc: #e8ebec;--status-container-brc: var(--dark-gray)}.request-main-info.success{--item-bg: var(--green);--status-container-bc: #e6f9f4;--status-container-brc: var(--green)}.request-main-info.info{--item-bg: var(--sea-light);--status-container-bc: #fff8d9;--status-container-brc: var(--sea-light)}.request-main-info.danger{--item-bg: var(--red);--status-container-bc: #fae9ec;--status-container-brc: var(--red)}.request-main-info.orange,.request-main-info.send_back{--item-bg: var(--orange);--status-container-bc: #fff0eb;--status-container-brc: var(--orange)}.request-info{border-radius:0;box-shadow:var(--box-shadow);background-color:var(--white);border-top:5px solid var(--item-bg)}.request-info--footer{padding:.3rem 2rem;min-height:45px;display:flex;align-items:center;gap:.75rem;border-top:1px solid var(--light-gray)}@media (max-width: 578px){.request-info--footer{padding:.3rem 1rem}}.request-info--footer__details{color:var(--item-fc)}.request-info--body{padding:2rem;display:flex;align-items:center;gap:.75rem;background-color:#fff}@media (max-width: 578px){.request-info--body{padding:1rem;flex-direction:column;align-items:stretch}}.request-info--body figure{min-width:30px;width:30px;text-align:center}.request-info--body figure svg{width:100%}@media (max-width: 578px){.request-info--status-action{justify-content:space-between}}.request-info--history{margin-top:-.5rem}.request-info--comment{background-color:#fff0eb;color:var(--orange);border-radius:0 0 4px 4px}.status-container{min-height:40px;padding:.5rem 1rem;display:flex;flex-direction:column;justify-content:center;gap:.5rem;margin-bottom:1.5rem}.status-container.danger{--item-bg: var(--red);--status-container-bc: #fae9ec;--status-container-brc: var(--red)}.status-container ::ng-deep ds-avatar .avatar{--default-size: 18px}.circle-status::part(base){--status-radius: 50%;--status-size: 19px;--status-fs: 100%}ds-button[square]::part(base){--btn-padding: 0;--default-size-sm: 30px}.send-back-container{background-color:#fff0eb;color:var(--orange);padding:.5rem;border-radius:4px}object,iframe,embed{height:79vh}::ng-deep .history-popup{--popup-width: 100vw;--popup-max-width: 100vw;--popup-radius: 15px 15px 0 0;position:absolute!important;bottom:0}:host ::ng-deep .mat-expansion-panel-content{background:#fff!important}:host .main-sidenav.main-sidenav-full .sidenav-title{border-bottom:transparent!important}:host .main-sidenav .sidenav-title{background-color:transparent!important}:host .main-sidenav{height:60px;min-height:10px!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"] }]
|
|
5956
|
+
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: CoreService }, { type: CoreI18nService }, { type: FeedBackService }, { type: i1$1.MatDialog }, { type: SidenavService }, { type: i3$2.ToastrService }], propDecorators: { form: [{
|
|
5829
5957
|
type: Input
|
|
5830
5958
|
}], showHistory: [{
|
|
5831
5959
|
type: Input
|
|
@@ -6085,7 +6213,7 @@ class FormSectionComponent {
|
|
|
6085
6213
|
return statusStrategy.icon;
|
|
6086
6214
|
}
|
|
6087
6215
|
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 });
|
|
6088
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.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 class=\"mb-4\" [expanded]=\"isExpanded\" hideToggle #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 @if (section.header?.processedBy) {\r\n <bdi class=\"fs-12 fc-dark-gray fw-normal line-height-1 d-block mt-1\">\r\n {{ processingDate }}\r\n </bdi>\r\n }\r\n </div>\r\n </div>\r\n <div class=\"approval-panel-details gap-1\">\r\n @if (!section?.body?.details?.['stage0']?.['isStage0'] || section?.body?.details?.['stage0']?.['isStage0'] === 'false') {\r\n <ng-container>\r\n @if (section?.header?.personTo) {\r\n <div\r\n class=\"d-flex align-items-center gap-3\"\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 @if (!section?.header?.delegatedTo) {\r\n <span\r\n class=\"fs-14 fw-medium d-inline-block panel-user-name text-truncate\"\r\n [ngClass]=\"{'panel-user-only': !section?.header?.delegatedTo}\"\r\n >{{ section?.header?.personTo }}</span>\r\n }\r\n </div>\r\n @if (section?.header?.delegatedTo) {\r\n <div\r\n 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 </div>\r\n }\r\n </div>\r\n }\r\n </ng-container>\r\n }\r\n\r\n @if (section?.body?.details?.['decision']?.key) {\r\n <ds-status\r\n class=\"main-status\"\r\n status=\"{{statusClass(section?.body?.details?.['decision']?.key)}}\">{{ section?.body?.details?.['decision']?.value }}\r\n </ds-status>\r\n }\r\n </div>\r\n\r\n <div class=\"approval-panel-toggle\">\r\n @if (approvalPanel.expanded) {\r\n <ds-icon icon=\"minus\" class=\"fs-20 fc-dark-gray\"></ds-icon>\r\n } @else {\r\n <ds-icon icon=\"plus-1\" class=\"fs-20 fc-coral\"></ds-icon>\r\n }\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", 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$3.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["hideToggle", "togglePosition"], outputs: ["afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "component", type: i2$3.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["expandedHeight", "collapsedHeight", "tabIndex"] }, { 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$
|
|
6216
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.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 class=\"mb-4\" [expanded]=\"isExpanded\" hideToggle #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 @if (section.header?.processedBy) {\r\n <bdi class=\"fs-12 fc-dark-gray fw-normal line-height-1 d-block mt-1\">\r\n {{ processingDate }}\r\n </bdi>\r\n }\r\n </div>\r\n </div>\r\n <div class=\"approval-panel-details gap-1\">\r\n @if (!section?.body?.details?.['stage0']?.['isStage0'] || section?.body?.details?.['stage0']?.['isStage0'] === 'false') {\r\n <ng-container>\r\n @if (section?.header?.personTo) {\r\n <div\r\n class=\"d-flex align-items-center gap-3\"\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 @if (!section?.header?.delegatedTo) {\r\n <span\r\n class=\"fs-14 fw-medium d-inline-block panel-user-name text-truncate\"\r\n [ngClass]=\"{'panel-user-only': !section?.header?.delegatedTo}\"\r\n >{{ section?.header?.personTo }}</span>\r\n }\r\n </div>\r\n @if (section?.header?.delegatedTo) {\r\n <div\r\n 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 </div>\r\n }\r\n </div>\r\n }\r\n </ng-container>\r\n }\r\n\r\n @if (section?.body?.details?.['decision']?.key) {\r\n <ds-status\r\n class=\"main-status\"\r\n status=\"{{statusClass(section?.body?.details?.['decision']?.key)}}\">{{ section?.body?.details?.['decision']?.value }}\r\n </ds-status>\r\n }\r\n </div>\r\n\r\n <div class=\"approval-panel-toggle\">\r\n @if (approvalPanel.expanded) {\r\n <ds-icon icon=\"minus\" class=\"fs-20 fc-dark-gray\"></ds-icon>\r\n } @else {\r\n <ds-icon icon=\"plus-1\" class=\"fs-20 fc-coral\"></ds-icon>\r\n }\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", 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$3.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["hideToggle", "togglePosition"], outputs: ["afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "component", type: i2$3.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["expandedHeight", "collapsedHeight", "tabIndex"] }, { 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$3.ComponentOutletInjectorDirective, selector: "[ngComponentOutlet]", exportAs: ["ndcComponentOutletInjector"] }] });
|
|
6089
6217
|
}
|
|
6090
6218
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: FormSectionComponent, decorators: [{
|
|
6091
6219
|
type: Component,
|
|
@@ -6373,7 +6501,7 @@ class HeaderComponent {
|
|
|
6373
6501
|
}
|
|
6374
6502
|
location = location;
|
|
6375
6503
|
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$4.Router }, { token: PLATFORM_ID }], target: i0.ɵɵFactoryTarget.Component });
|
|
6376
|
-
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:
|
|
6504
|
+
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: i3.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"] }] });
|
|
6377
6505
|
}
|
|
6378
6506
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: HeaderComponent, decorators: [{
|
|
6379
6507
|
type: Component,
|
|
@@ -6527,7 +6655,7 @@ class SideNavComponent {
|
|
|
6527
6655
|
this.router.navigate([url]);
|
|
6528
6656
|
}
|
|
6529
6657
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SideNavComponent, deps: [{ token: SidenavService }, { token: i2$4.Router }], target: i0.ɵɵFactoryTarget.Component });
|
|
6530
|
-
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$
|
|
6658
|
+
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$4.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"] }] });
|
|
6531
6659
|
}
|
|
6532
6660
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SideNavComponent, decorators: [{
|
|
6533
6661
|
type: Component,
|
|
@@ -6592,7 +6720,7 @@ class LayoutComponent {
|
|
|
6592
6720
|
this.sidenav.close().then(r => { });
|
|
6593
6721
|
}
|
|
6594
6722
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: LayoutComponent, deps: [{ token: DOCUMENT }, { token: i2$4.Router }, { token: SidenavService }], target: i0.ɵɵFactoryTarget.Component });
|
|
6595
|
-
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$
|
|
6723
|
+
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$5.MatSidenav, selector: "mat-sidenav", inputs: ["fixedInViewport", "fixedTopGap", "fixedBottomGap"], exportAs: ["matSidenav"] }, { kind: "component", type: i3$5.MatSidenavContainer, selector: "mat-sidenav-container", exportAs: ["matSidenavContainer"] }, { kind: "component", type: i3$5.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"] }] });
|
|
6596
6724
|
}
|
|
6597
6725
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: LayoutComponent, decorators: [{
|
|
6598
6726
|
type: Component,
|