bpm-core 0.0.103 → 0.0.104
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/fesm2022/bpm-core.mjs +226 -229
- package/fesm2022/bpm-core.mjs.map +1 -1
- package/lib/components/shared-components/form-field/checkbox/checkbox.component.d.ts +2 -1
- package/lib/components/shared-components/form-field/control-value-accessor.directive.d.ts +1 -1
- package/lib/components/shared-components/form-field/shared-imports.d.ts +1 -1
- package/lib/components/shared-components/form-field/textarea/special-chars.directive.d.ts +1 -1
- package/lib/components/shared-components/title-section/title-section.component.d.ts +1 -1
- package/lib/pipes/currency.pipe.d.ts +1 -1
- package/lib/pipes/format-as-password.pipe.d.ts +1 -1
- package/lib/validators/string-to-boolean.pipe.d.ts +1 -1
- package/lib/validators/text.directive.d.ts +1 -1
- package/lib/validators/timer.pipe.d.ts +1 -1
- package/package.json +2 -4
- package/esm2022/bpm-core.mjs +0 -5
- package/esm2022/lib/app/app.component.mjs +0 -79
- package/esm2022/lib/classes/form-validation.mjs +0 -80
- package/esm2022/lib/classes/index.mjs +0 -2
- package/esm2022/lib/components/app-component-sections/activities/activities.component.mjs +0 -44
- package/esm2022/lib/components/app-component-sections/approvals/approvals.component.mjs +0 -23
- package/esm2022/lib/components/app-component-sections/approvals-workflow/approvals-workflow.component.mjs +0 -113
- package/esm2022/lib/components/app-component-sections/faq-sidenav/faq-sidenav.component.mjs +0 -25
- package/esm2022/lib/components/app-component-sections/faqs/faqs.component.mjs +0 -27
- package/esm2022/lib/components/app-component-sections/faqs/index.mjs +0 -2
- package/esm2022/lib/components/app-component-sections/feedback-section/feedback-section.component.mjs +0 -237
- package/esm2022/lib/components/app-component-sections/form-section/form-section.component.mjs +0 -255
- package/esm2022/lib/components/app-component-sections/index.mjs +0 -9
- package/esm2022/lib/components/app-component-sections/layout/header/header.component.mjs +0 -79
- package/esm2022/lib/components/app-component-sections/layout/layout.component.mjs +0 -89
- package/esm2022/lib/components/app-component-sections/layout/side-nav/side-nav.component.mjs +0 -158
- package/esm2022/lib/components/app-component-sections/main-request-details/main-request-details.component.mjs +0 -34
- package/esm2022/lib/components/app-component-sections/previous-requests/previous-requests.component.mjs +0 -345
- package/esm2022/lib/components/app-component-sections/profile-section/profile-section.component.mjs +0 -45
- package/esm2022/lib/components/app-component-sections/service-header/service-header.component.mjs +0 -271
- package/esm2022/lib/components/app-component-sections/status/status.component.mjs +0 -38
- package/esm2022/lib/components/app-component-sections/workflow-section/workflow-section.component.mjs +0 -164
- package/esm2022/lib/components/shared-components/action-buttons/action-buttons.component.mjs +0 -138
- package/esm2022/lib/components/shared-components/dialogs/confirm-dialog/confirm-dialog.component.mjs +0 -30
- package/esm2022/lib/components/shared-components/dialogs/delete-dialog/delete-dialog.component.mjs +0 -29
- package/esm2022/lib/components/shared-components/dialogs/submit-dialog/submit-dialog.component.mjs +0 -67
- package/esm2022/lib/components/shared-components/form-field/add-attachment-section/add-attachment-section.component.mjs +0 -138
- package/esm2022/lib/components/shared-components/form-field/attachment-section/attachment-section.component.mjs +0 -234
- package/esm2022/lib/components/shared-components/form-field/base-component/base-component.component.mjs +0 -198
- package/esm2022/lib/components/shared-components/form-field/checkbox/checkbox.component.mjs +0 -91
- package/esm2022/lib/components/shared-components/form-field/control-value-accessor.directive.mjs +0 -185
- package/esm2022/lib/components/shared-components/form-field/custom-searchable-autocomplete/custom-searchable.component.mjs +0 -131
- package/esm2022/lib/components/shared-components/form-field/date-picker/date-format.mjs +0 -31
- package/esm2022/lib/components/shared-components/form-field/date-picker/date-picker.component.mjs +0 -175
- package/esm2022/lib/components/shared-components/form-field/date-range-picker/date-range-picker.component.mjs +0 -186
- package/esm2022/lib/components/shared-components/form-field/doc-uploader/docs-uploader.component.mjs +0 -525
- package/esm2022/lib/components/shared-components/form-field/form-label/form-label.component.mjs +0 -33
- package/esm2022/lib/components/shared-components/form-field/index.mjs +0 -26
- package/esm2022/lib/components/shared-components/form-field/info-item/info-item.component.mjs +0 -76
- package/esm2022/lib/components/shared-components/form-field/input/input.component.mjs +0 -71
- package/esm2022/lib/components/shared-components/form-field/input-autocomplete/index.mjs +0 -3
- package/esm2022/lib/components/shared-components/form-field/input-autocomplete/input-autocomplete.model.mjs +0 -2
- package/esm2022/lib/components/shared-components/form-field/input-currency/input-currency.component.mjs +0 -73
- package/esm2022/lib/components/shared-components/form-field/input-email/input-email.component.mjs +0 -69
- package/esm2022/lib/components/shared-components/form-field/input-mask/input-mask.component.mjs +0 -61
- package/esm2022/lib/components/shared-components/form-field/input-number/input-number.component.mjs +0 -74
- package/esm2022/lib/components/shared-components/form-field/input-telephone/input-telephone.component.mjs +0 -85
- package/esm2022/lib/components/shared-components/form-field/radio/radio.component.mjs +0 -52
- package/esm2022/lib/components/shared-components/form-field/repeated-list/repeated-list.component.mjs +0 -32
- package/esm2022/lib/components/shared-components/form-field/search-employee/search-employee.component.mjs +0 -192
- package/esm2022/lib/components/shared-components/form-field/select/select.component.mjs +0 -191
- package/esm2022/lib/components/shared-components/form-field/shared-imports.mjs +0 -36
- package/esm2022/lib/components/shared-components/form-field/table-list/table-list.component.mjs +0 -116
- package/esm2022/lib/components/shared-components/form-field/textarea/special-chars.directive.mjs +0 -39
- package/esm2022/lib/components/shared-components/form-field/textarea/textarea.component.mjs +0 -57
- package/esm2022/lib/components/shared-components/form-field/toggle-button/toggle-button.component.mjs +0 -90
- package/esm2022/lib/components/shared-components/form-field/validation-errors/validation-errors.component.mjs +0 -43
- package/esm2022/lib/components/shared-components/index.mjs +0 -9
- package/esm2022/lib/components/shared-components/table/table.component.mjs +0 -243
- package/esm2022/lib/components/shared-components/terms-conditions/terms-conditions.component.mjs +0 -31
- package/esm2022/lib/components/shared-components/title-section/title-section.component.mjs +0 -31
- package/esm2022/lib/constants/constants.mjs +0 -149
- package/esm2022/lib/constants/index.mjs +0 -2
- package/esm2022/lib/directives/ar.directive.mjs +0 -54
- package/esm2022/lib/directives/currency.directive.mjs +0 -77
- package/esm2022/lib/directives/en.directive.mjs +0 -51
- package/esm2022/lib/directives/number.directive.mjs +0 -68
- package/esm2022/lib/directives/skip-location.directive.mjs +0 -28
- package/esm2022/lib/enums/actions.enum.mjs +0 -22
- package/esm2022/lib/enums/colors.enum.mjs +0 -6
- package/esm2022/lib/enums/events.enum.mjs +0 -6
- package/esm2022/lib/functions/data-to-blob.mjs +0 -12
- package/esm2022/lib/functions/encode-password.mjs +0 -14
- package/esm2022/lib/functions/handel-error-response.mjs +0 -12
- package/esm2022/lib/functions/index.mjs +0 -5
- package/esm2022/lib/functions/is-valid-data.mjs +0 -42
- package/esm2022/lib/helpers/shared.helper.mjs +0 -26
- package/esm2022/lib/hooks/index.mjs +0 -3
- package/esm2022/lib/hooks/load-form.mjs +0 -13
- package/esm2022/lib/hooks/save-form.mjs +0 -18
- package/esm2022/lib/i18n/ar.mjs +0 -200
- package/esm2022/lib/i18n/en.mjs +0 -204
- package/esm2022/lib/i18n/index.mjs +0 -3
- package/esm2022/lib/interfaces/action.interface.mjs +0 -2
- package/esm2022/lib/interfaces/api-response.interface.mjs +0 -2
- package/esm2022/lib/interfaces/document-file.interface.mjs +0 -2
- package/esm2022/lib/interfaces/form-items.interface.mjs +0 -2
- package/esm2022/lib/interfaces/form.interface.mjs +0 -150
- package/esm2022/lib/interfaces/igate-user.interface.mjs +0 -2
- package/esm2022/lib/interfaces/index.mjs +0 -8
- package/esm2022/lib/interfaces/lov-list.interface.mjs +0 -2
- package/esm2022/lib/interfaces/lov.interface.mjs +0 -2
- package/esm2022/lib/interfaces/shared.interface.mjs +0 -2
- package/esm2022/lib/pipes/currency.pipe.mjs +0 -66
- package/esm2022/lib/pipes/format-as-password.pipe.mjs +0 -19
- package/esm2022/lib/pipes/index.mjs +0 -3
- package/esm2022/lib/pipes/status-style.pipe.mjs +0 -57
- package/esm2022/lib/pipes/translate.pipe.mjs +0 -36
- package/esm2022/lib/regex/index.mjs +0 -2
- package/esm2022/lib/regex/regex-patterns.mjs +0 -4
- package/esm2022/lib/services/action.service.ts.mjs +0 -25
- package/esm2022/lib/services/core.service.ts.mjs +0 -527
- package/esm2022/lib/services/feedBack.service.mjs +0 -81
- package/esm2022/lib/services/i18n.service.mjs +0 -36
- package/esm2022/lib/services/index.mjs +0 -6
- package/esm2022/lib/services/sidenav.service.mjs +0 -36
- package/esm2022/lib/testComponent/config/segment-dynamic-loader.config.mjs +0 -8
- package/esm2022/lib/testComponent/general-approver-section/general-approver-section.component.mjs +0 -90
- package/esm2022/lib/testComponent/request-details-section/request-details-section.component.mjs +0 -482
- package/esm2022/lib/testComponent/services/i18n.service.mjs +0 -39
- package/esm2022/lib/testComponent/services/segment-dynamic-loader.service.mjs +0 -54
- package/esm2022/lib/validators/id.validator.mjs +0 -66
- package/esm2022/lib/validators/index.mjs +0 -8
- package/esm2022/lib/validators/string-to-boolean.pipe.mjs +0 -16
- package/esm2022/lib/validators/text.directive.mjs +0 -50
- package/esm2022/lib/validators/timer.pipe.mjs +0 -19
- package/esm2022/public-api.mjs +0 -19
package/fesm2022/bpm-core.mjs
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { Injectable, Inject, inject, DestroyRef,
|
|
2
|
+
import { Injectable, Inject, inject, DestroyRef, CUSTOM_ELEMENTS_SCHEMA, Component, Pipe, forwardRef, EventEmitter, Output, Input, Directive, HostListener, ViewChild, ElementRef, NO_ERRORS_SCHEMA, PLATFORM_ID, InjectionToken } from '@angular/core';
|
|
3
3
|
import * as i1$1 from '@angular/material/dialog';
|
|
4
4
|
import { MatDialogContent, MatDialogClose, MatDialogTitle, MAT_DIALOG_DATA, MatDialog, MatDialogActions, MatDialogModule } from '@angular/material/dialog';
|
|
5
5
|
import { Subject, BehaviorSubject, ReplaySubject, catchError, throwError, switchMap, from, fromEvent, debounceTime } from 'rxjs';
|
|
@@ -12,7 +12,7 @@ import { NgIf, CommonModule, NgSwitchCase, DecimalPipe, DatePipe, NgClass, NgSwi
|
|
|
12
12
|
import * as i2 from '@angular/material/core';
|
|
13
13
|
import { MAT_DATE_FORMATS, MatNativeDateModule } from '@angular/material/core';
|
|
14
14
|
import * as i4 from '@angular/forms';
|
|
15
|
-
import { NG_VALUE_ACCESSOR, FormControl,
|
|
15
|
+
import { NG_VALUE_ACCESSOR, FormControl, NgForm, ControlContainer, Validators, NgControl, FormControlName, FormGroupDirective, ReactiveFormsModule, FormsModule } from '@angular/forms';
|
|
16
16
|
import * as i3 from '@angular/platform-browser';
|
|
17
17
|
import { MatCheckbox } from '@angular/material/checkbox';
|
|
18
18
|
import * as i2$1 from 'ngx-toastr';
|
|
@@ -638,10 +638,10 @@ class CoreI18nService {
|
|
|
638
638
|
getLanguage() {
|
|
639
639
|
return this.language;
|
|
640
640
|
}
|
|
641
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
642
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
641
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: CoreI18nService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
642
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: CoreI18nService, providedIn: 'any' });
|
|
643
643
|
}
|
|
644
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
644
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: CoreI18nService, decorators: [{
|
|
645
645
|
type: Injectable,
|
|
646
646
|
args: [{
|
|
647
647
|
providedIn: 'any',
|
|
@@ -671,10 +671,10 @@ class SidenavService {
|
|
|
671
671
|
this.afterClosed = new ReplaySubject();
|
|
672
672
|
this.contentData = {};
|
|
673
673
|
}
|
|
674
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
675
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
674
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SidenavService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
675
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SidenavService, providedIn: 'root' });
|
|
676
676
|
}
|
|
677
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
677
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SidenavService, decorators: [{
|
|
678
678
|
type: Injectable,
|
|
679
679
|
args: [{
|
|
680
680
|
providedIn: 'root',
|
|
@@ -741,10 +741,10 @@ class FeedBackService {
|
|
|
741
741
|
});
|
|
742
742
|
return this.performPostRequest(body);
|
|
743
743
|
}
|
|
744
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
745
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
744
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: FeedBackService, deps: [{ token: i1.HttpClient }, { token: MY_LIB_CONFIG_TOKEN }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
745
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: FeedBackService, providedIn: "any" });
|
|
746
746
|
}
|
|
747
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
747
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: FeedBackService, decorators: [{
|
|
748
748
|
type: Injectable,
|
|
749
749
|
args: [{
|
|
750
750
|
providedIn: "any"
|
|
@@ -1276,10 +1276,10 @@ class CoreService {
|
|
|
1276
1276
|
isOpenOnInbox() {
|
|
1277
1277
|
return window.wmConfig.outlook;
|
|
1278
1278
|
}
|
|
1279
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1280
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
1279
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: CoreService, deps: [{ token: i1.HttpClient }, { token: MY_LIB_CONFIG_TOKEN }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
1280
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: CoreService, providedIn: "root" });
|
|
1281
1281
|
}
|
|
1282
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1282
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: CoreService, decorators: [{
|
|
1283
1283
|
type: Injectable,
|
|
1284
1284
|
args: [{
|
|
1285
1285
|
providedIn: "root"
|
|
@@ -1301,10 +1301,10 @@ class ActionStateService {
|
|
|
1301
1301
|
resetForm() {
|
|
1302
1302
|
return this.resetAction$;
|
|
1303
1303
|
}
|
|
1304
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1305
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
1304
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ActionStateService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
1305
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ActionStateService, providedIn: "any" });
|
|
1306
1306
|
}
|
|
1307
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1307
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ActionStateService, decorators: [{
|
|
1308
1308
|
type: Injectable,
|
|
1309
1309
|
args: [{
|
|
1310
1310
|
providedIn: "any"
|
|
@@ -1323,10 +1323,10 @@ class DeleteDialogComponent {
|
|
|
1323
1323
|
delete() {
|
|
1324
1324
|
this.dialogRef.close('yes');
|
|
1325
1325
|
}
|
|
1326
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1327
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
1326
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: DeleteDialogComponent, deps: [{ token: i1$1.MatDialogRef }, { token: CoreI18nService }], target: i0.ɵɵFactoryTarget.Component });
|
|
1327
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: DeleteDialogComponent, isStandalone: true, selector: "app-delete-dialog", ngImport: i0, template: "<div class=\"popup-container\">\r\n <div class=\"d-flex align-items-center justify-content-between\" mat-dialog-title>\r\n <h3> {{i18n.translate('delete')}}</h3>\r\n <ds-button matDialogClose icon>\r\n <ds-icon icon=\"close\" class=\"fs-20 fc-black\"></ds-icon>\r\n </ds-button>\r\n </div>\r\n <mat-dialog-content>\r\n <div class=\"d-flex flex-column align-items-center justify-content-center py-4\">\r\n <h2 class=\"fs-16 fw-medium fc-black mb-4\">\r\n {{i18n.translate('Areyousureyouwantdelete')}}\r\n </h2>\r\n\r\n <div class=\"d-flex align-items-center gap-3\">\r\n <ds-button shape=\"outline\" color=\"dark-gray\" matDialogClose>{{i18n.translate('Cancel')}}</ds-button>\r\n <ds-button color=\"red\" (click)=\"delete()\">{{i18n.translate('yes')}}</ds-button>\r\n </div>\r\n </div>\r\n </mat-dialog-content>\r\n</div>", styles: ["::ng-deep .confirm-dialog{--popup-max-width: 350px}\n"], dependencies: [{ kind: "directive", type: MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "directive", type: MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }] });
|
|
1328
1328
|
}
|
|
1329
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1329
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: DeleteDialogComponent, decorators: [{
|
|
1330
1330
|
type: Component,
|
|
1331
1331
|
args: [{ selector: 'app-delete-dialog', schemas: [CUSTOM_ELEMENTS_SCHEMA], standalone: true, imports: [
|
|
1332
1332
|
MatDialogContent,
|
|
@@ -1381,10 +1381,10 @@ class SubmitDialogComponent {
|
|
|
1381
1381
|
return 'success';
|
|
1382
1382
|
}
|
|
1383
1383
|
}
|
|
1384
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1385
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
1384
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SubmitDialogComponent, deps: [{ token: MAT_DIALOG_DATA }, { token: CoreI18nService }, { token: CoreService }], target: i0.ɵɵFactoryTarget.Component });
|
|
1385
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: SubmitDialogComponent, isStandalone: true, selector: "app-submit-dialog", ngImport: i0, template: "<div class=\"popup-container\">\r\n <div class=\"d-flex align-items-center justify-content-end\" mat-dialog-title>\r\n <ds-button matDialogClose icon>\r\n <ds-icon icon=\"close\" class=\"fs-20 fc-black\"></ds-icon>\r\n </ds-button>\r\n </div>\r\n <mat-dialog-content>\r\n <div class=\"d-flex flex-column align-items-center justify-content-center py-4\">\r\n <div class=\"text-center mb-4\">\r\n <svg width=\"79\" height=\"76\" viewBox=\"0 0 79 76\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n d=\"M59.9804 0.0998676L1.39239 19.2479C1.02223 19.3692 0.69498 19.5948 0.44999 19.8976C0.205 20.2005 0.0526985 20.5676 0.0113985 20.955C-0.0299016 21.3423 0.0415576 21.7333 0.217184 22.081C0.39281 22.4287 0.665128 22.7183 1.00139 22.9149L23.1454 35.7899C23.487 35.9886 23.8794 36.0828 24.274 36.0608C24.6686 36.0388 25.0481 35.9014 25.3654 35.6659L31.5894 31.0439L26.9674 37.2679C26.7318 37.5852 26.5944 37.9646 26.5722 38.3591C26.5499 38.7537 26.6439 39.1461 26.8424 39.4879L39.7174 61.6289C39.9138 61.9652 40.2031 62.2377 40.5506 62.4135C40.8981 62.5894 41.289 62.6611 41.6763 62.6201C42.0636 62.5791 42.4308 62.4272 42.7338 62.1825C43.0369 61.9378 43.2628 61.6108 43.3844 61.2409L62.5294 2.65187C62.6458 2.29686 62.6615 1.91654 62.5749 1.55313C62.4883 1.18971 62.3026 0.857401 62.0386 0.593071C61.7746 0.328741 61.4425 0.142726 61.0792 0.0556665C60.7159 -0.0313933 60.3355 -0.0160937 59.9804 0.0998676ZM40.9434 55.6999L31.0014 38.6069L42.9894 22.4689C43.2797 22.0798 43.4202 21.5993 43.3852 21.1152C43.3502 20.631 43.142 20.1757 42.7988 19.8325C42.4556 19.4893 42.0002 19.2811 41.5161 19.2461C41.032 19.2111 40.5514 19.3516 40.1624 19.6419L24.0254 31.6279L6.93339 21.6889L57.4514 5.18087L40.9434 55.6999ZM21.2134 44.2759L7.80139 57.6909C7.42253 58.0701 6.90853 58.2833 6.37246 58.2836C5.83638 58.2839 5.32215 58.0712 4.94289 57.6924C4.56363 57.3135 4.35041 56.7995 4.35013 56.2634C4.34985 55.7274 4.56253 55.2131 4.94139 54.8339L18.3564 41.4189C18.7353 41.04 19.2491 40.8272 19.7849 40.8272C20.3207 40.8272 20.8345 41.04 21.2134 41.4189C21.5923 41.7977 21.8051 42.3116 21.8051 42.8474C21.8051 43.3832 21.5923 43.897 21.2134 44.2759ZM3.49139 44.7839C3.30378 44.5963 3.15495 44.3736 3.05341 44.1285C2.95187 43.8834 2.89961 43.6207 2.89961 43.3554C2.89961 43.0901 2.95187 42.8274 3.05341 42.5823C3.15495 42.3371 3.30378 42.1144 3.49139 41.9269L8.78439 36.6339C9.16326 36.255 9.6771 36.0422 10.2129 36.0422C10.7487 36.0422 11.2625 36.255 11.6414 36.6339C12.0203 37.0127 12.2331 37.5266 12.2331 38.0624C12.2331 38.5982 12.0203 39.112 11.6414 39.4909L6.34939 44.7839C6.1618 44.9716 5.93903 45.1206 5.69384 45.2222C5.44864 45.3238 5.18582 45.3762 4.92039 45.3762C4.65497 45.3762 4.39215 45.3238 4.14695 45.2222C3.90176 45.1206 3.67899 44.9716 3.49139 44.7839ZM26.0014 50.9899C26.189 51.1774 26.3378 51.4001 26.4394 51.6453C26.5409 51.8904 26.5932 52.1531 26.5932 52.4184C26.5932 52.6837 26.5409 52.9464 26.4394 53.1915C26.3378 53.4366 26.189 53.6593 26.0014 53.8469L20.7014 59.1409C20.3225 59.5197 19.8087 59.7326 19.2729 59.7326C18.7371 59.7326 18.2233 59.5197 17.8444 59.1409C17.4655 58.762 17.2527 58.2482 17.2527 57.7124C17.2527 57.1766 17.4655 56.6627 17.8444 56.2839L23.1374 50.9909C23.325 50.8032 23.5477 50.6544 23.7928 50.5529C24.0379 50.4513 24.3006 50.3991 24.5659 50.3991C24.8312 50.3991 25.0939 50.4513 25.339 50.5529C25.5841 50.6544 25.8068 50.8032 25.9944 50.9909L26.0014 50.9899Z\"\r\n fill=\"#8E9AA0\"/>\r\n <path\r\n d=\"M58.0015 75.3119C69.0472 75.3119 78.0015 66.3576 78.0015 55.3119C78.0015 44.2662 69.0472 35.3119 58.0015 35.3119C46.9558 35.3119 38.0015 44.2662 38.0015 55.3119C38.0015 66.3576 46.9558 75.3119 58.0015 75.3119Z\"\r\n fill=\"#00C48C\"/>\r\n <path\r\n d=\"M56.8804 57.3183L54.0346 54.4725L52.9743 55.5336L56.8774 59.4367L65.8354 50.5267L65.4927 50.0138C63.8557 47.5812 61.1134 46.002 58.0015 46.002C53.0313 46.002 49.0015 50.031 49.0015 55.002C49.0015 59.9729 53.0305 64.002 58.0015 64.002C62.9716 64.002 67.0007 59.9729 67.0015 55.0035H65.5017C65.5017 55.005 65.5017 55.0072 65.5017 55.0095C65.5017 59.1503 62.1453 62.5067 58.0045 62.5067C53.8637 62.5067 50.5072 59.1503 50.5072 55.0095C50.5072 50.8686 53.8637 47.5122 58.0045 47.5122C60.3793 47.5122 62.4962 48.6168 63.87 50.3392L63.882 50.3542L56.8804 57.3183Z\"\r\n fill=\"white\"/>\r\n </svg>\r\n\r\n </div>\r\n <h2 class=\"fs-16 fw-medium fc-black mb-4 text-center\">\r\n {{ i18n.translate('submittedSuccessfully') }}\r\n </h2>\r\n\r\n <div class=\"info-section reverse w-100\">\r\n <div class=\"info-item px-3\">\r\n <span class=\"name fs-16-imp\">{{ i18n.translate('formTableFormId') }}</span>\r\n <span class=\"disc fs-16-imp\">\r\n <a class=\"cursor-pointer fc-black underline\" (click)=\"viewForm(successData.id, successData?.['formName'])\">\r\n {{ successData.id }}\r\n </a>\r\n </span>\r\n </div>\r\n <div class=\"info-item px-3\">\r\n <span class=\"name fs-16-imp\">{{ i18n.translate('formTableFormStatus') }}</span>\r\n <ds-status class=\"disc\" status=\"{{getStatus(successData?.status?.['key'])}}\">\r\n {{ successData.status?.['value'] }}\r\n </ds-status>\r\n </div>\r\n @if (successData?.status?.['key'] === 'PENDING') {\r\n <div class=\"info-item px-3\">\r\n <div class=\"d-flex align-items-center mt-2\">\r\n <div class=\"img-card circled-img small\">\r\n <img\r\n [src]=\"getImage(successData?.['nextApprover']?.['email'])\"\r\n onerror=\"this.onerror=null;this.src='assets/images/user.svg';\" alt=\"\">\r\n </div>\r\n <div class=\"line-height-1 mx-2\">\r\n <h5 class=\"fs-14 fw-bold fc-black mb-0\">{{ successData?.['nextApprover']?.['name'] }}</h5>\r\n <span class=\"fs-12 text-color-dark-gray\">{{ successData?.['nextApprover']?.['email'] }}</span>\r\n </div>\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n @if (!coreService.isMobileApp()) {\r\n <div class=\"d-flex align-items-center gap-3 mt-3\">\r\n <ds-button>\r\n <a class=\"inboxUri\" href=\"{{inboxUri}}\">\r\n {{ i18n.translate('formTableBackToInbox') }}</a>\r\n </ds-button>\r\n </div>\r\n }\r\n </div>\r\n </mat-dialog-content>\r\n</div>\r\n", styles: [".inboxUri{color:#fff!important}.inboxUri:hover{color:#ff375e!important}ds-button:hover a{color:#ff375e!important}\n"], dependencies: [{ kind: "directive", type: MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "directive", type: MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }] });
|
|
1386
1386
|
}
|
|
1387
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1387
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SubmitDialogComponent, decorators: [{
|
|
1388
1388
|
type: Component,
|
|
1389
1389
|
args: [{ selector: 'app-submit-dialog', schemas: [CUSTOM_ELEMENTS_SCHEMA], standalone: true, imports: [
|
|
1390
1390
|
MatDialogClose,
|
|
@@ -1411,10 +1411,10 @@ class ConfirmDialogComponent {
|
|
|
1411
1411
|
this.dialogRef.close('yes');
|
|
1412
1412
|
//////
|
|
1413
1413
|
}
|
|
1414
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1415
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
1414
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ConfirmDialogComponent, deps: [{ token: i1$1.MatDialogRef }, { token: CoreI18nService }], target: i0.ɵɵFactoryTarget.Component });
|
|
1415
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: ConfirmDialogComponent, isStandalone: true, selector: "app-confirm-dialog", ngImport: i0, template: "<div class=\"popup-container\">\r\n <div class=\"d-flex align-items-center justify-content-between\" mat-dialog-title>\r\n <h3> {{i18n.translate('delete')}}</h3>\r\n <ds-button matDialogClose icon>\r\n <ds-icon icon=\"close\" class=\"fs-20 fc-black\"></ds-icon>\r\n </ds-button>\r\n </div>\r\n <mat-dialog-content>\r\n <div class=\"d-flex flex-column align-items-center justify-content-center py-4\">\r\n <h2 class=\"fs-16 fw-medium fc-black mb-4\">\r\n {{i18n.translate('drf-confirmatton-msg')}}\r\n </h2>\r\n\r\n <div class=\"d-flex align-items-center gap-3\">\r\n <ds-button shape=\"outline\" color=\"dark-gray\" matDialogClose>{{i18n.translate('No-Discard')}}</ds-button>\r\n <ds-button color=\"red\" (click)=\"confirm()\">{{i18n.translate('Yes-Proceed')}}</ds-button>\r\n </div>\r\n </div>\r\n </mat-dialog-content>\r\n</div>", styles: ["::ng-deep .confirm-dialog{--popup-max-width: 350px}\n"], dependencies: [{ kind: "directive", type: MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "directive", type: MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }] });
|
|
1416
1416
|
}
|
|
1417
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1417
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ConfirmDialogComponent, decorators: [{
|
|
1418
1418
|
type: Component,
|
|
1419
1419
|
args: [{ selector: 'app-confirm-dialog', schemas: [CUSTOM_ELEMENTS_SCHEMA], standalone: true, imports: [
|
|
1420
1420
|
MatDialogContent,
|
|
@@ -1429,10 +1429,10 @@ class FormatAsPasswordPipe {
|
|
|
1429
1429
|
const length = value.length;
|
|
1430
1430
|
return '*'.repeat(length);
|
|
1431
1431
|
}
|
|
1432
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1433
|
-
static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "
|
|
1432
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: FormatAsPasswordPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
|
|
1433
|
+
static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.1", ngImport: i0, type: FormatAsPasswordPipe, isStandalone: true, name: "formatAsPassword" });
|
|
1434
1434
|
}
|
|
1435
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1435
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: FormatAsPasswordPipe, decorators: [{
|
|
1436
1436
|
type: Pipe,
|
|
1437
1437
|
args: [{
|
|
1438
1438
|
name: 'formatAsPassword'
|
|
@@ -1493,10 +1493,10 @@ class MycurrencyPipe {
|
|
|
1493
1493
|
return integer + fraction;
|
|
1494
1494
|
}
|
|
1495
1495
|
}
|
|
1496
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1497
|
-
static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "
|
|
1496
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: MycurrencyPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
|
|
1497
|
+
static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.1", ngImport: i0, type: MycurrencyPipe, isStandalone: true, name: "mycurrency" });
|
|
1498
1498
|
}
|
|
1499
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1499
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: MycurrencyPipe, decorators: [{
|
|
1500
1500
|
type: Pipe,
|
|
1501
1501
|
args: [{
|
|
1502
1502
|
name: 'mycurrency'
|
|
@@ -1644,10 +1644,10 @@ class BaseComponent {
|
|
|
1644
1644
|
this.emitedValue.emit(this.field);
|
|
1645
1645
|
}
|
|
1646
1646
|
}
|
|
1647
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1648
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
1647
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: BaseComponent, deps: [{ token: CoreI18nService }, { token: i1.HttpClient }, { token: i4.FormBuilder }, { token: i2.DateAdapter }, { token: i0.ChangeDetectorRef }, { token: i1$1.MatDialog }, { token: i1$1.MatDialogRef }, { token: MAT_DIALOG_DATA }, { token: MycurrencyPipe }, { token: MAT_DATE_FORMATS }, { token: i3.DomSanitizer }], target: i0.ɵɵFactoryTarget.Component });
|
|
1648
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: BaseComponent, isStandalone: true, selector: "app-base-component", inputs: { hideOption: "hideOption", type: "type", loading: "loading", field: "field", labelTextReadMode: "labelTextReadMode", labelTextWriteMode: "labelTextWriteMode", isReadOnly: "isReadOnly", name: "name", required: "required", mask: "mask", allowedExtensions: "allowedExtensions", link: "link", multiple: "multiple", insideTable: "insideTable", showIfEmpty: "showIfEmpty", showErrorMessage: "showErrorMessage", showHint: "showHint", hint: "hint", errorMessage: "errorMessage", placeholder: "placeholder", maxLength: "maxLength", minLength: "minLength", maxValue: "maxValue", minValue: "minValue", disabled: "disabled", lov: "lov", hasLabel: "hasLabel", section: "section", controller: "controller" }, outputs: { emitedValue: "emitedValue" }, providers: [CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR], ngImport: i0, template: '', isInline: true, styles: [""], viewProviders: [{ provide: ControlContainer, useExisting: NgForm }] });
|
|
1649
1649
|
}
|
|
1650
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1650
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: BaseComponent, decorators: [{
|
|
1651
1651
|
type: Component,
|
|
1652
1652
|
args: [{ selector: 'app-base-component', template: '', providers: [CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR], viewProviders: [{ provide: ControlContainer, useExisting: NgForm }], standalone: true }]
|
|
1653
1653
|
}], ctorParameters: () => [{ type: CoreI18nService }, { type: i1.HttpClient }, { type: i4.FormBuilder }, { type: i2.DateAdapter }, { type: i0.ChangeDetectorRef }, { type: i1$1.MatDialog }, { type: i1$1.MatDialogRef }, { type: undefined, decorators: [{
|
|
@@ -1840,10 +1840,10 @@ class ControlValueAccessorDirective {
|
|
|
1840
1840
|
setDisabledState(isDisabled) {
|
|
1841
1841
|
this.isDisabled = isDisabled;
|
|
1842
1842
|
}
|
|
1843
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1844
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
1843
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ControlValueAccessorDirective, deps: [{ token: i0.Injector }, { token: CoreI18nService }, { token: i2$1.ToastrService }, { token: CoreService }, { token: i3.DomSanitizer }, { token: i4.FormBuilder }, { token: ActionStateService }], target: i0.ɵɵFactoryTarget.Directive });
|
|
1844
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.1", type: ControlValueAccessorDirective, isStandalone: true, selector: "[appControlValueAccessor]", inputs: { tooltip: "tooltip", isReadOnly: "isReadOnly", hint: "hint", loading: "loading", placeholder: "placeholder", type: "type", showErrorMessage: "showErrorMessage", showHint: "showHint", showIfEmpty: "showIfEmpty", insideTable: "insideTable", mask: "mask", label: "label", matSuffix: "matSuffix", hasTooltip: "hasTooltip", name: "name", randomID: "randomID", multiple: "multiple", maxDate: "maxDate", minDate: "minDate", customMaxDate: "customMaxDate", customMinDate: "customMinDate", required: "required", mandatory: "mandatory" }, ngImport: i0 });
|
|
1845
1845
|
}
|
|
1846
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1846
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ControlValueAccessorDirective, decorators: [{
|
|
1847
1847
|
type: Directive,
|
|
1848
1848
|
args: [{
|
|
1849
1849
|
selector: '[appControlValueAccessor]',
|
|
@@ -1907,10 +1907,10 @@ class TermsConditionsComponent {
|
|
|
1907
1907
|
this.data = data;
|
|
1908
1908
|
this.termsBody = data;
|
|
1909
1909
|
}
|
|
1910
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1911
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
1910
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: TermsConditionsComponent, deps: [{ token: i1$1.MatDialogRef }, { token: CoreI18nService }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component });
|
|
1911
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: TermsConditionsComponent, isStandalone: true, selector: "app-terms-conditions", ngImport: i0, template: "<div class=\"popup-container\">\r\n <div class=\"d-flex align-items-center justify-content-between\" mat-dialog-title>\r\n <h3 class=\"mb-0 font-16 fw-medium\" >{{i18n.translate('termsAndConditions')}}</h3>\r\n <ds-button matDialogClose icon>\r\n <ds-icon icon=\"close\" class=\"fs-20 fc-black\"></ds-icon>\r\n </ds-button>\r\n </div>\r\n <mat-dialog-content>\r\n <div class=\"px-md-4\">\r\n <p class=\"fs-15 fw-normal bg-color-light-gray p-3 text-break\" [innerHTML]='termsBody' > </p>\r\n </div>\r\n </mat-dialog-content>\r\n</div>\r\n", styles: ["::ng-deep .main-popup{--popup-max-width: 800px;--popup-width: 800px}\n"], dependencies: [{ kind: "directive", type: MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "directive", type: MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }] });
|
|
1912
1912
|
}
|
|
1913
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1913
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: TermsConditionsComponent, decorators: [{
|
|
1914
1914
|
type: Component,
|
|
1915
1915
|
args: [{ selector: 'app-terms-conditions', schemas: [CUSTOM_ELEMENTS_SCHEMA], imports: [
|
|
1916
1916
|
MatDialogContent,
|
|
@@ -1943,10 +1943,10 @@ class TranslatePipe {
|
|
|
1943
1943
|
getLanguage() {
|
|
1944
1944
|
return this.language;
|
|
1945
1945
|
}
|
|
1946
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1947
|
-
static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "
|
|
1946
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: TranslatePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
|
|
1947
|
+
static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.1", ngImport: i0, type: TranslatePipe, isStandalone: true, name: "translate" });
|
|
1948
1948
|
}
|
|
1949
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1949
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: TranslatePipe, decorators: [{
|
|
1950
1950
|
type: Pipe,
|
|
1951
1951
|
args: [{
|
|
1952
1952
|
name: 'translate',
|
|
@@ -1962,10 +1962,10 @@ class FormLabelComponent {
|
|
|
1962
1962
|
constructor(i18n) {
|
|
1963
1963
|
this.i18n = i18n;
|
|
1964
1964
|
}
|
|
1965
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1966
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
1965
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: FormLabelComponent, deps: [{ token: CoreI18nService }], target: i0.ɵɵFactoryTarget.Component });
|
|
1966
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: FormLabelComponent, isStandalone: true, selector: "app-form-label", inputs: { tooltip: "tooltip", label: "label", optional: "optional" }, ngImport: i0, template: "<div class=\"d-flex justify-content-between\">\r\n <div class=\"d-flex\">\r\n <span class=\"form-label mb-0\">{{ label }}</span>\r\n @if(tooltip) {\r\n <span class=\"form-label mb-0 mx-1\">\r\n <ds-icon\r\n icon=\"info fs-18\"\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 <span *ngIf=\"optional\" class=\"optional-input\">\r\n {{ 'optional' | translate }}\r\n </span>\r\n</div>\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>", styles: [""], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: SatPopoverModule }, { kind: "component", type: i1$2.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$2.SatPopoverAnchorDirective, selector: "[satPopoverAnchor]", inputs: ["satPopoverAnchor"], exportAs: ["satPopoverAnchor"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
|
|
1967
1967
|
}
|
|
1968
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1968
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: FormLabelComponent, decorators: [{
|
|
1969
1969
|
type: Component,
|
|
1970
1970
|
args: [{ selector: 'app-form-label', imports: [
|
|
1971
1971
|
NgIf,
|
|
@@ -2005,10 +2005,10 @@ class ValidationErrorsComponent extends ControlValueAccessorDirective {
|
|
|
2005
2005
|
this.errorMessages['pattern'] = 'You must enter email';
|
|
2006
2006
|
}
|
|
2007
2007
|
}
|
|
2008
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2009
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
2008
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ValidationErrorsComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
2009
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", 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: i5.KeyValuePipe, name: "keyvalue" }, { kind: "directive", type: MatError, selector: "mat-error, [matError]", inputs: ["id"] }] });
|
|
2010
2010
|
}
|
|
2011
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2011
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ValidationErrorsComponent, decorators: [{
|
|
2012
2012
|
type: Component,
|
|
2013
2013
|
args: [{ selector: 'app-validation-errors', standalone: true, imports: [
|
|
2014
2014
|
CommonModule,
|
|
@@ -2050,10 +2050,10 @@ class InfoItemComponent {
|
|
|
2050
2050
|
getDate(date) {
|
|
2051
2051
|
return format(new Date(date), "dd/MM/yyyy");
|
|
2052
2052
|
}
|
|
2053
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2054
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
2053
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: InfoItemComponent, deps: [{ token: CoreI18nService }], target: i0.ɵɵFactoryTarget.Component });
|
|
2054
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: InfoItemComponent, isStandalone: true, selector: "app-info-item", inputs: { label: "label", value: "value", name: "name", type: "type", dateType: "dateType", multiple: "multiple", insideTable: "insideTable", hasLabel: "hasLabel", arrayList: "arrayList", actionType: "actionType", download: "download" }, ngImport: i0, template: "<ng-container [ngSwitch]=\"type\">\r\n @if(label){\r\n <span class=\"name \">{{ label }}</span>\r\n }\r\n\r\n <!-- class=\"disc\" -->\r\n <span *ngSwitchCase=\"'attach'\">\r\n<!-- <app-docs-uploader [field]=\"value\" styleHeight=\"mini\" display=\"only-files\"></app-docs-uploader>-->\r\n </span>\r\n <span class=\"disc mt-2 \" *ngSwitchCase=\"'user-picker'\">\r\n @if(!multiple){\r\n <div class=\"d-flex align-items-center\">\r\n <div class=\"img-card circled-img small\">\r\n <img [src]=\"getImage(value)\" onerror=\"this.onerror=null;this.src='assets/images/user.svg';\" alt=\"\">\r\n </div>\r\n <div class=\"line-height-1 mx-2\" [ngClass]=\"{'flex-grow-1': actionType === 'delete'}\">\r\n <h6 class=\"fs-14 fw-bold fc-onyx mb-0\">{{name}}</h6>\r\n <span class=\"fs-12 fc-dark-gray\">{{value}}</span>\r\n </div>\r\n </div>\r\n }\r\n\r\n @if(multiple){\r\n @if(multiple){\r\n <ng-container>\r\n @for (emails of arrayList; track $index; let ind = $index) {\r\n <div class=\"d-flex flex-wrap\">\r\n <ng-container>\r\n <div class=\"img-card circled-img small mb-3\">\r\n <img [src]=\"getImage(value)\" onerror=\"this.onerror=null;this.src='assets/images/user.svg';\" alt=\"\">\r\n </div>\r\n <div class=\"line-height-1 mx-2 mb-3\" [ngClass]=\"{'flex-grow-1': actionType === 'delete'}\">\r\n <h6 class=\"fs-14 fw-bold fc-onyx mb-0\"> {{(emails?.['personName'])}}</h6>\r\n <span class=\"fs-12 fc-dark-gray\"> {{emails?.['personEmail']}}</span>\r\n </div>\r\n </ng-container>\r\n </div>\r\n }\r\n </ng-container>\r\n }\r\n }\r\n </span>\r\n\r\n <span class=\"disc\" *ngSwitchCase=\"'toggle'\">\r\n <mat-slide-toggle [checked]=\"value\"></mat-slide-toggle>\r\n </span>\r\n\r\n <span class=\"disc\" *ngSwitchCase=\"'toggleBtn'\">\r\n <span>{{value}}</span>\r\n </span>\r\n <span class=\"disc\" *ngSwitchCase=\"'telephone'\">\r\n <div class=\"d-flex align-items-center\">\r\n <bdi>{{ value }}</bdi>\r\n </div>\r\n </span>\r\n\r\n <span class=\"disc\" *ngSwitchCase=\"'currency'\">\r\n <span>{{value | number:'1.2-2'}}</span>\r\n </span>\r\n\r\n <span class=\"disc\" *ngSwitchCase=\"'date'\">\r\n @if(dateType === 'hijri'){\r\n <span>\r\n {{ value }}\r\n </span>\r\n }\r\n @if(dateType === 'yearOnly'){\r\n <span>\r\n {{ value }}\r\n </span>\r\n }\r\n@if(dateType !== 'hijri' && dateType !== 'yearOnly' && !value?.startDate){\r\n <span>\r\n {{value | date :'dd/MM/yyyy' : 'GMT+3'}}\r\n<!-- {{ getDate(value) }}-->\r\n </span>\r\n}\r\n @if(dateType !== 'hijri' && dateType !== 'yearOnly' && value?.startDate){\r\n <span>\r\n {{value?.['startDate'] | date :'dd/MM/yyyy'}}\r\n -\r\n {{value?.['endDate'] | date :'dd/MM/yyyy'}}\r\n </span>\r\n }\r\n\r\n </span>\r\n\r\n <span class=\"disc\" *ngSwitchCase=\"'dateHijri'\">\r\n {{ value }}\r\n </span>\r\n\r\n <span class=\"disc breakLine fc-coral cursor-pointer\" *ngSwitchCase=\"'link'\">\r\n <a [href]=\"value\" target=\"_blank\">{{'View' | translate}} {{ label }} </a>\r\n </span>\r\n <span class=\"disc breakLine\" *ngSwitchCase=\"'formIdLink'\">\r\n <a (click)=\"viewForm(value)\">{{ value }} </a>\r\n </span>\r\n <span [ngClass]=\"{'breakLine': !insideTable}\" class=\"disc \" *ngSwitchCase=\"'text'\">\r\n {{ value }}\r\n </span>\r\n <span [ngClass]=\"{'breakLine': !insideTable}\" class=\"disc \" *ngSwitchCase=\"'multipleSelect'\">\r\n @for(item of value; track $index; let i =$index){\r\n <span>{{item.value}}\r\n @if(!(i === value.length-1)){\r\n <span>, </span>\r\n }\r\n </span>\r\n }\r\n\r\n </span>\r\n <span [ngClass]=\"{'breakLine': !insideTable}\" class=\"disc \" [innerHTML]=\"value\" *ngSwitchDefault>\r\n </span>\r\n</ng-container>\r\n", styles: [":host.slide-end .disc{text-align:end}:host.user-picker{border-radius:4px;padding:1rem;background-color:var(--light-gray);max-width:320px;width:100%}:host.user-picker .name{display:none}:host.user-picker .disc{width:100%}.name{width:270px;font-size:.875rem;font-weight:var(--font-medium);color:var(--dark-gray);margin-bottom:0;display:inline-block}.disc{width:calc(100% - 270px);font-size:.875rem;font-weight:var(--font-regular);color:var(--black);display:inline-block}@media (max-width: 768px){.name,.disc{width:100%!important}}.breakLine{line-break:anywhere}a{color:#0d6efd!important}a:hover{cursor:pointer}\n"], dependencies: [{ kind: "component", type: MatSlideToggle, selector: "mat-slide-toggle", inputs: ["name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "color", "disabled", "disableRipple", "tabIndex", "checked", "hideIcon", "disabledInteractive"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { kind: "directive", type: NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "pipe", type: DecimalPipe, name: "number" }, { kind: "pipe", type: DatePipe, name: "date" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "directive", type: NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
|
|
2055
2055
|
}
|
|
2056
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2056
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: InfoItemComponent, decorators: [{
|
|
2057
2057
|
type: Component,
|
|
2058
2058
|
args: [{ selector: 'app-info-item', standalone: true, imports: [
|
|
2059
2059
|
MatSlideToggle,
|
|
@@ -2118,10 +2118,10 @@ class EnOnlyDirective {
|
|
|
2118
2118
|
event.preventDefault();
|
|
2119
2119
|
}
|
|
2120
2120
|
}
|
|
2121
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2122
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
2121
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: EnOnlyDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
2122
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.1", type: EnOnlyDirective, isStandalone: true, selector: "[enOnly]", host: { listeners: { "keydown": "onKeyDown($event)", "paste": "onPaste($event)", "drop": "onDrop($event)" } }, ngImport: i0 });
|
|
2123
2123
|
}
|
|
2124
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2124
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: EnOnlyDirective, decorators: [{
|
|
2125
2125
|
type: Directive,
|
|
2126
2126
|
args: [{
|
|
2127
2127
|
selector: '[enOnly]',
|
|
@@ -2170,10 +2170,10 @@ class ArOnlyDirective {
|
|
|
2170
2170
|
event.preventDefault();
|
|
2171
2171
|
}
|
|
2172
2172
|
}
|
|
2173
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2174
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
2173
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ArOnlyDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
2174
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.1", type: ArOnlyDirective, isStandalone: true, selector: "[arOnly]", host: { listeners: { "keydown": "onKeyDown($event)", "paste": "onPaste($event)", "drop": "onDrop($event)" } }, ngImport: i0 });
|
|
2175
2175
|
}
|
|
2176
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2176
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ArOnlyDirective, decorators: [{
|
|
2177
2177
|
type: Directive,
|
|
2178
2178
|
args: [{
|
|
2179
2179
|
selector: '[arOnly]',
|
|
@@ -2226,9 +2226,6 @@ class CheckBoxComponent extends ControlValueAccessorDirective {
|
|
|
2226
2226
|
dialog = inject(MatDialog);
|
|
2227
2227
|
ngOnInit() {
|
|
2228
2228
|
super.ngOnInit();
|
|
2229
|
-
if (this.control.value == 'true') {
|
|
2230
|
-
this.control.setValue(true);
|
|
2231
|
-
}
|
|
2232
2229
|
this.actionStateService.resetAction$
|
|
2233
2230
|
.pipe(takeUntilDestroyed(this.destroyRef))
|
|
2234
2231
|
.subscribe(res => {
|
|
@@ -2242,7 +2239,7 @@ class CheckBoxComponent extends ControlValueAccessorDirective {
|
|
|
2242
2239
|
}
|
|
2243
2240
|
valueChange(event) {
|
|
2244
2241
|
const checked = event.checked;
|
|
2245
|
-
this.control.setValue(checked);
|
|
2242
|
+
this.control.setValue(checked.toString());
|
|
2246
2243
|
}
|
|
2247
2244
|
openTermsPopup() {
|
|
2248
2245
|
const dialogRef = this.dialog.open(TermsConditionsComponent, {
|
|
@@ -2253,16 +2250,16 @@ class CheckBoxComponent extends ControlValueAccessorDirective {
|
|
|
2253
2250
|
dialogRef.afterClosed().subscribe(() => {
|
|
2254
2251
|
});
|
|
2255
2252
|
}
|
|
2256
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2257
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
2253
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: CheckBoxComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
2254
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: CheckBoxComponent, isStandalone: true, selector: "app-checkbox", inputs: { containTerms: "containTerms", termsLabel: "termsLabel", linkText: "linkText", hrefLink: "hrefLink", link: "link", termsBody: "termsBody" }, outputs: { downloadCheckBox: "downloadCheckBox" }, providers: [
|
|
2258
2255
|
{
|
|
2259
2256
|
provide: NG_VALUE_ACCESSOR,
|
|
2260
2257
|
useExisting: forwardRef(() => CheckBoxComponent),
|
|
2261
2258
|
multi: true,
|
|
2262
2259
|
},
|
|
2263
|
-
], usesInheritance: true, ngImport: i0, template: "<mat-checkbox\r\n [ngClass]=\"{'mx-3': isReadOnly}\"\r\n class=\"my-3\"\r\n [style.pointerEvents]=\"isReadOnly ? 'none' : 'auto'\"\r\n id=\"{{ name }}{{ randomID }}\"\r\n [name]=\"name\"\r\n (change)=\"valueChange($event)\"\r\n [checked]=\"control.value ?
|
|
2260
|
+
], usesInheritance: true, ngImport: i0, template: "<mat-checkbox\r\n [ngClass]=\"{'mx-3': isReadOnly}\"\r\n class=\"my-3\"\r\n [style.pointerEvents]=\"isReadOnly ? 'none' : 'auto'\"\r\n id=\"{{ name }}{{ randomID }}\"\r\n [name]=\"name\"\r\n (change)=\"valueChange($event)\"\r\n [checked]=\"control.value === 'true' ? true : false\">\r\n\r\n <div class=\"d-flex pt-1\">\r\n @if(label){\r\n <app-form-label class=\"mb-0\" [label]=\"label\" [optional]=\"required || mandatory ? false : true\" [tooltip]=\"tooltip\"></app-form-label>\r\n }\r\n @if(containTerms) {\r\n <span\r\n class=\"fs-12 fw-bold fc-coral cursor-pointer mx-1\"\r\n (click)=\"openTermsPopup(); false\">\r\n {{ termsLabel ? termsLabel : 'termsAndConditions' | translate }}\r\n </span>\r\n }\r\n </div>\r\n\r\n @if(link) {\r\n <ng-container>\r\n <span> | </span>\r\n <a\r\n class=\"fs-12 fw-bold fc-coral cursor-pointer mx-1 d-inline-flex align-items-center gap-1\"\r\n href=\"{{ hrefLink }}\"\r\n target=\"_blank\">\r\n <ds-icon icon=\"external-link\"></ds-icon>\r\n <span class=\"underline\">{{ linkText }}</span>\r\n </a>\r\n </ng-container>\r\n }\r\n</mat-checkbox>\r\n<app-validation-errors [errors]=\"control.errors\"></app-validation-errors>\r\n", styles: [".checkbox{margin-top:10px!important;position:relative;margin-bottom:0!important}.checkbox label{padding-left:30px;font-size:14px;color:#414142}.checkbox input[type=checkbox]{opacity:0}.checkbox input[type=checkbox]+label.checkboxInput{position:absolute;width:25px;height:25px;top:0;left:0;padding-left:0}@media (max-width: 768px){.checkbox input[type=checkbox]+label.checkboxInput{top:8px!important}}.checkbox input[type=checkbox]+label.checkboxInput:before{content:\"\\f096\";font-family:FontAwesome;font-size:25px;display:block;margin-top:-7px;color:#ddd}.checkbox input[type=checkbox]:checked+label.checkboxInput:before{content:\"\\f14a\";color:#da3f7b;background-color:#fff}.mat-mdc-checkbox.mat-accent .mdc-form-field>label{margin:0}.rtlCheckbox.checkbox input[type=checkbox]+label.checkboxInput{left:inherit;right:0;padding-left:0;padding-right:0}.rtlCheckbox.checkbox label{padding-left:0;padding-right:30px}.mat-mdc-checkbox label{cursor:pointer}\n"], dependencies: [{ kind: "component", type: MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "ngmodule", type: FormsModule }, { kind: "component", type: FormLabelComponent, selector: "app-form-label", inputs: ["tooltip", "label", "optional"] }, { kind: "component", type: ValidationErrorsComponent, selector: "app-validation-errors", inputs: ["errors", "customErrorMessages"] }, { kind: "ngmodule", type: i4.ReactiveFormsModule }, { kind: "directive", type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
|
|
2264
2261
|
}
|
|
2265
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2262
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: CheckBoxComponent, decorators: [{
|
|
2266
2263
|
type: Component,
|
|
2267
2264
|
args: [{ selector: 'app-checkbox', schemas: [CUSTOM_ELEMENTS_SCHEMA], imports: [
|
|
2268
2265
|
MatCheckbox,
|
|
@@ -2274,7 +2271,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImpor
|
|
|
2274
2271
|
useExisting: forwardRef(() => CheckBoxComponent),
|
|
2275
2272
|
multi: true,
|
|
2276
2273
|
},
|
|
2277
|
-
], template: "<mat-checkbox\r\n [ngClass]=\"{'mx-3': isReadOnly}\"\r\n class=\"my-3\"\r\n [style.pointerEvents]=\"isReadOnly ? 'none' : 'auto'\"\r\n id=\"{{ name }}{{ randomID }}\"\r\n [name]=\"name\"\r\n (change)=\"valueChange($event)\"\r\n [checked]=\"control.value ?
|
|
2274
|
+
], template: "<mat-checkbox\r\n [ngClass]=\"{'mx-3': isReadOnly}\"\r\n class=\"my-3\"\r\n [style.pointerEvents]=\"isReadOnly ? 'none' : 'auto'\"\r\n id=\"{{ name }}{{ randomID }}\"\r\n [name]=\"name\"\r\n (change)=\"valueChange($event)\"\r\n [checked]=\"control.value === 'true' ? true : false\">\r\n\r\n <div class=\"d-flex pt-1\">\r\n @if(label){\r\n <app-form-label class=\"mb-0\" [label]=\"label\" [optional]=\"required || mandatory ? false : true\" [tooltip]=\"tooltip\"></app-form-label>\r\n }\r\n @if(containTerms) {\r\n <span\r\n class=\"fs-12 fw-bold fc-coral cursor-pointer mx-1\"\r\n (click)=\"openTermsPopup(); false\">\r\n {{ termsLabel ? termsLabel : 'termsAndConditions' | translate }}\r\n </span>\r\n }\r\n </div>\r\n\r\n @if(link) {\r\n <ng-container>\r\n <span> | </span>\r\n <a\r\n class=\"fs-12 fw-bold fc-coral cursor-pointer mx-1 d-inline-flex align-items-center gap-1\"\r\n href=\"{{ hrefLink }}\"\r\n target=\"_blank\">\r\n <ds-icon icon=\"external-link\"></ds-icon>\r\n <span class=\"underline\">{{ linkText }}</span>\r\n </a>\r\n </ng-container>\r\n }\r\n</mat-checkbox>\r\n<app-validation-errors [errors]=\"control.errors\"></app-validation-errors>\r\n", styles: [".checkbox{margin-top:10px!important;position:relative;margin-bottom:0!important}.checkbox label{padding-left:30px;font-size:14px;color:#414142}.checkbox input[type=checkbox]{opacity:0}.checkbox input[type=checkbox]+label.checkboxInput{position:absolute;width:25px;height:25px;top:0;left:0;padding-left:0}@media (max-width: 768px){.checkbox input[type=checkbox]+label.checkboxInput{top:8px!important}}.checkbox input[type=checkbox]+label.checkboxInput:before{content:\"\\f096\";font-family:FontAwesome;font-size:25px;display:block;margin-top:-7px;color:#ddd}.checkbox input[type=checkbox]:checked+label.checkboxInput:before{content:\"\\f14a\";color:#da3f7b;background-color:#fff}.mat-mdc-checkbox.mat-accent .mdc-form-field>label{margin:0}.rtlCheckbox.checkbox input[type=checkbox]+label.checkboxInput{left:inherit;right:0;padding-left:0;padding-right:0}.rtlCheckbox.checkbox label{padding-left:0;padding-right:30px}.mat-mdc-checkbox label{cursor:pointer}\n"] }]
|
|
2278
2275
|
}], propDecorators: { containTerms: [{
|
|
2279
2276
|
type: Input
|
|
2280
2277
|
}], termsLabel: [{
|
|
@@ -2364,16 +2361,16 @@ class CustomSearchableComponent extends ControlValueAccessorDirective {
|
|
|
2364
2361
|
this.searchControl.setValue(value[this.displayedLabel]);
|
|
2365
2362
|
this.selectedValue.emit(value);
|
|
2366
2363
|
}
|
|
2367
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2368
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
2364
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: CustomSearchableComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
2365
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: CustomSearchableComponent, isStandalone: true, selector: "app-custom-searchable", inputs: { options: "options", disabled: "disabled", displayedLabel: "displayedLabel", key: "key", floatLabel: "floatLabel", className: "className" }, outputs: { selectedValue: "selectedValue", isLengthGreaterThan4: "isLengthGreaterThan4" }, providers: [
|
|
2369
2366
|
{
|
|
2370
2367
|
provide: NG_VALUE_ACCESSOR,
|
|
2371
2368
|
useExisting: forwardRef(() => CustomSearchableComponent),
|
|
2372
2369
|
multi: true,
|
|
2373
2370
|
},
|
|
2374
|
-
], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@if(isReadOnly && control?.value) {\r\n<ng-container>\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 [value]=\"control?.value.value\"\r\n ></app-info-item>\r\n</ng-container>\r\n} @if(!isReadOnly) {\r\n<ng-container>\r\n @if(label) {\r\n <app-form-label\r\n [label]=\"label\"\r\n [optional]=\"required || mandatory ? false : true\"\r\n [tooltip]=\"tooltip\"\r\n ></app-form-label>\r\n }\r\n\r\n <mat-form-field\r\n class=\"primary-form {{ className }}\"\r\n [ngClass]=\"{ 'input-disabled': disabled || loading,\r\n 'custom-validation': !control.hasValidator(Validators['required'])\r\n }\"\r\n [floatLabel]=\"floatLabel\"\r\n >\r\n <span class=\"sfi sfi-search fc-coral fs-18\" matPrefix></span>\r\n <label class=\"mat-form-content\">\r\n <input\r\n #autocompleteInput\r\n type=\"text\"\r\n (keydown)=\"onKeyDown($event, autocompleteInput)\"\r\n [attr.disabled]=\"disabled\"\r\n [placeholder]=\"label\"\r\n aria-label=\"Number\"\r\n matInput\r\n (input)=\"onValueChange($event)\"\r\n [formControl]=\"searchControl\"\r\n [name]=\"name\"\r\n [matAutocomplete]=\"auto\"\r\n [value]=\"value?.key\"\r\n (focusout)=\"onFocusOut()\"\r\n />\r\n </label>\r\n\r\n @if(loading) {\r\n <span class=\"sfi sfi-spinner d-inline-block spin fc-coral\" matSuffix></span>\r\n } @if(!loading && searchControl?.value) {\r\n <span\r\n class=\"sfi sfi-close d-inline-block fc-coral cursor-pointer fs-12\"\r\n (click)=\"clearInput()\"\r\n matSuffix\r\n ></span>\r\n }\r\n\r\n <mat-autocomplete\r\n autoActiveFirstOption\r\n #auto=\"matAutocomplete\"\r\n [displayWith]=\"displayFn\"\r\n (optionSelected)=\"getAutoComplete($event.option.value)\">\r\n\r\n\r\n\r\n\r\n @if(!noData) {\r\n <ng-container>\r\n @for(option of filteredOptions; track option) {\r\n <mat-option [value]=\"option\">\r\n <div class=\"d-flex align-items-center\">\r\n @if(option['avatar_url']) {\r\n <figure class=\"img-card small circled-img p-0 m-0\">\r\n <img [src]=\"option['avatar_url']\" alt=\"\" />\r\n </figure>\r\n } @if(option['avatar_url']) {\r\n <span class=\"mx-2\"></span>\r\n }\r\n\r\n {{ option[displayedLabel] }}\r\n </div>\r\n </mat-option>\r\n }\r\n </ng-container>\r\n } @if(noData) {\r\n <ng-container>\r\n <mat-option [disabled]=\"true\" class=\"text-center\">No Data</mat-option>\r\n </ng-container>\r\n }\r\n </mat-autocomplete>\r\n\r\n <!-- <mat-error class=\"mb-2\" *ngIf=\"(!control?.valid)\">{{ 'validSelectError' | translate }}{{ label }}</mat-error> -->\r\n\r\n @if(showHint) {\r\n <mat-hint>\r\n <span\r\n class=\"sfi sfi-check-circle font-10 fc-dark-gray\"\r\n [ngClass]=\"{ 'fc-oasis-light-imp': value }\"\r\n ></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\r\n <app-validation-errors [errors]=\"control.errors\"></app-validation-errors>\r\n</ng-container>\r\n}\r\n", styles: [".small-input~.btn{height:41px}:host{flex-grow:1}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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: "ngmodule", type: MatInputModule }, { kind: "directive", type: i7.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: i6.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i6.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i6.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i6.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: FormLabelComponent, selector: "app-form-label", inputs: ["tooltip", "label", "optional"] }, { kind: "component", type: ValidationErrorsComponent, selector: "app-validation-errors", inputs: ["errors", "customErrorMessages"] }, { kind: "component", type: InfoItemComponent, selector: "app-info-item", inputs: ["label", "value", "name", "type", "dateType", "multiple", "insideTable", "hasLabel", "arrayList", "actionType", "download"] }, { kind: "ngmodule", type: i4.ReactiveFormsModule }, { kind: "directive", type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] });
|
|
2371
|
+
], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@if(isReadOnly && control?.value) {\r\n<ng-container>\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 [value]=\"control?.value.value\"\r\n ></app-info-item>\r\n</ng-container>\r\n} @if(!isReadOnly) {\r\n<ng-container>\r\n @if(label) {\r\n <app-form-label\r\n [label]=\"label\"\r\n [optional]=\"required || mandatory ? false : true\"\r\n [tooltip]=\"tooltip\"\r\n ></app-form-label>\r\n }\r\n\r\n <mat-form-field\r\n class=\"primary-form {{ className }}\"\r\n [ngClass]=\"{ 'input-disabled': disabled || loading,\r\n 'custom-validation': !control.hasValidator(Validators['required'])\r\n }\"\r\n [floatLabel]=\"floatLabel\"\r\n >\r\n <span class=\"sfi sfi-search fc-coral fs-18\" matPrefix></span>\r\n <label class=\"mat-form-content\">\r\n <input\r\n #autocompleteInput\r\n type=\"text\"\r\n (keydown)=\"onKeyDown($event, autocompleteInput)\"\r\n [attr.disabled]=\"disabled\"\r\n [placeholder]=\"label\"\r\n aria-label=\"Number\"\r\n matInput\r\n (input)=\"onValueChange($event)\"\r\n [formControl]=\"searchControl\"\r\n [name]=\"name\"\r\n [matAutocomplete]=\"auto\"\r\n [value]=\"value?.key\"\r\n (focusout)=\"onFocusOut()\"\r\n />\r\n </label>\r\n\r\n @if(loading) {\r\n <span class=\"sfi sfi-spinner d-inline-block spin fc-coral\" matSuffix></span>\r\n } @if(!loading && searchControl?.value) {\r\n <span\r\n class=\"sfi sfi-close d-inline-block fc-coral cursor-pointer fs-12\"\r\n (click)=\"clearInput()\"\r\n matSuffix\r\n ></span>\r\n }\r\n\r\n <mat-autocomplete\r\n autoActiveFirstOption\r\n #auto=\"matAutocomplete\"\r\n [displayWith]=\"displayFn\"\r\n (optionSelected)=\"getAutoComplete($event.option.value)\">\r\n\r\n\r\n\r\n\r\n @if(!noData) {\r\n <ng-container>\r\n @for(option of filteredOptions; track option) {\r\n <mat-option [value]=\"option\">\r\n <div class=\"d-flex align-items-center\">\r\n @if(option['avatar_url']) {\r\n <figure class=\"img-card small circled-img p-0 m-0\">\r\n <img [src]=\"option['avatar_url']\" alt=\"\" />\r\n </figure>\r\n } @if(option['avatar_url']) {\r\n <span class=\"mx-2\"></span>\r\n }\r\n\r\n {{ option[displayedLabel] }}\r\n </div>\r\n </mat-option>\r\n }\r\n </ng-container>\r\n } @if(noData) {\r\n <ng-container>\r\n <mat-option [disabled]=\"true\" class=\"text-center\">No Data</mat-option>\r\n </ng-container>\r\n }\r\n </mat-autocomplete>\r\n\r\n <!-- <mat-error class=\"mb-2\" *ngIf=\"(!control?.valid)\">{{ 'validSelectError' | translate }}{{ label }}</mat-error> -->\r\n\r\n @if(showHint) {\r\n <mat-hint>\r\n <span\r\n class=\"sfi sfi-check-circle font-10 fc-dark-gray\"\r\n [ngClass]=\"{ 'fc-oasis-light-imp': value }\"\r\n ></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\r\n <app-validation-errors [errors]=\"control.errors\"></app-validation-errors>\r\n</ng-container>\r\n}\r\n", styles: [".small-input~.btn{height:41px}:host{flex-grow:1}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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: "ngmodule", type: MatInputModule }, { kind: "directive", type: i7.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "component", type: i6.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i6.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i6.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i6.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: FormLabelComponent, selector: "app-form-label", inputs: ["tooltip", "label", "optional"] }, { kind: "component", type: ValidationErrorsComponent, selector: "app-validation-errors", inputs: ["errors", "customErrorMessages"] }, { kind: "component", type: InfoItemComponent, selector: "app-info-item", inputs: ["label", "value", "name", "type", "dateType", "multiple", "insideTable", "hasLabel", "arrayList", "actionType", "download"] }, { kind: "ngmodule", type: i4.ReactiveFormsModule }, { kind: "directive", type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] });
|
|
2375
2372
|
}
|
|
2376
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2373
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: CustomSearchableComponent, decorators: [{
|
|
2377
2374
|
type: Component,
|
|
2378
2375
|
args: [{ selector: 'app-custom-searchable', schemas: [CUSTOM_ELEMENTS_SCHEMA], imports: [
|
|
2379
2376
|
NgClass,
|
|
@@ -2511,8 +2508,8 @@ class DatePickerComponent extends ControlValueAccessorDirective {
|
|
|
2511
2508
|
document.body.classList.remove('year-only');
|
|
2512
2509
|
});
|
|
2513
2510
|
}
|
|
2514
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2515
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
2511
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: DatePickerComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
2512
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: DatePickerComponent, isStandalone: true, selector: "app-datepicker", inputs: { className: "className", calendarType: "calendarType", yearOnly: "yearOnly", error: "error", format: "format" }, outputs: { dateValue: "dateValue" }, providers: [
|
|
2516
2513
|
{
|
|
2517
2514
|
provide: NG_VALUE_ACCESSOR,
|
|
2518
2515
|
useExisting: forwardRef(() => DatePickerComponent),
|
|
@@ -2522,9 +2519,9 @@ class DatePickerComponent extends ControlValueAccessorDirective {
|
|
|
2522
2519
|
provide: MAT_DATE_FORMATS,
|
|
2523
2520
|
useClass: CustomDateFormat,
|
|
2524
2521
|
},
|
|
2525
|
-
], 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 <app-form-label [label]=\"label\" [optional]=\"required || mandatory ? false : true\" [tooltip]=\"tooltip\"></app-form-label>\r\n }\r\n\r\n <div class=\"datePicker justify-content-between mb-1\">\r\n <mat-form-field\r\n [ngClass]=\"{ 'input-disabled': isDisabled }\"\r\n [floatLabel]=\"floatLabel\"\r\n >\r\n <label class=\"mat-form-content\">\r\n <input\r\n matInput\r\n (dateInput)=\"dateChange($event)\"\r\n [placeholder]=\"label ? ('select' | translate) + ' ' + label : ''\"\r\n (click)=\"focusPicker(dp)\"\r\n [min]=\"minDateValue\"\r\n [max]=\"maxDateValue\"\r\n readonly\r\n [matDatepicker]=\"dp\"\r\n [formControl]=\"control\"\r\n />\r\n </label>\r\n\r\n @if(control?.value) {\r\n <ds-icon\r\n matSuffix\r\n icon=\"close\"\r\n class=\"fc-coral fs-10 mx-2 cursor-pointer\"\r\n (click)=\"clearDateValue($event)\"\r\n ></ds-icon>\r\n }\r\n\r\n <mat-datepicker-toggle matSuffix [for]=\"dp\">\r\n <ds-icon\r\n icon=\"calendar-o\"\r\n class=\"fc-black fs-18\"\r\n matDatepickerToggleIcon\r\n ></ds-icon>\r\n </mat-datepicker-toggle>\r\n\r\n <mat-datepicker #dp></mat-datepicker>\r\n <!-- <mat-error *ngIf=\"errorMessage\">{{errorMessage}}</mat-error> -->\r\n </mat-form-field>\r\n </div>\r\n <app-validation-errors [errors]=\"control.errors\"></app-validation-errors>\r\n\r\n </ng-container>\r\n}\r\n\r\n@if(isReadOnly && control.value) {\r\n <ng-container>\r\n <app-info-item\r\n class=\"info-item w-100\"\r\n type=\"date\"\r\n [insideTable]=\"insideTable\"\r\n [dateType]=\"calendarType\"\r\n [label]=\"label\"\r\n [value]=\"control.value\"\r\n [hasLabel]=\"!!label\"\r\n >\r\n </app-info-item>\r\n </ng-container>\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: "component", type: MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "component", type: i1$3.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "directive", type: i1$3.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "ngmodule", type: i1$3.MatDatepickerModule }, { kind: "directive", type: i1$3.MatDatepickerToggleIcon, selector: "[matDatepickerToggleIcon]" }, { kind: "ngmodule", type: i2.MatNativeDateModule }, { kind: "ngmodule", type: i6.MatFormFieldModule }, { kind: "component", type: i6.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i6.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i7.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: FormLabelComponent, selector: "app-form-label", inputs: ["tooltip", "label", "optional"] }, { kind: "component", type: ValidationErrorsComponent, selector: "app-validation-errors", inputs: ["errors", "customErrorMessages"] }, { kind: "component", type: InfoItemComponent, selector: "app-info-item", inputs: ["label", "value", "name", "type", "dateType", "multiple", "insideTable", "hasLabel", "arrayList", "actionType", "download"] }, { kind: "ngmodule", type: i4.ReactiveFormsModule }, { kind: "directive", type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
|
|
2522
|
+
], 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 <app-form-label [label]=\"label\" [optional]=\"required || mandatory ? false : true\" [tooltip]=\"tooltip\"></app-form-label>\r\n }\r\n\r\n <div class=\"datePicker justify-content-between mb-1\">\r\n <mat-form-field\r\n [ngClass]=\"{ 'input-disabled': isDisabled }\"\r\n [floatLabel]=\"floatLabel\"\r\n >\r\n <label class=\"mat-form-content\">\r\n <input\r\n matInput\r\n (dateInput)=\"dateChange($event)\"\r\n [placeholder]=\"label ? ('select' | translate) + ' ' + label : ''\"\r\n (click)=\"focusPicker(dp)\"\r\n [min]=\"minDateValue\"\r\n [max]=\"maxDateValue\"\r\n readonly\r\n [matDatepicker]=\"dp\"\r\n [formControl]=\"control\"\r\n />\r\n </label>\r\n\r\n @if(control?.value) {\r\n <ds-icon\r\n matSuffix\r\n icon=\"close\"\r\n class=\"fc-coral fs-10 mx-2 cursor-pointer\"\r\n (click)=\"clearDateValue($event)\"\r\n ></ds-icon>\r\n }\r\n\r\n <mat-datepicker-toggle matSuffix [for]=\"dp\">\r\n <ds-icon\r\n icon=\"calendar-o\"\r\n class=\"fc-black fs-18\"\r\n matDatepickerToggleIcon\r\n ></ds-icon>\r\n </mat-datepicker-toggle>\r\n\r\n <mat-datepicker #dp></mat-datepicker>\r\n <!-- <mat-error *ngIf=\"errorMessage\">{{errorMessage}}</mat-error> -->\r\n </mat-form-field>\r\n </div>\r\n <app-validation-errors [errors]=\"control.errors\"></app-validation-errors>\r\n\r\n </ng-container>\r\n}\r\n\r\n@if(isReadOnly && control.value) {\r\n <ng-container>\r\n <app-info-item\r\n class=\"info-item w-100\"\r\n type=\"date\"\r\n [insideTable]=\"insideTable\"\r\n [dateType]=\"calendarType\"\r\n [label]=\"label\"\r\n [value]=\"control.value\"\r\n [hasLabel]=\"!!label\"\r\n >\r\n </app-info-item>\r\n </ng-container>\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: "component", type: MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "component", type: i1$3.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "directive", type: i1$3.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "ngmodule", type: i1$3.MatDatepickerModule }, { kind: "directive", type: i1$3.MatDatepickerToggleIcon, selector: "[matDatepickerToggleIcon]" }, { kind: "ngmodule", type: i2.MatNativeDateModule }, { kind: "ngmodule", type: i6.MatFormFieldModule }, { kind: "component", type: i6.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i6.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i7.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "component", type: FormLabelComponent, selector: "app-form-label", inputs: ["tooltip", "label", "optional"] }, { kind: "component", type: ValidationErrorsComponent, selector: "app-validation-errors", inputs: ["errors", "customErrorMessages"] }, { kind: "component", type: InfoItemComponent, selector: "app-info-item", inputs: ["label", "value", "name", "type", "dateType", "multiple", "insideTable", "hasLabel", "arrayList", "actionType", "download"] }, { kind: "ngmodule", type: i4.ReactiveFormsModule }, { kind: "directive", type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
|
|
2526
2523
|
}
|
|
2527
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2524
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: DatePickerComponent, decorators: [{
|
|
2528
2525
|
type: Component,
|
|
2529
2526
|
args: [{ selector: 'app-datepicker', standalone: true, schemas: [CUSTOM_ELEMENTS_SCHEMA], providers: [
|
|
2530
2527
|
{
|
|
@@ -2685,8 +2682,8 @@ class DateRangePickerComponent extends ControlValueAccessorDirective {
|
|
|
2685
2682
|
document.body.classList.remove('year-only');
|
|
2686
2683
|
});
|
|
2687
2684
|
}
|
|
2688
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2689
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
2685
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: DateRangePickerComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
2686
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: DateRangePickerComponent, isStandalone: true, selector: "app-date-range-picker", inputs: { className: "className", yearOnly: "yearOnly", calendarType: "calendarType" }, providers: [
|
|
2690
2687
|
{
|
|
2691
2688
|
provide: NG_VALUE_ACCESSOR,
|
|
2692
2689
|
useExisting: forwardRef(() => DateRangePickerComponent),
|
|
@@ -2698,7 +2695,7 @@ class DateRangePickerComponent extends ControlValueAccessorDirective {
|
|
|
2698
2695
|
},
|
|
2699
2696
|
], viewQueries: [{ propertyName: "datepicker", first: true, predicate: MatDatepicker, descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@if(!isReadOnly) {\r\n @if(label) {\r\n <app-form-label [label]=\"label\" [optional]=\"required || mandatory ? false : true\" [tooltip]=\"tooltip\"></app-form-label>\r\n }\r\n\r\n<div class=\"datePicker\">\r\n <mat-form-field class=\"date-range primary-form {{ className }}\"\r\n [ngClass]=\"{\r\n 'custom-validation-error': !startDateControl.value && !endDateControl.value && startDateControl.touched\r\n }\">\r\n <label class=\"mat-form-content\">\r\n <mat-date-range-input\r\n [rangePicker]=\"picker\"\r\n [min]=\"minDateValue\"\r\n [max]=\"maxDateValue\"\r\n >\r\n <input\r\n matStartDate\r\n placeholder=\"{{ 'startDate' | translate }}\"\r\n [formControl]=\"startDateControl\"\r\n (dateInput)=\"startDateChange($event)\"\r\n (click)=\"focusPicker(picker)\"\r\n readonly\r\n />\r\n <input\r\n matEndDate\r\n placeholder=\"{{ 'endDate' | translate }}\"\r\n [formControl]=\"endDateControl\"\r\n (dateInput)=\"endDateChange($event)\"\r\n (click)=\"focusPicker(picker)\"\r\n readonly\r\n />\r\n </mat-date-range-input>\r\n </label>\r\n\r\n @if(control?.value) {\r\n <ds-icon\r\n matSuffix\r\n icon=\"close\"\r\n class=\"fc-coral fs-10 mx-2 cursor-pointer\"\r\n (click)=\"clearDateValue($event)\"\r\n ></ds-icon>\r\n }\r\n\r\n <mat-datepicker-toggle matSuffix [for]=\"picker\" [disableRipple]=\"true\">\r\n <i class=\"sfi sfi-calendar-o fc-black font-18\" matDatepickerToggleIcon></i>\r\n </mat-datepicker-toggle>\r\n\r\n <mat-date-range-picker #picker></mat-date-range-picker>\r\n </mat-form-field>\r\n</div>\r\n<app-validation-errors [errors]=\"control.errors\"></app-validation-errors>\r\n\r\n\r\n} @else if(isReadOnly && control.value) {\r\n<ng-container>\r\n <app-info-item\r\n class=\"info-item w-100\"\r\n type=\"date\"\r\n [insideTable]=\"insideTable\"\r\n [dateType]=\"calendarType\"\r\n [label]=\"label\"\r\n [value]=\"{\r\n startDate: control?.value?.startDate,\r\n endDate: control?.value?.endDate\r\n }\"\r\n [hasLabel]=\"!!label\"\r\n >\r\n </app-info-item>\r\n</ng-container>\r\n}\r\n", styles: [":host{flex-grow:1}\n"], dependencies: [{ kind: "component", type: i1$3.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "ngmodule", type: i1$3.MatDatepickerModule }, { kind: "directive", type: i1$3.MatDatepickerToggleIcon, selector: "[matDatepickerToggleIcon]" }, { kind: "component", type: i1$3.MatDateRangeInput, selector: "mat-date-range-input", inputs: ["rangePicker", "required", "dateFilter", "min", "max", "disabled", "separator", "comparisonStart", "comparisonEnd"], exportAs: ["matDateRangeInput"] }, { kind: "directive", type: i1$3.MatStartDate, selector: "input[matStartDate]", outputs: ["dateChange", "dateInput"] }, { kind: "directive", type: i1$3.MatEndDate, selector: "input[matEndDate]", outputs: ["dateChange", "dateInput"] }, { kind: "component", type: i1$3.MatDateRangePicker, selector: "mat-date-range-picker", exportAs: ["matDateRangePicker"] }, { kind: "ngmodule", type: i2.MatNativeDateModule }, { kind: "ngmodule", type: i6.MatFormFieldModule }, { kind: "component", type: i6.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i6.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: FormLabelComponent, selector: "app-form-label", inputs: ["tooltip", "label", "optional"] }, { kind: "component", type: ValidationErrorsComponent, selector: "app-validation-errors", inputs: ["errors", "customErrorMessages"] }, { kind: "component", type: InfoItemComponent, selector: "app-info-item", inputs: ["label", "value", "name", "type", "dateType", "multiple", "insideTable", "hasLabel", "arrayList", "actionType", "download"] }, { kind: "ngmodule", type: i4.ReactiveFormsModule }, { kind: "directive", type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
|
|
2700
2697
|
}
|
|
2701
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2698
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: DateRangePickerComponent, decorators: [{
|
|
2702
2699
|
type: Component,
|
|
2703
2700
|
args: [{ selector: 'app-date-range-picker', schemas: [CUSTOM_ELEMENTS_SCHEMA], standalone: true, providers: [
|
|
2704
2701
|
{
|
|
@@ -2747,16 +2744,16 @@ class InputComponent extends ControlValueAccessorDirective {
|
|
|
2747
2744
|
}
|
|
2748
2745
|
});
|
|
2749
2746
|
}
|
|
2750
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2751
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
2747
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: InputComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
2748
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: InputComponent, isStandalone: true, selector: "app-input", inputs: { floatLabel: "floatLabel", className: "className", iconPrefixName: "iconPrefixName", iconSuffixName: "iconSuffixName", emitedChangedValue1: "emitedChangedValue1", customErrorMessages: "customErrorMessages" }, providers: [
|
|
2752
2749
|
{
|
|
2753
2750
|
provide: NG_VALUE_ACCESSOR,
|
|
2754
2751
|
useExisting: forwardRef(() => InputComponent),
|
|
2755
2752
|
multi: true,
|
|
2756
2753
|
},
|
|
2757
|
-
], usesInheritance: true, ngImport: i0, template: "@if(!isReadOnly){\r\n@if(label){\r\n<app-form-label [label]=\"label\" [optional]=\"required || mandatory ? false : true\" [tooltip]=\"tooltip\"></app-form-label>\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 [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 [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\" [customErrorMessages]=\"customErrorMessages\"></app-validation-errors>\r\n\r\n} @if(isReadOnly && control.value && (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", styles: [""], dependencies: [{ kind: "directive", type: MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: EnOnlyDirective, selector: "[enOnly]" }, { kind: "directive", type: ArOnlyDirective, selector: "[arOnly]" }, { kind: "component", type: FormLabelComponent, selector: "app-form-label", inputs: ["tooltip", "label", "optional"] }, { kind: "component", type: ValidationErrorsComponent, selector: "app-validation-errors", inputs: ["errors", "customErrorMessages"] }, { kind: "component", type: InfoItemComponent, selector: "app-info-item", inputs: ["label", "value", "name", "type", "dateType", "multiple", "insideTable", "hasLabel", "arrayList", "actionType", "download"] }, { kind: "ngmodule", type: i4.ReactiveFormsModule }, { kind: "directive", type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: i6.MatFormFieldModule }, { kind: "component", type: i6.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i6.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i7.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"] }] });
|
|
2754
|
+
], usesInheritance: true, ngImport: i0, template: "@if(!isReadOnly){\r\n@if(label){\r\n<app-form-label [label]=\"label\" [optional]=\"required || mandatory ? false : true\" [tooltip]=\"tooltip\"></app-form-label>\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 [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 [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\" [customErrorMessages]=\"customErrorMessages\"></app-validation-errors>\r\n\r\n} @if(isReadOnly && control.value && (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", styles: [""], dependencies: [{ kind: "directive", type: MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: EnOnlyDirective, selector: "[enOnly]" }, { kind: "directive", type: ArOnlyDirective, selector: "[arOnly]" }, { kind: "component", type: FormLabelComponent, selector: "app-form-label", inputs: ["tooltip", "label", "optional"] }, { kind: "component", type: ValidationErrorsComponent, selector: "app-validation-errors", inputs: ["errors", "customErrorMessages"] }, { kind: "component", type: InfoItemComponent, selector: "app-info-item", inputs: ["label", "value", "name", "type", "dateType", "multiple", "insideTable", "hasLabel", "arrayList", "actionType", "download"] }, { kind: "ngmodule", type: i4.ReactiveFormsModule }, { kind: "directive", type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: i6.MatFormFieldModule }, { kind: "component", type: i6.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i6.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i7.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }] });
|
|
2758
2755
|
}
|
|
2759
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2756
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: InputComponent, decorators: [{
|
|
2760
2757
|
type: Component,
|
|
2761
2758
|
args: [{ selector: 'app-input', schemas: [CUSTOM_ELEMENTS_SCHEMA], imports: [
|
|
2762
2759
|
MatHint,
|
|
@@ -2828,10 +2825,10 @@ class NumberDirective {
|
|
|
2828
2825
|
onPaste() {
|
|
2829
2826
|
this.run(this.el.nativeElement.value);
|
|
2830
2827
|
}
|
|
2831
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2832
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
2828
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: NumberDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
|
|
2829
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.1", type: NumberDirective, isStandalone: true, selector: "[numberOnly]", inputs: { decimals: "decimals" }, host: { listeners: { "keypress": "onKeyPress($event)", "keydown": "onKeyDown($event)", "paste": "onPaste($event)" } }, ngImport: i0 });
|
|
2833
2830
|
}
|
|
2834
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2831
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: NumberDirective, decorators: [{
|
|
2835
2832
|
type: Directive,
|
|
2836
2833
|
args: [{
|
|
2837
2834
|
selector: "[numberOnly]",
|
|
@@ -2872,16 +2869,16 @@ class InputNumberComponent extends ControlValueAccessorDirective {
|
|
|
2872
2869
|
}
|
|
2873
2870
|
});
|
|
2874
2871
|
}
|
|
2875
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2876
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
2872
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: InputNumberComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
2873
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: InputNumberComponent, isStandalone: true, selector: "app-input-number", inputs: { floatLabel: "floatLabel", className: "className", iconPrefixName: "iconPrefixName", iconSuffixName: "iconSuffixName", numberSuffixName: "numberSuffixName", allowedPattern: "allowedPattern" }, outputs: { emitedChangedValue: "emitedChangedValue" }, providers: [
|
|
2877
2874
|
{
|
|
2878
2875
|
provide: NG_VALUE_ACCESSOR,
|
|
2879
2876
|
useExisting: forwardRef(() => InputNumberComponent),
|
|
2880
2877
|
multi: true,
|
|
2881
2878
|
},
|
|
2882
|
-
], usesInheritance: true, ngImport: i0, template: "@if(!isReadOnly){\r\n @if(label){\r\n <app-form-label [label]=\"label\" [optional]=\"required || mandatory ? false : true\" [tooltip]=\"tooltip\"></app-form-label>\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 && control.value && (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", styles: [":host{flex-grow:1}.input-disabled{pointer-events:none;opacity:1.5}\n"], dependencies: [{ kind: "directive", type: NumberDirective, selector: "[numberOnly]", inputs: ["decimals"] }, { kind: "component", type: FormLabelComponent, selector: "app-form-label", inputs: ["tooltip", "label", "optional"] }, { kind: "component", type: ValidationErrorsComponent, selector: "app-validation-errors", inputs: ["errors", "customErrorMessages"] }, { kind: "component", type: InfoItemComponent, selector: "app-info-item", inputs: ["label", "value", "name", "type", "dateType", "multiple", "insideTable", "hasLabel", "arrayList", "actionType", "download"] }, { kind: "ngmodule", type: i4.ReactiveFormsModule }, { kind: "directive", type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: i6.MatFormFieldModule }, { kind: "component", type: i6.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i6.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i6.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i7.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"] }] });
|
|
2879
|
+
], usesInheritance: true, ngImport: i0, template: "@if(!isReadOnly){\r\n @if(label){\r\n <app-form-label [label]=\"label\" [optional]=\"required || mandatory ? false : true\" [tooltip]=\"tooltip\"></app-form-label>\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 && control.value && (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", styles: [":host{flex-grow:1}.input-disabled{pointer-events:none;opacity:1.5}\n"], dependencies: [{ kind: "directive", type: NumberDirective, selector: "[numberOnly]", inputs: ["decimals"] }, { kind: "component", type: FormLabelComponent, selector: "app-form-label", inputs: ["tooltip", "label", "optional"] }, { kind: "component", type: ValidationErrorsComponent, selector: "app-validation-errors", inputs: ["errors", "customErrorMessages"] }, { kind: "component", type: InfoItemComponent, selector: "app-info-item", inputs: ["label", "value", "name", "type", "dateType", "multiple", "insideTable", "hasLabel", "arrayList", "actionType", "download"] }, { kind: "ngmodule", type: i4.ReactiveFormsModule }, { kind: "directive", type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: i6.MatFormFieldModule }, { kind: "component", type: i6.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i6.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i6.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i7.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }] });
|
|
2883
2880
|
}
|
|
2884
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2881
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: InputNumberComponent, decorators: [{
|
|
2885
2882
|
type: Component,
|
|
2886
2883
|
args: [{ selector: 'app-input-number', schemas: [CUSTOM_ELEMENTS_SCHEMA], standalone: true, imports: [
|
|
2887
2884
|
NumberDirective,
|
|
@@ -2931,16 +2928,16 @@ class InputEmailComponent extends ControlValueAccessorDirective {
|
|
|
2931
2928
|
}
|
|
2932
2929
|
});
|
|
2933
2930
|
}
|
|
2934
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2935
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
2931
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: InputEmailComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
2932
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: InputEmailComponent, isStandalone: true, selector: "app-input-email", inputs: { floatLabel: "floatLabel", className: "className", matPrefix: "matPrefix", iconPrefixName: "iconPrefixName", iconSuffixName: "iconSuffixName", numberSuffixName: "numberSuffixName" }, providers: [
|
|
2936
2933
|
{
|
|
2937
2934
|
provide: NG_VALUE_ACCESSOR,
|
|
2938
2935
|
useExisting: forwardRef(() => InputEmailComponent),
|
|
2939
2936
|
multi: true,
|
|
2940
2937
|
},
|
|
2941
|
-
], usesInheritance: true, ngImport: i0, template: "@if(!isReadOnly){\r\n @if(label){\r\n <app-form-label [label]=\"label\" [optional]=\"required || mandatory ? false : true\" [tooltip]=\"tooltip\"></app-form-label>\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 && control.value && (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", styles: [":host{flex-grow:1}.input-disabled{pointer-events:none;opacity:1.5}\n"], dependencies: [{ kind: "component", type: FormLabelComponent, selector: "app-form-label", inputs: ["tooltip", "label", "optional"] }, { kind: "component", type: ValidationErrorsComponent, selector: "app-validation-errors", inputs: ["errors", "customErrorMessages"] }, { kind: "component", type: InfoItemComponent, selector: "app-info-item", inputs: ["label", "value", "name", "type", "dateType", "multiple", "insideTable", "hasLabel", "arrayList", "actionType", "download"] }, { kind: "ngmodule", type: i4.ReactiveFormsModule }, { kind: "directive", type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: i6.MatFormFieldModule }, { kind: "component", type: i6.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i6.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i6.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i7.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"] }] });
|
|
2938
|
+
], usesInheritance: true, ngImport: i0, template: "@if(!isReadOnly){\r\n @if(label){\r\n <app-form-label [label]=\"label\" [optional]=\"required || mandatory ? false : true\" [tooltip]=\"tooltip\"></app-form-label>\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 && control.value && (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", styles: [":host{flex-grow:1}.input-disabled{pointer-events:none;opacity:1.5}\n"], dependencies: [{ kind: "component", type: FormLabelComponent, selector: "app-form-label", inputs: ["tooltip", "label", "optional"] }, { kind: "component", type: ValidationErrorsComponent, selector: "app-validation-errors", inputs: ["errors", "customErrorMessages"] }, { kind: "component", type: InfoItemComponent, selector: "app-info-item", inputs: ["label", "value", "name", "type", "dateType", "multiple", "insideTable", "hasLabel", "arrayList", "actionType", "download"] }, { kind: "ngmodule", type: i4.ReactiveFormsModule }, { kind: "directive", type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: i6.MatFormFieldModule }, { kind: "component", type: i6.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i6.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i6.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i7.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }] });
|
|
2942
2939
|
}
|
|
2943
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2940
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: InputEmailComponent, decorators: [{
|
|
2944
2941
|
type: Component,
|
|
2945
2942
|
args: [{ selector: 'app-input-email', schemas: [CUSTOM_ELEMENTS_SCHEMA], standalone: true, imports: [
|
|
2946
2943
|
...Shareds,
|
|
@@ -2977,8 +2974,8 @@ class InputMaskComponent extends ControlValueAccessorDirective {
|
|
|
2977
2974
|
iconPrefixName;
|
|
2978
2975
|
iconSuffixName;
|
|
2979
2976
|
numberSuffixName;
|
|
2980
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
2981
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
2977
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: InputMaskComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
2978
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: InputMaskComponent, isStandalone: true, selector: "app-input-mask", inputs: { floatLabel: "floatLabel", className: "className", matPrefix: "matPrefix", iconPrefixName: "iconPrefixName", iconSuffixName: "iconSuffixName", numberSuffixName: "numberSuffixName" }, providers: [
|
|
2982
2979
|
{
|
|
2983
2980
|
provide: NG_VALUE_ACCESSOR,
|
|
2984
2981
|
useExisting: forwardRef(() => InputMaskComponent),
|
|
@@ -2986,7 +2983,7 @@ class InputMaskComponent extends ControlValueAccessorDirective {
|
|
|
2986
2983
|
},
|
|
2987
2984
|
], 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.value){\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$2.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: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
|
|
2988
2985
|
}
|
|
2989
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
2986
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: InputMaskComponent, decorators: [{
|
|
2990
2987
|
type: Component,
|
|
2991
2988
|
args: [{ selector: 'app-input-mask', schemas: [CUSTOM_ELEMENTS_SCHEMA], standalone: true, providers: [
|
|
2992
2989
|
{
|
|
@@ -3068,10 +3065,10 @@ class MycurrencyDirective {
|
|
|
3068
3065
|
e.preventDefault();
|
|
3069
3066
|
}
|
|
3070
3067
|
}
|
|
3071
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
3072
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
3068
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: MycurrencyDirective, deps: [{ token: i0.ElementRef }, { token: MycurrencyPipe }], target: i0.ɵɵFactoryTarget.Directive });
|
|
3069
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.1", type: MycurrencyDirective, isStandalone: true, selector: "[appMycurrency]", inputs: { decimals: "decimals" }, host: { listeners: { "focus": "onFocus($event.target.value,$event)", "blur": "onBlur($event.target.value)", "keydown": "onKeyDown($event)" } }, ngImport: i0 });
|
|
3073
3070
|
}
|
|
3074
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
3071
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: MycurrencyDirective, decorators: [{
|
|
3075
3072
|
type: Directive,
|
|
3076
3073
|
args: [{
|
|
3077
3074
|
selector: '[appMycurrency]',
|
|
@@ -3108,17 +3105,17 @@ class InputCurrencyComponent extends ControlValueAccessorDirective {
|
|
|
3108
3105
|
}
|
|
3109
3106
|
});
|
|
3110
3107
|
}
|
|
3111
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
3112
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
3108
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: InputCurrencyComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
3109
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: InputCurrencyComponent, isStandalone: true, selector: "app-input-currency", inputs: { floatLabel: "floatLabel", className: "className", iconPrefixName: "iconPrefixName", iconSuffixName: "iconSuffixName", numberSuffixName: "numberSuffixName" }, providers: [
|
|
3113
3110
|
{
|
|
3114
3111
|
provide: NG_VALUE_ACCESSOR,
|
|
3115
3112
|
useExisting: forwardRef(() => InputCurrencyComponent),
|
|
3116
3113
|
multi: true,
|
|
3117
3114
|
},
|
|
3118
3115
|
MycurrencyPipe
|
|
3119
|
-
], usesInheritance: true, ngImport: i0, template: "@if(!isReadOnly){\r\n @if(label){\r\n <app-form-label [label]=\"label\" [optional]=\"required || mandatory ? false : true\" [tooltip]=\"tooltip\"></app-form-label>\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 && control.value && (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]=\"'currency'\"\r\n [value]=\"control.value\"\r\n ></app-info-item>\r\n </ng-container>\r\n }\r\n", styles: [":host{flex-grow:1}.input-disabled{pointer-events:none!important;opacity:1.5}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: MycurrencyDirective, selector: "[appMycurrency]", inputs: ["decimals"] }, { kind: "component", type: FormLabelComponent, selector: "app-form-label", inputs: ["tooltip", "label", "optional"] }, { kind: "component", type: ValidationErrorsComponent, selector: "app-validation-errors", inputs: ["errors", "customErrorMessages"] }, { kind: "component", type: InfoItemComponent, selector: "app-info-item", inputs: ["label", "value", "name", "type", "dateType", "multiple", "insideTable", "hasLabel", "arrayList", "actionType", "download"] }, { kind: "ngmodule", type: i4.ReactiveFormsModule }, { kind: "directive", type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: i6.MatFormFieldModule }, { kind: "component", type: i6.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i6.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i7.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"] }] });
|
|
3116
|
+
], usesInheritance: true, ngImport: i0, template: "@if(!isReadOnly){\r\n @if(label){\r\n <app-form-label [label]=\"label\" [optional]=\"required || mandatory ? false : true\" [tooltip]=\"tooltip\"></app-form-label>\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 && control.value && (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]=\"'currency'\"\r\n [value]=\"control.value\"\r\n ></app-info-item>\r\n </ng-container>\r\n }\r\n", styles: [":host{flex-grow:1}.input-disabled{pointer-events:none!important;opacity:1.5}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: MycurrencyDirective, selector: "[appMycurrency]", inputs: ["decimals"] }, { kind: "component", type: FormLabelComponent, selector: "app-form-label", inputs: ["tooltip", "label", "optional"] }, { kind: "component", type: ValidationErrorsComponent, selector: "app-validation-errors", inputs: ["errors", "customErrorMessages"] }, { kind: "component", type: InfoItemComponent, selector: "app-info-item", inputs: ["label", "value", "name", "type", "dateType", "multiple", "insideTable", "hasLabel", "arrayList", "actionType", "download"] }, { kind: "ngmodule", type: i4.ReactiveFormsModule }, { kind: "directive", type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: i6.MatFormFieldModule }, { kind: "component", type: i6.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i6.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i7.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }] });
|
|
3120
3117
|
}
|
|
3121
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
3118
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: InputCurrencyComponent, decorators: [{
|
|
3122
3119
|
type: Component,
|
|
3123
3120
|
args: [{ selector: 'app-input-currency', schemas: [CUSTOM_ELEMENTS_SCHEMA], standalone: true, imports: [
|
|
3124
3121
|
NgClass,
|
|
@@ -3191,8 +3188,8 @@ class InputTelephoneComponent extends ControlValueAccessorDirective {
|
|
|
3191
3188
|
this.control.markAsTouched();
|
|
3192
3189
|
}
|
|
3193
3190
|
}
|
|
3194
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
3195
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
3191
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: InputTelephoneComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
3192
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: InputTelephoneComponent, isStandalone: true, selector: "app-input-telephone", inputs: { floatLabel: "floatLabel", className: "className" }, providers: [
|
|
3196
3193
|
{
|
|
3197
3194
|
provide: NG_VALUE_ACCESSOR,
|
|
3198
3195
|
useExisting: forwardRef(() => InputTelephoneComponent),
|
|
@@ -3200,7 +3197,7 @@ class InputTelephoneComponent extends ControlValueAccessorDirective {
|
|
|
3200
3197
|
},
|
|
3201
3198
|
], usesInheritance: true, ngImport: i0, template: "@if(!isReadOnly){\r\n <ng-container>\r\n @if(label){\r\n <app-form-label [label]=\"label\" [optional]=\"required || mandatory ? false : true\" [tooltip]=\"tooltip\"></app-form-label>\r\n }\r\n <!-- <mat-form-field style=\"height: 50px;\" class=\"primary-form input-telephone {{className}}\" floatLabel=\"always\"> -->\r\n <div class=\"primary-form input-telephone {{className}}\" floatLabel=\"always\">\r\n <label class=\"mat-form-content\">\r\n <!-- [placeholder]=\"label\" -->\r\n <!-- <input matInput [disabled]=\"disabled\" ng2TelInput numberOnly #phone\r\n [ng2TelInputOptions]=\"{initialCountry: 'sa', utilsScript: 'assets/js/utils.js'}\" (hasError)=\"hasError($event)\"\r\n (ng2TelOutput)=\"getNumber($event)\" (intlTelInputObject)=\"telInputObject($event)\"\r\n (countryChange)=\"onCountryChange($event)\" [(ngModel)]=\"field\" [name]=\"name\"\r\n oninput=\"this.value.replace(/[^0-9.]/g, ''); this.value = this.value.replace(/(\\..*)\\./g, '$1');\"\r\n [maxlength]=\"maxLength\" [minLength]=\"minLength\" />-->\r\n <!-- <input matInput [hidden]=\"true\"/> -->\r\n <ngx-intl-tel-input\r\n (input)=\"setControlValue(telephoneControl.value)\"\r\n [formControl]=\"telephoneControl\"\r\n [cssClass]=\"'custom'\"\r\n [preferredCountries]=\"[CountryISO.UnitedStates, CountryISO.UnitedKingdom]\"\r\n [enableAutoCountrySelect]=\"false\"\r\n [enablePlaceholder]=\"true\"\r\n [searchCountryFlag]=\"true\"\r\n [searchCountryField]=\"[SearchCountryField.Iso2, SearchCountryField.Name]\"\r\n [selectFirstCountry]=\"false\"\r\n [selectedCountryISO]=\"CountryISO.SaudiArabia\"\r\n [maxLength]=\"17\"\r\n [phoneValidation]=\"true\"\r\n [inputId]=\"\"\r\n name=\"phone\"\r\n ></ngx-intl-tel-input>\r\n </label>\r\n </div>\r\n <!-- </mat-form-field> -->\r\n <!-- <app-validation-errors [errors]=\"telephoneControl.errors\"></app-validation-errors> -->\r\n @if(telephoneControl.touched){\r\n @for(error of telephoneControl.errors | keyvalue; track error ) {\r\n <mat-error class=\"mb-2\">\r\n {{ errorMessages[error.key] }}\r\n </mat-error>\r\n }\r\n }\r\n\r\n </ng-container>\r\n}\r\n@if(isReadOnly && control.value){\r\n <ng-container>\r\n <app-info-item class=\"info-item w-100\" [type]=\"'telephone'\" [label]=\"label\"\r\n [value]=\"control.value\"></app-info-item>\r\n </ng-container>\r\n}\r\n", styles: ["[dir=rtl] :host .mat-input-element{direction:ltr;text-align:right}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i5.KeyValuePipe, name: "keyvalue" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: NgxIntlTelInputModule }, { kind: "component", type: i3$1.NgxIntlTelInputComponent, selector: "ngx-intl-tel-input", inputs: ["value", "preferredCountries", "enablePlaceholder", "customPlaceholder", "numberFormat", "cssClass", "onlyCountries", "enableAutoCountrySelect", "searchCountryFlag", "searchCountryField", "searchCountryPlaceholder", "maxLength", "selectFirstCountry", "selectedCountryISO", "phoneValidation", "inputId", "separateDialCode"], outputs: ["countryChange"] }, { kind: "directive", type: i3$1.NativeElementInjectorDirective, selector: "[ngModel], [formControl], [formControlName]" }, { kind: "component", type: FormLabelComponent, selector: "app-form-label", inputs: ["tooltip", "label", "optional"] }, { kind: "component", type: InfoItemComponent, selector: "app-info-item", inputs: ["label", "value", "name", "type", "dateType", "multiple", "insideTable", "hasLabel", "arrayList", "actionType", "download"] }, { kind: "ngmodule", type: i4.ReactiveFormsModule }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] });
|
|
3202
3199
|
}
|
|
3203
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
3200
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: InputTelephoneComponent, decorators: [{
|
|
3204
3201
|
type: Component,
|
|
3205
3202
|
args: [{ selector: 'app-input-telephone', schemas: [CUSTOM_ELEMENTS_SCHEMA], standalone: true, imports: [
|
|
3206
3203
|
CommonModule,
|
|
@@ -3338,16 +3335,16 @@ class SearchEmployeeComponent extends ControlValueAccessorDirective {
|
|
|
3338
3335
|
this.employeeSearchControl.setValue(object.name);
|
|
3339
3336
|
}
|
|
3340
3337
|
}
|
|
3341
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
3342
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
3338
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SearchEmployeeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
3339
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: SearchEmployeeComponent, isStandalone: true, selector: "app-search-employee", inputs: { valueName: "valueName", className: "className", 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" }, providers: [
|
|
3343
3340
|
{
|
|
3344
3341
|
provide: NG_VALUE_ACCESSOR,
|
|
3345
3342
|
useExisting: forwardRef(() => SearchEmployeeComponent),
|
|
3346
3343
|
multi: true,
|
|
3347
3344
|
},
|
|
3348
|
-
], usesInheritance: true, ngImport: i0, template: "@if (!isReadOnly) {\r\n<ng-container>\r\n @if(label) {\r\n <app-form-label\r\n [label]=\"label\"\r\n [optional]=\"required || mandatory ? false : true\"\r\n [tooltip]=\"tooltip\"\r\n ></app-form-label>\r\n }\r\n <mat-form-field\r\n class=\"primary-form {{ className }}\"\r\n [floatLabel]=\"floatLabel\"\r\n [ngClass]=\"{\r\n 'custom-validation': !control.errors\r\n }\"\r\n >\r\n <mat-label>{{ label }}</mat-label>\r\n <ds-icon icon=\"search\" class=\"fc-coral fs-18\"></ds-icon>\r\n <label class=\"mat-form-content\">\r\n <input\r\n type=\"text\"\r\n aria-label=\"Number\"\r\n (input)=\"onLoadOptions($event)\"\r\n matInput\r\n [disabled]=\"isDisabled\"\r\n [matAutocomplete]=\"auto\"\r\n [formControl]=\"employeeSearchControl\"\r\n />\r\n </label>\r\n @if (loading) {\r\n <span class=\"sfi sfi-spinner d-inline-block spin fc-coral\" matSuffix></span>\r\n }\r\n <mat-autocomplete #auto=\"matAutocomplete\">\r\n @for (option of data; track option) {\r\n <mat-option\r\n [value]=\"option?.['personName']\"\r\n (onSelectionChange)=\"selectOption(option, $event)\"\r\n >\r\n <div class=\"d-flex align-items-center gap-3\">\r\n <div class=\"dropdown-img\">\r\n <ds-avatar\r\n [image]=\"getImage(option?.email)\"\r\n onerror=\"this.onerror=null;this.src='assets/images/user.svg';\"\r\n slot=\"prefix\"\r\n class=\"avatar\"\r\n size=\"small\"\r\n >\r\n </ds-avatar>\r\n </div>\r\n <div class=\"line-height-1\">\r\n <h6 class=\"fs-14 fw-medium fc-onyx mb-0 line-height-1\">\r\n {{ option?.name }}\r\n </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\r\n }\r\n </mat-autocomplete>\r\n @if (showHint) {\r\n <mat-hint>\r\n <span\r\n class=\"sfi sfi-check-circle font-10 fc-dark-gray\"\r\n [ngClass]=\"{ 'fc-oasis-light-imp': value }\"\r\n ></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\r\n\r\n <!-- <app-validation-errors [errors]=\"customErrorMessage || employeeSearchControl.errors\" [isEmployeeSearchControl]=\"multiple? true: false\"></app-validation-errors> -->\r\n @if(control.invalid && employeeSearchControl.touched){\r\n <mat-error class=\"mb-2\">\r\n this filed is required\r\n </mat-error>\r\n }\r\n\r\n\r\n\r\n @if (userAlreadyExist) {\r\n <mat-error class=\"mb-2\">{{ \"userAlreadyExist\" | translate }}</mat-error>\r\n } @if (arrayList?.length && !isReadOnly && multiple) {\r\n <div class=\"col-12 mt-2\">\r\n <div class=\"example-list n-results\">\r\n @for (emails of arrayList; track $index) {\r\n <div class=\"example-box n-col px-3\" [ngClass]=\"{ 'mt-0': $index === 0 }\">\r\n <div class=\"d-flex flex-grow-1 w-100\">\r\n <div class=\"user-info flex-grow-1\">\r\n <ds-avatar\r\n [image]=\"getImage(emails?.['personEmail'])\"\r\n onerror=\"this.onerror=null;this.src='assets/images/user.svg';\"\r\n slot=\"prefix\"\r\n class=\"avatar prof-img\"\r\n >\r\n </ds-avatar>\r\n @if (emails?.['personName']) {\r\n <label>\r\n {{ emails?.['personName'] }}\r\n <span class=\"title\">{{ emails?.['personEmail'] }}</span>\r\n </label>\r\n }\r\n </div>\r\n @if (!isReadOnly) {\r\n <ds-button\r\n class=\"ds-btn-action\"\r\n size=\"small\"\r\n (click)=\"deleteRow($index, emails)\"\r\n icon\r\n >\r\n <ds-icon icon=\"trash\" class=\"fc-coral fs-20\"></ds-icon>\r\n </ds-button>\r\n }\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n }\r\n</ng-container>\r\n} @if (isReadOnly && control.value) {\r\n<ng-container>\r\n <app-info-item\r\n class=\"info-item\"\r\n type=\"user-picker\"\r\n [hasLabel]=\"!!label\"\r\n [multiple]=\"multiple\"\r\n [ngClass]=\"{ 'user-picker': !isReadOnly }\"\r\n [actionType]=\"!isReadOnly ? 'delete' : 'edit'\"\r\n [label]=\"label\"\r\n [name]=\"control.value['personName']\"\r\n [value]=\"control.value['personEmail']\"\r\n [arrayList]=\"arrayList\"\r\n >\r\n </app-info-item>\r\n</ng-container>\r\n}\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>{{ \"searchEmployeeTooltip_1\" | translate }}</li>\r\n <li>{{ \"searchEmployeeTooltip_2\" | translate }}</li>\r\n <li>{{ \"searchEmployeeTooltip_3\" | translate }}</li>\r\n <li>{{ \"searchEmployeeTooltip_4\" | translate }}</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}.dropdown-img{width:30px;height:30px;border-radius:50%;border:2px solid #fff}.dropdown-img .avatar--medium{--default-size: 30px}:host ::ng-deep .avatar{border:0 none!important}\n"], dependencies: [{ kind: "component", type: MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "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: i2.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: "ngmodule", type: FormsModule }, { kind: "directive", type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: SatPopoverModule }, { kind: "component", type: i1$2.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: FormLabelComponent, selector: "app-form-label", inputs: ["tooltip", "label", "optional"] }, { kind: "component", type: InfoItemComponent, selector: "app-info-item", inputs: ["label", "value", "name", "type", "dateType", "multiple", "insideTable", "hasLabel", "arrayList", "actionType", "download"] }, { kind: "ngmodule", type: i4.ReactiveFormsModule }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
|
|
3345
|
+
], usesInheritance: true, ngImport: i0, template: "@if (!isReadOnly) {\r\n<ng-container>\r\n @if(label) {\r\n <app-form-label\r\n [label]=\"label\"\r\n [optional]=\"required || mandatory ? false : true\"\r\n [tooltip]=\"tooltip\"\r\n ></app-form-label>\r\n }\r\n <mat-form-field\r\n class=\"primary-form {{ className }}\"\r\n [floatLabel]=\"floatLabel\"\r\n [ngClass]=\"{\r\n 'custom-validation': !control.errors\r\n }\"\r\n >\r\n <mat-label>{{ label }}</mat-label>\r\n <ds-icon icon=\"search\" class=\"fc-coral fs-18\"></ds-icon>\r\n <label class=\"mat-form-content\">\r\n <input\r\n type=\"text\"\r\n aria-label=\"Number\"\r\n (input)=\"onLoadOptions($event)\"\r\n matInput\r\n [disabled]=\"isDisabled\"\r\n [matAutocomplete]=\"auto\"\r\n [formControl]=\"employeeSearchControl\"\r\n />\r\n </label>\r\n @if (loading) {\r\n <span class=\"sfi sfi-spinner d-inline-block spin fc-coral\" matSuffix></span>\r\n }\r\n <mat-autocomplete #auto=\"matAutocomplete\">\r\n @for (option of data; track option) {\r\n <mat-option\r\n [value]=\"option?.['personName']\"\r\n (onSelectionChange)=\"selectOption(option, $event)\"\r\n >\r\n <div class=\"d-flex align-items-center gap-3\">\r\n <div class=\"dropdown-img\">\r\n <ds-avatar\r\n [image]=\"getImage(option?.email)\"\r\n onerror=\"this.onerror=null;this.src='assets/images/user.svg';\"\r\n slot=\"prefix\"\r\n class=\"avatar\"\r\n size=\"small\"\r\n >\r\n </ds-avatar>\r\n </div>\r\n <div class=\"line-height-1\">\r\n <h6 class=\"fs-14 fw-medium fc-onyx mb-0 line-height-1\">\r\n {{ option?.name }}\r\n </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\r\n }\r\n </mat-autocomplete>\r\n @if (showHint) {\r\n <mat-hint>\r\n <span\r\n class=\"sfi sfi-check-circle font-10 fc-dark-gray\"\r\n [ngClass]=\"{ 'fc-oasis-light-imp': value }\"\r\n ></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\r\n\r\n <!-- <app-validation-errors [errors]=\"customErrorMessage || employeeSearchControl.errors\" [isEmployeeSearchControl]=\"multiple? true: false\"></app-validation-errors> -->\r\n @if(control.invalid && employeeSearchControl.touched){\r\n <mat-error class=\"mb-2\">\r\n this filed is required\r\n </mat-error>\r\n }\r\n\r\n\r\n\r\n @if (userAlreadyExist) {\r\n <mat-error class=\"mb-2\">{{ \"userAlreadyExist\" | translate }}</mat-error>\r\n } @if (arrayList?.length && !isReadOnly && multiple) {\r\n <div class=\"col-12 mt-2\">\r\n <div class=\"example-list n-results\">\r\n @for (emails of arrayList; track $index) {\r\n <div class=\"example-box n-col px-3\" [ngClass]=\"{ 'mt-0': $index === 0 }\">\r\n <div class=\"d-flex flex-grow-1 w-100\">\r\n <div class=\"user-info flex-grow-1\">\r\n <ds-avatar\r\n [image]=\"getImage(emails?.['personEmail'])\"\r\n onerror=\"this.onerror=null;this.src='assets/images/user.svg';\"\r\n slot=\"prefix\"\r\n class=\"avatar prof-img\"\r\n >\r\n </ds-avatar>\r\n @if (emails?.['personName']) {\r\n <label>\r\n {{ emails?.['personName'] }}\r\n <span class=\"title\">{{ emails?.['personEmail'] }}</span>\r\n </label>\r\n }\r\n </div>\r\n @if (!isReadOnly) {\r\n <ds-button\r\n class=\"ds-btn-action\"\r\n size=\"small\"\r\n (click)=\"deleteRow($index, emails)\"\r\n icon\r\n >\r\n <ds-icon icon=\"trash\" class=\"fc-coral fs-20\"></ds-icon>\r\n </ds-button>\r\n }\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n }\r\n</ng-container>\r\n} @if (isReadOnly && control.value) {\r\n<ng-container>\r\n <app-info-item\r\n class=\"info-item\"\r\n type=\"user-picker\"\r\n [hasLabel]=\"!!label\"\r\n [multiple]=\"multiple\"\r\n [ngClass]=\"{ 'user-picker': !isReadOnly }\"\r\n [actionType]=\"!isReadOnly ? 'delete' : 'edit'\"\r\n [label]=\"label\"\r\n [name]=\"control.value['personName']\"\r\n [value]=\"control.value['personEmail']\"\r\n [arrayList]=\"arrayList\"\r\n >\r\n </app-info-item>\r\n</ng-container>\r\n}\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>{{ \"searchEmployeeTooltip_1\" | translate }}</li>\r\n <li>{{ \"searchEmployeeTooltip_2\" | translate }}</li>\r\n <li>{{ \"searchEmployeeTooltip_3\" | translate }}</li>\r\n <li>{{ \"searchEmployeeTooltip_4\" | translate }}</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}.dropdown-img{width:30px;height:30px;border-radius:50%;border:2px solid #fff}.dropdown-img .avatar--medium{--default-size: 30px}:host ::ng-deep .avatar{border:0 none!important}\n"], dependencies: [{ kind: "component", type: MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { 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: i2.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: "ngmodule", type: FormsModule }, { kind: "directive", type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: SatPopoverModule }, { kind: "component", type: i1$2.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: FormLabelComponent, selector: "app-form-label", inputs: ["tooltip", "label", "optional"] }, { kind: "component", type: InfoItemComponent, selector: "app-info-item", inputs: ["label", "value", "name", "type", "dateType", "multiple", "insideTable", "hasLabel", "arrayList", "actionType", "download"] }, { kind: "ngmodule", type: i4.ReactiveFormsModule }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
|
|
3349
3346
|
}
|
|
3350
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
3347
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SearchEmployeeComponent, decorators: [{
|
|
3351
3348
|
type: Component,
|
|
3352
3349
|
args: [{ selector: 'app-search-employee', schemas: [CUSTOM_ELEMENTS_SCHEMA], standalone: true, imports: [
|
|
3353
3350
|
MatFormField,
|
|
@@ -3513,10 +3510,10 @@ class SelectComponent extends BaseComponent {
|
|
|
3513
3510
|
value: this.lov.options[index].description,
|
|
3514
3511
|
});
|
|
3515
3512
|
}
|
|
3516
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
3517
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
3513
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SelectComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
3514
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: SelectComponent, isStandalone: true, selector: "app-select", inputs: { valueName: "valueName", parentKey: "parentKey", label: "label", tooltip: "tooltip", className: "className", showLabel: "showLabel", readonly: "readonly", optional: "optional", data: "data", error: "error", optionAr: "optionAr", optionEn: "optionEn", hasPlaceHolder: "hasPlaceHolder", parentValue: "parentValue" }, outputs: { onChange: "onChange", emitedMultiValue: "emitedMultiValue" }, viewQueries: [{ propertyName: "selectCtrl", first: true, predicate: ["selectCtrl"], descendants: true }, { propertyName: "selectAllOption", first: true, predicate: ["selectAllOption"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ng-container *ngIf=\"!isReadOnly\">\r\n <app-form-label [label]=\"label\" [optional]=\"optional\" [hideOption]=\"hideOption\" [showLabel]=\"showLabel\">\r\n </app-form-label>\r\n <mat-form-field class=\"{{className}}\" [floatLabel]=\"'auto'\">\r\n <mat-label>\r\n {{ hasPlaceHolder ? placeholder : i18n.translate('selectYourOption')}}\r\n </mat-label>\r\n <label class=\"mat-form-content\">\r\n <ng-container *ngIf=\"!multiple\">\r\n <mat-select disableOptionCentering [disabled]=\"disabled\" [formControl]=\"controller\"\r\n (selectionChange)=\"emitSelectedValue($event)\"\r\n [placeholder]=\"hasPlaceHolder ? placeholder : i18n.translate('selectYourOption')\">\r\n <ng-container *ngIf=\"parentKey !== ''\">\r\n <ng-container *ngFor=\"let element of lov?.options\">\r\n <mat-option *ngIf=\"element?.parentValue === parentKey\" [value]=\"element.value\">\r\n {{element.description}}\r\n </mat-option>\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngIf=\"parentKey ===''\">\r\n <mat-option *ngFor=\"let element of lov?.options\" [value]=\"element.value\">\r\n {{element.description}}\r\n </mat-option>\r\n </ng-container>\r\n </mat-select>\r\n </ng-container>\r\n <ng-container *ngIf=\"multiple\">\r\n <mat-select #selectCtrl [disabled]=\"disabled\" [formControl]=\"controller\" multiple\r\n (selectionChange)=\"handleOnOptionSelected($event?.value)\"\r\n [placeholder]=\"hasPlaceHolder ? placeholder : i18n.translate('selectYourOption')\">\r\n\r\n <mat-select-trigger *ngIf=\"selectAllEnabled\">\r\n {{ transformSelectedData(controller?.getRawValue())}}\r\n <span *ngIf=\"(controller.value?.length || 0) > 1\" >\r\n (+{{ (controller.value?.length || 0) - 1 }} {{ controller.value?.length === 2 ? i18n.translate('other') : i18n.translate('others') }})\r\n </span>\r\n </mat-select-trigger>\r\n\r\n <ng-container *ngIf=\"parentKey !== ''\" >\r\n <ng-container *ngFor=\"let element of lov?.options\" class=\"mx-2\">\r\n <mat-option *ngIf=\"element?.parentValue === parentKey\" [value]=\"element.value\">\r\n {{element.description}}\r\n </mat-option>\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngIf=\"parentKey ===''\" >\r\n\r\n <mat-option #selectAllOption *ngIf=\"selectAllEnabled && lov?.options?.length\" value=\"all\" class=\"mx-2\" (click)=\"toggleAllOptions(selectAllOption)\">\r\n {{i18n.translate('selectAll')}}\r\n </mat-option>\r\n\r\n <mat-option *ngFor=\"let element of lov?.options\" [value]=\"element.value\" class=\"mx-2\">\r\n {{element.description}}\r\n </mat-option>\r\n\r\n\r\n </ng-container>\r\n </mat-select>\r\n </ng-container>\r\n\r\n\r\n\r\n\r\n\r\n <mat-label *ngIf=\"loading\">\r\n <div class=\"select-placeholder-container\">\r\n <!-- <span>Loading...</span> -->\r\n <mat-spinner class=\"spinner\" diameter=\"20\"></mat-spinner>\r\n </div>\r\n </mat-label>\r\n\r\n </label>\r\n\r\n <mat-error class=\"mb-2\" *ngIf=\"(!controller?.valid)\">{{i18n.translate('validSelectError')}}{{label}}\r\n </mat-error>\r\n\r\n <mat-hint *ngIf=\"showHint && hint\" class=\"mb-2\">\r\n <span class=\"mat-error\">{{hint}}</span>\r\n </mat-hint>\r\n\r\n <!-- <mat-error *ngIf=\"!controller.valid\">{{error}}</mat-error> -->\r\n </mat-form-field>\r\n</ng-container>\r\n\r\n<ng-container *ngIf=\"isReadOnly && (showIfEmpty || field?.value)\" class=\"info-section\">\r\n <app-info-item class=\"info-item w-100\" [label]=\"label\" [hasLabel]=\"hasLabel\" [insideTable]=\"insideTable\"\r\n [value]=\"field?.value || field?.key\"></app-info-item>\r\n</ng-container>\r\n\r\n<ng-container *ngIf=\"isReadOnly && multiple\" class=\"info-section\">\r\n <app-info-item class=\"info-item w-100\" [label]=\"label\" [type]=\"'multipleSelect'\" [hasLabel]=\"hasLabel\" [insideTable]=\"insideTable\"\r\n [value]=\"field\"></app-info-item>\r\n</ng-container>\r\n", styles: [""], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: MatOption$1, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: MatLabel, selector: "mat-label" }, { kind: "component", type: MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "directive", type: MatError$1, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: InfoItemComponent, selector: "app-info-item", inputs: ["label", "value", "name", "type", "dateType", "multiple", "insideTable", "hasLabel", "arrayList", "actionType", "download"] }, { kind: "component", type: FormLabelComponent, selector: "app-form-label", inputs: ["tooltip", "label", "optional"] }, { kind: "component", type: MatFormField$1, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }] });
|
|
3518
3515
|
}
|
|
3519
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
3516
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SelectComponent, decorators: [{
|
|
3520
3517
|
type: Component,
|
|
3521
3518
|
args: [{ selector: 'app-select', schemas: [CUSTOM_ELEMENTS_SCHEMA], standalone: true, imports: [
|
|
3522
3519
|
ReactiveFormsModule,
|
|
@@ -3585,16 +3582,16 @@ class TextareaComponent extends ControlValueAccessorDirective {
|
|
|
3585
3582
|
}
|
|
3586
3583
|
});
|
|
3587
3584
|
}
|
|
3588
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
3589
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
3585
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: TextareaComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
3586
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: TextareaComponent, isStandalone: true, selector: "app-textarea", inputs: { className: "className", preventSpecailChar: "preventSpecailChar" }, providers: [
|
|
3590
3587
|
{
|
|
3591
3588
|
provide: NG_VALUE_ACCESSOR,
|
|
3592
3589
|
useExisting: forwardRef(() => TextareaComponent),
|
|
3593
3590
|
multi: true,
|
|
3594
3591
|
},
|
|
3595
|
-
], usesInheritance: true, ngImport: i0, template: "@if(!isReadOnly){\r\n <ng-container>\r\n @if(label){\r\n <app-form-label [label]=\"label\" [optional]=\"required || mandatory ? false : true\" [tooltip]=\"tooltip\"></app-form-label>\r\n }\r\n <mat-form-field class=\"custom-textarea bordered-input {{className}}\">\r\n <mat-label>{{ label }}</mat-label>\r\n <label class=\"mat-form-content\">\r\n @if (type === 'arOnly'){\r\n <textarea [placeholder]=\"placeholder\" min=\"minlength\" arOnly max=\"maxValue\"\r\n [formControl]=\"control\" matInput></textarea>\r\n }\r\n @if (type === 'enOnly'){\r\n <textarea [placeholder]=\"placeholder\" min=\"minlength\" enOnly max=\"maxValue\"\r\n [formControl]=\"control\" matInput></textarea>\r\n }\r\n @if (type !== 'enOnly' && type !== 'arOnly' ){\r\n <textarea [placeholder]=\"placeholder\"\r\n [maxlength]=\"maxLength\" min=\"minlength\" specialIsAlphaNumeric max=\"maxValue\"\r\n [formControl]=\"control\" matInput></textarea>\r\n }\r\n\r\n </label>\r\n @if (showHint){\r\n <mat-hint class=\"d-flex align-items-center gap-1 mt-1\">\r\n <span class=\"sfi sfi-info fs-17 fc-dark-gray\" [ngClass]=\"{'fc-oasis-light-imp':value}\"></span>\r\n <span class=\"fs-12 fc-black line-height-1\">{{ hint }}</span>\r\n </mat-hint>\r\n }\r\n\r\n </mat-form-field>\r\n <app-validation-errors [errors]=\"control.errors\"></app-validation-errors>\r\n\r\n </ng-container>\r\n}\r\n@if (isReadOnly && control.value && (showIfEmpty || control)){\r\n <ng-container>\r\n <app-info-item class=\"info-item w-100\" [insideTable]=\"insideTable\" [label]=\"label\" [value]=\"control?.value\" [type]=\"type\"></app-info-item>\r\n </ng-container>\r\n}\r\n", styles: [""], dependencies: [{ kind: "ngmodule", type: i6.MatFormFieldModule }, { kind: "component", type: i6.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i6.MatLabel, selector: "mat-label" }, { kind: "directive", type: i6.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i7.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: FormLabelComponent, selector: "app-form-label", inputs: ["tooltip", "label", "optional"] }, { kind: "component", type: ValidationErrorsComponent, selector: "app-validation-errors", inputs: ["errors", "customErrorMessages"] }, { kind: "component", type: InfoItemComponent, selector: "app-info-item", inputs: ["label", "value", "name", "type", "dateType", "multiple", "insideTable", "hasLabel", "arrayList", "actionType", "download"] }, { kind: "ngmodule", type: i4.ReactiveFormsModule }, { kind: "directive", type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: EnOnlyDirective, selector: "[enOnly]" }, { kind: "directive", type: ArOnlyDirective, selector: "[arOnly]" }] });
|
|
3592
|
+
], usesInheritance: true, ngImport: i0, template: "@if(!isReadOnly){\r\n <ng-container>\r\n @if(label){\r\n <app-form-label [label]=\"label\" [optional]=\"required || mandatory ? false : true\" [tooltip]=\"tooltip\"></app-form-label>\r\n }\r\n <mat-form-field class=\"custom-textarea bordered-input {{className}}\">\r\n <mat-label>{{ label }}</mat-label>\r\n <label class=\"mat-form-content\">\r\n @if (type === 'arOnly'){\r\n <textarea [placeholder]=\"placeholder\" min=\"minlength\" arOnly max=\"maxValue\"\r\n [formControl]=\"control\" matInput></textarea>\r\n }\r\n @if (type === 'enOnly'){\r\n <textarea [placeholder]=\"placeholder\" min=\"minlength\" enOnly max=\"maxValue\"\r\n [formControl]=\"control\" matInput></textarea>\r\n }\r\n @if (type !== 'enOnly' && type !== 'arOnly' ){\r\n <textarea [placeholder]=\"placeholder\"\r\n [maxlength]=\"maxLength\" min=\"minlength\" specialIsAlphaNumeric max=\"maxValue\"\r\n [formControl]=\"control\" matInput></textarea>\r\n }\r\n\r\n </label>\r\n @if (showHint){\r\n <mat-hint class=\"d-flex align-items-center gap-1 mt-1\">\r\n <span class=\"sfi sfi-info fs-17 fc-dark-gray\" [ngClass]=\"{'fc-oasis-light-imp':value}\"></span>\r\n <span class=\"fs-12 fc-black line-height-1\">{{ hint }}</span>\r\n </mat-hint>\r\n }\r\n\r\n </mat-form-field>\r\n <app-validation-errors [errors]=\"control.errors\"></app-validation-errors>\r\n\r\n </ng-container>\r\n}\r\n@if (isReadOnly && control.value && (showIfEmpty || control)){\r\n <ng-container>\r\n <app-info-item class=\"info-item w-100\" [insideTable]=\"insideTable\" [label]=\"label\" [value]=\"control?.value\" [type]=\"type\"></app-info-item>\r\n </ng-container>\r\n}\r\n", styles: [""], dependencies: [{ kind: "ngmodule", type: i6.MatFormFieldModule }, { kind: "component", type: i6.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i6.MatLabel, selector: "mat-label" }, { kind: "directive", type: i6.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i7.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "component", type: FormLabelComponent, selector: "app-form-label", inputs: ["tooltip", "label", "optional"] }, { kind: "component", type: ValidationErrorsComponent, selector: "app-validation-errors", inputs: ["errors", "customErrorMessages"] }, { kind: "component", type: InfoItemComponent, selector: "app-info-item", inputs: ["label", "value", "name", "type", "dateType", "multiple", "insideTable", "hasLabel", "arrayList", "actionType", "download"] }, { kind: "ngmodule", type: i4.ReactiveFormsModule }, { kind: "directive", type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: EnOnlyDirective, selector: "[enOnly]" }, { kind: "directive", type: ArOnlyDirective, selector: "[arOnly]" }] });
|
|
3596
3593
|
}
|
|
3597
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
3594
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: TextareaComponent, decorators: [{
|
|
3598
3595
|
type: Component,
|
|
3599
3596
|
args: [{ selector: 'app-textarea', schemas: [CUSTOM_ELEMENTS_SCHEMA], imports: [
|
|
3600
3597
|
...MatFormImports,
|
|
@@ -3631,10 +3628,10 @@ class SpecialCharacterDirective {
|
|
|
3631
3628
|
const inputElement = event.target;
|
|
3632
3629
|
inputElement.value = inputElement.value.replace(/[\'\`]/g, '');
|
|
3633
3630
|
}
|
|
3634
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
3635
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
3631
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SpecialCharacterDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
3632
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.1", type: SpecialCharacterDirective, isStandalone: true, selector: "[specialIsAlphaNumeric]", host: { listeners: { "input": "onInputChange($event)", "paste": "blockPaste($event)", "drop": "onDrop($event)" } }, ngImport: i0 });
|
|
3636
3633
|
}
|
|
3637
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
3634
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SpecialCharacterDirective, decorators: [{
|
|
3638
3635
|
type: Directive,
|
|
3639
3636
|
args: [{
|
|
3640
3637
|
selector: '[specialIsAlphaNumeric]'
|
|
@@ -3683,8 +3680,8 @@ class ToggleButtonComponent extends ControlValueAccessorDirective {
|
|
|
3683
3680
|
this.control.setValue({ key: item[this.key], value: item[this.displayedLabel] });
|
|
3684
3681
|
this.toggleButtonControl.setValue(item[this.key]);
|
|
3685
3682
|
}
|
|
3686
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
3687
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
3683
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ToggleButtonComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
3684
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: ToggleButtonComponent, isStandalone: true, selector: "app-toggle-button", inputs: { className: "className", data: "data", error: "error", optionAr: "optionAr", optionEn: "optionEn", hasHint: "hasHint", options: "options", displayedLabel: "displayedLabel", key: "key" }, outputs: { onChange: "onChange" }, providers: [
|
|
3688
3685
|
{
|
|
3689
3686
|
provide: NG_VALUE_ACCESSOR,
|
|
3690
3687
|
useExisting: forwardRef(() => ToggleButtonComponent),
|
|
@@ -3692,7 +3689,7 @@ class ToggleButtonComponent extends ControlValueAccessorDirective {
|
|
|
3692
3689
|
},
|
|
3693
3690
|
], usesInheritance: true, ngImport: i0, template: "@if(!isReadOnly){\r\n <ng-container>\r\n @if(label){\r\n <app-form-label [label]=\"label\" [optional]=\"required || mandatory ? false : true\" [tooltip]=\"tooltip\"></app-form-label>\r\n }\r\n\r\n @if(options){\r\n <mat-button-toggle-group class=\"Toggle__buttons d-flex align-items-center gap-3\" [value]=\"toggleButtonControl.value\" [formControl]=\"toggleButtonControl\"\r\n aria-label=\"Font Style\" [multiple]=\"multiple\">\r\n @for(item of options; track item){\r\n <mat-button-toggle (click)=\"setToggelButtonValue(hasHint, hintSection, item)\" [value]=\"item[key]\" [satPopoverAnchor]=\"hintSection\">\r\n <span>\r\n {{item[displayedLabel]}}\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]=\"item[displayedLabel]\"></p>\r\n </div>\r\n </sat-popover>\r\n </mat-button-toggle>\r\n }\r\n\r\n </mat-button-toggle-group>\r\n }\r\n </ng-container>\r\n}\r\n\r\n@if(isReadOnly && toggleButtonControl.value){\r\n <ng-container>\r\n <app-info-item class=\"info-item w-100\" [insideTable]=\"insideTable\" [type]=\"'toggleBtn'\" [label]=\"label\" [value]=\"control.value?.value\"></app-info-item>\r\n </ng-container>\r\n\r\n}\r\n", styles: [""], 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$2.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$2.SatPopoverAnchorDirective, selector: "[satPopoverAnchor]", inputs: ["satPopoverAnchor"], exportAs: ["satPopoverAnchor"] }, { kind: "component", type: FormLabelComponent, selector: "app-form-label", inputs: ["tooltip", "label", "optional"] }, { kind: "component", type: InfoItemComponent, selector: "app-info-item", inputs: ["label", "value", "name", "type", "dateType", "multiple", "insideTable", "hasLabel", "arrayList", "actionType", "download"] }, { kind: "ngmodule", type: i4.ReactiveFormsModule }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] });
|
|
3694
3691
|
}
|
|
3695
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
3692
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ToggleButtonComponent, decorators: [{
|
|
3696
3693
|
type: Component,
|
|
3697
3694
|
args: [{ selector: 'app-toggle-button', imports: [
|
|
3698
3695
|
MatButtonToggleGroup,
|
|
@@ -3738,10 +3735,10 @@ class RepeatedListComponent {
|
|
|
3738
3735
|
getImage(email) {
|
|
3739
3736
|
return "/group/i-gate/wm-bpm/forms/-/proxy/portrait?email=" + email;
|
|
3740
3737
|
}
|
|
3741
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
3742
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
3738
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: RepeatedListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3739
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", 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$2.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$2.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"] }] });
|
|
3743
3740
|
}
|
|
3744
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
3741
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: RepeatedListComponent, decorators: [{
|
|
3745
3742
|
type: Component,
|
|
3746
3743
|
args: [{ selector: 'app-repeated-list', schemas: [CUSTOM_ELEMENTS_SCHEMA], standalone: true, imports: [
|
|
3747
3744
|
NgForOf,
|
|
@@ -3816,10 +3813,10 @@ class TableListComponent extends BaseComponent {
|
|
|
3816
3813
|
}
|
|
3817
3814
|
sentBack() {
|
|
3818
3815
|
}
|
|
3819
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
3820
|
-
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]" }] });
|
|
3816
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: TableListComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
3817
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", 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]" }] });
|
|
3821
3818
|
}
|
|
3822
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
3819
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: TableListComponent, decorators: [{
|
|
3823
3820
|
type: Component,
|
|
3824
3821
|
args: [{ selector: 'app-table-list', schemas: [CUSTOM_ELEMENTS_SCHEMA], standalone: true, imports: [
|
|
3825
3822
|
MatPaginatorModule,
|
|
@@ -4258,8 +4255,8 @@ class DocsUploaderComponent extends ControlValueAccessorDirective {
|
|
|
4258
4255
|
data.forEach(elem => this.deleteFileContents(elem));
|
|
4259
4256
|
}
|
|
4260
4257
|
}
|
|
4261
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
4262
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
4258
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: DocsUploaderComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
4259
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: DocsUploaderComponent, isStandalone: true, selector: "app-file-uploader", inputs: { useCrop: "useCrop", formKey: "formKey", showLabel: "showLabel", downloadLink: "downloadLink", showActions: "showActions", styleHeight: "styleHeight", fileInputHeight: "fileInputHeight", styleWidth: "styleWidth", hints: "hints", allowedExtensions: "allowedExtensions", callApi: "callApi", display: "display", attachType: "attachType", error: "error", displayedFiles: "displayedFiles", getDataFromTemplate: "getDataFromTemplate", allowFileContentsWithMultiAttachments: "allowFileContentsWithMultiAttachments", accept: "accept", allAttachments: "allAttachments", signType: "signType", customDownload: "customDownload", showSignButton: "showSignButton", printType: "printType", showPrintButton: "showPrintButton", downloadType: "downloadType", showDownloadButton: "showDownloadButton", preventFileContents: "preventFileContents", maxSize: "maxSize" }, outputs: { selectedTemplateAttachment: "selectedTemplateAttachment", addSignatureClicked: "addSignatureClicked", printActionClicked: "printActionClicked", emitedValue: "emitedValue", downloadActionClicked: "downloadActionClicked" }, providers: [
|
|
4263
4260
|
{
|
|
4264
4261
|
provide: NG_VALUE_ACCESSOR,
|
|
4265
4262
|
useExisting: forwardRef(() => DocsUploaderComponent),
|
|
@@ -4267,7 +4264,7 @@ class DocsUploaderComponent extends ControlValueAccessorDirective {
|
|
|
4267
4264
|
},
|
|
4268
4265
|
], viewQueries: [{ propertyName: "inputFile", first: true, predicate: ["inputFile"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@if (!isReadOnly) {\r\n <ng-container>\r\n @if(label) {\r\n <app-form-label [label]=\"label\" [optional]=\"required || mandatory ? false : true\" [tooltip]=\"tooltip\"></app-form-label>\r\n }\r\n <section\r\n (click)=\"fileAttached.click()\"\r\n [ngClass]=\"insideTable ? 'file-uploader-table' : 'file-uploader'\" class=\" mb-2\"\r\n [class.insideTableStyle]=\"insideTable\">\r\n <div\r\n [ngClass]=\"insideTable ? 'file-uploader-table-dev' : ''\" class=\"file-uploader-input\"\r\n >\r\n @if (!uploading) {\r\n <div class=\"icon mb-1\">\r\n <svg\r\n [ngClass]=\"insideTable ? 'file-uploader-table-svg' : ''\" width=\"41\" height=\"38\" viewBox=\"0 0 41 38\"\r\n fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\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 <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 <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 </svg>\r\n </div>\r\n }\r\n @if (uploading) {\r\n <ds-icon class=\"sfi sfi-spinner d-inline-block spin fc-coral fs-30-imp\"></ds-icon>\r\n }\r\n\r\n <div class=\"f-14 fc-black fw-normal\">\r\n <span class=\"fc-coral fw-medium\">{{ 'browse' | translate }}</span>\r\n </div>\r\n <div class=\"fs-10 fc-dark-gray\">\r\n {{ allowedExtensions ? allowedExtensions : '' }}\r\n </div>\r\n\r\n <input type=\"file\" #inputFile [accept]=\"accept\" class=\"d-none\" #fileAttached (change)=\"onValueChange($event)\">\r\n </div>\r\n </section>\r\n\r\n @if (hints) {\r\n <div class=\"d-flex align-items-center gap-3 mb-3\">\r\n @for (hint of hints; track hint) {\r\n <ng-container>\r\n <div class=\"d-flex align-items-center gap-1 fs-12\">\r\n <ds-icon\r\n icon=\"{{ hint.valid ? 'check-circle-f' : 'check-circle-o' }}\"\r\n class=\"fs-24 {{ hint.valid ? 'fc-green' : 'fc-dark-gray' }}\"></ds-icon>\r\n <span class=\"{{ hint.valid ? 'fc-black' : 'fc-dark-gray' }}\">{{ hint.label }}</span>\r\n </div>\r\n </ng-container>\r\n }\r\n </div>\r\n }\r\n\r\n @if (hint) {\r\n <mat-hint class=\"d-flex align-items-center gap-1\">\r\n <ds-icon icon=\"info\" class=\"fs-17 fc-dark-gray\"></ds-icon>\r\n <span class=\"fs-12 fc-black line-height-1\">{{ hint }}</span>\r\n </mat-hint>\r\n }\r\n\r\n @if (multiple) {\r\n <section class=\"files-list\">\r\n @for (file of displayedFiles; track file; let i = $index) {\r\n <div class=\"file-item-container\">\r\n <ds-attachments\r\n [matTooltip]=\"file?.fileName\"\r\n [file]=\"{ name: file.fileName }\"\r\n (downloadEvent)=\"attachmentAction('download', i, file)\"\r\n (deleteEvent)=\"attachmentAction('delete', i, file)\"\r\n [showActions]=\"showActions\">\r\n </ds-attachments>\r\n </div>\r\n }\r\n </section>\r\n }\r\n\r\n @if (!multiple && (control?.value?.fileContents || control?.value?.attachmentId)) {\r\n <section class=\"files-list\">\r\n <div class=\"file-item-container file-item-container-actions\">\r\n <ds-attachments\r\n [matTooltip]=\"control?.value?.fileName\"\r\n [file]=\"{ name: control?.value.fileName }\"\r\n (downloadEvent)=\"attachmentAction('download', null, control?.value)\"\r\n (deleteEvent)=\"attachmentAction('delete', null, control?.value)\"\r\n [showActions]=\"showActions\">\r\n </ds-attachments>\r\n </div>\r\n </section>\r\n }\r\n\r\n <div class=\"attachments-error\">\r\n @if (!validExtension) {\r\n <section class=\"files-list mt-2\">\r\n <div class=\"file-item-container \">\r\n <ds-attachments\r\n [file]=\"wrongFile\" error [showActions]=\"false\">\r\n </ds-attachments>\r\n </div>\r\n </section>\r\n }\r\n\r\n @if (!allowedFileSize) {\r\n <mat-error class=\"fs-12 my-2\">\r\n {{ maxSize === \"0.3\" ? ('support3' | translate ): ('support2' | translate) + maxSize + ('mb' | translate) }}\r\n </mat-error>\r\n }\r\n\r\n @if (!fileNotDuplicated) {\r\n <mat-error class=\"fs-12 my-2\">{{ 'duplicated-error' | translate }}</mat-error>\r\n }\r\n\r\n @if (lengthError) {\r\n <mat-error class=\"fs-12\">{{ 'lengthError' | translate }} :{{ maxLength }}</mat-error>\r\n }\r\n\r\n @if (showErrorMessage) {\r\n <!-- <mat-error class=\"fs-12\">{{errorMessage}} </mat-error> -->\r\n }\r\n </div>\r\n </ng-container>\r\n}\r\n\r\n@if (isReadOnly) {\r\n <ng-container>\r\n @if (multiple && displayedFiles) {\r\n <ng-container>\r\n <div class=\"info-item\">\r\n @if (label) {\r\n <span class=\"name\">{{ label }}</span>\r\n }\r\n @if (displayedFiles?.length) {\r\n <span>\r\n @for (file of displayedFiles; track file; let i = $index) {\r\n <div class=\"file-item-container\">\r\n <ds-attachments\r\n [matTooltip]=\"file?.fileName\"\r\n class=\"my-2\" [file]=\"{ name: file.fileName }\" readOnly (downloadEvent)=\"downloadFile($event, file)\"\r\n [showActions]=\"showActions\">\r\n </ds-attachments>\r\n </div>\r\n }\r\n </span>\r\n }\r\n @if (!displayedFiles?.length) {\r\n <span class=\"disc\">\r\n {{ 'NoAttachments' | translate }}\r\n </span>\r\n }\r\n </div>\r\n </ng-container>\r\n }\r\n\r\n @if (!multiple && (control?.value?.['attachmentId'] || control?.value?.['fileContents'])) {\r\n <ng-container>\r\n <div class=\"info-item\">\r\n @if (label) {\r\n <span class=\"name\">{{ label }}</span>\r\n }\r\n <div class=\"disc file-item-container file-item-container-actions\" [ngClass]=\"{'insideTableWidth': insideTable}\">\r\n @if (control?.value?.['attachmentId'] || control?.value?.['fileContents']) {\r\n <ds-attachments\r\n [matTooltip]=\"control?.value?.fileName\" [file]=\"{ name: control?.value.fileName }\" [showActions]=\"showActions\"\r\n (downloadEvent)=\"attachmentAction('download', null, control?.value)\"\r\n (deleteEvent)=\"attachmentAction('delete', null, control?.value)\"\r\n readOnly>\r\n </ds-attachments>\r\n }\r\n </div>\r\n </div>\r\n </ng-container>\r\n }\r\n </ng-container>\r\n}", styles: [".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;display:flex;align-items:center;justify-content:center}.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: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: FormLabelComponent, selector: "app-form-label", inputs: ["tooltip", "label", "optional"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
|
|
4269
4266
|
}
|
|
4270
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
4267
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: DocsUploaderComponent, decorators: [{
|
|
4271
4268
|
type: Component,
|
|
4272
4269
|
args: [{ selector: 'app-file-uploader', schemas: [CUSTOM_ELEMENTS_SCHEMA], standalone: true, imports: [
|
|
4273
4270
|
NgClass,
|
|
@@ -4456,8 +4453,8 @@ class AttachmentSectionDataComponent extends ControlValueAccessorDirective {
|
|
|
4456
4453
|
}
|
|
4457
4454
|
});*/
|
|
4458
4455
|
}
|
|
4459
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
4460
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
4456
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AttachmentSectionDataComponent, deps: [{ token: i0.Injector }, { token: CoreI18nService }, { token: i2$1.ToastrService }, { token: CoreService }, { token: i3.DomSanitizer }, { token: i4.FormBuilder }, { token: ActionStateService }, { token: i1$1.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component });
|
|
4457
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: AttachmentSectionDataComponent, isStandalone: true, selector: "app-add-attachment-section", inputs: { hasColumnBreak: "hasColumnBreak", section: "section" }, providers: [
|
|
4461
4458
|
{
|
|
4462
4459
|
provide: NG_VALUE_ACCESSOR,
|
|
4463
4460
|
useExisting: forwardRef(() => AttachmentSectionDataComponent),
|
|
@@ -4465,7 +4462,7 @@ class AttachmentSectionDataComponent extends ControlValueAccessorDirective {
|
|
|
4465
4462
|
},
|
|
4466
4463
|
], usesInheritance: true, ngImport: i0, template: "<div class=\"popup-container\">\r\n <div class=\"d-flex align-items-center justify-content-end\" mat-dialog-title>\r\n <h3 class=\"mb-0 font-16 fw-medium\">{{ 'addAttachments' | translate }}</h3>\r\n <ds-button icon matDialogClose>\r\n <ds-icon icon=\"close\" class=\"fs-20 fc-black\"></ds-icon>\r\n </ds-button>\r\n </div>\r\n <mat-dialog-content>\r\n <div class=\"px-md-4 mt-3\">\r\n <form [formGroup]=\"formGroup\">\r\n <app-file-uploader\r\n class=\"section-item full\" [field]=\"popupData\" name=\"file\" [attachments]=\"dialogData?.attachments\"\r\n [labelTextReadMode]=\"'Attachment' | translate\" [labelTextWriteMode]=\"'Attachment' | translate\"\r\n [hasColumnBreak]=\"false\" [label]=\"'Attachment' | translate\" [required]=\"true\" [multiple]=\"false\"\r\n [allowedExtensions]=\"dialogData?.data\"\r\n [allAttachments]=\"dialogData?.attachments\"\r\n [isReadOnly]=\"section?.header?.readOnly\" [showActions]=\"false\"\r\n formControlName=\"file\">\r\n </app-file-uploader>\r\n\r\n <app-textarea\r\n class=\"section-item d-block mt-4 mb-4\" [section]=\"section\" [field]=\"popupData?.fileDescription\" name=\"fileDescription\"\r\n [labelTextReadMode]=\"'description' | translate\" [labelTextWriteMode]=\"'description' | translate\"\r\n [hasColumnBreak]=\"false\" (emitedValue)=\"handleEmitValue($event,'fileDescription')\"\r\n [label]=\"'description' | translate\" [required]=\"dialogData?.isRequired\" [minLength]=\"1\" [maxLength]=\"500\"\r\n [isReadOnly]=\"section?.header?.readOnly\" [errorMessage]=\"'lenghtMin1Max500' | translate\"\r\n formControlName=\"description\">\r\n </app-textarea>\r\n\r\n <app-textarea\r\n class=\"section-item\" [section]=\"section\" [field]=\"popupData?.attachmentcomment\" name=\"attachmentcomment\"\r\n [labelTextReadMode]=\"'comments' | translate\" [labelTextWriteMode]=\"'comments' | translate\"\r\n [hasColumnBreak]=\"false\" (emitedValue)=\"handleEmitValue($event,'attachmentcomment')\"\r\n [label]=\"'comments' | translate\" [required]=\"false\" [minLength]=\"1\" [maxLength]=\"500\"\r\n [isReadOnly]=\"section?.header?.readOnly\" [errorMessage]=\"'lenghtMin1Max500' | translate\"\r\n formControlName=\"comments\">\r\n </app-textarea>\r\n </form>\r\n </div>\r\n </mat-dialog-content>\r\n <mat-dialog-actions class=\"default-footer justify-content-end gap-3\">\r\n <ds-button shape=\"outline\" matDialogClose [disabled]=\"uploading\" [class.disabled]=\"uploading\">{{ 'cancel' | translate }}</ds-button>\r\n <ds-button\r\n (click)=\"addAttachments()\" [loading]=\"uploading\"\r\n [disabled]=\"(!formGroup?.value?.file?.attachmentId || (dialogData?.isRequired && !formGroup?.value?.description) || uploading || !formGroup.valid)\">\r\n <ng-container *ngIf=\"!editMode; else editTemplate\">\r\n <span>{{ 'add' | translate }}</span>\r\n </ng-container>\r\n <ng-template #editTemplate>\r\n <span>{{ 'edit' | translate }}</span>\r\n </ng-template>\r\n </ds-button>\r\n </mat-dialog-actions>\r\n</div>\r\n", styles: ["::ng-deep .add-attachment-dialog{--popup-max-width: 500px !important;--popup-width: 100% !important}::ng-deep .default-footer ds-button::part(base){--btn-min-width: 90px}\n"], dependencies: [{ kind: "component", type: TextareaComponent, selector: "app-textarea", inputs: ["className", "preventSpecailChar"] }, { kind: "directive", type: MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "component", type: DocsUploaderComponent, selector: "app-file-uploader", inputs: ["useCrop", "formKey", "showLabel", "downloadLink", "showActions", "styleHeight", "fileInputHeight", "styleWidth", "hints", "allowedExtensions", "callApi", "display", "attachType", "error", "displayedFiles", "getDataFromTemplate", "allowFileContentsWithMultiAttachments", "accept", "allAttachments", "signType", "customDownload", "showSignButton", "printType", "showPrintButton", "downloadType", "showDownloadButton", "preventFileContents", "maxSize"], outputs: ["selectedTemplateAttachment", "addSignatureClicked", "printActionClicked", "emitedValue", "downloadActionClicked"] }, { kind: "directive", type: MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatDialogModule }, { kind: "directive", type: i1$1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i1$1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
|
|
4467
4464
|
}
|
|
4468
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
4465
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AttachmentSectionDataComponent, decorators: [{
|
|
4469
4466
|
type: Component,
|
|
4470
4467
|
args: [{ selector: 'app-add-attachment-section', standalone: true, schemas: [CUSTOM_ELEMENTS_SCHEMA], imports: [
|
|
4471
4468
|
TextareaComponent,
|
|
@@ -4643,8 +4640,8 @@ class AttachmentSectionComponent extends ControlValueAccessorDirective {
|
|
|
4643
4640
|
customDownloadAction(event) {
|
|
4644
4641
|
this.downloadActionClicked.emit(event);
|
|
4645
4642
|
}
|
|
4646
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
4647
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
4643
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AttachmentSectionComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
4644
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: AttachmentSectionComponent, isStandalone: true, selector: "app-attachment-section", inputs: { className: "className", customDownload: "customDownload", attachmentsMax: "attachmentsMax", isSortable: "isSortable", downloadAll: "downloadAll", isRequired: "isRequired", descriptionRequired: "descriptionRequired", commentsRequired: "commentsRequired", allowedExtensions: "allowedExtensions" }, outputs: { downloadActionClicked: "downloadActionClicked", emitedValue: "emitedValue" }, providers: [
|
|
4648
4645
|
{
|
|
4649
4646
|
provide: NG_VALUE_ACCESSOR,
|
|
4650
4647
|
useExisting: forwardRef(() => AttachmentSectionComponent),
|
|
@@ -4652,7 +4649,7 @@ class AttachmentSectionComponent extends ControlValueAccessorDirective {
|
|
|
4652
4649
|
},
|
|
4653
4650
|
], viewQueries: [{ propertyName: "paginator", first: true, predicate: ["paginator"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"mt-2 p-0\">\r\n @if(label){\r\n <app-form-label [label]=\"label\" [optional]=\"(required || mandatory ? false : true) && !isReadOnly\" [tooltip]=\"tooltip\"></app-form-label>\r\n }\r\n\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)=\"addAttachment()\">\r\n <div\r\n [ngClass]=\"insideTable ? 'file-uploader-table-dev' : ''\"\r\n class=\"file-uploader-input\">\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 <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 <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 <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 </svg>\r\n </div>\r\n <div class=\"f-14 fc-black fw-normal\">\r\n <span class=\"fc-coral fw-medium\">{{ 'browse' | translate }}</span>\r\n </div>\r\n <div class=\"fs-10 fc-dark-gray\">\r\n {{ 'addMultiAttachments' | translate }}\r\n </div>\r\n </div>\r\n </section>\r\n }\r\n\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 mat-table [dataSource]=\"dataSource\">\r\n\r\n <!-- index Column -->\r\n <ng-container matColumnDef=\"index\">\r\n <th mat-header-cell *matHeaderCellDef>\r\n <ds-button\r\n [matTooltip]=\"'downloadAll' | translate\"\r\n square icon size=\"small\"\r\n (click)=\"downloadAllAttachments($event)\"\r\n class=\"icon-btn-shadow\">\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\r\n icon=\"download\"\r\n class=\"fs-20 fs-md-17 fc-purple\"></ds-icon>\r\n }\r\n </ds-button>\r\n </th>\r\n <td mat-cell *matCellDef=\"let element; let i = index\">{{ i + 1 + pageSize * (pageNumber) }}</td>\r\n </ng-container>\r\n\r\n <!-- Name Column -->\r\n <ng-container matColumnDef=\"file\">\r\n <th mat-header-cell *matHeaderCellDef>{{ 'FileName' | translate }}</th>\r\n <td mat-cell *matCellDef=\"let element\">\r\n <app-file-uploader\r\n [allowedExtensions]=\"allowedExtensions\"\r\n [displayedFiles]=\"[element]\"\r\n name=\"attachment\"\r\n [showActions]=\"true\"\r\n [isReadOnly]=\"true\"\r\n [customDownload]=\"customDownload\"\r\n (downloadActionClicked)=\"customDownloadAction($event)\"\r\n [multiple]=\"true\">\r\n </app-file-uploader>\r\n </td>\r\n </ng-container>\r\n\r\n <!-- Description Column -->\r\n <ng-container matColumnDef=\"description\">\r\n <th mat-header-cell *matHeaderCellDef>{{ 'FileDescription' | translate }}</th>\r\n <td mat-cell *matCellDef=\"let element\">\r\n <a\r\n class=\"fw-medium fc-black underline cursor-pointer fs-12\"\r\n [hidden]=\"!element?.['fileDescription']\"\r\n (click)=\"$event.stopPropagation(); fileDescriptionAnchor.popover.open()\"\r\n [satPopoverAnchor]=\"fileDescriptionPopover\"\r\n #fileDescriptionAnchor=\"satPopoverAnchor\"\r\n [matTooltip]=\"element?.['fileDescription']\">\r\n {{ element?.['fileDescription']?.length > 10 ? (element?.['fileDescription'] | slice : 0 : 10) + '....' : element?.['fileDescription'] }}\r\n </a>\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 <div class=\"default-popover p-3 fs-14 text-break view-note-popover\">\r\n <bdi class=\"fc-black\">{{ element?.['fileDescription'] }}</bdi>\r\n </div>\r\n </sat-popover>\r\n </td>\r\n </ng-container>\r\n\r\n <!-- Comment Column -->\r\n <ng-container matColumnDef=\"comment\">\r\n <th mat-header-cell *matHeaderCellDef>{{ 'comment' | translate }}</th>\r\n <td mat-cell *matCellDef=\"let element\">\r\n <a\r\n class=\"fw-medium fc-black underline cursor-pointer fs-12\"\r\n [hidden]=\"!element?.['attachmentcomment']\"\r\n (click)=\"$event.stopPropagation(); commentsAnchor.popover.open()\"\r\n [satPopoverAnchor]=\"commentsPopover\"\r\n [matTooltip]=\"element?.['attachmentcomment']\"\r\n #commentsAnchor=\"satPopoverAnchor\">\r\n {{ element?.['attachmentcomment']?.length > 10 ? (element?.['attachmentcomment'] | slice : 0 : 10) + '....' : element?.['attachmentcomment'] }}\r\n </a>\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 <div class=\"default-popover p-3 fs-14 text-break view-note-popover\">\r\n <bdi class=\"fc-black\">{{ element?.['attachmentcomment'] }}</bdi>\r\n </div>\r\n </sat-popover>\r\n </td>\r\n </ng-container>\r\n\r\n <ng-container matColumnDef=\"actions\">\r\n <th mat-header-cell *matHeaderCellDef></th>\r\n <td mat-cell *matCellDef=\"let element; let i = index\">\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, element)\"\r\n class=\"icon-btn-shadow\">\r\n <ds-icon icon=\"trash\" class=\"fs-20 fs-md-17 fc-coral\"></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(element, i)\"\r\n class=\"icon-btn-shadow\">\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 </td>\r\n </ng-container>\r\n\r\n <tr mat-header-row *matHeaderRowDef=\"displayedColumns\"></tr>\r\n <tr mat-row *matRowDef=\"let row; columns: displayedColumns;\"></tr>\r\n </table>\r\n\r\n <mat-paginator\r\n #paginator\r\n [pageSizeOptions]=\"[5]\"\r\n (page)=\"onPaginateChange($event)\"\r\n [length]=\"attachments.length\"\r\n [pageSize]=\"pageSize\"\r\n showFirstLastButtons></mat-paginator>\r\n </div>\r\n }\r\n\r\n @if (!isReadOnly && attachments?.length && attachments?.length < attachmentsMax) {\r\n <div class=\"text-center full mt-3\">\r\n <ds-button\r\n shape=\"{{ attachments?.length ? 'outline' : '' }}\"\r\n [ngClass]=\"{ 'full-add-btn w-100 pt-1': attachments?.length }\"\r\n (click)=\"addAttachment(); $event.stopPropagation()\">\r\n <ds-icon slot=\"prefix\" icon=\"plus\" class=\"fs-22 pb-1\"></ds-icon>\r\n {{ 'addAttachments' | translate }}\r\n </ds-button>\r\n </div>\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: rgb(248 248 248);--btn-height: 70px;--btn-radius: 6px;border:1px dashed rgb(142,154,160)}.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;display:flex;align-items:center;justify-content:center}.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%}.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}.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}.file-uploader{--uploader-height: 120px;--uploader-width: 100%;--uploader-bg: #f8f8f8;--uploader-border: 1px dashed #8e9aa0;--uploader-radius: 6px;--uploader-padding: 20px 14px 20px 31px;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}.file-uploader--input{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;gap:10px}.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 .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-uploader-icon{color:var(--icon-color);font-size:var(--icon-size)}.file-uploader-icon svg{display:block;object-fit:contain;object-position:center;width:41px;height:auto}::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}.table-responsive table,.table-responsive .primary-table{--cell-pading: 3px 24px 10px}\n"], dependencies: [{ kind: "ngmodule", type: SatPopoverModule }, { kind: "component", type: i1$2.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$2.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", "allowedExtensions", "callApi", "display", "attachType", "error", "displayedFiles", "getDataFromTemplate", "allowFileContentsWithMultiAttachments", "accept", "allAttachments", "signType", "customDownload", "showSignButton", "printType", "showPrintButton", "downloadType", "showDownloadButton", "preventFileContents", "maxSize"], outputs: ["selectedTemplateAttachment", "addSignatureClicked", "printActionClicked", "emitedValue", "downloadActionClicked"] }, { kind: "pipe", type: SlicePipe, name: "slice" }, { kind: "component", type: MatPaginator, selector: "mat-paginator", inputs: ["color", "pageIndex", "length", "pageSize", "pageSizeOptions", "hidePageSize", "showFirstLastButtons", "selectConfig", "disabled"], outputs: ["page"], exportAs: ["matPaginator"] }, { kind: "component", type: MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "directive", type: MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "component", type: MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "component", type: MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "directive", type: MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "component", type: FormLabelComponent, selector: "app-form-label", inputs: ["tooltip", "label", "optional"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
|
|
4654
4651
|
}
|
|
4655
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
4652
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: AttachmentSectionComponent, decorators: [{
|
|
4656
4653
|
type: Component,
|
|
4657
4654
|
args: [{ selector: 'app-attachment-section', schemas: [CUSTOM_ELEMENTS_SCHEMA], providers: [
|
|
4658
4655
|
{
|
|
@@ -4722,8 +4719,8 @@ class RadioComponent extends ControlValueAccessorDirective {
|
|
|
4722
4719
|
}
|
|
4723
4720
|
});
|
|
4724
4721
|
}
|
|
4725
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
4726
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
4722
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: RadioComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
4723
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: RadioComponent, isStandalone: true, selector: "app-radio", inputs: { options: "options" }, providers: [
|
|
4727
4724
|
{
|
|
4728
4725
|
provide: NG_VALUE_ACCESSOR,
|
|
4729
4726
|
useExisting: forwardRef(() => RadioComponent),
|
|
@@ -4731,7 +4728,7 @@ class RadioComponent extends ControlValueAccessorDirective {
|
|
|
4731
4728
|
},
|
|
4732
4729
|
], usesInheritance: true, ngImport: i0, template: "@if(!isReadOnly){\r\n @if(label){\r\n <app-form-label [label]=\"label\" [optional]=\"required || mandatory ? false : true\" [tooltip]=\"tooltip\"></app-form-label>\r\n }\r\n <mat-radio-group\r\n aria-label=\"Select an option\"\r\n [formControl]=\"control\"\r\n id=\"{{ name }}{{ randomID }}\"\r\n name=\"{{ name }}{{ randomID }}\"\r\n >\r\n @for(option of options; track $index){\r\n <mat-radio-button\r\n [disabled]=\"isReadOnly || isDisabled\"\r\n [value]=\"option\"\r\n [checked]=\"option === control.value\"\r\n >\r\n <span class=\"fs-12 fw-medium fc-onyx\">\r\n {{ option }}\r\n </span>\r\n </mat-radio-button>\r\n }\r\n </mat-radio-group>\r\n\r\n}@else if(isReadOnly && control.value) {\r\n <ng-container>\r\n <app-info-item\r\n class=\"info-item w-100\"\r\n [insideTable]=\"insideTable\"\r\n [label]=\"label\"\r\n [type]=\"'toggleBtn'\"\r\n [value]=\"control.value\"\r\n [hasLabel]=\"!!label\"\r\n >\r\n </app-info-item>\r\n </ng-container>\r\n}\r\n", styles: [".mat-mdc-radio-group{grid-gap:2rem}\n"], dependencies: [{ kind: "component", type: MatRadioButton, selector: "mat-radio-button", inputs: ["id", "name", "aria-label", "aria-labelledby", "aria-describedby", "disableRipple", "tabIndex", "checked", "value", "labelPosition", "disabled", "required", "color", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioButton"] }, { kind: "directive", type: MatRadioGroup, selector: "mat-radio-group", inputs: ["color", "name", "labelPosition", "value", "selected", "disabled", "required", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioGroup"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "component", type: FormLabelComponent, selector: "app-form-label", inputs: ["tooltip", "label", "optional"] }, { kind: "component", type: InfoItemComponent, selector: "app-info-item", inputs: ["label", "value", "name", "type", "dateType", "multiple", "insideTable", "hasLabel", "arrayList", "actionType", "download"] }, { kind: "ngmodule", type: i4.ReactiveFormsModule }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] });
|
|
4733
4730
|
}
|
|
4734
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
4731
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: RadioComponent, decorators: [{
|
|
4735
4732
|
type: Component,
|
|
4736
4733
|
args: [{ selector: 'app-radio', schemas: [CUSTOM_ELEMENTS_SCHEMA], standalone: true, imports: [
|
|
4737
4734
|
MatRadioButton,
|
|
@@ -4819,10 +4816,10 @@ class SkipLocationDirective {
|
|
|
4819
4816
|
onClick() {
|
|
4820
4817
|
this.router.navigate([this.appSkipLocation], { skipLocationChange: true });
|
|
4821
4818
|
}
|
|
4822
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
4823
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
4819
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkipLocationDirective, deps: [{ token: i2$3.Router }], target: i0.ɵɵFactoryTarget.Directive });
|
|
4820
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.1", type: SkipLocationDirective, isStandalone: true, selector: "[appSkipLocation]", inputs: { appSkipLocation: "appSkipLocation" }, host: { listeners: { "click": "onClick()" } }, ngImport: i0 });
|
|
4824
4821
|
}
|
|
4825
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
4822
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkipLocationDirective, decorators: [{
|
|
4826
4823
|
type: Directive,
|
|
4827
4824
|
args: [{
|
|
4828
4825
|
standalone: true,
|
|
@@ -4984,10 +4981,10 @@ class TableComponent {
|
|
|
4984
4981
|
this.pageScroll.emit(true);
|
|
4985
4982
|
}
|
|
4986
4983
|
}
|
|
4987
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
4988
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.8", type: TableComponent, isStandalone: true, selector: "app-table", inputs: { columns: "columns", isError: "isError", isLoading: "isLoading", customMessage: "customMessage", columnsConfig: "columnsConfig", loadData: "loadData", actions: "actions", className: "className", totalElements: "totalElements", showPagination: "showPagination", pageIndex: "pageIndex", pageSize: "pageSize", sortDisabled: "sortDisabled", useScroll: "useScroll", hasPaginator: "hasPaginator", currentPage: "currentPage", keyWord: "keyWord", rows: "rows" }, outputs: { serviceRowSelect: "serviceRowSelect", selectPage: "selectPage", rowClicked: "rowClicked", autoCompleteValueSelected: "autoCompleteValueSelected", selectValueSelected: "selectValueSelected", sortChanged: "sortChanged", inputCellChanged: "inputCellChanged", pageScroll: "pageScroll", toggleChanged: "toggleChanged", eventClicked: "eventClicked", pageChange: "pageChange" }, viewQueries: [{ propertyName: "matTableRef", first: true, predicate: ["table"], descendants: true, read: ElementRef }, { propertyName: "tableSort", first: true, predicate: ["tableSort"], descendants: true }], ngImport: i0, template: "<div #table class=\"table-container table-responsive sticky-table\">\r\n @if (!isLoading) {\r\n <ng-container>\r\n @if (dataSource.filteredData?.length! > 0) {\r\n <table #tableSort=\"matSort\" (matSortChange)=\"sortChange($event)\" [dataSource]=\"dataSource\" class=\"primary-table {{ className }}\" mat-table matSort>\r\n @for (column of columns; track $index; let i = $index) {\r\n <ng-container>\r\n <!-- Add a check to ensure 'columnsConfig' and 'columnsConfig[i]' are defined before using them -->\r\n\r\n @if (columnsConfig && columnsConfig[i]) {\r\n <ng-container>\r\n <ng-container [matColumnDef]=\"column\" [stickyEnd]=\"!!columnsConfig[i].stickyEnd!\">\r\n @if (!columnsConfig[i].notSortable) {\r\n <ng-container>\r\n <th *matHeaderCellDef [ngClass]=\"{ 'text-end': columnsConfig[i].type === 'actions' }\" mat-header-cell mat-sort-header>\r\n @if (columnsConfig[i].type !== 'checkbox' || ( this.columnsConfig[i]?.type! == 'actions' && this.columnsConfig[i]?.actions?.length === 0)) {\r\n <ng-container>\r\n @if (!(this.columnsConfig[i].type == 'actions' && this.columnsConfig[i].actions.length === 0)) {\r\n <div class=\"d-flex align-items-center\">\r\n <div class=\"mx-1 fc-{{ columnsConfig[i].fontColor }}\">\r\n {{ columnsConfig[i].label | translate }}\r\n </div>\r\n @if (columnsConfig[i].slaMax) {\r\n <ds-sla\r\n [canvasScale]=\"'40'\"\r\n [innerLineWidth]=\"'3'\"\r\n [maxValue]=\"columnsConfig[i].slaMax\"\r\n [outerLineColor]=\"'limegreen'\"\r\n [outerLineWidth]=\"'3'\"\r\n [value]=\"columnsConfig[i].slaValue\"\r\n class=\"table-header-sla my-1\"\r\n ></ds-sla>\r\n }\r\n </div>\r\n }\r\n </ng-container>\r\n } @if (columnsConfig[i].type == 'checkbox') {\r\n <mat-checkbox class=\"checkbox\"></mat-checkbox>\r\n }\r\n </th>\r\n </ng-container>\r\n } @if (columnsConfig[i].notSortable) {\r\n <ng-container>\r\n <th *matHeaderCellDef [ngClass]=\"{ 'text-end': columnsConfig[i].type === 'actions' }\" mat-header-cell>\r\n <div class=\"d-flex align-items-center\">\r\n <div class=\"mx-1\">\r\n {{ columnsConfig[i].label | translate }}\r\n </div>\r\n @if (columnsConfig[i].slaMax) {\r\n <ds-sla\r\n [canvasScale]=\"'50'\"\r\n [innerLineWidth]=\"'3'\"\r\n [maxValue]=\"columnsConfig[i].slaMax\"\r\n [outerLineColor]=\"'limegreen'\"\r\n [outerLineWidth]=\"'3'\"\r\n [value]=\"columnsConfig[i].slaValue\"\r\n class=\"table-header-sla my-1\"\r\n ></ds-sla>\r\n }\r\n </div>\r\n </th>\r\n </ng-container>\r\n }\r\n\r\n <td *matCellDef=\"let element; let j = index\" mat-cell>\r\n <ng-container [ngSwitch]=\"columnsConfig[i].type\">\r\n <!-- <a target=\"_blank\"-->\r\n <!-- routerLink=\"/inbox\" [queryParams]=\"{ id: element[column] }\"-->\r\n <!-- class=\"fc-black text-decoration-underline fw-medium\" [ngClass]=\"columnsConfig[i].type\" *ngSwitchCase=\"'link'\">-->\r\n <!-- {{ element[column] }}-->\r\n <!-- </a>-->\r\n <span *ngSwitchCase=\"'formId'\" (click)=\"viewForm(element[column])\" [ngClass]=\"columnsConfig[i].type\" class=\"fc-coral cursor-pointer text-decoration-underline fw-medium\">\r\n {{ element[column] }}\r\n </span>\r\n <!-- <span\r\n *ngSwitchCase=\"'link'\"\r\n [ngClass]=\"columnsConfig[i].type\"\r\n class=\"fc-black text-decoration-underline fw-medium\"\r\n >\r\n {{ element[column] }}\r\n </span>-->\r\n\r\n <span *ngSwitchCase=\"'linkWithIcon'\" [appSkipLocation]=\"columnsConfig[i].link\" [ngClass]=\"columnsConfig[i].type\" class=\"fc-black text-decoration-underline fw-medium\">\r\n <ds-icon class=\"fs-20 fc-black\" icon=\" {{ columnsConfig[i].icon }}\"></ds-icon>\r\n <span class=\"fs-13 fc-coral px-1 text-decoration-underline\">{{ element[column] }}</span>\r\n </span>\r\n <span *ngSwitchCase=\"'underLineWithIcon'\" [ngClass]=\"columnsConfig[i].type\" class=\"fc-black text-decoration-underline fw-medium\">\r\n <ds-icon class=\"fs-20 fc-black\" icon=\" {{ columnsConfig[i].icon }}\"></ds-icon>\r\n <span class=\"fs-13 fc-coral px-1 text-decoration-underline\">{{ element[column] }}</span>\r\n </span>\r\n <mat-checkbox *ngSwitchCase=\"'checkbox'\" checked=\"{{ columnsConfig[i].checked }}\" class=\"checkbox\" disabled=\"{{ columnsConfig[i].disabled }}\"> </mat-checkbox>\r\n <span *ngSwitchCase=\"'ServiceDetails'\" [ngClass]=\"columnsConfig[i].type\" class=\"cursor-pointer\">\r\n {{ element[column] }}\r\n </span>\r\n <span *ngSwitchCase=\"'dateOnly'\" [ngClass]=\"columnsConfig[i].type\" class=\"d-inline-flex align-items-center gap-2 text-nowrap\">\r\n <span class=\"sfi sfi-calendar-o fc-coral fs-18\"></span>\r\n {{ element[column] | date : \"MMM d, y\" }}\r\n </span>\r\n <span *ngSwitchCase=\"'Search'\" [ngClass]=\"columnsConfig[i].type\" class=\"d-inline-flex align-items-center\">\r\n <app-input [formControl]=\"ctrl\" [placeholder]=\"'Search for item '\" [showLabel]=\"false\" class=\"\" className=\"no-padding \" prefix=\"sfi-search fs-16\" type=\"text\"> </app-input>\r\n </span>\r\n <span *ngSwitchCase=\"'Number'\" [ngClass]=\"columnsConfig[i].type\" class=\"d-inline-flex align-items-center\">\r\n <app-input [formControl]=\"ctrl\" [placeholder]=\"'number'\" [showLabel]=\"false\" class=\"\" className=\"no-padding\" type=\"text\"> </app-input>\r\n </span>\r\n <span *ngSwitchCase=\"'dateFromTo'\" [ngClass]=\"columnsConfig[i].type\" class=\"d-inline-flex align-items-center\">\r\n <span class=\"sfi sfi-clock fc-coral\"></span>\r\n <span class=\"mx-2\">\r\n {{ element?.date.from }} @if (element?.date.to) {\r\n <ng-container> : {{ element?.date.to }} </ng-container>\r\n }\r\n </span>\r\n </span>\r\n\r\n <span *ngSwitchCase=\"'dateTime'\" [ngClass]=\"columnsConfig[i].type\" class=\"d-inline-flex align-items-center gap-1 flex-wrap\">\r\n <span class=\"sfi sfi-calendar-o fc-dark-gray fs-20\"></span>\r\n {{ element[column] | date : \"MMM d, y, h:mm a\" }}\r\n </span>\r\n\r\n <span *ngSwitchCase=\"'singleTimeOnly'\" [ngClass]=\"columnsConfig[i].type\" class=\"d-inline-flex align-items-center gap-1 flex-wrap\">\r\n {{ element[column] | date : \"h:mm a\" }}\r\n </span>\r\n <!--dir=\"ltr\" and text-left for English text on ar page -->\r\n <span *ngSwitchCase=\"'timeOnly'\" [ngClass]=\"columnsConfig[i].type\" class=\"d-inline-flex align-items-center gap-1 flex-wrap text-nowrap text-left\" dir=\"ltr\">\r\n <!-- -->\r\n {{ mapText(columnsConfig[i].firstVal, element[column]) | date : \"h:mm a\" }} @if (mapText(columnsConfig[i].secondVal, element[column])) {\r\n <ng-container>\r\n - {{ mapText(columnsConfig[i].secondVal, element[column]) | date : \"h:mm a\" }}\r\n </ng-container>\r\n }\r\n </span>\r\n\r\n <span *ngSwitchCase=\"'multipleRows'\" [ngClass]=\"columnsConfig[i].type\" class=\"d-inline-flex align-items-center gap-1 flex-wrap\">\r\n <!-- -->\r\n @if (!element[column].monthlyFineEscalation) {\r\n <div>\r\n {{ element[column].fixedFineValue }} {{ \"global.SAR\" | translate }}\r\n </div>\r\n } @if (element[column].monthlyFineEscalation) {\r\n <div>\r\n <br />\r\n {{ element[column].firstTimeFine }} {{ \"global.SAR\" | translate }} <br />\r\n <br />\r\n {{ element[column].secondTimeFine }} {{ \"global.SAR\" | translate }} <br />\r\n <br />\r\n {{ element[column].thirdTimeFine }} {{ \"global.SAR\" | translate }} <br />\r\n <br />\r\n </div>\r\n }\r\n </span>\r\n\r\n <div *ngSwitchCase=\"'sla'\" [ngClass]=\"columnsConfig[i].type\" class=\"d-inline-flex align-items-center\">\r\n <!-- <app-sla [value]=\"element?.SLA.value\" [maxValue]=\"element?.SLA.max\" [canvasScale]=\"38\" -->\r\n <!-- class=\"font-9 fw-medium\" [outerLineColor]=\"getSlaColor(element?.SLA.value, element?.SLA.max)\">-->\r\n <!-- </app-sla>-->\r\n\r\n <ds-sla\r\n [attr.outerLineColor]=\"\r\n getSlaColor(element?.SLA.value, element?.SLA.max)\r\n \"\r\n [canvasScale]=\"'55'\"\r\n [innerLineWidth]=\"'3'\"\r\n [maxValue]=\"element?.SLA?.max\"\r\n [outerLineWidth]=\"'3'\"\r\n [value]=\"element?.SLA?.value\"\r\n ></ds-sla>\r\n </div>\r\n <div *ngSwitchCase=\"'slaProgress'\">\r\n <!-- <mat-sp-->\r\n\r\n @if (element[column]?.percentage >= 0) {\r\n <ds-sla\r\n [canvasScale]=\"'55'\"\r\n [customValue]=\"element[column]?.percentage + '%'\"\r\n [innerLineWidth]=\"'3'\"\r\n [maxValue]=\"'100'\"\r\n [outerLineColor]=\"\r\n getSlaColor(element[column]?.percentage, 100)\r\n \"\r\n [outerLineWidth]=\"'3'\"\r\n [value]=\"element[column]?.percentage\"\r\n ></ds-sla>\r\n } @else {\r\n <ng-template>Not started</ng-template>\r\n }\r\n </div>\r\n <div *ngSwitchCase=\"'Priority'\" [ngClass]=\"columnsConfig[i].type\" class=\"{{ element[column] }}\">\r\n {{ element[column] }}\r\n </div>\r\n\r\n <div *ngSwitchCase=\"'serviceStatus'\" [ngClass]=\"columnsConfig[i].type\" class=\"{{ element[column] }}\">\r\n <span [ngClass]=\"element[column] == 'FALSE' ? 'green' : 'red'\" class=\"dot-status\"></span>\r\n </div>\r\n\r\n <div *ngSwitchCase=\"'image'\" [ngClass]=\"columnsConfig[i].type\" class=\"img-card table-img\">\r\n <img [src]=\"element?.image\" alt=\"\" onerror=\"this.onerror=null;this.src='assets/images/user.svg';\" />\r\n </div>\r\n\r\n <div *ngSwitchCase=\"'employee'\" [ngClass]=\"columnsConfig[i].type\" class=\"d-flex align-items-center gap-2 text-nowrap\">\r\n <ds-avatar [image]=\"'https://igateapp.stc.com.sa'+element[column]?.['imageUrl']\" size=\"x-small\"> </ds-avatar>\r\n <span>{{ (element[column]?.['name']) }}</span>\r\n </div>\r\n\r\n <div *ngSwitchCase=\"'progress_group'\" [ngClass]=\"columnsConfig[i].type\" class=\"d-flex gap-1\">\r\n <ng-container *ngFor=\"let item of element[column]\">\r\n <div class=\"progress-container default-progress medium radius-0\" matTooltip=\"Team assignment {{ item.value }}%\" matTooltipPosition=\"below\">\r\n <div [style.width.%]=\"item.value\" class=\"progress-bar bg-color-{{ item.color }}\"></div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div *ngSwitchCase=\"'input'\" [ngClass]=\"columnsConfig[i].type\" class=\"\">\r\n <app-input\r\n (input)=\"inputCellChanged.emit({element,column,i})\"\r\n [(ngModel)]=\"element[column]\"\r\n [min]=\"0\"\r\n [placeholder]=\"element[column]\"\r\n class=\"w-100\"\r\n className=\" no-padding w-100\"\r\n type=\"number\"\r\n value=\"{{ element[column] }}\"\r\n >\r\n </app-input>\r\n </div>\r\n <div *ngSwitchCase=\"'autoComplete'\"></div>\r\n <div *ngSwitchCase=\"'select'\" [ngClass]=\"columnsConfig[i].type\" class=\"\">\r\n <app-custom-searchable\r\n (selectedValue)=\"selectValueSelected.emit($event)\"\r\n [isSearchable]=\"columnsConfig[i].config?.isSearchable\"\r\n [key]=\"columnsConfig[i]?.key\"\r\n [displayedLabel]=\"columnsConfig[i]?.displayedLable\"\r\n [options]=\"columnsConfig[i]?.options\"\r\n [postKey]=\"columnsConfig[i]?.postKey\"\r\n [showLabel]=\"false\"\r\n className=\"no-padding w-100\"\r\n >\r\n </app-custom-searchable>\r\n </div>\r\n\r\n <div *ngSwitchCase=\"'status'\" [ngClass]=\"'New' + columnsConfig[i].type\" class=\"d-flex align-items-center gap-2\">\r\n @if (element[column]) {\r\n <ds-status [status]=\"element[column]?.status\" class=\"fs-12\">\r\n {{ element[column]?.title | translate }}\r\n </ds-status>\r\n } @if (element[column]?.reason) {\r\n <span\r\n (click)=\"$event.stopPropagation()\"\r\n [matMenuTriggerFor]=\"reasonMenu\"\r\n [ngClass]=\"columnsConfig[i].type\"\r\n class=\"{{\r\n columnsConfig[i].type\r\n }} fc-red underline cursor-pointer\"\r\n >\r\n Show reason\r\n </span>\r\n }\r\n\r\n <mat-menu #reasonMenu=\"matMenu\" class=\"p-4 text-center\">\r\n <span class=\"fs-14\">\r\n {{ element[column]?.reason }}\r\n </span>\r\n </mat-menu>\r\n </div>\r\n <div *ngSwitchCase=\"'toggle'\" [ngClass]=\"columnsConfig[i].type\">\r\n <mat-slide-toggle (change)=\"toggleValueChange($event, element)\" [checked]=\"element[column] == 1\" [disabled]=\"false\"></mat-slide-toggle>\r\n </div>\r\n\r\n <div *ngSwitchCase=\"'customToggle'\" [ngClass]=\"columnsConfig[i].type\">\r\n <mat-slide-toggle (change)=\"toggleValueChange($event, element)\" [checked]=\"element[column] == 7\" [disabled]=\"element[column] != 1\"></mat-slide-toggle>\r\n </div>\r\n <div *ngSwitchCase=\"'meetingStatus'\" [ngClass]=\"columnsConfig[i].type\" class=\"{{ columnsConfig[i].type }}\">\r\n @if (element[column].label == 'Finished') {\r\n <span class=\" {{ element[column].label }} status \">\r\n {{ element[column].label }}\r\n </span>\r\n } @if (element[column].label != 'Finished') {\r\n <div class=\"d-flex align-items-center gap-2\">\r\n <div class=\"Finished d-flex flex-column align-items-center justify-content-center py-1 fc-black\">\r\n <span class=\"fs-11 fw-medium mb-1\"> {{ element[column].hours }}</span>\r\n <span class=\"fs-10 fw-light\">HRS</span>\r\n </div>\r\n <div class=\"Finished d-flex flex-column align-items-center justify-content-center py-1 fc-black\">\r\n <span class=\"fs-11 fw-medium mb-1\"> {{ element[column].min }}</span>\r\n <span class=\"fs-10 fw-light\">MINS</span>\r\n </div>\r\n <div class=\"Finished d-flex flex-column align-items-center justify-content-center py-1 fc-black\">\r\n <span class=\"fs-11 fw-medium mb-1\"> {{ element[column].sec }}</span>\r\n <span class=\"fs-10 fw-light\">SECS</span>\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n <span\r\n *ngSwitchCase=\"'number'\"\r\n [ngClass]=\"columnsConfig[i].type\"\r\n class=\"{{ columnsConfig[i].type }} {{\r\n element[column] ? 'underline' : ''\r\n }}\"\r\n >\r\n {{ element[column] ? element[column] : 0 }}\r\n </span>\r\n\r\n <span *ngSwitchCase=\"'currency'\" [ngClass]=\"columnsConfig[i].type\" class=\"{{ columnsConfig[i].type }}\">\r\n {{ element[column] ? parseInt(element[column]).toFixed(2) + (columnsConfig[i].currency | translate) : \"-\" }}\r\n </span>\r\n <span *ngSwitchCase=\"'active'\" [ngClass]=\"columnsConfig[i].type\" class=\"{{ columnsConfig[i].type }}\">\r\n <ds-icon [ngClass]=\"element[column] ? 'fc-green' : 'fc-gray'\" icon=\"check-circle-f fs-30\"></ds-icon>\r\n </span>\r\n <div\r\n *ngSwitchCase=\"'sync'\"\r\n [ngClass]=\"columnsConfig[i].type\"\r\n class=\"{{\r\n columnsConfig[i].type\r\n }} d-flex align-items-center gap-2\"\r\n >\r\n <svg fill=\"none\" height=\"19\" viewBox=\"0 0 18 19\" width=\"18\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n d=\"M14.25 13.2604C13.9425 13.2604 13.6875 12.9913 13.6875 12.6667V5.14583C13.6875 4.59958 13.2675 4.15625 12.75 4.15625H8.625C8.3175 4.15625 8.0625 3.88708 8.0625 3.5625C8.0625 3.23792 8.3175 2.96875 8.625 2.96875H12.75C13.89 2.96875 14.8125 3.9425 14.8125 5.14583V12.6667C14.8125 12.9913 14.5575 13.2604 14.25 13.2604Z\"\r\n fill=\"#FF375E\"\r\n />\r\n <path\r\n d=\"M10.5 6.13549C10.3725 6.13549 10.245 6.088 10.14 6.00092L7.88999 4.02175C7.76249 3.91092 7.6875 3.74465 7.6875 3.56257C7.6875 3.38048 7.76249 3.22214 7.88999 3.10339L10.14 1.12422C10.38 0.910471 10.7325 0.950084 10.935 1.20342C11.1375 1.45675 11.1 1.82883 10.86 2.04258L9.12751 3.56257L10.86 5.08255C11.1 5.29631 11.13 5.66839 10.935 5.92172C10.8225 6.06422 10.6575 6.13549 10.5 6.13549Z\"\r\n fill=\"#FF375E\"\r\n />\r\n <path\r\n d=\"M14.25 18.0105C12.6975 18.0105 11.4375 16.6805 11.4375 15.0417C11.4375 13.403 12.6975 12.073 14.25 12.073C15.8025 12.073 17.0625 13.403 17.0625 15.0417C17.0625 16.6805 15.8025 18.0105 14.25 18.0105ZM14.25 13.2605C13.32 13.2605 12.5625 14.0601 12.5625 15.0417C12.5625 16.0234 13.32 16.823 14.25 16.823C15.18 16.823 15.9375 16.0234 15.9375 15.0417C15.9375 14.0601 15.18 13.2605 14.25 13.2605Z\"\r\n fill=\"#FF375E\"\r\n />\r\n <path\r\n d=\"M9.375 16.0312H5.25C4.11 16.0312 3.1875 15.0574 3.1875 13.8541V6.33325C3.1875 6.00867 3.4425 5.7395 3.75 5.7395C4.0575 5.7395 4.3125 6.00867 4.3125 6.33325V13.8541C4.3125 14.4003 4.7325 14.8437 5.25 14.8437H9.375C9.6825 14.8437 9.9375 15.1128 9.9375 15.4374C9.9375 15.762 9.6825 16.0312 9.375 16.0312Z\"\r\n fill=\"#FF375E\"\r\n />\r\n <path\r\n d=\"M7.4997 18.0104C7.3422 18.0104 7.17721 17.9391 7.06471 17.7966C6.86221 17.5433 6.89969 17.1712 7.13969 16.9574L8.87219 15.4375L7.13969 13.9175C6.89969 13.7037 6.86971 13.3316 7.06471 13.0783C7.26721 12.825 7.61971 12.7933 7.85971 12.9991L10.1097 14.9783C10.2372 15.0891 10.3122 15.2554 10.3122 15.4375C10.3122 15.6195 10.2372 15.7779 10.1097 15.8966L7.85971 17.8758C7.75471 17.9629 7.6272 18.0104 7.4997 18.0104Z\"\r\n fill=\"#FF375E\"\r\n />\r\n <path\r\n d=\"M3.75 6.927C2.1975 6.927 0.9375 5.597 0.9375 3.95825C0.9375 2.3195 2.1975 0.989502 3.75 0.989502C5.3025 0.989502 6.5625 2.3195 6.5625 3.95825C6.5625 5.597 5.3025 6.927 3.75 6.927ZM3.75 2.177C2.82 2.177 2.0625 2.97659 2.0625 3.95825C2.0625 4.93992 2.82 5.7395 3.75 5.7395C4.68 5.7395 5.4375 4.93992 5.4375 3.95825C5.4375 2.97659 4.68 2.177 3.75 2.177Z\"\r\n fill=\"#FF375E\"\r\n />\r\n </svg>\r\n {{ element[column] }}\r\n </div>\r\n\r\n <ng-container *ngSwitchCase=\"'clickable'\">\r\n @if (element?.[column]) {\r\n <span\r\n #statusMenuTrigger=\"matMenuTrigger\"\r\n (click)=\"$event.stopPropagation()\"\r\n [matMenuTriggerFor]=\"descMenu\"\r\n [ngClass]=\"columnsConfig[i].type\"\r\n class=\"{{\r\n columnsConfig[i].type\r\n }} fc-coral underline cursor-pointer\"\r\n >\r\n {{ columnsConfig[i].clickableText | translate }}\r\n </span>\r\n }\r\n\r\n <mat-menu #descMenu=\"matMenu\" class=\"p-4 text-center\">\r\n <span class=\"fs-14\">\r\n {{ element[column] }}\r\n </span>\r\n </mat-menu>\r\n </ng-container>\r\n\r\n <span\r\n #statusMenuTrigger=\"matMenuTrigger\"\r\n (click)=\"$event.stopPropagation()\"\r\n *ngSwitchCase=\"'translatedClickable'\"\r\n [matMenuTriggerFor]=\"descMenuTranslated\"\r\n [ngClass]=\"columnsConfig[i].type\"\r\n class=\"{{\r\n columnsConfig[i].type\r\n }} fc-coral underline cursor-pointer\"\r\n >\r\n {{ columnsConfig[i].clickableText | translate }}\r\n <!-- {{ 'global.view' | translate}} -->\r\n </span>\r\n\r\n <mat-menu #descMenuTranslated=\"matMenu\" class=\"p-4 text-center\">\r\n <span class=\"fs-14\">\r\n {{ columnsConfig[i].arKey ? translateService.currentLang == \"ar\" ? mapText(columnsConfig[i].arKey, element[column]) : mapText(columnsConfig[i].enKey, element[column]) : element[column] ?\r\n element[column] : \"-\" }}\r\n </span>\r\n </mat-menu>\r\n\r\n <span\r\n #statusMenuTrigger=\"matMenuTrigger\"\r\n (click)=\"$event.stopPropagation()\"\r\n *ngSwitchCase=\"'conditionalClickable'\"\r\n [matMenuTriggerFor]=\"descConditionalMenu\"\r\n [ngClass]=\"columnsConfig[i].type\"\r\n class=\"{{\r\n columnsConfig[i].type\r\n }} fc-coral underline cursor-pointer\"\r\n >\r\n @if (element[column] && element[column] != 'null') {\r\n <span>{{ columnsConfig[i].clickableText | translate }}</span>\r\n }\r\n <!-- {{ 'global.view' | translate}} -->\r\n </span>\r\n\r\n <mat-menu #descConditionalMenu=\"matMenu\" class=\"p-4 text-center\">\r\n <span class=\"fs-14\">\r\n {{ element[column] }}\r\n </span>\r\n </mat-menu>\r\n\r\n <span (click)=\"$event.stopPropagation()\" *ngSwitchCase=\"'dropdown'\" [matMenuTriggerFor]=\"dropdownMenu\" [ngClass]=\"columnsConfig[i].type\" class=\"{{ columnsConfig[i].type }} cursor-pointer\">\r\n {{ columnsConfig[i].arKey ? translateService.currentLang == \"ar\" ? mapText(columnsConfig[i].arKey, element[column]) : mapText(columnsConfig[i].enKey, element[column]) : element[column] ? element[column] :\r\n \"-\" }}\r\n <!-- <span *ngFor=\"let item of element[column]\">\r\n {{item.id}}\r\n </span> -->\r\n\r\n <ds-icon class=\"fc-black fw-medium\" icon=\"arrow\"></ds-icon>\r\n </span>\r\n\r\n <mat-menu #dropdownMenu=\"matMenu\" class=\"p-4 text-center\">\r\n <ng-container *ngSwitchCase=\"'dropdown'\">\r\n <span class=\"fs-12 fc-black\" mat-menu-item>\r\n <!-- {{translateService.currentLang == 'ar' ? item.groupNameAr : item.groupNameEn}} -->\r\n {{ columnsConfig[i].arKey ? translateService.currentLang == \"ar\" ? mapText(columnsConfig[i].arKey, element[column]) : mapText(columnsConfig[i].enKey, element[column]) : element[column] ?\r\n element[column] : \"-\" }}\r\n </span>\r\n </ng-container>\r\n </mat-menu>\r\n\r\n <span\r\n *ngSwitchCase=\"'formatNumber'\"\r\n [ngClass]=\"columnsConfig[i].type\"\r\n matTooltip=\"{{\r\n element[column] > 1000 ? element[column] : ''\r\n }}\"\r\n >\r\n {{ element[column] }}\r\n </span>\r\n\r\n <div *ngSwitchCase=\"'group'\" [ngClass]=\"columnsConfig[i].type\" class=\"text-nowrap d-flex align-items-center\"></div>\r\n\r\n <div *ngSwitchCase=\"'company'\" [ngClass]=\"columnsConfig[i].type\" class=\"d-flex align-items-center\">\r\n <span class=\"img-card circled-img\">\r\n <img [src]=\"element?.image\" alt=\"\" onerror=\"this.onerror=null;this.src='assets/images/user.svg';\" />\r\n </span>\r\n <span class=\"mx-1\"></span>\r\n <span class=\"full-name\">{{ element[column] }}</span>\r\n </div>\r\n\r\n <span *ngSwitchCase=\"'translated'\" [ngClass]=\"columnsConfig[i].type\" class=\"text-nowrap\">\r\n {{ element[column] }}\r\n </span>\r\n <span *ngSwitchCase=\"'title'\" [ngClass]=\"columnsConfig[i].type\" class=\"text-nowrap\">\r\n {{ element[column]?.title }}\r\n </span>\r\n\r\n <span *ngSwitchCase=\"'maxWidth'\" [ngClass]=\"columnsConfig[i].type\">\r\n {{ element[column]?.title }}\r\n </span>\r\n\r\n <span *ngSwitchCase=\"'progress'\" [ngClass]=\"columnsConfig[i].type\">\r\n <div class=\"Progress\">\r\n <div class=\"progress-container default-progress\">\r\n <div\r\n [style.width.%]=\"\r\n (element[column].consumed! / element[column].total!) *\r\n 100\r\n \"\r\n class=\"progress-bar\"\r\n ></div>\r\n </div>\r\n <div class=\"Progress__footer\">\r\n <div></div>\r\n <div>\r\n <span class=\"fs-12\">\r\n <span>{{ element[column].consumed }}</span>\r\n <span>/</span>\r\n <span class=\"fc-silver\">{{ element[column].total }}</span>\r\n </span>\r\n </div>\r\n </div>\r\n </div>\r\n </span>\r\n\r\n <div *ngSwitchCase=\"'subsidiary'\" [ngClass]=\"columnsConfig[i].type\" class=\"d-flex align-items-center gap-2\">\r\n <img [alt]=\"element[column]?.title\" src=\"assets/subsidiaries/ids/{{ element[column]?.id }}.png\" />\r\n <!-- <span class=\"full-name\">{{element[column]}}</span>-->\r\n </div>\r\n\r\n <div *ngSwitchCase=\"'Service'\" [ngClass]=\"columnsConfig[i].type\" class=\"d-flex align-items-center gap-2\">\r\n <svg fill=\"none\" height=\"35\" viewBox=\"0 0 34 35\" width=\"34\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect fill=\"#FF375E\" fill-opacity=\"0.1\" height=\"33.5\" rx=\"4\" width=\"33.5\" y=\"0.75\" />\r\n <path\r\n d=\"M24.213 17.0338H22.1448L21.4532 15.1884C21.2221 14.5845 20.649 14.1622 19.9761 14.1592H13.5315C12.8586 14.1622 12.2847 14.5838 12.0582 15.1771L12.0544 15.1876L11.3628 17.033H9.29312C9.05532 17.033 8.86328 17.2258 8.86328 17.4629V19.1845C8.86328 19.4223 9.05607 19.6143 9.29312 19.6143H10.2076L9.69896 20.378C9.53242 20.6233 9.4334 20.9263 9.4334 21.2519C9.4334 21.2527 9.4334 21.2527 9.4334 21.2534V26.0702C9.4334 26.308 9.62619 26.5 9.86324 26.5H12.1595C12.3973 26.5 12.5893 26.3072 12.5893 26.0702V24.7791H20.91V26.0702C20.91 26.308 21.1028 26.5 21.3399 26.5H23.6361C23.8739 26.5 24.066 26.3072 24.066 26.0702V21.2519C24.066 21.2512 24.066 21.2512 24.066 21.2504C24.066 20.9248 23.9669 20.6218 23.7974 20.3705L23.8011 20.3757L23.2925 19.6121H24.207C24.4448 19.6121 24.6368 19.4193 24.6368 19.1822V17.4606C24.6361 17.2258 24.4478 17.036 24.2145 17.0315L24.213 17.0338ZM12.8654 15.4915C12.9711 15.2176 13.2314 15.0271 13.5368 15.0264H19.9798C20.2852 15.0271 20.5455 15.2184 20.649 15.487L20.6505 15.4922L21.8747 18.7569H11.6359L12.8654 15.4915ZM23.2138 23.9202H10.2983V21.2542C10.2983 21.2534 10.2983 21.2534 10.2983 21.2527C10.2983 21.1049 10.3433 20.9676 10.4199 20.8536L10.4184 20.8558L11.245 19.6151H22.2618L23.0885 20.8558C23.1635 20.9668 23.2085 21.1049 23.2085 21.2519C23.2085 21.2527 23.2085 21.2527 23.2085 21.2534L23.2138 23.9202ZM9.72896 17.895H11.0357L10.7132 18.7561H9.72071L9.72896 17.895ZM11.7379 25.6411H10.2983V24.7799H11.7334L11.7379 25.6411ZM23.2153 25.6411H21.775V24.7799H23.21L23.2153 25.6411ZM23.7869 18.7546H22.7899L22.4674 17.8935H23.7831L23.7869 18.7546ZM12.1632 20.4762C11.2915 20.4762 10.5856 21.1829 10.5856 22.0538C10.5856 22.9248 11.2923 23.6314 12.1632 23.6314C13.0349 23.6314 13.7408 22.9248 13.7408 22.0538C13.7408 21.1821 13.0342 20.4762 12.1632 20.4762V20.4762ZM12.1632 22.7725C11.7671 22.7725 11.4461 22.4514 11.4461 22.0553C11.4461 21.6592 11.7671 21.3382 12.1632 21.3382C12.5593 21.3382 12.8804 21.6592 12.8804 22.0553C12.8804 22.4514 12.5593 22.7725 12.1632 22.7725V22.7725ZM21.3444 20.4762C20.4727 20.4762 19.7668 21.1829 19.7668 22.0538C19.7668 22.9248 20.4735 23.6314 21.3444 23.6314C22.2161 23.6314 22.922 22.9248 22.922 22.0538C22.922 21.1821 22.2153 20.4762 21.3444 20.4762ZM21.3444 22.7725C20.9483 22.7725 20.6272 22.4514 20.6272 22.0553C20.6272 21.6592 20.9483 21.3382 21.3444 21.3382C21.7405 21.3382 22.0615 21.6592 22.0615 22.0553C22.0615 22.4514 21.7405 22.7725 21.3444 22.7725ZM19.0489 21.0509H14.4579C14.2201 21.0509 14.0274 21.2437 14.0274 21.4815C14.0274 21.7193 14.2201 21.912 14.4579 21.912H19.0489C19.2867 21.912 19.4795 21.7193 19.4795 21.4815C19.4795 21.2437 19.2867 21.0509 19.0489 21.0509ZM19.0489 22.1986H14.4579C14.2201 22.1986 14.0274 22.3914 14.0274 22.6292C14.0274 22.867 14.2201 23.0598 14.4579 23.0598H19.0489C19.2867 23.0598 19.4795 22.867 19.4795 22.6292C19.4795 22.3914 19.2867 22.1986 19.0489 22.1986ZM15.2321 12.5703C15.1541 12.6484 15.1061 12.7556 15.1061 12.8742C15.1061 13.112 15.2989 13.304 15.5359 13.304C15.6544 13.304 15.7625 13.256 15.8397 13.178C16.0738 12.9439 16.3971 12.7991 16.7542 12.7991C17.1113 12.7991 17.4346 12.9439 17.6686 13.178C17.7466 13.256 17.8539 13.304 17.9724 13.304C18.2102 13.304 18.4023 13.1112 18.4023 12.8742C18.4023 12.7556 18.3543 12.6476 18.2762 12.5703C17.8862 12.181 17.3483 11.9395 16.7534 11.9395C16.1586 11.9395 15.6199 12.1803 15.2306 12.5703H15.2321ZM19.1877 12.0865C19.1884 12.0865 19.1884 12.0865 19.1892 12.0865C19.427 12.0865 19.619 11.8937 19.619 11.6567C19.619 11.5374 19.5703 11.4294 19.4915 11.3513C18.7909 10.6507 17.8224 10.2171 16.7527 10.2171C15.683 10.2171 14.7145 10.6507 14.0139 11.3513C13.9358 11.4294 13.8878 11.5366 13.8878 11.6552C13.8878 11.893 14.0806 12.085 14.3177 12.085C14.4362 12.085 14.5442 12.037 14.6215 11.959C15.1668 11.4136 15.92 11.0768 16.7519 11.0768C17.5838 11.0768 18.337 11.4136 18.8824 11.959C18.9604 12.037 19.0677 12.0857 19.1869 12.0857H19.1877V12.0865ZM13.4062 10.743C14.2637 9.88704 15.4467 9.35818 16.7542 9.35818C18.0617 9.35818 19.2447 9.88704 20.1021 10.743C20.1801 10.821 20.2874 10.869 20.4059 10.869C20.6437 10.869 20.8358 10.6762 20.8358 10.4392C20.8358 10.3206 20.7878 10.2126 20.7098 10.1353C19.6963 9.12488 18.298 8.5 16.7534 8.5C15.2089 8.5 13.8106 9.12488 12.7971 10.1353C12.7191 10.2134 12.6711 10.3206 12.6711 10.4392C12.6711 10.677 12.8639 10.869 13.1009 10.869C13.2194 10.869 13.3275 10.821 13.4047 10.743H13.4062Z\"\r\n fill=\"#FF375E\"\r\n />\r\n </svg>\r\n\r\n <span class=\"fs-12 fw-normal fc-black\">{{ element?.Service.name }}</span>\r\n </div>\r\n <div *ngSwitchCase=\"'Color'\" class=\"d-flex align-items-center gap-2\">\r\n <span\r\n [ngClass]=\"columnsConfig[i].type\"\r\n [style.background]=\"\r\n element[column]?.colorCode\r\n ? element[column]?.colorCode\r\n : element[column]\r\n \"\r\n ></span>\r\n {{ element[column].title }}\r\n </div>\r\n <div\r\n *ngSwitchCase=\"'colorBg'\"\r\n [style.background]=\"\r\n 'rgba(var(--rgb-' + element[column]?.colorName + '), 0.1)'\r\n \"\r\n class=\"d-flex align-items-center gap-2 Colorbg p-2\"\r\n >\r\n <span class=\"bc-{{ element[column]?.colorName }}\"></span>\r\n {{ element[column].title }}\r\n </div>\r\n <div *ngSwitchCase=\"'assigned'\" [ngClass]=\"columnsConfig[i].type\" class=\"delegate d-flex align-items-center\">\r\n <div class=\"img-card x-small circled-img\">\r\n <img [src]=\"element?.AssignedTo.image\" alt=\"\" onerror=\"this.onerror=null;this.src='assets/images/user.svg';\" />\r\n </div>\r\n <span class=\"mx-1\"></span>\r\n <span class=\"fs-12 fc-black\">{{ element?.AssignedTo.name }}</span>\r\n <!--\r\n <span class=\"sfi sfi-close fc-coral\"></span>\r\n -->\r\n </div>\r\n\r\n <span *ngSwitchCase=\"'coloredText'\" [style.color]=\"element[column]?.['color']\">{{ element[column]?.['title'] }}</span>\r\n <div *ngSwitchCase=\"'survey'\" [style.color]=\"element[column]?.['color']\" class=\"d-flex align-items-center gap-1 text-nowrap\">\r\n <span class=\"fs-20 sfi sfi-emoji-{{(element[column]?.['title']['en'].toLowerCase()) }}\"></span>\r\n {{ element[column]?.['title'] }}\r\n </div>\r\n\r\n <div *ngSwitchCase=\"'Satisfaction'\" [ngClass]=\"columnsConfig[i].type\" class=\"delegate d-flex gap-2 align-items-center\">\r\n <!--\r\n <ds-icon icon=\"star-f\" class=\"fc-dark-gray\"></ds-icon>\r\n -->\r\n\r\n <span class=\"fs-12 fc-black\">{{ element[column].percentage }}%</span>\r\n <ds-status class=\"auto-status\" size=\"small\" status=\"{{ element[column].status }}\">\r\n <span class=\"fs-10\">\r\n {{ element[column].percentageTrend }}%\r\n </span>\r\n @if (element[column].trendStatus == 'up') {\r\n <ds-icon class=\"fs-13 mx-1 growthIcon\" icon=\"up-growth\"> </ds-icon>\r\n } @if (element[column].trendStatus != 'up') {\r\n <ds-icon class=\"fs-13 mx-1 downIcon\" icon=\"down-growth\"> </ds-icon>\r\n }\r\n </ds-status>\r\n </div>\r\n\r\n <ng-container *ngSwitchCase=\"'actions'\">\r\n <div class=\"d-flex justify-content-start gap-2\">\r\n <ng-container *ngIf=\"columnsConfig[i]?.actions?.length <= 6\">\r\n <ng-container *ngFor=\"let action of columnsConfig[i]?.actions\">\r\n <ds-button (click)=\"$event.stopPropagation()\" *ngIf=\"action.viewMode === Actions.ALLOCATE\" shape=\"outline\" size=\"small\">\r\n <span class=\"fs-12 fc-{{ action?.actionFontColor }}\">\r\n {{ action?.actionName | translate }}\r\n </span>\r\n </ds-button>\r\n\r\n <ds-button\r\n (click)=\"\r\n $event.stopPropagation(); action?.onClick(element)\r\n \"\r\n *ngIf=\"action === Actions.ALLOCATE\"\r\n icon\r\n size=\"small\"\r\n >\r\n <ds-icon class=\"fs-15\" icon=\"pen\"></ds-icon>\r\n </ds-button>\r\n <ng-container\r\n *ngIf=\"\r\n action.viewMode != Actions.VIEW ||\r\n action.viewMode != Actions.COPY\r\n \"\r\n >\r\n <ds-button\r\n (click)=\"\r\n $event.stopPropagation(); action?.onClick(element)\r\n \"\r\n *ngIf=\"\r\n action?.action === Actions.VIEW &&\r\n !action?.isHidden\r\n \"\r\n icon\r\n size=\"small\"\r\n >\r\n <ds-icon class=\"fs-15\" icon=\"eye\"></ds-icon>\r\n </ds-button>\r\n <ds-button (click)=\"$event.stopPropagation(); action?.onClick(element)\"\r\n *ngIf=\"action?.action === Actions.CLOSE && !action?.isHidden\"\r\n icon size=\"small\">\r\n <ds-icon class=\"fs-15 fc-coral\" icon=\"close\"></ds-icon>\r\n </ds-button>\r\n\r\n <ds-button\r\n (click)=\"\r\n $event.stopPropagation(); action?.onClick(element)\r\n \"\r\n *ngIf=\"\r\n action?.action === Actions.COPY &&\r\n !action?.isHidden\r\n \"\r\n icon\r\n size=\"small\"\r\n >\r\n <ds-icon class=\"fs-15\" icon=\"files-copy\"></ds-icon>\r\n </ds-button>\r\n <!-- @if(element.hasOwnProperty('canUpdate')){\r\n <ds-button (click)=\"$event.stopPropagation();action?.onClick(element)\" icon size=\"small\"\r\n *ngIf=\"action?.action === 'edit' && !action?.isHidden && element.canUpdate == true\">\r\n <ds-icon icon=\"pen\" class=\"fs-15\"></ds-icon>\r\n </ds-button>\r\n }@else { -->\r\n\r\n <ds-button\r\n (click)=\"\r\n $event.stopPropagation(); action?.onClick(element)\"\r\n *ngIf=\"\r\n action?.action === Actions.EDIT &&\r\n ![4, 7].includes(element?.contractStatus?.id)\"\r\n icon\r\n size=\"small\"\r\n >\r\n <ds-icon class=\"fs-15\" icon=\"pen\"></ds-icon>\r\n </ds-button>\r\n <!-- } -->\r\n\r\n <ds-button\r\n (click)=\"\r\n $event.stopPropagation(); action?.onClick(element)\r\n \"\r\n *ngIf=\"\r\n action?.action === Actions.DELETE &&\r\n !action?.isHidden &&\r\n ![4, 7].includes(element?.contractStatus?.id)\r\n \"\r\n icon\r\n size=\"small\"\r\n >\r\n <ds-icon class=\"fc-coral fs-15\" icon=\"trash\"></ds-icon>\r\n </ds-button>\r\n\r\n <ds-button\r\n (click)=\"\r\n $event.stopPropagation(); action?.onClick(element)\r\n \"\r\n *ngIf=\"\r\n action?.action === Actions.DELETEPENDING &&\r\n !action?.isHidden &&\r\n element?.contractStatus?.id == 1\r\n \"\r\n icon\r\n size=\"small\"\r\n >\r\n <ds-icon class=\"fc-coral fs-15\" icon=\"trash\"></ds-icon>\r\n </ds-button>\r\n\r\n <ds-button\r\n (click)=\"\r\n $event.stopPropagation(); action?.onClick(element)\r\n \"\r\n *ngIf=\"action?.action === Actions.CHART\"\r\n color=\"transparent\"\r\n size=\"small\"\r\n >\r\n <ds-icon class=\"fc-coral fs-15\" icon=\"chart-o\"></ds-icon>\r\n </ds-button>\r\n\r\n @if (element.hasOwnProperty('canTakeAction')) {\r\n <ds-button\r\n (click)=\"\r\n $event.stopPropagation(); action?.onClick(element)\r\n \"\r\n size=\"small\"\r\n *ngIf=\"\r\n action?.action === Actions.APPROVE &&\r\n element.canTakeAction == true\r\n \"\r\n >\r\n <span class=\"fs-12\">\r\n {{ \"global.approve\" | translate }}\r\n </span>\r\n </ds-button>\r\n <ds-button\r\n shape=\"outline\"\r\n color=\"dark-gray\"\r\n (click)=\"\r\n $event.stopPropagation(); action?.onClick(element)\r\n \"\r\n size=\"small\"\r\n *ngIf=\"\r\n action?.action === Actions.REJECT &&\r\n element.canTakeAction == true\r\n \"\r\n shape=\"outline\"\r\n >\r\n <span class=\"fs-12\">\r\n {{ \"global.reject\" | translate }}\r\n </span>\r\n </ds-button>\r\n } @else {\r\n <ds-button\r\n (click)=\"\r\n $event.stopPropagation(); action?.onClick(element)\r\n \"\r\n size=\"small\"\r\n *ngIf=\"action?.action === Actions.APPROVE\"\r\n >\r\n <span class=\"fs-12\">\r\n {{ \"global.approve\" | translate }}\r\n </span>\r\n </ds-button>\r\n <ds-button\r\n shape=\"outline\"\r\n color=\"dark-gray\"\r\n (click)=\"\r\n $event.stopPropagation(); action?.onClick(element)\r\n \"\r\n size=\"small\"\r\n *ngIf=\"action?.action === Actions.REJECT\"\r\n shape=\"outline\"\r\n >\r\n <span class=\"fs-12\">\r\n {{ \"global.reject\" | translate }}\r\n </span>\r\n </ds-button>\r\n }\r\n\r\n <ds-button *ngIf=\"action?.action === Actions.DETAILS\" shape=\"text\" size=\"small\">\r\n <span class=\"fs-12 underline\"> View Details </span>\r\n </ds-button>\r\n <ds-button\r\n (click)=\"\r\n $event.stopPropagation(); action?.onClick(element)\r\n \"\r\n *ngIf=\"\r\n action?.action === Actions.START &&\r\n element?.isFinalize\r\n \"\r\n size=\"small\"\r\n >\r\n <span class=\"fs-12\">\r\n {{ action?.actionName | translate }}\r\n </span>\r\n <ds-icon class=\"fs-16\" icon=\"media-play\" slot=\"prefix\"></ds-icon>\r\n </ds-button>\r\n <ds-button\r\n (click)=\"\r\n $event.stopPropagation(); action?.onClick(element)\r\n \"\r\n *ngIf=\"action?.action === Actions.PREPARE\"\r\n color=\"light-gray\"\r\n size=\"small\"\r\n >\r\n <span class=\"fs-12 fc-black\">\r\n {{ action?.actionName | translate }}\r\n </span>\r\n <ds-icon class=\"fs-12 fc-black\" icon=\"settings\" slot=\"prefix\"></ds-icon>\r\n </ds-button>\r\n\r\n <ds-button\r\n (click)=\"\r\n $event.stopPropagation(); action?.onClick(element)\r\n \"\r\n *ngIf=\"\r\n action?.action === Actions.START &&\r\n element?.isFinalize\r\n \"\r\n size=\"small\"\r\n >\r\n <span class=\"fs-12\">\r\n {{ action?.actionName | translate }}\r\n </span>\r\n <ds-icon class=\"fs-16\" icon=\"media-play\" slot=\"prefix\"></ds-icon>\r\n </ds-button>\r\n\r\n <!-- <ds-button [color]=\"action?.actionColor\" size=\"small\"\r\n *ngIf=\"action?.action === 'customAction'\"\r\n (click)=\"$event.stopPropagation();action?.onClick(element)\" shape=\"{{action?.actionShape}}\" [class]=\"action?.actionColor\"\r\n ></ds-button> -->\r\n\r\n <ds-button\r\n (click)=\"\r\n $event.stopPropagation(); action?.onClick(element)\r\n \"\r\n *ngIf=\"action?.action === Actions.CUSTOMACTION\"\r\n [class]=\"action?.actionColor\"\r\n [color]=\"action?.actionColor\"\r\n shape=\"{{ action?.actionShape }}\"\r\n size=\"small\"\r\n >\r\n <span class=\"fs-12 fc-{{ action?.actionFontColor }}\">\r\n {{ action?.actionName | translate }}\r\n </span>\r\n </ds-button>\r\n <ds-button\r\n (click)=\"\r\n $event.stopPropagation(); action?.onClick(element)\r\n \"\r\n *ngIf=\"\r\n action?.action === Actions.CUSTOMACTIONMANAGE &&\r\n (element.contractStatus.id == 7 ||\r\n element.contractStatus.id == 1)\r\n \"\r\n [class]=\"action?.actionColor\"\r\n [color]=\"action?.actionColor\"\r\n shape=\"{{ action?.actionShape }}\"\r\n size=\"small\"\r\n >\r\n <span class=\"fs-12 fc-{{ action?.actionFontColor }}\">\r\n {{ action?.actionName | translate }}\r\n </span>\r\n </ds-button>\r\n\r\n <ds-button\r\n (click)=\"\r\n $event.stopPropagation(); action?.onClick(element)\r\n \"\r\n *ngIf=\"\r\n action?.action === Actions.CUSTOMACTIONEXTEND &&\r\n element.contractStatus.id == 7\r\n \"\r\n [class]=\"action?.actionColor\"\r\n [color]=\"action?.actionColor\"\r\n shape=\"{{ action?.actionShape }}\"\r\n size=\"small\"\r\n >\r\n <span class=\"fs-12 fc-{{ action?.actionFontColor }}\">\r\n {{ action?.actionName | translate }}\r\n </span>\r\n </ds-button>\r\n <ds-button\r\n (click)=\"\r\n $event.stopPropagation(); action?.onClick(element)\r\n \"\r\n *ngIf=\"\r\n action?.action === Actions.CUSTOMACTIONDETAILS\r\n \"\r\n [class]=\"action?.actionColor\"\r\n [color]=\"action?.actionColor\"\r\n shape=\"{{ action?.actionShape }}\"\r\n size=\"small\"\r\n >\r\n <span class=\"fs-12 fc-{{ action?.actionFontColor }}\">\r\n {{ action?.actionName | translate }}\r\n </span>\r\n </ds-button>\r\n <ds-status *ngIf=\"action?.action === Actions.STATUS\" [status]=\"action?.Status.status\" class=\"fs-12 statusAction w-100\">\r\n <span class=\"fc-black\">\r\n {{ action?.Status.title | translate }}\r\n </span>\r\n </ds-status>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"columnsConfig[i]?.actions?.length > 6\">\r\n <ds-button\r\n #statusMenuTrigger=\"matMenuTrigger\"\r\n (click)=\"$event.stopPropagation()\"\r\n *ngIf=\"columnsConfig[i]?.actions?.length > 1\"\r\n [matMenuTriggerFor]=\"statusMenu\"\r\n class=\"dots\"\r\n shape=\"text\"\r\n size=\"small\"\r\n >\r\n <ds-icon class=\"fs-20 fc-dark-gray\" icon=\"dots\"></ds-icon>\r\n </ds-button>\r\n\r\n <mat-menu #statusMenu=\"matMenu\">\r\n <button (click)=\"action?.onClick(element)\" *ngFor=\"let action of columnsConfig[i]?.actions\" mat-menu-item>\r\n <span class=\"fs-12 fc-black\">{{ action?.actionName | translate }} </span>\r\n </button>\r\n </mat-menu>\r\n </ng-container>\r\n </div>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'specs'\">\r\n @if (element?.[column]) {\r\n <span\r\n #statusMenuTrigger=\"matMenuTrigger\"\r\n (click)=\"$event.stopPropagation()\"\r\n [matMenuTriggerFor]=\"specsMenu\"\r\n [ngClass]=\"columnsConfig[i].type\"\r\n class=\"{{\r\n columnsConfig[i].type\r\n }} fc-coral underline cursor-pointer\"\r\n >\r\n {{ columnsConfig[i].clickableText | translate }}\r\n </span>\r\n }\r\n\r\n <mat-menu #specsMenu=\"matMenu\" class=\"p-4 text-center\">\r\n <span class=\"fs-14\">\r\n {{ element[column] }}\r\n </span>\r\n </mat-menu>\r\n </ng-container>\r\n\r\n <!--<div\r\n *ngSwitchCase=\"'specs'\" [ngClass]=\"columnsConfig[i].type\"\r\n class=\"d-flex gap-1\">\r\n {{ element[column] | json }}\r\n <ng-container *ngFor=\"let item of element[column]\">\r\n\r\n <div\r\n class=\"progress-container default-progress medium radius-0 \"\r\n matTooltip=\"Team assignment {{item.value}}%\" matTooltipPosition=\"below\">\r\n <div\r\n [style.width.%]=\"item.value\"\r\n class=\"progress-bar bg-color-{{item.color}}\"></div>\r\n </div>\r\n </ng-container>\r\n\r\n </div>-->\r\n\r\n <span\r\n *ngSwitchDefault\r\n [ngClass]=\"columnsConfig[i].type\"\r\n class=\"text-nowrap\"\r\n matTooltip=\" {{\r\n columnsConfig[i].arKey\r\n ? translateService.currentLang == 'ar'\r\n ? mapText(columnsConfig[i].arKey, element[column])\r\n : mapText(columnsConfig[i].enKey, element[column])\r\n : element[column]\r\n ? element[column]\r\n : '-'\r\n }}\"\r\n matTooltipPosition=\"below\"\r\n >\r\n {{ columnsConfig[i].arKey ? translateService.currentLang == \"ar\" ? mapText(columnsConfig[i].arKey, element[column]) : mapText(columnsConfig[i].enKey, element[column]) : element[column] ? element[column] :\r\n \"-\" }}\r\n </span>\r\n </ng-container>\r\n </td>\r\n </ng-container>\r\n </ng-container>\r\n }\r\n </ng-container>\r\n }\r\n\r\n <tr *matHeaderRowDef=\"columns; sticky: true\" mat-header-row></tr>\r\n <tr (click)=\"clickRow(row)\" *matRowDef=\"let row; columns: columns\" [ngClass]=\"{ 'selected-row': row?.fastTrackSeen === false }\" mat-row role=\"button\"></tr>\r\n </table>\r\n }\r\n </ng-container>\r\n } @if (isLoading) {\r\n <ds-loading-table [cols]=\"columns.length\" [rows]=\"5\"></ds-loading-table>\r\n } @if (!isLoading && dataSource.filteredData?.length == 0) {\r\n <ds-message [label]=\" customMessage?? 'NoData' | translate\" type=\"emptyList\"></ds-message>\r\n }\r\n</div>\r\n@if (dataSource.filteredData?.length && hasPaginator) {\r\n<mat-paginator #paginator (page)=\"pageChanged($event)\" [length]=\"totalElements\" [pageIndex]=\"currentPage\" [pageSizeOptions]=\"[5, 10, 15, 20, 100]\" [pageSize]=\"pageSize\" aria-label=\"Select page\" showFirstLastButtons> </mat-paginator>\r\n}\r\n", styles: [":host ::ng-deep .table-responsive table{--th-height: 32px;--th-bg: var(--purple);--th-fc: var(--white);--td-height: 75px;--td-radius: 0;--border-spacing: 0;--border-collapse: collapse;--tr-even-bc: var(--white);--tr-odd-bc: var(--white);--tr-border: 1px solid var(--light-gray);--th-border: none;--cell-pading: 0 24px;--th-fs: 11px}:host ::ng-deep .table-responsive table tr.selected-row,:host ::ng-deep .table-responsive table tr.selected-row:hover{background-color:#ecfeff;border-inline-start:3px solid var(--sea-light)}:host ::ng-deep .table-responsive table td.mat-mdc-cell.mat-mdc-table-sticky{box-shadow:-10px 0 10px #00000012}:host ::ng-deep .table-responsive table mat-form-field,:host ::ng-deep .table-responsive table .e-control,:host ::ng-deep .table-responsive table .mdc-form-field{--input-height: 35px}:host ::ng-deep .Color{width:13px;height:13px;border-radius:50%}:host ::ng-deep .Colorbg{width:fit-content;min-width:102px}:host ::ng-deep .Colorbg span{width:9px;height:9px;border-radius:50%}:host ::ng-deep span.number{color:var(--coral)}:host ::ng-deep .subsidiary img{height:22px;max-width:initial}:host ::ng-deep .sla svg{width:37px}:host ::ng-deep tr th{top:-1px!important}:host ::ng-deep ds-status.statusAction::part(base){min-height:35px;--status-width: 100%}:host ::ng-deep .dropdown{border-radius:3px;background:var(--Grays-Off-white, #f3f3f1);display:flex;height:35px;padding:10px;align-items:center;gap:5px;justify-content:center;width:fit-content}:host ::ng-deep .dropdown ds-icon span{font-weight:700}:host ::ng-deep ds-status::part(base){min-height:23px}:host ::ng-deep .Category span{border-radius:3px;width:97px;height:23px;display:flex;align-items:center;justify-content:center}:host ::ng-deep .mat-checkbox .mat-checkbox-ripple{left:calc(50% - 17px);top:calc(50% - 17px);height:30px;width:30px}:host ::ng-deep .mat-checkbox .mat-checkbox-layout .mat-checkbox-inner-container .mat-checkbox-frame{width:20px;height:20px;border-width:1px;border-style:solid;border-color:#909a9f4d}:host ::ng-deep .mat-checkbox-checked .mat-checkbox-checkmark{width:20px}:host ::ng-deep .idea a:hover{text-decoration:underline;color:var(--coral)}.paginator{width:800px}.table-container{max-height:400px;overflow:auto;scroll-behavior:smooth;transition:scroll-behavior .5s ease-in-out}@media (max-width: 768px){.table-container{max-height:65vh;height:65vh}}[dir=rtl] .table-container--btn.reRequest{transform:scaleX(-1)}@media (min-width: 1200px){.table-container--name,.table-container--date{max-width:120px}}@media (min-width: 1200px){[dir=rtl] .table-container--name{max-width:initial}}.table-container--item{display:flex;align-items:center;gap:1rem;min-height:105px;overflow:hidden;position:relative;cursor:pointer}@media (min-width: 991px){.table-container--item h4{max-width:calc(100% - 200px);display:inline-block}}.table-container--item:not(:last-child){margin-bottom:.75rem}.table-container--item ds-status::part(base){--status-width: 60px}.table-container--info span{position:relative;display:flex;align-items:center;gap:.5rem}.table-container--info span:not(:first-of-type):before{content:\"\";min-width:3px;width:3px;height:3px;border-radius:50%;background-color:var(--black)}@media (min-width: 991px){.table-container--status{position:absolute;top:1rem;right:0}}:host ::ng-deep .max-width-150{max-width:150px}:host ::ng-deep .text-align-custom{unicode-bidi:plaintext}:host ::ng-deep .table-responsive table{--th-height: var(--default-size-sm);--th-bg: var(--purple);--th-fc: var(--white);--td-height: 48px;--td-radius: 0;--border-spacing: 0;--border-collapse: collapse;--tr-even-bc: var(--off-white);--tr-odd-bc: var(--white)}:host ::ng-deep .ServiceDetails{display:inline-block;max-width:230px;white-space:normal}:host ::ng-deep .progress_group{width:100px}:host ::ng-deep .progress_group .progress-container.default-progress{min-width:25px;background-color:#cdd0d1}:host ::ng-deep .sla svg{width:36px}:host ::ng-deep .sla text{font-size:10px}:host ::ng-deep .Periority.High{color:var(--red)}:host ::ng-deep .Periority.Medium{color:var(--orange)}:host ::ng-deep .Periority.Low,:host ::ng-deep .Periority.Yes{color:var(--green)}:host ::ng-deep tr:nth-child(odd) .history,:host ::ng-deep tr:nth-child(odd) .Finished{background-color:var(--light-gray)}:host ::ng-deep tr:nth-child(2n) .history,:host ::ng-deep tr:nth-child(2n) .Finished{background-color:var(--white)}:host ::ng-deep .Finished{min-width:27px}:host ::ng-deep ds-button.coral:hover svg path{fill:var(--coral)}:host ::ng-deep .controls-tabel .mat-sort-header-container{justify-content:center!important}.dot-status{height:20px;width:20px;border-radius:50%;display:inline-block}.dot-status.red{background-color:var(--red)}.dot-status.green{background-color:var(--green)}.sticky-table{max-height:100vh}.dimCheckbox{background:var(--gray);pointer-events:none}\n"], dependencies: [{ kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2$4.TranslatePipe, name: "translate" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "component", type: MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "directive", type: NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: DatePipe, name: "date" }, { kind: "component", type: InputComponent, selector: "app-input", inputs: ["floatLabel", "className", "iconPrefixName", "iconSuffixName", "emitedChangedValue1", "customErrorMessages"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: 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: "component", type: MatSlideToggle, selector: "mat-slide-toggle", inputs: ["name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "color", "disabled", "disableRipple", "tabIndex", "checked", "hideIcon", "disabledInteractive"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { 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: MatSort, selector: "[matSort]", inputs: ["matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear", "matSortDisabled"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "directive", type: MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "component", type: MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "directive", type: MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: CustomSearchableComponent, selector: "app-custom-searchable", inputs: ["options", "disabled", "displayedLabel", "key", "floatLabel", "className"], outputs: ["selectedValue", "isLengthGreaterThan4"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "directive", type: SkipLocationDirective, selector: "[appSkipLocation]", inputs: ["appSkipLocation"] }, { kind: "component", type: MatPaginator, selector: "mat-paginator", inputs: ["color", "pageIndex", "length", "pageSize", "pageSizeOptions", "hidePageSize", "showFirstLastButtons", "selectConfig", "disabled"], outputs: ["page"], exportAs: ["matPaginator"] }] });
|
|
4984
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: TableComponent, deps: [{ token: i1$1.MatDialog }, { token: i2$4.TranslateService }, { token: i4.FormBuilder }], target: i0.ɵɵFactoryTarget.Component });
|
|
4985
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: TableComponent, isStandalone: true, selector: "app-table", inputs: { columns: "columns", isError: "isError", isLoading: "isLoading", customMessage: "customMessage", columnsConfig: "columnsConfig", loadData: "loadData", actions: "actions", className: "className", totalElements: "totalElements", showPagination: "showPagination", pageIndex: "pageIndex", pageSize: "pageSize", sortDisabled: "sortDisabled", useScroll: "useScroll", hasPaginator: "hasPaginator", currentPage: "currentPage", keyWord: "keyWord", rows: "rows" }, outputs: { serviceRowSelect: "serviceRowSelect", selectPage: "selectPage", rowClicked: "rowClicked", autoCompleteValueSelected: "autoCompleteValueSelected", selectValueSelected: "selectValueSelected", sortChanged: "sortChanged", inputCellChanged: "inputCellChanged", pageScroll: "pageScroll", toggleChanged: "toggleChanged", eventClicked: "eventClicked", pageChange: "pageChange" }, viewQueries: [{ propertyName: "matTableRef", first: true, predicate: ["table"], descendants: true, read: ElementRef }, { propertyName: "tableSort", first: true, predicate: ["tableSort"], descendants: true }], ngImport: i0, template: "<div #table class=\"table-container table-responsive sticky-table\">\r\n @if (!isLoading) {\r\n <ng-container>\r\n @if (dataSource.filteredData?.length! > 0) {\r\n <table #tableSort=\"matSort\" (matSortChange)=\"sortChange($event)\" [dataSource]=\"dataSource\" class=\"primary-table {{ className }}\" mat-table matSort>\r\n @for (column of columns; track $index; let i = $index) {\r\n <ng-container>\r\n <!-- Add a check to ensure 'columnsConfig' and 'columnsConfig[i]' are defined before using them -->\r\n\r\n @if (columnsConfig && columnsConfig[i]) {\r\n <ng-container>\r\n <ng-container [matColumnDef]=\"column\" [stickyEnd]=\"!!columnsConfig[i].stickyEnd!\">\r\n @if (!columnsConfig[i].notSortable) {\r\n <ng-container>\r\n <th *matHeaderCellDef [ngClass]=\"{ 'text-end': columnsConfig[i].type === 'actions' }\" mat-header-cell mat-sort-header>\r\n @if (columnsConfig[i].type !== 'checkbox' || ( this.columnsConfig[i]?.type! == 'actions' && this.columnsConfig[i]?.actions?.length === 0)) {\r\n <ng-container>\r\n @if (!(this.columnsConfig[i].type == 'actions' && this.columnsConfig[i].actions.length === 0)) {\r\n <div class=\"d-flex align-items-center\">\r\n <div class=\"mx-1 fc-{{ columnsConfig[i].fontColor }}\">\r\n {{ columnsConfig[i].label | translate }}\r\n </div>\r\n @if (columnsConfig[i].slaMax) {\r\n <ds-sla\r\n [canvasScale]=\"'40'\"\r\n [innerLineWidth]=\"'3'\"\r\n [maxValue]=\"columnsConfig[i].slaMax\"\r\n [outerLineColor]=\"'limegreen'\"\r\n [outerLineWidth]=\"'3'\"\r\n [value]=\"columnsConfig[i].slaValue\"\r\n class=\"table-header-sla my-1\"\r\n ></ds-sla>\r\n }\r\n </div>\r\n }\r\n </ng-container>\r\n } @if (columnsConfig[i].type == 'checkbox') {\r\n <mat-checkbox class=\"checkbox\"></mat-checkbox>\r\n }\r\n </th>\r\n </ng-container>\r\n } @if (columnsConfig[i].notSortable) {\r\n <ng-container>\r\n <th *matHeaderCellDef [ngClass]=\"{ 'text-end': columnsConfig[i].type === 'actions' }\" mat-header-cell>\r\n <div class=\"d-flex align-items-center\">\r\n <div class=\"mx-1\">\r\n {{ columnsConfig[i].label | translate }}\r\n </div>\r\n @if (columnsConfig[i].slaMax) {\r\n <ds-sla\r\n [canvasScale]=\"'50'\"\r\n [innerLineWidth]=\"'3'\"\r\n [maxValue]=\"columnsConfig[i].slaMax\"\r\n [outerLineColor]=\"'limegreen'\"\r\n [outerLineWidth]=\"'3'\"\r\n [value]=\"columnsConfig[i].slaValue\"\r\n class=\"table-header-sla my-1\"\r\n ></ds-sla>\r\n }\r\n </div>\r\n </th>\r\n </ng-container>\r\n }\r\n\r\n <td *matCellDef=\"let element; let j = index\" mat-cell>\r\n <ng-container [ngSwitch]=\"columnsConfig[i].type\">\r\n <!-- <a target=\"_blank\"-->\r\n <!-- routerLink=\"/inbox\" [queryParams]=\"{ id: element[column] }\"-->\r\n <!-- class=\"fc-black text-decoration-underline fw-medium\" [ngClass]=\"columnsConfig[i].type\" *ngSwitchCase=\"'link'\">-->\r\n <!-- {{ element[column] }}-->\r\n <!-- </a>-->\r\n <span *ngSwitchCase=\"'formId'\" (click)=\"viewForm(element[column])\" [ngClass]=\"columnsConfig[i].type\" class=\"fc-coral cursor-pointer text-decoration-underline fw-medium\">\r\n {{ element[column] }}\r\n </span>\r\n <!-- <span\r\n *ngSwitchCase=\"'link'\"\r\n [ngClass]=\"columnsConfig[i].type\"\r\n class=\"fc-black text-decoration-underline fw-medium\"\r\n >\r\n {{ element[column] }}\r\n </span>-->\r\n\r\n <span *ngSwitchCase=\"'linkWithIcon'\" [appSkipLocation]=\"columnsConfig[i].link\" [ngClass]=\"columnsConfig[i].type\" class=\"fc-black text-decoration-underline fw-medium\">\r\n <ds-icon class=\"fs-20 fc-black\" icon=\" {{ columnsConfig[i].icon }}\"></ds-icon>\r\n <span class=\"fs-13 fc-coral px-1 text-decoration-underline\">{{ element[column] }}</span>\r\n </span>\r\n <span *ngSwitchCase=\"'underLineWithIcon'\" [ngClass]=\"columnsConfig[i].type\" class=\"fc-black text-decoration-underline fw-medium\">\r\n <ds-icon class=\"fs-20 fc-black\" icon=\" {{ columnsConfig[i].icon }}\"></ds-icon>\r\n <span class=\"fs-13 fc-coral px-1 text-decoration-underline\">{{ element[column] }}</span>\r\n </span>\r\n <mat-checkbox *ngSwitchCase=\"'checkbox'\" checked=\"{{ columnsConfig[i].checked }}\" class=\"checkbox\" disabled=\"{{ columnsConfig[i].disabled }}\"> </mat-checkbox>\r\n <span *ngSwitchCase=\"'ServiceDetails'\" [ngClass]=\"columnsConfig[i].type\" class=\"cursor-pointer\">\r\n {{ element[column] }}\r\n </span>\r\n <span *ngSwitchCase=\"'dateOnly'\" [ngClass]=\"columnsConfig[i].type\" class=\"d-inline-flex align-items-center gap-2 text-nowrap\">\r\n <span class=\"sfi sfi-calendar-o fc-coral fs-18\"></span>\r\n {{ element[column] | date : \"MMM d, y\" }}\r\n </span>\r\n <span *ngSwitchCase=\"'Search'\" [ngClass]=\"columnsConfig[i].type\" class=\"d-inline-flex align-items-center\">\r\n <app-input [formControl]=\"ctrl\" [placeholder]=\"'Search for item '\" [showLabel]=\"false\" class=\"\" className=\"no-padding \" prefix=\"sfi-search fs-16\" type=\"text\"> </app-input>\r\n </span>\r\n <span *ngSwitchCase=\"'Number'\" [ngClass]=\"columnsConfig[i].type\" class=\"d-inline-flex align-items-center\">\r\n <app-input [formControl]=\"ctrl\" [placeholder]=\"'number'\" [showLabel]=\"false\" class=\"\" className=\"no-padding\" type=\"text\"> </app-input>\r\n </span>\r\n <span *ngSwitchCase=\"'dateFromTo'\" [ngClass]=\"columnsConfig[i].type\" class=\"d-inline-flex align-items-center\">\r\n <span class=\"sfi sfi-clock fc-coral\"></span>\r\n <span class=\"mx-2\">\r\n {{ element?.date.from }} @if (element?.date.to) {\r\n <ng-container> : {{ element?.date.to }} </ng-container>\r\n }\r\n </span>\r\n </span>\r\n\r\n <span *ngSwitchCase=\"'dateTime'\" [ngClass]=\"columnsConfig[i].type\" class=\"d-inline-flex align-items-center gap-1 flex-wrap\">\r\n <span class=\"sfi sfi-calendar-o fc-dark-gray fs-20\"></span>\r\n {{ element[column] | date : \"MMM d, y, h:mm a\" }}\r\n </span>\r\n\r\n <span *ngSwitchCase=\"'singleTimeOnly'\" [ngClass]=\"columnsConfig[i].type\" class=\"d-inline-flex align-items-center gap-1 flex-wrap\">\r\n {{ element[column] | date : \"h:mm a\" }}\r\n </span>\r\n <!--dir=\"ltr\" and text-left for English text on ar page -->\r\n <span *ngSwitchCase=\"'timeOnly'\" [ngClass]=\"columnsConfig[i].type\" class=\"d-inline-flex align-items-center gap-1 flex-wrap text-nowrap text-left\" dir=\"ltr\">\r\n <!-- -->\r\n {{ mapText(columnsConfig[i].firstVal, element[column]) | date : \"h:mm a\" }} @if (mapText(columnsConfig[i].secondVal, element[column])) {\r\n <ng-container>\r\n - {{ mapText(columnsConfig[i].secondVal, element[column]) | date : \"h:mm a\" }}\r\n </ng-container>\r\n }\r\n </span>\r\n\r\n <span *ngSwitchCase=\"'multipleRows'\" [ngClass]=\"columnsConfig[i].type\" class=\"d-inline-flex align-items-center gap-1 flex-wrap\">\r\n <!-- -->\r\n @if (!element[column].monthlyFineEscalation) {\r\n <div>\r\n {{ element[column].fixedFineValue }} {{ \"global.SAR\" | translate }}\r\n </div>\r\n } @if (element[column].monthlyFineEscalation) {\r\n <div>\r\n <br />\r\n {{ element[column].firstTimeFine }} {{ \"global.SAR\" | translate }} <br />\r\n <br />\r\n {{ element[column].secondTimeFine }} {{ \"global.SAR\" | translate }} <br />\r\n <br />\r\n {{ element[column].thirdTimeFine }} {{ \"global.SAR\" | translate }} <br />\r\n <br />\r\n </div>\r\n }\r\n </span>\r\n\r\n <div *ngSwitchCase=\"'sla'\" [ngClass]=\"columnsConfig[i].type\" class=\"d-inline-flex align-items-center\">\r\n <!-- <app-sla [value]=\"element?.SLA.value\" [maxValue]=\"element?.SLA.max\" [canvasScale]=\"38\" -->\r\n <!-- class=\"font-9 fw-medium\" [outerLineColor]=\"getSlaColor(element?.SLA.value, element?.SLA.max)\">-->\r\n <!-- </app-sla>-->\r\n\r\n <ds-sla\r\n [attr.outerLineColor]=\"\r\n getSlaColor(element?.SLA.value, element?.SLA.max)\r\n \"\r\n [canvasScale]=\"'55'\"\r\n [innerLineWidth]=\"'3'\"\r\n [maxValue]=\"element?.SLA?.max\"\r\n [outerLineWidth]=\"'3'\"\r\n [value]=\"element?.SLA?.value\"\r\n ></ds-sla>\r\n </div>\r\n <div *ngSwitchCase=\"'slaProgress'\">\r\n <!-- <mat-sp-->\r\n\r\n @if (element[column]?.percentage >= 0) {\r\n <ds-sla\r\n [canvasScale]=\"'55'\"\r\n [customValue]=\"element[column]?.percentage + '%'\"\r\n [innerLineWidth]=\"'3'\"\r\n [maxValue]=\"'100'\"\r\n [outerLineColor]=\"\r\n getSlaColor(element[column]?.percentage, 100)\r\n \"\r\n [outerLineWidth]=\"'3'\"\r\n [value]=\"element[column]?.percentage\"\r\n ></ds-sla>\r\n } @else {\r\n <ng-template>Not started</ng-template>\r\n }\r\n </div>\r\n <div *ngSwitchCase=\"'Priority'\" [ngClass]=\"columnsConfig[i].type\" class=\"{{ element[column] }}\">\r\n {{ element[column] }}\r\n </div>\r\n\r\n <div *ngSwitchCase=\"'serviceStatus'\" [ngClass]=\"columnsConfig[i].type\" class=\"{{ element[column] }}\">\r\n <span [ngClass]=\"element[column] == 'FALSE' ? 'green' : 'red'\" class=\"dot-status\"></span>\r\n </div>\r\n\r\n <div *ngSwitchCase=\"'image'\" [ngClass]=\"columnsConfig[i].type\" class=\"img-card table-img\">\r\n <img [src]=\"element?.image\" alt=\"\" onerror=\"this.onerror=null;this.src='assets/images/user.svg';\" />\r\n </div>\r\n\r\n <div *ngSwitchCase=\"'employee'\" [ngClass]=\"columnsConfig[i].type\" class=\"d-flex align-items-center gap-2 text-nowrap\">\r\n <ds-avatar [image]=\"'https://igateapp.stc.com.sa'+element[column]?.['imageUrl']\" size=\"x-small\"> </ds-avatar>\r\n <span>{{ (element[column]?.['name']) }}</span>\r\n </div>\r\n\r\n <div *ngSwitchCase=\"'progress_group'\" [ngClass]=\"columnsConfig[i].type\" class=\"d-flex gap-1\">\r\n <ng-container *ngFor=\"let item of element[column]\">\r\n <div class=\"progress-container default-progress medium radius-0\" matTooltip=\"Team assignment {{ item.value }}%\" matTooltipPosition=\"below\">\r\n <div [style.width.%]=\"item.value\" class=\"progress-bar bg-color-{{ item.color }}\"></div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div *ngSwitchCase=\"'input'\" [ngClass]=\"columnsConfig[i].type\" class=\"\">\r\n <app-input\r\n (input)=\"inputCellChanged.emit({element,column,i})\"\r\n [(ngModel)]=\"element[column]\"\r\n [min]=\"0\"\r\n [placeholder]=\"element[column]\"\r\n class=\"w-100\"\r\n className=\" no-padding w-100\"\r\n type=\"number\"\r\n value=\"{{ element[column] }}\"\r\n >\r\n </app-input>\r\n </div>\r\n <div *ngSwitchCase=\"'autoComplete'\"></div>\r\n <div *ngSwitchCase=\"'select'\" [ngClass]=\"columnsConfig[i].type\" class=\"\">\r\n <app-custom-searchable\r\n (selectedValue)=\"selectValueSelected.emit($event)\"\r\n [isSearchable]=\"columnsConfig[i].config?.isSearchable\"\r\n [key]=\"columnsConfig[i]?.key\"\r\n [displayedLabel]=\"columnsConfig[i]?.displayedLable\"\r\n [options]=\"columnsConfig[i]?.options\"\r\n [postKey]=\"columnsConfig[i]?.postKey\"\r\n [showLabel]=\"false\"\r\n className=\"no-padding w-100\"\r\n >\r\n </app-custom-searchable>\r\n </div>\r\n\r\n <div *ngSwitchCase=\"'status'\" [ngClass]=\"'New' + columnsConfig[i].type\" class=\"d-flex align-items-center gap-2\">\r\n @if (element[column]) {\r\n <ds-status [status]=\"element[column]?.status\" class=\"fs-12\">\r\n {{ element[column]?.title | translate }}\r\n </ds-status>\r\n } @if (element[column]?.reason) {\r\n <span\r\n (click)=\"$event.stopPropagation()\"\r\n [matMenuTriggerFor]=\"reasonMenu\"\r\n [ngClass]=\"columnsConfig[i].type\"\r\n class=\"{{\r\n columnsConfig[i].type\r\n }} fc-red underline cursor-pointer\"\r\n >\r\n Show reason\r\n </span>\r\n }\r\n\r\n <mat-menu #reasonMenu=\"matMenu\" class=\"p-4 text-center\">\r\n <span class=\"fs-14\">\r\n {{ element[column]?.reason }}\r\n </span>\r\n </mat-menu>\r\n </div>\r\n <div *ngSwitchCase=\"'toggle'\" [ngClass]=\"columnsConfig[i].type\">\r\n <mat-slide-toggle (change)=\"toggleValueChange($event, element)\" [checked]=\"element[column] == 1\" [disabled]=\"false\"></mat-slide-toggle>\r\n </div>\r\n\r\n <div *ngSwitchCase=\"'customToggle'\" [ngClass]=\"columnsConfig[i].type\">\r\n <mat-slide-toggle (change)=\"toggleValueChange($event, element)\" [checked]=\"element[column] == 7\" [disabled]=\"element[column] != 1\"></mat-slide-toggle>\r\n </div>\r\n <div *ngSwitchCase=\"'meetingStatus'\" [ngClass]=\"columnsConfig[i].type\" class=\"{{ columnsConfig[i].type }}\">\r\n @if (element[column].label == 'Finished') {\r\n <span class=\" {{ element[column].label }} status \">\r\n {{ element[column].label }}\r\n </span>\r\n } @if (element[column].label != 'Finished') {\r\n <div class=\"d-flex align-items-center gap-2\">\r\n <div class=\"Finished d-flex flex-column align-items-center justify-content-center py-1 fc-black\">\r\n <span class=\"fs-11 fw-medium mb-1\"> {{ element[column].hours }}</span>\r\n <span class=\"fs-10 fw-light\">HRS</span>\r\n </div>\r\n <div class=\"Finished d-flex flex-column align-items-center justify-content-center py-1 fc-black\">\r\n <span class=\"fs-11 fw-medium mb-1\"> {{ element[column].min }}</span>\r\n <span class=\"fs-10 fw-light\">MINS</span>\r\n </div>\r\n <div class=\"Finished d-flex flex-column align-items-center justify-content-center py-1 fc-black\">\r\n <span class=\"fs-11 fw-medium mb-1\"> {{ element[column].sec }}</span>\r\n <span class=\"fs-10 fw-light\">SECS</span>\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n <span\r\n *ngSwitchCase=\"'number'\"\r\n [ngClass]=\"columnsConfig[i].type\"\r\n class=\"{{ columnsConfig[i].type }} {{\r\n element[column] ? 'underline' : ''\r\n }}\"\r\n >\r\n {{ element[column] ? element[column] : 0 }}\r\n </span>\r\n\r\n <span *ngSwitchCase=\"'currency'\" [ngClass]=\"columnsConfig[i].type\" class=\"{{ columnsConfig[i].type }}\">\r\n {{ element[column] ? parseInt(element[column]).toFixed(2) + (columnsConfig[i].currency | translate) : \"-\" }}\r\n </span>\r\n <span *ngSwitchCase=\"'active'\" [ngClass]=\"columnsConfig[i].type\" class=\"{{ columnsConfig[i].type }}\">\r\n <ds-icon [ngClass]=\"element[column] ? 'fc-green' : 'fc-gray'\" icon=\"check-circle-f fs-30\"></ds-icon>\r\n </span>\r\n <div\r\n *ngSwitchCase=\"'sync'\"\r\n [ngClass]=\"columnsConfig[i].type\"\r\n class=\"{{\r\n columnsConfig[i].type\r\n }} d-flex align-items-center gap-2\"\r\n >\r\n <svg fill=\"none\" height=\"19\" viewBox=\"0 0 18 19\" width=\"18\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n d=\"M14.25 13.2604C13.9425 13.2604 13.6875 12.9913 13.6875 12.6667V5.14583C13.6875 4.59958 13.2675 4.15625 12.75 4.15625H8.625C8.3175 4.15625 8.0625 3.88708 8.0625 3.5625C8.0625 3.23792 8.3175 2.96875 8.625 2.96875H12.75C13.89 2.96875 14.8125 3.9425 14.8125 5.14583V12.6667C14.8125 12.9913 14.5575 13.2604 14.25 13.2604Z\"\r\n fill=\"#FF375E\"\r\n />\r\n <path\r\n d=\"M10.5 6.13549C10.3725 6.13549 10.245 6.088 10.14 6.00092L7.88999 4.02175C7.76249 3.91092 7.6875 3.74465 7.6875 3.56257C7.6875 3.38048 7.76249 3.22214 7.88999 3.10339L10.14 1.12422C10.38 0.910471 10.7325 0.950084 10.935 1.20342C11.1375 1.45675 11.1 1.82883 10.86 2.04258L9.12751 3.56257L10.86 5.08255C11.1 5.29631 11.13 5.66839 10.935 5.92172C10.8225 6.06422 10.6575 6.13549 10.5 6.13549Z\"\r\n fill=\"#FF375E\"\r\n />\r\n <path\r\n d=\"M14.25 18.0105C12.6975 18.0105 11.4375 16.6805 11.4375 15.0417C11.4375 13.403 12.6975 12.073 14.25 12.073C15.8025 12.073 17.0625 13.403 17.0625 15.0417C17.0625 16.6805 15.8025 18.0105 14.25 18.0105ZM14.25 13.2605C13.32 13.2605 12.5625 14.0601 12.5625 15.0417C12.5625 16.0234 13.32 16.823 14.25 16.823C15.18 16.823 15.9375 16.0234 15.9375 15.0417C15.9375 14.0601 15.18 13.2605 14.25 13.2605Z\"\r\n fill=\"#FF375E\"\r\n />\r\n <path\r\n d=\"M9.375 16.0312H5.25C4.11 16.0312 3.1875 15.0574 3.1875 13.8541V6.33325C3.1875 6.00867 3.4425 5.7395 3.75 5.7395C4.0575 5.7395 4.3125 6.00867 4.3125 6.33325V13.8541C4.3125 14.4003 4.7325 14.8437 5.25 14.8437H9.375C9.6825 14.8437 9.9375 15.1128 9.9375 15.4374C9.9375 15.762 9.6825 16.0312 9.375 16.0312Z\"\r\n fill=\"#FF375E\"\r\n />\r\n <path\r\n d=\"M7.4997 18.0104C7.3422 18.0104 7.17721 17.9391 7.06471 17.7966C6.86221 17.5433 6.89969 17.1712 7.13969 16.9574L8.87219 15.4375L7.13969 13.9175C6.89969 13.7037 6.86971 13.3316 7.06471 13.0783C7.26721 12.825 7.61971 12.7933 7.85971 12.9991L10.1097 14.9783C10.2372 15.0891 10.3122 15.2554 10.3122 15.4375C10.3122 15.6195 10.2372 15.7779 10.1097 15.8966L7.85971 17.8758C7.75471 17.9629 7.6272 18.0104 7.4997 18.0104Z\"\r\n fill=\"#FF375E\"\r\n />\r\n <path\r\n d=\"M3.75 6.927C2.1975 6.927 0.9375 5.597 0.9375 3.95825C0.9375 2.3195 2.1975 0.989502 3.75 0.989502C5.3025 0.989502 6.5625 2.3195 6.5625 3.95825C6.5625 5.597 5.3025 6.927 3.75 6.927ZM3.75 2.177C2.82 2.177 2.0625 2.97659 2.0625 3.95825C2.0625 4.93992 2.82 5.7395 3.75 5.7395C4.68 5.7395 5.4375 4.93992 5.4375 3.95825C5.4375 2.97659 4.68 2.177 3.75 2.177Z\"\r\n fill=\"#FF375E\"\r\n />\r\n </svg>\r\n {{ element[column] }}\r\n </div>\r\n\r\n <ng-container *ngSwitchCase=\"'clickable'\">\r\n @if (element?.[column]) {\r\n <span\r\n #statusMenuTrigger=\"matMenuTrigger\"\r\n (click)=\"$event.stopPropagation()\"\r\n [matMenuTriggerFor]=\"descMenu\"\r\n [ngClass]=\"columnsConfig[i].type\"\r\n class=\"{{\r\n columnsConfig[i].type\r\n }} fc-coral underline cursor-pointer\"\r\n >\r\n {{ columnsConfig[i].clickableText | translate }}\r\n </span>\r\n }\r\n\r\n <mat-menu #descMenu=\"matMenu\" class=\"p-4 text-center\">\r\n <span class=\"fs-14\">\r\n {{ element[column] }}\r\n </span>\r\n </mat-menu>\r\n </ng-container>\r\n\r\n <span\r\n #statusMenuTrigger=\"matMenuTrigger\"\r\n (click)=\"$event.stopPropagation()\"\r\n *ngSwitchCase=\"'translatedClickable'\"\r\n [matMenuTriggerFor]=\"descMenuTranslated\"\r\n [ngClass]=\"columnsConfig[i].type\"\r\n class=\"{{\r\n columnsConfig[i].type\r\n }} fc-coral underline cursor-pointer\"\r\n >\r\n {{ columnsConfig[i].clickableText | translate }}\r\n <!-- {{ 'global.view' | translate}} -->\r\n </span>\r\n\r\n <mat-menu #descMenuTranslated=\"matMenu\" class=\"p-4 text-center\">\r\n <span class=\"fs-14\">\r\n {{ columnsConfig[i].arKey ? translateService.currentLang == \"ar\" ? mapText(columnsConfig[i].arKey, element[column]) : mapText(columnsConfig[i].enKey, element[column]) : element[column] ?\r\n element[column] : \"-\" }}\r\n </span>\r\n </mat-menu>\r\n\r\n <span\r\n #statusMenuTrigger=\"matMenuTrigger\"\r\n (click)=\"$event.stopPropagation()\"\r\n *ngSwitchCase=\"'conditionalClickable'\"\r\n [matMenuTriggerFor]=\"descConditionalMenu\"\r\n [ngClass]=\"columnsConfig[i].type\"\r\n class=\"{{\r\n columnsConfig[i].type\r\n }} fc-coral underline cursor-pointer\"\r\n >\r\n @if (element[column] && element[column] != 'null') {\r\n <span>{{ columnsConfig[i].clickableText | translate }}</span>\r\n }\r\n <!-- {{ 'global.view' | translate}} -->\r\n </span>\r\n\r\n <mat-menu #descConditionalMenu=\"matMenu\" class=\"p-4 text-center\">\r\n <span class=\"fs-14\">\r\n {{ element[column] }}\r\n </span>\r\n </mat-menu>\r\n\r\n <span (click)=\"$event.stopPropagation()\" *ngSwitchCase=\"'dropdown'\" [matMenuTriggerFor]=\"dropdownMenu\" [ngClass]=\"columnsConfig[i].type\" class=\"{{ columnsConfig[i].type }} cursor-pointer\">\r\n {{ columnsConfig[i].arKey ? translateService.currentLang == \"ar\" ? mapText(columnsConfig[i].arKey, element[column]) : mapText(columnsConfig[i].enKey, element[column]) : element[column] ? element[column] :\r\n \"-\" }}\r\n <!-- <span *ngFor=\"let item of element[column]\">\r\n {{item.id}}\r\n </span> -->\r\n\r\n <ds-icon class=\"fc-black fw-medium\" icon=\"arrow\"></ds-icon>\r\n </span>\r\n\r\n <mat-menu #dropdownMenu=\"matMenu\" class=\"p-4 text-center\">\r\n <ng-container *ngSwitchCase=\"'dropdown'\">\r\n <span class=\"fs-12 fc-black\" mat-menu-item>\r\n <!-- {{translateService.currentLang == 'ar' ? item.groupNameAr : item.groupNameEn}} -->\r\n {{ columnsConfig[i].arKey ? translateService.currentLang == \"ar\" ? mapText(columnsConfig[i].arKey, element[column]) : mapText(columnsConfig[i].enKey, element[column]) : element[column] ?\r\n element[column] : \"-\" }}\r\n </span>\r\n </ng-container>\r\n </mat-menu>\r\n\r\n <span\r\n *ngSwitchCase=\"'formatNumber'\"\r\n [ngClass]=\"columnsConfig[i].type\"\r\n matTooltip=\"{{\r\n element[column] > 1000 ? element[column] : ''\r\n }}\"\r\n >\r\n {{ element[column] }}\r\n </span>\r\n\r\n <div *ngSwitchCase=\"'group'\" [ngClass]=\"columnsConfig[i].type\" class=\"text-nowrap d-flex align-items-center\"></div>\r\n\r\n <div *ngSwitchCase=\"'company'\" [ngClass]=\"columnsConfig[i].type\" class=\"d-flex align-items-center\">\r\n <span class=\"img-card circled-img\">\r\n <img [src]=\"element?.image\" alt=\"\" onerror=\"this.onerror=null;this.src='assets/images/user.svg';\" />\r\n </span>\r\n <span class=\"mx-1\"></span>\r\n <span class=\"full-name\">{{ element[column] }}</span>\r\n </div>\r\n\r\n <span *ngSwitchCase=\"'translated'\" [ngClass]=\"columnsConfig[i].type\" class=\"text-nowrap\">\r\n {{ element[column] }}\r\n </span>\r\n <span *ngSwitchCase=\"'title'\" [ngClass]=\"columnsConfig[i].type\" class=\"text-nowrap\">\r\n {{ element[column]?.title }}\r\n </span>\r\n\r\n <span *ngSwitchCase=\"'maxWidth'\" [ngClass]=\"columnsConfig[i].type\">\r\n {{ element[column]?.title }}\r\n </span>\r\n\r\n <span *ngSwitchCase=\"'progress'\" [ngClass]=\"columnsConfig[i].type\">\r\n <div class=\"Progress\">\r\n <div class=\"progress-container default-progress\">\r\n <div\r\n [style.width.%]=\"\r\n (element[column].consumed! / element[column].total!) *\r\n 100\r\n \"\r\n class=\"progress-bar\"\r\n ></div>\r\n </div>\r\n <div class=\"Progress__footer\">\r\n <div></div>\r\n <div>\r\n <span class=\"fs-12\">\r\n <span>{{ element[column].consumed }}</span>\r\n <span>/</span>\r\n <span class=\"fc-silver\">{{ element[column].total }}</span>\r\n </span>\r\n </div>\r\n </div>\r\n </div>\r\n </span>\r\n\r\n <div *ngSwitchCase=\"'subsidiary'\" [ngClass]=\"columnsConfig[i].type\" class=\"d-flex align-items-center gap-2\">\r\n <img [alt]=\"element[column]?.title\" src=\"assets/subsidiaries/ids/{{ element[column]?.id }}.png\" />\r\n <!-- <span class=\"full-name\">{{element[column]}}</span>-->\r\n </div>\r\n\r\n <div *ngSwitchCase=\"'Service'\" [ngClass]=\"columnsConfig[i].type\" class=\"d-flex align-items-center gap-2\">\r\n <svg fill=\"none\" height=\"35\" viewBox=\"0 0 34 35\" width=\"34\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect fill=\"#FF375E\" fill-opacity=\"0.1\" height=\"33.5\" rx=\"4\" width=\"33.5\" y=\"0.75\" />\r\n <path\r\n d=\"M24.213 17.0338H22.1448L21.4532 15.1884C21.2221 14.5845 20.649 14.1622 19.9761 14.1592H13.5315C12.8586 14.1622 12.2847 14.5838 12.0582 15.1771L12.0544 15.1876L11.3628 17.033H9.29312C9.05532 17.033 8.86328 17.2258 8.86328 17.4629V19.1845C8.86328 19.4223 9.05607 19.6143 9.29312 19.6143H10.2076L9.69896 20.378C9.53242 20.6233 9.4334 20.9263 9.4334 21.2519C9.4334 21.2527 9.4334 21.2527 9.4334 21.2534V26.0702C9.4334 26.308 9.62619 26.5 9.86324 26.5H12.1595C12.3973 26.5 12.5893 26.3072 12.5893 26.0702V24.7791H20.91V26.0702C20.91 26.308 21.1028 26.5 21.3399 26.5H23.6361C23.8739 26.5 24.066 26.3072 24.066 26.0702V21.2519C24.066 21.2512 24.066 21.2512 24.066 21.2504C24.066 20.9248 23.9669 20.6218 23.7974 20.3705L23.8011 20.3757L23.2925 19.6121H24.207C24.4448 19.6121 24.6368 19.4193 24.6368 19.1822V17.4606C24.6361 17.2258 24.4478 17.036 24.2145 17.0315L24.213 17.0338ZM12.8654 15.4915C12.9711 15.2176 13.2314 15.0271 13.5368 15.0264H19.9798C20.2852 15.0271 20.5455 15.2184 20.649 15.487L20.6505 15.4922L21.8747 18.7569H11.6359L12.8654 15.4915ZM23.2138 23.9202H10.2983V21.2542C10.2983 21.2534 10.2983 21.2534 10.2983 21.2527C10.2983 21.1049 10.3433 20.9676 10.4199 20.8536L10.4184 20.8558L11.245 19.6151H22.2618L23.0885 20.8558C23.1635 20.9668 23.2085 21.1049 23.2085 21.2519C23.2085 21.2527 23.2085 21.2527 23.2085 21.2534L23.2138 23.9202ZM9.72896 17.895H11.0357L10.7132 18.7561H9.72071L9.72896 17.895ZM11.7379 25.6411H10.2983V24.7799H11.7334L11.7379 25.6411ZM23.2153 25.6411H21.775V24.7799H23.21L23.2153 25.6411ZM23.7869 18.7546H22.7899L22.4674 17.8935H23.7831L23.7869 18.7546ZM12.1632 20.4762C11.2915 20.4762 10.5856 21.1829 10.5856 22.0538C10.5856 22.9248 11.2923 23.6314 12.1632 23.6314C13.0349 23.6314 13.7408 22.9248 13.7408 22.0538C13.7408 21.1821 13.0342 20.4762 12.1632 20.4762V20.4762ZM12.1632 22.7725C11.7671 22.7725 11.4461 22.4514 11.4461 22.0553C11.4461 21.6592 11.7671 21.3382 12.1632 21.3382C12.5593 21.3382 12.8804 21.6592 12.8804 22.0553C12.8804 22.4514 12.5593 22.7725 12.1632 22.7725V22.7725ZM21.3444 20.4762C20.4727 20.4762 19.7668 21.1829 19.7668 22.0538C19.7668 22.9248 20.4735 23.6314 21.3444 23.6314C22.2161 23.6314 22.922 22.9248 22.922 22.0538C22.922 21.1821 22.2153 20.4762 21.3444 20.4762ZM21.3444 22.7725C20.9483 22.7725 20.6272 22.4514 20.6272 22.0553C20.6272 21.6592 20.9483 21.3382 21.3444 21.3382C21.7405 21.3382 22.0615 21.6592 22.0615 22.0553C22.0615 22.4514 21.7405 22.7725 21.3444 22.7725ZM19.0489 21.0509H14.4579C14.2201 21.0509 14.0274 21.2437 14.0274 21.4815C14.0274 21.7193 14.2201 21.912 14.4579 21.912H19.0489C19.2867 21.912 19.4795 21.7193 19.4795 21.4815C19.4795 21.2437 19.2867 21.0509 19.0489 21.0509ZM19.0489 22.1986H14.4579C14.2201 22.1986 14.0274 22.3914 14.0274 22.6292C14.0274 22.867 14.2201 23.0598 14.4579 23.0598H19.0489C19.2867 23.0598 19.4795 22.867 19.4795 22.6292C19.4795 22.3914 19.2867 22.1986 19.0489 22.1986ZM15.2321 12.5703C15.1541 12.6484 15.1061 12.7556 15.1061 12.8742C15.1061 13.112 15.2989 13.304 15.5359 13.304C15.6544 13.304 15.7625 13.256 15.8397 13.178C16.0738 12.9439 16.3971 12.7991 16.7542 12.7991C17.1113 12.7991 17.4346 12.9439 17.6686 13.178C17.7466 13.256 17.8539 13.304 17.9724 13.304C18.2102 13.304 18.4023 13.1112 18.4023 12.8742C18.4023 12.7556 18.3543 12.6476 18.2762 12.5703C17.8862 12.181 17.3483 11.9395 16.7534 11.9395C16.1586 11.9395 15.6199 12.1803 15.2306 12.5703H15.2321ZM19.1877 12.0865C19.1884 12.0865 19.1884 12.0865 19.1892 12.0865C19.427 12.0865 19.619 11.8937 19.619 11.6567C19.619 11.5374 19.5703 11.4294 19.4915 11.3513C18.7909 10.6507 17.8224 10.2171 16.7527 10.2171C15.683 10.2171 14.7145 10.6507 14.0139 11.3513C13.9358 11.4294 13.8878 11.5366 13.8878 11.6552C13.8878 11.893 14.0806 12.085 14.3177 12.085C14.4362 12.085 14.5442 12.037 14.6215 11.959C15.1668 11.4136 15.92 11.0768 16.7519 11.0768C17.5838 11.0768 18.337 11.4136 18.8824 11.959C18.9604 12.037 19.0677 12.0857 19.1869 12.0857H19.1877V12.0865ZM13.4062 10.743C14.2637 9.88704 15.4467 9.35818 16.7542 9.35818C18.0617 9.35818 19.2447 9.88704 20.1021 10.743C20.1801 10.821 20.2874 10.869 20.4059 10.869C20.6437 10.869 20.8358 10.6762 20.8358 10.4392C20.8358 10.3206 20.7878 10.2126 20.7098 10.1353C19.6963 9.12488 18.298 8.5 16.7534 8.5C15.2089 8.5 13.8106 9.12488 12.7971 10.1353C12.7191 10.2134 12.6711 10.3206 12.6711 10.4392C12.6711 10.677 12.8639 10.869 13.1009 10.869C13.2194 10.869 13.3275 10.821 13.4047 10.743H13.4062Z\"\r\n fill=\"#FF375E\"\r\n />\r\n </svg>\r\n\r\n <span class=\"fs-12 fw-normal fc-black\">{{ element?.Service.name }}</span>\r\n </div>\r\n <div *ngSwitchCase=\"'Color'\" class=\"d-flex align-items-center gap-2\">\r\n <span\r\n [ngClass]=\"columnsConfig[i].type\"\r\n [style.background]=\"\r\n element[column]?.colorCode\r\n ? element[column]?.colorCode\r\n : element[column]\r\n \"\r\n ></span>\r\n {{ element[column].title }}\r\n </div>\r\n <div\r\n *ngSwitchCase=\"'colorBg'\"\r\n [style.background]=\"\r\n 'rgba(var(--rgb-' + element[column]?.colorName + '), 0.1)'\r\n \"\r\n class=\"d-flex align-items-center gap-2 Colorbg p-2\"\r\n >\r\n <span class=\"bc-{{ element[column]?.colorName }}\"></span>\r\n {{ element[column].title }}\r\n </div>\r\n <div *ngSwitchCase=\"'assigned'\" [ngClass]=\"columnsConfig[i].type\" class=\"delegate d-flex align-items-center\">\r\n <div class=\"img-card x-small circled-img\">\r\n <img [src]=\"element?.AssignedTo.image\" alt=\"\" onerror=\"this.onerror=null;this.src='assets/images/user.svg';\" />\r\n </div>\r\n <span class=\"mx-1\"></span>\r\n <span class=\"fs-12 fc-black\">{{ element?.AssignedTo.name }}</span>\r\n <!--\r\n <span class=\"sfi sfi-close fc-coral\"></span>\r\n -->\r\n </div>\r\n\r\n <span *ngSwitchCase=\"'coloredText'\" [style.color]=\"element[column]?.['color']\">{{ element[column]?.['title'] }}</span>\r\n <div *ngSwitchCase=\"'survey'\" [style.color]=\"element[column]?.['color']\" class=\"d-flex align-items-center gap-1 text-nowrap\">\r\n <span class=\"fs-20 sfi sfi-emoji-{{(element[column]?.['title']['en'].toLowerCase()) }}\"></span>\r\n {{ element[column]?.['title'] }}\r\n </div>\r\n\r\n <div *ngSwitchCase=\"'Satisfaction'\" [ngClass]=\"columnsConfig[i].type\" class=\"delegate d-flex gap-2 align-items-center\">\r\n <!--\r\n <ds-icon icon=\"star-f\" class=\"fc-dark-gray\"></ds-icon>\r\n -->\r\n\r\n <span class=\"fs-12 fc-black\">{{ element[column].percentage }}%</span>\r\n <ds-status class=\"auto-status\" size=\"small\" status=\"{{ element[column].status }}\">\r\n <span class=\"fs-10\">\r\n {{ element[column].percentageTrend }}%\r\n </span>\r\n @if (element[column].trendStatus == 'up') {\r\n <ds-icon class=\"fs-13 mx-1 growthIcon\" icon=\"up-growth\"> </ds-icon>\r\n } @if (element[column].trendStatus != 'up') {\r\n <ds-icon class=\"fs-13 mx-1 downIcon\" icon=\"down-growth\"> </ds-icon>\r\n }\r\n </ds-status>\r\n </div>\r\n\r\n <ng-container *ngSwitchCase=\"'actions'\">\r\n <div class=\"d-flex justify-content-start gap-2\">\r\n <ng-container *ngIf=\"columnsConfig[i]?.actions?.length <= 6\">\r\n <ng-container *ngFor=\"let action of columnsConfig[i]?.actions\">\r\n <ds-button (click)=\"$event.stopPropagation()\" *ngIf=\"action.viewMode === Actions.ALLOCATE\" shape=\"outline\" size=\"small\">\r\n <span class=\"fs-12 fc-{{ action?.actionFontColor }}\">\r\n {{ action?.actionName | translate }}\r\n </span>\r\n </ds-button>\r\n\r\n <ds-button\r\n (click)=\"\r\n $event.stopPropagation(); action?.onClick(element)\r\n \"\r\n *ngIf=\"action === Actions.ALLOCATE\"\r\n icon\r\n size=\"small\"\r\n >\r\n <ds-icon class=\"fs-15\" icon=\"pen\"></ds-icon>\r\n </ds-button>\r\n <ng-container\r\n *ngIf=\"\r\n action.viewMode != Actions.VIEW ||\r\n action.viewMode != Actions.COPY\r\n \"\r\n >\r\n <ds-button\r\n (click)=\"\r\n $event.stopPropagation(); action?.onClick(element)\r\n \"\r\n *ngIf=\"\r\n action?.action === Actions.VIEW &&\r\n !action?.isHidden\r\n \"\r\n icon\r\n size=\"small\"\r\n >\r\n <ds-icon class=\"fs-15\" icon=\"eye\"></ds-icon>\r\n </ds-button>\r\n <ds-button (click)=\"$event.stopPropagation(); action?.onClick(element)\"\r\n *ngIf=\"action?.action === Actions.CLOSE && !action?.isHidden\"\r\n icon size=\"small\">\r\n <ds-icon class=\"fs-15 fc-coral\" icon=\"close\"></ds-icon>\r\n </ds-button>\r\n\r\n <ds-button\r\n (click)=\"\r\n $event.stopPropagation(); action?.onClick(element)\r\n \"\r\n *ngIf=\"\r\n action?.action === Actions.COPY &&\r\n !action?.isHidden\r\n \"\r\n icon\r\n size=\"small\"\r\n >\r\n <ds-icon class=\"fs-15\" icon=\"files-copy\"></ds-icon>\r\n </ds-button>\r\n <!-- @if(element.hasOwnProperty('canUpdate')){\r\n <ds-button (click)=\"$event.stopPropagation();action?.onClick(element)\" icon size=\"small\"\r\n *ngIf=\"action?.action === 'edit' && !action?.isHidden && element.canUpdate == true\">\r\n <ds-icon icon=\"pen\" class=\"fs-15\"></ds-icon>\r\n </ds-button>\r\n }@else { -->\r\n\r\n <ds-button\r\n (click)=\"\r\n $event.stopPropagation(); action?.onClick(element)\"\r\n *ngIf=\"\r\n action?.action === Actions.EDIT &&\r\n ![4, 7].includes(element?.contractStatus?.id)\"\r\n icon\r\n size=\"small\"\r\n >\r\n <ds-icon class=\"fs-15\" icon=\"pen\"></ds-icon>\r\n </ds-button>\r\n <!-- } -->\r\n\r\n <ds-button\r\n (click)=\"\r\n $event.stopPropagation(); action?.onClick(element)\r\n \"\r\n *ngIf=\"\r\n action?.action === Actions.DELETE &&\r\n !action?.isHidden &&\r\n ![4, 7].includes(element?.contractStatus?.id)\r\n \"\r\n icon\r\n size=\"small\"\r\n >\r\n <ds-icon class=\"fc-coral fs-15\" icon=\"trash\"></ds-icon>\r\n </ds-button>\r\n\r\n <ds-button\r\n (click)=\"\r\n $event.stopPropagation(); action?.onClick(element)\r\n \"\r\n *ngIf=\"\r\n action?.action === Actions.DELETEPENDING &&\r\n !action?.isHidden &&\r\n element?.contractStatus?.id == 1\r\n \"\r\n icon\r\n size=\"small\"\r\n >\r\n <ds-icon class=\"fc-coral fs-15\" icon=\"trash\"></ds-icon>\r\n </ds-button>\r\n\r\n <ds-button\r\n (click)=\"\r\n $event.stopPropagation(); action?.onClick(element)\r\n \"\r\n *ngIf=\"action?.action === Actions.CHART\"\r\n color=\"transparent\"\r\n size=\"small\"\r\n >\r\n <ds-icon class=\"fc-coral fs-15\" icon=\"chart-o\"></ds-icon>\r\n </ds-button>\r\n\r\n @if (element.hasOwnProperty('canTakeAction')) {\r\n <ds-button\r\n (click)=\"\r\n $event.stopPropagation(); action?.onClick(element)\r\n \"\r\n size=\"small\"\r\n *ngIf=\"\r\n action?.action === Actions.APPROVE &&\r\n element.canTakeAction == true\r\n \"\r\n >\r\n <span class=\"fs-12\">\r\n {{ \"global.approve\" | translate }}\r\n </span>\r\n </ds-button>\r\n <ds-button\r\n shape=\"outline\"\r\n color=\"dark-gray\"\r\n (click)=\"\r\n $event.stopPropagation(); action?.onClick(element)\r\n \"\r\n size=\"small\"\r\n *ngIf=\"\r\n action?.action === Actions.REJECT &&\r\n element.canTakeAction == true\r\n \"\r\n shape=\"outline\"\r\n >\r\n <span class=\"fs-12\">\r\n {{ \"global.reject\" | translate }}\r\n </span>\r\n </ds-button>\r\n } @else {\r\n <ds-button\r\n (click)=\"\r\n $event.stopPropagation(); action?.onClick(element)\r\n \"\r\n size=\"small\"\r\n *ngIf=\"action?.action === Actions.APPROVE\"\r\n >\r\n <span class=\"fs-12\">\r\n {{ \"global.approve\" | translate }}\r\n </span>\r\n </ds-button>\r\n <ds-button\r\n shape=\"outline\"\r\n color=\"dark-gray\"\r\n (click)=\"\r\n $event.stopPropagation(); action?.onClick(element)\r\n \"\r\n size=\"small\"\r\n *ngIf=\"action?.action === Actions.REJECT\"\r\n shape=\"outline\"\r\n >\r\n <span class=\"fs-12\">\r\n {{ \"global.reject\" | translate }}\r\n </span>\r\n </ds-button>\r\n }\r\n\r\n <ds-button *ngIf=\"action?.action === Actions.DETAILS\" shape=\"text\" size=\"small\">\r\n <span class=\"fs-12 underline\"> View Details </span>\r\n </ds-button>\r\n <ds-button\r\n (click)=\"\r\n $event.stopPropagation(); action?.onClick(element)\r\n \"\r\n *ngIf=\"\r\n action?.action === Actions.START &&\r\n element?.isFinalize\r\n \"\r\n size=\"small\"\r\n >\r\n <span class=\"fs-12\">\r\n {{ action?.actionName | translate }}\r\n </span>\r\n <ds-icon class=\"fs-16\" icon=\"media-play\" slot=\"prefix\"></ds-icon>\r\n </ds-button>\r\n <ds-button\r\n (click)=\"\r\n $event.stopPropagation(); action?.onClick(element)\r\n \"\r\n *ngIf=\"action?.action === Actions.PREPARE\"\r\n color=\"light-gray\"\r\n size=\"small\"\r\n >\r\n <span class=\"fs-12 fc-black\">\r\n {{ action?.actionName | translate }}\r\n </span>\r\n <ds-icon class=\"fs-12 fc-black\" icon=\"settings\" slot=\"prefix\"></ds-icon>\r\n </ds-button>\r\n\r\n <ds-button\r\n (click)=\"\r\n $event.stopPropagation(); action?.onClick(element)\r\n \"\r\n *ngIf=\"\r\n action?.action === Actions.START &&\r\n element?.isFinalize\r\n \"\r\n size=\"small\"\r\n >\r\n <span class=\"fs-12\">\r\n {{ action?.actionName | translate }}\r\n </span>\r\n <ds-icon class=\"fs-16\" icon=\"media-play\" slot=\"prefix\"></ds-icon>\r\n </ds-button>\r\n\r\n <!-- <ds-button [color]=\"action?.actionColor\" size=\"small\"\r\n *ngIf=\"action?.action === 'customAction'\"\r\n (click)=\"$event.stopPropagation();action?.onClick(element)\" shape=\"{{action?.actionShape}}\" [class]=\"action?.actionColor\"\r\n ></ds-button> -->\r\n\r\n <ds-button\r\n (click)=\"\r\n $event.stopPropagation(); action?.onClick(element)\r\n \"\r\n *ngIf=\"action?.action === Actions.CUSTOMACTION\"\r\n [class]=\"action?.actionColor\"\r\n [color]=\"action?.actionColor\"\r\n shape=\"{{ action?.actionShape }}\"\r\n size=\"small\"\r\n >\r\n <span class=\"fs-12 fc-{{ action?.actionFontColor }}\">\r\n {{ action?.actionName | translate }}\r\n </span>\r\n </ds-button>\r\n <ds-button\r\n (click)=\"\r\n $event.stopPropagation(); action?.onClick(element)\r\n \"\r\n *ngIf=\"\r\n action?.action === Actions.CUSTOMACTIONMANAGE &&\r\n (element.contractStatus.id == 7 ||\r\n element.contractStatus.id == 1)\r\n \"\r\n [class]=\"action?.actionColor\"\r\n [color]=\"action?.actionColor\"\r\n shape=\"{{ action?.actionShape }}\"\r\n size=\"small\"\r\n >\r\n <span class=\"fs-12 fc-{{ action?.actionFontColor }}\">\r\n {{ action?.actionName | translate }}\r\n </span>\r\n </ds-button>\r\n\r\n <ds-button\r\n (click)=\"\r\n $event.stopPropagation(); action?.onClick(element)\r\n \"\r\n *ngIf=\"\r\n action?.action === Actions.CUSTOMACTIONEXTEND &&\r\n element.contractStatus.id == 7\r\n \"\r\n [class]=\"action?.actionColor\"\r\n [color]=\"action?.actionColor\"\r\n shape=\"{{ action?.actionShape }}\"\r\n size=\"small\"\r\n >\r\n <span class=\"fs-12 fc-{{ action?.actionFontColor }}\">\r\n {{ action?.actionName | translate }}\r\n </span>\r\n </ds-button>\r\n <ds-button\r\n (click)=\"\r\n $event.stopPropagation(); action?.onClick(element)\r\n \"\r\n *ngIf=\"\r\n action?.action === Actions.CUSTOMACTIONDETAILS\r\n \"\r\n [class]=\"action?.actionColor\"\r\n [color]=\"action?.actionColor\"\r\n shape=\"{{ action?.actionShape }}\"\r\n size=\"small\"\r\n >\r\n <span class=\"fs-12 fc-{{ action?.actionFontColor }}\">\r\n {{ action?.actionName | translate }}\r\n </span>\r\n </ds-button>\r\n <ds-status *ngIf=\"action?.action === Actions.STATUS\" [status]=\"action?.Status.status\" class=\"fs-12 statusAction w-100\">\r\n <span class=\"fc-black\">\r\n {{ action?.Status.title | translate }}\r\n </span>\r\n </ds-status>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"columnsConfig[i]?.actions?.length > 6\">\r\n <ds-button\r\n #statusMenuTrigger=\"matMenuTrigger\"\r\n (click)=\"$event.stopPropagation()\"\r\n *ngIf=\"columnsConfig[i]?.actions?.length > 1\"\r\n [matMenuTriggerFor]=\"statusMenu\"\r\n class=\"dots\"\r\n shape=\"text\"\r\n size=\"small\"\r\n >\r\n <ds-icon class=\"fs-20 fc-dark-gray\" icon=\"dots\"></ds-icon>\r\n </ds-button>\r\n\r\n <mat-menu #statusMenu=\"matMenu\">\r\n <button (click)=\"action?.onClick(element)\" *ngFor=\"let action of columnsConfig[i]?.actions\" mat-menu-item>\r\n <span class=\"fs-12 fc-black\">{{ action?.actionName | translate }} </span>\r\n </button>\r\n </mat-menu>\r\n </ng-container>\r\n </div>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'specs'\">\r\n @if (element?.[column]) {\r\n <span\r\n #statusMenuTrigger=\"matMenuTrigger\"\r\n (click)=\"$event.stopPropagation()\"\r\n [matMenuTriggerFor]=\"specsMenu\"\r\n [ngClass]=\"columnsConfig[i].type\"\r\n class=\"{{\r\n columnsConfig[i].type\r\n }} fc-coral underline cursor-pointer\"\r\n >\r\n {{ columnsConfig[i].clickableText | translate }}\r\n </span>\r\n }\r\n\r\n <mat-menu #specsMenu=\"matMenu\" class=\"p-4 text-center\">\r\n <span class=\"fs-14\">\r\n {{ element[column] }}\r\n </span>\r\n </mat-menu>\r\n </ng-container>\r\n\r\n <!--<div\r\n *ngSwitchCase=\"'specs'\" [ngClass]=\"columnsConfig[i].type\"\r\n class=\"d-flex gap-1\">\r\n {{ element[column] | json }}\r\n <ng-container *ngFor=\"let item of element[column]\">\r\n\r\n <div\r\n class=\"progress-container default-progress medium radius-0 \"\r\n matTooltip=\"Team assignment {{item.value}}%\" matTooltipPosition=\"below\">\r\n <div\r\n [style.width.%]=\"item.value\"\r\n class=\"progress-bar bg-color-{{item.color}}\"></div>\r\n </div>\r\n </ng-container>\r\n\r\n </div>-->\r\n\r\n <span\r\n *ngSwitchDefault\r\n [ngClass]=\"columnsConfig[i].type\"\r\n class=\"text-nowrap\"\r\n matTooltip=\" {{\r\n columnsConfig[i].arKey\r\n ? translateService.currentLang == 'ar'\r\n ? mapText(columnsConfig[i].arKey, element[column])\r\n : mapText(columnsConfig[i].enKey, element[column])\r\n : element[column]\r\n ? element[column]\r\n : '-'\r\n }}\"\r\n matTooltipPosition=\"below\"\r\n >\r\n {{ columnsConfig[i].arKey ? translateService.currentLang == \"ar\" ? mapText(columnsConfig[i].arKey, element[column]) : mapText(columnsConfig[i].enKey, element[column]) : element[column] ? element[column] :\r\n \"-\" }}\r\n </span>\r\n </ng-container>\r\n </td>\r\n </ng-container>\r\n </ng-container>\r\n }\r\n </ng-container>\r\n }\r\n\r\n <tr *matHeaderRowDef=\"columns; sticky: true\" mat-header-row></tr>\r\n <tr (click)=\"clickRow(row)\" *matRowDef=\"let row; columns: columns\" [ngClass]=\"{ 'selected-row': row?.fastTrackSeen === false }\" mat-row role=\"button\"></tr>\r\n </table>\r\n }\r\n </ng-container>\r\n } @if (isLoading) {\r\n <ds-loading-table [cols]=\"columns.length\" [rows]=\"5\"></ds-loading-table>\r\n } @if (!isLoading && dataSource.filteredData?.length == 0) {\r\n <ds-message [label]=\" customMessage?? 'NoData' | translate\" type=\"emptyList\"></ds-message>\r\n }\r\n</div>\r\n@if (dataSource.filteredData?.length && hasPaginator) {\r\n<mat-paginator #paginator (page)=\"pageChanged($event)\" [length]=\"totalElements\" [pageIndex]=\"currentPage\" [pageSizeOptions]=\"[5, 10, 15, 20, 100]\" [pageSize]=\"pageSize\" aria-label=\"Select page\" showFirstLastButtons> </mat-paginator>\r\n}\r\n", styles: [":host ::ng-deep .table-responsive table{--th-height: 32px;--th-bg: var(--purple);--th-fc: var(--white);--td-height: 75px;--td-radius: 0;--border-spacing: 0;--border-collapse: collapse;--tr-even-bc: var(--white);--tr-odd-bc: var(--white);--tr-border: 1px solid var(--light-gray);--th-border: none;--cell-pading: 0 24px;--th-fs: 11px}:host ::ng-deep .table-responsive table tr.selected-row,:host ::ng-deep .table-responsive table tr.selected-row:hover{background-color:#ecfeff;border-inline-start:3px solid var(--sea-light)}:host ::ng-deep .table-responsive table td.mat-mdc-cell.mat-mdc-table-sticky{box-shadow:-10px 0 10px #00000012}:host ::ng-deep .table-responsive table mat-form-field,:host ::ng-deep .table-responsive table .e-control,:host ::ng-deep .table-responsive table .mdc-form-field{--input-height: 35px}:host ::ng-deep .Color{width:13px;height:13px;border-radius:50%}:host ::ng-deep .Colorbg{width:fit-content;min-width:102px}:host ::ng-deep .Colorbg span{width:9px;height:9px;border-radius:50%}:host ::ng-deep span.number{color:var(--coral)}:host ::ng-deep .subsidiary img{height:22px;max-width:initial}:host ::ng-deep .sla svg{width:37px}:host ::ng-deep tr th{top:-1px!important}:host ::ng-deep ds-status.statusAction::part(base){min-height:35px;--status-width: 100%}:host ::ng-deep .dropdown{border-radius:3px;background:var(--Grays-Off-white, #f3f3f1);display:flex;height:35px;padding:10px;align-items:center;gap:5px;justify-content:center;width:fit-content}:host ::ng-deep .dropdown ds-icon span{font-weight:700}:host ::ng-deep ds-status::part(base){min-height:23px}:host ::ng-deep .Category span{border-radius:3px;width:97px;height:23px;display:flex;align-items:center;justify-content:center}:host ::ng-deep .mat-checkbox .mat-checkbox-ripple{left:calc(50% - 17px);top:calc(50% - 17px);height:30px;width:30px}:host ::ng-deep .mat-checkbox .mat-checkbox-layout .mat-checkbox-inner-container .mat-checkbox-frame{width:20px;height:20px;border-width:1px;border-style:solid;border-color:#909a9f4d}:host ::ng-deep .mat-checkbox-checked .mat-checkbox-checkmark{width:20px}:host ::ng-deep .idea a:hover{text-decoration:underline;color:var(--coral)}.paginator{width:800px}.table-container{max-height:400px;overflow:auto;scroll-behavior:smooth;transition:scroll-behavior .5s ease-in-out}@media (max-width: 768px){.table-container{max-height:65vh;height:65vh}}[dir=rtl] .table-container--btn.reRequest{transform:scaleX(-1)}@media (min-width: 1200px){.table-container--name,.table-container--date{max-width:120px}}@media (min-width: 1200px){[dir=rtl] .table-container--name{max-width:initial}}.table-container--item{display:flex;align-items:center;gap:1rem;min-height:105px;overflow:hidden;position:relative;cursor:pointer}@media (min-width: 991px){.table-container--item h4{max-width:calc(100% - 200px);display:inline-block}}.table-container--item:not(:last-child){margin-bottom:.75rem}.table-container--item ds-status::part(base){--status-width: 60px}.table-container--info span{position:relative;display:flex;align-items:center;gap:.5rem}.table-container--info span:not(:first-of-type):before{content:\"\";min-width:3px;width:3px;height:3px;border-radius:50%;background-color:var(--black)}@media (min-width: 991px){.table-container--status{position:absolute;top:1rem;right:0}}:host ::ng-deep .max-width-150{max-width:150px}:host ::ng-deep .text-align-custom{unicode-bidi:plaintext}:host ::ng-deep .table-responsive table{--th-height: var(--default-size-sm);--th-bg: var(--purple);--th-fc: var(--white);--td-height: 48px;--td-radius: 0;--border-spacing: 0;--border-collapse: collapse;--tr-even-bc: var(--off-white);--tr-odd-bc: var(--white)}:host ::ng-deep .ServiceDetails{display:inline-block;max-width:230px;white-space:normal}:host ::ng-deep .progress_group{width:100px}:host ::ng-deep .progress_group .progress-container.default-progress{min-width:25px;background-color:#cdd0d1}:host ::ng-deep .sla svg{width:36px}:host ::ng-deep .sla text{font-size:10px}:host ::ng-deep .Periority.High{color:var(--red)}:host ::ng-deep .Periority.Medium{color:var(--orange)}:host ::ng-deep .Periority.Low,:host ::ng-deep .Periority.Yes{color:var(--green)}:host ::ng-deep tr:nth-child(odd) .history,:host ::ng-deep tr:nth-child(odd) .Finished{background-color:var(--light-gray)}:host ::ng-deep tr:nth-child(2n) .history,:host ::ng-deep tr:nth-child(2n) .Finished{background-color:var(--white)}:host ::ng-deep .Finished{min-width:27px}:host ::ng-deep ds-button.coral:hover svg path{fill:var(--coral)}:host ::ng-deep .controls-tabel .mat-sort-header-container{justify-content:center!important}.dot-status{height:20px;width:20px;border-radius:50%;display:inline-block}.dot-status.red{background-color:var(--red)}.dot-status.green{background-color:var(--green)}.sticky-table{max-height:100vh}.dimCheckbox{background:var(--gray);pointer-events:none}\n"], dependencies: [{ kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2$4.TranslatePipe, name: "translate" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "component", type: MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "directive", type: NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: DatePipe, name: "date" }, { kind: "component", type: InputComponent, selector: "app-input", inputs: ["floatLabel", "className", "iconPrefixName", "iconSuffixName", "emitedChangedValue1", "customErrorMessages"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: 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: "component", type: MatSlideToggle, selector: "mat-slide-toggle", inputs: ["name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "color", "disabled", "disableRipple", "tabIndex", "checked", "hideIcon", "disabledInteractive"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { 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: MatSort, selector: "[matSort]", inputs: ["matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear", "matSortDisabled"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "directive", type: MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "component", type: MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "directive", type: MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: CustomSearchableComponent, selector: "app-custom-searchable", inputs: ["options", "disabled", "displayedLabel", "key", "floatLabel", "className"], outputs: ["selectedValue", "isLengthGreaterThan4"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "directive", type: SkipLocationDirective, selector: "[appSkipLocation]", inputs: ["appSkipLocation"] }, { kind: "component", type: MatPaginator, selector: "mat-paginator", inputs: ["color", "pageIndex", "length", "pageSize", "pageSizeOptions", "hidePageSize", "showFirstLastButtons", "selectConfig", "disabled"], outputs: ["page"], exportAs: ["matPaginator"] }] });
|
|
4989
4986
|
}
|
|
4990
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
4987
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: TableComponent, decorators: [{
|
|
4991
4988
|
type: Component,
|
|
4992
4989
|
args: [{ selector: 'app-table', standalone: true, imports: [NgFor, TranslateModule, NgIf, matModules, FormsModule, NgSwitchDefault, SkipLocationDirective, MatPaginator], schemas: [CUSTOM_ELEMENTS_SCHEMA], template: "<div #table class=\"table-container table-responsive sticky-table\">\r\n @if (!isLoading) {\r\n <ng-container>\r\n @if (dataSource.filteredData?.length! > 0) {\r\n <table #tableSort=\"matSort\" (matSortChange)=\"sortChange($event)\" [dataSource]=\"dataSource\" class=\"primary-table {{ className }}\" mat-table matSort>\r\n @for (column of columns; track $index; let i = $index) {\r\n <ng-container>\r\n <!-- Add a check to ensure 'columnsConfig' and 'columnsConfig[i]' are defined before using them -->\r\n\r\n @if (columnsConfig && columnsConfig[i]) {\r\n <ng-container>\r\n <ng-container [matColumnDef]=\"column\" [stickyEnd]=\"!!columnsConfig[i].stickyEnd!\">\r\n @if (!columnsConfig[i].notSortable) {\r\n <ng-container>\r\n <th *matHeaderCellDef [ngClass]=\"{ 'text-end': columnsConfig[i].type === 'actions' }\" mat-header-cell mat-sort-header>\r\n @if (columnsConfig[i].type !== 'checkbox' || ( this.columnsConfig[i]?.type! == 'actions' && this.columnsConfig[i]?.actions?.length === 0)) {\r\n <ng-container>\r\n @if (!(this.columnsConfig[i].type == 'actions' && this.columnsConfig[i].actions.length === 0)) {\r\n <div class=\"d-flex align-items-center\">\r\n <div class=\"mx-1 fc-{{ columnsConfig[i].fontColor }}\">\r\n {{ columnsConfig[i].label | translate }}\r\n </div>\r\n @if (columnsConfig[i].slaMax) {\r\n <ds-sla\r\n [canvasScale]=\"'40'\"\r\n [innerLineWidth]=\"'3'\"\r\n [maxValue]=\"columnsConfig[i].slaMax\"\r\n [outerLineColor]=\"'limegreen'\"\r\n [outerLineWidth]=\"'3'\"\r\n [value]=\"columnsConfig[i].slaValue\"\r\n class=\"table-header-sla my-1\"\r\n ></ds-sla>\r\n }\r\n </div>\r\n }\r\n </ng-container>\r\n } @if (columnsConfig[i].type == 'checkbox') {\r\n <mat-checkbox class=\"checkbox\"></mat-checkbox>\r\n }\r\n </th>\r\n </ng-container>\r\n } @if (columnsConfig[i].notSortable) {\r\n <ng-container>\r\n <th *matHeaderCellDef [ngClass]=\"{ 'text-end': columnsConfig[i].type === 'actions' }\" mat-header-cell>\r\n <div class=\"d-flex align-items-center\">\r\n <div class=\"mx-1\">\r\n {{ columnsConfig[i].label | translate }}\r\n </div>\r\n @if (columnsConfig[i].slaMax) {\r\n <ds-sla\r\n [canvasScale]=\"'50'\"\r\n [innerLineWidth]=\"'3'\"\r\n [maxValue]=\"columnsConfig[i].slaMax\"\r\n [outerLineColor]=\"'limegreen'\"\r\n [outerLineWidth]=\"'3'\"\r\n [value]=\"columnsConfig[i].slaValue\"\r\n class=\"table-header-sla my-1\"\r\n ></ds-sla>\r\n }\r\n </div>\r\n </th>\r\n </ng-container>\r\n }\r\n\r\n <td *matCellDef=\"let element; let j = index\" mat-cell>\r\n <ng-container [ngSwitch]=\"columnsConfig[i].type\">\r\n <!-- <a target=\"_blank\"-->\r\n <!-- routerLink=\"/inbox\" [queryParams]=\"{ id: element[column] }\"-->\r\n <!-- class=\"fc-black text-decoration-underline fw-medium\" [ngClass]=\"columnsConfig[i].type\" *ngSwitchCase=\"'link'\">-->\r\n <!-- {{ element[column] }}-->\r\n <!-- </a>-->\r\n <span *ngSwitchCase=\"'formId'\" (click)=\"viewForm(element[column])\" [ngClass]=\"columnsConfig[i].type\" class=\"fc-coral cursor-pointer text-decoration-underline fw-medium\">\r\n {{ element[column] }}\r\n </span>\r\n <!-- <span\r\n *ngSwitchCase=\"'link'\"\r\n [ngClass]=\"columnsConfig[i].type\"\r\n class=\"fc-black text-decoration-underline fw-medium\"\r\n >\r\n {{ element[column] }}\r\n </span>-->\r\n\r\n <span *ngSwitchCase=\"'linkWithIcon'\" [appSkipLocation]=\"columnsConfig[i].link\" [ngClass]=\"columnsConfig[i].type\" class=\"fc-black text-decoration-underline fw-medium\">\r\n <ds-icon class=\"fs-20 fc-black\" icon=\" {{ columnsConfig[i].icon }}\"></ds-icon>\r\n <span class=\"fs-13 fc-coral px-1 text-decoration-underline\">{{ element[column] }}</span>\r\n </span>\r\n <span *ngSwitchCase=\"'underLineWithIcon'\" [ngClass]=\"columnsConfig[i].type\" class=\"fc-black text-decoration-underline fw-medium\">\r\n <ds-icon class=\"fs-20 fc-black\" icon=\" {{ columnsConfig[i].icon }}\"></ds-icon>\r\n <span class=\"fs-13 fc-coral px-1 text-decoration-underline\">{{ element[column] }}</span>\r\n </span>\r\n <mat-checkbox *ngSwitchCase=\"'checkbox'\" checked=\"{{ columnsConfig[i].checked }}\" class=\"checkbox\" disabled=\"{{ columnsConfig[i].disabled }}\"> </mat-checkbox>\r\n <span *ngSwitchCase=\"'ServiceDetails'\" [ngClass]=\"columnsConfig[i].type\" class=\"cursor-pointer\">\r\n {{ element[column] }}\r\n </span>\r\n <span *ngSwitchCase=\"'dateOnly'\" [ngClass]=\"columnsConfig[i].type\" class=\"d-inline-flex align-items-center gap-2 text-nowrap\">\r\n <span class=\"sfi sfi-calendar-o fc-coral fs-18\"></span>\r\n {{ element[column] | date : \"MMM d, y\" }}\r\n </span>\r\n <span *ngSwitchCase=\"'Search'\" [ngClass]=\"columnsConfig[i].type\" class=\"d-inline-flex align-items-center\">\r\n <app-input [formControl]=\"ctrl\" [placeholder]=\"'Search for item '\" [showLabel]=\"false\" class=\"\" className=\"no-padding \" prefix=\"sfi-search fs-16\" type=\"text\"> </app-input>\r\n </span>\r\n <span *ngSwitchCase=\"'Number'\" [ngClass]=\"columnsConfig[i].type\" class=\"d-inline-flex align-items-center\">\r\n <app-input [formControl]=\"ctrl\" [placeholder]=\"'number'\" [showLabel]=\"false\" class=\"\" className=\"no-padding\" type=\"text\"> </app-input>\r\n </span>\r\n <span *ngSwitchCase=\"'dateFromTo'\" [ngClass]=\"columnsConfig[i].type\" class=\"d-inline-flex align-items-center\">\r\n <span class=\"sfi sfi-clock fc-coral\"></span>\r\n <span class=\"mx-2\">\r\n {{ element?.date.from }} @if (element?.date.to) {\r\n <ng-container> : {{ element?.date.to }} </ng-container>\r\n }\r\n </span>\r\n </span>\r\n\r\n <span *ngSwitchCase=\"'dateTime'\" [ngClass]=\"columnsConfig[i].type\" class=\"d-inline-flex align-items-center gap-1 flex-wrap\">\r\n <span class=\"sfi sfi-calendar-o fc-dark-gray fs-20\"></span>\r\n {{ element[column] | date : \"MMM d, y, h:mm a\" }}\r\n </span>\r\n\r\n <span *ngSwitchCase=\"'singleTimeOnly'\" [ngClass]=\"columnsConfig[i].type\" class=\"d-inline-flex align-items-center gap-1 flex-wrap\">\r\n {{ element[column] | date : \"h:mm a\" }}\r\n </span>\r\n <!--dir=\"ltr\" and text-left for English text on ar page -->\r\n <span *ngSwitchCase=\"'timeOnly'\" [ngClass]=\"columnsConfig[i].type\" class=\"d-inline-flex align-items-center gap-1 flex-wrap text-nowrap text-left\" dir=\"ltr\">\r\n <!-- -->\r\n {{ mapText(columnsConfig[i].firstVal, element[column]) | date : \"h:mm a\" }} @if (mapText(columnsConfig[i].secondVal, element[column])) {\r\n <ng-container>\r\n - {{ mapText(columnsConfig[i].secondVal, element[column]) | date : \"h:mm a\" }}\r\n </ng-container>\r\n }\r\n </span>\r\n\r\n <span *ngSwitchCase=\"'multipleRows'\" [ngClass]=\"columnsConfig[i].type\" class=\"d-inline-flex align-items-center gap-1 flex-wrap\">\r\n <!-- -->\r\n @if (!element[column].monthlyFineEscalation) {\r\n <div>\r\n {{ element[column].fixedFineValue }} {{ \"global.SAR\" | translate }}\r\n </div>\r\n } @if (element[column].monthlyFineEscalation) {\r\n <div>\r\n <br />\r\n {{ element[column].firstTimeFine }} {{ \"global.SAR\" | translate }} <br />\r\n <br />\r\n {{ element[column].secondTimeFine }} {{ \"global.SAR\" | translate }} <br />\r\n <br />\r\n {{ element[column].thirdTimeFine }} {{ \"global.SAR\" | translate }} <br />\r\n <br />\r\n </div>\r\n }\r\n </span>\r\n\r\n <div *ngSwitchCase=\"'sla'\" [ngClass]=\"columnsConfig[i].type\" class=\"d-inline-flex align-items-center\">\r\n <!-- <app-sla [value]=\"element?.SLA.value\" [maxValue]=\"element?.SLA.max\" [canvasScale]=\"38\" -->\r\n <!-- class=\"font-9 fw-medium\" [outerLineColor]=\"getSlaColor(element?.SLA.value, element?.SLA.max)\">-->\r\n <!-- </app-sla>-->\r\n\r\n <ds-sla\r\n [attr.outerLineColor]=\"\r\n getSlaColor(element?.SLA.value, element?.SLA.max)\r\n \"\r\n [canvasScale]=\"'55'\"\r\n [innerLineWidth]=\"'3'\"\r\n [maxValue]=\"element?.SLA?.max\"\r\n [outerLineWidth]=\"'3'\"\r\n [value]=\"element?.SLA?.value\"\r\n ></ds-sla>\r\n </div>\r\n <div *ngSwitchCase=\"'slaProgress'\">\r\n <!-- <mat-sp-->\r\n\r\n @if (element[column]?.percentage >= 0) {\r\n <ds-sla\r\n [canvasScale]=\"'55'\"\r\n [customValue]=\"element[column]?.percentage + '%'\"\r\n [innerLineWidth]=\"'3'\"\r\n [maxValue]=\"'100'\"\r\n [outerLineColor]=\"\r\n getSlaColor(element[column]?.percentage, 100)\r\n \"\r\n [outerLineWidth]=\"'3'\"\r\n [value]=\"element[column]?.percentage\"\r\n ></ds-sla>\r\n } @else {\r\n <ng-template>Not started</ng-template>\r\n }\r\n </div>\r\n <div *ngSwitchCase=\"'Priority'\" [ngClass]=\"columnsConfig[i].type\" class=\"{{ element[column] }}\">\r\n {{ element[column] }}\r\n </div>\r\n\r\n <div *ngSwitchCase=\"'serviceStatus'\" [ngClass]=\"columnsConfig[i].type\" class=\"{{ element[column] }}\">\r\n <span [ngClass]=\"element[column] == 'FALSE' ? 'green' : 'red'\" class=\"dot-status\"></span>\r\n </div>\r\n\r\n <div *ngSwitchCase=\"'image'\" [ngClass]=\"columnsConfig[i].type\" class=\"img-card table-img\">\r\n <img [src]=\"element?.image\" alt=\"\" onerror=\"this.onerror=null;this.src='assets/images/user.svg';\" />\r\n </div>\r\n\r\n <div *ngSwitchCase=\"'employee'\" [ngClass]=\"columnsConfig[i].type\" class=\"d-flex align-items-center gap-2 text-nowrap\">\r\n <ds-avatar [image]=\"'https://igateapp.stc.com.sa'+element[column]?.['imageUrl']\" size=\"x-small\"> </ds-avatar>\r\n <span>{{ (element[column]?.['name']) }}</span>\r\n </div>\r\n\r\n <div *ngSwitchCase=\"'progress_group'\" [ngClass]=\"columnsConfig[i].type\" class=\"d-flex gap-1\">\r\n <ng-container *ngFor=\"let item of element[column]\">\r\n <div class=\"progress-container default-progress medium radius-0\" matTooltip=\"Team assignment {{ item.value }}%\" matTooltipPosition=\"below\">\r\n <div [style.width.%]=\"item.value\" class=\"progress-bar bg-color-{{ item.color }}\"></div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div *ngSwitchCase=\"'input'\" [ngClass]=\"columnsConfig[i].type\" class=\"\">\r\n <app-input\r\n (input)=\"inputCellChanged.emit({element,column,i})\"\r\n [(ngModel)]=\"element[column]\"\r\n [min]=\"0\"\r\n [placeholder]=\"element[column]\"\r\n class=\"w-100\"\r\n className=\" no-padding w-100\"\r\n type=\"number\"\r\n value=\"{{ element[column] }}\"\r\n >\r\n </app-input>\r\n </div>\r\n <div *ngSwitchCase=\"'autoComplete'\"></div>\r\n <div *ngSwitchCase=\"'select'\" [ngClass]=\"columnsConfig[i].type\" class=\"\">\r\n <app-custom-searchable\r\n (selectedValue)=\"selectValueSelected.emit($event)\"\r\n [isSearchable]=\"columnsConfig[i].config?.isSearchable\"\r\n [key]=\"columnsConfig[i]?.key\"\r\n [displayedLabel]=\"columnsConfig[i]?.displayedLable\"\r\n [options]=\"columnsConfig[i]?.options\"\r\n [postKey]=\"columnsConfig[i]?.postKey\"\r\n [showLabel]=\"false\"\r\n className=\"no-padding w-100\"\r\n >\r\n </app-custom-searchable>\r\n </div>\r\n\r\n <div *ngSwitchCase=\"'status'\" [ngClass]=\"'New' + columnsConfig[i].type\" class=\"d-flex align-items-center gap-2\">\r\n @if (element[column]) {\r\n <ds-status [status]=\"element[column]?.status\" class=\"fs-12\">\r\n {{ element[column]?.title | translate }}\r\n </ds-status>\r\n } @if (element[column]?.reason) {\r\n <span\r\n (click)=\"$event.stopPropagation()\"\r\n [matMenuTriggerFor]=\"reasonMenu\"\r\n [ngClass]=\"columnsConfig[i].type\"\r\n class=\"{{\r\n columnsConfig[i].type\r\n }} fc-red underline cursor-pointer\"\r\n >\r\n Show reason\r\n </span>\r\n }\r\n\r\n <mat-menu #reasonMenu=\"matMenu\" class=\"p-4 text-center\">\r\n <span class=\"fs-14\">\r\n {{ element[column]?.reason }}\r\n </span>\r\n </mat-menu>\r\n </div>\r\n <div *ngSwitchCase=\"'toggle'\" [ngClass]=\"columnsConfig[i].type\">\r\n <mat-slide-toggle (change)=\"toggleValueChange($event, element)\" [checked]=\"element[column] == 1\" [disabled]=\"false\"></mat-slide-toggle>\r\n </div>\r\n\r\n <div *ngSwitchCase=\"'customToggle'\" [ngClass]=\"columnsConfig[i].type\">\r\n <mat-slide-toggle (change)=\"toggleValueChange($event, element)\" [checked]=\"element[column] == 7\" [disabled]=\"element[column] != 1\"></mat-slide-toggle>\r\n </div>\r\n <div *ngSwitchCase=\"'meetingStatus'\" [ngClass]=\"columnsConfig[i].type\" class=\"{{ columnsConfig[i].type }}\">\r\n @if (element[column].label == 'Finished') {\r\n <span class=\" {{ element[column].label }} status \">\r\n {{ element[column].label }}\r\n </span>\r\n } @if (element[column].label != 'Finished') {\r\n <div class=\"d-flex align-items-center gap-2\">\r\n <div class=\"Finished d-flex flex-column align-items-center justify-content-center py-1 fc-black\">\r\n <span class=\"fs-11 fw-medium mb-1\"> {{ element[column].hours }}</span>\r\n <span class=\"fs-10 fw-light\">HRS</span>\r\n </div>\r\n <div class=\"Finished d-flex flex-column align-items-center justify-content-center py-1 fc-black\">\r\n <span class=\"fs-11 fw-medium mb-1\"> {{ element[column].min }}</span>\r\n <span class=\"fs-10 fw-light\">MINS</span>\r\n </div>\r\n <div class=\"Finished d-flex flex-column align-items-center justify-content-center py-1 fc-black\">\r\n <span class=\"fs-11 fw-medium mb-1\"> {{ element[column].sec }}</span>\r\n <span class=\"fs-10 fw-light\">SECS</span>\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n <span\r\n *ngSwitchCase=\"'number'\"\r\n [ngClass]=\"columnsConfig[i].type\"\r\n class=\"{{ columnsConfig[i].type }} {{\r\n element[column] ? 'underline' : ''\r\n }}\"\r\n >\r\n {{ element[column] ? element[column] : 0 }}\r\n </span>\r\n\r\n <span *ngSwitchCase=\"'currency'\" [ngClass]=\"columnsConfig[i].type\" class=\"{{ columnsConfig[i].type }}\">\r\n {{ element[column] ? parseInt(element[column]).toFixed(2) + (columnsConfig[i].currency | translate) : \"-\" }}\r\n </span>\r\n <span *ngSwitchCase=\"'active'\" [ngClass]=\"columnsConfig[i].type\" class=\"{{ columnsConfig[i].type }}\">\r\n <ds-icon [ngClass]=\"element[column] ? 'fc-green' : 'fc-gray'\" icon=\"check-circle-f fs-30\"></ds-icon>\r\n </span>\r\n <div\r\n *ngSwitchCase=\"'sync'\"\r\n [ngClass]=\"columnsConfig[i].type\"\r\n class=\"{{\r\n columnsConfig[i].type\r\n }} d-flex align-items-center gap-2\"\r\n >\r\n <svg fill=\"none\" height=\"19\" viewBox=\"0 0 18 19\" width=\"18\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n d=\"M14.25 13.2604C13.9425 13.2604 13.6875 12.9913 13.6875 12.6667V5.14583C13.6875 4.59958 13.2675 4.15625 12.75 4.15625H8.625C8.3175 4.15625 8.0625 3.88708 8.0625 3.5625C8.0625 3.23792 8.3175 2.96875 8.625 2.96875H12.75C13.89 2.96875 14.8125 3.9425 14.8125 5.14583V12.6667C14.8125 12.9913 14.5575 13.2604 14.25 13.2604Z\"\r\n fill=\"#FF375E\"\r\n />\r\n <path\r\n d=\"M10.5 6.13549C10.3725 6.13549 10.245 6.088 10.14 6.00092L7.88999 4.02175C7.76249 3.91092 7.6875 3.74465 7.6875 3.56257C7.6875 3.38048 7.76249 3.22214 7.88999 3.10339L10.14 1.12422C10.38 0.910471 10.7325 0.950084 10.935 1.20342C11.1375 1.45675 11.1 1.82883 10.86 2.04258L9.12751 3.56257L10.86 5.08255C11.1 5.29631 11.13 5.66839 10.935 5.92172C10.8225 6.06422 10.6575 6.13549 10.5 6.13549Z\"\r\n fill=\"#FF375E\"\r\n />\r\n <path\r\n d=\"M14.25 18.0105C12.6975 18.0105 11.4375 16.6805 11.4375 15.0417C11.4375 13.403 12.6975 12.073 14.25 12.073C15.8025 12.073 17.0625 13.403 17.0625 15.0417C17.0625 16.6805 15.8025 18.0105 14.25 18.0105ZM14.25 13.2605C13.32 13.2605 12.5625 14.0601 12.5625 15.0417C12.5625 16.0234 13.32 16.823 14.25 16.823C15.18 16.823 15.9375 16.0234 15.9375 15.0417C15.9375 14.0601 15.18 13.2605 14.25 13.2605Z\"\r\n fill=\"#FF375E\"\r\n />\r\n <path\r\n d=\"M9.375 16.0312H5.25C4.11 16.0312 3.1875 15.0574 3.1875 13.8541V6.33325C3.1875 6.00867 3.4425 5.7395 3.75 5.7395C4.0575 5.7395 4.3125 6.00867 4.3125 6.33325V13.8541C4.3125 14.4003 4.7325 14.8437 5.25 14.8437H9.375C9.6825 14.8437 9.9375 15.1128 9.9375 15.4374C9.9375 15.762 9.6825 16.0312 9.375 16.0312Z\"\r\n fill=\"#FF375E\"\r\n />\r\n <path\r\n d=\"M7.4997 18.0104C7.3422 18.0104 7.17721 17.9391 7.06471 17.7966C6.86221 17.5433 6.89969 17.1712 7.13969 16.9574L8.87219 15.4375L7.13969 13.9175C6.89969 13.7037 6.86971 13.3316 7.06471 13.0783C7.26721 12.825 7.61971 12.7933 7.85971 12.9991L10.1097 14.9783C10.2372 15.0891 10.3122 15.2554 10.3122 15.4375C10.3122 15.6195 10.2372 15.7779 10.1097 15.8966L7.85971 17.8758C7.75471 17.9629 7.6272 18.0104 7.4997 18.0104Z\"\r\n fill=\"#FF375E\"\r\n />\r\n <path\r\n d=\"M3.75 6.927C2.1975 6.927 0.9375 5.597 0.9375 3.95825C0.9375 2.3195 2.1975 0.989502 3.75 0.989502C5.3025 0.989502 6.5625 2.3195 6.5625 3.95825C6.5625 5.597 5.3025 6.927 3.75 6.927ZM3.75 2.177C2.82 2.177 2.0625 2.97659 2.0625 3.95825C2.0625 4.93992 2.82 5.7395 3.75 5.7395C4.68 5.7395 5.4375 4.93992 5.4375 3.95825C5.4375 2.97659 4.68 2.177 3.75 2.177Z\"\r\n fill=\"#FF375E\"\r\n />\r\n </svg>\r\n {{ element[column] }}\r\n </div>\r\n\r\n <ng-container *ngSwitchCase=\"'clickable'\">\r\n @if (element?.[column]) {\r\n <span\r\n #statusMenuTrigger=\"matMenuTrigger\"\r\n (click)=\"$event.stopPropagation()\"\r\n [matMenuTriggerFor]=\"descMenu\"\r\n [ngClass]=\"columnsConfig[i].type\"\r\n class=\"{{\r\n columnsConfig[i].type\r\n }} fc-coral underline cursor-pointer\"\r\n >\r\n {{ columnsConfig[i].clickableText | translate }}\r\n </span>\r\n }\r\n\r\n <mat-menu #descMenu=\"matMenu\" class=\"p-4 text-center\">\r\n <span class=\"fs-14\">\r\n {{ element[column] }}\r\n </span>\r\n </mat-menu>\r\n </ng-container>\r\n\r\n <span\r\n #statusMenuTrigger=\"matMenuTrigger\"\r\n (click)=\"$event.stopPropagation()\"\r\n *ngSwitchCase=\"'translatedClickable'\"\r\n [matMenuTriggerFor]=\"descMenuTranslated\"\r\n [ngClass]=\"columnsConfig[i].type\"\r\n class=\"{{\r\n columnsConfig[i].type\r\n }} fc-coral underline cursor-pointer\"\r\n >\r\n {{ columnsConfig[i].clickableText | translate }}\r\n <!-- {{ 'global.view' | translate}} -->\r\n </span>\r\n\r\n <mat-menu #descMenuTranslated=\"matMenu\" class=\"p-4 text-center\">\r\n <span class=\"fs-14\">\r\n {{ columnsConfig[i].arKey ? translateService.currentLang == \"ar\" ? mapText(columnsConfig[i].arKey, element[column]) : mapText(columnsConfig[i].enKey, element[column]) : element[column] ?\r\n element[column] : \"-\" }}\r\n </span>\r\n </mat-menu>\r\n\r\n <span\r\n #statusMenuTrigger=\"matMenuTrigger\"\r\n (click)=\"$event.stopPropagation()\"\r\n *ngSwitchCase=\"'conditionalClickable'\"\r\n [matMenuTriggerFor]=\"descConditionalMenu\"\r\n [ngClass]=\"columnsConfig[i].type\"\r\n class=\"{{\r\n columnsConfig[i].type\r\n }} fc-coral underline cursor-pointer\"\r\n >\r\n @if (element[column] && element[column] != 'null') {\r\n <span>{{ columnsConfig[i].clickableText | translate }}</span>\r\n }\r\n <!-- {{ 'global.view' | translate}} -->\r\n </span>\r\n\r\n <mat-menu #descConditionalMenu=\"matMenu\" class=\"p-4 text-center\">\r\n <span class=\"fs-14\">\r\n {{ element[column] }}\r\n </span>\r\n </mat-menu>\r\n\r\n <span (click)=\"$event.stopPropagation()\" *ngSwitchCase=\"'dropdown'\" [matMenuTriggerFor]=\"dropdownMenu\" [ngClass]=\"columnsConfig[i].type\" class=\"{{ columnsConfig[i].type }} cursor-pointer\">\r\n {{ columnsConfig[i].arKey ? translateService.currentLang == \"ar\" ? mapText(columnsConfig[i].arKey, element[column]) : mapText(columnsConfig[i].enKey, element[column]) : element[column] ? element[column] :\r\n \"-\" }}\r\n <!-- <span *ngFor=\"let item of element[column]\">\r\n {{item.id}}\r\n </span> -->\r\n\r\n <ds-icon class=\"fc-black fw-medium\" icon=\"arrow\"></ds-icon>\r\n </span>\r\n\r\n <mat-menu #dropdownMenu=\"matMenu\" class=\"p-4 text-center\">\r\n <ng-container *ngSwitchCase=\"'dropdown'\">\r\n <span class=\"fs-12 fc-black\" mat-menu-item>\r\n <!-- {{translateService.currentLang == 'ar' ? item.groupNameAr : item.groupNameEn}} -->\r\n {{ columnsConfig[i].arKey ? translateService.currentLang == \"ar\" ? mapText(columnsConfig[i].arKey, element[column]) : mapText(columnsConfig[i].enKey, element[column]) : element[column] ?\r\n element[column] : \"-\" }}\r\n </span>\r\n </ng-container>\r\n </mat-menu>\r\n\r\n <span\r\n *ngSwitchCase=\"'formatNumber'\"\r\n [ngClass]=\"columnsConfig[i].type\"\r\n matTooltip=\"{{\r\n element[column] > 1000 ? element[column] : ''\r\n }}\"\r\n >\r\n {{ element[column] }}\r\n </span>\r\n\r\n <div *ngSwitchCase=\"'group'\" [ngClass]=\"columnsConfig[i].type\" class=\"text-nowrap d-flex align-items-center\"></div>\r\n\r\n <div *ngSwitchCase=\"'company'\" [ngClass]=\"columnsConfig[i].type\" class=\"d-flex align-items-center\">\r\n <span class=\"img-card circled-img\">\r\n <img [src]=\"element?.image\" alt=\"\" onerror=\"this.onerror=null;this.src='assets/images/user.svg';\" />\r\n </span>\r\n <span class=\"mx-1\"></span>\r\n <span class=\"full-name\">{{ element[column] }}</span>\r\n </div>\r\n\r\n <span *ngSwitchCase=\"'translated'\" [ngClass]=\"columnsConfig[i].type\" class=\"text-nowrap\">\r\n {{ element[column] }}\r\n </span>\r\n <span *ngSwitchCase=\"'title'\" [ngClass]=\"columnsConfig[i].type\" class=\"text-nowrap\">\r\n {{ element[column]?.title }}\r\n </span>\r\n\r\n <span *ngSwitchCase=\"'maxWidth'\" [ngClass]=\"columnsConfig[i].type\">\r\n {{ element[column]?.title }}\r\n </span>\r\n\r\n <span *ngSwitchCase=\"'progress'\" [ngClass]=\"columnsConfig[i].type\">\r\n <div class=\"Progress\">\r\n <div class=\"progress-container default-progress\">\r\n <div\r\n [style.width.%]=\"\r\n (element[column].consumed! / element[column].total!) *\r\n 100\r\n \"\r\n class=\"progress-bar\"\r\n ></div>\r\n </div>\r\n <div class=\"Progress__footer\">\r\n <div></div>\r\n <div>\r\n <span class=\"fs-12\">\r\n <span>{{ element[column].consumed }}</span>\r\n <span>/</span>\r\n <span class=\"fc-silver\">{{ element[column].total }}</span>\r\n </span>\r\n </div>\r\n </div>\r\n </div>\r\n </span>\r\n\r\n <div *ngSwitchCase=\"'subsidiary'\" [ngClass]=\"columnsConfig[i].type\" class=\"d-flex align-items-center gap-2\">\r\n <img [alt]=\"element[column]?.title\" src=\"assets/subsidiaries/ids/{{ element[column]?.id }}.png\" />\r\n <!-- <span class=\"full-name\">{{element[column]}}</span>-->\r\n </div>\r\n\r\n <div *ngSwitchCase=\"'Service'\" [ngClass]=\"columnsConfig[i].type\" class=\"d-flex align-items-center gap-2\">\r\n <svg fill=\"none\" height=\"35\" viewBox=\"0 0 34 35\" width=\"34\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect fill=\"#FF375E\" fill-opacity=\"0.1\" height=\"33.5\" rx=\"4\" width=\"33.5\" y=\"0.75\" />\r\n <path\r\n d=\"M24.213 17.0338H22.1448L21.4532 15.1884C21.2221 14.5845 20.649 14.1622 19.9761 14.1592H13.5315C12.8586 14.1622 12.2847 14.5838 12.0582 15.1771L12.0544 15.1876L11.3628 17.033H9.29312C9.05532 17.033 8.86328 17.2258 8.86328 17.4629V19.1845C8.86328 19.4223 9.05607 19.6143 9.29312 19.6143H10.2076L9.69896 20.378C9.53242 20.6233 9.4334 20.9263 9.4334 21.2519C9.4334 21.2527 9.4334 21.2527 9.4334 21.2534V26.0702C9.4334 26.308 9.62619 26.5 9.86324 26.5H12.1595C12.3973 26.5 12.5893 26.3072 12.5893 26.0702V24.7791H20.91V26.0702C20.91 26.308 21.1028 26.5 21.3399 26.5H23.6361C23.8739 26.5 24.066 26.3072 24.066 26.0702V21.2519C24.066 21.2512 24.066 21.2512 24.066 21.2504C24.066 20.9248 23.9669 20.6218 23.7974 20.3705L23.8011 20.3757L23.2925 19.6121H24.207C24.4448 19.6121 24.6368 19.4193 24.6368 19.1822V17.4606C24.6361 17.2258 24.4478 17.036 24.2145 17.0315L24.213 17.0338ZM12.8654 15.4915C12.9711 15.2176 13.2314 15.0271 13.5368 15.0264H19.9798C20.2852 15.0271 20.5455 15.2184 20.649 15.487L20.6505 15.4922L21.8747 18.7569H11.6359L12.8654 15.4915ZM23.2138 23.9202H10.2983V21.2542C10.2983 21.2534 10.2983 21.2534 10.2983 21.2527C10.2983 21.1049 10.3433 20.9676 10.4199 20.8536L10.4184 20.8558L11.245 19.6151H22.2618L23.0885 20.8558C23.1635 20.9668 23.2085 21.1049 23.2085 21.2519C23.2085 21.2527 23.2085 21.2527 23.2085 21.2534L23.2138 23.9202ZM9.72896 17.895H11.0357L10.7132 18.7561H9.72071L9.72896 17.895ZM11.7379 25.6411H10.2983V24.7799H11.7334L11.7379 25.6411ZM23.2153 25.6411H21.775V24.7799H23.21L23.2153 25.6411ZM23.7869 18.7546H22.7899L22.4674 17.8935H23.7831L23.7869 18.7546ZM12.1632 20.4762C11.2915 20.4762 10.5856 21.1829 10.5856 22.0538C10.5856 22.9248 11.2923 23.6314 12.1632 23.6314C13.0349 23.6314 13.7408 22.9248 13.7408 22.0538C13.7408 21.1821 13.0342 20.4762 12.1632 20.4762V20.4762ZM12.1632 22.7725C11.7671 22.7725 11.4461 22.4514 11.4461 22.0553C11.4461 21.6592 11.7671 21.3382 12.1632 21.3382C12.5593 21.3382 12.8804 21.6592 12.8804 22.0553C12.8804 22.4514 12.5593 22.7725 12.1632 22.7725V22.7725ZM21.3444 20.4762C20.4727 20.4762 19.7668 21.1829 19.7668 22.0538C19.7668 22.9248 20.4735 23.6314 21.3444 23.6314C22.2161 23.6314 22.922 22.9248 22.922 22.0538C22.922 21.1821 22.2153 20.4762 21.3444 20.4762ZM21.3444 22.7725C20.9483 22.7725 20.6272 22.4514 20.6272 22.0553C20.6272 21.6592 20.9483 21.3382 21.3444 21.3382C21.7405 21.3382 22.0615 21.6592 22.0615 22.0553C22.0615 22.4514 21.7405 22.7725 21.3444 22.7725ZM19.0489 21.0509H14.4579C14.2201 21.0509 14.0274 21.2437 14.0274 21.4815C14.0274 21.7193 14.2201 21.912 14.4579 21.912H19.0489C19.2867 21.912 19.4795 21.7193 19.4795 21.4815C19.4795 21.2437 19.2867 21.0509 19.0489 21.0509ZM19.0489 22.1986H14.4579C14.2201 22.1986 14.0274 22.3914 14.0274 22.6292C14.0274 22.867 14.2201 23.0598 14.4579 23.0598H19.0489C19.2867 23.0598 19.4795 22.867 19.4795 22.6292C19.4795 22.3914 19.2867 22.1986 19.0489 22.1986ZM15.2321 12.5703C15.1541 12.6484 15.1061 12.7556 15.1061 12.8742C15.1061 13.112 15.2989 13.304 15.5359 13.304C15.6544 13.304 15.7625 13.256 15.8397 13.178C16.0738 12.9439 16.3971 12.7991 16.7542 12.7991C17.1113 12.7991 17.4346 12.9439 17.6686 13.178C17.7466 13.256 17.8539 13.304 17.9724 13.304C18.2102 13.304 18.4023 13.1112 18.4023 12.8742C18.4023 12.7556 18.3543 12.6476 18.2762 12.5703C17.8862 12.181 17.3483 11.9395 16.7534 11.9395C16.1586 11.9395 15.6199 12.1803 15.2306 12.5703H15.2321ZM19.1877 12.0865C19.1884 12.0865 19.1884 12.0865 19.1892 12.0865C19.427 12.0865 19.619 11.8937 19.619 11.6567C19.619 11.5374 19.5703 11.4294 19.4915 11.3513C18.7909 10.6507 17.8224 10.2171 16.7527 10.2171C15.683 10.2171 14.7145 10.6507 14.0139 11.3513C13.9358 11.4294 13.8878 11.5366 13.8878 11.6552C13.8878 11.893 14.0806 12.085 14.3177 12.085C14.4362 12.085 14.5442 12.037 14.6215 11.959C15.1668 11.4136 15.92 11.0768 16.7519 11.0768C17.5838 11.0768 18.337 11.4136 18.8824 11.959C18.9604 12.037 19.0677 12.0857 19.1869 12.0857H19.1877V12.0865ZM13.4062 10.743C14.2637 9.88704 15.4467 9.35818 16.7542 9.35818C18.0617 9.35818 19.2447 9.88704 20.1021 10.743C20.1801 10.821 20.2874 10.869 20.4059 10.869C20.6437 10.869 20.8358 10.6762 20.8358 10.4392C20.8358 10.3206 20.7878 10.2126 20.7098 10.1353C19.6963 9.12488 18.298 8.5 16.7534 8.5C15.2089 8.5 13.8106 9.12488 12.7971 10.1353C12.7191 10.2134 12.6711 10.3206 12.6711 10.4392C12.6711 10.677 12.8639 10.869 13.1009 10.869C13.2194 10.869 13.3275 10.821 13.4047 10.743H13.4062Z\"\r\n fill=\"#FF375E\"\r\n />\r\n </svg>\r\n\r\n <span class=\"fs-12 fw-normal fc-black\">{{ element?.Service.name }}</span>\r\n </div>\r\n <div *ngSwitchCase=\"'Color'\" class=\"d-flex align-items-center gap-2\">\r\n <span\r\n [ngClass]=\"columnsConfig[i].type\"\r\n [style.background]=\"\r\n element[column]?.colorCode\r\n ? element[column]?.colorCode\r\n : element[column]\r\n \"\r\n ></span>\r\n {{ element[column].title }}\r\n </div>\r\n <div\r\n *ngSwitchCase=\"'colorBg'\"\r\n [style.background]=\"\r\n 'rgba(var(--rgb-' + element[column]?.colorName + '), 0.1)'\r\n \"\r\n class=\"d-flex align-items-center gap-2 Colorbg p-2\"\r\n >\r\n <span class=\"bc-{{ element[column]?.colorName }}\"></span>\r\n {{ element[column].title }}\r\n </div>\r\n <div *ngSwitchCase=\"'assigned'\" [ngClass]=\"columnsConfig[i].type\" class=\"delegate d-flex align-items-center\">\r\n <div class=\"img-card x-small circled-img\">\r\n <img [src]=\"element?.AssignedTo.image\" alt=\"\" onerror=\"this.onerror=null;this.src='assets/images/user.svg';\" />\r\n </div>\r\n <span class=\"mx-1\"></span>\r\n <span class=\"fs-12 fc-black\">{{ element?.AssignedTo.name }}</span>\r\n <!--\r\n <span class=\"sfi sfi-close fc-coral\"></span>\r\n -->\r\n </div>\r\n\r\n <span *ngSwitchCase=\"'coloredText'\" [style.color]=\"element[column]?.['color']\">{{ element[column]?.['title'] }}</span>\r\n <div *ngSwitchCase=\"'survey'\" [style.color]=\"element[column]?.['color']\" class=\"d-flex align-items-center gap-1 text-nowrap\">\r\n <span class=\"fs-20 sfi sfi-emoji-{{(element[column]?.['title']['en'].toLowerCase()) }}\"></span>\r\n {{ element[column]?.['title'] }}\r\n </div>\r\n\r\n <div *ngSwitchCase=\"'Satisfaction'\" [ngClass]=\"columnsConfig[i].type\" class=\"delegate d-flex gap-2 align-items-center\">\r\n <!--\r\n <ds-icon icon=\"star-f\" class=\"fc-dark-gray\"></ds-icon>\r\n -->\r\n\r\n <span class=\"fs-12 fc-black\">{{ element[column].percentage }}%</span>\r\n <ds-status class=\"auto-status\" size=\"small\" status=\"{{ element[column].status }}\">\r\n <span class=\"fs-10\">\r\n {{ element[column].percentageTrend }}%\r\n </span>\r\n @if (element[column].trendStatus == 'up') {\r\n <ds-icon class=\"fs-13 mx-1 growthIcon\" icon=\"up-growth\"> </ds-icon>\r\n } @if (element[column].trendStatus != 'up') {\r\n <ds-icon class=\"fs-13 mx-1 downIcon\" icon=\"down-growth\"> </ds-icon>\r\n }\r\n </ds-status>\r\n </div>\r\n\r\n <ng-container *ngSwitchCase=\"'actions'\">\r\n <div class=\"d-flex justify-content-start gap-2\">\r\n <ng-container *ngIf=\"columnsConfig[i]?.actions?.length <= 6\">\r\n <ng-container *ngFor=\"let action of columnsConfig[i]?.actions\">\r\n <ds-button (click)=\"$event.stopPropagation()\" *ngIf=\"action.viewMode === Actions.ALLOCATE\" shape=\"outline\" size=\"small\">\r\n <span class=\"fs-12 fc-{{ action?.actionFontColor }}\">\r\n {{ action?.actionName | translate }}\r\n </span>\r\n </ds-button>\r\n\r\n <ds-button\r\n (click)=\"\r\n $event.stopPropagation(); action?.onClick(element)\r\n \"\r\n *ngIf=\"action === Actions.ALLOCATE\"\r\n icon\r\n size=\"small\"\r\n >\r\n <ds-icon class=\"fs-15\" icon=\"pen\"></ds-icon>\r\n </ds-button>\r\n <ng-container\r\n *ngIf=\"\r\n action.viewMode != Actions.VIEW ||\r\n action.viewMode != Actions.COPY\r\n \"\r\n >\r\n <ds-button\r\n (click)=\"\r\n $event.stopPropagation(); action?.onClick(element)\r\n \"\r\n *ngIf=\"\r\n action?.action === Actions.VIEW &&\r\n !action?.isHidden\r\n \"\r\n icon\r\n size=\"small\"\r\n >\r\n <ds-icon class=\"fs-15\" icon=\"eye\"></ds-icon>\r\n </ds-button>\r\n <ds-button (click)=\"$event.stopPropagation(); action?.onClick(element)\"\r\n *ngIf=\"action?.action === Actions.CLOSE && !action?.isHidden\"\r\n icon size=\"small\">\r\n <ds-icon class=\"fs-15 fc-coral\" icon=\"close\"></ds-icon>\r\n </ds-button>\r\n\r\n <ds-button\r\n (click)=\"\r\n $event.stopPropagation(); action?.onClick(element)\r\n \"\r\n *ngIf=\"\r\n action?.action === Actions.COPY &&\r\n !action?.isHidden\r\n \"\r\n icon\r\n size=\"small\"\r\n >\r\n <ds-icon class=\"fs-15\" icon=\"files-copy\"></ds-icon>\r\n </ds-button>\r\n <!-- @if(element.hasOwnProperty('canUpdate')){\r\n <ds-button (click)=\"$event.stopPropagation();action?.onClick(element)\" icon size=\"small\"\r\n *ngIf=\"action?.action === 'edit' && !action?.isHidden && element.canUpdate == true\">\r\n <ds-icon icon=\"pen\" class=\"fs-15\"></ds-icon>\r\n </ds-button>\r\n }@else { -->\r\n\r\n <ds-button\r\n (click)=\"\r\n $event.stopPropagation(); action?.onClick(element)\"\r\n *ngIf=\"\r\n action?.action === Actions.EDIT &&\r\n ![4, 7].includes(element?.contractStatus?.id)\"\r\n icon\r\n size=\"small\"\r\n >\r\n <ds-icon class=\"fs-15\" icon=\"pen\"></ds-icon>\r\n </ds-button>\r\n <!-- } -->\r\n\r\n <ds-button\r\n (click)=\"\r\n $event.stopPropagation(); action?.onClick(element)\r\n \"\r\n *ngIf=\"\r\n action?.action === Actions.DELETE &&\r\n !action?.isHidden &&\r\n ![4, 7].includes(element?.contractStatus?.id)\r\n \"\r\n icon\r\n size=\"small\"\r\n >\r\n <ds-icon class=\"fc-coral fs-15\" icon=\"trash\"></ds-icon>\r\n </ds-button>\r\n\r\n <ds-button\r\n (click)=\"\r\n $event.stopPropagation(); action?.onClick(element)\r\n \"\r\n *ngIf=\"\r\n action?.action === Actions.DELETEPENDING &&\r\n !action?.isHidden &&\r\n element?.contractStatus?.id == 1\r\n \"\r\n icon\r\n size=\"small\"\r\n >\r\n <ds-icon class=\"fc-coral fs-15\" icon=\"trash\"></ds-icon>\r\n </ds-button>\r\n\r\n <ds-button\r\n (click)=\"\r\n $event.stopPropagation(); action?.onClick(element)\r\n \"\r\n *ngIf=\"action?.action === Actions.CHART\"\r\n color=\"transparent\"\r\n size=\"small\"\r\n >\r\n <ds-icon class=\"fc-coral fs-15\" icon=\"chart-o\"></ds-icon>\r\n </ds-button>\r\n\r\n @if (element.hasOwnProperty('canTakeAction')) {\r\n <ds-button\r\n (click)=\"\r\n $event.stopPropagation(); action?.onClick(element)\r\n \"\r\n size=\"small\"\r\n *ngIf=\"\r\n action?.action === Actions.APPROVE &&\r\n element.canTakeAction == true\r\n \"\r\n >\r\n <span class=\"fs-12\">\r\n {{ \"global.approve\" | translate }}\r\n </span>\r\n </ds-button>\r\n <ds-button\r\n shape=\"outline\"\r\n color=\"dark-gray\"\r\n (click)=\"\r\n $event.stopPropagation(); action?.onClick(element)\r\n \"\r\n size=\"small\"\r\n *ngIf=\"\r\n action?.action === Actions.REJECT &&\r\n element.canTakeAction == true\r\n \"\r\n shape=\"outline\"\r\n >\r\n <span class=\"fs-12\">\r\n {{ \"global.reject\" | translate }}\r\n </span>\r\n </ds-button>\r\n } @else {\r\n <ds-button\r\n (click)=\"\r\n $event.stopPropagation(); action?.onClick(element)\r\n \"\r\n size=\"small\"\r\n *ngIf=\"action?.action === Actions.APPROVE\"\r\n >\r\n <span class=\"fs-12\">\r\n {{ \"global.approve\" | translate }}\r\n </span>\r\n </ds-button>\r\n <ds-button\r\n shape=\"outline\"\r\n color=\"dark-gray\"\r\n (click)=\"\r\n $event.stopPropagation(); action?.onClick(element)\r\n \"\r\n size=\"small\"\r\n *ngIf=\"action?.action === Actions.REJECT\"\r\n shape=\"outline\"\r\n >\r\n <span class=\"fs-12\">\r\n {{ \"global.reject\" | translate }}\r\n </span>\r\n </ds-button>\r\n }\r\n\r\n <ds-button *ngIf=\"action?.action === Actions.DETAILS\" shape=\"text\" size=\"small\">\r\n <span class=\"fs-12 underline\"> View Details </span>\r\n </ds-button>\r\n <ds-button\r\n (click)=\"\r\n $event.stopPropagation(); action?.onClick(element)\r\n \"\r\n *ngIf=\"\r\n action?.action === Actions.START &&\r\n element?.isFinalize\r\n \"\r\n size=\"small\"\r\n >\r\n <span class=\"fs-12\">\r\n {{ action?.actionName | translate }}\r\n </span>\r\n <ds-icon class=\"fs-16\" icon=\"media-play\" slot=\"prefix\"></ds-icon>\r\n </ds-button>\r\n <ds-button\r\n (click)=\"\r\n $event.stopPropagation(); action?.onClick(element)\r\n \"\r\n *ngIf=\"action?.action === Actions.PREPARE\"\r\n color=\"light-gray\"\r\n size=\"small\"\r\n >\r\n <span class=\"fs-12 fc-black\">\r\n {{ action?.actionName | translate }}\r\n </span>\r\n <ds-icon class=\"fs-12 fc-black\" icon=\"settings\" slot=\"prefix\"></ds-icon>\r\n </ds-button>\r\n\r\n <ds-button\r\n (click)=\"\r\n $event.stopPropagation(); action?.onClick(element)\r\n \"\r\n *ngIf=\"\r\n action?.action === Actions.START &&\r\n element?.isFinalize\r\n \"\r\n size=\"small\"\r\n >\r\n <span class=\"fs-12\">\r\n {{ action?.actionName | translate }}\r\n </span>\r\n <ds-icon class=\"fs-16\" icon=\"media-play\" slot=\"prefix\"></ds-icon>\r\n </ds-button>\r\n\r\n <!-- <ds-button [color]=\"action?.actionColor\" size=\"small\"\r\n *ngIf=\"action?.action === 'customAction'\"\r\n (click)=\"$event.stopPropagation();action?.onClick(element)\" shape=\"{{action?.actionShape}}\" [class]=\"action?.actionColor\"\r\n ></ds-button> -->\r\n\r\n <ds-button\r\n (click)=\"\r\n $event.stopPropagation(); action?.onClick(element)\r\n \"\r\n *ngIf=\"action?.action === Actions.CUSTOMACTION\"\r\n [class]=\"action?.actionColor\"\r\n [color]=\"action?.actionColor\"\r\n shape=\"{{ action?.actionShape }}\"\r\n size=\"small\"\r\n >\r\n <span class=\"fs-12 fc-{{ action?.actionFontColor }}\">\r\n {{ action?.actionName | translate }}\r\n </span>\r\n </ds-button>\r\n <ds-button\r\n (click)=\"\r\n $event.stopPropagation(); action?.onClick(element)\r\n \"\r\n *ngIf=\"\r\n action?.action === Actions.CUSTOMACTIONMANAGE &&\r\n (element.contractStatus.id == 7 ||\r\n element.contractStatus.id == 1)\r\n \"\r\n [class]=\"action?.actionColor\"\r\n [color]=\"action?.actionColor\"\r\n shape=\"{{ action?.actionShape }}\"\r\n size=\"small\"\r\n >\r\n <span class=\"fs-12 fc-{{ action?.actionFontColor }}\">\r\n {{ action?.actionName | translate }}\r\n </span>\r\n </ds-button>\r\n\r\n <ds-button\r\n (click)=\"\r\n $event.stopPropagation(); action?.onClick(element)\r\n \"\r\n *ngIf=\"\r\n action?.action === Actions.CUSTOMACTIONEXTEND &&\r\n element.contractStatus.id == 7\r\n \"\r\n [class]=\"action?.actionColor\"\r\n [color]=\"action?.actionColor\"\r\n shape=\"{{ action?.actionShape }}\"\r\n size=\"small\"\r\n >\r\n <span class=\"fs-12 fc-{{ action?.actionFontColor }}\">\r\n {{ action?.actionName | translate }}\r\n </span>\r\n </ds-button>\r\n <ds-button\r\n (click)=\"\r\n $event.stopPropagation(); action?.onClick(element)\r\n \"\r\n *ngIf=\"\r\n action?.action === Actions.CUSTOMACTIONDETAILS\r\n \"\r\n [class]=\"action?.actionColor\"\r\n [color]=\"action?.actionColor\"\r\n shape=\"{{ action?.actionShape }}\"\r\n size=\"small\"\r\n >\r\n <span class=\"fs-12 fc-{{ action?.actionFontColor }}\">\r\n {{ action?.actionName | translate }}\r\n </span>\r\n </ds-button>\r\n <ds-status *ngIf=\"action?.action === Actions.STATUS\" [status]=\"action?.Status.status\" class=\"fs-12 statusAction w-100\">\r\n <span class=\"fc-black\">\r\n {{ action?.Status.title | translate }}\r\n </span>\r\n </ds-status>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"columnsConfig[i]?.actions?.length > 6\">\r\n <ds-button\r\n #statusMenuTrigger=\"matMenuTrigger\"\r\n (click)=\"$event.stopPropagation()\"\r\n *ngIf=\"columnsConfig[i]?.actions?.length > 1\"\r\n [matMenuTriggerFor]=\"statusMenu\"\r\n class=\"dots\"\r\n shape=\"text\"\r\n size=\"small\"\r\n >\r\n <ds-icon class=\"fs-20 fc-dark-gray\" icon=\"dots\"></ds-icon>\r\n </ds-button>\r\n\r\n <mat-menu #statusMenu=\"matMenu\">\r\n <button (click)=\"action?.onClick(element)\" *ngFor=\"let action of columnsConfig[i]?.actions\" mat-menu-item>\r\n <span class=\"fs-12 fc-black\">{{ action?.actionName | translate }} </span>\r\n </button>\r\n </mat-menu>\r\n </ng-container>\r\n </div>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'specs'\">\r\n @if (element?.[column]) {\r\n <span\r\n #statusMenuTrigger=\"matMenuTrigger\"\r\n (click)=\"$event.stopPropagation()\"\r\n [matMenuTriggerFor]=\"specsMenu\"\r\n [ngClass]=\"columnsConfig[i].type\"\r\n class=\"{{\r\n columnsConfig[i].type\r\n }} fc-coral underline cursor-pointer\"\r\n >\r\n {{ columnsConfig[i].clickableText | translate }}\r\n </span>\r\n }\r\n\r\n <mat-menu #specsMenu=\"matMenu\" class=\"p-4 text-center\">\r\n <span class=\"fs-14\">\r\n {{ element[column] }}\r\n </span>\r\n </mat-menu>\r\n </ng-container>\r\n\r\n <!--<div\r\n *ngSwitchCase=\"'specs'\" [ngClass]=\"columnsConfig[i].type\"\r\n class=\"d-flex gap-1\">\r\n {{ element[column] | json }}\r\n <ng-container *ngFor=\"let item of element[column]\">\r\n\r\n <div\r\n class=\"progress-container default-progress medium radius-0 \"\r\n matTooltip=\"Team assignment {{item.value}}%\" matTooltipPosition=\"below\">\r\n <div\r\n [style.width.%]=\"item.value\"\r\n class=\"progress-bar bg-color-{{item.color}}\"></div>\r\n </div>\r\n </ng-container>\r\n\r\n </div>-->\r\n\r\n <span\r\n *ngSwitchDefault\r\n [ngClass]=\"columnsConfig[i].type\"\r\n class=\"text-nowrap\"\r\n matTooltip=\" {{\r\n columnsConfig[i].arKey\r\n ? translateService.currentLang == 'ar'\r\n ? mapText(columnsConfig[i].arKey, element[column])\r\n : mapText(columnsConfig[i].enKey, element[column])\r\n : element[column]\r\n ? element[column]\r\n : '-'\r\n }}\"\r\n matTooltipPosition=\"below\"\r\n >\r\n {{ columnsConfig[i].arKey ? translateService.currentLang == \"ar\" ? mapText(columnsConfig[i].arKey, element[column]) : mapText(columnsConfig[i].enKey, element[column]) : element[column] ? element[column] :\r\n \"-\" }}\r\n </span>\r\n </ng-container>\r\n </td>\r\n </ng-container>\r\n </ng-container>\r\n }\r\n </ng-container>\r\n }\r\n\r\n <tr *matHeaderRowDef=\"columns; sticky: true\" mat-header-row></tr>\r\n <tr (click)=\"clickRow(row)\" *matRowDef=\"let row; columns: columns\" [ngClass]=\"{ 'selected-row': row?.fastTrackSeen === false }\" mat-row role=\"button\"></tr>\r\n </table>\r\n }\r\n </ng-container>\r\n } @if (isLoading) {\r\n <ds-loading-table [cols]=\"columns.length\" [rows]=\"5\"></ds-loading-table>\r\n } @if (!isLoading && dataSource.filteredData?.length == 0) {\r\n <ds-message [label]=\" customMessage?? 'NoData' | translate\" type=\"emptyList\"></ds-message>\r\n }\r\n</div>\r\n@if (dataSource.filteredData?.length && hasPaginator) {\r\n<mat-paginator #paginator (page)=\"pageChanged($event)\" [length]=\"totalElements\" [pageIndex]=\"currentPage\" [pageSizeOptions]=\"[5, 10, 15, 20, 100]\" [pageSize]=\"pageSize\" aria-label=\"Select page\" showFirstLastButtons> </mat-paginator>\r\n}\r\n", styles: [":host ::ng-deep .table-responsive table{--th-height: 32px;--th-bg: var(--purple);--th-fc: var(--white);--td-height: 75px;--td-radius: 0;--border-spacing: 0;--border-collapse: collapse;--tr-even-bc: var(--white);--tr-odd-bc: var(--white);--tr-border: 1px solid var(--light-gray);--th-border: none;--cell-pading: 0 24px;--th-fs: 11px}:host ::ng-deep .table-responsive table tr.selected-row,:host ::ng-deep .table-responsive table tr.selected-row:hover{background-color:#ecfeff;border-inline-start:3px solid var(--sea-light)}:host ::ng-deep .table-responsive table td.mat-mdc-cell.mat-mdc-table-sticky{box-shadow:-10px 0 10px #00000012}:host ::ng-deep .table-responsive table mat-form-field,:host ::ng-deep .table-responsive table .e-control,:host ::ng-deep .table-responsive table .mdc-form-field{--input-height: 35px}:host ::ng-deep .Color{width:13px;height:13px;border-radius:50%}:host ::ng-deep .Colorbg{width:fit-content;min-width:102px}:host ::ng-deep .Colorbg span{width:9px;height:9px;border-radius:50%}:host ::ng-deep span.number{color:var(--coral)}:host ::ng-deep .subsidiary img{height:22px;max-width:initial}:host ::ng-deep .sla svg{width:37px}:host ::ng-deep tr th{top:-1px!important}:host ::ng-deep ds-status.statusAction::part(base){min-height:35px;--status-width: 100%}:host ::ng-deep .dropdown{border-radius:3px;background:var(--Grays-Off-white, #f3f3f1);display:flex;height:35px;padding:10px;align-items:center;gap:5px;justify-content:center;width:fit-content}:host ::ng-deep .dropdown ds-icon span{font-weight:700}:host ::ng-deep ds-status::part(base){min-height:23px}:host ::ng-deep .Category span{border-radius:3px;width:97px;height:23px;display:flex;align-items:center;justify-content:center}:host ::ng-deep .mat-checkbox .mat-checkbox-ripple{left:calc(50% - 17px);top:calc(50% - 17px);height:30px;width:30px}:host ::ng-deep .mat-checkbox .mat-checkbox-layout .mat-checkbox-inner-container .mat-checkbox-frame{width:20px;height:20px;border-width:1px;border-style:solid;border-color:#909a9f4d}:host ::ng-deep .mat-checkbox-checked .mat-checkbox-checkmark{width:20px}:host ::ng-deep .idea a:hover{text-decoration:underline;color:var(--coral)}.paginator{width:800px}.table-container{max-height:400px;overflow:auto;scroll-behavior:smooth;transition:scroll-behavior .5s ease-in-out}@media (max-width: 768px){.table-container{max-height:65vh;height:65vh}}[dir=rtl] .table-container--btn.reRequest{transform:scaleX(-1)}@media (min-width: 1200px){.table-container--name,.table-container--date{max-width:120px}}@media (min-width: 1200px){[dir=rtl] .table-container--name{max-width:initial}}.table-container--item{display:flex;align-items:center;gap:1rem;min-height:105px;overflow:hidden;position:relative;cursor:pointer}@media (min-width: 991px){.table-container--item h4{max-width:calc(100% - 200px);display:inline-block}}.table-container--item:not(:last-child){margin-bottom:.75rem}.table-container--item ds-status::part(base){--status-width: 60px}.table-container--info span{position:relative;display:flex;align-items:center;gap:.5rem}.table-container--info span:not(:first-of-type):before{content:\"\";min-width:3px;width:3px;height:3px;border-radius:50%;background-color:var(--black)}@media (min-width: 991px){.table-container--status{position:absolute;top:1rem;right:0}}:host ::ng-deep .max-width-150{max-width:150px}:host ::ng-deep .text-align-custom{unicode-bidi:plaintext}:host ::ng-deep .table-responsive table{--th-height: var(--default-size-sm);--th-bg: var(--purple);--th-fc: var(--white);--td-height: 48px;--td-radius: 0;--border-spacing: 0;--border-collapse: collapse;--tr-even-bc: var(--off-white);--tr-odd-bc: var(--white)}:host ::ng-deep .ServiceDetails{display:inline-block;max-width:230px;white-space:normal}:host ::ng-deep .progress_group{width:100px}:host ::ng-deep .progress_group .progress-container.default-progress{min-width:25px;background-color:#cdd0d1}:host ::ng-deep .sla svg{width:36px}:host ::ng-deep .sla text{font-size:10px}:host ::ng-deep .Periority.High{color:var(--red)}:host ::ng-deep .Periority.Medium{color:var(--orange)}:host ::ng-deep .Periority.Low,:host ::ng-deep .Periority.Yes{color:var(--green)}:host ::ng-deep tr:nth-child(odd) .history,:host ::ng-deep tr:nth-child(odd) .Finished{background-color:var(--light-gray)}:host ::ng-deep tr:nth-child(2n) .history,:host ::ng-deep tr:nth-child(2n) .Finished{background-color:var(--white)}:host ::ng-deep .Finished{min-width:27px}:host ::ng-deep ds-button.coral:hover svg path{fill:var(--coral)}:host ::ng-deep .controls-tabel .mat-sort-header-container{justify-content:center!important}.dot-status{height:20px;width:20px;border-radius:50%;display:inline-block}.dot-status.red{background-color:var(--red)}.dot-status.green{background-color:var(--green)}.sticky-table{max-height:100vh}.dimCheckbox{background:var(--gray);pointer-events:none}\n"] }]
|
|
4993
4990
|
}], ctorParameters: () => [{ type: i1$1.MatDialog }, { type: i2$4.TranslateService }, { type: i4.FormBuilder }], propDecorators: { matTableRef: [{
|
|
@@ -5068,10 +5065,10 @@ class ApprovalsComponent {
|
|
|
5068
5065
|
closeSidenav() {
|
|
5069
5066
|
this.sidenavService.publish('close', null);
|
|
5070
5067
|
}
|
|
5071
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
5072
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
5068
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ApprovalsComponent, deps: [{ token: SidenavService }, { token: CoreI18nService }, { token: CoreService }], target: i0.ɵɵFactoryTarget.Component });
|
|
5069
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: ApprovalsComponent, isStandalone: true, selector: "app-approvals", ngImport: i0, template: "<section class=\"main-sidenav\">\r\n <div class=\"sidenav-title\">\r\n <h3>{{ i18n.translate('approvalCycle') }}</h3>\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 </div>\r\n <div class=\"sidenav-body p-4\">\r\n @if (coreService.approvals) {\r\n <ds-approvals approvalsData=\"{{coreService.approvals}}\"></ds-approvals>\r\n } @else {\r\n <ds-message label=\"{{i18n.translate('NoData2')}}\"></ds-message>\r\n }\r\n </div>\r\n</section>\r\n", styles: [""] });
|
|
5073
5070
|
}
|
|
5074
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
5071
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ApprovalsComponent, decorators: [{
|
|
5075
5072
|
type: Component,
|
|
5076
5073
|
args: [{ selector: 'app-approvals', standalone: true, schemas: [CUSTOM_ELEMENTS_SCHEMA], imports: [], template: "<section class=\"main-sidenav\">\r\n <div class=\"sidenav-title\">\r\n <h3>{{ i18n.translate('approvalCycle') }}</h3>\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 </div>\r\n <div class=\"sidenav-body p-4\">\r\n @if (coreService.approvals) {\r\n <ds-approvals approvalsData=\"{{coreService.approvals}}\"></ds-approvals>\r\n } @else {\r\n <ds-message label=\"{{i18n.translate('NoData2')}}\"></ds-message>\r\n }\r\n </div>\r\n</section>\r\n" }]
|
|
5077
5074
|
}], ctorParameters: () => [{ type: SidenavService }, { type: CoreI18nService }, { type: CoreService }] });
|
|
@@ -5167,10 +5164,10 @@ class ApprovalsWorkflowComponent {
|
|
|
5167
5164
|
this.coreService.approvals = JSON.stringify(this.approvals);
|
|
5168
5165
|
this.sidenavService.publish('open', ApprovalsComponent);
|
|
5169
5166
|
}
|
|
5170
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
5171
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
5167
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ApprovalsWorkflowComponent, deps: [{ token: CoreI18nService }, { token: SidenavService }, { token: CoreService }, { token: i2$1.ToastrService }], target: i0.ɵɵFactoryTarget.Component });
|
|
5168
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", 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)=\"getApprovals()\">\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 }] });
|
|
5172
5169
|
}
|
|
5173
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
5170
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ApprovalsWorkflowComponent, decorators: [{
|
|
5174
5171
|
type: Component,
|
|
5175
5172
|
args: [{ selector: 'lib-approvals-workflow', standalone: true, imports: [
|
|
5176
5173
|
SatPopoverModule
|
|
@@ -5273,10 +5270,10 @@ class ActionButtonsComponent {
|
|
|
5273
5270
|
}
|
|
5274
5271
|
return '';
|
|
5275
5272
|
}
|
|
5276
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
5277
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
5273
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ActionButtonsComponent, deps: [{ token: CoreI18nService }, { token: ActionStateService }, { token: CoreService }, { token: i1$1.MatDialog }, { token: i2$1.ToastrService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
5274
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", 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"] }] });
|
|
5278
5275
|
}
|
|
5279
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
5276
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ActionButtonsComponent, decorators: [{
|
|
5280
5277
|
type: Component,
|
|
5281
5278
|
args: [{ selector: 'lib-action-buttons', standalone: true, schemas: [CUSTOM_ELEMENTS_SCHEMA, NO_ERRORS_SCHEMA], imports: [
|
|
5282
5279
|
NgClass,
|
|
@@ -5314,10 +5311,10 @@ class FaqsComponent {
|
|
|
5314
5311
|
constructor(i18n) {
|
|
5315
5312
|
this.i18n = i18n;
|
|
5316
5313
|
}
|
|
5317
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
5318
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
5314
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: FaqsComponent, deps: [{ token: CoreI18nService }], target: i0.ɵɵFactoryTarget.Component });
|
|
5315
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: FaqsComponent, isStandalone: true, selector: "app-faqs", inputs: { adminView: "adminView", faqs: "faqs" }, ngImport: i0, template: "<mat-accordion class=\"primary-accordion\">\r\n @for (item of faqs; track $index) {\r\n <mat-expansion-panel [expanded]=\"$index==0\" class=\"mb-4\" hideToggle #expansionPanel=\"matExpansionPanel\">\r\n @if (item.title) {\r\n <mat-expansion-panel-header class=\"expansion-header\">\r\n <mat-panel-title>\r\n <h3 class=\"fs-14 fw-medium fc-black mb-0 flex-grow-1 align-self-center\">{{ item.title }}</h3>\r\n @if (expansionPanel.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 </mat-panel-title>\r\n\r\n </mat-expansion-panel-header>\r\n }\r\n <p class=\"fs-14 fc-dark-gray\">\r\n {{ item.content }}\r\n </p>\r\n </mat-expansion-panel>\r\n }\r\n</mat-accordion>\r\n", styles: ["::ng-deep .primary-accordion{--accordion-height: 60px;--accordion-radius: 6px;--accordion-bc: var(--light-gray);--accordion-bc-active: var(--white);--accordion-border: 0;--accordion-border-active: 0;--accordion-shadow: none;--accordion-shadow-active: 0 10px 7px rgba(var(--rgb-black), .06);--panel-body-padding: 0 1.5rem 1rem}::ng-deep .primary-accordion .mat-expansion-indicator{display:none}\n"], dependencies: [{ kind: "directive", type: MatAccordion, selector: "mat-accordion", inputs: ["hideToggle", "displayMode", "togglePosition"], exportAs: ["matAccordion"] }, { kind: "component", type: MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["hideToggle", "togglePosition"], outputs: ["afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "directive", type: MatExpansionPanelTitle, selector: "mat-panel-title" }] });
|
|
5319
5316
|
}
|
|
5320
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
5317
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: FaqsComponent, decorators: [{
|
|
5321
5318
|
type: Component,
|
|
5322
5319
|
args: [{ selector: 'app-faqs', standalone: true, imports: [
|
|
5323
5320
|
MatAccordion,
|
|
@@ -5341,10 +5338,10 @@ class FaqSidenavComponent {
|
|
|
5341
5338
|
closeSidenav() {
|
|
5342
5339
|
this.sidenavService.publish('close', FaqSidenavComponent);
|
|
5343
5340
|
}
|
|
5344
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
5345
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
5341
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: FaqSidenavComponent, deps: [{ token: SidenavService }, { token: CoreI18nService }], target: i0.ɵɵFactoryTarget.Component });
|
|
5342
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: FaqSidenavComponent, isStandalone: true, selector: "app-faq-sidenav", ngImport: i0, template: "<div class=\"main-sidenav\">\r\n <div class=\"sidenav-title\">\r\n <h3>{{i18n.translate('serviceBrief')}}</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 </div>\r\n <div class=\"sidenav-body\">\r\n <app-faqs [faqs]=\"data\"></app-faqs>\r\n </div>\r\n</div>\r\n", styles: [""], dependencies: [{ kind: "component", type: FaqsComponent, selector: "app-faqs", inputs: ["adminView", "faqs"] }] });
|
|
5346
5343
|
}
|
|
5347
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
5344
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: FaqSidenavComponent, decorators: [{
|
|
5348
5345
|
type: Component,
|
|
5349
5346
|
args: [{ selector: 'app-faq-sidenav', standalone: true, imports: [
|
|
5350
5347
|
FaqsComponent
|
|
@@ -5365,10 +5362,10 @@ class TitleSectionComponent {
|
|
|
5365
5362
|
openFaq() {
|
|
5366
5363
|
this.sidenavService.publish('open', FaqSidenavComponent, 'end', 'over');
|
|
5367
5364
|
}
|
|
5368
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
5369
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
5365
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: TitleSectionComponent, deps: [{ token: SidenavService }, { token: i1$1.MatDialog }], target: i0.ɵɵFactoryTarget.Component });
|
|
5366
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: TitleSectionComponent, isStandalone: true, selector: "app-title-section", inputs: { title: "title", tooltip: "tooltip" }, ngImport: i0, template: "<header class=\"section-title\">\r\n <div class=\"d-flex align-items-center\">\r\n <h1 class=\"main-title mb-0\" >{{title}}</h1>\r\n <!-- <span class=\"mx-1\"></span>\r\n <button mat-icon-button class=\"btn button-transparent square\" *ngIf=\"tooltip\" (click)=\"openFaq()\">\r\n <span class=\"sfi sfi-info fc-dark-gray font-20-imp\" id=\"step1\"></span>\r\n </button>\r\n <span class=\"mx-1\"></span> -->\r\n </div>\r\n <div class=\"filter-actions\">\r\n <div class=\"filter-section\">\r\n <ng-content select=\"[filter]\"></ng-content>\r\n </div>\r\n <span class=\"mx-1\"></span>\r\n <ng-content select=\"[action]\"></ng-content>\r\n <ng-content select=\"[search]\"></ng-content>\r\n </div>\r\n</header>\r\n", styles: [":host ::ng-deep .section-title{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap}:host ::ng-deep .section-title .filter-actions{display:flex;align-items:center;justify-content:space-between;flex-grow:1}:host ::ng-deep .section-title .filter-actions .filter-section{width:140px}:host ::ng-deep .section-title .filter-actions .filter-section .mat-form-field .mat-form-field-wrapper{padding-bottom:0}\n"] });
|
|
5370
5367
|
}
|
|
5371
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
5368
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: TitleSectionComponent, decorators: [{
|
|
5372
5369
|
type: Component,
|
|
5373
5370
|
args: [{ selector: 'app-title-section', template: "<header class=\"section-title\">\r\n <div class=\"d-flex align-items-center\">\r\n <h1 class=\"main-title mb-0\" >{{title}}</h1>\r\n <!-- <span class=\"mx-1\"></span>\r\n <button mat-icon-button class=\"btn button-transparent square\" *ngIf=\"tooltip\" (click)=\"openFaq()\">\r\n <span class=\"sfi sfi-info fc-dark-gray font-20-imp\" id=\"step1\"></span>\r\n </button>\r\n <span class=\"mx-1\"></span> -->\r\n </div>\r\n <div class=\"filter-actions\">\r\n <div class=\"filter-section\">\r\n <ng-content select=\"[filter]\"></ng-content>\r\n </div>\r\n <span class=\"mx-1\"></span>\r\n <ng-content select=\"[action]\"></ng-content>\r\n <ng-content select=\"[search]\"></ng-content>\r\n </div>\r\n</header>\r\n", styles: [":host ::ng-deep .section-title{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap}:host ::ng-deep .section-title .filter-actions{display:flex;align-items:center;justify-content:space-between;flex-grow:1}:host ::ng-deep .section-title .filter-actions .filter-section{width:140px}:host ::ng-deep .section-title .filter-actions .filter-section .mat-form-field .mat-form-field-wrapper{padding-bottom:0}\n"] }]
|
|
5374
5371
|
}], ctorParameters: () => [{ type: SidenavService }, { type: i1$1.MatDialog }], propDecorators: { title: [{
|
|
@@ -5394,12 +5391,12 @@ class ProfileSectionComponent {
|
|
|
5394
5391
|
closeSidenav() {
|
|
5395
5392
|
this.sidenavService.publish('close', null);
|
|
5396
5393
|
}
|
|
5397
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
5398
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
5394
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ProfileSectionComponent, deps: [{ token: CoreI18nService }, { token: SidenavService }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component });
|
|
5395
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: ProfileSectionComponent, isStandalone: true, selector: "app-profile-section", inputs: { profileFormVisibility: "profileFormVisibility" }, outputs: { close: "close" }, providers: [
|
|
5399
5396
|
{ provide: MAT_DIALOG_DATA, useValue: {} }
|
|
5400
5397
|
], ngImport: i0, template: "<div class=\"main-sidenav\">\r\n <div class=\"sidenav-title bc-white\">\r\n <h3> {{ profile?.fullName }}</h3>\r\n <ds-icon icon=\"close\" class=\"fc-black fs-20 p-3 cursor-pointer\" (click)=\"closeSidenav()\"></ds-icon>\r\n </div>\r\n <div class=\"sidenav-body p-0\">\r\n <div class=\"d-flex flex-column align-items-center gap-3 sidenav-user bc-off-white text-center\">\r\n <ds-avatar image=\"/group/i-gate/wm-bpm/forms/-/proxy/portrait?email={{profile?.employeeEmail}}\" class=\"mb-2\"></ds-avatar>\r\n <div class=\"d-flex flex-column gap-1\">\r\n <h4 class=\"fs-16 fc-black fw-medium mb-0\">{{ profile?.fullName }}</h4>\r\n <h6 class=\"fs-12 fc-dark-gray fw-normal mb-0\" *ngIf=\"profile?.jobPosition\">{{ profile?.jobPosition }}</h6>\r\n </div>\r\n <div class=\"d-flex flex-wrap gap-2\">\r\n <div class=\"fs-12 fc-black d-flex align-items-center gap-2 box-shadow bc-white radius-4 p-2 profile-box\">\r\n <ds-icon icon=\"mail-o\" class=\"fc-coral fs-20\"></ds-icon>\r\n <a [href]=\"'mailTo:' + profile?.employeeEmail\" class=\"fc-black\">{{ profile?.employeeEmail }}</a>\r\n </div>\r\n <div class=\"fs-12 fc-black d-flex align-items-center gap-2 box-shadow bc-white radius-4 p-2 profile-box\" *ngIf=\"profile?.businessPhone\">\r\n <ds-icon icon=\"phone\" class=\"fc-coral fs-20\"></ds-icon>\r\n <a [href]=\"'tel:' + profile?.businessPhone\" class=\"fc-black\">\r\n <bdi>{{ profile?.businessPhone }}</bdi>\r\n </a>\r\n </div>\r\n </div>\r\n </div>\r\n <div\r\n class=\"info-section no-bg px-4 pb-4\"\r\n *ngIf=\"\r\n profile?.departmentName ||\r\n profile?.generalDepartmentName ||\r\n profile?.directManagerName ||\r\n profile?.humanResourcesLocation ||\r\n profile?.nationality ||\r\n profile?.generalDepartmentCode\r\n \"\r\n >\r\n <app-info-item\r\n *ngIf=\"profile?.employeeNumber\"\r\n class=\"info-item w-100\"\r\n [label]=\"i18n.translate('employeeID')\"\r\n [value]=\"profile?.employeeNumber\"\r\n ></app-info-item>\r\n\r\n <app-info-item\r\n *ngIf=\"profile?.departmentName\"\r\n class=\"info-item w-100\"\r\n [label]=\"i18n.translate('departmentName')\"\r\n [value]=\"profile?.departmentName\"\r\n ></app-info-item>\r\n\r\n <app-info-item\r\n *ngIf=\"profile?.generalDepartmentName\"\r\n class=\"info-item w-100\"\r\n [label]=\"i18n.translate('generalDepartmentName')\"\r\n [value]=\"profile?.generalDepartmentName\"\r\n ></app-info-item>\r\n\r\n <app-info-item\r\n *ngIf=\"profile?.directManagerName\"\r\n class=\"info-item w-100\"\r\n [label]=\"i18n.translate('directManager')\"\r\n [value]=\"profile?.directManagerName\"\r\n ></app-info-item>\r\n\r\n <app-info-item\r\n *ngIf=\"profile?.humanResourcesLocation\"\r\n class=\"info-item w-100\"\r\n [label]=\"i18n.translate('humanResourcesLocation')\"\r\n [value]=\"profile?.humanResourcesLocation\"\r\n ></app-info-item>\r\n\r\n <app-info-item\r\n *ngIf=\"profile?.nationality\"\r\n class=\"info-item w-100\"\r\n [label]=\"i18n.translate('nationality') \"\r\n [value]=\"profile?.nationality\"\r\n ></app-info-item>\r\n\r\n <app-info-item\r\n *ngIf=\"profile?.sectorName\"\r\n class=\"info-item w-100\"\r\n [label]=\"i18n.translate('sector')\"\r\n [value]=\"profile?.sectorName\"\r\n ></app-info-item>\r\n\r\n </div>\r\n <ng-container\r\n *ngIf=\"\r\n !profile?.departmentName &&\r\n !profile?.generalDepartmentName &&\r\n !profile?.directManagerName &&\r\n !profile?.humanResourcesLocation &&\r\n !profile?.nationality &&\r\n !profile?.generalDepartmentCode\r\n \"\r\n >\r\n <ds-message type=\"emptyList\" [attr.label]=\"'noData' \"></ds-message>\r\n </ng-container>\r\n </div>\r\n</div>\r\n", styles: [":host ::ng-deep .main-sidenav{width:550px}@media (max-width: 871px){:host ::ng-deep .main-sidenav{width:100vw}}:host ::ng-deep .main-sidenav .sidenav-body .sidenav-user{padding:2.5rem 1.5rem}:host ::ng-deep .main-sidenav .sidenav-body .sidenav-user a{transition:var(--default-transition)}:host ::ng-deep .main-sidenav .sidenav-body .sidenav-user a:hover{text-decoration:underline}:host ::ng-deep .main-sidenav .sidenav-body ds-avatar .avatar{--default-size: 95px}:host ::ng-deep .main-sidenav .sidenav-body .employee-id:hover .copy-icon{opacity:1}:host ::ng-deep .main-sidenav .sidenav-body .employee-id .copy-icon{opacity:0;transition:all .2s linear}:host ::ng-deep .main-sidenav .sidenav-body .profile-box{justify-content:center}@media (min-width: 768px){:host ::ng-deep .main-sidenav .sidenav-body .profile-box{min-width:200px}}:host ::ng-deep .main-sidenav .sidenav-body .info-section>.info-item{padding:1.5rem 0;--info-gap: .5rem}:host ::ng-deep .main-sidenav .sidenav-body .info-section>.info-item.department-code bdi{unicode-bidi:plaintext}:host ::ng-deep .main-sidenav .sidenav-body .info-section>.info-item:not(:last-child){border-bottom:1px solid var(--gray)}:host ::ng-deep .main-sidenav .sidenav-body .info-section>.info-item>.name{--name-width: 100%;--name-fw: var(--font-regular)}:host ::ng-deep .main-sidenav .sidenav-body .info-section>.info-item>.disc{--disc-width: 100%}\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: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
5401
5398
|
}
|
|
5402
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
5399
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ProfileSectionComponent, decorators: [{
|
|
5403
5400
|
type: Component,
|
|
5404
5401
|
args: [{ selector: 'app-profile-section', standalone: true, imports: [
|
|
5405
5402
|
InfoItemComponent,
|
|
@@ -5771,10 +5768,10 @@ class FeedbackSectionComponent {
|
|
|
5771
5768
|
this.isFeedbackValidated = false;
|
|
5772
5769
|
}
|
|
5773
5770
|
}
|
|
5774
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
5775
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: FeedbackSectionComponent, isStandalone: true, selector: "app-feedback-section", inputs: { inboxItem: "inboxItem", profile: "profile" }, ngImport: i0, template: "<div class=\"popup-container\">\r\n <div class=\"d-flex align-items-center justify-content-between\" mat-dialog-title>\r\n <h3>{{i18n.translate('requestFeedback')}}</h3>\r\n <ds-button square icon matDialogClose>\r\n <ds-icon icon=\"close\" class=\"fs-20 fc-black\"></ds-icon>\r\n </ds-button>\r\n </div>\r\n <mat-dialog-content>\r\n <div class=\"d-flex flex-column align-items-center justify-content-center py-4\" *ngIf=\"submitted\">\r\n <div class=\"text-center mb-4\">\r\n <svg width=\"79\" height=\"76\" viewBox=\"0 0 79 76\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n d=\"M59.9804 0.0998676L1.39239 19.2479C1.02223 19.3692 0.69498 19.5948 0.44999 19.8976C0.205 20.2005 0.0526985 20.5676 0.0113985 20.955C-0.0299016 21.3423 0.0415576 21.7333 0.217184 22.081C0.39281 22.4287 0.665128 22.7183 1.00139 22.9149L23.1454 35.7899C23.487 35.9886 23.8794 36.0828 24.274 36.0608C24.6686 36.0388 25.0481 35.9014 25.3654 35.6659L31.5894 31.0439L26.9674 37.2679C26.7318 37.5852 26.5944 37.9646 26.5722 38.3591C26.5499 38.7537 26.6439 39.1461 26.8424 39.4879L39.7174 61.6289C39.9138 61.9652 40.2031 62.2377 40.5506 62.4135C40.8981 62.5894 41.289 62.6611 41.6763 62.6201C42.0636 62.5791 42.4308 62.4272 42.7338 62.1825C43.0369 61.9378 43.2628 61.6108 43.3844 61.2409L62.5294 2.65187C62.6458 2.29686 62.6615 1.91654 62.5749 1.55313C62.4883 1.18971 62.3026 0.857401 62.0386 0.593071C61.7746 0.328741 61.4425 0.142726 61.0792 0.0556665C60.7159 -0.0313933 60.3355 -0.0160937 59.9804 0.0998676ZM40.9434 55.6999L31.0014 38.6069L42.9894 22.4689C43.2797 22.0798 43.4202 21.5993 43.3852 21.1152C43.3502 20.631 43.142 20.1757 42.7988 19.8325C42.4556 19.4893 42.0002 19.2811 41.5161 19.2461C41.032 19.2111 40.5514 19.3516 40.1624 19.6419L24.0254 31.6279L6.93339 21.6889L57.4514 5.18087L40.9434 55.6999ZM21.2134 44.2759L7.80139 57.6909C7.42253 58.0701 6.90853 58.2833 6.37246 58.2836C5.83638 58.2839 5.32215 58.0712 4.94289 57.6924C4.56363 57.3135 4.35041 56.7995 4.35013 56.2634C4.34985 55.7274 4.56253 55.2131 4.94139 54.8339L18.3564 41.4189C18.7353 41.04 19.2491 40.8272 19.7849 40.8272C20.3207 40.8272 20.8345 41.04 21.2134 41.4189C21.5923 41.7977 21.8051 42.3116 21.8051 42.8474C21.8051 43.3832 21.5923 43.897 21.2134 44.2759ZM3.49139 44.7839C3.30378 44.5963 3.15495 44.3736 3.05341 44.1285C2.95187 43.8834 2.89961 43.6207 2.89961 43.3554C2.89961 43.0901 2.95187 42.8274 3.05341 42.5823C3.15495 42.3371 3.30378 42.1144 3.49139 41.9269L8.78439 36.6339C9.16326 36.255 9.6771 36.0422 10.2129 36.0422C10.7487 36.0422 11.2625 36.255 11.6414 36.6339C12.0203 37.0127 12.2331 37.5266 12.2331 38.0624C12.2331 38.5982 12.0203 39.112 11.6414 39.4909L6.34939 44.7839C6.1618 44.9716 5.93903 45.1206 5.69384 45.2222C5.44864 45.3238 5.18582 45.3762 4.92039 45.3762C4.65497 45.3762 4.39215 45.3238 4.14695 45.2222C3.90176 45.1206 3.67899 44.9716 3.49139 44.7839ZM26.0014 50.9899C26.189 51.1774 26.3378 51.4001 26.4394 51.6453C26.5409 51.8904 26.5932 52.1531 26.5932 52.4184C26.5932 52.6837 26.5409 52.9464 26.4394 53.1915C26.3378 53.4366 26.189 53.6593 26.0014 53.8469L20.7014 59.1409C20.3225 59.5197 19.8087 59.7326 19.2729 59.7326C18.7371 59.7326 18.2233 59.5197 17.8444 59.1409C17.4655 58.762 17.2527 58.2482 17.2527 57.7124C17.2527 57.1766 17.4655 56.6627 17.8444 56.2839L23.1374 50.9909C23.325 50.8032 23.5477 50.6544 23.7928 50.5529C24.0379 50.4513 24.3006 50.3991 24.5659 50.3991C24.8312 50.3991 25.0939 50.4513 25.339 50.5529C25.5841 50.6544 25.8068 50.8032 25.9944 50.9909L26.0014 50.9899Z\"\r\n fill=\"#8E9AA0\" />\r\n <path\r\n d=\"M58.0015 75.3119C69.0472 75.3119 78.0015 66.3576 78.0015 55.3119C78.0015 44.2662 69.0472 35.3119 58.0015 35.3119C46.9558 35.3119 38.0015 44.2662 38.0015 55.3119C38.0015 66.3576 46.9558 75.3119 58.0015 75.3119Z\"\r\n fill=\"#00C48C\" />\r\n <path\r\n d=\"M56.8804 57.3183L54.0346 54.4725L52.9743 55.5336L56.8774 59.4367L65.8354 50.5267L65.4927 50.0138C63.8557 47.5812 61.1134 46.002 58.0015 46.002C53.0313 46.002 49.0015 50.031 49.0015 55.002C49.0015 59.9729 53.0305 64.002 58.0015 64.002C62.9716 64.002 67.0007 59.9729 67.0015 55.0035H65.5017C65.5017 55.005 65.5017 55.0072 65.5017 55.0095C65.5017 59.1503 62.1453 62.5067 58.0045 62.5067C53.8637 62.5067 50.5072 59.1503 50.5072 55.0095C50.5072 50.8686 53.8637 47.5122 58.0045 47.5122C60.3793 47.5122 62.4962 48.6168 63.87 50.3392L63.882 50.3542L56.8804 57.3183Z\"\r\n fill=\"white\" />\r\n </svg>\r\n\r\n </div>\r\n <h2 class=\"fs-16 fw-medium fc-black mb-4 text-center\">\r\n {{i18n.translate('submittedSuccessfully')}}\r\n </h2>\r\n </div>\r\n\r\n <ng-container *ngIf=\"!submitted\">\r\n <div class=\"mb-3\" *ngIf=\"feedBackService.feedbackForm \">\r\n <app-search-employee #employee label=\"{{i18n.translate('requestTo')}}\" [field]=\"searchEmp\"\r\n [labelTextReadMode]=\"i18n.translate('requestTo')\" [labelTextWriteMode]=\"i18n.translate('requestTo')\"\r\n [name]=\"'searchEmp'\" (emitedValue)=\"handleUserSelected($event)\">\r\n </app-search-employee>\r\n <app-textarea #request [field]=\"employeeInput\" name=\"employeeInput\" label=\"{{i18n.translate('feedback')}}\"\r\n [required]=\"true\" [minLength]='1' (emitedValue)=\"handleFeedbackQuestion($event)\" [maxLength]='500'\r\n [errorMessage]=\"i18n.translate('lenghtMin1Max500')\">\r\n </app-textarea>\r\n </div>\r\n\r\n <div class=\"info-section\" *ngIf=\"!feedBackService.feedbackForm\">\r\n <ng-container *ngIf=\"feedBackService.responderForm\">\r\n <app-info-item class=\"info-item w-100\" label=\"{{i18n.translate('requestFrom')}}\"\r\n value=\"{{feedBackService?.feedbackResponse?.requestFrom}}\"></app-info-item>\r\n <app-info-item class=\"info-item w-100\" label=\"{{i18n.translate('requestTo')}}\"\r\n value=\"{{feedBackService?.feedbackResponse?.requestTo}}\"></app-info-item>\r\n <app-info-item class=\"info-item w-100\" label=\"{{i18n.translate('feedbackQuestion')}}\"\r\n value=\"{{feedBackService?.feedbackResponse?.requestFeedback}}\"></app-info-item>\r\n <app-info-item class=\"info-item w-100\" label=\"{{i18n.translate('feedback')}}\"\r\n value=\"{{feedBackService?.feedbackResponse?.responseFeedback}}\"></app-info-item>\r\n <app-textarea #request class=\"full mx-3 mt-3 section-item\" [field]=\"employeeInput\" name=\"employeeInput\"\r\n label=\"{{i18n.translate('feedback')}}\" [required]=\"true\" [minLength]='1'\r\n (emitedValue)=\"handleFeedbackResponse($event)\" [maxLength]='500'\r\n [errorMessage]=\"i18n.translate('lenghtMin1Max500')\">\r\n </app-textarea>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"feedBackService.pendingForm\" id=\"responce_form\">\r\n <app-info-item class=\"info-item w-100\" label=\"{{i18n.translate('requestFrom')}}\"\r\n value=\"{{feedBackService?.feedbackResponse?.requestFrom}}\"></app-info-item>\r\n <app-info-item class=\"info-item w-100\" label=\"{{i18n.translate('requestTo')}}\"\r\n value=\"{{feedBackService?.feedbackResponse?.requestTo}}\"></app-info-item>\r\n <app-info-item class=\"info-item w-100\" label=\"{{i18n.translate('feedbackQuestion')}}\"\r\n value=\"{{feedBackService?.feedbackResponse?.requestFeedback}}\"></app-info-item>\r\n <app-info-item class=\"info-item w-100\" label=\"{{i18n.translate('feedback')}}\"\r\n value=\"{{feedBackService?.feedbackResponse?.responseFeedback}}\"></app-info-item>\r\n\r\n </ng-container>\r\n </div>\r\n\r\n <div class=\"d-flex align-items-center justify-content-center w-100 gap-3\" *ngIf=\"!submitted\">\r\n <ds-button shape=\"outline\" matDialogClose>\r\n {{i18n.translate('Cancel')}}\r\n </ds-button>\r\n <ds-button *ngIf=\"feedBackService.feedbackForm\" (click)=\"addFeedback()\"\r\n disabled=\"{{!(isFeedbackValidated)}}\">\r\n {{i18n.translate('submit')}}\r\n </ds-button>\r\n <ds-button *ngIf=\"!feedBackService.feedbackForm && feedBackService.responderForm\"\r\n disabled=\"{{!(isResponseValidated)}}\" (click)=\"addResponse()\">\r\n {{i18n.translate('submit')}}\r\n </ds-button>\r\n </div>\r\n </ng-container>\r\n\r\n </mat-dialog-content>\r\n\r\n</div>\r\n", styles: ["::ng-deep .main-popup{--popup-max-width: 700px !important;--popup-width: 100% !important}\n"], dependencies: [{ kind: "directive", type: MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: SearchEmployeeComponent, selector: "app-search-employee", inputs: ["valueName", "className", "optional", "data", "floatLabel", "error", "showEdit", "arrayList", "isUniqueUsers"], outputs: ["selectedEmp", "onInputChange", "editDirectManger", "deleteDirectManger", "emitedDeletedValue"] }, { kind: "component", type: TextareaComponent, selector: "app-textarea", inputs: ["className", "preventSpecailChar"] }, { kind: "component", type: InfoItemComponent, selector: "app-info-item", inputs: ["label", "value", "name", "type", "dateType", "multiple", "insideTable", "hasLabel", "arrayList", "actionType", "download"] }, { kind: "directive", type: MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }] });
|
|
5771
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: FeedbackSectionComponent, deps: [{ token: FeedBackService }, { token: CoreI18nService }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component });
|
|
5772
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: FeedbackSectionComponent, isStandalone: true, selector: "app-feedback-section", inputs: { inboxItem: "inboxItem", profile: "profile" }, ngImport: i0, template: "<div class=\"popup-container\">\r\n <div class=\"d-flex align-items-center justify-content-between\" mat-dialog-title>\r\n <h3>{{i18n.translate('requestFeedback')}}</h3>\r\n <ds-button square icon matDialogClose>\r\n <ds-icon icon=\"close\" class=\"fs-20 fc-black\"></ds-icon>\r\n </ds-button>\r\n </div>\r\n <mat-dialog-content>\r\n <div class=\"d-flex flex-column align-items-center justify-content-center py-4\" *ngIf=\"submitted\">\r\n <div class=\"text-center mb-4\">\r\n <svg width=\"79\" height=\"76\" viewBox=\"0 0 79 76\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n d=\"M59.9804 0.0998676L1.39239 19.2479C1.02223 19.3692 0.69498 19.5948 0.44999 19.8976C0.205 20.2005 0.0526985 20.5676 0.0113985 20.955C-0.0299016 21.3423 0.0415576 21.7333 0.217184 22.081C0.39281 22.4287 0.665128 22.7183 1.00139 22.9149L23.1454 35.7899C23.487 35.9886 23.8794 36.0828 24.274 36.0608C24.6686 36.0388 25.0481 35.9014 25.3654 35.6659L31.5894 31.0439L26.9674 37.2679C26.7318 37.5852 26.5944 37.9646 26.5722 38.3591C26.5499 38.7537 26.6439 39.1461 26.8424 39.4879L39.7174 61.6289C39.9138 61.9652 40.2031 62.2377 40.5506 62.4135C40.8981 62.5894 41.289 62.6611 41.6763 62.6201C42.0636 62.5791 42.4308 62.4272 42.7338 62.1825C43.0369 61.9378 43.2628 61.6108 43.3844 61.2409L62.5294 2.65187C62.6458 2.29686 62.6615 1.91654 62.5749 1.55313C62.4883 1.18971 62.3026 0.857401 62.0386 0.593071C61.7746 0.328741 61.4425 0.142726 61.0792 0.0556665C60.7159 -0.0313933 60.3355 -0.0160937 59.9804 0.0998676ZM40.9434 55.6999L31.0014 38.6069L42.9894 22.4689C43.2797 22.0798 43.4202 21.5993 43.3852 21.1152C43.3502 20.631 43.142 20.1757 42.7988 19.8325C42.4556 19.4893 42.0002 19.2811 41.5161 19.2461C41.032 19.2111 40.5514 19.3516 40.1624 19.6419L24.0254 31.6279L6.93339 21.6889L57.4514 5.18087L40.9434 55.6999ZM21.2134 44.2759L7.80139 57.6909C7.42253 58.0701 6.90853 58.2833 6.37246 58.2836C5.83638 58.2839 5.32215 58.0712 4.94289 57.6924C4.56363 57.3135 4.35041 56.7995 4.35013 56.2634C4.34985 55.7274 4.56253 55.2131 4.94139 54.8339L18.3564 41.4189C18.7353 41.04 19.2491 40.8272 19.7849 40.8272C20.3207 40.8272 20.8345 41.04 21.2134 41.4189C21.5923 41.7977 21.8051 42.3116 21.8051 42.8474C21.8051 43.3832 21.5923 43.897 21.2134 44.2759ZM3.49139 44.7839C3.30378 44.5963 3.15495 44.3736 3.05341 44.1285C2.95187 43.8834 2.89961 43.6207 2.89961 43.3554C2.89961 43.0901 2.95187 42.8274 3.05341 42.5823C3.15495 42.3371 3.30378 42.1144 3.49139 41.9269L8.78439 36.6339C9.16326 36.255 9.6771 36.0422 10.2129 36.0422C10.7487 36.0422 11.2625 36.255 11.6414 36.6339C12.0203 37.0127 12.2331 37.5266 12.2331 38.0624C12.2331 38.5982 12.0203 39.112 11.6414 39.4909L6.34939 44.7839C6.1618 44.9716 5.93903 45.1206 5.69384 45.2222C5.44864 45.3238 5.18582 45.3762 4.92039 45.3762C4.65497 45.3762 4.39215 45.3238 4.14695 45.2222C3.90176 45.1206 3.67899 44.9716 3.49139 44.7839ZM26.0014 50.9899C26.189 51.1774 26.3378 51.4001 26.4394 51.6453C26.5409 51.8904 26.5932 52.1531 26.5932 52.4184C26.5932 52.6837 26.5409 52.9464 26.4394 53.1915C26.3378 53.4366 26.189 53.6593 26.0014 53.8469L20.7014 59.1409C20.3225 59.5197 19.8087 59.7326 19.2729 59.7326C18.7371 59.7326 18.2233 59.5197 17.8444 59.1409C17.4655 58.762 17.2527 58.2482 17.2527 57.7124C17.2527 57.1766 17.4655 56.6627 17.8444 56.2839L23.1374 50.9909C23.325 50.8032 23.5477 50.6544 23.7928 50.5529C24.0379 50.4513 24.3006 50.3991 24.5659 50.3991C24.8312 50.3991 25.0939 50.4513 25.339 50.5529C25.5841 50.6544 25.8068 50.8032 25.9944 50.9909L26.0014 50.9899Z\"\r\n fill=\"#8E9AA0\" />\r\n <path\r\n d=\"M58.0015 75.3119C69.0472 75.3119 78.0015 66.3576 78.0015 55.3119C78.0015 44.2662 69.0472 35.3119 58.0015 35.3119C46.9558 35.3119 38.0015 44.2662 38.0015 55.3119C38.0015 66.3576 46.9558 75.3119 58.0015 75.3119Z\"\r\n fill=\"#00C48C\" />\r\n <path\r\n d=\"M56.8804 57.3183L54.0346 54.4725L52.9743 55.5336L56.8774 59.4367L65.8354 50.5267L65.4927 50.0138C63.8557 47.5812 61.1134 46.002 58.0015 46.002C53.0313 46.002 49.0015 50.031 49.0015 55.002C49.0015 59.9729 53.0305 64.002 58.0015 64.002C62.9716 64.002 67.0007 59.9729 67.0015 55.0035H65.5017C65.5017 55.005 65.5017 55.0072 65.5017 55.0095C65.5017 59.1503 62.1453 62.5067 58.0045 62.5067C53.8637 62.5067 50.5072 59.1503 50.5072 55.0095C50.5072 50.8686 53.8637 47.5122 58.0045 47.5122C60.3793 47.5122 62.4962 48.6168 63.87 50.3392L63.882 50.3542L56.8804 57.3183Z\"\r\n fill=\"white\" />\r\n </svg>\r\n\r\n </div>\r\n <h2 class=\"fs-16 fw-medium fc-black mb-4 text-center\">\r\n {{i18n.translate('submittedSuccessfully')}}\r\n </h2>\r\n </div>\r\n\r\n <ng-container *ngIf=\"!submitted\">\r\n <div class=\"mb-3\" *ngIf=\"feedBackService.feedbackForm \">\r\n <app-search-employee #employee label=\"{{i18n.translate('requestTo')}}\" [field]=\"searchEmp\"\r\n [labelTextReadMode]=\"i18n.translate('requestTo')\" [labelTextWriteMode]=\"i18n.translate('requestTo')\"\r\n [name]=\"'searchEmp'\" (emitedValue)=\"handleUserSelected($event)\">\r\n </app-search-employee>\r\n <app-textarea #request [field]=\"employeeInput\" name=\"employeeInput\" label=\"{{i18n.translate('feedback')}}\"\r\n [required]=\"true\" [minLength]='1' (emitedValue)=\"handleFeedbackQuestion($event)\" [maxLength]='500'\r\n [errorMessage]=\"i18n.translate('lenghtMin1Max500')\">\r\n </app-textarea>\r\n </div>\r\n\r\n <div class=\"info-section\" *ngIf=\"!feedBackService.feedbackForm\">\r\n <ng-container *ngIf=\"feedBackService.responderForm\">\r\n <app-info-item class=\"info-item w-100\" label=\"{{i18n.translate('requestFrom')}}\"\r\n value=\"{{feedBackService?.feedbackResponse?.requestFrom}}\"></app-info-item>\r\n <app-info-item class=\"info-item w-100\" label=\"{{i18n.translate('requestTo')}}\"\r\n value=\"{{feedBackService?.feedbackResponse?.requestTo}}\"></app-info-item>\r\n <app-info-item class=\"info-item w-100\" label=\"{{i18n.translate('feedbackQuestion')}}\"\r\n value=\"{{feedBackService?.feedbackResponse?.requestFeedback}}\"></app-info-item>\r\n <app-info-item class=\"info-item w-100\" label=\"{{i18n.translate('feedback')}}\"\r\n value=\"{{feedBackService?.feedbackResponse?.responseFeedback}}\"></app-info-item>\r\n <app-textarea #request class=\"full mx-3 mt-3 section-item\" [field]=\"employeeInput\" name=\"employeeInput\"\r\n label=\"{{i18n.translate('feedback')}}\" [required]=\"true\" [minLength]='1'\r\n (emitedValue)=\"handleFeedbackResponse($event)\" [maxLength]='500'\r\n [errorMessage]=\"i18n.translate('lenghtMin1Max500')\">\r\n </app-textarea>\r\n </ng-container>\r\n\r\n <ng-container *ngIf=\"feedBackService.pendingForm\" id=\"responce_form\">\r\n <app-info-item class=\"info-item w-100\" label=\"{{i18n.translate('requestFrom')}}\"\r\n value=\"{{feedBackService?.feedbackResponse?.requestFrom}}\"></app-info-item>\r\n <app-info-item class=\"info-item w-100\" label=\"{{i18n.translate('requestTo')}}\"\r\n value=\"{{feedBackService?.feedbackResponse?.requestTo}}\"></app-info-item>\r\n <app-info-item class=\"info-item w-100\" label=\"{{i18n.translate('feedbackQuestion')}}\"\r\n value=\"{{feedBackService?.feedbackResponse?.requestFeedback}}\"></app-info-item>\r\n <app-info-item class=\"info-item w-100\" label=\"{{i18n.translate('feedback')}}\"\r\n value=\"{{feedBackService?.feedbackResponse?.responseFeedback}}\"></app-info-item>\r\n\r\n </ng-container>\r\n </div>\r\n\r\n <div class=\"d-flex align-items-center justify-content-center w-100 gap-3\" *ngIf=\"!submitted\">\r\n <ds-button shape=\"outline\" matDialogClose>\r\n {{i18n.translate('Cancel')}}\r\n </ds-button>\r\n <ds-button *ngIf=\"feedBackService.feedbackForm\" (click)=\"addFeedback()\"\r\n disabled=\"{{!(isFeedbackValidated)}}\">\r\n {{i18n.translate('submit')}}\r\n </ds-button>\r\n <ds-button *ngIf=\"!feedBackService.feedbackForm && feedBackService.responderForm\"\r\n disabled=\"{{!(isResponseValidated)}}\" (click)=\"addResponse()\">\r\n {{i18n.translate('submit')}}\r\n </ds-button>\r\n </div>\r\n </ng-container>\r\n\r\n </mat-dialog-content>\r\n\r\n</div>\r\n", styles: ["::ng-deep .main-popup{--popup-max-width: 700px !important;--popup-width: 100% !important}\n"], dependencies: [{ kind: "directive", type: MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: SearchEmployeeComponent, selector: "app-search-employee", inputs: ["valueName", "className", "optional", "data", "floatLabel", "error", "showEdit", "arrayList", "isUniqueUsers"], outputs: ["selectedEmp", "onInputChange", "editDirectManger", "deleteDirectManger", "emitedDeletedValue"] }, { kind: "component", type: TextareaComponent, selector: "app-textarea", inputs: ["className", "preventSpecailChar"] }, { kind: "component", type: InfoItemComponent, selector: "app-info-item", inputs: ["label", "value", "name", "type", "dateType", "multiple", "insideTable", "hasLabel", "arrayList", "actionType", "download"] }, { kind: "directive", type: MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }] });
|
|
5776
5773
|
}
|
|
5777
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
5774
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: FeedbackSectionComponent, decorators: [{
|
|
5778
5775
|
type: Component,
|
|
5779
5776
|
args: [{ selector: 'app-feedback-section', schemas: [CUSTOM_ELEMENTS_SCHEMA], imports: [
|
|
5780
5777
|
MatDialogContent,
|
|
@@ -5826,10 +5823,10 @@ class ActivitiesComponent {
|
|
|
5826
5823
|
closeSidenav() {
|
|
5827
5824
|
this.sidenavService.publish('close', null);
|
|
5828
5825
|
}
|
|
5829
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
5830
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
5826
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ActivitiesComponent, deps: [{ token: SidenavService }, { token: CoreI18nService }, { token: CoreService }], target: i0.ɵɵFactoryTarget.Component });
|
|
5827
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: ActivitiesComponent, isStandalone: true, selector: "app-activities", ngImport: i0, 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", styles: [""] });
|
|
5831
5828
|
}
|
|
5832
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
5829
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ActivitiesComponent, decorators: [{
|
|
5833
5830
|
type: Component,
|
|
5834
5831
|
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" }]
|
|
5835
5832
|
}], ctorParameters: () => [{ type: SidenavService }, { type: CoreI18nService }, { type: CoreService }] });
|
|
@@ -5878,10 +5875,10 @@ class StatusStylePipe {
|
|
|
5878
5875
|
// status == 'SEND BACK TO REQUESTER' ? 'SENDBACKTOREQUESTER' : status
|
|
5879
5876
|
return statusClass[status?.toUpperCase()] || 'success';
|
|
5880
5877
|
}
|
|
5881
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
5882
|
-
static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "
|
|
5878
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: StatusStylePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
|
|
5879
|
+
static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.1", ngImport: i0, type: StatusStylePipe, isStandalone: true, name: "statusClass" });
|
|
5883
5880
|
}
|
|
5884
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
5881
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: StatusStylePipe, decorators: [{
|
|
5885
5882
|
type: Pipe,
|
|
5886
5883
|
args: [{
|
|
5887
5884
|
name: 'statusClass',
|
|
@@ -6194,10 +6191,10 @@ class PreviousRequestsComponent {
|
|
|
6194
6191
|
this.ngUnsubscribe.next();
|
|
6195
6192
|
this.ngUnsubscribe.complete();
|
|
6196
6193
|
}
|
|
6197
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
6198
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.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)=\"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 class=\"sidenav-body bc-light-gray\">\r\n <section class=\"p-3\">\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 <ds-button icon size=\"small\" (click)=\"isOpen = !isOpen\" cdkOverlayOrigin #trigger=\"cdkOverlayOrigin\">\r\n <ds-icon icon=\"filter\" class=\"fc-coral fs-20\" slot=\"prefix\"></ds-icon>\r\n </ds-button>\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 @if (pageView.value === 'card') {\r\n <div class=\"history-cards-container\">\r\n @if (loading) {\r\n <ng-container>\r\n <div class=\"p-4 line-height-1 bc-white radius-6 box-shadow\" *ngFor=\"let row of [0,1,2,3]\">\r\n <div class=\"d-flex align-items-center gap-2 mb-3\">\r\n <h3 class=\"loading-bg fs-16 fw-medium flex-grow-1 mb-0 cursor-pointer underline fw-bold\"></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 loading-bg\"></span>\r\n <span class=\"fs-12 fw-medium fc-black loading-bg\"></span>\r\n </div>\r\n <div class=\"d-flex flex-column col-6 justify-content-end align-items-end\">\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n } @else {\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 }\r\n\r\n </div>\r\n }\r\n @if (pageView.value === 'list') {\r\n <div class=\"table-responsive\">\r\n <table *ngIf=\"previousRequests?.length && !loading\">\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 }\r\n @if (!previousRequests?.length && !loading) {\r\n <ng-container *ngTemplateOutlet=\"emptyMessage\"></ng-container>\r\n }\r\n </section>\r\n </div>\r\n</section>\r\n\r\n<ng-template\r\n cdkConnectedOverlay\r\n [cdkConnectedOverlayHasBackdrop]=\"true\"\r\n (backdropClick)=\"isOpen = false\"\r\n [cdkConnectedOverlayGrowAfterOpen]=\"true\"\r\n [cdkConnectedOverlayOrigin]=\"trigger\"\r\n [cdkConnectedOverlayOpen]=\"isOpen\"\r\n>\r\n <form [formGroup]=\"filterFormGroup\">\r\n <div class=\"filter-container\">\r\n <div class=\"popup-header border-bottom pb-2\">\r\n <h3 class=\"fs-16 fc-black fw-medium\">{{ i18n.translate('filters') }}</h3>\r\n </div>\r\n <div class=\"d-flex flex-column gap-4 gap-md-3 filter-section bc-white mt-0 pt-3\">\r\n\r\n <app-custom-searchable\r\n class=\"section-item\"\r\n formControlName=\"status\"\r\n label=\"{{ i18n.translate('status') }}\"\r\n [options]=\"statuses\"\r\n [displayedLabel]=\"'value'\"\r\n [key]=\"'key'\">\r\n </app-custom-searchable>\r\n\r\n <app-custom-searchable\r\n class=\"section-item\"\r\n formControlName=\"year\"\r\n label=\"{{ i18n.translate('year') }}\"\r\n [options]=\"yearsOptions\"\r\n [displayedLabel]=\"'value'\"\r\n [key]=\"'key'\">\r\n </app-custom-searchable>\r\n\r\n <app-custom-searchable\r\n class=\"section-item\"\r\n formControlName=\"month\"\r\n label=\"{{ i18n.translate('month') }}\"\r\n [options]=\"monthsOptions\"\r\n [displayedLabel]=\"'value'\"\r\n [key]=\"'key'\">\r\n </app-custom-searchable>\r\n\r\n <div class=\"d-flex align-items-center gap-3 mt-4\">\r\n <ds-button shape=\"outline\" size=\"small\" (click)=\"clearFilters()\">\r\n <span class=\"fs-12\"> {{ i18n.translate('clear') }} </span>\r\n </ds-button>\r\n <ds-button class=\"w-100\" size=\"small\" (click)=\"applyFilters()\">\r\n <span class=\"fs-12\">{{ i18n.translate('applyFilters') }} </span>\r\n </ds-button>\r\n </div>\r\n </div>\r\n </div>\r\n </form>\r\n</ng-template>\r\n\r\n\r\n <ng-template #emptyMessage>\r\n <ds-message label=\"{{i18n.translate('NoData')}}\"></ds-message>\r\n </ng-template>\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}}:host ::ng-deep .select-filter{--input-height: 35px;--input-width: 120px;--input-border: 1px solid var(--white) !important;--input-border-focuse: 1px solid var(--white);--input-border-active: 1px solid var(--white);box-shadow:var(--box-shadow);--input-bg: var(--white) !important}:host ::ng-deep .decisions-container{max-height:340px;overflow:auto;scroll-behavior:smooth;transition:scroll-behavior .5s ease-in-out;height:340px}@media (max-width: 768px){:host ::ng-deep .decisions-container{max-height:320px;height:320px}}[dir=rtl] :host ::ng-deep .decisions-container--btn.reRequest{transform:scaleX(-1)}@media (min-width: 1200px){:host ::ng-deep .decisions-container--name,:host ::ng-deep .decisions-container--date{max-width:120px}}@media (min-width: 1200px){[dir=rtl] :host ::ng-deep .decisions-container--name{max-width:initial}}:host ::ng-deep .decisions-container--item{display:flex;align-items:center;gap:1rem;min-height:105px;overflow:hidden;position:relative;cursor:pointer}@media (min-width: 991px){:host ::ng-deep .decisions-container--item h4{max-width:calc(100% - 200px);display:inline-block}}:host ::ng-deep .decisions-container--item:not(:last-child){margin-bottom:.75rem}:host ::ng-deep .decisions-container--item ds-status::part(base){--status-width: 60px}:host ::ng-deep .decisions-container--info span{position:relative;display:flex;align-items:center;gap:.5rem}:host ::ng-deep .decisions-container--info span:not(:first-of-type):before{content:\"\";min-width:3px;width:3px;height:3px;border-radius:50%;background-color:var(--black)}@media (min-width: 991px){:host ::ng-deep .decisions-container--status{position:absolute;top:1rem;right:0}}:host ::ng-deep .decisions-title{display:block;display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:1}::ng-deep .main-portal mat-form-field.no-padding .mat-form-field-wrapper{padding-bottom:0!important}::ng-deep ds-button[hidden]{display:none!important}ds-button[circle]::part(base){--btn-color: inherit;--btn-border-color: inherit;--btn-bg-color: inherit;--btn-height: 25px;--btn-min-width: 25px}ds-button[circle][color=red]{--btn-bg-color: var(--red)}ds-button[circle][color=red]:hover{--btn-bg-color: var(--white)}ds-button[circle][color=green]{--btn-bg-color: var(--green)}ds-button[circle][color=green]:hover{--btn-bg-color: var(--white)}ds-button[circle][color=yellow]{--btn-bg-color: var(--yellow)}ds-button[circle][color=yellow]:hover{--btn-bg-color: var(--white)}ds-button[circle][color=coral]{--btn-bg-color: var(--coral)}ds-button[circle][color=coral]:hover{--btn-bg-color: var(--white)}ds-button[circle][color=coral]:hover svg path,ds-button[circle][color=coral]:hover svg line{fill:var(--coral)}ds-button[circle][color=orange]{--btn-bg-color: var(--orange)}ds-button[circle][color=orange]:hover{--btn-bg-color: var(--white)}@media (min-width: 991px){.decisions-container--item .decisions-container--status{width:0;transition:var(--default-transition)}}@media (min-width: 991px){.decisions-container--item:hover .decisions-container--status{transition:var(--default-transition);width:auto;height:auto;right:1.5rem}}::ng-deep .mat-tooltip{max-width:187px;background:#1d252d}::ng-deep ds-button.dots::part(base){text-decoration:none;padding:0;min-width:auto}@media (max-width: 300px){::ng-deep ds-button[shape=text]::part(base){padding:0 5px}::ng-deep ds-button.mat-menu-trigger::part(base){padding:0 5px}}.search-form-input{color:var(--black);font-weight:var(--font-medium);padding:0 .75rem;border:none;height:100%}.search-form-input::placeholder{color:var(--dark-gray);font-weight:var(--font-regular)}::ng-deep .select-user-dropdown{min-width:300px}::ng-deep .filter-container{background-color:var(--white);padding:1.5rem;border-radius:4px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i5.DatePipe, name: "date" }, { kind: "ngmodule", type: MatMenuModule }, { kind: "ngmodule", type: RouterModule }, { kind: "ngmodule", type: TranslateModule }, { kind: "ngmodule", type: MatDialogModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: MatButtonToggleModule }, { kind: "directive", type: i6$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: i6$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" }, { kind: "directive", type: CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "component", type: CustomSearchableComponent, selector: "app-custom-searchable", inputs: ["options", "disabled", "displayedLabel", "key", "floatLabel", "className"], outputs: ["selectedValue", "isLengthGreaterThan4"] }, { kind: "directive", type: CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }] });
|
|
6194
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: PreviousRequestsComponent, deps: [{ token: i1$1.MatDialog }, { token: SidenavService }, { token: CoreService }, { token: i2$1.ToastrService }, { token: CoreI18nService }, { token: i4.FormBuilder }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
6195
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", 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)=\"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 class=\"sidenav-body bc-light-gray\">\r\n <section class=\"p-3\">\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 <ds-button icon size=\"small\" (click)=\"isOpen = !isOpen\" cdkOverlayOrigin #trigger=\"cdkOverlayOrigin\">\r\n <ds-icon icon=\"filter\" class=\"fc-coral fs-20\" slot=\"prefix\"></ds-icon>\r\n </ds-button>\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 @if (pageView.value === 'card') {\r\n <div class=\"history-cards-container\">\r\n @if (loading) {\r\n <ng-container>\r\n <div class=\"p-4 line-height-1 bc-white radius-6 box-shadow\" *ngFor=\"let row of [0,1,2,3]\">\r\n <div class=\"d-flex align-items-center gap-2 mb-3\">\r\n <h3 class=\"loading-bg fs-16 fw-medium flex-grow-1 mb-0 cursor-pointer underline fw-bold\"></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 loading-bg\"></span>\r\n <span class=\"fs-12 fw-medium fc-black loading-bg\"></span>\r\n </div>\r\n <div class=\"d-flex flex-column col-6 justify-content-end align-items-end\">\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n } @else {\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 }\r\n\r\n </div>\r\n }\r\n @if (pageView.value === 'list') {\r\n <div class=\"table-responsive\">\r\n <table *ngIf=\"previousRequests?.length && !loading\">\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 }\r\n @if (!previousRequests?.length && !loading) {\r\n <ng-container *ngTemplateOutlet=\"emptyMessage\"></ng-container>\r\n }\r\n </section>\r\n </div>\r\n</section>\r\n\r\n<ng-template\r\n cdkConnectedOverlay\r\n [cdkConnectedOverlayHasBackdrop]=\"true\"\r\n (backdropClick)=\"isOpen = false\"\r\n [cdkConnectedOverlayGrowAfterOpen]=\"true\"\r\n [cdkConnectedOverlayOrigin]=\"trigger\"\r\n [cdkConnectedOverlayOpen]=\"isOpen\"\r\n>\r\n <form [formGroup]=\"filterFormGroup\">\r\n <div class=\"filter-container\">\r\n <div class=\"popup-header border-bottom pb-2\">\r\n <h3 class=\"fs-16 fc-black fw-medium\">{{ i18n.translate('filters') }}</h3>\r\n </div>\r\n <div class=\"d-flex flex-column gap-4 gap-md-3 filter-section bc-white mt-0 pt-3\">\r\n\r\n <app-custom-searchable\r\n class=\"section-item\"\r\n formControlName=\"status\"\r\n label=\"{{ i18n.translate('status') }}\"\r\n [options]=\"statuses\"\r\n [displayedLabel]=\"'value'\"\r\n [key]=\"'key'\">\r\n </app-custom-searchable>\r\n\r\n <app-custom-searchable\r\n class=\"section-item\"\r\n formControlName=\"year\"\r\n label=\"{{ i18n.translate('year') }}\"\r\n [options]=\"yearsOptions\"\r\n [displayedLabel]=\"'value'\"\r\n [key]=\"'key'\">\r\n </app-custom-searchable>\r\n\r\n <app-custom-searchable\r\n class=\"section-item\"\r\n formControlName=\"month\"\r\n label=\"{{ i18n.translate('month') }}\"\r\n [options]=\"monthsOptions\"\r\n [displayedLabel]=\"'value'\"\r\n [key]=\"'key'\">\r\n </app-custom-searchable>\r\n\r\n <div class=\"d-flex align-items-center gap-3 mt-4\">\r\n <ds-button shape=\"outline\" size=\"small\" (click)=\"clearFilters()\">\r\n <span class=\"fs-12\"> {{ i18n.translate('clear') }} </span>\r\n </ds-button>\r\n <ds-button class=\"w-100\" size=\"small\" (click)=\"applyFilters()\">\r\n <span class=\"fs-12\">{{ i18n.translate('applyFilters') }} </span>\r\n </ds-button>\r\n </div>\r\n </div>\r\n </div>\r\n </form>\r\n</ng-template>\r\n\r\n\r\n <ng-template #emptyMessage>\r\n <ds-message label=\"{{i18n.translate('NoData')}}\"></ds-message>\r\n </ng-template>\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}}:host ::ng-deep .select-filter{--input-height: 35px;--input-width: 120px;--input-border: 1px solid var(--white) !important;--input-border-focuse: 1px solid var(--white);--input-border-active: 1px solid var(--white);box-shadow:var(--box-shadow);--input-bg: var(--white) !important}:host ::ng-deep .decisions-container{max-height:340px;overflow:auto;scroll-behavior:smooth;transition:scroll-behavior .5s ease-in-out;height:340px}@media (max-width: 768px){:host ::ng-deep .decisions-container{max-height:320px;height:320px}}[dir=rtl] :host ::ng-deep .decisions-container--btn.reRequest{transform:scaleX(-1)}@media (min-width: 1200px){:host ::ng-deep .decisions-container--name,:host ::ng-deep .decisions-container--date{max-width:120px}}@media (min-width: 1200px){[dir=rtl] :host ::ng-deep .decisions-container--name{max-width:initial}}:host ::ng-deep .decisions-container--item{display:flex;align-items:center;gap:1rem;min-height:105px;overflow:hidden;position:relative;cursor:pointer}@media (min-width: 991px){:host ::ng-deep .decisions-container--item h4{max-width:calc(100% - 200px);display:inline-block}}:host ::ng-deep .decisions-container--item:not(:last-child){margin-bottom:.75rem}:host ::ng-deep .decisions-container--item ds-status::part(base){--status-width: 60px}:host ::ng-deep .decisions-container--info span{position:relative;display:flex;align-items:center;gap:.5rem}:host ::ng-deep .decisions-container--info span:not(:first-of-type):before{content:\"\";min-width:3px;width:3px;height:3px;border-radius:50%;background-color:var(--black)}@media (min-width: 991px){:host ::ng-deep .decisions-container--status{position:absolute;top:1rem;right:0}}:host ::ng-deep .decisions-title{display:block;display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:1}::ng-deep .main-portal mat-form-field.no-padding .mat-form-field-wrapper{padding-bottom:0!important}::ng-deep ds-button[hidden]{display:none!important}ds-button[circle]::part(base){--btn-color: inherit;--btn-border-color: inherit;--btn-bg-color: inherit;--btn-height: 25px;--btn-min-width: 25px}ds-button[circle][color=red]{--btn-bg-color: var(--red)}ds-button[circle][color=red]:hover{--btn-bg-color: var(--white)}ds-button[circle][color=green]{--btn-bg-color: var(--green)}ds-button[circle][color=green]:hover{--btn-bg-color: var(--white)}ds-button[circle][color=yellow]{--btn-bg-color: var(--yellow)}ds-button[circle][color=yellow]:hover{--btn-bg-color: var(--white)}ds-button[circle][color=coral]{--btn-bg-color: var(--coral)}ds-button[circle][color=coral]:hover{--btn-bg-color: var(--white)}ds-button[circle][color=coral]:hover svg path,ds-button[circle][color=coral]:hover svg line{fill:var(--coral)}ds-button[circle][color=orange]{--btn-bg-color: var(--orange)}ds-button[circle][color=orange]:hover{--btn-bg-color: var(--white)}@media (min-width: 991px){.decisions-container--item .decisions-container--status{width:0;transition:var(--default-transition)}}@media (min-width: 991px){.decisions-container--item:hover .decisions-container--status{transition:var(--default-transition);width:auto;height:auto;right:1.5rem}}::ng-deep .mat-tooltip{max-width:187px;background:#1d252d}::ng-deep ds-button.dots::part(base){text-decoration:none;padding:0;min-width:auto}@media (max-width: 300px){::ng-deep ds-button[shape=text]::part(base){padding:0 5px}::ng-deep ds-button.mat-menu-trigger::part(base){padding:0 5px}}.search-form-input{color:var(--black);font-weight:var(--font-medium);padding:0 .75rem;border:none;height:100%}.search-form-input::placeholder{color:var(--dark-gray);font-weight:var(--font-regular)}::ng-deep .select-user-dropdown{min-width:300px}::ng-deep .filter-container{background-color:var(--white);padding:1.5rem;border-radius:4px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i5.DatePipe, name: "date" }, { kind: "ngmodule", type: MatMenuModule }, { kind: "ngmodule", type: RouterModule }, { kind: "ngmodule", type: TranslateModule }, { kind: "ngmodule", type: MatDialogModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: MatButtonToggleModule }, { kind: "directive", type: i6$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: i6$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" }, { kind: "directive", type: CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "component", type: CustomSearchableComponent, selector: "app-custom-searchable", inputs: ["options", "disabled", "displayedLabel", "key", "floatLabel", "className"], outputs: ["selectedValue", "isLengthGreaterThan4"] }, { kind: "directive", type: CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }] });
|
|
6199
6196
|
}
|
|
6200
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
6197
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: PreviousRequestsComponent, decorators: [{
|
|
6201
6198
|
type: Component,
|
|
6202
6199
|
args: [{ selector: 'app-history', standalone: true, imports: [
|
|
6203
6200
|
CommonModule,
|
|
@@ -6426,12 +6423,12 @@ class ServiceHeaderComponent {
|
|
|
6426
6423
|
showPreviousRequests() {
|
|
6427
6424
|
this.sidenavService.publish('open', PreviousRequestsComponent);
|
|
6428
6425
|
}
|
|
6429
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
6430
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
6426
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ServiceHeaderComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: CoreService }, { token: CoreI18nService }, { token: FeedBackService }, { token: i1$1.MatDialog }, { token: SidenavService }, { token: i2$1.ToastrService }], target: i0.ɵɵFactoryTarget.Component });
|
|
6427
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: ServiceHeaderComponent, isStandalone: true, selector: "core-service-header", inputs: { form: "form", showHistory: "showHistory", isLoading: "isLoading", isReadOnly: "isReadOnly", showApprovalHistory: "showApprovalHistory", approvalHistory: "approvalHistory", creationDate: "creationDate", formTitle: "formTitle", section: "section", serviceFaq: "serviceFaq" }, providers: [FeedBackService,
|
|
6431
6428
|
{ provide: MAT_DIALOG_DATA, useValue: {} },
|
|
6432
6429
|
], 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 <p class=\"fs-14 fs-md-12 fw-normal fc-dark-gray mb-1\">\r\n {{ i18n.translate('Hello') }}\r\n {{ coreService.getShortName(form?.header?.requesterName) }}, {{ i18n.translate('welcomeBack') }}!\r\n </p>\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 @if (!isReadOnly) {\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 }\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:20px 24px;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.user-avatar .avatar{min-width:var(--default-size, 45px)!important;width:var(--default-size, 45px)!important;height:var(--default-size, 45px)!important;padding:var(--avatar-padding, 0)!important;background-color:var(--avatar-bg, white);color:var(--avatar-color, black)!important;border:var(--avatar-border, 0)!important;border-radius:var(--avatar-radius, 50%)!important;margin:var(--avatar-margin, 0)!important;display:inline-flex;align-items:center;justify-content:center;overflow:hidden;--default-size: 25px}@media (min-width: 768px){.status-container ::ng-deep ds-avatar.user-avatar .avatar{--default-size: 31px;--avatar-border: 3px solid var(--light-gray)}}.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{min-width:var(--default-size, 45px)!important;width:var(--default-size, 45px)!important;height:var(--default-size, 45px)!important;padding:var(--avatar-padding, 0)!important;background-color:var(--avatar-bg, white);color:var(--avatar-color, black)!important;border:var(--avatar-border, 0)!important;border-radius:var(--avatar-radius, 50%)!important;margin:var(--avatar-margin, 0)!important;--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"] }] });
|
|
6433
6430
|
}
|
|
6434
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
6431
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ServiceHeaderComponent, decorators: [{
|
|
6435
6432
|
type: Component,
|
|
6436
6433
|
args: [{ selector: 'core-service-header', standalone: true, imports: [
|
|
6437
6434
|
NgIf,
|
|
@@ -6488,10 +6485,10 @@ class StatusComponent {
|
|
|
6488
6485
|
};
|
|
6489
6486
|
}
|
|
6490
6487
|
}
|
|
6491
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
6492
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
6488
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: StatusComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
6489
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: StatusComponent, isStandalone: true, selector: "app-status", inputs: { form: "form" }, ngImport: i0, template: "<div [ngClass]=\"statusClass(form.header.status?.['key'])\">{{form.header.status?.['value']}}</div>\r\n", styles: ["@media only screen and (max-width: 767px){.status{display:none}.mobileStatus{display:block}}.status{font-size:14px;padding:5px 10px;border-radius:5px;color:#fff;margin-left:15px;float:right;margin-top:13px;cursor:default}.danger{background-color:#f44336}.success{background-color:#5cb85c}.warning{background-color:#ffc5191f!important;color:#ffc519!important;font-weight:500!important}.info{background-color:#1691f9}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
|
|
6493
6490
|
}
|
|
6494
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
6491
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: StatusComponent, decorators: [{
|
|
6495
6492
|
type: Component,
|
|
6496
6493
|
args: [{ selector: 'app-status', schemas: [CUSTOM_ELEMENTS_SCHEMA], standalone: true, imports: [
|
|
6497
6494
|
NgClass
|
|
@@ -6706,10 +6703,10 @@ class FormSectionComponent {
|
|
|
6706
6703
|
let statusStrategy = StatusMap[status] || StatusMap['default'];
|
|
6707
6704
|
return statusStrategy.icon;
|
|
6708
6705
|
}
|
|
6709
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
6710
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
6706
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: FormSectionComponent, deps: [{ token: CoreI18nService }, { token: CoreService }, { token: SidenavService }], target: i0.ɵɵFactoryTarget.Component });
|
|
6707
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", 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{min-width:var(--default-size, 45px)!important;width:var(--default-size, 45px)!important;height:var(--default-size, 45px)!important;padding:var(--avatar-padding, 0)!important;background-color:var(--avatar-bg, white);color:var(--avatar-color, black)!important;border:var(--avatar-border, 0)!important;border-radius:var(--avatar-radius, 50%)!important;margin:var(--avatar-margin, 0)!important;display:inline-flex;align-items:center;justify-content:center;overflow:hidden;--default-size: 25px}@media (min-width: 768px){:host ::ng-deep ds-avatar.user-avatar .avatar{--default-size: 31px;--avatar-border: 3px solid var(--light-gray)}}@media (min-width: 768px){:host ::ng-deep .user-avatar-name{padding-inline-end:1rem!important}}:host .circle-status::part(base){--status-radius: 50%;--status-size: 18px;--status-fs: 80% }:host .panel-title{min-width:40%;width:40%}@media (max-width: 576px){:host .panel-title{min-width:100%!important;width:100%!important}}:host .panel-user-status{min-width:60%;width:60%;display:flex;align-items:center;justify-content:space-between}@media (max-width: 576px){:host .panel-user-status{min-width:100%!important;width:100%!important}:host .panel-user-status .user-delegate{min-width:auto}:host .panel-user-status .main-status::part(base){--status-width: 50px}}\n"], dependencies: [{ kind: "ngmodule", type: MatExpansionModule }, { kind: "component", type: i2$5.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["hideToggle", "togglePosition"], outputs: ["afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "component", type: i2$5.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["expandedHeight", "collapsedHeight", "tabIndex"] }, { kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"], exportAs: ["ngComponentOutlet"] }, { 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$2.ComponentOutletInjectorDirective, selector: "[ngComponentOutlet]", exportAs: ["ndcComponentOutletInjector"] }] });
|
|
6711
6708
|
}
|
|
6712
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
6709
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: FormSectionComponent, decorators: [{
|
|
6713
6710
|
type: Component,
|
|
6714
6711
|
args: [{ selector: 'app-form-section', standalone: true, imports: [
|
|
6715
6712
|
MatExpansionModule,
|
|
@@ -6752,10 +6749,10 @@ class MainRequestDetailsComponent {
|
|
|
6752
6749
|
get isExpanded() {
|
|
6753
6750
|
return this.section?.body?.details?.['expandStage'] === 'true';
|
|
6754
6751
|
}
|
|
6755
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
6756
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
6752
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: MainRequestDetailsComponent, deps: [{ token: CoreI18nService }], target: i0.ɵɵFactoryTarget.Component });
|
|
6753
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: MainRequestDetailsComponent, isStandalone: true, selector: "app-main-request-details", inputs: { section: "section", lov: "lov", form: "form" }, ngImport: i0, template: "<mat-accordion class=\"primary-accordion main-request-accordion border-top\">\r\n <mat-expansion-panel\r\n [expanded]=\"isExpanded || form?.sections?.length === 1\"\r\n class=\"mb-3\"\r\n hideToggle\r\n #requestPanel=\"matExpansionPanel\"\r\n >\r\n <mat-expansion-panel-header>\r\n <h2 class=\"fs-16 fw-medium fc-coral m-0 flex-grow-1\">\r\n {{ i18n.translate(\"requestDetailsTitle\") }}\r\n </h2>\r\n @if (requestPanel.expanded) {\r\n <div class=\"d-inline-flex align-items-center gap-2\">\r\n <ds-icon icon=\"minus\" class=\"fs-20 fc-dark-gray\"></ds-icon>\r\n </div>\r\n } @else {\r\n <div class=\"d-inline-flex align-items-center gap-2\">\r\n <ds-icon icon=\"plus-1\" class=\"fs-20 fc-coral\"></ds-icon>\r\n </div>\r\n }\r\n </mat-expansion-panel-header>\r\n <section class=\"default-box box-shadow p-4 rounded-4\">\r\n <ng-content></ng-content>\r\n </section>\r\n </mat-expansion-panel>\r\n</mat-accordion>\r\n", styles: [".main-request-accordion{--accordion-height: 65px;--accordion-radius: 0 0 4px 4px;--accordion-shadow: 0 7px 10px rgba(var(--rgb-black), 3%);--accordion-border: 1px solid var(--light-gray);--accordion-border-active: 1px solid var(--gray);--panel-padding: 0 1.5rem;--panel-body-padding: 0 0 1.5rem;position:relative;z-index:1}@media (max-width: 576px){.main-request-accordion{--accordion-height: 55px;--panel-padding: 0 1rem;--panel-body-padding: 0 1rem 1rem}}.main-request-accordion .inner-accordion{--accordion-height: 44px;--accordion-bc: var(--light-gray);--accordion-bc-active: var(--white);--accordion-border: 1px solid var(--light-gray);--accordion-border-active: 1px solid var(--light-gray);--panel-body-padding: 0;--accordion-shadow: none;--panel-padding: 0 1.5rem}\n"], dependencies: [{ kind: "ngmodule", type: MatExpansionModule }, { kind: "directive", type: i2$5.MatAccordion, selector: "mat-accordion", inputs: ["hideToggle", "displayMode", "togglePosition"], exportAs: ["matAccordion"] }, { kind: "component", type: i2$5.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["hideToggle", "togglePosition"], outputs: ["afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "component", type: i2$5.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["expandedHeight", "collapsedHeight", "tabIndex"] }] });
|
|
6757
6754
|
}
|
|
6758
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
6755
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: MainRequestDetailsComponent, decorators: [{
|
|
6759
6756
|
type: Component,
|
|
6760
6757
|
args: [{ selector: 'app-main-request-details', standalone: true, schemas: [CUSTOM_ELEMENTS_SCHEMA], imports: [
|
|
6761
6758
|
MatExpansionModule,
|
|
@@ -6883,10 +6880,10 @@ class WorkflowSectionComponent {
|
|
|
6883
6880
|
}
|
|
6884
6881
|
});
|
|
6885
6882
|
}
|
|
6886
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
6887
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
6883
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: WorkflowSectionComponent, deps: [{ token: CoreI18nService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
6884
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: WorkflowSectionComponent, isStandalone: true, selector: "app-workflow-section", inputs: { sections: "sections", isReadOnly: "isReadOnly", isLoading: "isLoading", form: "form", contentClass: "contentClass", sectionsController: "sectionsController", segmentDynamicLoaderService: "segmentDynamicLoaderService", sectionFormComponent: "sectionFormComponent", sectionName: "sectionName" }, outputs: { sectionSubmitted: "sectionSubmitted" }, viewQueries: [{ propertyName: "formStateObject", first: true, predicate: ["f"], descendants: true }], ngImport: i0, template: "<form #f=\"ngForm\" autocomplete=\"off\">\r\n <div *ngIf=\"form?.header?.status?.key !== 'NEW' \" class=\"mt-n3\" id=\"accordion\" role=\"tablist\"\r\n aria-multiselectable=\"true\">\r\n <app-main-request-details [lov]=\"form?.lovs\" [form]=\"form\" [section]=\"form?.sections[0]\">\r\n <ng-container *ngTemplateOutlet=\"contentReqDet\"></ng-container>\r\n </app-main-request-details>\r\n <header class=\"header-line fs-12 fw-medium fc-dark-gray mt-sm-5 mt-4 mb-4\" *ngIf=\"form?.sections.length > 1\">\r\n {{i18n.translate('Approvals')}}\r\n </header>\r\n <mat-accordion class=\"primary-accordion main-approval\">\r\n <ng-container *ngFor=\"let section of form?.sections; let i = index\">\r\n <app-form-section *ngIf=\"i !== 0\" class=\"app-form-section\" [segmentDynamicLoaderService]=\"segmentDynamicLoaderService\" [section]=section [lov]=\"form?.lovs\"\r\n [isReadOnly]=\"section.header.readOnly\" [form]=\"form\" [controllers]=\"sectionsController\">\r\n </app-form-section>\r\n </ng-container>\r\n </mat-accordion>\r\n </div>\r\n\r\n <section *ngIf=\"form?.header?.status?.key === 'NEW' \" class=\"default-box box-shadow p-4 rounded-4\">\r\n <ng-container *ngTemplateOutlet=\"contentReqDet\"></ng-container>\r\n </section>\r\n\r\n</form>\r\n\r\n\r\n<ng-template #contentReqDet><ng-content></ng-content></ng-template>\r\n", styles: ["@charset \"UTF-8\";.primary-accordion{--accordion-height: auto;--indicator-bc: transparent;--indicator-bc-active: transparent;--indicator-icon: \"\\e9bc\";--indicator-icon-active: \"\\ea34\";--indicator-color: var(--coral);--indicator-color-active: var(--dark-gray);--accordion-radius: 4px;--accordion-border-active: 1px solid var(--gray);--accordion-shadow: 0 7px 10px 0 rgba(var(--rgb-black), 3%);--accordion-shadow-active: none;--panel-padding: 1.5rem;--panel-body-padding: 0 1.5rem 1.5rem}@media (max-width: 576px){.primary-accordion{--accordion-height: 110px;--panel-padding: 1.5rem 1rem;--panel-body-padding: 0 1rem 1rem}}.primary-accordion.main-approval{position:relative}.primary-accordion.main-approval:before{content:\"\";position:absolute;top:0;bottom:0;margin:2rem;width:1px;height:calc(100% - 2rem);background-color:var(--dark-gray);z-index:0}@media (max-width: 576px){.workflow-all-btns ds-button::part(base){--btn-padding: 0 .5rem;--btn-fs: .75rem;--btn-height: var(--default-size-sm);--btn-min-width: var(--default-size-sm)}}\n"], dependencies: [{ kind: "directive", type: MatAccordion, selector: "mat-accordion", inputs: ["hideToggle", "displayMode", "togglePosition"], exportAs: ["matAccordion"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: FormSectionComponent, selector: "app-form-section", inputs: ["requestDetails", "section", "form", "lov", "isReadOnly", "controllers", "segmentDynamicLoaderService", "sectionFormComponent", "sectionName"] }, { kind: "component", type: MainRequestDetailsComponent, selector: "app-main-request-details", inputs: ["section", "lov", "form"] }, { kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i4.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }] });
|
|
6888
6885
|
}
|
|
6889
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
6886
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: WorkflowSectionComponent, decorators: [{
|
|
6890
6887
|
type: Component,
|
|
6891
6888
|
args: [{ selector: 'app-workflow-section', schemas: [CUSTOM_ELEMENTS_SCHEMA], imports: [
|
|
6892
6889
|
NgClass,
|
|
@@ -6972,10 +6969,10 @@ class HeaderComponent {
|
|
|
6972
6969
|
this.sidenavService.sideNavOpened.next(!this.isSidenavOpened);
|
|
6973
6970
|
}
|
|
6974
6971
|
location = location;
|
|
6975
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
6976
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
6972
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: HeaderComponent, deps: [{ token: CoreI18nService }, { token: SidenavService }, { token: CoreService }, { token: i2$3.Router }, { token: PLATFORM_ID }], target: i0.ɵɵFactoryTarget.Component });
|
|
6973
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", 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}.main-logo{display:block;width:auto;height:30px;object-fit:contain}@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: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: RouterModule }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i4$1.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: i4$1.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i4$1.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: i5$1.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }] });
|
|
6977
6974
|
}
|
|
6978
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
6975
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: HeaderComponent, decorators: [{
|
|
6979
6976
|
type: Component,
|
|
6980
6977
|
args: [{ selector: 'app-header', standalone: true, imports: [
|
|
6981
6978
|
CommonModule,
|
|
@@ -7126,10 +7123,10 @@ class SideNavComponent {
|
|
|
7126
7123
|
}
|
|
7127
7124
|
this.router.navigate([url]);
|
|
7128
7125
|
}
|
|
7129
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
7130
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
7126
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SideNavComponent, deps: [{ token: SidenavService }, { token: i2$3.Router }], target: i0.ɵɵFactoryTarget.Component });
|
|
7127
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", 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$3.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"] }] });
|
|
7131
7128
|
}
|
|
7132
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
7129
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SideNavComponent, decorators: [{
|
|
7133
7130
|
type: Component,
|
|
7134
7131
|
args: [{ selector: 'app-side-nav', standalone: true, imports: [RouterLinkActive, RouterLink, MatTooltipModule, MatMenu, MatMenuTrigger], schemas: [CUSTOM_ELEMENTS_SCHEMA], template: "<aside>\r\n <div class=\"header d-flex d-lg-none\">\r\n <div class=\"d-flex h-100 mt-auto justify-content-between w-100\">\r\n <h1 class=\"fs-26 fw-bold fc-white logo\">academy</h1>\r\n <ds-button size=\"small\" color=\"purple\" class=\"close purple\" (click)=\"closeSidenav()\">\r\n <ds-icon icon=\"close\" class=\"fs-15 fc-white\"></ds-icon>\r\n </ds-button>\r\n </div>\r\n </div>\r\n <nav>\r\n <ul>\r\n <!-- (mouseenter)=\"menuMobile ? null : MenuTrigger.openMenu()\"-->\r\n <!-- (click)=\"goto(item.routerLink,item.matmenu) -->\r\n @for (item of Menu; track $index) {\r\n @if (item.matmenu) {\r\n <li\r\n (click)=\"closeSidenav();navigateTo(item)\" matTooltipPosition=\"right\" matTooltip=\"{{item.name }}\"\r\n [routerLinkActive]=\"'active'\" (click)=\"goto(item.routerLink!,item.matmenu)\" #MenuTrigger=\"matMenuTrigger\"\r\n [matMenuTriggerFor]=\"menuMenu\" [routerLinkActiveOptions]=\"{ exact: true }\" class=\"cursor-pointer\">\r\n <ds-icon icon=\"{{item.icon}}\" class=\"icon\"></ds-icon>\r\n <span class=\"menu-label\">\r\n {{ item.name }}\r\n </span>\r\n </li>\r\n <mat-menu #menuMenu=\"matMenu\" class=\"aside-menu visible-{{item.matmenu}}\">\r\n <app-mat-menu [title]=\"item.name \" [icon]=\"item.icon\" [list]=\"item.List\"></app-mat-menu>\r\n </mat-menu>\r\n } @else {\r\n <li\r\n (click)=\"closeSidenav();navigateTo(item)\" matTooltipPosition=\"right\" matTooltip=\"{{item.name }}\"\r\n [routerLinkActive]=\"'active'\" [routerLinkActiveOptions]=\"{ exact: true }\" class=\"cursor-pointer\">\r\n <ds-icon icon=\"{{item.icon}}\" class=\"icon\"></ds-icon>\r\n <span class=\"menu-label\">\r\n {{ item.name }}\r\n </span>\r\n </li>\r\n }\r\n }\r\n </ul>\r\n </nav>\r\n</aside>\r\n", styles: [":host ::ng-deep aside{min-width:var(--main-aside-width);width:var(--main-aside-width);height:calc(100vh - var(--main-toolbar-height));display:flex;position:var(--main-aside-position);right:var(--main-aside-right);left:var(--main-aside-left);top:var(--main-toolbar-height);z-index:var(--main-toolbar-zIndex);background-color:var(--main-aside-bc);transform:var(--main-aside-transform);transition:all .5s cubic-bezier(.685,.0473,.346,1)}@media (max-width: 1024px){:host ::ng-deep aside{height:100%;flex-direction:column;--main-toolbar-height: 0}}:host ::ng-deep aside nav{width:100%}:host ::ng-deep aside ul{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:20px;padding:0rem;margin:37px 0;list-style:none;counter-reset:itemCounter}:host ::ng-deep aside ul li{display:flex;align-items:center;flex-wrap:nowrap;overflow:hidden;max-width:calc(var(--main-aside-width-active) - 15px);width:100%;gap:var(--gap-width, 2.5rem);padding:3px 0 3px 10px;cursor:pointer;color:var(--main-aside-item-fc);border-radius:0;transition:var(--default-transition)}[dir=rtl] :host ::ng-deep aside ul li{padding:3px 10px 3px 0!important}@media (max-width: 1024px){@keyframes liAnimation{0%{transform:translateY(-500px)}to{transform:translateY(0)}}}:host ::ng-deep aside ul li.active,:host ::ng-deep aside ul li:hover{background-color:var(--main-aside-item-bc)}[dir=ltr] :host ::ng-deep aside ul li.active,[dir=ltr] :host ::ng-deep aside ul li:hover{border-left:5px solid var(--coral)}[dir=rtl] :host ::ng-deep aside ul li.active,[dir=rtl] :host ::ng-deep aside ul li:hover{border-right:5px solid var(--coral)}:host ::ng-deep aside ul li .menu-label{font-size:var(--main-aside-item-fs);flex-grow:1;opacity:1;min-width:calc(var(--main-aside-width-active) - 2rem - 40px);display:var(--main-aside-item-display)}:host ::ng-deep aside .header{background-color:#0003!important;padding:15px;flex-direction:row}:host ::ng-deep aside .header div{display:flex;align-items:center;margin-top:auto}:host ::ng-deep aside .footer{margin-top:auto;margin-bottom:80px;padding:0 30px}:host ::ng-deep aside ds-icon{font-size:1.55rem;display:inline-flex;align-items:center;justify-content:center;border-radius:3px;min-width:40px;width:40px;height:40px}:host ::ng-deep ds-button.close::part(base){height:37px;width:37px}:host ::ng-deep ds-button.close ds-icon{font-size:18px;min-width:18px;width:18px;height:18px}:host ::ng-deep .viewAll:hover{background-color:var(--purple)}:host ::ng-deep .viewAll:hover span{color:var(--white)}:host ::ng-deep .justify-content-between{justify-content:space-between}:host ::ng-deep .flex-column{flex-direction:column}:host ::ng-deep .d-flex{display:flex}:host ::ng-deep .w-100{width:100%}:host ::ng-deep .gap-3{gap:1rem!important}:host ::ng-deep ds-button.purple::part(base){--btn-border-color: var(--purple)}:host ::ng-deep ds-button.purple::part(overlay){--btn-overlay-color: var(--purple)}:host ::ng-deep ds-button.secondary::part(base){--btn-border-color: var(--secondary)}:host ::ng-deep ds-button.secondary::part(overlay){--btn-overlay-color: var(--secondary)}@media (min-width: 1024px){:host ::ng-deep .d-md-none{display:none!important}}@media (max-height: 430px){:host ::ng-deep aside .header{margin-bottom:50px}:host ::ng-deep aside nav{padding:15px 0 0;overflow:auto}:host ::ng-deep aside .footer{margin-bottom:20px}}@media (max-height: 300px){:host ::ng-deep aside .header{margin-bottom:5px}}:host ::ng-deep .logo{color:#fff}::ng-deep .aside-menu .mat-mdc-menu-content{border:none;box-shadow:none;padding:0!important}\n"] }]
|
|
7135
7132
|
}], ctorParameters: () => [{ type: SidenavService }, { type: i2$3.Router }], propDecorators: { isOpened: [{
|
|
@@ -7192,10 +7189,10 @@ class LayoutComponent {
|
|
|
7192
7189
|
closeSideNav() {
|
|
7193
7190
|
this.sidenav.close().then(r => { });
|
|
7194
7191
|
}
|
|
7195
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
7196
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
7192
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: LayoutComponent, deps: [{ token: DOCUMENT }, { token: i2$3.Router }, { token: SidenavService }], target: i0.ɵɵFactoryTarget.Component });
|
|
7193
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: LayoutComponent, isStandalone: true, selector: "core-layout", inputs: { form: "form", hubContainerMini: "hubContainerMini", 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]=\"hubContainerMini ? '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: "ngmodule", type: MatSidenavModule }, { kind: "component", type: i3$4.MatSidenav, selector: "mat-sidenav", inputs: ["fixedInViewport", "fixedTopGap", "fixedBottomGap"], exportAs: ["matSidenav"] }, { kind: "component", type: i3$4.MatSidenavContainer, selector: "mat-sidenav-container", exportAs: ["matSidenavContainer"] }, { kind: "component", type: i3$4.MatSidenavContent, selector: "mat-sidenav-content" }, { kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"], exportAs: ["ngComponentOutlet"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
|
|
7197
7194
|
}
|
|
7198
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
7195
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: LayoutComponent, decorators: [{
|
|
7199
7196
|
type: Component,
|
|
7200
7197
|
args: [{ selector: "core-layout", standalone: true, imports: [HeaderComponent, SideNavComponent, MatSidenavModule, RouterOutlet, NgComponentOutlet, WorkflowSectionComponent, ServiceHeaderComponent, NgClass, NgIf], 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]=\"hubContainerMini ? '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"] }]
|
|
7201
7198
|
}], ctorParameters: () => [{ type: Document, decorators: [{
|
|
@@ -7648,10 +7645,10 @@ class RequestDetailsSectionComponent {
|
|
|
7648
7645
|
this.pageNumber = event.pageIndex;
|
|
7649
7646
|
this.pageSize = event.pageSize;
|
|
7650
7647
|
}
|
|
7651
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
7652
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
7648
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: RequestDetailsSectionComponent, deps: [{ token: CoreI18nService }, { token: i4.FormBuilder }, { token: ActionStateService }], target: i0.ɵɵFactoryTarget.Component });
|
|
7649
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: RequestDetailsSectionComponent, isStandalone: true, selector: "app-request-details-section", inputs: { isReadOnly: "isReadOnly", section: "section", form: "form", lov: "lov", className: "className" }, ngImport: i0, template: "<div>\r\n <form [ngClass]=\"{'form-section-divide form-section':!section?.header?.readOnly,'info-section':section?.header?.readOnly}\" [formGroup]=\"formGroup\">\r\n\r\n <app-attachment-section\r\n class=\"section-item full\"\r\n [descriptionRequired]=\"false\"\r\n label=\"Attachment section\"\r\n [commentsRequired]=\"false\"\r\n [isReadOnly]=\"isReadOnly\"\r\n formControlName=\"attachmentSection\"></app-attachment-section>\r\n\r\n<!-- {{formGroup.valid}}-->\r\n<!-- <app-input class=\"section-item full\" [isReadOnly]=\"false\" [mandatory]=\"true\" [loading]=\"true\" type=\"enOnly\" formControlName=\"input\" label=\"Input\"></app-input>-->\r\n<!-- <app-checkbox\r\n class=\"section-item full\"\r\n [isReadOnly]=\"isReadOnly\"\r\n formControlName=\"checkbox\"\r\n termsLabel=\"Terms and conditions\"\r\n label=\"check-box\"\r\n [containTerms]=\"true\"></app-checkbox>-->\r\n <!--\r\n <app-search-employee\r\n class=\"section-item full\"\r\n [multiple]=\"true\"\r\n [arrayList]=\"formGroup.get('searchEmployee').value\"\r\n [isReadOnly]=\"isReadOnly\"\r\n formControlName=\"searchEmployee\"\r\n label=\"Search-employee\"></app-search-employee>\r\n <app-input class=\"section-item full\" [isReadOnly]=\"isReadOnly\" [loading]=\"true\" type=\"enOnly\" formControlName=\"input\" label=\"Input\"></app-input>\r\n <app-input-currency class=\"section-item full\" [isReadOnly]=\"isReadOnly\" formControlName=\"currencyInput\" label=\"currency\"></app-input-currency>\r\n <app-input-email class=\"section-item full\" [isReadOnly]=\"isReadOnly\" formControlName=\"emailInput\" label=\"email\"></app-input-email>\r\n <app-input-number class=\"section-item full\" [isReadOnly]=\"isReadOnly\" formControlName=\"numberInput\" label=\"number\"></app-input-number>\r\n <app-custom-searchable\r\n class=\"section-item mb-0 full\"\r\n [isReadOnly]=\"isReadOnly\"\r\n formControlName=\"customSearchable\"\r\n label=\"Custom-searchable\"\r\n [options]=\"lov?.['approverActions']?.options\"\r\n [displayedLabel]=\"'name'\"\r\n [key]=\"'name'\"></app-custom-searchable>\r\n <app-checkbox\r\n class=\"section-item full\"\r\n [isReadOnly]=\"isReadOnly\"\r\n formControlName=\"checkbox\"\r\n termsLabel=\"Terms and conditions\"\r\n label=\"check-box\"\r\n [containTerms]=\"true\"></app-checkbox>\r\n <app-textarea class=\"section-item full\" [isReadOnly]=\"isReadOnly\" formControlName=\"textArea\" label=\"Text-area\"></app-textarea>\r\n\r\n <app-date-range-picker\r\n class=\"section-item full\"\r\n [isReadOnly]=\"isReadOnly\"\r\n formControlName=\"datePickerRange\"\r\n label=\"Date-picker-range\"\r\n [matSuffix]=\"true\"></app-date-range-picker>\r\n <app-radio class=\"section-item full\" [isReadOnly]=\"isReadOnly\" formControlName=\"radio\" [options]=\"options\" label=\"Radio\"></app-radio>-->\r\n <!-- <app-toggle-button\r\n class=\"section-item full\"\r\n [isReadOnly]=\"isReadOnly\"\r\n formControlName=\"toggle\"\r\n [options]=\"lov?.['decision']?.options\"\r\n label=\"Toggle-button\"\r\n [displayedLabel]=\"'description'\"\r\n [key]=\"'value'\"></app-toggle-button>-->\r\n <!--<app-input-telephone class=\"section-item full\" [isReadOnly]=\"isReadOnly\" formControlName=\"telephone\" label=\"Telephone\"></app-input-telephone>\r\n\r\n <app-file-uploader\r\n class=\"section-item full\"\r\n [callApi]=\"true\"\r\n [isReadOnly]=\"isReadOnly\"\r\n [multiple]=\"false\"\r\n label=\"attachment\"\r\n formControlName=\"attachment\"></app-file-uploader>\r\n\r\n <app-attachment-section\r\n class=\"section-item full\"\r\n [descriptionRequired]=\"false\"\r\n label=\"Attachment section\"\r\n [commentsRequired]=\"false\"\r\n [isReadOnly]=\"isReadOnly\"\r\n formControlName=\"attachmentSection\"></app-attachment-section>\r\n-->\r\n\r\n\r\n\r\n <!-- <app-table\r\n [columnsConfig]=\"columnsConfig\"\r\n [columns]=\"columns\"\r\n [isError]=\"isError\"\r\n [isLoading]=\"isLoading\"\r\n [rows]=\"categoryData\" [hasPaginator]=\"true\"\r\n [pageSize]=\"pageSize\" [currentPage]=\"pageNumber\"\r\n [totalElements]=\"totalElements\"\r\n (pageChange)=\"pageChanged($event)\"\r\n class=\"new-primary-table full\">\r\n </app-table> -->\r\n\r\n<!-- <app-datepicker\r\n class=\"section-item full\"\r\n [isReadOnly]=\"false\"\r\n formControlName=\"datePicker\"\r\n [matSuffix]=\"true\"\r\n label=\"Date-picker\"></app-datepicker>-->\r\n\r\n\r\n </form>\r\n\r\n\r\n</div>\r\n@if (!section?.header?.readOnly) {\r\n <div class=\"mt-4\">\r\n <lib-action-buttons\r\n [lovOptions]=\"lov?.['decision']?.options\"\r\n [lovType]=\"lov?.['decision']?.type\"\r\n [section]=\"section\"\r\n [form]=\"form\"\r\n [sections]=\"form.sections\"\r\n [showApprovalCycle]=\"true\"\r\n [customCall]=\"false\"\r\n [fieldsForm]=\"formGroup\"\r\n (customCallEmit)=\"customCallSubmit($event)\"\r\n (resetFormEmit)=\"resetForm()\"\r\n />\r\n </div>\r\n}\r\n", styles: [".form-section-divide{--form-section-columns: 1fr 1fr}@media (max-width: 756px){.form-section-divide{--form-section-columns: 100%}}.form-section-divide .full{grid-column:1/-1}.head-title{position:relative;margin-bottom:12px}.head-title h3{display:inline-block;color:#8e9aa0;font-size:14px;font-weight:500;background-color:#fff;padding-inline-end:20px;position:relative;z-index:2;margin:0}.head-title:after{content:\"\";position:absolute;width:100%;height:1px;background-color:#dee0e2;top:50%;left:0;right:0;transform:translateY(-50%);z-index:1}.chamber{margin-bottom:20px}.chamber .chamber-content{background-color:#f8f8f8;padding:20px}.chamber .chamber-content .chamber-select{display:flex}.chamber .chamber-content mat-checkbox{font-size:14px}.section-item{margin-bottom:20px}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ActionButtonsComponent, selector: "lib-action-buttons", inputs: ["lovOptions", "lovType", "fieldsForm", "form", "section", "sections", "showApprovalCycle", "customCall"], outputs: ["resetFormEmit", "customCallEmit"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: AttachmentSectionComponent, selector: "app-attachment-section", inputs: ["className", "customDownload", "attachmentsMax", "isSortable", "downloadAll", "isRequired", "descriptionRequired", "commentsRequired", "allowedExtensions"], outputs: ["downloadActionClicked", "emitedValue"] }] });
|
|
7653
7650
|
}
|
|
7654
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
7651
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: RequestDetailsSectionComponent, decorators: [{
|
|
7655
7652
|
type: Component,
|
|
7656
7653
|
args: [{ selector: 'app-request-details-section', standalone: true, schemas: [CUSTOM_ELEMENTS_SCHEMA, NO_ERRORS_SCHEMA], imports: [
|
|
7657
7654
|
NgClass,
|
|
@@ -7740,10 +7737,10 @@ class GeneralApproverSectionComponent {
|
|
|
7740
7737
|
resetForm() {
|
|
7741
7738
|
this.fieldsForm.reset();
|
|
7742
7739
|
}
|
|
7743
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
7744
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
7740
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: GeneralApproverSectionComponent, deps: [{ token: CoreI18nService }, { token: i4.FormBuilder }, { token: ActionStateService }], target: i0.ɵɵFactoryTarget.Component });
|
|
7741
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: GeneralApproverSectionComponent, isStandalone: true, selector: "app-general-approver-section", inputs: { isReadOnly: "isReadOnly", section: "section", form: "form", lov: "lov", className: "className" }, ngImport: i0, template: "<div>\r\n <form [ngClass]=\"{'form-section-divide form-section':!section?.header?.readOnly,'info-section':section?.header?.readOnly}\"\r\n [formGroup]=\"formGroup\">\r\n\r\n <app-textarea class=\"section-item\" formControlName=\"comment\" [label]=\"'comment'\" [required]=\"false\"\r\n [isReadOnly]=\"section?.header?.readOnly\">\r\n </app-textarea>\r\n\r\n </form>\r\n</div>\r\n\r\n\r\n@if (!section?.header?.readOnly) {\r\n<div class=\"mt-4\">\r\n <lib-action-buttons [lovOptions]=\"lov?.['decision']?.options\" [lovType]=\"lov?.['decision']?.type\" [section]=\"section\"\r\n [form]=\"form\" [sections]=\"form.sections\" [showApprovalCycle]=\"true\" [customCall]=\"false\" [fieldsForm]=\"formGroup\"\r\n (customCallEmit)=\"customCallSubmit($event)\" (resetFormEmit)=\"resetForm()\" />\r\n</div>\r\n}\r\n", styles: [".form-section-divide{--form-section-columns: 1fr 1fr}@media (max-width: 756px){.form-section-divide{--form-section-columns: 100%}}.form-section-divide .full{grid-column:1/-1}.head-title{position:relative;margin-bottom:12px}.head-title h3{display:inline-block;color:#8e9aa0;font-size:14px;font-weight:500;background-color:#fff;padding-inline-end:20px;position:relative;z-index:2;margin:0}.head-title:after{content:\"\";position:absolute;width:100%;height:1px;background-color:#dee0e2;top:50%;left:0;right:0;transform:translateY(-50%);z-index:1}.chamber{margin-bottom:20px}.chamber .chamber-content{background-color:#f8f8f8;padding:20px}.chamber .chamber-content .chamber-select{display:flex}.chamber .chamber-content mat-checkbox{font-size:14px}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ActionButtonsComponent, selector: "lib-action-buttons", inputs: ["lovOptions", "lovType", "fieldsForm", "form", "section", "sections", "showApprovalCycle", "customCall"], outputs: ["resetFormEmit", "customCallEmit"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: TextareaComponent, selector: "app-textarea", inputs: ["className", "preventSpecailChar"] }] });
|
|
7745
7742
|
}
|
|
7746
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
7743
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: GeneralApproverSectionComponent, decorators: [{
|
|
7747
7744
|
type: Component,
|
|
7748
7745
|
args: [{ selector: 'app-general-approver-section', standalone: true, schemas: [CUSTOM_ELEMENTS_SCHEMA, NO_ERRORS_SCHEMA], imports: [
|
|
7749
7746
|
NgClass,
|
|
@@ -7800,10 +7797,10 @@ class I18nService {
|
|
|
7800
7797
|
getLanguage() {
|
|
7801
7798
|
return this.language;
|
|
7802
7799
|
}
|
|
7803
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
7804
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
7800
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: I18nService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
7801
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: I18nService, providedIn: 'any' });
|
|
7805
7802
|
}
|
|
7806
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
7803
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: I18nService, decorators: [{
|
|
7807
7804
|
type: Injectable,
|
|
7808
7805
|
args: [{
|
|
7809
7806
|
providedIn: 'any',
|
|
@@ -7848,10 +7845,10 @@ class SegmentDynamicLoaderService {
|
|
|
7848
7845
|
return 'sectionGeneralApproval';
|
|
7849
7846
|
}
|
|
7850
7847
|
}
|
|
7851
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
7852
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
7848
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SegmentDynamicLoaderService, deps: [{ token: I18nService }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
7849
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SegmentDynamicLoaderService, providedIn: 'any' });
|
|
7853
7850
|
}
|
|
7854
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
7851
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SegmentDynamicLoaderService, decorators: [{
|
|
7855
7852
|
type: Injectable,
|
|
7856
7853
|
args: [{
|
|
7857
7854
|
providedIn: 'any',
|
|
@@ -7900,14 +7897,14 @@ class CoreAppComponent {
|
|
|
7900
7897
|
document.documentElement.setAttribute('dir', direction);
|
|
7901
7898
|
}
|
|
7902
7899
|
}
|
|
7903
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
7904
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
7900
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: CoreAppComponent, deps: [{ token: SegmentDynamicLoaderService }, { token: DOCUMENT }, { token: i2$3.Router }, { token: SidenavService }, { token: CoreI18nService }, { token: CoreService }, { token: PLATFORM_ID }], target: i0.ɵɵFactoryTarget.Component });
|
|
7901
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: CoreAppComponent, isStandalone: true, selector: "lib-app", providers: [
|
|
7905
7902
|
{ provide: DynamicComponentInjectorToken, useValue: { /* your value here */} }
|
|
7906
7903
|
], ngImport: i0, template: "<core-layout>\r\n @if (!loading['form']) {\r\n\r\n @if (noError) {\r\n <core-service-header\r\n [isLoading]=\"false\"\r\n [formTitle]=\"formTitle\"\r\n [isReadOnly]=\"form.sections[0].header.readOnly\"\r\n [form]=\"form\">\r\n </core-service-header>\r\n <app-workflow-section\r\n workflow\r\n [segmentDynamicLoaderService]=\"segmentDynamicLoader\"\r\n [form]=\"form\" [sections]=\"form?.['sections']\">\r\n <app-request-details-section\r\n [section]=\"form.sections[0]\" [form]=\"form\" [lov]=\"form?.lovs\" className=\"form-section\"\r\n [isReadOnly]=\"form.sections[0].header.readOnly\"></app-request-details-section>\r\n </app-workflow-section>\r\n } @else {\r\n @if (errorMessage?.length) {\r\n <ds-message></ds-message>\r\n @for (item of errorMessage; track $index) {\r\n <div class=\"d-flex justify-content-center\">\r\n <span class=\"fc-coral fs-18\" >{{ item?.['message'] }}</span>\r\n </div>\r\n }\r\n } @else {\r\n <ds-message [label]=\"'pageErrorLoading' | translate\"></ds-message>\r\n }\r\n }\r\n } @else {\r\n <core-service-header header [formTitle]=\"formTitle\" [isLoading]=\"true\">\r\n </core-service-header>\r\n }\r\n</core-layout>\r\n", styles: [""], dependencies: [{ kind: "component", type:
|
|
7907
7904
|
// DynamicModule,
|
|
7908
7905
|
LayoutComponent, selector: "core-layout", inputs: ["form", "hubContainerMini", "formTitle", "isLoading", "serviceBrief"] }, { kind: "component", type: ServiceHeaderComponent, selector: "core-service-header", inputs: ["form", "showHistory", "isLoading", "isReadOnly", "showApprovalHistory", "approvalHistory", "creationDate", "formTitle", "section", "serviceFaq"] }, { kind: "component", type: WorkflowSectionComponent, selector: "app-workflow-section", inputs: ["sections", "isReadOnly", "isLoading", "form", "contentClass", "sectionsController", "segmentDynamicLoaderService", "sectionFormComponent", "sectionName"], outputs: ["sectionSubmitted"] }, { kind: "component", type: RequestDetailsSectionComponent, selector: "app-request-details-section", inputs: ["isReadOnly", "section", "form", "lov", "className"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] });
|
|
7909
7906
|
}
|
|
7910
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
7907
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: CoreAppComponent, decorators: [{
|
|
7911
7908
|
type: Component,
|
|
7912
7909
|
args: [{ selector: 'lib-app', standalone: true, imports: [
|
|
7913
7910
|
// DynamicModule,
|
|
@@ -8193,10 +8190,10 @@ class TextDirective {
|
|
|
8193
8190
|
event.preventDefault();
|
|
8194
8191
|
}
|
|
8195
8192
|
}
|
|
8196
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
8197
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
8193
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: TextDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
|
|
8194
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.1", type: TextDirective, isStandalone: true, selector: "[textOnly]", inputs: { decimals: "decimals" }, host: { listeners: { "keydown": "onKeyDown($event)", "paste": "onPaste($event)" } }, ngImport: i0 });
|
|
8198
8195
|
}
|
|
8199
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
8196
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: TextDirective, decorators: [{
|
|
8200
8197
|
type: Directive,
|
|
8201
8198
|
args: [{
|
|
8202
8199
|
selector: "[textOnly]"
|
|
@@ -8215,10 +8212,10 @@ class stringToBooleanPipe {
|
|
|
8215
8212
|
transform(value) {
|
|
8216
8213
|
return Boolean(value);
|
|
8217
8214
|
}
|
|
8218
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
8219
|
-
static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "
|
|
8215
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: stringToBooleanPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
|
|
8216
|
+
static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.1", ngImport: i0, type: stringToBooleanPipe, isStandalone: true, name: "stringToBoolean" });
|
|
8220
8217
|
}
|
|
8221
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
8218
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: stringToBooleanPipe, decorators: [{
|
|
8222
8219
|
type: Pipe,
|
|
8223
8220
|
args: [{
|
|
8224
8221
|
name: "stringToBoolean"
|
|
@@ -8232,10 +8229,10 @@ class FormatTimePipe {
|
|
|
8232
8229
|
":" +
|
|
8233
8230
|
("00" + Math.floor(value - minutes * 60)).slice(-2));
|
|
8234
8231
|
}
|
|
8235
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
8236
|
-
static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "
|
|
8232
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: FormatTimePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
|
|
8233
|
+
static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.1", ngImport: i0, type: FormatTimePipe, isStandalone: true, name: "formatTime" });
|
|
8237
8234
|
}
|
|
8238
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
8235
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: FormatTimePipe, decorators: [{
|
|
8239
8236
|
type: Pipe,
|
|
8240
8237
|
args: [{
|
|
8241
8238
|
name: "formatTime"
|