mmhglobal-dynamicform 2.28.6 → 2.29.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +9 -0
- package/esm2020/lib/embed-components/processing-record-loader/processing-record-loader.component.mjs +2 -2
- package/esm2020/lib/kscrollview/kscrollview.component.mjs +2 -2
- package/esm2020/lib/mmhglobal-dynamicform.module.mjs +17 -8
- package/esm2020/lib/services/main.service.mjs +19 -4
- package/esm2020/lib/services/zcomponent.debug.service.mjs +3 -3
- package/esm2020/lib/services/zcomponent.service.mjs +2 -2
- package/esm2020/lib/sfdatetimepicker/sfdatetimepicker.component.mjs +51 -0
- package/esm2020/lib/uiheader/uiheader.component.mjs +2 -2
- package/esm2020/lib/zbuttons/zbuttons.component.mjs +17 -4
- package/esm2020/lib/zdatetime/dateKendoFormatParser.pipe.mjs +2 -1
- package/esm2020/lib/zdatetime/zdatetime.component.mjs +11 -7
- package/esm2020/lib/zform/zform.component.mjs +2 -2
- package/esm2020/lib/zinput-container/zinput-container.component.mjs +22 -20
- package/esm2020/lib/zinput-container/zinput-container.pipe.mjs +4 -3
- package/esm2020/lib/ztreelist/ztreelist.component.mjs +3 -3
- package/esm2020/lib/zupload/zupload.component.mjs +6 -7
- package/esm2020/public-api.mjs +2 -1
- package/fesm2015/mmhglobal-dynamicform.mjs +137 -53
- package/fesm2015/mmhglobal-dynamicform.mjs.map +1 -1
- package/fesm2020/mmhglobal-dynamicform.mjs +137 -53
- package/fesm2020/mmhglobal-dynamicform.mjs.map +1 -1
- package/lib/mmhglobal-dynamicform.module.d.ts +41 -39
- package/lib/services/zcomponent.debug.service.d.ts +1 -1
- package/lib/sfdatetimepicker/sfdatetimepicker.component.d.ts +23 -0
- package/lib/zdatetime/zdatetime.component.d.ts +2 -1
- package/lib/zinput-container/zinput-container.component.d.ts +1 -0
- package/lib/zinput-container/zinput-container.pipe.d.ts +1 -0
- package/package.json +1 -1
- package/public-api.d.ts +1 -0
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { Injectable, Directive, Inject, Input, HostListener, Pipe, Component, ViewContainerRef, TemplateRef, ViewChild, ViewChildren, EventEmitter, Output, NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
|
|
2
|
+
import { Injectable, Directive, Inject, Input, HostListener, Pipe, Component, ViewContainerRef, TemplateRef, ViewChild, ViewChildren, EventEmitter, Output, ViewEncapsulation, NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
|
|
3
3
|
import { HttpParams, HttpEventType } from '@angular/common/http';
|
|
4
4
|
import * as i1 from '@angular/router';
|
|
5
5
|
import { NavigationStart, NavigationEnd, NavigationError, RouterModule } from '@angular/router';
|
|
@@ -32,6 +32,8 @@ import { QueryBuilderModule } from 'angular2-query-builder';
|
|
|
32
32
|
import { FlexLayoutModule } from '@angular/flex-layout';
|
|
33
33
|
import * as i3$a from '@syncfusion/ej2-angular-querybuilder';
|
|
34
34
|
import { QueryBuilderModule as QueryBuilderModule$1 } from '@syncfusion/ej2-angular-querybuilder';
|
|
35
|
+
import * as i2$9 from '@syncfusion/ej2-angular-calendars';
|
|
36
|
+
import { DateTimePickerModule } from '@syncfusion/ej2-angular-calendars';
|
|
35
37
|
import * as i2$8 from '@progress/kendo-angular-gauges';
|
|
36
38
|
import { ArcGaugeModule } from '@progress/kendo-angular-gauges';
|
|
37
39
|
import * as i3$3 from '@progress/kendo-angular-buttons';
|
|
@@ -42,7 +44,7 @@ import * as i2$3 from '@progress/kendo-angular-dateinputs';
|
|
|
42
44
|
import { CalendarModule, DateInputsModule } from '@progress/kendo-angular-dateinputs';
|
|
43
45
|
import * as i6$1 from '@progress/kendo-angular-dropdowns';
|
|
44
46
|
import { DropDownsModule } from '@progress/kendo-angular-dropdowns';
|
|
45
|
-
import * as i2$
|
|
47
|
+
import * as i2$a from '@progress/kendo-angular-editor';
|
|
46
48
|
import { EditorModule } from '@progress/kendo-angular-editor';
|
|
47
49
|
import { FilterModule } from '@progress/kendo-angular-filter';
|
|
48
50
|
import { IndicatorsModule } from '@progress/kendo-angular-indicators';
|
|
@@ -50,7 +52,7 @@ import * as i5$1 from '@progress/kendo-angular-intl';
|
|
|
50
52
|
import { IntlModule } from '@progress/kendo-angular-intl';
|
|
51
53
|
import * as i3$5 from '@progress/kendo-angular-inputs';
|
|
52
54
|
import { InputsModule, SwitchModule, TextBoxModule, ColorPickerModule } from '@progress/kendo-angular-inputs';
|
|
53
|
-
import * as
|
|
55
|
+
import * as i16 from '@progress/kendo-angular-label';
|
|
54
56
|
import { LabelModule } from '@progress/kendo-angular-label';
|
|
55
57
|
import * as i2$5 from '@progress/kendo-angular-layout';
|
|
56
58
|
import { DrawerComponent, SplitterComponent, LayoutModule, PanelBarModule, TabStripModule } from '@progress/kendo-angular-layout';
|
|
@@ -58,7 +60,7 @@ import * as i3$2 from '@progress/kendo-angular-notification';
|
|
|
58
60
|
import { NotificationModule } from '@progress/kendo-angular-notification';
|
|
59
61
|
import * as i2$4 from '@progress/kendo-angular-popup';
|
|
60
62
|
import { PopupModule } from '@progress/kendo-angular-popup';
|
|
61
|
-
import * as i2$
|
|
63
|
+
import * as i2$c from '@progress/kendo-angular-progressbar';
|
|
62
64
|
import { ProgressBarModule } from '@progress/kendo-angular-progressbar';
|
|
63
65
|
import * as i3$9 from '@progress/telerik-angular-report-viewer';
|
|
64
66
|
import { TelerikReportingModule } from '@progress/telerik-angular-report-viewer';
|
|
@@ -66,7 +68,7 @@ import * as i3$1 from '@progress/kendo-angular-scheduler';
|
|
|
66
68
|
import { SchedulerModule } from '@progress/kendo-angular-scheduler';
|
|
67
69
|
import * as i4$2 from '@progress/kendo-angular-treelist';
|
|
68
70
|
import { TreeListModule } from '@progress/kendo-angular-treelist';
|
|
69
|
-
import * as i2$
|
|
71
|
+
import * as i2$b from '@progress/kendo-angular-treeview';
|
|
70
72
|
import { TreeViewModule } from '@progress/kendo-angular-treeview';
|
|
71
73
|
import * as i7$2 from '@progress/kendo-angular-tooltip';
|
|
72
74
|
import { TooltipDirective, TooltipModule, PopoverModule } from '@progress/kendo-angular-tooltip';
|
|
@@ -91,7 +93,7 @@ import { MultiSelect, DropDownList } from '@syncfusion/ej2-dropdowns';
|
|
|
91
93
|
import { createElement, getComponent } from '@syncfusion/ej2-base';
|
|
92
94
|
import { Query } from '@syncfusion/ej2-data';
|
|
93
95
|
import { CheckBox } from '@syncfusion/ej2-buttons';
|
|
94
|
-
import * as i2$
|
|
96
|
+
import * as i2$d from '@progress/kendo-angular-scrollview';
|
|
95
97
|
import { ScrollViewModule } from '@progress/kendo-angular-scrollview';
|
|
96
98
|
|
|
97
99
|
/********** Angular **********/
|
|
@@ -157,7 +159,7 @@ class ZComponentDebugService {
|
|
|
157
159
|
treeNodesCollapseAll: this.treeNodesCollapseAll,
|
|
158
160
|
refreshTreeModel: this.refreshTreeModel,
|
|
159
161
|
addNode: this.addNode,
|
|
160
|
-
refreshActivityLogData: this.
|
|
162
|
+
refreshActivityLogData: this.loadGridData.bind(this),
|
|
161
163
|
GoToFieldElement: this.gotoFieldElement.bind(this),
|
|
162
164
|
ListWatchName: this.listWatchName.bind(this),
|
|
163
165
|
onChangeWatchName: this.onChangeWatchName.bind(this),
|
|
@@ -342,7 +344,7 @@ class ZComponentDebugService {
|
|
|
342
344
|
this.debug.zModel['DebugWatchName'] = newValue;
|
|
343
345
|
ZComponentHelper.setModelValue('WatchName', newValue, this.debug, true);
|
|
344
346
|
}
|
|
345
|
-
|
|
347
|
+
loadGridData() {
|
|
346
348
|
const activityLogGrid = ZComponentHelper.getComponent(this.debug, 'zgrid_ActivityLogGrid');
|
|
347
349
|
if (activityLogGrid) {
|
|
348
350
|
activityLogGrid.setData(this.debug.zData.collectedActivities);
|
|
@@ -1354,7 +1356,12 @@ class MainService {
|
|
|
1354
1356
|
}), switchMap(() => {
|
|
1355
1357
|
const newModel = Object.assign({}, group.zModel);
|
|
1356
1358
|
ZComponentHelper.removeNullFields(newModel);
|
|
1357
|
-
|
|
1359
|
+
const webApiAdditionalDetail = {
|
|
1360
|
+
buttonDetail: event,
|
|
1361
|
+
group: group,
|
|
1362
|
+
triggerFrom: event ? event.triggerFrom : undefined
|
|
1363
|
+
};
|
|
1364
|
+
return this.webApiService.httpPost$(group.resourceURL, newModel, webApiAdditionalDetail).pipe(tap((resp) => {
|
|
1358
1365
|
createModelres = resp;
|
|
1359
1366
|
return resp;
|
|
1360
1367
|
}), tap((res) => {
|
|
@@ -1400,7 +1407,12 @@ class MainService {
|
|
|
1400
1407
|
}
|
|
1401
1408
|
return of(false);
|
|
1402
1409
|
}
|
|
1403
|
-
|
|
1410
|
+
const webApiAdditionalDetail = {
|
|
1411
|
+
buttonDetail: event,
|
|
1412
|
+
group: group,
|
|
1413
|
+
triggerFrom: event ? event.triggerFrom : undefined
|
|
1414
|
+
};
|
|
1415
|
+
updateAPIObservable = updateAPIObservable || this.webApiService.httpPut$(`${group.resourceURL}/${group.zModel.Id}`, group.zModel, webApiAdditionalDetail).pipe(tap((res) => {
|
|
1404
1416
|
this.handleSuccess(res, resMessage);
|
|
1405
1417
|
}
|
|
1406
1418
|
//this.handleSuccess(res, "Record is updated successfully.")
|
|
@@ -1489,8 +1501,13 @@ class MainService {
|
|
|
1489
1501
|
Object.assign(group.zModel, fg.value);
|
|
1490
1502
|
group.zModel.Disabled = true;
|
|
1491
1503
|
let tempResponse = {};
|
|
1504
|
+
const webApiAdditionalDetail = {
|
|
1505
|
+
buttonDetail: event,
|
|
1506
|
+
group: group,
|
|
1507
|
+
triggerFrom: event ? event.triggerFrom : undefined
|
|
1508
|
+
};
|
|
1492
1509
|
return this.webApiService
|
|
1493
|
-
.httpPut$(`${group.resourceURL}/${group.zModel.Id}`, group.zModel,
|
|
1510
|
+
.httpPut$(`${group.resourceURL}/${group.zModel.Id}`, group.zModel, webApiAdditionalDetail)
|
|
1494
1511
|
.pipe(tap((res) => {
|
|
1495
1512
|
tempResponse = Object.assign({}, res);
|
|
1496
1513
|
this.handleSuccess(res, resMessage);
|
|
@@ -1914,7 +1931,7 @@ class ZComponentService {
|
|
|
1914
1931
|
this.fieldService = fieldService;
|
|
1915
1932
|
this.DEFAULT_ISEDIT = true;
|
|
1916
1933
|
//#region DateTime Conversion
|
|
1917
|
-
this.timePickerDateType = ['zuidatetime', 'ztime', 'zuitime'];
|
|
1934
|
+
this.timePickerDateType = ['zuidatetime', 'ztime', 'zuitime', 'sfdatetimepicker'];
|
|
1918
1935
|
this.environment = this.zcoreService.getEnvironment();
|
|
1919
1936
|
}
|
|
1920
1937
|
isSkipComponentType(componentType) {
|
|
@@ -3430,6 +3447,7 @@ class ZInputParser {
|
|
|
3430
3447
|
this.webApiService = webApiService;
|
|
3431
3448
|
this.componentService = componentService;
|
|
3432
3449
|
this.zdate_type = ['zdate', 'ztime', 'zdatetime', 'zshortdate', 'zuidatetime', 'zuitime'];
|
|
3450
|
+
this.sfdatetimepicker_type = ['sfdatetimepicker'];
|
|
3433
3451
|
this.zcheckbox_type = ['checkbox'];
|
|
3434
3452
|
this.zselect_type = ['zuiselectmultiple', 'zuiselectmultiple_button', 'select'];
|
|
3435
3453
|
this.nullValueDefaultDisplayText = "-";
|
|
@@ -3439,7 +3457,7 @@ class ZInputParser {
|
|
|
3439
3457
|
if (!value) {
|
|
3440
3458
|
return of(this.nullValueDefaultDisplayText);
|
|
3441
3459
|
}
|
|
3442
|
-
if (this.zdate_type.includes(data.Type)) {
|
|
3460
|
+
if (this.zdate_type.includes(data.Type) || this.sfdatetimepicker_type.includes(data.Type)) {
|
|
3443
3461
|
return of(this.transformTimeValue(value, data));
|
|
3444
3462
|
}
|
|
3445
3463
|
else if (this.zcheckbox_type.includes(data.Type)) {
|
|
@@ -3474,7 +3492,7 @@ class ZInputParser {
|
|
|
3474
3492
|
if (dateType === "ztime") {
|
|
3475
3493
|
return "hh:mm";
|
|
3476
3494
|
}
|
|
3477
|
-
else if (dateType === "zuidatetime") {
|
|
3495
|
+
else if (dateType === "zuidatetime" || dateType === "sfdatetimepicker") {
|
|
3478
3496
|
return "dd-MMM-yyyy h:mm a";
|
|
3479
3497
|
}
|
|
3480
3498
|
else if (dateType === "zuitime") {
|
|
@@ -3900,6 +3918,7 @@ class DateKendoFormatParser {
|
|
|
3900
3918
|
case "zshortdate":
|
|
3901
3919
|
return "MMM-yyyy";
|
|
3902
3920
|
case "zuidatetime":
|
|
3921
|
+
case "sfdatetimepicker":
|
|
3903
3922
|
return "dd-MMM-yyyy hh:mm a";
|
|
3904
3923
|
default:
|
|
3905
3924
|
return "dd-MMM-yyyy";
|
|
@@ -4764,10 +4783,10 @@ class UiheaderComponent {
|
|
|
4764
4783
|
}
|
|
4765
4784
|
}
|
|
4766
4785
|
UiheaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: UiheaderComponent, deps: [{ token: i1.Router }, { token: i2.TranslationService }, { token: i2.ZCoreService }, { token: i2.AuthService }, { token: i2.FontAweSomeService }, { token: ZComponentService }], target: i0.ɵɵFactoryTarget.Component });
|
|
4767
|
-
UiheaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.3", type: UiheaderComponent, selector: "app-uiheader", inputs: { group: "group", topFormHeader: "topFormHeader" }, ngImport: i0, template: "<ion-header>\r\n <ion-toolbar>\r\n <div class=\"toolbar-container\" *ngIf=\"!isloading\">\r\n <div class=\"toolbar-first-row\">\r\n <app-uimenubutton slot=\"start\" [group]=\"group\"></app-uimenubutton>\r\n\r\n <ion-title class=\"toolbar-title\">\r\n <div *ngIf=\"topFormHeader || (group && !group.isLoading && group.formHeader)\">\r\n <ion-label class=\"toolbar-title-label\">{{ topFormHeader ? topFormHeader : group.formHeader }}</ion-label>\r\n </div>\r\n </ion-title>\r\n\r\n <div slot=\"end\" *ngIf=\"!isMobileScreen()\" class=\"end-panel hoverable\">\r\n <app-uibulletin *ngIf=\"showBulletinIcon\"></app-uibulletin>\r\n <div class=\"profile-vl\" *ngIf=\"showBulletinIcon\"></div>\r\n\r\n <kendo-floatingactionbutton [dialItems]=\"userPanelItems\" [offset]=\"{x:'-5px', y:'-5px'}\"\r\n [align]=\"{ vertical: 'top', horizontal: 'end' }\" [dialItemAnimation]=true buttonClass=\"user-panel-button\"\r\n dialClass=\"user-panel-dial\" (dialItemClick)=\"onDialItemClick($event)\">\r\n <ng-template kendoFloatingActionButtonTemplate>\r\n <kendo-avatar shape=\"circle\" [imageSrc]=\"profileImgUrl\"></kendo-avatar>\r\n <ion-label class=\"profile-username\">{{ userDisplayName }}</ion-label>\r\n </ng-template>\r\n <ng-template kendoDialItemTemplate let-item let-isFocused=\"isFocused\">\r\n <span [class.custom-focused-class]=\"isFocused\" class=\"user-panel-item\">\r\n <fa-icon [icon]=\"item.icon\" class=\"user-panel-item-icon\"></fa-icon>\r\n <span class=\"user-panel-option-text\">{{ item.text }}</span>\r\n </span>\r\n </ng-template>\r\n </kendo-floatingactionbutton>\r\n </div>\r\n <div *ngIf=\"group && isMobileScreen()\">\r\n <ion-buttons slot=\"primary\" *ngIf=\"!group.isLoading\">\r\n <app-uiactionbutton [group]=\"group\"></app-uiactionbutton>\r\n </ion-buttons>\r\n </div>\r\n </div>\r\n\r\n <!-- Design 1 -->\r\n <!-- <div class=\"toolbar-second-row\" *ngIf=\"!isMobileScreen() && group && group.navItems\">\r\n <div class=\"nav-bar-container\">\r\n <kendo-breadcrumb [items]=\"group.navItems\" class=\"nav-bar\" (itemClick)=\"onNavItemClick($event)\">\r\n <ng-template kendoBreadCrumbItemTemplate let-item let-index=\"index\">\r\n <div class=\"nav-bar-item\" [class.current]=\"!item.route\">\r\n <fa-icon [icon]=\"item.icon\" class=\"zcard-header-icon\"></fa-icon>\r\n <span>{{ item.text }}</span>\r\n </div>\r\n </ng-template>\r\n </kendo-breadcrumb>\r\n </div>\r\n </div> -->\r\n <!-- Design 2 -->\r\n <!-- <div class=\"toolbar-second-row\" *ngIf=\"!isMobileScreen() && group && group.navItems\">\r\n <kendo-breadcrumb [items]=\"group.navItems\" class=\"nav-bar\" (itemClick)=\"onNavItemClick($event)\">\r\n <ng-template kendoBreadCrumbItemTemplate let-item let-index=\"index\">\r\n <div class=\"nav-bar-item\" [class.current]=\"!item.route\">\r\n <fa-icon *ngIf=\"item.icon\" [icon]=\"item.icon\" class=\"zcard-header-icon\" [ngClass]=\"{'icon-with-text': item.text}\"></fa-icon>\r\n <span>{{ item.text }}</span>\r\n </div>\r\n </ng-template>\r\n </kendo-breadcrumb>\r\n </div> -->\r\n </div>\r\n </ion-toolbar>\r\n</ion-header>\r\n", styles: ["ion-toolbar{--background: var(--ion-color-primary-shade);--color: var(--ion-color-primary-contrast);--min-height: var(--ion-header-height);box-shadow:0 2px 9px #ababab}app-uimenubutton{margin:auto}.toolbar-first-row{display:flex}.toolbar-second-row{margin-left:50px}.end-panel{display:flex;align-items:stretch;cursor:pointer}.profile-username{padding-right:10px;margin:auto auto auto 15px;font-size:var(--page-user-profile-font-size)}.toolbar-title-label{text-shadow:.5px .5px rgba(255,255,255,.48);font-size:var(--page-title-font-size)}.toolbar-title{margin-bottom:2px}.hoverable:hover{background
|
|
4786
|
+
UiheaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.3", type: UiheaderComponent, selector: "app-uiheader", inputs: { group: "group", topFormHeader: "topFormHeader" }, ngImport: i0, template: "<ion-header>\r\n <ion-toolbar>\r\n <div class=\"toolbar-container\" *ngIf=\"!isloading\">\r\n <div class=\"toolbar-first-row\">\r\n <app-uimenubutton slot=\"start\" [group]=\"group\"></app-uimenubutton>\r\n\r\n <ion-title class=\"toolbar-title\">\r\n <div *ngIf=\"topFormHeader || (group && !group.isLoading && group.formHeader)\">\r\n <ion-label class=\"toolbar-title-label\">{{ topFormHeader ? topFormHeader : group.formHeader }}</ion-label>\r\n </div>\r\n </ion-title>\r\n\r\n <div slot=\"end\" *ngIf=\"!isMobileScreen()\" class=\"end-panel hoverable\">\r\n <app-uibulletin *ngIf=\"showBulletinIcon\"></app-uibulletin>\r\n <div class=\"profile-vl\" *ngIf=\"showBulletinIcon\"></div>\r\n\r\n <kendo-floatingactionbutton [dialItems]=\"userPanelItems\" [offset]=\"{x:'-5px', y:'-5px'}\"\r\n [align]=\"{ vertical: 'top', horizontal: 'end' }\" [dialItemAnimation]=true buttonClass=\"user-panel-button\"\r\n dialClass=\"user-panel-dial\" (dialItemClick)=\"onDialItemClick($event)\">\r\n <ng-template kendoFloatingActionButtonTemplate>\r\n <kendo-avatar shape=\"circle\" [imageSrc]=\"profileImgUrl\"></kendo-avatar>\r\n <ion-label class=\"profile-username\">{{ userDisplayName }}</ion-label>\r\n </ng-template>\r\n <ng-template kendoDialItemTemplate let-item let-isFocused=\"isFocused\">\r\n <span [class.custom-focused-class]=\"isFocused\" class=\"user-panel-item\">\r\n <fa-icon [icon]=\"item.icon\" class=\"user-panel-item-icon\"></fa-icon>\r\n <span class=\"user-panel-option-text\">{{ item.text }}</span>\r\n </span>\r\n </ng-template>\r\n </kendo-floatingactionbutton>\r\n </div>\r\n <div *ngIf=\"group && isMobileScreen()\">\r\n <ion-buttons slot=\"primary\" *ngIf=\"!group.isLoading\">\r\n <app-uiactionbutton [group]=\"group\"></app-uiactionbutton>\r\n </ion-buttons>\r\n </div>\r\n </div>\r\n\r\n <!-- Design 1 -->\r\n <!-- <div class=\"toolbar-second-row\" *ngIf=\"!isMobileScreen() && group && group.navItems\">\r\n <div class=\"nav-bar-container\">\r\n <kendo-breadcrumb [items]=\"group.navItems\" class=\"nav-bar\" (itemClick)=\"onNavItemClick($event)\">\r\n <ng-template kendoBreadCrumbItemTemplate let-item let-index=\"index\">\r\n <div class=\"nav-bar-item\" [class.current]=\"!item.route\">\r\n <fa-icon [icon]=\"item.icon\" class=\"zcard-header-icon\"></fa-icon>\r\n <span>{{ item.text }}</span>\r\n </div>\r\n </ng-template>\r\n </kendo-breadcrumb>\r\n </div>\r\n </div> -->\r\n <!-- Design 2 -->\r\n <!-- <div class=\"toolbar-second-row\" *ngIf=\"!isMobileScreen() && group && group.navItems\">\r\n <kendo-breadcrumb [items]=\"group.navItems\" class=\"nav-bar\" (itemClick)=\"onNavItemClick($event)\">\r\n <ng-template kendoBreadCrumbItemTemplate let-item let-index=\"index\">\r\n <div class=\"nav-bar-item\" [class.current]=\"!item.route\">\r\n <fa-icon *ngIf=\"item.icon\" [icon]=\"item.icon\" class=\"zcard-header-icon\" [ngClass]=\"{'icon-with-text': item.text}\"></fa-icon>\r\n <span>{{ item.text }}</span>\r\n </div>\r\n </ng-template>\r\n </kendo-breadcrumb>\r\n </div> -->\r\n </div>\r\n </ion-toolbar>\r\n</ion-header>\r\n", styles: ["ion-toolbar{--background: var(--ion-color-primary-shade);--color: var(--ion-color-primary-contrast);--min-height: var(--ion-header-height);box-shadow:0 2px 9px #ababab}app-uimenubutton{margin:auto}.toolbar-first-row{display:flex}.toolbar-second-row{margin-left:50px}.end-panel{display:flex;align-items:stretch;cursor:pointer}.profile-username{padding-right:10px;margin:auto auto auto 15px;font-size:var(--page-user-profile-font-size)}.toolbar-title-label{text-shadow:.5px .5px rgba(255,255,255,.48);font-size:var(--page-title-font-size)}.toolbar-title{margin-bottom:2px}.hoverable:hover{background:#ffffff24}:host ::ng-deep kendo-floatingactionbutton{max-height:60px;border-radius:10px}:host ::ng-deep kendo-floatingactionbutton .user-panel-button{background:transparent!important;border:none!important;outline:none}:host ::ng-deep kendo-floatingactionbutton:hover{background:rgba(0,0,0,.3)}:host ::ng-deep kendo-floatingactionbutton .k-fab{box-shadow:none;padding:12px}:host ::ng-deep kendo-floatingactionbutton .k-avatar-md{width:var(--ion-header-avatar-size);height:var(--ion-header-avatar-size);flex-basis:var(--ion-header-avatar-size)}\n"], components: [{ type: i2$1.IonHeader, selector: "ion-header", inputs: ["collapse", "mode", "translucent"] }, { type: i2$1.IonToolbar, selector: "ion-toolbar", inputs: ["color", "mode"] }, { type: UimenubuttonComponent, selector: "app-uimenubutton", inputs: ["group"] }, { type: i2$1.IonTitle, selector: "ion-title", inputs: ["color", "size"] }, { type: i2$1.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { type: UibulletinComponent, selector: "app-uibulletin", inputs: ["group"] }, { type: i3$3.FloatingActionButtonComponent, selector: "kendo-floatingactionbutton", inputs: ["themeColor", "size", "rounded", "disabled", "align", "offset", "positionMode", "icon", "iconClass", "buttonClass", "dialClass", "text", "dialItemAnimation", "tabIndex", "dialItems"], outputs: ["blur", "focus", "dialItemClick", "open", "close"] }, { type: i2$5.AvatarComponent, selector: "kendo-avatar", inputs: ["shape", "size", "rounded", "themeColor", "fillMode", "fill", "border", "iconClass", "width", "height", "cssStyle", "initials", "icon", "imageSrc"] }, { type: i4.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }, { type: i2$1.IonButtons, selector: "ion-buttons", inputs: ["collapse"] }, { type: UiactionbuttonComponent, selector: "app-uiactionbutton" }], directives: [{ type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3$3.FloatingActionButtonTemplateDirective, selector: "[kendoFloatingActionButtonTemplate]" }, { type: i3$3.DialItemTemplateDirective, selector: "[kendoDialItemTemplate]" }] });
|
|
4768
4787
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: UiheaderComponent, decorators: [{
|
|
4769
4788
|
type: Component,
|
|
4770
|
-
args: [{ selector: "app-uiheader", template: "<ion-header>\r\n <ion-toolbar>\r\n <div class=\"toolbar-container\" *ngIf=\"!isloading\">\r\n <div class=\"toolbar-first-row\">\r\n <app-uimenubutton slot=\"start\" [group]=\"group\"></app-uimenubutton>\r\n\r\n <ion-title class=\"toolbar-title\">\r\n <div *ngIf=\"topFormHeader || (group && !group.isLoading && group.formHeader)\">\r\n <ion-label class=\"toolbar-title-label\">{{ topFormHeader ? topFormHeader : group.formHeader }}</ion-label>\r\n </div>\r\n </ion-title>\r\n\r\n <div slot=\"end\" *ngIf=\"!isMobileScreen()\" class=\"end-panel hoverable\">\r\n <app-uibulletin *ngIf=\"showBulletinIcon\"></app-uibulletin>\r\n <div class=\"profile-vl\" *ngIf=\"showBulletinIcon\"></div>\r\n\r\n <kendo-floatingactionbutton [dialItems]=\"userPanelItems\" [offset]=\"{x:'-5px', y:'-5px'}\"\r\n [align]=\"{ vertical: 'top', horizontal: 'end' }\" [dialItemAnimation]=true buttonClass=\"user-panel-button\"\r\n dialClass=\"user-panel-dial\" (dialItemClick)=\"onDialItemClick($event)\">\r\n <ng-template kendoFloatingActionButtonTemplate>\r\n <kendo-avatar shape=\"circle\" [imageSrc]=\"profileImgUrl\"></kendo-avatar>\r\n <ion-label class=\"profile-username\">{{ userDisplayName }}</ion-label>\r\n </ng-template>\r\n <ng-template kendoDialItemTemplate let-item let-isFocused=\"isFocused\">\r\n <span [class.custom-focused-class]=\"isFocused\" class=\"user-panel-item\">\r\n <fa-icon [icon]=\"item.icon\" class=\"user-panel-item-icon\"></fa-icon>\r\n <span class=\"user-panel-option-text\">{{ item.text }}</span>\r\n </span>\r\n </ng-template>\r\n </kendo-floatingactionbutton>\r\n </div>\r\n <div *ngIf=\"group && isMobileScreen()\">\r\n <ion-buttons slot=\"primary\" *ngIf=\"!group.isLoading\">\r\n <app-uiactionbutton [group]=\"group\"></app-uiactionbutton>\r\n </ion-buttons>\r\n </div>\r\n </div>\r\n\r\n <!-- Design 1 -->\r\n <!-- <div class=\"toolbar-second-row\" *ngIf=\"!isMobileScreen() && group && group.navItems\">\r\n <div class=\"nav-bar-container\">\r\n <kendo-breadcrumb [items]=\"group.navItems\" class=\"nav-bar\" (itemClick)=\"onNavItemClick($event)\">\r\n <ng-template kendoBreadCrumbItemTemplate let-item let-index=\"index\">\r\n <div class=\"nav-bar-item\" [class.current]=\"!item.route\">\r\n <fa-icon [icon]=\"item.icon\" class=\"zcard-header-icon\"></fa-icon>\r\n <span>{{ item.text }}</span>\r\n </div>\r\n </ng-template>\r\n </kendo-breadcrumb>\r\n </div>\r\n </div> -->\r\n <!-- Design 2 -->\r\n <!-- <div class=\"toolbar-second-row\" *ngIf=\"!isMobileScreen() && group && group.navItems\">\r\n <kendo-breadcrumb [items]=\"group.navItems\" class=\"nav-bar\" (itemClick)=\"onNavItemClick($event)\">\r\n <ng-template kendoBreadCrumbItemTemplate let-item let-index=\"index\">\r\n <div class=\"nav-bar-item\" [class.current]=\"!item.route\">\r\n <fa-icon *ngIf=\"item.icon\" [icon]=\"item.icon\" class=\"zcard-header-icon\" [ngClass]=\"{'icon-with-text': item.text}\"></fa-icon>\r\n <span>{{ item.text }}</span>\r\n </div>\r\n </ng-template>\r\n </kendo-breadcrumb>\r\n </div> -->\r\n </div>\r\n </ion-toolbar>\r\n</ion-header>\r\n", styles: ["ion-toolbar{--background: var(--ion-color-primary-shade);--color: var(--ion-color-primary-contrast);--min-height: var(--ion-header-height);box-shadow:0 2px 9px #ababab}app-uimenubutton{margin:auto}.toolbar-first-row{display:flex}.toolbar-second-row{margin-left:50px}.end-panel{display:flex;align-items:stretch;cursor:pointer}.profile-username{padding-right:10px;margin:auto auto auto 15px;font-size:var(--page-user-profile-font-size)}.toolbar-title-label{text-shadow:.5px .5px rgba(255,255,255,.48);font-size:var(--page-title-font-size)}.toolbar-title{margin-bottom:2px}.hoverable:hover{background
|
|
4789
|
+
args: [{ selector: "app-uiheader", template: "<ion-header>\r\n <ion-toolbar>\r\n <div class=\"toolbar-container\" *ngIf=\"!isloading\">\r\n <div class=\"toolbar-first-row\">\r\n <app-uimenubutton slot=\"start\" [group]=\"group\"></app-uimenubutton>\r\n\r\n <ion-title class=\"toolbar-title\">\r\n <div *ngIf=\"topFormHeader || (group && !group.isLoading && group.formHeader)\">\r\n <ion-label class=\"toolbar-title-label\">{{ topFormHeader ? topFormHeader : group.formHeader }}</ion-label>\r\n </div>\r\n </ion-title>\r\n\r\n <div slot=\"end\" *ngIf=\"!isMobileScreen()\" class=\"end-panel hoverable\">\r\n <app-uibulletin *ngIf=\"showBulletinIcon\"></app-uibulletin>\r\n <div class=\"profile-vl\" *ngIf=\"showBulletinIcon\"></div>\r\n\r\n <kendo-floatingactionbutton [dialItems]=\"userPanelItems\" [offset]=\"{x:'-5px', y:'-5px'}\"\r\n [align]=\"{ vertical: 'top', horizontal: 'end' }\" [dialItemAnimation]=true buttonClass=\"user-panel-button\"\r\n dialClass=\"user-panel-dial\" (dialItemClick)=\"onDialItemClick($event)\">\r\n <ng-template kendoFloatingActionButtonTemplate>\r\n <kendo-avatar shape=\"circle\" [imageSrc]=\"profileImgUrl\"></kendo-avatar>\r\n <ion-label class=\"profile-username\">{{ userDisplayName }}</ion-label>\r\n </ng-template>\r\n <ng-template kendoDialItemTemplate let-item let-isFocused=\"isFocused\">\r\n <span [class.custom-focused-class]=\"isFocused\" class=\"user-panel-item\">\r\n <fa-icon [icon]=\"item.icon\" class=\"user-panel-item-icon\"></fa-icon>\r\n <span class=\"user-panel-option-text\">{{ item.text }}</span>\r\n </span>\r\n </ng-template>\r\n </kendo-floatingactionbutton>\r\n </div>\r\n <div *ngIf=\"group && isMobileScreen()\">\r\n <ion-buttons slot=\"primary\" *ngIf=\"!group.isLoading\">\r\n <app-uiactionbutton [group]=\"group\"></app-uiactionbutton>\r\n </ion-buttons>\r\n </div>\r\n </div>\r\n\r\n <!-- Design 1 -->\r\n <!-- <div class=\"toolbar-second-row\" *ngIf=\"!isMobileScreen() && group && group.navItems\">\r\n <div class=\"nav-bar-container\">\r\n <kendo-breadcrumb [items]=\"group.navItems\" class=\"nav-bar\" (itemClick)=\"onNavItemClick($event)\">\r\n <ng-template kendoBreadCrumbItemTemplate let-item let-index=\"index\">\r\n <div class=\"nav-bar-item\" [class.current]=\"!item.route\">\r\n <fa-icon [icon]=\"item.icon\" class=\"zcard-header-icon\"></fa-icon>\r\n <span>{{ item.text }}</span>\r\n </div>\r\n </ng-template>\r\n </kendo-breadcrumb>\r\n </div>\r\n </div> -->\r\n <!-- Design 2 -->\r\n <!-- <div class=\"toolbar-second-row\" *ngIf=\"!isMobileScreen() && group && group.navItems\">\r\n <kendo-breadcrumb [items]=\"group.navItems\" class=\"nav-bar\" (itemClick)=\"onNavItemClick($event)\">\r\n <ng-template kendoBreadCrumbItemTemplate let-item let-index=\"index\">\r\n <div class=\"nav-bar-item\" [class.current]=\"!item.route\">\r\n <fa-icon *ngIf=\"item.icon\" [icon]=\"item.icon\" class=\"zcard-header-icon\" [ngClass]=\"{'icon-with-text': item.text}\"></fa-icon>\r\n <span>{{ item.text }}</span>\r\n </div>\r\n </ng-template>\r\n </kendo-breadcrumb>\r\n </div> -->\r\n </div>\r\n </ion-toolbar>\r\n</ion-header>\r\n", styles: ["ion-toolbar{--background: var(--ion-color-primary-shade);--color: var(--ion-color-primary-contrast);--min-height: var(--ion-header-height);box-shadow:0 2px 9px #ababab}app-uimenubutton{margin:auto}.toolbar-first-row{display:flex}.toolbar-second-row{margin-left:50px}.end-panel{display:flex;align-items:stretch;cursor:pointer}.profile-username{padding-right:10px;margin:auto auto auto 15px;font-size:var(--page-user-profile-font-size)}.toolbar-title-label{text-shadow:.5px .5px rgba(255,255,255,.48);font-size:var(--page-title-font-size)}.toolbar-title{margin-bottom:2px}.hoverable:hover{background:#ffffff24}:host ::ng-deep kendo-floatingactionbutton{max-height:60px;border-radius:10px}:host ::ng-deep kendo-floatingactionbutton .user-panel-button{background:transparent!important;border:none!important;outline:none}:host ::ng-deep kendo-floatingactionbutton:hover{background:rgba(0,0,0,.3)}:host ::ng-deep kendo-floatingactionbutton .k-fab{box-shadow:none;padding:12px}:host ::ng-deep kendo-floatingactionbutton .k-avatar-md{width:var(--ion-header-avatar-size);height:var(--ion-header-avatar-size);flex-basis:var(--ion-header-avatar-size)}\n"] }]
|
|
4771
4790
|
}], ctorParameters: function () { return [{ type: i1.Router }, { type: i2.TranslationService }, { type: i2.ZCoreService }, { type: i2.AuthService }, { type: i2.FontAweSomeService }, { type: ZComponentService }]; }, propDecorators: { group: [{
|
|
4772
4791
|
type: Input
|
|
4773
4792
|
}], topFormHeader: [{
|
|
@@ -4780,10 +4799,10 @@ class ProcessingRecordLoaderComponent {
|
|
|
4780
4799
|
}
|
|
4781
4800
|
}
|
|
4782
4801
|
ProcessingRecordLoaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: ProcessingRecordLoaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4783
|
-
ProcessingRecordLoaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.3", type: ProcessingRecordLoaderComponent, selector: "processing-record-loader", ngImport: i0, template: "<div class=\"loader-container\">\r\n <div class=\"ring\">Processing\r\n <span></span>\r\n </div>\r\n</div>\r\n", styles: [".loader-container{position:absolute;z-index:11;width:100vw;height:100vh;background:rgba(0,0,0,.7)}body{margin:0;padding:0;background:#262626}.ring{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:200px;height:200px;background:transparent;border:3px solid #3c3c3c;border-radius:50%;text-align:center;line-height:190px;font-family:sans-serif;font-size:20px;color:#cfbbff;letter-spacing:4px;text-transform:uppercase;text-shadow:0 0 10px
|
|
4802
|
+
ProcessingRecordLoaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.3", type: ProcessingRecordLoaderComponent, selector: "processing-record-loader", ngImport: i0, template: "<div class=\"loader-container\">\r\n <div class=\"ring\">Processing\r\n <span></span>\r\n </div>\r\n</div>\r\n", styles: [".loader-container{position:absolute;z-index:11;width:100vw;height:100vh;background:rgba(0,0,0,.7)}body{margin:0;padding:0;background:#262626}.ring{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:200px;height:200px;background:transparent;border:3px solid #3c3c3c;border-radius:50%;text-align:center;line-height:190px;font-family:sans-serif;font-size:20px;color:#cfbbff;letter-spacing:4px;text-transform:uppercase;text-shadow:0 0 10px #cfbbff;box-shadow:0 0 20px #00000080}.ring:before{content:\"\";position:absolute;top:-3px;left:-3px;width:100%;height:100%;border:3px solid transparent;border-top:3px solid #cfbbff;border-right:3px solid #cfbbff;border-radius:50%;animation:animateC 2s linear infinite}span{display:block;position:absolute;top:calc(50% - 2px);left:50%;width:50%;height:4px;background:transparent;transform-origin:left;animation:animate 2s linear infinite}span:before{content:\"\";position:absolute;width:16px;height:16px;border-radius:50%;background:#cfbbff;top:-6px;right:-8px;box-shadow:0 0 20px #cfbbff}@keyframes animateC{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes animate{0%{transform:rotate(45deg)}to{transform:rotate(405deg)}}\n"] });
|
|
4784
4803
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: ProcessingRecordLoaderComponent, decorators: [{
|
|
4785
4804
|
type: Component,
|
|
4786
|
-
args: [{ selector: "processing-record-loader", template: "<div class=\"loader-container\">\r\n <div class=\"ring\">Processing\r\n <span></span>\r\n </div>\r\n</div>\r\n", styles: [".loader-container{position:absolute;z-index:11;width:100vw;height:100vh;background:rgba(0,0,0,.7)}body{margin:0;padding:0;background:#262626}.ring{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:200px;height:200px;background:transparent;border:3px solid #3c3c3c;border-radius:50%;text-align:center;line-height:190px;font-family:sans-serif;font-size:20px;color:#cfbbff;letter-spacing:4px;text-transform:uppercase;text-shadow:0 0 10px
|
|
4805
|
+
args: [{ selector: "processing-record-loader", template: "<div class=\"loader-container\">\r\n <div class=\"ring\">Processing\r\n <span></span>\r\n </div>\r\n</div>\r\n", styles: [".loader-container{position:absolute;z-index:11;width:100vw;height:100vh;background:rgba(0,0,0,.7)}body{margin:0;padding:0;background:#262626}.ring{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:200px;height:200px;background:transparent;border:3px solid #3c3c3c;border-radius:50%;text-align:center;line-height:190px;font-family:sans-serif;font-size:20px;color:#cfbbff;letter-spacing:4px;text-transform:uppercase;text-shadow:0 0 10px #cfbbff;box-shadow:0 0 20px #00000080}.ring:before{content:\"\";position:absolute;top:-3px;left:-3px;width:100%;height:100%;border:3px solid transparent;border-top:3px solid #cfbbff;border-right:3px solid #cfbbff;border-radius:50%;animation:animateC 2s linear infinite}span{display:block;position:absolute;top:calc(50% - 2px);left:50%;width:50%;height:4px;background:transparent;transform-origin:left;animation:animate 2s linear infinite}span:before{content:\"\";position:absolute;width:16px;height:16px;border-radius:50%;background:#cfbbff;top:-6px;right:-8px;box-shadow:0 0 20px #cfbbff}@keyframes animateC{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes animate{0%{transform:rotate(45deg)}to{transform:rotate(405deg)}}\n"] }]
|
|
4787
4806
|
}], ctorParameters: function () { return []; } });
|
|
4788
4807
|
|
|
4789
4808
|
class PageLoaderComponent {
|
|
@@ -4893,7 +4912,7 @@ class ZformComponent {
|
|
|
4893
4912
|
return of([]);
|
|
4894
4913
|
}), delay(500))
|
|
4895
4914
|
.subscribe(() => {
|
|
4896
|
-
this.debugService.
|
|
4915
|
+
this.debugService.loadGridData();
|
|
4897
4916
|
this.debugService.loadWorkflowData();
|
|
4898
4917
|
});
|
|
4899
4918
|
//}
|
|
@@ -5355,25 +5374,38 @@ class ZbuttonsComponent extends ButtonFieldBase {
|
|
|
5355
5374
|
}
|
|
5356
5375
|
}
|
|
5357
5376
|
buttonClick(item) {
|
|
5358
|
-
//
|
|
5377
|
+
// Sets the isTriggered property based on the disableTrigger property of the item
|
|
5359
5378
|
this.group.isTriggered = item.disableTrigger != undefined ? !item.disableTrigger : true;
|
|
5379
|
+
// If the isTriggered property is true, proceed with the following actions
|
|
5360
5380
|
if (this.group.isTriggered) {
|
|
5361
5381
|
const me = this.group;
|
|
5382
|
+
// If the disableTriggerTimer property is not present, set a timeout to reset isTriggered to false after 500ms
|
|
5362
5383
|
if (!item['disableTriggerTimer']) {
|
|
5363
5384
|
setTimeout(function () {
|
|
5364
5385
|
me['isTriggered'] = false;
|
|
5365
5386
|
}, 500);
|
|
5366
5387
|
}
|
|
5367
5388
|
}
|
|
5389
|
+
// Create a deep clone of the item object
|
|
5368
5390
|
const clonedButton = ZComponentHelper.deepClone(item);
|
|
5391
|
+
// Call a method to update the event ID (implementation not provided)
|
|
5369
5392
|
this.updateEventId(item);
|
|
5393
|
+
// Set the DismissType property of the group to the dismissType property of the item
|
|
5370
5394
|
this.group['DismissType'] = item.dismissType;
|
|
5371
|
-
|
|
5395
|
+
// Create an output event object with details about the button click
|
|
5396
|
+
const outputEvent = {
|
|
5372
5397
|
type: "buttonClick",
|
|
5373
5398
|
target: clonedButton.clickEvent,
|
|
5374
5399
|
data: clonedButton,
|
|
5375
5400
|
triggerFrom: TriggerFromType.button
|
|
5376
|
-
}
|
|
5401
|
+
};
|
|
5402
|
+
// Update the buttonEventDetail property of the group with the output event details
|
|
5403
|
+
this.group['buttonEventDetail'] = {
|
|
5404
|
+
buttonDetail: outputEvent,
|
|
5405
|
+
triggerFrom: TriggerFromType.button
|
|
5406
|
+
};
|
|
5407
|
+
// Notify subscribers with the output event
|
|
5408
|
+
this.group.subject.next(outputEvent);
|
|
5377
5409
|
}
|
|
5378
5410
|
updateEventId(button) {
|
|
5379
5411
|
const name = button.Name ?? button.name;
|
|
@@ -6570,12 +6602,16 @@ class ZdatetimeComponent extends InputFieldBase {
|
|
|
6570
6602
|
this.minDate = null;
|
|
6571
6603
|
this.maxDate = null;
|
|
6572
6604
|
this.stepValue = null;
|
|
6573
|
-
this.SetDateRange = (
|
|
6574
|
-
|
|
6575
|
-
|
|
6605
|
+
this.SetDateRange = (minDate, maxDate) => {
|
|
6606
|
+
console.warn(`Please change the function to camelcase 'setDateRange'. 'SetDateRange' will be deprecated soon.`);
|
|
6607
|
+
this.setDateRange(this.minDate, this.maxDate);
|
|
6608
|
+
};
|
|
6609
|
+
this.setDateRange = (minDate, maxDate) => {
|
|
6610
|
+
if (!isNaN(Date.parse(minDate))) {
|
|
6611
|
+
this.minDate = new Date(minDate);
|
|
6576
6612
|
}
|
|
6577
|
-
if (!isNaN(Date.parse(
|
|
6578
|
-
this.maxDate = new Date(
|
|
6613
|
+
if (!isNaN(Date.parse(maxDate))) {
|
|
6614
|
+
this.maxDate = new Date(maxDate);
|
|
6579
6615
|
}
|
|
6580
6616
|
};
|
|
6581
6617
|
}
|
|
@@ -6614,7 +6650,7 @@ class ZdatetimeComponent extends InputFieldBase {
|
|
|
6614
6650
|
const minDateValue = minDateGroupValue || this.data.MinDate;
|
|
6615
6651
|
const maxDateGroupValue = ZComponentHelper.getGroupValue(this.data.MaxDate, this.group);
|
|
6616
6652
|
const maxDateValue = maxDateGroupValue || this.data.MaxDate;
|
|
6617
|
-
this.
|
|
6653
|
+
this.setDateRange(minDateValue, maxDateValue);
|
|
6618
6654
|
}
|
|
6619
6655
|
setStepValue() {
|
|
6620
6656
|
const stepValueGroupValue = ZComponentHelper.getGroupValue(this.data.StepValue, this.group);
|
|
@@ -7821,6 +7857,47 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImpor
|
|
|
7821
7857
|
args: ["selectComponent"]
|
|
7822
7858
|
}] } });
|
|
7823
7859
|
|
|
7860
|
+
/********** Angular **********/
|
|
7861
|
+
class SfdatetimepickerComponent extends InputFieldBase {
|
|
7862
|
+
constructor(componentService) {
|
|
7863
|
+
super(componentService);
|
|
7864
|
+
this.minDate = null;
|
|
7865
|
+
this.maxDate = null;
|
|
7866
|
+
this.setDateRange = (MinDate, MaxDate) => {
|
|
7867
|
+
if (!isNaN(Date.parse(MinDate))) {
|
|
7868
|
+
this.minDate = new Date(MinDate);
|
|
7869
|
+
}
|
|
7870
|
+
if (!isNaN(Date.parse(MaxDate))) {
|
|
7871
|
+
this.maxDate = new Date(MaxDate);
|
|
7872
|
+
}
|
|
7873
|
+
};
|
|
7874
|
+
}
|
|
7875
|
+
ngOnInit() {
|
|
7876
|
+
super.setupInnerField();
|
|
7877
|
+
this.interval = this.data.StepValue ? Number(this.data.StepValue) : 30;
|
|
7878
|
+
this.setMinAndMaxDateRange();
|
|
7879
|
+
}
|
|
7880
|
+
ngAfterViewInit() {
|
|
7881
|
+
this.componentService.decrementComponentCounterForField(this.data);
|
|
7882
|
+
}
|
|
7883
|
+
setMinAndMaxDateRange() {
|
|
7884
|
+
const minDateGroupValue = ZComponentHelper.getGroupValue(this.data.MinDate, this.group);
|
|
7885
|
+
const minDateValue = minDateGroupValue || this.data.MinDate;
|
|
7886
|
+
const maxDateGroupValue = ZComponentHelper.getGroupValue(this.data.MaxDate, this.group);
|
|
7887
|
+
const maxDateValue = maxDateGroupValue || this.data.MaxDate;
|
|
7888
|
+
this.setDateRange(minDateValue, maxDateValue);
|
|
7889
|
+
}
|
|
7890
|
+
}
|
|
7891
|
+
SfdatetimepickerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: SfdatetimepickerComponent, deps: [{ token: ZComponentService }], target: i0.ɵɵFactoryTarget.Component });
|
|
7892
|
+
SfdatetimepickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.3", type: SfdatetimepickerComponent, selector: "app-sfdatetimepicker", viewQueries: [{ propertyName: "sfdatetimepicker", first: true, predicate: ["sfdatetimepicker"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"zdate-container e1tag-style\" [style]=\"componentProperties.style.style\">\r\n <div class=\"dateTimeDesktopContainer\" *ngIf=\"!isMobileScreen()\">\r\n <ejs-datetimepicker #sfdatetimepicker\r\n [value]=\"form.get(data.Value).value | dateParser : data\" \r\n (change)=\"onChange($event)\"\r\n [min]=\"minDate\"\r\n [max]=\"maxDate\"\r\n [step]=\"interval\"\r\n [format]=\"data | dateFormatKendo\"\r\n [required]=\"data.IsRequired\"\r\n [placeholder]=\"data.PlaceHolder\" \r\n [showClearButton]=\"data.ClearButton\" \r\n cssClass=\"e-custom\" \r\n [class.disabled]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\">\r\n </ejs-datetimepicker>\r\n </div>\r\n</div> ", styles: [".e-custom.e-input-group.e-control-wrapper input.e-input,.e-custom.e-input-focus input.e-input{font-size:var(--content-font-size);padding-left:8px}.e-custom.e-input-group.e-control-wrapper{border-radius:5px!important;border:.1px solid rgba(0,0,0,.3)!important}.e-custom.e-input-group.e-control-wrapper:focus-within{box-shadow:0 0 3px 1px var(--ion-color-primary)!important}.e-custom.e-input-group.e-control-wrapper input.e-input:focus{padding-left:8px}.e-custom.e-input-group:not(.e-float-icon-left):not(.e-float-input):before,.e-custom.e-input-group:not(.e-float-icon-left):not(.e-float-input):after{background:transparent!important}.e-custom.e-input-group.e-error,.e-custom.e-input-group.e-control-wrapper.e-error,.e-custom.e-input-group.e-error:not(.e-float-icon-left),.e-custom.e-input-group.e-control-wrapper.e-error:not(.e-float-icon-left){border-color:#f31700!important}.e-custom.e-input-group.e-error.e-control-wrapper:focus-within{box-shadow:0 0 3px #f31700!important}\n"], components: [{ type: i2$9.DateTimePickerComponent, selector: "ejs-datetimepicker", inputs: ["allowEdit", "calendarMode", "cssClass", "dayHeaderFormat", "depth", "enableMask", "enablePersistence", "enableRtl", "enabled", "firstDayOfWeek", "floatLabelType", "format", "htmlAttributes", "isMultiSelection", "keyConfigs", "locale", "maskPlaceholder", "max", "min", "openOnFocus", "placeholder", "readonly", "scrollTo", "serverTimezoneOffset", "showClearButton", "showTodayButton", "start", "step", "strictMode", "timeFormat", "value", "values", "weekNumber", "weekRule", "width", "zIndex"], outputs: ["blur", "change", "cleared", "close", "created", "destroyed", "focus", "navigated", "open", "renderDayCell", "valueChange"] }], directives: [{ type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "dateParser": DateParserFilter, "dateFormatKendo": DateKendoFormatParser }, encapsulation: i0.ViewEncapsulation.None });
|
|
7893
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: SfdatetimepickerComponent, decorators: [{
|
|
7894
|
+
type: Component,
|
|
7895
|
+
args: [{ selector: 'app-sfdatetimepicker', encapsulation: ViewEncapsulation.None, template: "<div class=\"zdate-container e1tag-style\" [style]=\"componentProperties.style.style\">\r\n <div class=\"dateTimeDesktopContainer\" *ngIf=\"!isMobileScreen()\">\r\n <ejs-datetimepicker #sfdatetimepicker\r\n [value]=\"form.get(data.Value).value | dateParser : data\" \r\n (change)=\"onChange($event)\"\r\n [min]=\"minDate\"\r\n [max]=\"maxDate\"\r\n [step]=\"interval\"\r\n [format]=\"data | dateFormatKendo\"\r\n [required]=\"data.IsRequired\"\r\n [placeholder]=\"data.PlaceHolder\" \r\n [showClearButton]=\"data.ClearButton\" \r\n cssClass=\"e-custom\" \r\n [class.disabled]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\">\r\n </ejs-datetimepicker>\r\n </div>\r\n</div> ", styles: [".e-custom.e-input-group.e-control-wrapper input.e-input,.e-custom.e-input-focus input.e-input{font-size:var(--content-font-size);padding-left:8px}.e-custom.e-input-group.e-control-wrapper{border-radius:5px!important;border:.1px solid rgba(0,0,0,.3)!important}.e-custom.e-input-group.e-control-wrapper:focus-within{box-shadow:0 0 3px 1px var(--ion-color-primary)!important}.e-custom.e-input-group.e-control-wrapper input.e-input:focus{padding-left:8px}.e-custom.e-input-group:not(.e-float-icon-left):not(.e-float-input):before,.e-custom.e-input-group:not(.e-float-icon-left):not(.e-float-input):after{background:transparent!important}.e-custom.e-input-group.e-error,.e-custom.e-input-group.e-control-wrapper.e-error,.e-custom.e-input-group.e-error:not(.e-float-icon-left),.e-custom.e-input-group.e-control-wrapper.e-error:not(.e-float-icon-left){border-color:#f31700!important}.e-custom.e-input-group.e-error.e-control-wrapper:focus-within{box-shadow:0 0 3px #f31700!important}\n"] }]
|
|
7896
|
+
}], ctorParameters: function () { return [{ type: ZComponentService }]; }, propDecorators: { sfdatetimepicker: [{
|
|
7897
|
+
type: ViewChild,
|
|
7898
|
+
args: ["sfdatetimepicker"]
|
|
7899
|
+
}] } });
|
|
7900
|
+
|
|
7824
7901
|
/********** Angular **********/
|
|
7825
7902
|
class ZpostselectinputComponent extends InputFieldBase {
|
|
7826
7903
|
constructor(componentService, resourceApiService, webApiService, cacheService) {
|
|
@@ -8335,9 +8412,11 @@ class ZuploadComponent extends InputFieldBase {
|
|
|
8335
8412
|
// this.group['UploadMetaData'] = new UploadMetaData(null, '15', 'SO-No-1234', 'SaleOrder');
|
|
8336
8413
|
// this.uploadSaveUrl = uploadAttachmentUrl + this.uploadSaveUrl;
|
|
8337
8414
|
// this.uploadRemoveUrl = uploadAttachmentUrl + this.uploadRemoveUrl;
|
|
8338
|
-
if (this.data.SelectOptions) {
|
|
8339
|
-
this.restrictions.allowedExtensions = this.data
|
|
8340
|
-
|
|
8415
|
+
if (this.data.SelectOptions && !this.data.AllowedFileExtension) {
|
|
8416
|
+
this.restrictions.allowedExtensions = this.data.SelectOptions;
|
|
8417
|
+
}
|
|
8418
|
+
else if (!this.data.SelectOptions && this.data.AllowedFileExtension) {
|
|
8419
|
+
this.restrictions.allowedExtensions = this.restrictions.allowedExtensions.concat(this.data.AllowedFileExtension);
|
|
8341
8420
|
}
|
|
8342
8421
|
if (this.data.MinFileSize) {
|
|
8343
8422
|
this.restrictions.minFileSize = this.data.MinFileSize;
|
|
@@ -8352,9 +8431,6 @@ class ZuploadComponent extends InputFieldBase {
|
|
|
8352
8431
|
if (this.data.Multiple) {
|
|
8353
8432
|
this.isMultiple = this.data.Multiple;
|
|
8354
8433
|
}
|
|
8355
|
-
if (this.data.AllowedFileExtension) {
|
|
8356
|
-
this.restrictions.allowedExtensions = this.restrictions.allowedExtensions.concat(this.data.AllowedFileExtension);
|
|
8357
|
-
}
|
|
8358
8434
|
this.componentProperties.style.style6 = this.componentProperties.style.style6 || "margin: 5px; border: 1px solid gray;";
|
|
8359
8435
|
}
|
|
8360
8436
|
onSuccess(e) {
|
|
@@ -8767,7 +8843,7 @@ class ZtexteditorComponent extends InputFieldBase {
|
|
|
8767
8843
|
}
|
|
8768
8844
|
}
|
|
8769
8845
|
ZtexteditorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: ZtexteditorComponent, deps: [{ token: ZComponentService }], target: i0.ɵɵFactoryTarget.Component });
|
|
8770
|
-
ZtexteditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.3", type: ZtexteditorComponent, selector: "app-ztexteditor", viewQueries: [{ propertyName: "editor", first: true, predicate: ["editor"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div [formGroup]=\"form\" class=\"ztexteditor-container e1tag-style\" [style]=\"componentProperties.style.style\" [ngClass]=\"data.Class\">\r\n <kendo-editor #editor\r\n [id]=\"data.Value\"\r\n [formControlName]=\"data.Value\"\r\n class=\"e1tag-style1\"\r\n [style]=\"componentProperties.style.style1\"\r\n [readonly]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\"\r\n (valueChange)=\"onChange($event)\"\r\n [resizable]=\"data.Resizable || false\"\r\n [pasteCleanupSettings]=\"pasteCleanupSettings\"\r\n [iframe]=\"componentSettings.iframe\">\r\n <kendo-toolbar [style.display]=\"data.ToolBarStyle === 'basic' ? 'inherit' : 'none'\" class=\"e1tag-style2\"\r\n [style]=\"componentProperties.style.style2\">\r\n <kendo-toolbar-buttongroup>\r\n <kendo-toolbar-button kendoEditorUndoButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorRedoButton></kendo-toolbar-button>\r\n </kendo-toolbar-buttongroup>\r\n <kendo-toolbar-buttongroup>\r\n <kendo-toolbar-button kendoEditorBoldButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorItalicButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorUnderlineButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorStrikethroughButton></kendo-toolbar-button>\r\n </kendo-toolbar-buttongroup>\r\n <kendo-toolbar-buttongroup>\r\n <kendo-toolbar-button kendoEditorSubscriptButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorSuperscriptButton></kendo-toolbar-button>\r\n </kendo-toolbar-buttongroup>\r\n <kendo-toolbar-buttongroup>\r\n <kendo-toolbar-button kendoEditorAlignLeftButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorAlignCenterButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorAlignRightButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorAlignJustifyButton></kendo-toolbar-button>\r\n </kendo-toolbar-buttongroup>\r\n <kendo-toolbar-dropdownlist kendoEditorFormat></kendo-toolbar-dropdownlist>\r\n <kendo-toolbar-dropdownlist kendoEditorFontSize></kendo-toolbar-dropdownlist>\r\n <kendo-toolbar-dropdownlist kendoEditorFontFamily></kendo-toolbar-dropdownlist>\r\n <kendo-toolbar-colorpicker kendoEditorForeColor></kendo-toolbar-colorpicker>\r\n <kendo-toolbar-colorpicker kendoEditorBackColor></kendo-toolbar-colorpicker>\r\n <kendo-toolbar-buttongroup>\r\n <kendo-toolbar-button kendoEditorInsertUnorderedListButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorInsertOrderedListButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorIndentButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorOutdentButton></kendo-toolbar-button>\r\n </kendo-toolbar-buttongroup>\r\n <kendo-toolbar-buttongroup>\r\n <kendo-toolbar-button kendoEditorCreateLinkButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorUnlinkButton></kendo-toolbar-button>\r\n </kendo-toolbar-buttongroup>\r\n <kendo-editor-insert-table-button></kendo-editor-insert-table-button>\r\n <kendo-toolbar-buttongroup>\r\n <kendo-toolbar-button kendoEditorAddColumnBeforeButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorAddColumnAfterButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorAddRowBeforeButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorAddRowAfterButton></kendo-toolbar-button>\r\n </kendo-toolbar-buttongroup>\r\n <kendo-toolbar-buttongroup>\r\n <kendo-toolbar-button kendoEditorDeleteColumnButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorDeleteRowButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorDeleteTableButton></kendo-toolbar-button>\r\n </kendo-toolbar-buttongroup>\r\n <kendo-toolbar-button kendoEditorInsertFileButton></kendo-toolbar-button>\r\n <kendo-toolbar-button *ngIf=\"data.ToolBarUploadImageMethod == 'default'\" kendoEditorInsertImageButton></kendo-toolbar-button>\r\n <kendo-toolbar-button *ngIf=\"data.ToolBarUploadImageMethod == 'explorer'\" icon=\"k-i-image k-i-photo\" (click)=\"openFileExplorer()\"></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorViewSourceButton></kendo-toolbar-button>\r\n </kendo-toolbar>\r\n <kendo-toolbar [style.display]=\"data.ToolBarStyle === 'full' ? 'inherit' : 'none'\" class=\"e1tag-style2\" [style]=\"componentProperties.style.style2\">\r\n <kendo-toolbar-buttongroup>\r\n <kendo-toolbar-button kendoEditorUndoButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorRedoButton></kendo-toolbar-button>\r\n </kendo-toolbar-buttongroup>\r\n <kendo-toolbar-buttongroup>\r\n <kendo-toolbar-button kendoEditorBoldButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorItalicButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorUnderlineButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorStrikethroughButton></kendo-toolbar-button>\r\n </kendo-toolbar-buttongroup>\r\n <kendo-toolbar-buttongroup>\r\n <kendo-toolbar-button kendoEditorSubscriptButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorSuperscriptButton></kendo-toolbar-button>\r\n </kendo-toolbar-buttongroup>\r\n <kendo-toolbar-buttongroup>\r\n <kendo-toolbar-button kendoEditorAlignLeftButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorAlignCenterButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorAlignRightButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorAlignJustifyButton></kendo-toolbar-button>\r\n </kendo-toolbar-buttongroup>\r\n <kendo-toolbar-dropdownlist kendoEditorFontSize></kendo-toolbar-dropdownlist>\r\n <kendo-toolbar-dropdownlist kendoEditorFontFamily></kendo-toolbar-dropdownlist>\r\n <kendo-toolbar-colorpicker kendoEditorForeColor view=\"gradient\"></kendo-toolbar-colorpicker>\r\n <kendo-toolbar-colorpicker kendoEditorBackColor view=\"gradient\"></kendo-toolbar-colorpicker>\r\n <kendo-toolbar-buttongroup>\r\n <kendo-toolbar-button kendoEditorInsertUnorderedListButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorInsertOrderedListButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorIndentButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorOutdentButton></kendo-toolbar-button>\r\n </kendo-toolbar-buttongroup>\r\n <kendo-toolbar-buttongroup>\r\n <kendo-toolbar-button kendoEditorCreateLinkButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorUnlinkButton></kendo-toolbar-button>\r\n </kendo-toolbar-buttongroup>\r\n <kendo-toolbar-button *ngIf=\"data.ToolBarUploadImageMethod == 'default'\" kendoEditorInsertImageButton></kendo-toolbar-button>\r\n <kendo-toolbar-button *ngIf=\"data.ToolBarUploadImageMethod == 'explorer'\" icon=\"k-i-image k-i-photo\" (click)=\"openFileExplorer()\"></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorViewSourceButton></kendo-toolbar-button>\r\n <kendo-editor-insert-table-button></kendo-editor-insert-table-button>\r\n <kendo-toolbar-buttongroup>\r\n <kendo-toolbar-button kendoEditorAddColumnBeforeButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorAddColumnAfterButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorAddRowBeforeButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorAddRowAfterButton></kendo-toolbar-button>\r\n </kendo-toolbar-buttongroup>\r\n <kendo-toolbar-buttongroup>\r\n <kendo-toolbar-button kendoEditorDeleteColumnButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorDeleteRowButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorDeleteTableButton></kendo-toolbar-button>\r\n </kendo-toolbar-buttongroup>\r\n <kendo-toolbar-buttongroup>\r\n <kendo-toolbar-button kendoEditorMergeCellsButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorSplitCellButton></kendo-toolbar-button>\r\n </kendo-toolbar-buttongroup>\r\n </kendo-toolbar>\r\n </kendo-editor>\r\n <input style=\"display:none;\" type=\"file\" [id]=\"data.Value +'-upload-file'\" [name]=\"data.Value +'-upload-file'\" accept=\"image/*\" ngf-max-size=\"5MB\" (change)=\"uploadImage($event)\">\r\n</div>\r\n", styles: [".title{margin:20px 10px 5px;font-size:18px;font-weight:700}\n"], components: [{ type: i2$9.EditorComponent, selector: "kendo-editor", inputs: ["value", "disabled", "readonly", "iframe", "applyToWord", "schema", "plugins", "placeholder", "preserveWhitespace", "pasteCleanupSettings", "resizable"], outputs: ["valueChange", "focus", "paste", "blur"] }, { type: i3$8.ToolBarComponent, selector: "kendo-toolbar", inputs: ["overflow", "resizable", "popupSettings", "tabindex", "tabIndex"], outputs: ["open", "close"], exportAs: ["kendoToolBar"] }, { type: i3$8.ToolBarButtonGroupComponent, selector: "kendo-toolbar-buttongroup", inputs: ["disabled", "selection", "width", "look"], exportAs: ["kendoToolBarButtonGroup"] }, { type: i3$8.ToolBarButtonComponent, selector: "kendo-toolbar-button", inputs: ["showText", "showIcon", "text", "style", "className", "title", "disabled", "toggleable", "look", "togglable", "selected", "fillMode", "themeColor", "icon", "iconClass", "imageUrl"], outputs: ["click", "pointerdown", "selectedChange"], exportAs: ["kendoToolBarButton"] }, { type: i2$9.EditorFormatComponent, selector: "kendo-toolbar-dropdownlist[kendoEditorFormat]", inputs: ["data"], outputs: ["valueChange"] }, { type: i2$9.EditorFontSizeComponent, selector: "kendo-toolbar-dropdownlist[kendoEditorFontSize]", inputs: ["data"], outputs: ["valueChange"] }, { type: i2$9.EditorFontFamilyComponent, selector: "kendo-toolbar-dropdownlist[kendoEditorFontFamily]", inputs: ["data"], outputs: ["valueChange"] }, { type: i2$9.EditorColorPickerComponent, selector: "kendo-toolbar-colorpicker", inputs: ["value", "icon", "paletteSettings", "editorCommand", "disabled", "views", "view"] }, { type: i2$9.EditorInsertTableButtonComponent, selector: "kendo-editor-insert-table-button" }], directives: [{ type: i4$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i4$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i7.DefaultClassDirective, selector: " [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl], [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl], [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }, { type: i4$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: i2$9.EditorUndoButtonDirective, selector: "kendo-toolbar-button[kendoEditorUndoButton]" }, { type: i2$9.EditorRedoButtonDirective, selector: "kendo-toolbar-button[kendoEditorRedoButton]" }, { type: i2$9.EditorBoldButtonDirective, selector: "kendo-toolbar-button[kendoEditorBoldButton]" }, { type: i2$9.EditorItalicButtonDirective, selector: "kendo-toolbar-button[kendoEditorItalicButton]" }, { type: i2$9.EditorUnderlineButtonDirective, selector: "kendo-toolbar-button[kendoEditorUnderlineButton]" }, { type: i2$9.EditorStrikethroughButtonDirective, selector: "kendo-toolbar-button[kendoEditorStrikethroughButton]" }, { type: i2$9.EditorSubscriptButtonDirective, selector: "kendo-toolbar-button[kendoEditorSubscriptButton]" }, { type: i2$9.EditorSuperscriptButtonDirective, selector: "kendo-toolbar-button[kendoEditorSuperscriptButton]" }, { type: i2$9.EditorAlignLeftButtonDirective, selector: "kendo-toolbar-button[kendoEditorAlignLeftButton]" }, { type: i2$9.EditorAlignCenterButtonDirective, selector: "kendo-toolbar-button[kendoEditorAlignCenterButton]" }, { type: i2$9.EditorAlignRightButtonDirective, selector: "kendo-toolbar-button[kendoEditorAlignRightButton]" }, { type: i2$9.EditorAlignJustifyButtonDirective, selector: "kendo-toolbar-button[kendoEditorAlignJustifyButton]" }, { type: i2$9.EditorForeColorDirective, selector: "[kendoEditorForeColor]" }, { type: i2$9.EditorBackColorDirective, selector: "[kendoEditorBackColor]" }, { type: i2$9.EditorInsertUnorderedListButtonDirective, selector: "kendo-toolbar-button[kendoEditorInsertUnorderedListButton]" }, { type: i2$9.EditorInsertOrderedListButtonDirective, selector: "kendo-toolbar-button[kendoEditorInsertOrderedListButton]" }, { type: i2$9.EditorIndentButtonDirective, selector: "kendo-toolbar-button[kendoEditorIndentButton]" }, { type: i2$9.EditorOutdentButtonDirective, selector: "kendo-toolbar-button[kendoEditorOutdentButton]" }, { type: i2$9.EditorCreateLinkButtonDirective, selector: "kendo-toolbar-button[kendoEditorCreateLinkButton]" }, { type: i2$9.EditorUnlinkButtonDirective, selector: "kendo-toolbar-button[kendoEditorUnlinkButton]" }, { type: i2$9.EditorAddColumnBeforeButtonDirective, selector: "kendo-toolbar-button[kendoEditorAddColumnBeforeButton]" }, { type: i2$9.EditorAddColumnAfterButtonDirective, selector: "kendo-toolbar-button[kendoEditorAddColumnAfterButton]" }, { type: i2$9.EditorAddRowBeforeButtonDirective, selector: "kendo-toolbar-button[kendoEditorAddRowBeforeButton]" }, { type: i2$9.EditorAddRowAfterButtonDirective, selector: "kendo-toolbar-button[kendoEditorAddRowAfterButton]" }, { type: i2$9.EditorDeleteColumnButtonDirective, selector: "kendo-toolbar-button[kendoEditorDeleteColumnButton]" }, { type: i2$9.EditorDeleteRowButtonDirective, selector: "kendo-toolbar-button[kendoEditorDeleteRowButton]" }, { type: i2$9.EditorDeleteTableButtonDirective, selector: "kendo-toolbar-button[kendoEditorDeleteTableButton]" }, { type: i2$9.EditorInsertFileButtonDirective, selector: "kendo-toolbar-button[kendoEditorInsertFileButton]" }, { type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2$9.EditorInsertImageButtonDirective, selector: "kendo-toolbar-button[kendoEditorInsertImageButton]" }, { type: i2$9.EditorViewSourceButtonDirective, selector: "kendo-toolbar-button[kendoEditorViewSourceButton]" }, { type: i2$9.EditorMergeCellsButtonDirective, selector: "kendo-toolbar-button[kendoEditorMergeCellsButton]" }, { type: i2$9.EditorSplitCellButtonDirective, selector: "kendo-toolbar-button[kendoEditorSplitCellButton]" }] });
|
|
8846
|
+
ZtexteditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.3", type: ZtexteditorComponent, selector: "app-ztexteditor", viewQueries: [{ propertyName: "editor", first: true, predicate: ["editor"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div [formGroup]=\"form\" class=\"ztexteditor-container e1tag-style\" [style]=\"componentProperties.style.style\" [ngClass]=\"data.Class\">\r\n <kendo-editor #editor\r\n [id]=\"data.Value\"\r\n [formControlName]=\"data.Value\"\r\n class=\"e1tag-style1\"\r\n [style]=\"componentProperties.style.style1\"\r\n [readonly]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\"\r\n (valueChange)=\"onChange($event)\"\r\n [resizable]=\"data.Resizable || false\"\r\n [pasteCleanupSettings]=\"pasteCleanupSettings\"\r\n [iframe]=\"componentSettings.iframe\">\r\n <kendo-toolbar [style.display]=\"data.ToolBarStyle === 'basic' ? 'inherit' : 'none'\" class=\"e1tag-style2\"\r\n [style]=\"componentProperties.style.style2\">\r\n <kendo-toolbar-buttongroup>\r\n <kendo-toolbar-button kendoEditorUndoButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorRedoButton></kendo-toolbar-button>\r\n </kendo-toolbar-buttongroup>\r\n <kendo-toolbar-buttongroup>\r\n <kendo-toolbar-button kendoEditorBoldButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorItalicButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorUnderlineButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorStrikethroughButton></kendo-toolbar-button>\r\n </kendo-toolbar-buttongroup>\r\n <kendo-toolbar-buttongroup>\r\n <kendo-toolbar-button kendoEditorSubscriptButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorSuperscriptButton></kendo-toolbar-button>\r\n </kendo-toolbar-buttongroup>\r\n <kendo-toolbar-buttongroup>\r\n <kendo-toolbar-button kendoEditorAlignLeftButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorAlignCenterButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorAlignRightButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorAlignJustifyButton></kendo-toolbar-button>\r\n </kendo-toolbar-buttongroup>\r\n <kendo-toolbar-dropdownlist kendoEditorFormat></kendo-toolbar-dropdownlist>\r\n <kendo-toolbar-dropdownlist kendoEditorFontSize></kendo-toolbar-dropdownlist>\r\n <kendo-toolbar-dropdownlist kendoEditorFontFamily></kendo-toolbar-dropdownlist>\r\n <kendo-toolbar-colorpicker kendoEditorForeColor></kendo-toolbar-colorpicker>\r\n <kendo-toolbar-colorpicker kendoEditorBackColor></kendo-toolbar-colorpicker>\r\n <kendo-toolbar-buttongroup>\r\n <kendo-toolbar-button kendoEditorInsertUnorderedListButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorInsertOrderedListButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorIndentButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorOutdentButton></kendo-toolbar-button>\r\n </kendo-toolbar-buttongroup>\r\n <kendo-toolbar-buttongroup>\r\n <kendo-toolbar-button kendoEditorCreateLinkButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorUnlinkButton></kendo-toolbar-button>\r\n </kendo-toolbar-buttongroup>\r\n <kendo-editor-insert-table-button></kendo-editor-insert-table-button>\r\n <kendo-toolbar-buttongroup>\r\n <kendo-toolbar-button kendoEditorAddColumnBeforeButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorAddColumnAfterButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorAddRowBeforeButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorAddRowAfterButton></kendo-toolbar-button>\r\n </kendo-toolbar-buttongroup>\r\n <kendo-toolbar-buttongroup>\r\n <kendo-toolbar-button kendoEditorDeleteColumnButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorDeleteRowButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorDeleteTableButton></kendo-toolbar-button>\r\n </kendo-toolbar-buttongroup>\r\n <kendo-toolbar-button kendoEditorInsertFileButton></kendo-toolbar-button>\r\n <kendo-toolbar-button *ngIf=\"data.ToolBarUploadImageMethod == 'default'\" kendoEditorInsertImageButton></kendo-toolbar-button>\r\n <kendo-toolbar-button *ngIf=\"data.ToolBarUploadImageMethod == 'explorer'\" icon=\"k-i-image k-i-photo\" (click)=\"openFileExplorer()\"></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorViewSourceButton></kendo-toolbar-button>\r\n </kendo-toolbar>\r\n <kendo-toolbar [style.display]=\"data.ToolBarStyle === 'full' ? 'inherit' : 'none'\" class=\"e1tag-style2\" [style]=\"componentProperties.style.style2\">\r\n <kendo-toolbar-buttongroup>\r\n <kendo-toolbar-button kendoEditorUndoButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorRedoButton></kendo-toolbar-button>\r\n </kendo-toolbar-buttongroup>\r\n <kendo-toolbar-buttongroup>\r\n <kendo-toolbar-button kendoEditorBoldButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorItalicButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorUnderlineButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorStrikethroughButton></kendo-toolbar-button>\r\n </kendo-toolbar-buttongroup>\r\n <kendo-toolbar-buttongroup>\r\n <kendo-toolbar-button kendoEditorSubscriptButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorSuperscriptButton></kendo-toolbar-button>\r\n </kendo-toolbar-buttongroup>\r\n <kendo-toolbar-buttongroup>\r\n <kendo-toolbar-button kendoEditorAlignLeftButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorAlignCenterButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorAlignRightButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorAlignJustifyButton></kendo-toolbar-button>\r\n </kendo-toolbar-buttongroup>\r\n <kendo-toolbar-dropdownlist kendoEditorFontSize></kendo-toolbar-dropdownlist>\r\n <kendo-toolbar-dropdownlist kendoEditorFontFamily></kendo-toolbar-dropdownlist>\r\n <kendo-toolbar-colorpicker kendoEditorForeColor view=\"gradient\"></kendo-toolbar-colorpicker>\r\n <kendo-toolbar-colorpicker kendoEditorBackColor view=\"gradient\"></kendo-toolbar-colorpicker>\r\n <kendo-toolbar-buttongroup>\r\n <kendo-toolbar-button kendoEditorInsertUnorderedListButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorInsertOrderedListButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorIndentButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorOutdentButton></kendo-toolbar-button>\r\n </kendo-toolbar-buttongroup>\r\n <kendo-toolbar-buttongroup>\r\n <kendo-toolbar-button kendoEditorCreateLinkButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorUnlinkButton></kendo-toolbar-button>\r\n </kendo-toolbar-buttongroup>\r\n <kendo-toolbar-button *ngIf=\"data.ToolBarUploadImageMethod == 'default'\" kendoEditorInsertImageButton></kendo-toolbar-button>\r\n <kendo-toolbar-button *ngIf=\"data.ToolBarUploadImageMethod == 'explorer'\" icon=\"k-i-image k-i-photo\" (click)=\"openFileExplorer()\"></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorViewSourceButton></kendo-toolbar-button>\r\n <kendo-editor-insert-table-button></kendo-editor-insert-table-button>\r\n <kendo-toolbar-buttongroup>\r\n <kendo-toolbar-button kendoEditorAddColumnBeforeButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorAddColumnAfterButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorAddRowBeforeButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorAddRowAfterButton></kendo-toolbar-button>\r\n </kendo-toolbar-buttongroup>\r\n <kendo-toolbar-buttongroup>\r\n <kendo-toolbar-button kendoEditorDeleteColumnButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorDeleteRowButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorDeleteTableButton></kendo-toolbar-button>\r\n </kendo-toolbar-buttongroup>\r\n <kendo-toolbar-buttongroup>\r\n <kendo-toolbar-button kendoEditorMergeCellsButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorSplitCellButton></kendo-toolbar-button>\r\n </kendo-toolbar-buttongroup>\r\n </kendo-toolbar>\r\n </kendo-editor>\r\n <input style=\"display:none;\" type=\"file\" [id]=\"data.Value +'-upload-file'\" [name]=\"data.Value +'-upload-file'\" accept=\"image/*\" ngf-max-size=\"5MB\" (change)=\"uploadImage($event)\">\r\n</div>\r\n", styles: [".title{margin:20px 10px 5px;font-size:18px;font-weight:700}\n"], components: [{ type: i2$a.EditorComponent, selector: "kendo-editor", inputs: ["value", "disabled", "readonly", "iframe", "applyToWord", "schema", "plugins", "placeholder", "preserveWhitespace", "pasteCleanupSettings", "resizable"], outputs: ["valueChange", "focus", "paste", "blur"] }, { type: i3$8.ToolBarComponent, selector: "kendo-toolbar", inputs: ["overflow", "resizable", "popupSettings", "tabindex", "tabIndex"], outputs: ["open", "close"], exportAs: ["kendoToolBar"] }, { type: i3$8.ToolBarButtonGroupComponent, selector: "kendo-toolbar-buttongroup", inputs: ["disabled", "selection", "width", "look"], exportAs: ["kendoToolBarButtonGroup"] }, { type: i3$8.ToolBarButtonComponent, selector: "kendo-toolbar-button", inputs: ["showText", "showIcon", "text", "style", "className", "title", "disabled", "toggleable", "look", "togglable", "selected", "fillMode", "themeColor", "icon", "iconClass", "imageUrl"], outputs: ["click", "pointerdown", "selectedChange"], exportAs: ["kendoToolBarButton"] }, { type: i2$a.EditorFormatComponent, selector: "kendo-toolbar-dropdownlist[kendoEditorFormat]", inputs: ["data"], outputs: ["valueChange"] }, { type: i2$a.EditorFontSizeComponent, selector: "kendo-toolbar-dropdownlist[kendoEditorFontSize]", inputs: ["data"], outputs: ["valueChange"] }, { type: i2$a.EditorFontFamilyComponent, selector: "kendo-toolbar-dropdownlist[kendoEditorFontFamily]", inputs: ["data"], outputs: ["valueChange"] }, { type: i2$a.EditorColorPickerComponent, selector: "kendo-toolbar-colorpicker", inputs: ["value", "icon", "paletteSettings", "editorCommand", "disabled", "views", "view"] }, { type: i2$a.EditorInsertTableButtonComponent, selector: "kendo-editor-insert-table-button" }], directives: [{ type: i4$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i4$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i7.DefaultClassDirective, selector: " [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl], [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl], [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }, { type: i4$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: i2$a.EditorUndoButtonDirective, selector: "kendo-toolbar-button[kendoEditorUndoButton]" }, { type: i2$a.EditorRedoButtonDirective, selector: "kendo-toolbar-button[kendoEditorRedoButton]" }, { type: i2$a.EditorBoldButtonDirective, selector: "kendo-toolbar-button[kendoEditorBoldButton]" }, { type: i2$a.EditorItalicButtonDirective, selector: "kendo-toolbar-button[kendoEditorItalicButton]" }, { type: i2$a.EditorUnderlineButtonDirective, selector: "kendo-toolbar-button[kendoEditorUnderlineButton]" }, { type: i2$a.EditorStrikethroughButtonDirective, selector: "kendo-toolbar-button[kendoEditorStrikethroughButton]" }, { type: i2$a.EditorSubscriptButtonDirective, selector: "kendo-toolbar-button[kendoEditorSubscriptButton]" }, { type: i2$a.EditorSuperscriptButtonDirective, selector: "kendo-toolbar-button[kendoEditorSuperscriptButton]" }, { type: i2$a.EditorAlignLeftButtonDirective, selector: "kendo-toolbar-button[kendoEditorAlignLeftButton]" }, { type: i2$a.EditorAlignCenterButtonDirective, selector: "kendo-toolbar-button[kendoEditorAlignCenterButton]" }, { type: i2$a.EditorAlignRightButtonDirective, selector: "kendo-toolbar-button[kendoEditorAlignRightButton]" }, { type: i2$a.EditorAlignJustifyButtonDirective, selector: "kendo-toolbar-button[kendoEditorAlignJustifyButton]" }, { type: i2$a.EditorForeColorDirective, selector: "[kendoEditorForeColor]" }, { type: i2$a.EditorBackColorDirective, selector: "[kendoEditorBackColor]" }, { type: i2$a.EditorInsertUnorderedListButtonDirective, selector: "kendo-toolbar-button[kendoEditorInsertUnorderedListButton]" }, { type: i2$a.EditorInsertOrderedListButtonDirective, selector: "kendo-toolbar-button[kendoEditorInsertOrderedListButton]" }, { type: i2$a.EditorIndentButtonDirective, selector: "kendo-toolbar-button[kendoEditorIndentButton]" }, { type: i2$a.EditorOutdentButtonDirective, selector: "kendo-toolbar-button[kendoEditorOutdentButton]" }, { type: i2$a.EditorCreateLinkButtonDirective, selector: "kendo-toolbar-button[kendoEditorCreateLinkButton]" }, { type: i2$a.EditorUnlinkButtonDirective, selector: "kendo-toolbar-button[kendoEditorUnlinkButton]" }, { type: i2$a.EditorAddColumnBeforeButtonDirective, selector: "kendo-toolbar-button[kendoEditorAddColumnBeforeButton]" }, { type: i2$a.EditorAddColumnAfterButtonDirective, selector: "kendo-toolbar-button[kendoEditorAddColumnAfterButton]" }, { type: i2$a.EditorAddRowBeforeButtonDirective, selector: "kendo-toolbar-button[kendoEditorAddRowBeforeButton]" }, { type: i2$a.EditorAddRowAfterButtonDirective, selector: "kendo-toolbar-button[kendoEditorAddRowAfterButton]" }, { type: i2$a.EditorDeleteColumnButtonDirective, selector: "kendo-toolbar-button[kendoEditorDeleteColumnButton]" }, { type: i2$a.EditorDeleteRowButtonDirective, selector: "kendo-toolbar-button[kendoEditorDeleteRowButton]" }, { type: i2$a.EditorDeleteTableButtonDirective, selector: "kendo-toolbar-button[kendoEditorDeleteTableButton]" }, { type: i2$a.EditorInsertFileButtonDirective, selector: "kendo-toolbar-button[kendoEditorInsertFileButton]" }, { type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2$a.EditorInsertImageButtonDirective, selector: "kendo-toolbar-button[kendoEditorInsertImageButton]" }, { type: i2$a.EditorViewSourceButtonDirective, selector: "kendo-toolbar-button[kendoEditorViewSourceButton]" }, { type: i2$a.EditorMergeCellsButtonDirective, selector: "kendo-toolbar-button[kendoEditorMergeCellsButton]" }, { type: i2$a.EditorSplitCellButtonDirective, selector: "kendo-toolbar-button[kendoEditorSplitCellButton]" }] });
|
|
8771
8847
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: ZtexteditorComponent, decorators: [{
|
|
8772
8848
|
type: Component,
|
|
8773
8849
|
args: [{ selector: 'app-ztexteditor', template: "<div [formGroup]=\"form\" class=\"ztexteditor-container e1tag-style\" [style]=\"componentProperties.style.style\" [ngClass]=\"data.Class\">\r\n <kendo-editor #editor\r\n [id]=\"data.Value\"\r\n [formControlName]=\"data.Value\"\r\n class=\"e1tag-style1\"\r\n [style]=\"componentProperties.style.style1\"\r\n [readonly]=\"(!!componentProperties.isReadOnlyField ? group[componentProperties.isReadOnlyField] : componentProperties.isReadOnly)\"\r\n (valueChange)=\"onChange($event)\"\r\n [resizable]=\"data.Resizable || false\"\r\n [pasteCleanupSettings]=\"pasteCleanupSettings\"\r\n [iframe]=\"componentSettings.iframe\">\r\n <kendo-toolbar [style.display]=\"data.ToolBarStyle === 'basic' ? 'inherit' : 'none'\" class=\"e1tag-style2\"\r\n [style]=\"componentProperties.style.style2\">\r\n <kendo-toolbar-buttongroup>\r\n <kendo-toolbar-button kendoEditorUndoButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorRedoButton></kendo-toolbar-button>\r\n </kendo-toolbar-buttongroup>\r\n <kendo-toolbar-buttongroup>\r\n <kendo-toolbar-button kendoEditorBoldButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorItalicButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorUnderlineButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorStrikethroughButton></kendo-toolbar-button>\r\n </kendo-toolbar-buttongroup>\r\n <kendo-toolbar-buttongroup>\r\n <kendo-toolbar-button kendoEditorSubscriptButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorSuperscriptButton></kendo-toolbar-button>\r\n </kendo-toolbar-buttongroup>\r\n <kendo-toolbar-buttongroup>\r\n <kendo-toolbar-button kendoEditorAlignLeftButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorAlignCenterButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorAlignRightButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorAlignJustifyButton></kendo-toolbar-button>\r\n </kendo-toolbar-buttongroup>\r\n <kendo-toolbar-dropdownlist kendoEditorFormat></kendo-toolbar-dropdownlist>\r\n <kendo-toolbar-dropdownlist kendoEditorFontSize></kendo-toolbar-dropdownlist>\r\n <kendo-toolbar-dropdownlist kendoEditorFontFamily></kendo-toolbar-dropdownlist>\r\n <kendo-toolbar-colorpicker kendoEditorForeColor></kendo-toolbar-colorpicker>\r\n <kendo-toolbar-colorpicker kendoEditorBackColor></kendo-toolbar-colorpicker>\r\n <kendo-toolbar-buttongroup>\r\n <kendo-toolbar-button kendoEditorInsertUnorderedListButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorInsertOrderedListButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorIndentButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorOutdentButton></kendo-toolbar-button>\r\n </kendo-toolbar-buttongroup>\r\n <kendo-toolbar-buttongroup>\r\n <kendo-toolbar-button kendoEditorCreateLinkButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorUnlinkButton></kendo-toolbar-button>\r\n </kendo-toolbar-buttongroup>\r\n <kendo-editor-insert-table-button></kendo-editor-insert-table-button>\r\n <kendo-toolbar-buttongroup>\r\n <kendo-toolbar-button kendoEditorAddColumnBeforeButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorAddColumnAfterButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorAddRowBeforeButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorAddRowAfterButton></kendo-toolbar-button>\r\n </kendo-toolbar-buttongroup>\r\n <kendo-toolbar-buttongroup>\r\n <kendo-toolbar-button kendoEditorDeleteColumnButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorDeleteRowButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorDeleteTableButton></kendo-toolbar-button>\r\n </kendo-toolbar-buttongroup>\r\n <kendo-toolbar-button kendoEditorInsertFileButton></kendo-toolbar-button>\r\n <kendo-toolbar-button *ngIf=\"data.ToolBarUploadImageMethod == 'default'\" kendoEditorInsertImageButton></kendo-toolbar-button>\r\n <kendo-toolbar-button *ngIf=\"data.ToolBarUploadImageMethod == 'explorer'\" icon=\"k-i-image k-i-photo\" (click)=\"openFileExplorer()\"></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorViewSourceButton></kendo-toolbar-button>\r\n </kendo-toolbar>\r\n <kendo-toolbar [style.display]=\"data.ToolBarStyle === 'full' ? 'inherit' : 'none'\" class=\"e1tag-style2\" [style]=\"componentProperties.style.style2\">\r\n <kendo-toolbar-buttongroup>\r\n <kendo-toolbar-button kendoEditorUndoButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorRedoButton></kendo-toolbar-button>\r\n </kendo-toolbar-buttongroup>\r\n <kendo-toolbar-buttongroup>\r\n <kendo-toolbar-button kendoEditorBoldButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorItalicButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorUnderlineButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorStrikethroughButton></kendo-toolbar-button>\r\n </kendo-toolbar-buttongroup>\r\n <kendo-toolbar-buttongroup>\r\n <kendo-toolbar-button kendoEditorSubscriptButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorSuperscriptButton></kendo-toolbar-button>\r\n </kendo-toolbar-buttongroup>\r\n <kendo-toolbar-buttongroup>\r\n <kendo-toolbar-button kendoEditorAlignLeftButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorAlignCenterButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorAlignRightButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorAlignJustifyButton></kendo-toolbar-button>\r\n </kendo-toolbar-buttongroup>\r\n <kendo-toolbar-dropdownlist kendoEditorFontSize></kendo-toolbar-dropdownlist>\r\n <kendo-toolbar-dropdownlist kendoEditorFontFamily></kendo-toolbar-dropdownlist>\r\n <kendo-toolbar-colorpicker kendoEditorForeColor view=\"gradient\"></kendo-toolbar-colorpicker>\r\n <kendo-toolbar-colorpicker kendoEditorBackColor view=\"gradient\"></kendo-toolbar-colorpicker>\r\n <kendo-toolbar-buttongroup>\r\n <kendo-toolbar-button kendoEditorInsertUnorderedListButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorInsertOrderedListButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorIndentButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorOutdentButton></kendo-toolbar-button>\r\n </kendo-toolbar-buttongroup>\r\n <kendo-toolbar-buttongroup>\r\n <kendo-toolbar-button kendoEditorCreateLinkButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorUnlinkButton></kendo-toolbar-button>\r\n </kendo-toolbar-buttongroup>\r\n <kendo-toolbar-button *ngIf=\"data.ToolBarUploadImageMethod == 'default'\" kendoEditorInsertImageButton></kendo-toolbar-button>\r\n <kendo-toolbar-button *ngIf=\"data.ToolBarUploadImageMethod == 'explorer'\" icon=\"k-i-image k-i-photo\" (click)=\"openFileExplorer()\"></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorViewSourceButton></kendo-toolbar-button>\r\n <kendo-editor-insert-table-button></kendo-editor-insert-table-button>\r\n <kendo-toolbar-buttongroup>\r\n <kendo-toolbar-button kendoEditorAddColumnBeforeButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorAddColumnAfterButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorAddRowBeforeButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorAddRowAfterButton></kendo-toolbar-button>\r\n </kendo-toolbar-buttongroup>\r\n <kendo-toolbar-buttongroup>\r\n <kendo-toolbar-button kendoEditorDeleteColumnButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorDeleteRowButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorDeleteTableButton></kendo-toolbar-button>\r\n </kendo-toolbar-buttongroup>\r\n <kendo-toolbar-buttongroup>\r\n <kendo-toolbar-button kendoEditorMergeCellsButton></kendo-toolbar-button>\r\n <kendo-toolbar-button kendoEditorSplitCellButton></kendo-toolbar-button>\r\n </kendo-toolbar-buttongroup>\r\n </kendo-toolbar>\r\n </kendo-editor>\r\n <input style=\"display:none;\" type=\"file\" [id]=\"data.Value +'-upload-file'\" [name]=\"data.Value +'-upload-file'\" accept=\"image/*\" ngf-max-size=\"5MB\" (change)=\"uploadImage($event)\">\r\n</div>\r\n", styles: [".title{margin:20px 10px 5px;font-size:18px;font-weight:700}\n"] }]
|
|
@@ -8942,6 +9018,7 @@ class ZInputContainerComponent extends FieldBase {
|
|
|
8942
9018
|
this.ztext_type = ['number', 'numeric', 'date', 'email', 'zpassword', 'search', 'tel', 'text', 'url', 'currency'];
|
|
8943
9019
|
this.zselect_type = ['zuiselectmultiple', 'zuiselectmultiple_button', 'select'];
|
|
8944
9020
|
this.zdate_type = ['zdate', 'ztime', 'zdatetime', 'zshortdate', 'zuidatetime', 'zuitime'];
|
|
9021
|
+
this.sfdatetimepicker_type = ['sfdatetimepicker'];
|
|
8945
9022
|
this.zpostselectinput_type = ['post_select_input', 'pre_select_input', 'zphone_countrycode'];
|
|
8946
9023
|
this.zcheckbox_type = ['checkbox'];
|
|
8947
9024
|
this.znumeric_type = ['znumeric'];
|
|
@@ -8984,10 +9061,10 @@ class ZInputContainerComponent extends FieldBase {
|
|
|
8984
9061
|
}
|
|
8985
9062
|
}
|
|
8986
9063
|
ZInputContainerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: ZInputContainerComponent, deps: [{ token: ZComponentService }], target: i0.ɵɵFactoryTarget.Component });
|
|
8987
|
-
ZInputContainerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.3", type: ZInputContainerComponent, selector: "app-zinput-container", usesInheritance: true, ngImport: i0, template: "<div class=\"mobile-input-container e1tag-container-style\" *ngIf=\"isMobileScreen() && !isLoading\"\r\n [style]=\"componentProperties.containerStyle.style\">\r\n <ion-item [formGroup]=\"form\" class=\"e1tag-container-style1\"\r\n *ngIf=\"(!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible)\"\r\n [ngClass]=\"getIon_InvalidClass(form, data)\" [style]=\"componentProperties.containerStyle.style1\">\r\n <ion-label [attr.for]=\"data.Value\" class=\"input-label e1tag-container-style2\"\r\n *ngIf=\"data.ShowLabel === undefined || data.ShowLabel\"\r\n [position]=\"data.LabelPosition ? data.LabelPosition : 'stacked'\"\r\n [style]=\"componentProperties.containerStyle.style2\">\r\n {{componentProperties.label}}\r\n <ion-text *ngIf=\"(!!componentProperties.isRequiredField ? group[componentProperties.isRequiredField] : componentProperties.isRequired)\"\r\n color=\"danger\" class=\"required-icon\">*</ion-text>\r\n </ion-label>\r\n <div class=\"input-value-field\">\r\n <div class=\"input-fields-options\">\r\n <app-ztext *ngIf=\"ztext_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-ztext>\r\n <app-zselectmultiple *ngIf=\"zselect_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-zselectmultiple>\r\n <app-zdatetime *ngIf=\"zdate_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-zdatetime>\r\n <app-zpostselectinput *ngIf=\"zpostselectinput_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\"\r\n [form]=\"form\" [containerField]=\"containerField\" [componentProperties]=\"componentProperties\"\r\n class=\"e1tag-container-style5\" [style]=\"componentProperties.containerStyle.style5\"\r\n (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-zpostselectinput>\r\n <app-zcheckbox *ngIf=\"zcheckbox_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-zcheckbox>\r\n <app-znumeric *ngIf=\"znumeric_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-znumeric>\r\n <app-ztextarea *ngIf=\"textarea_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-ztextarea>\r\n <app-zupload *ngIf=\"zupload_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-zupload>\r\n <app-zimg *ngIf=\"zimg_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-zimg>\r\n <app-ztexteditor *ngIf=\"ztexteditor_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-ztexteditor>\r\n <app-zcolorpicker *ngIf=\"zcolorpicker_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-zcolorpicker>\r\n </div>\r\n <app-error [data]=\"data\" [group]=\"group\" [form]=\"form\"></app-error>\r\n <!-- <app-field-suffix-element [data]=\"data\" [group]=\"group\" [form]=\"form\" [containerField]=\"containerField\"\r\n [componentProperties]=\"componentProperties\"></app-field-suffix-element> -->\r\n </div>\r\n </ion-item>\r\n</div>\r\n\r\n<div class=\"desktop-input-container e1tag-container-style\" [formGroup]=\"form\"\r\n [style]=\"componentProperties.containerStyle.style\"\r\n *ngIf=\"!isMobileScreen() && !isLoading && (!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible)\"\r\n [ngClass]=\"getClass(form, data)\" [fxLayout]=\"data.FieldLayoutType !== 1 ? 'column' : 'row'\"\r\n fxLayoutAlign=\"space-between stretch\" [class.editMode]=\"(data['_EditMode'].value)\"\r\n #zinputcontainer>\r\n <kendo-label class=\"input-label e1tag-container-style1\" [for]=\"data.Name\" [text]=\"componentProperties.label\"\r\n *ngIf=\"data.ShowLabel\" [style]=\"componentProperties.containerStyle.style1\"\r\n [fxFlex]=\"componentProperties.labelFlexLayoutSize.all\" [fxFlex.xs]=\"componentProperties.labelFlexLayoutSize.xs\"\r\n [fxFlex.sm]=\"componentProperties.labelFlexLayoutSize.sm\" [fxFlex.md]=\"componentProperties.labelFlexLayoutSize.md\"\r\n [fxFlex.lg]=\"componentProperties.labelFlexLayoutSize.lg\" [fxFlex.xl]=\"componentProperties.labelFlexLayoutSize.xl\">\r\n <kendo-label *ngIf=\"data['_EditMode'].value && (!!componentProperties.isRequiredField ? group[componentProperties.isRequiredField] : componentProperties.isRequired)\"\r\n text=\"*\" class=\"required-icon\">\r\n </kendo-label>\r\n <app-input-field-addons class=\"addon-top e1tag-container-style7\" [position]=\"'top'\" [addOn]=\"inputFieldAddOn.top\"\r\n [data]=\"data\" [group]=\"group\" [form]=\"form\" [containerField]=\"containerField\"\r\n [componentProperties]=\"componentProperties\" [style]=\"componentProperties.containerStyle.style7\">\r\n </app-input-field-addons>\r\n </kendo-label>\r\n <div class=\"input-value-container e1tag-container-style2\" [style]=\"componentProperties.containerStyle.style2\"\r\n [fxFlex]=\"componentProperties.fieldFlexLayoutSize.all\" [fxFlex.xs]=\"componentProperties.fieldFlexLayoutSize.xs\"\r\n [fxFlex.sm]=\"componentProperties.fieldFlexLayoutSize.sm\" [fxFlex.md]=\"componentProperties.fieldFlexLayoutSize.md\"\r\n [fxFlex.lg]=\"componentProperties.fieldFlexLayoutSize.lg\" [fxFlex.xl]=\"componentProperties.fieldFlexLayoutSize.xl\">\r\n <div *ngIf=\"data['_EditMode'].value\" class=\"input-value-field e1tag-container-style3\"\r\n [style]=\"componentProperties.containerStyle.style3\">\r\n <!-- TODO: Add 1 more layer for this switch case-->\r\n <app-input-field-addons class=\"addon-left e1tag-container-style7\" [position]=\"'left'\"\r\n [addOn]=\"inputFieldAddOn.left\" [data]=\"data\" [group]=\"group\" [form]=\"form\" [containerField]=\"containerField\"\r\n [componentProperties]=\"componentProperties\" [style]=\"componentProperties.containerStyle.style7\">\r\n </app-input-field-addons>\r\n <div class=\"input-fields-options e1tag-container-style4\" [style]=\"componentProperties.containerStyle.style4\">\r\n <app-ztext *ngIf=\"ztext_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-ztext>\r\n <app-zselectmultiple *ngIf=\"zselect_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-zselectmultiple>\r\n <app-zdatetime *ngIf=\"zdate_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-zdatetime>\r\n <app-zpostselectinput *ngIf=\"zpostselectinput_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\"\r\n [form]=\"form\" [containerField]=\"containerField\" [componentProperties]=\"componentProperties\"\r\n class=\"e1tag-container-style5\" [style]=\"componentProperties.containerStyle.style5\"\r\n (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-zpostselectinput>\r\n <app-zcheckbox *ngIf=\"zcheckbox_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-zcheckbox>\r\n <app-znumeric *ngIf=\"znumeric_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-znumeric>\r\n <app-ztextarea *ngIf=\"textarea_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-ztextarea>\r\n <app-zupload *ngIf=\"zupload_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-zupload>\r\n <app-zimg *ngIf=\"zimg_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-zimg>\r\n <app-ztexteditor *ngIf=\"ztexteditor_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-ztexteditor>\r\n <app-zcolorpicker *ngIf=\"zcolorpicker_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-zcolorpicker>\r\n </div>\r\n <app-input-field-addons class=\"addon-right e1tag-container-style7\" [position]=\"'right'\"\r\n [addOn]=\"inputFieldAddOn.right\" [data]=\"data\" [group]=\"group\" [form]=\"form\" [containerField]=\"containerField\"\r\n [componentProperties]=\"componentProperties\" [style]=\"componentProperties.containerStyle.style7\">\r\n </app-input-field-addons>\r\n </div>\r\n <app-input-field-addons class=\"addon-bottom e1tag-container-style7\" [position]=\"'bottom'\"\r\n [addOn]=\"inputFieldAddOn.bottom\" [data]=\"data\" [group]=\"group\" [form]=\"form\" [containerField]=\"containerField\"\r\n [componentProperties]=\"componentProperties\" [style]=\"componentProperties.containerStyle.style7\">\r\n </app-input-field-addons>\r\n <app-error [data]=\"data\" [group]=\"group\" [form]=\"form\"></app-error>\r\n <kendo-label class=\"input-value e1tag-container-style6\" *ngIf=\"!(data['_EditMode'].value)\"\r\n [style]=\"componentProperties.containerStyle.style6\"\r\n [text]=\"group.zModel[data.Value] | inputText : data: group | async\"></kendo-label>\r\n </div>\r\n <app-context-menu [data]=\"data\" [group]=\"group\" [form]=\"form\" [target]=\"zinputcontainer\"></app-context-menu>\r\n</div>\r\n", styles: [".required-icon{color:var(--ion-color-danger);padding-left:3px;height:15px;position:relative;top:-1px}.desktop-input-container{padding:8px 0;min-height:calc(var(--input-field-height) + 5px)!important;margin:1px 0;display:inline-flex}.desktop-input-container .input-label{font-size:calc(var(--content-font-size) - 1px);display:flex;padding-left:20px}.desktop-input-container.editMode>.input-label{font-size:var(--content-font-size)}.desktop-input-container>.input-value-container{margin:auto}.desktop-input-container>.input-value-container .input-value-field{display:flex}.desktop-input-container>.input-value-container .input-value-field .input-fields-options{flex-grow:10}.desktop-input-container>.input-value-container .input-value-field app-field-suffix-icon{margin:auto}.desktop-input-container>.input-value-container .input-value{font-size:calc(var(--content-font-size) + 2px);font-weight:600;margin-top:3px}.desktop-input-container.style1 .input-value-container{margin-left:0;padding-right:25px}.desktop-input-container.style1 .input-label{margin:3px 0}.desktop-input-container.style2 .input-value-container{width:100%;margin-top:3px;padding:0 25px 0 20px}.desktop-input-container.style2 .input-label{margin-top:0}.desktop-input-container .addon-right{margin:auto 0;padding-bottom:4px}.desktop-input-container.editMode.style1 .input-label{margin:6px 0 0}.medium-padding.desktop-input-container .input-label{padding-left:10px}.medium-padding.desktop-input-container.style2 .input-value-container{padding:0 10px}.mobile-input-container .input-value-field{width:100%}.tooltipsinfo-icon{padding-left:10px;color:var(--ion-color-primary-tint)}\n"], components: [{ type: i2$1.IonItem, selector: "ion-item", inputs: ["button", "color", "counter", "counterFormatter", "detail", "detailIcon", "disabled", "download", "fill", "href", "lines", "mode", "rel", "routerAnimation", "routerDirection", "shape", "target", "type"] }, { type: i2$1.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { type: i2$1.IonText, selector: "ion-text", inputs: ["color", "mode"] }, { type: ZtextComponent, selector: "app-ztext" }, { type: ZselectmultipleComponent, selector: "app-zselectmultiple" }, { type: ZdatetimeComponent, selector: "app-zdatetime" }, { type: ZpostselectinputComponent, selector: "app-zpostselectinput" }, { type: ZcheckboxComponent, selector: "app-zcheckbox" }, { type: ZnumericComponent, selector: "app-znumeric" }, { type: ZtextareaComponent, selector: "app-ztextarea" }, { type: ZuploadComponent, selector: "app-zupload" }, { type: ZimgComponent, selector: "app-zimg" }, { type: ZtexteditorComponent, selector: "app-ztexteditor" }, { type: ZcolorpickerComponent, selector: "app-zcolorpicker" }, { type: InputErrorMessageComponent, selector: "app-error" }, { type: i15.LabelComponent, selector: "kendo-label", inputs: ["text", "for", "optional"], exportAs: ["kendoLabel"] }, { type: InputFieldAddOnsComponent, selector: "app-input-field-addons", inputs: ["position", "addOn"] }, { type: ContextMenuComponent, selector: "app-context-menu", inputs: ["target", "selectedData"] }], directives: [{ type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i4$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i7.DefaultClassDirective, selector: " [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl], [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl], [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }, { type: i5$2.DefaultLayoutAlignDirective, selector: " [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md], [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md], [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm], [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { type: i5$2.DefaultLayoutDirective, selector: " [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md], [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md], [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm], [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { type: i5$2.DefaultFlexDirective, selector: " [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md], [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md], [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm], [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }], pipes: { "async": i5.AsyncPipe, "inputText": ZInputParser } });
|
|
9064
|
+
ZInputContainerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.3", type: ZInputContainerComponent, selector: "app-zinput-container", usesInheritance: true, ngImport: i0, template: "<div class=\"mobile-input-container e1tag-container-style\" *ngIf=\"isMobileScreen() && !isLoading\"\r\n [style]=\"componentProperties.containerStyle.style\">\r\n <ion-item [formGroup]=\"form\" class=\"e1tag-container-style1\"\r\n *ngIf=\"(!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible)\"\r\n [ngClass]=\"getIon_InvalidClass(form, data)\" [style]=\"componentProperties.containerStyle.style1\">\r\n <ion-label [attr.for]=\"data.Value\" class=\"input-label e1tag-container-style2\"\r\n *ngIf=\"data.ShowLabel === undefined || data.ShowLabel\"\r\n [position]=\"data.LabelPosition ? data.LabelPosition : 'stacked'\"\r\n [style]=\"componentProperties.containerStyle.style2\">\r\n {{componentProperties.label}}\r\n <ion-text *ngIf=\"(!!componentProperties.isRequiredField ? group[componentProperties.isRequiredField] : componentProperties.isRequired)\"\r\n color=\"danger\" class=\"required-icon\">*</ion-text>\r\n </ion-label>\r\n <div class=\"input-value-field\">\r\n <div class=\"input-fields-options\">\r\n <app-ztext *ngIf=\"ztext_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-ztext>\r\n <app-zselectmultiple *ngIf=\"zselect_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-zselectmultiple>\r\n <app-zdatetime *ngIf=\"zdate_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-zdatetime>\r\n <app-sfdatetimepicker *ngIf=\"sfdatetimepicker_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-sfdatetimepicker>\r\n <app-zpostselectinput *ngIf=\"zpostselectinput_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\"\r\n [form]=\"form\" [containerField]=\"containerField\" [componentProperties]=\"componentProperties\"\r\n class=\"e1tag-container-style5\" [style]=\"componentProperties.containerStyle.style5\"\r\n (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-zpostselectinput>\r\n <app-zcheckbox *ngIf=\"zcheckbox_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-zcheckbox>\r\n <app-znumeric *ngIf=\"znumeric_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-znumeric>\r\n <app-ztextarea *ngIf=\"textarea_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-ztextarea>\r\n <app-zupload *ngIf=\"zupload_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-zupload>\r\n <app-zimg *ngIf=\"zimg_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-zimg>\r\n <app-ztexteditor *ngIf=\"ztexteditor_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-ztexteditor>\r\n <app-zcolorpicker *ngIf=\"zcolorpicker_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-zcolorpicker>\r\n </div>\r\n <app-error [data]=\"data\" [group]=\"group\" [form]=\"form\"></app-error>\r\n <!-- <app-field-suffix-element [data]=\"data\" [group]=\"group\" [form]=\"form\" [containerField]=\"containerField\"\r\n [componentProperties]=\"componentProperties\"></app-field-suffix-element> -->\r\n </div>\r\n </ion-item>\r\n</div>\r\n\r\n<div class=\"desktop-input-container e1tag-container-style\" [formGroup]=\"form\"\r\n [style]=\"componentProperties.containerStyle.style\"\r\n *ngIf=\"!isMobileScreen() && !isLoading && (!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible)\"\r\n [ngClass]=\"getClass(form, data)\" [fxLayout]=\"data.FieldLayoutType !== 1 ? 'column' : 'row'\"\r\n fxLayoutAlign=\"space-between stretch\" [class.editMode]=\"(data['_EditMode'].value)\"\r\n #zinputcontainer>\r\n <kendo-label class=\"input-label e1tag-container-style1\" [for]=\"data.Name\" [text]=\"componentProperties.label\"\r\n *ngIf=\"data.ShowLabel\" [style]=\"componentProperties.containerStyle.style1\"\r\n [fxFlex]=\"componentProperties.labelFlexLayoutSize.all\" [fxFlex.xs]=\"componentProperties.labelFlexLayoutSize.xs\"\r\n [fxFlex.sm]=\"componentProperties.labelFlexLayoutSize.sm\" [fxFlex.md]=\"componentProperties.labelFlexLayoutSize.md\"\r\n [fxFlex.lg]=\"componentProperties.labelFlexLayoutSize.lg\" [fxFlex.xl]=\"componentProperties.labelFlexLayoutSize.xl\">\r\n <kendo-label *ngIf=\"data['_EditMode'].value && (!!componentProperties.isRequiredField ? group[componentProperties.isRequiredField] : componentProperties.isRequired)\"\r\n text=\"*\" class=\"required-icon\">\r\n </kendo-label>\r\n <app-input-field-addons class=\"addon-top e1tag-container-style7\" [position]=\"'top'\" [addOn]=\"inputFieldAddOn.top\"\r\n [data]=\"data\" [group]=\"group\" [form]=\"form\" [containerField]=\"containerField\"\r\n [componentProperties]=\"componentProperties\" [style]=\"componentProperties.containerStyle.style7\">\r\n </app-input-field-addons>\r\n </kendo-label>\r\n <div class=\"input-value-container e1tag-container-style2\" [style]=\"componentProperties.containerStyle.style2\"\r\n [fxFlex]=\"componentProperties.fieldFlexLayoutSize.all\" [fxFlex.xs]=\"componentProperties.fieldFlexLayoutSize.xs\"\r\n [fxFlex.sm]=\"componentProperties.fieldFlexLayoutSize.sm\" [fxFlex.md]=\"componentProperties.fieldFlexLayoutSize.md\"\r\n [fxFlex.lg]=\"componentProperties.fieldFlexLayoutSize.lg\" [fxFlex.xl]=\"componentProperties.fieldFlexLayoutSize.xl\">\r\n <div *ngIf=\"data['_EditMode'].value\" class=\"input-value-field e1tag-container-style3\"\r\n [style]=\"componentProperties.containerStyle.style3\">\r\n <!-- TODO: Add 1 more layer for this switch case-->\r\n <app-input-field-addons class=\"addon-left e1tag-container-style7\" [position]=\"'left'\"\r\n [addOn]=\"inputFieldAddOn.left\" [data]=\"data\" [group]=\"group\" [form]=\"form\" [containerField]=\"containerField\"\r\n [componentProperties]=\"componentProperties\" [style]=\"componentProperties.containerStyle.style7\">\r\n </app-input-field-addons>\r\n <div class=\"input-fields-options e1tag-container-style4\" [style]=\"componentProperties.containerStyle.style4\">\r\n <app-ztext *ngIf=\"ztext_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-ztext>\r\n <app-zselectmultiple *ngIf=\"zselect_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-zselectmultiple>\r\n <app-zdatetime *ngIf=\"zdate_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-zdatetime> \r\n <app-sfdatetimepicker *ngIf=\"sfdatetimepicker_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-sfdatetimepicker>\r\n <app-zpostselectinput *ngIf=\"zpostselectinput_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\"\r\n [form]=\"form\" [containerField]=\"containerField\" [componentProperties]=\"componentProperties\"\r\n class=\"e1tag-container-style5\" [style]=\"componentProperties.containerStyle.style5\"\r\n (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-zpostselectinput>\r\n <app-zcheckbox *ngIf=\"zcheckbox_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-zcheckbox>\r\n <app-znumeric *ngIf=\"znumeric_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-znumeric>\r\n <app-ztextarea *ngIf=\"textarea_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-ztextarea>\r\n <app-zupload *ngIf=\"zupload_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-zupload>\r\n <app-zimg *ngIf=\"zimg_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-zimg>\r\n <app-ztexteditor *ngIf=\"ztexteditor_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-ztexteditor>\r\n <app-zcolorpicker *ngIf=\"zcolorpicker_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-zcolorpicker>\r\n </div>\r\n <app-input-field-addons class=\"addon-right e1tag-container-style7\" [position]=\"'right'\"\r\n [addOn]=\"inputFieldAddOn.right\" [data]=\"data\" [group]=\"group\" [form]=\"form\" [containerField]=\"containerField\"\r\n [componentProperties]=\"componentProperties\" [style]=\"componentProperties.containerStyle.style7\">\r\n </app-input-field-addons>\r\n </div>\r\n <app-input-field-addons class=\"addon-bottom e1tag-container-style7\" [position]=\"'bottom'\"\r\n [addOn]=\"inputFieldAddOn.bottom\" [data]=\"data\" [group]=\"group\" [form]=\"form\" [containerField]=\"containerField\"\r\n [componentProperties]=\"componentProperties\" [style]=\"componentProperties.containerStyle.style7\">\r\n </app-input-field-addons>\r\n <app-error [data]=\"data\" [group]=\"group\" [form]=\"form\"></app-error>\r\n <kendo-label class=\"input-value e1tag-container-style6\" *ngIf=\"!(data['_EditMode'].value)\"\r\n [style]=\"componentProperties.containerStyle.style6\"\r\n [text]=\"group.zModel[data.Value] | inputText : data: group | async\"></kendo-label>\r\n </div>\r\n <app-context-menu [data]=\"data\" [group]=\"group\" [form]=\"form\" [target]=\"zinputcontainer\"></app-context-menu>\r\n</div>\r\n", styles: [".required-icon{color:var(--ion-color-danger);padding-left:3px;height:15px;position:relative;top:-1px}.desktop-input-container{padding:8px 0;min-height:calc(var(--input-field-height) + 5px)!important;margin:1px 0;display:inline-flex}.desktop-input-container .input-label{font-size:calc(var(--content-font-size) - 1px);display:flex;padding-left:20px}.desktop-input-container.editMode>.input-label{font-size:var(--content-font-size)}.desktop-input-container>.input-value-container{margin:auto}.desktop-input-container>.input-value-container .input-value-field{display:flex}.desktop-input-container>.input-value-container .input-value-field .input-fields-options{flex-grow:10}.desktop-input-container>.input-value-container .input-value-field app-field-suffix-icon{margin:auto}.desktop-input-container>.input-value-container .input-value{font-size:calc(var(--content-font-size) + 2px);font-weight:600;margin-top:3px}.desktop-input-container.style1 .input-value-container{margin-left:0;padding-right:25px}.desktop-input-container.style1 .input-label{margin:3px 0}.desktop-input-container.style2 .input-value-container{width:100%;margin-top:3px;padding:0 25px 0 20px}.desktop-input-container.style2 .input-label{margin-top:0}.desktop-input-container .addon-right{margin:auto 0;padding-bottom:4px}.desktop-input-container.editMode.style1 .input-label{margin:6px 0 0}.medium-padding.desktop-input-container .input-label{padding-left:10px}.medium-padding.desktop-input-container.style2 .input-value-container{padding:0 10px}.mobile-input-container .input-value-field{width:100%}.tooltipsinfo-icon{padding-left:10px;color:var(--ion-color-primary-tint)}\n"], components: [{ type: i2$1.IonItem, selector: "ion-item", inputs: ["button", "color", "counter", "counterFormatter", "detail", "detailIcon", "disabled", "download", "fill", "href", "lines", "mode", "rel", "routerAnimation", "routerDirection", "shape", "target", "type"] }, { type: i2$1.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { type: i2$1.IonText, selector: "ion-text", inputs: ["color", "mode"] }, { type: ZtextComponent, selector: "app-ztext" }, { type: ZselectmultipleComponent, selector: "app-zselectmultiple" }, { type: ZdatetimeComponent, selector: "app-zdatetime" }, { type: SfdatetimepickerComponent, selector: "app-sfdatetimepicker" }, { type: ZpostselectinputComponent, selector: "app-zpostselectinput" }, { type: ZcheckboxComponent, selector: "app-zcheckbox" }, { type: ZnumericComponent, selector: "app-znumeric" }, { type: ZtextareaComponent, selector: "app-ztextarea" }, { type: ZuploadComponent, selector: "app-zupload" }, { type: ZimgComponent, selector: "app-zimg" }, { type: ZtexteditorComponent, selector: "app-ztexteditor" }, { type: ZcolorpickerComponent, selector: "app-zcolorpicker" }, { type: InputErrorMessageComponent, selector: "app-error" }, { type: i16.LabelComponent, selector: "kendo-label", inputs: ["text", "for", "optional"], exportAs: ["kendoLabel"] }, { type: InputFieldAddOnsComponent, selector: "app-input-field-addons", inputs: ["position", "addOn"] }, { type: ContextMenuComponent, selector: "app-context-menu", inputs: ["target", "selectedData"] }], directives: [{ type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i4$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i7.DefaultClassDirective, selector: " [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl], [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl], [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }, { type: i5$2.DefaultLayoutAlignDirective, selector: " [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md], [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md], [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm], [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { type: i5$2.DefaultLayoutDirective, selector: " [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md], [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md], [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm], [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { type: i5$2.DefaultFlexDirective, selector: " [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md], [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md], [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm], [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }], pipes: { "async": i5.AsyncPipe, "inputText": ZInputParser } });
|
|
8988
9065
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: ZInputContainerComponent, decorators: [{
|
|
8989
9066
|
type: Component,
|
|
8990
|
-
args: [{ selector: "app-zinput-container", template: "<div class=\"mobile-input-container e1tag-container-style\" *ngIf=\"isMobileScreen() && !isLoading\"\r\n [style]=\"componentProperties.containerStyle.style\">\r\n <ion-item [formGroup]=\"form\" class=\"e1tag-container-style1\"\r\n *ngIf=\"(!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible)\"\r\n [ngClass]=\"getIon_InvalidClass(form, data)\" [style]=\"componentProperties.containerStyle.style1\">\r\n <ion-label [attr.for]=\"data.Value\" class=\"input-label e1tag-container-style2\"\r\n *ngIf=\"data.ShowLabel === undefined || data.ShowLabel\"\r\n [position]=\"data.LabelPosition ? data.LabelPosition : 'stacked'\"\r\n [style]=\"componentProperties.containerStyle.style2\">\r\n {{componentProperties.label}}\r\n <ion-text *ngIf=\"(!!componentProperties.isRequiredField ? group[componentProperties.isRequiredField] : componentProperties.isRequired)\"\r\n color=\"danger\" class=\"required-icon\">*</ion-text>\r\n </ion-label>\r\n <div class=\"input-value-field\">\r\n <div class=\"input-fields-options\">\r\n <app-ztext *ngIf=\"ztext_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-ztext>\r\n <app-zselectmultiple *ngIf=\"zselect_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-zselectmultiple>\r\n <app-zdatetime *ngIf=\"zdate_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-zdatetime>\r\n <app-zpostselectinput *ngIf=\"zpostselectinput_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\"\r\n [form]=\"form\" [containerField]=\"containerField\" [componentProperties]=\"componentProperties\"\r\n class=\"e1tag-container-style5\" [style]=\"componentProperties.containerStyle.style5\"\r\n (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-zpostselectinput>\r\n <app-zcheckbox *ngIf=\"zcheckbox_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-zcheckbox>\r\n <app-znumeric *ngIf=\"znumeric_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-znumeric>\r\n <app-ztextarea *ngIf=\"textarea_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-ztextarea>\r\n <app-zupload *ngIf=\"zupload_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-zupload>\r\n <app-zimg *ngIf=\"zimg_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-zimg>\r\n <app-ztexteditor *ngIf=\"ztexteditor_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-ztexteditor>\r\n <app-zcolorpicker *ngIf=\"zcolorpicker_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-zcolorpicker>\r\n </div>\r\n <app-error [data]=\"data\" [group]=\"group\" [form]=\"form\"></app-error>\r\n <!-- <app-field-suffix-element [data]=\"data\" [group]=\"group\" [form]=\"form\" [containerField]=\"containerField\"\r\n [componentProperties]=\"componentProperties\"></app-field-suffix-element> -->\r\n </div>\r\n </ion-item>\r\n</div>\r\n\r\n<div class=\"desktop-input-container e1tag-container-style\" [formGroup]=\"form\"\r\n [style]=\"componentProperties.containerStyle.style\"\r\n *ngIf=\"!isMobileScreen() && !isLoading && (!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible)\"\r\n [ngClass]=\"getClass(form, data)\" [fxLayout]=\"data.FieldLayoutType !== 1 ? 'column' : 'row'\"\r\n fxLayoutAlign=\"space-between stretch\" [class.editMode]=\"(data['_EditMode'].value)\"\r\n #zinputcontainer>\r\n <kendo-label class=\"input-label e1tag-container-style1\" [for]=\"data.Name\" [text]=\"componentProperties.label\"\r\n *ngIf=\"data.ShowLabel\" [style]=\"componentProperties.containerStyle.style1\"\r\n [fxFlex]=\"componentProperties.labelFlexLayoutSize.all\" [fxFlex.xs]=\"componentProperties.labelFlexLayoutSize.xs\"\r\n [fxFlex.sm]=\"componentProperties.labelFlexLayoutSize.sm\" [fxFlex.md]=\"componentProperties.labelFlexLayoutSize.md\"\r\n [fxFlex.lg]=\"componentProperties.labelFlexLayoutSize.lg\" [fxFlex.xl]=\"componentProperties.labelFlexLayoutSize.xl\">\r\n <kendo-label *ngIf=\"data['_EditMode'].value && (!!componentProperties.isRequiredField ? group[componentProperties.isRequiredField] : componentProperties.isRequired)\"\r\n text=\"*\" class=\"required-icon\">\r\n </kendo-label>\r\n <app-input-field-addons class=\"addon-top e1tag-container-style7\" [position]=\"'top'\" [addOn]=\"inputFieldAddOn.top\"\r\n [data]=\"data\" [group]=\"group\" [form]=\"form\" [containerField]=\"containerField\"\r\n [componentProperties]=\"componentProperties\" [style]=\"componentProperties.containerStyle.style7\">\r\n </app-input-field-addons>\r\n </kendo-label>\r\n <div class=\"input-value-container e1tag-container-style2\" [style]=\"componentProperties.containerStyle.style2\"\r\n [fxFlex]=\"componentProperties.fieldFlexLayoutSize.all\" [fxFlex.xs]=\"componentProperties.fieldFlexLayoutSize.xs\"\r\n [fxFlex.sm]=\"componentProperties.fieldFlexLayoutSize.sm\" [fxFlex.md]=\"componentProperties.fieldFlexLayoutSize.md\"\r\n [fxFlex.lg]=\"componentProperties.fieldFlexLayoutSize.lg\" [fxFlex.xl]=\"componentProperties.fieldFlexLayoutSize.xl\">\r\n <div *ngIf=\"data['_EditMode'].value\" class=\"input-value-field e1tag-container-style3\"\r\n [style]=\"componentProperties.containerStyle.style3\">\r\n <!-- TODO: Add 1 more layer for this switch case-->\r\n <app-input-field-addons class=\"addon-left e1tag-container-style7\" [position]=\"'left'\"\r\n [addOn]=\"inputFieldAddOn.left\" [data]=\"data\" [group]=\"group\" [form]=\"form\" [containerField]=\"containerField\"\r\n [componentProperties]=\"componentProperties\" [style]=\"componentProperties.containerStyle.style7\">\r\n </app-input-field-addons>\r\n <div class=\"input-fields-options e1tag-container-style4\" [style]=\"componentProperties.containerStyle.style4\">\r\n <app-ztext *ngIf=\"ztext_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-ztext>\r\n <app-zselectmultiple *ngIf=\"zselect_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-zselectmultiple>\r\n <app-zdatetime *ngIf=\"zdate_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-zdatetime>\r\n <app-zpostselectinput *ngIf=\"zpostselectinput_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\"\r\n [form]=\"form\" [containerField]=\"containerField\" [componentProperties]=\"componentProperties\"\r\n class=\"e1tag-container-style5\" [style]=\"componentProperties.containerStyle.style5\"\r\n (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-zpostselectinput>\r\n <app-zcheckbox *ngIf=\"zcheckbox_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-zcheckbox>\r\n <app-znumeric *ngIf=\"znumeric_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-znumeric>\r\n <app-ztextarea *ngIf=\"textarea_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-ztextarea>\r\n <app-zupload *ngIf=\"zupload_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-zupload>\r\n <app-zimg *ngIf=\"zimg_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-zimg>\r\n <app-ztexteditor *ngIf=\"ztexteditor_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-ztexteditor>\r\n <app-zcolorpicker *ngIf=\"zcolorpicker_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-zcolorpicker>\r\n </div>\r\n <app-input-field-addons class=\"addon-right e1tag-container-style7\" [position]=\"'right'\"\r\n [addOn]=\"inputFieldAddOn.right\" [data]=\"data\" [group]=\"group\" [form]=\"form\" [containerField]=\"containerField\"\r\n [componentProperties]=\"componentProperties\" [style]=\"componentProperties.containerStyle.style7\">\r\n </app-input-field-addons>\r\n </div>\r\n <app-input-field-addons class=\"addon-bottom e1tag-container-style7\" [position]=\"'bottom'\"\r\n [addOn]=\"inputFieldAddOn.bottom\" [data]=\"data\" [group]=\"group\" [form]=\"form\" [containerField]=\"containerField\"\r\n [componentProperties]=\"componentProperties\" [style]=\"componentProperties.containerStyle.style7\">\r\n </app-input-field-addons>\r\n <app-error [data]=\"data\" [group]=\"group\" [form]=\"form\"></app-error>\r\n <kendo-label class=\"input-value e1tag-container-style6\" *ngIf=\"!(data['_EditMode'].value)\"\r\n [style]=\"componentProperties.containerStyle.style6\"\r\n [text]=\"group.zModel[data.Value] | inputText : data: group | async\"></kendo-label>\r\n </div>\r\n <app-context-menu [data]=\"data\" [group]=\"group\" [form]=\"form\" [target]=\"zinputcontainer\"></app-context-menu>\r\n</div>\r\n", styles: [".required-icon{color:var(--ion-color-danger);padding-left:3px;height:15px;position:relative;top:-1px}.desktop-input-container{padding:8px 0;min-height:calc(var(--input-field-height) + 5px)!important;margin:1px 0;display:inline-flex}.desktop-input-container .input-label{font-size:calc(var(--content-font-size) - 1px);display:flex;padding-left:20px}.desktop-input-container.editMode>.input-label{font-size:var(--content-font-size)}.desktop-input-container>.input-value-container{margin:auto}.desktop-input-container>.input-value-container .input-value-field{display:flex}.desktop-input-container>.input-value-container .input-value-field .input-fields-options{flex-grow:10}.desktop-input-container>.input-value-container .input-value-field app-field-suffix-icon{margin:auto}.desktop-input-container>.input-value-container .input-value{font-size:calc(var(--content-font-size) + 2px);font-weight:600;margin-top:3px}.desktop-input-container.style1 .input-value-container{margin-left:0;padding-right:25px}.desktop-input-container.style1 .input-label{margin:3px 0}.desktop-input-container.style2 .input-value-container{width:100%;margin-top:3px;padding:0 25px 0 20px}.desktop-input-container.style2 .input-label{margin-top:0}.desktop-input-container .addon-right{margin:auto 0;padding-bottom:4px}.desktop-input-container.editMode.style1 .input-label{margin:6px 0 0}.medium-padding.desktop-input-container .input-label{padding-left:10px}.medium-padding.desktop-input-container.style2 .input-value-container{padding:0 10px}.mobile-input-container .input-value-field{width:100%}.tooltipsinfo-icon{padding-left:10px;color:var(--ion-color-primary-tint)}\n"] }]
|
|
9067
|
+
args: [{ selector: "app-zinput-container", template: "<div class=\"mobile-input-container e1tag-container-style\" *ngIf=\"isMobileScreen() && !isLoading\"\r\n [style]=\"componentProperties.containerStyle.style\">\r\n <ion-item [formGroup]=\"form\" class=\"e1tag-container-style1\"\r\n *ngIf=\"(!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible)\"\r\n [ngClass]=\"getIon_InvalidClass(form, data)\" [style]=\"componentProperties.containerStyle.style1\">\r\n <ion-label [attr.for]=\"data.Value\" class=\"input-label e1tag-container-style2\"\r\n *ngIf=\"data.ShowLabel === undefined || data.ShowLabel\"\r\n [position]=\"data.LabelPosition ? data.LabelPosition : 'stacked'\"\r\n [style]=\"componentProperties.containerStyle.style2\">\r\n {{componentProperties.label}}\r\n <ion-text *ngIf=\"(!!componentProperties.isRequiredField ? group[componentProperties.isRequiredField] : componentProperties.isRequired)\"\r\n color=\"danger\" class=\"required-icon\">*</ion-text>\r\n </ion-label>\r\n <div class=\"input-value-field\">\r\n <div class=\"input-fields-options\">\r\n <app-ztext *ngIf=\"ztext_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-ztext>\r\n <app-zselectmultiple *ngIf=\"zselect_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-zselectmultiple>\r\n <app-zdatetime *ngIf=\"zdate_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-zdatetime>\r\n <app-sfdatetimepicker *ngIf=\"sfdatetimepicker_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-sfdatetimepicker>\r\n <app-zpostselectinput *ngIf=\"zpostselectinput_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\"\r\n [form]=\"form\" [containerField]=\"containerField\" [componentProperties]=\"componentProperties\"\r\n class=\"e1tag-container-style5\" [style]=\"componentProperties.containerStyle.style5\"\r\n (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-zpostselectinput>\r\n <app-zcheckbox *ngIf=\"zcheckbox_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-zcheckbox>\r\n <app-znumeric *ngIf=\"znumeric_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-znumeric>\r\n <app-ztextarea *ngIf=\"textarea_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-ztextarea>\r\n <app-zupload *ngIf=\"zupload_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-zupload>\r\n <app-zimg *ngIf=\"zimg_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-zimg>\r\n <app-ztexteditor *ngIf=\"ztexteditor_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-ztexteditor>\r\n <app-zcolorpicker *ngIf=\"zcolorpicker_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-zcolorpicker>\r\n </div>\r\n <app-error [data]=\"data\" [group]=\"group\" [form]=\"form\"></app-error>\r\n <!-- <app-field-suffix-element [data]=\"data\" [group]=\"group\" [form]=\"form\" [containerField]=\"containerField\"\r\n [componentProperties]=\"componentProperties\"></app-field-suffix-element> -->\r\n </div>\r\n </ion-item>\r\n</div>\r\n\r\n<div class=\"desktop-input-container e1tag-container-style\" [formGroup]=\"form\"\r\n [style]=\"componentProperties.containerStyle.style\"\r\n *ngIf=\"!isMobileScreen() && !isLoading && (!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible)\"\r\n [ngClass]=\"getClass(form, data)\" [fxLayout]=\"data.FieldLayoutType !== 1 ? 'column' : 'row'\"\r\n fxLayoutAlign=\"space-between stretch\" [class.editMode]=\"(data['_EditMode'].value)\"\r\n #zinputcontainer>\r\n <kendo-label class=\"input-label e1tag-container-style1\" [for]=\"data.Name\" [text]=\"componentProperties.label\"\r\n *ngIf=\"data.ShowLabel\" [style]=\"componentProperties.containerStyle.style1\"\r\n [fxFlex]=\"componentProperties.labelFlexLayoutSize.all\" [fxFlex.xs]=\"componentProperties.labelFlexLayoutSize.xs\"\r\n [fxFlex.sm]=\"componentProperties.labelFlexLayoutSize.sm\" [fxFlex.md]=\"componentProperties.labelFlexLayoutSize.md\"\r\n [fxFlex.lg]=\"componentProperties.labelFlexLayoutSize.lg\" [fxFlex.xl]=\"componentProperties.labelFlexLayoutSize.xl\">\r\n <kendo-label *ngIf=\"data['_EditMode'].value && (!!componentProperties.isRequiredField ? group[componentProperties.isRequiredField] : componentProperties.isRequired)\"\r\n text=\"*\" class=\"required-icon\">\r\n </kendo-label>\r\n <app-input-field-addons class=\"addon-top e1tag-container-style7\" [position]=\"'top'\" [addOn]=\"inputFieldAddOn.top\"\r\n [data]=\"data\" [group]=\"group\" [form]=\"form\" [containerField]=\"containerField\"\r\n [componentProperties]=\"componentProperties\" [style]=\"componentProperties.containerStyle.style7\">\r\n </app-input-field-addons>\r\n </kendo-label>\r\n <div class=\"input-value-container e1tag-container-style2\" [style]=\"componentProperties.containerStyle.style2\"\r\n [fxFlex]=\"componentProperties.fieldFlexLayoutSize.all\" [fxFlex.xs]=\"componentProperties.fieldFlexLayoutSize.xs\"\r\n [fxFlex.sm]=\"componentProperties.fieldFlexLayoutSize.sm\" [fxFlex.md]=\"componentProperties.fieldFlexLayoutSize.md\"\r\n [fxFlex.lg]=\"componentProperties.fieldFlexLayoutSize.lg\" [fxFlex.xl]=\"componentProperties.fieldFlexLayoutSize.xl\">\r\n <div *ngIf=\"data['_EditMode'].value\" class=\"input-value-field e1tag-container-style3\"\r\n [style]=\"componentProperties.containerStyle.style3\">\r\n <!-- TODO: Add 1 more layer for this switch case-->\r\n <app-input-field-addons class=\"addon-left e1tag-container-style7\" [position]=\"'left'\"\r\n [addOn]=\"inputFieldAddOn.left\" [data]=\"data\" [group]=\"group\" [form]=\"form\" [containerField]=\"containerField\"\r\n [componentProperties]=\"componentProperties\" [style]=\"componentProperties.containerStyle.style7\">\r\n </app-input-field-addons>\r\n <div class=\"input-fields-options e1tag-container-style4\" [style]=\"componentProperties.containerStyle.style4\">\r\n <app-ztext *ngIf=\"ztext_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-ztext>\r\n <app-zselectmultiple *ngIf=\"zselect_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-zselectmultiple>\r\n <app-zdatetime *ngIf=\"zdate_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-zdatetime> \r\n <app-sfdatetimepicker *ngIf=\"sfdatetimepicker_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-sfdatetimepicker>\r\n <app-zpostselectinput *ngIf=\"zpostselectinput_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\"\r\n [form]=\"form\" [containerField]=\"containerField\" [componentProperties]=\"componentProperties\"\r\n class=\"e1tag-container-style5\" [style]=\"componentProperties.containerStyle.style5\"\r\n (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-zpostselectinput>\r\n <app-zcheckbox *ngIf=\"zcheckbox_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-zcheckbox>\r\n <app-znumeric *ngIf=\"znumeric_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-znumeric>\r\n <app-ztextarea *ngIf=\"textarea_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-ztextarea>\r\n <app-zupload *ngIf=\"zupload_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-zupload>\r\n <app-zimg *ngIf=\"zimg_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-zimg>\r\n <app-ztexteditor *ngIf=\"ztexteditor_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-ztexteditor>\r\n <app-zcolorpicker *ngIf=\"zcolorpicker_type.includes(data.Type)\" [data]=\"data\" [group]=\"group\" [form]=\"form\"\r\n [containerField]=\"containerField\" [componentProperties]=\"componentProperties\" class=\"e1tag-container-style5\"\r\n [style]=\"componentProperties.containerStyle.style5\" (triggerContainerEvent)=\"triggerContainerEvent($event)\">\r\n </app-zcolorpicker>\r\n </div>\r\n <app-input-field-addons class=\"addon-right e1tag-container-style7\" [position]=\"'right'\"\r\n [addOn]=\"inputFieldAddOn.right\" [data]=\"data\" [group]=\"group\" [form]=\"form\" [containerField]=\"containerField\"\r\n [componentProperties]=\"componentProperties\" [style]=\"componentProperties.containerStyle.style7\">\r\n </app-input-field-addons>\r\n </div>\r\n <app-input-field-addons class=\"addon-bottom e1tag-container-style7\" [position]=\"'bottom'\"\r\n [addOn]=\"inputFieldAddOn.bottom\" [data]=\"data\" [group]=\"group\" [form]=\"form\" [containerField]=\"containerField\"\r\n [componentProperties]=\"componentProperties\" [style]=\"componentProperties.containerStyle.style7\">\r\n </app-input-field-addons>\r\n <app-error [data]=\"data\" [group]=\"group\" [form]=\"form\"></app-error>\r\n <kendo-label class=\"input-value e1tag-container-style6\" *ngIf=\"!(data['_EditMode'].value)\"\r\n [style]=\"componentProperties.containerStyle.style6\"\r\n [text]=\"group.zModel[data.Value] | inputText : data: group | async\"></kendo-label>\r\n </div>\r\n <app-context-menu [data]=\"data\" [group]=\"group\" [form]=\"form\" [target]=\"zinputcontainer\"></app-context-menu>\r\n</div>\r\n", styles: [".required-icon{color:var(--ion-color-danger);padding-left:3px;height:15px;position:relative;top:-1px}.desktop-input-container{padding:8px 0;min-height:calc(var(--input-field-height) + 5px)!important;margin:1px 0;display:inline-flex}.desktop-input-container .input-label{font-size:calc(var(--content-font-size) - 1px);display:flex;padding-left:20px}.desktop-input-container.editMode>.input-label{font-size:var(--content-font-size)}.desktop-input-container>.input-value-container{margin:auto}.desktop-input-container>.input-value-container .input-value-field{display:flex}.desktop-input-container>.input-value-container .input-value-field .input-fields-options{flex-grow:10}.desktop-input-container>.input-value-container .input-value-field app-field-suffix-icon{margin:auto}.desktop-input-container>.input-value-container .input-value{font-size:calc(var(--content-font-size) + 2px);font-weight:600;margin-top:3px}.desktop-input-container.style1 .input-value-container{margin-left:0;padding-right:25px}.desktop-input-container.style1 .input-label{margin:3px 0}.desktop-input-container.style2 .input-value-container{width:100%;margin-top:3px;padding:0 25px 0 20px}.desktop-input-container.style2 .input-label{margin-top:0}.desktop-input-container .addon-right{margin:auto 0;padding-bottom:4px}.desktop-input-container.editMode.style1 .input-label{margin:6px 0 0}.medium-padding.desktop-input-container .input-label{padding-left:10px}.medium-padding.desktop-input-container.style2 .input-value-container{padding:0 10px}.mobile-input-container .input-value-field{width:100%}.tooltipsinfo-icon{padding-left:10px;color:var(--ion-color-primary-tint)}\n"] }]
|
|
8991
9068
|
}], ctorParameters: function () { return [{ type: ZComponentService }]; } });
|
|
8992
9069
|
|
|
8993
9070
|
/********** Angular **********/
|
|
@@ -10027,7 +10104,7 @@ class ZgridComponent extends DataListingFieldBase {
|
|
|
10027
10104
|
}
|
|
10028
10105
|
}
|
|
10029
10106
|
ZgridComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: ZgridComponent, deps: [{ token: ZComponentService }, { token: i2.FontAweSomeService }, { token: i1.ActivatedRoute }, { token: i1.Router }, { token: i4$1.FormBuilder }, { token: i2.WebApiService }, { token: i2.ToastService }, { token: i2.ZCoreService }, { token: i2.StorageSessionService }, { token: MainService }, { token: i0.ChangeDetectorRef }, { token: ZGridService }, { token: i2.OfflineDatabaseService }, { token: i2.ResourceApiService }], target: i0.ɵɵFactoryTarget.Component });
|
|
10030
|
-
ZgridComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.3", type: ZgridComponent, selector: "app-zgrid", viewQueries: [{ propertyName: "tooltipDir", first: true, predicate: TooltipDirective, descendants: true }, { propertyName: "elementContainer", first: true, predicate: ElementContainerDirective, descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<!--\r\n<div style=\"margin: 10px\">\r\n <div class=\"card\">\r\n <div class=\"card-block k-form\">\r\n <fieldset>\r\n <legend>Binding types</legend>\r\n <div class=\"k-form-field\">\r\n <span>Bind the data to:</span>\r\n <input [(ngModel)]=\"bindingType\" type=\"radio\" name=\"mode\" id=\"array\" value=\"array\" class=\"k-radio\"\r\n (change)=\"changeBindingType($event)\">\r\n <label class=\"k-radio-label\" for=\"array\">Array object</label>\r\n <input [(ngModel)]=\"bindingType\" type=\"radio\" name=\"mode\" id=\"gridDataResult\" value=\"gridDataResult\" class=\"k-radio\"\r\n (change)=\"changeBindingType($event)\">\r\n <label class=\"k-radio-label\" for=\"gridDataResult\">GridDataResult object</label>\r\n <input [(ngModel)]=\"bindingType\" type=\"radio\" name=\"mode\" id=\"async\" value=\"async\" class=\"k-radio\"\r\n (change)=\"changeBindingType($event)\">\r\n <label class=\"k-radio-label\" for=\"async\">Asynchronous source</label>\r\n </div>\r\n </fieldset>\r\n </div>\r\n </div>\r\n</div> -->\r\n<div class=\"grid-container e1tag-style\" [ngClass]=\"data.Class\" [style]=\"componentProperties.style.style\">\r\n\r\n <!-- <div *ngIf=\"data.Title\" class=\"gridTitle\">{{data.Title}}</div> -->\r\n <ng-template #template let-anchor>\r\n <span>{{ anchor.nativeElement.innerText }}</span>\r\n </ng-template>\r\n <kendo-popover #gridPopOver [position]=\"data.PopOverPosition || 'bottom'\" [templateData]=\"getContextData.bind(this)\">\r\n <!-- <ng-template kendoPopoverTitleTemplate let-data=\"data\" >\r\n <div [style]=\"data.TitleStyle\" *ngIf=\"data && data.Title\" [innerHTML]=\"data.Title\"></div>\r\n </ng-template> -->\r\n <ng-template kendoPopoverBodyTemplate let-data=\"data\">\r\n <div [style]=\"data.BodyStyle\" class=\"popoverbody\" *ngIf=\"data && data.Body\" [innerHTML]=\"data.Body | htmlSanitize\" [ngClass]=\"data.BodyClass\" (mouseleave)=\"closePopOver.call(this, $event)\"></div>\r\n </ng-template>\r\n </kendo-popover>\r\n\r\n <div kendoTooltip showOn=\"none\" [tooltipTemplate]=\"template\" filter=\".k-grid td\" (mouseover)=\"showTooltip($event)\" [style]=\"componentProperties.style.style1\" class=\"e1tag-style1\">\r\n <div kendoPopoverContainer [popover]=\"gridPopOver\" filter=\"div.gridCell.withPopoverInGrid\" showOn=\"none\" kendoPopoverContainer #popovercontainer=\"kendoPopoverContainer\">\r\n <kendo-grid [zgridbinding]=\"{data: data, group: group, params: params, gridSubject: gridSubject, gridSetting: gridSetting}\" [ngClass]=\"data.Class\" class=\"desktop-grid e1tag-style2\"\r\n [scrollable]=\"data.scrollAble === false ? 'none' : 'scrollable'\"\r\n [pageable]=\"pageable\"\r\n [class.hiden-pager]=\"!pageable\"\r\n [pageSize]=\"gridSetting.gridState.take\"\r\n [skip]=\"gridSetting.gridState.skip\"\r\n [sort]=\"gridSetting.gridState.sort\"\r\n [sortable]=\"{allowUnsort: true,mode: 'multiple'}\"\r\n [filter]=\"gridSetting.gridState.filter\"\r\n [filterable]=\"data.enableFiltering !== false\"\r\n [resizable]=\"true\"\r\n [reorderable]=\"true\"\r\n [columnMenu]=\"data.DisableGridColumnMenu ? false : { filter: true }\"\r\n [hidden]=\"!(!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible)\"\r\n (cellClick)=\"cellClickHandler($event)\"\r\n (cellClose)=\"editCellCloseHandler($event)\"\r\n (dataStateChange)=\"dataStateChange($event)\"\r\n (pageChange)=\"pageChange($event)\"\r\n (sortChange)=\"sortChange($event)\"\r\n (filterChange)=\"filterChange($event)\"\r\n [kendoGridSelectBy]=\"rowSelectionKey\"\r\n [selectable]=\"selectableSettings\"\r\n [(selectedKeys)]=\"mySelection\"\r\n [style]=\"componentProperties.style.style2\"\r\n [trackBy]=\"trackBy\"\r\n (cancel)=\"cancelHandler($event)\"\r\n (save)=\"saveHandler($event)\"\r\n (remove)=\"removeHandler($event)\"\r\n (edit)=\"editHandler($event)\"\r\n (add)=\"addHandler($event)\"\r\n (columnResize)=\"adjustWidthUponResize()\"\r\n (excelExport)=\"onExcelExport($event)\"\r\n [rowClass]=\"rowCallback.bind(this)\">\r\n <ng-template kendoGridToolbarTemplate\r\n *ngIf=\"data.AllowRefreshButton || data.AllowExport || data.AllowSaveState || data.Title || data.GridButtonFieldName_WF || data.GridButtonFieldName || data.EnableGridCommand || data.EnableCustomAddCommand || data.EnableCustomResetCommand\">\r\n <div class=\"toolbar-left-item\" *ngIf=\"gridTitle || data.AllowRefreshButton || data.AllowExport\">\r\n <!-- <fa-icon *ngIf=\"data.Icon\" class=\"gridTitleIcon\" [icon]=\"data.Icon\"></fa-icon> -->\r\n <kendo-label class=\"gridTitle\" *ngIf=\"gridTitle\">{{ gridTitle }}</kendo-label>\r\n <button title=\"Refresh\" type=\"button\" class=\"left-buttons refresh-button\" kendoButton (click)=\"refreshData()\"\r\n *ngIf=\"data.AllowRefreshButton\">\r\n <span class=\"k-icon k-grid-button k-i-refresh-sm\"></span>\r\n </button>\r\n <div class=\"toolbar-left-item-second-container\" *ngIf=\"data.AllowExport\" [class.with-grid-title]=\"gridTitle || data.AllowRefreshButton\">\r\n <button type=\"button\" class=\"left-buttons export-button\" kendoGridExcelCommand *ngIf=\"data.AllowExport\">\r\n <!-- <span class=\"k-icon k-i-file-excel\"></span> -->\r\n <fa-icon icon=\"download\"></fa-icon>\r\n <span class=\"export-to-excel-button-text\">{{ getToolBarItemLabelName('Download as Excel') }}</span>\r\n </button>\r\n </div>\r\n </div>\r\n <div class=\"toolbar-right-item\" *ngIf=\"gridBtn || data.CacheInfo?.EnableSaveState || gridDefaultStateExist || data.EnableGridCommand || data.EnableCustomAddCommand || data.EnableCustomResetCommand\">\r\n <app-zworkflowbuttons *ngIf=\"gridBtn && gridBtn.Type === 'zworkflowbuttons'\" [data]=\"gridBtn\" [group]=\"group\" [form]=\"form\"></app-zworkflowbuttons>\r\n <app-zbuttons *ngIf=\"gridBtn && gridBtn.Type === 'zbuttons'\" [data]=\"gridBtn\" [group]=\"group\" [form]=\"form\"></app-zbuttons>\r\n <button type=\"button\" kendoButton (click)=\"saveGridSettings()\" *ngIf=\"data.CacheInfo?.EnableSaveState\">\r\n <span class=\"k-icon k-icon-with-text k-i-star\"></span>{{ getToolBarItemLabelName('Save Settings') }}\r\n </button>\r\n <button type=\"button\" kendoButton (click)=\"restoreGridSettings()\" *ngIf=\"showRestoreGridSettingButton\">\r\n <span class=\"k-icon k-icon-with-text k-i-star-outline\"></span>{{ getToolBarItemLabelName('Restore Settings') }}\r\n </button>\r\n <button type=\"button\" kendoGridAddCommand *ngIf=\"data.EnableGridCommand\">\r\n <span class=\"k-icon k-icon-with-text k-i-add\"></span>{{ getToolBarItemLabelName(data.AddCommandButtonName ? data.AddCommandButtonName: 'Add') }}\r\n </button>\r\n <button type=\"button\" kendoButton (click)=\"gridCustomAddCommand(group)\" *ngIf=\"data.EnableCustomAddCommand\">\r\n <span class=\"k-icon k-icon-with-text k-i-add\"></span>{{ getToolBarItemLabelName(data.AddCommandButtonName ? data.AddCommandButtonName: 'Add') }}\r\n </button>\r\n <button type=\"button\" kendoButton (click)=\"gridCustomResetCommand(group)\" *ngIf=\"data.EnableCustomResetCommand\">\r\n <span class=\"k-icon k-icon-with-text k-i-trash\"></span>{{ getToolBarItemLabelName(data.ResetCommandButtonName ? data.ResetCommandButtonName: 'Reset') }}\r\n </button>\r\n </div>\r\n <div class=\"filter-container\" *ngIf=\"data.GridFilterBarField\">\r\n <div class=\"normal-filter-container\">\r\n <app-zform class=\"filter-fields\" [group]=\"filterGroup\" [fieldName]=\"data.GridFilterBarField\"></app-zform>\r\n <div class=\"filter-buttons\" [ngClass]=\"data.Class\">\r\n <ion-button fill=\"solid\" size=\"default\" strong=\"true\" color=\"primary\" (click)=\"search()\">\r\n <fa-icon icon=\"search\"></fa-icon>\r\n <span class=\"btn-label ion-text-capitalize\">{{ getToolBarItemLabelName('Search') }}</span>\r\n </ion-button>\r\n <ion-button fill=\"outline\" size=\"default\" strong=\"true\" color=\"primary\" (click)=\"cancelEdit()\" *ngIf=\"data.IsShowGridCancelFilterButton\">\r\n <fa-icon icon=\"times\"></fa-icon>\r\n </ion-button>\r\n <ion-button fill=\"solid\" size=\"default\" strong=\"true\" [ngClass]=\"isShowAdvFilter ? 'toggleOn' : 'toggleOff'\" (click)=\"advancedSearch()\" *ngIf=\"data.GridAdvFilterBarField\">\r\n <fa-icon icon=\"sliders-h\"></fa-icon>\r\n </ion-button>\r\n </div>\r\n </div>\r\n <app-zform *ngIf=\"data.GridAdvFilterBarField\" class=\"to-preload-the-fields\" [group]=\"advfilterGroup\" [fieldName]=\"data.GridAdvFilterBarField\" style=\"display:none;\"></app-zform>\r\n <div class=\"adv-filter-container\" *ngIf=\"isShowAdvFilter\" [@hideAndShowAnimation]>\r\n <div class=\"adv-filter-seperator\">\r\n <span>\r\n {{ getToolBarItemLabelName('Advanced Search') }}\r\n </span>\r\n </div>\r\n <app-zform class=\"advfilter-fields\" [group]=\"advfilterGroup\" [fieldName]=\"data.GridAdvFilterBarField\"></app-zform>\r\n </div>\r\n </div>\r\n </ng-template>\r\n <kendo-grid-checkbox-column *ngIf=\"!!data.SelectOptions\" [width]=\"60\" showSelectAll=\"true\" [columnMenu]=\"true\" [locked]=\"checkboxColumnPinned\">\r\n </kendo-grid-checkbox-column>\r\n <kendo-grid-column [style]=\"getGridColumnStyle()\" class=\"e1tag-style3\" *ngFor=\"let col of columns;\" [field]=\"col.field\" [title]=\"col.title\" [width]=\"col.width\"\r\n [minResizableWidth]=\"col.minResizableWidth\" [filter]=\"col.filter\" [filterable]=\"filterable(col.enableFiltering)\"\r\n [sortable]=\"sortable(col.enableSorting)\" [headerStyle]=\"getGridHeaderStyle()\" headerClass=\"e1tag-style4\"\r\n [footerStyle]=\"getGridFooterStyle()\" footerClass=\"e1tag-style9\" [hidden]=\"col.hidden\"\r\n [format]=\"col.format\" [class]=\"col.Class\" [locked]=\"locked(col)\" editor=\"numeric\" [columnMenu]=\"!col.disableColumnMenu\"\r\n [editor]=\"col.editorType\">\r\n <div [ngSwitch]=\"true\">\r\n <div *ngSwitchCase=\"col.fieldType === 'number'\r\n || col.fieldType === 'currency'\r\n || col.fieldType === 'znumeric'\">\r\n <ng-template kendoGridFilterCellTemplate let-filter let-column=\"column\">\r\n <kendo-grid-numeric-filter-cell [showOperators]=\"data.IsShowGridFilterOperator\" [column]=\"column\"\r\n [filter]=\"filter\" operator=\"eq\">\r\n <kendo-filter-eq-operator></kendo-filter-eq-operator>\r\n <kendo-filter-neq-operator></kendo-filter-neq-operator>\r\n <kendo-filter-lt-operator></kendo-filter-lt-operator>\r\n <kendo-filter-lte-operator></kendo-filter-lte-operator>\r\n <kendo-filter-gt-operator></kendo-filter-gt-operator>\r\n <kendo-filter-gte-operator></kendo-filter-gte-operator>\r\n <kendo-filter-isnull-operator></kendo-filter-isnull-operator>\r\n <kendo-filter-isnotnull-operator></kendo-filter-isnotnull-operator>\r\n </kendo-grid-numeric-filter-cell>\r\n </ng-template>\r\n </div>\r\n <div *ngSwitchCase=\"col.fieldType == 'zdate'\r\n || col.fieldType === 'ztime'\r\n || col.fieldType === 'zdatetime'\r\n || col.fieldType === 'zuidatetime'\">\r\n <div *ngIf=\"col.filterByDateRange === true\">\r\n <ng-template kendoGridFilterCellTemplate let-filter let-column=\"column\" operator=\"lte\">\r\n <date-range-filter-cell [showOperators]=\"data.IsShowGridFilterOperator\" class=\"date-range-filter\"\r\n [filter]=\"filter\" [field]=\"col.field\" [data]=\"data\">\r\n <kendo-filter-lt-operator></kendo-filter-lt-operator>\r\n <kendo-filter-lte-operator></kendo-filter-lte-operator>\r\n <kendo-filter-gt-operator></kendo-filter-gt-operator>\r\n <kendo-filter-gte-operator></kendo-filter-gte-operator>\r\n <kendo-filter-isnull-operator></kendo-filter-isnull-operator>\r\n <kendo-filter-isnotnull-operator></kendo-filter-isnotnull-operator>\r\n </date-range-filter-cell>\r\n </ng-template>\r\n </div>\r\n <div *ngIf=\"col.filterByDateRange === false\">\r\n <ng-template kendoGridFilterCellTemplate let-filter let-column=\"column\">\r\n <kendo-grid-date-filter-cell [showOperators]=\"data.IsShowGridFilterOperator\" [column]=\"column\"\r\n [filter]=\"filter\" operator=\"lte\">\r\n <kendo-filter-lt-operator></kendo-filter-lt-operator>\r\n <kendo-filter-lte-operator></kendo-filter-lte-operator>\r\n <kendo-filter-gt-operator></kendo-filter-gt-operator>\r\n <kendo-filter-gte-operator></kendo-filter-gte-operator>\r\n <kendo-filter-isnull-operator></kendo-filter-isnull-operator>\r\n <kendo-filter-isnotnull-operator></kendo-filter-isnotnull-operator>\r\n </kendo-grid-date-filter-cell>\r\n </ng-template>\r\n </div>\r\n </div>\r\n <div *ngSwitchCase=\"col.fieldType === 'checkbox'\">\r\n <ng-template kendoGridFilterCellTemplate let-filter let-column=\"column\">\r\n <kendo-grid-boolean-filter-cell [column]=\"column\" [filter]=\"filter\" operator=\"eq\">\r\n </kendo-grid-boolean-filter-cell>\r\n </ng-template>\r\n </div>\r\n <div *ngSwitchDefault>\r\n <ng-template kendoGridFilterCellTemplate let-filter let-column=\"column\">\r\n <kendo-grid-string-filter-cell [showOperators]=\"data.IsShowGridFilterOperator\" [column]=\"column\"\r\n [filter]=\"filter\" operator=\"contains\">\r\n <kendo-filter-contains-operator></kendo-filter-contains-operator>\r\n <kendo-filter-eq-operator></kendo-filter-eq-operator>\r\n <kendo-filter-neq-operator></kendo-filter-neq-operator>\r\n <kendo-filter-startswith-operator></kendo-filter-startswith-operator>\r\n <kendo-filter-endswith-operator></kendo-filter-endswith-operator>\r\n <kendo-filter-isnull-operator></kendo-filter-isnull-operator>\r\n <kendo-filter-isnotnull-operator></kendo-filter-isnotnull-operator>\r\n </kendo-grid-string-filter-cell>\r\n </ng-template>\r\n </div>\r\n </div>\r\n <!-- Grid Edit Template -->\r\n <ng-template kendoGridEditTemplate *ngIf=\"data.EnableGridCommand \" let-dataItem=\"dataItem\" let-column=\"col\" let-formGroup=\"formGroup\" let-isNew=\"isNew\">\r\n <div [ngSwitch]=\"col.fieldType\">\r\n <div *ngSwitchCase=\"'number'\">\r\n <kendo-numerictextbox #cellAnchor [formControl]=\"formGroup.get(col.field)\"></kendo-numerictextbox>\r\n <kendo-popup [anchor]=\"cellAnchor.numericInput\"\r\n *ngIf=\"formGroup.get(col.field).invalid && !(isNew && formGroup.get(col.field).untouched)\"\r\n popupClass=\"k-widget k-tooltip k-tooltip-validation k-invalid-msg\"\r\n style=\"padding-left: 2px; opacity: 0.5;\">\r\n <span class=\"k-icon k-i-warning\"></span>\r\n <ion-label style=\"padding-top: 1px; padding-left: 3px;\"\r\n *ngIf=\"formGroup.get(col.field).invalid && !formGroup.get(col.field).untouched && formGroup.get(col.field).errors?.required\">\r\n {{ col.Name }} required.\r\n </ion-label>\r\n <ion-label style=\"padding-top: 1px; padding-left: 3px;\"\r\n *ngIf=\"formGroup.get(col.field).invalid && !formGroup.get(col.field).untouched && formGroup.get(col.field).errors?.pattern\">\r\n {{ col.ValidatorMessage ? col.ValidatorMessage : \"Please check the input value.\" }}\r\n </ion-label>\r\n </kendo-popup>\r\n </div>\r\n <div *ngSwitchDefault>\r\n <kendo-textbox #cellAnchor [formControl]=\"formGroup.get(col.field)\"></kendo-textbox>\r\n <kendo-popup [anchor]=\"cellAnchor.input\"\r\n *ngIf=\"formGroup.get(col.field).invalid && !(isNew && formGroup.get(col.field).untouched)\"\r\n popupClass=\"k-widget k-tooltip k-tooltip-validation k-invalid-msg\"\r\n style=\"padding-left: 2px; opacity: 0.5;\">\r\n <span class=\"k-icon k-i-warning\"></span>\r\n <!--<ion-label style=\"padding-top: 1px; padding-left: 3px;\">{{ col.Name }} is required.</ion-label>-->\r\n -l\r\n\r\n <ion-label style=\"padding-top: 1px; padding-left: 3px;\"\r\n *ngIf=\"formGroup.get(col.field).invalid && !formGroup.get(col.field).untouched && formGroup.get(col.field).errors?.required\">\r\n {{ col.Name }} required.\r\n </ion-label>\r\n <ion-label style=\"padding-top: 1px; padding-left: 3px;\"\r\n *ngIf=\"formGroup.get(col.field).invalid && !formGroup.get(col.field).untouched && formGroup.get(col.field).errors?.pattern\">\r\n {{ col.ValidatorMessage ? col.ValidatorMessage : \"Please check the input value.\" }}\r\n </ion-label>\r\n </kendo-popup>\r\n </div>\r\n </div>\r\n </ng-template>\r\n <ng-template kendoGridCellTemplate let-dataItem let-rowIndex=\"rowIndex\">\r\n <div style=\"margin: 1px 0;\" *ngIf=\"!col.clickableIcons && col.isEditableInGrid !== true\"\r\n [ngSwitch]=\"col.fieldType\" [ngClass]=\"getClass(dataItem, col)\" [style]=\"getCellStyle(col, dataItem)\" [attr.data-id]=\"dataItem.Id\" [attr.column-name]=\"col.field\"\r\n (mouseenter)=\"showPopOver(col, $event)\" (mouseleave)=\"closePopOver($event)\">\r\n <span *ngSwitchCase=\"'zdate'\" class=\"grid-cell-data\">\r\n {{ dataItem[col.field] | date: col.FormatOptions ?? 'dd/MM/yyyy' }}\r\n </span>\r\n <span *ngSwitchCase=\"'ztime'\" class=\"grid-cell-data\">\r\n {{ dataItem[col.field] | date: col.FormatOptions ?? 'HH:mm' }}\r\n </span>\r\n <span *ngSwitchCase=\"'zshortdate'\" class=\"grid-cell-data\">\r\n {{ dataItem[col.field] | date: col.FormatOptions ?? 'MMM yyyy' }}\r\n </span>\r\n <span *ngSwitchCase=\"'zdatetime'\" class=\"grid-cell-data\">\r\n {{ dataItem[col.field] | date: col.FormatOptions ?? 'dd/MM/yyyy hh:mm:ss aa' }}\r\n </span>\r\n <span *ngSwitchCase=\"'zuidatetime'\" class=\"grid-cell-data\">\r\n {{ dataItem[col.field] | date: col.FormatOptions ?? 'dd/MM/yyyy hh:mm:ss aa' }}\r\n </span>\r\n <span *ngSwitchCase=\"'number'\" class=\"grid-cell-data\">\r\n {{ dataItem[col.field] | number }}\r\n </span>\r\n <span *ngSwitchCase=\"'currency'\" class=\"grid-cell-data\">\r\n {{ dataItem[col.field] | number: getFormat(col, '1.2-2') }}\r\n </span>\r\n <span *ngSwitchCase=\"'znumeric'\" class=\"grid-cell-data\">\r\n {{ dataItem[col.field] | number: getFormat(col) }}\r\n </span>\r\n <span *ngSwitchCase=\"'url'\" style=\"color: blue; cursor: pointer; text-decoration:underline;\" class=\"grid-cell-data\">\r\n {{ dataItem[col.field] }}\r\n </span>\r\n <span *ngSwitchDefault>\r\n <div style=\"margin: 5px 0;\" *ngIf=\"col.gridCellReplaceValue && getIconName(col.gridCellReplaceValue, dataItem[col.field]) !== ''\">\r\n <fa-icon [icon]=\"getIconName(col.gridCellReplaceValue, dataItem[col.field])\"></fa-icon>\r\n </div>\r\n <div *ngIf=\"!col.gridCellReplaceValue\" [ngSwitch]=\"cellStyleCondition(col, dataItem[col.field])\">\r\n <span *ngSwitchCase=true>\r\n <div class=\"cellStyleConditionDefault\" [style]=\"setCellStyleCondition(col, dataItem[col.field])\">\r\n <span class=\"grid-cell-data\">{{ dataItem[col.field] }} </span>\r\n </div>\r\n </span>\r\n <span *ngSwitchDefault>\r\n <span class=\"grid-cell-data\">{{ dataItem[col.field] }} </span>\r\n </span>\r\n </div>\r\n </span>\r\n </div>\r\n <!-- <span *ngIf=\"!!col.navigateTo\" (click)=\"onNavigateTo($event, col, dataItem, dataItem[col.field])\">\r\n <ion-button color=\"light\" size=\"small\">\r\n {{ col.ClickableIcons }}\r\n <ion-icon slot= \"end\" name=\"arrow-forward\"></ion-icon>\r\n </ion-button>\r\n </span> -->\r\n <div style=\"margin: 5px 0;\" *ngIf=\"col.isEditableInGrid === true && isInlineFormGroupHasValue() && !isInlineEditInputFieldLoading && !col.gridCellReplaceValue\" [style]=\"componentProperties.style.style5\"\r\n [ngClass]=\"getClass(dataItem, col)\" class=\"e1tag-style5\" [style]=\"getCellStyleForInlineEdit(col, dataItem, rowIndex)\">\r\n <app-zinput-container [data]=\"getInlineField(col.field)\" [group]=\"group\"\r\n [form]=\"getInlineForm(dataItem, rowIndex)\" [containerField]=\"containerField\" [style]=\"componentProperties.style.style6\" class=\"e1tag-style6\">\r\n </app-zinput-container>\r\n </div>\r\n <span style=\"margin-top: 10px;\" *ngFor=\"let icon of col.clickableIcons\">\r\n <span [ngClass]=\"icon.Class ? icon.Class : ''\" *ngIf=\"!!icon && (!!dataItem.WFS_StatusCode && !!icon)\r\n ? dataItem.WFS_StatusCode !== icon.WFS_StatusCode\r\n : true;\r\n else disabledButton\" (click)=\"onBtnClick($event, icon, dataItem, dataItem[col.field])\">\r\n {{icon.Name || dataItem[col.field]}} <fa-icon [icon]=\"icon.Icon\" style=\"padding: 4px 6px;\">\r\n </fa-icon>\r\n </span>\r\n <ng-template #disabledButton>\r\n </ng-template>\r\n </span>\r\n <!-- <strong>{{ dataItem[col.field] }}</strong> -->\r\n <!-- <span class=\"{{dataItem.Discontinued ? 'discontinued' : 'active'}}\">\r\n {{dataItem.Discontinued ? \"discontinued\" : \"active\"}}\r\n </span> -->\r\n </ng-template>\r\n <ng-template kendoGridFooterTemplate let-column let-columnIndex=\"columnIndex\" *ngIf=\"data.EnableAggregate\">\r\n <div style=\"margin: 5px 0;\" [ngSwitch]=\"col.fieldType\" [style]=\"componentProperties.style.style7\" class=\"e1tag-style7\">\r\n {{col.aggregateType}}\r\n <span *ngSwitchCase=\"'zdate'\">\r\n {{ col.aggregateValue | date: col.FormatOptions ?? 'dd/MM/yyyy' }}\r\n </span>\r\n <span *ngSwitchCase=\"'ztime'\">\r\n {{ col.aggregateValue | date: col.FormatOptions ?? 'HH:mm' }}\r\n </span>\r\n <span *ngSwitchCase=\"'zshortdate'\">\r\n {{ col.aggregateValue | date: col.FormatOptions ?? 'MMM yyyy' }}\r\n </span>\r\n <span *ngSwitchCase=\"'zdatetime'\">\r\n {{ col.aggregateValue | date: col.FormatOptions ?? 'dd/MM/yyyy hh:mm:ss aa' }}\r\n </span>\r\n <span *ngSwitchCase=\"'zuidatetime'\">\r\n {{ col.aggregateValue | date: col.FormatOptions ?? 'dd/MM/yyyy hh:mm:ss aa' }}\r\n </span>\r\n <span *ngSwitchCase=\"'number'\">\r\n {{ col.aggregateValue | number }}\r\n </span>\r\n <span *ngSwitchCase=\"'currency'\">\r\n {{ col.aggregateValue | number: getFormat(col, '1.2.2') }}\r\n </span>\r\n <span *ngSwitchCase=\"'znumeric'\">\r\n {{ col.aggregateValue | number: getFormat(col) }}\r\n </span>\r\n <span *ngSwitchCase=\"'url'\" style=\"color: blue; cursor: pointer; text-decoration:underline;\">\r\n {{ col.aggregateValue }}\r\n </span>\r\n <span *ngSwitchDefault>\r\n {{ col.aggregateValue }}\r\n </span>\r\n </div>\r\n </ng-template>\r\n </kendo-grid-column>\r\n <kendo-grid-command-column *ngIf=\"data.EnableGridCommand\" width=\"180\" [columnMenu]=\"false\" [style]=\"componentProperties.style.style8\" class=\"e1tag-style8\">\r\n <ng-template kendoGridCellTemplate let-isNew=\"isNew\">\r\n <button kendoGridSaveCommand>\r\n {{ isNew ? 'Save' : 'Update' }}\r\n </button>\r\n <button kendoGridCancelCommand [primary]=\"true\">\r\n {{ isNew ? 'Discard changes' : 'Cancel' }}\r\n </button>\r\n <button kendoGridEditCommand>\r\n {{ \"Edit\" }}\r\n </button>\r\n <button kendoGridRemoveCommand>\r\n {{ \"Remove\" }}\r\n </button>\r\n </ng-template>\r\n </kendo-grid-command-column>\r\n <kendo-grid-command-column *ngIf=\"data.EnableCustomRemoveCommand\" width=\"180\" [columnMenu]=\"false\" [style]=\"componentProperties.style.style8\" class=\"e1tag-style8\">\r\n <ng-template kendoGridCellTemplate let-isNew=\"isNew\" let-dataItem let-rowIndex=\"rowIndex\">\r\n <button type=\"button\" kendoButton (click)=\"gridCustomRemoveCommand(dataItem, rowIndex)\" *ngIf=\"data.EnableCustomRemoveCommand\">\r\n {{ \"Remove\" }}\r\n </button>\r\n </ng-template>\r\n </kendo-grid-command-column>\r\n <kendo-grid-excel fileName=\"Export.xlsx\" [fetchData]=\"allResults\"></kendo-grid-excel>\r\n </kendo-grid>\r\n <app-context-menu [data]=\"data\" [group]=\"group\" [form]=\"form\" #dataitemcontextmenu></app-context-menu>\r\n </div>\r\n </div>\r\n <!-- for DEC auto scrolling -->\r\n <div id=\"end-of-grid\"></div>\r\n</div>\r\n\r\n", styles: [".grid-container.align-with-input{margin:0 25px 0 10px}:host ::ng-deep kendo-treelist.desktop-grid,:host ::ng-deep kendo-grid.desktop-grid{border-width:0px;width:100%;background:transparent}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-content,:host ::ng-deep kendo-grid.desktop-grid .k-grid-content{white-space:nowrap}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar{margin-bottom:15px;padding:5px 0 0;display:flex;flex-direction:row;border:none;background:transparent;border-bottom:1px solid var(--ion-app-seperator-line-color)}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar .k-input,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar .k-picker,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar .k-input,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar .k-picker{width:100%}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item .k-button,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item .k-button,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item .k-button,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item .k-button,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item .k-button,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item .k-button{font-size:calc(var(--button-font-size) - 1px);margin-left:8px;margin-right:2px;border-radius:var(--button-border-radius);background:#fff;border:none;box-shadow:none;padding:5px}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item .k-button.left-buttons,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item .k-button.left-buttons,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item .k-button.left-buttons,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item .k-button.left-buttons,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item .k-button.left-buttons,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item .k-button.left-buttons{margin:auto 0 auto 5px}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item .k-button .k-grid-button,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item .k-button .k-grid-button,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item .k-button .k-grid-button,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item .k-button .k-grid-button,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item .k-button .k-grid-button,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item .k-button .k-grid-button{padding:0 6px}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item .k-button fa-icon,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item .k-button fa-icon,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item .k-button fa-icon,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item .k-button fa-icon,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item .k-button fa-icon,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item .k-button fa-icon{color:var(--ion-color-primary)}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item .k-button .k-icon,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item .k-button .k-icon,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item .k-button .k-icon,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item .k-button .k-icon,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item .k-button .k-icon,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item .k-button .k-icon{font-size:calc(var(--button-font-size) + 8px)}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item .k-button .k-icon-with-text,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item .k-button .k-icon-with-text,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item .k-button .k-icon-with-text,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item .k-button .k-icon-with-text,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item .k-button .k-icon-with-text,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item .k-button .k-icon-with-text{margin-right:2px;font-size:calc(var(--button-font-size) + 2px);padding-bottom:3px}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item .k-button:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item .k-button:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item .k-button:hover,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item .k-button:hover,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item .k-button:hover,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item .k-button:hover{background:rgba(var(--ion-color-primary-rgb),.2)}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container{margin-top:auto;padding-bottom:1px;gap:5px;display:flex}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container.with-grid-title,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container.with-grid-title,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container.with-grid-title,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container.with-grid-title,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container.with-grid-title,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container.with-grid-title{margin-left:10px;border-left:1px solid #c9c9c9;padding-left:8px}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text{height:18px;gap:8px;display:flex;margin:auto}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .k-i-file-excel,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .k-i-file-excel,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .k-i-file-excel,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .k-i-file-excel,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .k-i-file-excel,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .k-i-file-excel{margin-top:-1px;font-size:calc(var(--button-font-size) + 6px)}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .export-to-excel-button-text,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .export-to-excel-button-text,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .export-to-excel-button-text,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .export-to-excel-button-text,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .export-to-excel-button-text,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .export-to-excel-button-text{margin:auto}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container{flex:1 1 100%;border:1px solid var(--ion-app-seperator-line-color);display:grid}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.normal-filter-container,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.normal-filter-container{display:grid;grid-template-columns:80% 20%;width:100%}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons{display:flex;margin:auto 5px auto auto;padding:0 5px;position:relative}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons.filter-field-layout-type2,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons.filter-field-layout-type2{top:12px}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons>ion-button,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons>ion-button{font-size:var(--button-font-size);margin-left:10px;height:calc(var(--input-field-height) + 2px)}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons>ion-button.toggleOn,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons>ion-button.toggleOn{--background: rgba(var(--ion-color-primary-rgb), 15%);--background-hover: rgba(var(--ion-color-primary-rgb), 10%);--color: var(--ion-color-primary);--border-color: var(--ion-color-primary)}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons>ion-button.toggleOff,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons>ion-button.toggleOff{--background: var(--disabled-input-field-backgroundcolor);--border-color: var(--z-placeholder-color);--color: var(--z-placeholder-color);--background-hover: #efefef}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons>ion-button .btn-label,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons>ion-button .btn-label{padding-left:5px}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.adv-filter-container,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.adv-filter-container{margin-top:10px}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.adv-filter-container>.adv-filter-seperator,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.adv-filter-container>.adv-filter-seperator{width:100%;height:calc(var(--content-font-size) - 1px);border-bottom:1px solid var(--ion-color-primary);text-align:center}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.adv-filter-container>.adv-filter-seperator span,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.adv-filter-container>.adv-filter-seperator span{font-size:calc(var(--content-font-size) + 3px);background:#fff;padding:0 20px;color:var(--ion-color-primary);font-weight:600}:host ::ng-deep kendo-treelist.desktop-grid.toolbar-no-border .k-toolbar,:host ::ng-deep kendo-grid.desktop-grid.toolbar-no-border .k-toolbar{margin-bottom:0;border-width:0px}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-aria-root,:host ::ng-deep kendo-grid.desktop-grid .k-grid-aria-root{border:1px solid var(--ion-color-primary);border-radius:5px 5px 0 0}:host ::ng-deep kendo-treelist.desktop-grid.hiden-pager .k-grid-aria-root,:host ::ng-deep kendo-grid.desktop-grid.hiden-pager .k-grid-aria-root{border-radius:5px}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header{font-weight:600;font-size:var(--grid-header-font-size);background:rgba(var(--ion-color-primary-rgb),.25);color:#000}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-cell-inner>.k-link,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-cell-inner>.k-link{padding:12px 12px 8px}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-grid-filter,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-header-column-menu,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-hierarchy-cell .k-icon,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-grid-filter.k-active,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-header-column-menu.k-active,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-hierarchy-cell .k-icon.k-active .k-grid-filter.k-state-active,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-header-column-menu.k-state-active,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-hierarchy-cell .k-icon.k-state-active,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-grid-filter,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-header-column-menu,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-hierarchy-cell .k-icon,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-grid-filter.k-active,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-header-column-menu.k-active,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-hierarchy-cell .k-icon.k-active .k-grid-filter.k-state-active,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-header-column-menu.k-state-active,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-hierarchy-cell .k-icon.k-state-active{color:#000;background:transparent}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-filtercell .k-dropdown .k-dropdown-wrap,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-filtercell .k-dropdowntree .k-dropdown-wrap,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-filtercell .k-dropdown .k-dropdown-wrap,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-filtercell .k-dropdowntree .k-dropdown-wrap{background:var(--ion-color-primary-contrast);color:var(--ion-color-primary-shade)}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-filtercell .k-dropdown .k-button,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-filtercell .k-dropdowntree .k-button,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-filtercell .k-dropdown .k-button,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-filtercell .k-dropdowntree .k-button{color:var(--ion-color-primary-shade)}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-filtercell>.k-filtercell-wrapper>.k-filtercell-operator,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-filtercell>.k-filtercell-wrapper>.k-filtercell-operator{display:flex}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-filtercell>.k-filtercell-wrapper>.k-filtercell-operator>.k-button.k-clear-button-visible,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-filtercell>.k-filtercell-wrapper>.k-filtercell-operator>.k-button.k-clear-button-visible{margin-left:4px}:host ::ng-deep kendo-treelist.desktop-grid tbody>tr,:host ::ng-deep kendo-grid.desktop-grid tbody>tr{background:rgba(var(--ion-color-primary-rgb),.08);font-size:var(--grid-cell-font-size)}:host ::ng-deep kendo-treelist.desktop-grid tbody>tr.k-alt,:host ::ng-deep kendo-grid.desktop-grid tbody>tr.k-alt{background:rgba(var(--ion-color-primary-rgb),.01)}:host ::ng-deep kendo-treelist.desktop-grid tbody>td.k-selected,:host ::ng-deep kendo-treelist.desktop-grid tbody>td.k-selected.k-alt,:host ::ng-deep kendo-treelist.desktop-grid tbody>tr.k-selected>td,:host ::ng-deep kendo-treelist.desktop-grid tbody>tr.k-selected.k-alt>td,:host ::ng-deep kendo-treelist.desktop-grid tbody>td.k-state-selected,:host ::ng-deep kendo-treelist.desktop-grid tbody>td.k-state-selected.k-alt,:host ::ng-deep kendo-treelist.desktop-grid tbody>tr.k-state-selected>td,:host ::ng-deep kendo-treelist.desktop-grid tbody>tr.k-state-selected.k-alt>td,:host ::ng-deep kendo-grid.desktop-grid tbody>td.k-selected,:host ::ng-deep kendo-grid.desktop-grid tbody>td.k-selected.k-alt,:host ::ng-deep kendo-grid.desktop-grid tbody>tr.k-selected>td,:host ::ng-deep kendo-grid.desktop-grid tbody>tr.k-selected.k-alt>td,:host ::ng-deep kendo-grid.desktop-grid tbody>td.k-state-selected,:host ::ng-deep kendo-grid.desktop-grid tbody>td.k-state-selected.k-alt,:host ::ng-deep kendo-grid.desktop-grid tbody>tr.k-state-selected>td,:host ::ng-deep kendo-grid.desktop-grid tbody>tr.k-state-selected.k-alt>td{background:rgba(var(--ion-color-secondary-rgb),.8);color:var(--ion-color-secondary-contrast);font-weight:600}:host ::ng-deep kendo-treelist.desktop-grid tbody>tr:hover,:host ::ng-deep kendo-treelist.desktop-grid tbody>tr.k-hover,:host ::ng-deep kendo-treelist.desktop-grid tbody>tr.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid tbody>tr:hover,:host ::ng-deep kendo-grid.desktop-grid tbody>tr.k-hover,:host ::ng-deep kendo-grid.desktop-grid tbody>tr.k-state-hover{background-color:rgba(var(--ion-color-secondary-rgb),.15)}:host ::ng-deep kendo-treelist.desktop-grid tbody td>.gridCell>span>div>span,:host ::ng-deep kendo-grid.desktop-grid tbody td>.gridCell>span>div>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager{background-color:rgba(var(--ion-color-primary-rgb),.25);color:#000;border:1px solid var(--ion-color-primary);border-top:none;border-radius:0 0 5px 5px;font-size:calc(var(--grid-cell-font-size) - 2px);padding:2px 10px}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link{color:#000;border-radius:5px}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover{color:#fff;background-image:linear-gradient(rgba(var(--ion-color-primary-rgb),.7),rgba(var(--ion-color-primary-rgb),.8))}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-selected,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-selected:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-selected.k-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-selected,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-selected:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-selected.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-selected,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-selected:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-selected.k-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-state-selected,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-state-selected:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-state-selected.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-selected,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-selected:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-selected.k-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-selected,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-selected:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-selected.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-selected,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-selected:hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-selected.k-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-selected,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-selected:hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-selected.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-selected,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-selected:hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-selected.k-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-state-selected,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-state-selected:hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-state-selected.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-selected,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-selected:hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-selected.k-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-selected,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-selected:hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-selected.k-state-hover{color:var(--ion-color-primary);background:var(--ion-color-primary-contrast);font-weight:600}:host ::ng-deep kendo-treelist.desktop-grid.cellWrapText td>.gridCell>span>div>span,:host ::ng-deep kendo-grid.desktop-grid.cellWrapText td>.gridCell>span>div>span{white-space:pre-line}:host ::ng-deep kendo-treelist .cellStyleConditionDefault,:host ::ng-deep kendo-grid .cellStyleConditionDefault{border-radius:5px;text-align:center}:host ::ng-deep kendo-treelist .rightAligned,:host ::ng-deep kendo-grid .rightAligned{text-align:right}:host ::ng-deep kendo-treelist .centerAligned,:host ::ng-deep kendo-grid .centerAligned{text-align:center}.gridTitle{font-size:calc(var(--grid-header-font-size) + 8px);font-weight:700;margin:auto 5px;color:var(--ion-color-dark);padding-top:2px;display:inherit}.gridTitleIcon{color:var(--ion-color-dark);font-size:calc(var(--grid-header-font-size) + 2px);display:block;margin:auto 0;padding-top:2px}.refresh-btn{zoom:.8}.refresh-btn>.k-i-refresh-sm{transform:rotate(30deg);font-size:1.4rem}.toolbar-left-item{flex-grow:1;display:flex}.toolbar-right-item{bottom:2px;position:relative}.gridCell.primary{color:var(--ion-color-primary)}.gridCell.secondary{color:var(--ion-color-dark)}.gridCell.tertiary{color:var(--ion-color-tertiary)}.gridCell.success{color:var(--ion-color-success-shade)}.gridCell.warning{color:var(--ion-color-warning)}.gridCell.danger{color:var(--ion-color-danger)}.gridCell.dark{color:var(--ion-color-dark)}.gridCell.medium{color:var(--ion-color-medium)}.gridCell.light{color:var(--ion-color-light)}.k-i-loading{position:absolute;inset:100px 0 0;font-size:45px;background-color:#ffffff4d;color:#0f4800}\n"], components: [{ type: i7$2.PopoverComponent, selector: "kendo-popover", inputs: ["position", "offset", "width", "height", "title", "subtitle", "body", "callout", "animation", "templateData"], outputs: ["show", "shown", "hide", "hidden"] }, { type: i8.GridComponent, selector: "kendo-grid", inputs: ["data", "pageSize", "height", "rowHeight", "detailRowHeight", "skip", "scrollable", "selectable", "sort", "trackBy", "filter", "group", "virtualColumns", "filterable", "sortable", "pageable", "groupable", "navigable", "navigatable", "autoSize", "rowClass", "rowSticky", "rowSelected", "cellSelected", "resizable", "reorderable", "loading", "columnMenu", "hideHeader", "isDetailExpanded", "isGroupExpanded"], outputs: ["filterChange", "pageChange", "groupChange", "sortChange", "selectionChange", "dataStateChange", "groupExpand", "groupCollapse", "detailExpand", "detailCollapse", "edit", "cancel", "save", "remove", "add", "cellClose", "cellClick", "pdfExport", "excelExport", "columnResize", "columnReorder", "columnVisibilityChange", "columnLockedChange", "columnStickyChange", "scrollBottom", "contentScroll"], exportAs: ["kendoGrid"] }, { type: i15.LabelComponent, selector: "kendo-label", inputs: ["text", "for", "optional"], exportAs: ["kendoLabel"] }, { type: i4.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }, { type: ZworkflowbuttonsComponent, selector: "app-zworkflowbuttons" }, { type: ZbuttonsComponent, selector: "app-zbuttons" }, { type: ZformComponent, selector: "app-zform", inputs: ["group", "fieldName"] }, { type: i2$1.IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }, { type: i8.CheckboxColumnComponent, selector: "kendo-grid-checkbox-column", inputs: ["showSelectAll"] }, { type: i8.ColumnComponent, selector: "kendo-grid-column", inputs: ["field", "format", "sortable", "groupable", "editor", "filter", "filterable", "editable"] }, { type: i8.NumericFilterCellComponent, selector: "kendo-grid-numeric-filter-cell", inputs: ["filterDelay", "showOperators"] }, { type: i8.EqualFilterOperatorComponent, selector: "kendo-filter-eq-operator" }, { type: i8.NotEqualFilterOperatorComponent, selector: "kendo-filter-neq-operator" }, { type: i8.LessFilterOperatorComponent, selector: "kendo-filter-lt-operator" }, { type: i8.LessOrEqualToFilterOperatorComponent, selector: "kendo-filter-lte-operator" }, { type: i8.GreaterFilterOperatorComponent, selector: "kendo-filter-gt-operator" }, { type: i8.GreaterOrEqualToFilterOperatorComponent, selector: "kendo-filter-gte-operator" }, { type: i8.IsNullFilterOperatorComponent, selector: "kendo-filter-isnull-operator" }, { type: i8.IsNotNullFilterOperatorComponent, selector: "kendo-filter-isnotnull-operator" }, { type: DateRangeFilterCellComponent, selector: "date-range-filter-cell", inputs: ["filter", "field", "data"] }, { type: i8.DateFilterCellComponent, selector: "kendo-grid-date-filter-cell", inputs: ["showOperators"] }, { type: i8.BooleanFilterCellComponent, selector: "kendo-grid-boolean-filter-cell" }, { type: i8.StringFilterCellComponent, selector: "kendo-grid-string-filter-cell", inputs: ["filterDelay", "showOperators"] }, { type: i8.ContainsFilterOperatorComponent, selector: "kendo-filter-contains-operator" }, { type: i8.StartsWithFilterOperatorComponent, selector: "kendo-filter-startswith-operator" }, { type: i8.EndsWithFilterOperatorComponent, selector: "kendo-filter-endswith-operator" }, { type: i3$5.NumericTextBoxComponent, selector: "kendo-numerictextbox", inputs: ["focusableId", "disabled", "readonly", "title", "autoCorrect", "format", "max", "min", "decimals", "placeholder", "step", "spinners", "rangeValidation", "tabindex", "tabIndex", "changeValueOnScroll", "selectOnFocus", "value", "maxlength", "size", "rounded", "fillMode"], outputs: ["valueChange", "focus", "blur"], exportAs: ["kendoNumericTextBox"] }, { type: i2$4.PopupComponent, selector: "kendo-popup", inputs: ["animate", "anchor", "anchorAlign", "collision", "popupAlign", "copyAnchorStyles", "popupClass", "positionMode", "offset", "margin"], outputs: ["anchorViewportLeave", "close", "open", "positionChange"], exportAs: ["kendo-popup"] }, { type: i2$1.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { type: i3$5.TextBoxComponent, selector: "kendo-textbox", inputs: ["focusableId", "title", "disabled", "readonly", "tabindex", "value", "selectOnFocus", "showSuccessIcon", "showErrorIcon", "clearButton", "successIcon", "errorIcon", "clearButtonIcon", "size", "rounded", "fillMode", "tabIndex", "placeholder", "maxlength"], outputs: ["valueChange", "inputFocus", "inputBlur", "focus", "blur"], exportAs: ["kendoTextBox"] }, { type: ZInputContainerComponent, selector: "app-zinput-container" }, { type: i8.CommandColumnComponent, selector: "kendo-grid-command-column" }, { type: i8.ExcelComponent, selector: "kendo-grid-excel", inputs: ["fileName", "filterable", "creator", "date", "forceProxy", "proxyURL", "fetchData", "paddingCellOptions", "headerPaddingCellOptions", "collapsible"] }, { type: ContextMenuComponent, selector: "app-context-menu", inputs: ["target", "selectedData"] }], directives: [{ type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i7.DefaultClassDirective, selector: " [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl], [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl], [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }, { type: i7$2.PopoverBodyTemplateDirective, selector: "[kendoPopoverBodyTemplate]" }, { type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i7$2.TooltipDirective, selector: "[kendoTooltip]", inputs: ["filter", "position", "titleTemplate", "showOn", "showAfter", "callout", "closable", "offset", "tooltipWidth", "tooltipHeight", "tooltipClass", "collision", "closeTitle", "tooltipTemplate"], exportAs: ["kendoTooltip"] }, { type: i7$2.PopoverContainerDirective, selector: "[kendoPopoverContainer]", inputs: ["filter"], exportAs: ["kendoPopoverContainer"] }, { type: ZGridBindingDirective, selector: "[zgridbinding]", inputs: ["zgridbinding"] }, { type: i8.SelectionDirective, selector: "[kendoGridSelectBy]" }, { type: i8.ToolbarTemplateDirective, selector: "[kendoGridToolbarTemplate]", inputs: ["position"] }, { type: i3$3.ButtonDirective, selector: "button[kendoButton], span[kendoButton]", inputs: ["toggleable", "togglable", "selected", "tabIndex", "icon", "iconClass", "imageUrl", "disabled", "size", "rounded", "fillMode", "themeColor", "role", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { type: i8.ExcelCommandDirective, selector: "[kendoGridExcelCommand]" }, { type: i8.AddCommandDirective, selector: "[kendoGridAddCommand]" }, { type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i5.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i5.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i8.FilterCellTemplateDirective, selector: "[kendoGridFilterCellTemplate]" }, { type: i5.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { type: i8.EditTemplateDirective, selector: "[kendoGridEditTemplate]" }, { type: i4$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i8.CellTemplateDirective, selector: "[kendoGridCellTemplate]" }, { type: i8.FooterTemplateDirective, selector: "[kendoGridFooterTemplate]" }, { type: i8.FocusableDirective, selector: "[kendoGridFocusable], [kendoGridEditCommand], [kendoGridRemoveCommand], [kendoGridSaveCommand], [kendoGridCancelCommand], [kendoGridSelectionCheckbox] ", inputs: ["kendoGridFocusable"] }, { type: i8.SaveCommandDirective, selector: "[kendoGridSaveCommand]" }, { type: i8.CancelCommandDirective, selector: "[kendoGridCancelCommand]" }, { type: i8.EditCommandDirective, selector: "[kendoGridEditCommand]" }, { type: i8.RemoveCommandDirective, selector: "[kendoGridRemoveCommand]" }], pipes: { "htmlSanitize": HtmlSanitizePipe, "date": i5.DatePipe, "number": i5.DecimalPipe }, animations: [
|
|
10107
|
+
ZgridComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.3", type: ZgridComponent, selector: "app-zgrid", viewQueries: [{ propertyName: "tooltipDir", first: true, predicate: TooltipDirective, descendants: true }, { propertyName: "elementContainer", first: true, predicate: ElementContainerDirective, descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<!--\r\n<div style=\"margin: 10px\">\r\n <div class=\"card\">\r\n <div class=\"card-block k-form\">\r\n <fieldset>\r\n <legend>Binding types</legend>\r\n <div class=\"k-form-field\">\r\n <span>Bind the data to:</span>\r\n <input [(ngModel)]=\"bindingType\" type=\"radio\" name=\"mode\" id=\"array\" value=\"array\" class=\"k-radio\"\r\n (change)=\"changeBindingType($event)\">\r\n <label class=\"k-radio-label\" for=\"array\">Array object</label>\r\n <input [(ngModel)]=\"bindingType\" type=\"radio\" name=\"mode\" id=\"gridDataResult\" value=\"gridDataResult\" class=\"k-radio\"\r\n (change)=\"changeBindingType($event)\">\r\n <label class=\"k-radio-label\" for=\"gridDataResult\">GridDataResult object</label>\r\n <input [(ngModel)]=\"bindingType\" type=\"radio\" name=\"mode\" id=\"async\" value=\"async\" class=\"k-radio\"\r\n (change)=\"changeBindingType($event)\">\r\n <label class=\"k-radio-label\" for=\"async\">Asynchronous source</label>\r\n </div>\r\n </fieldset>\r\n </div>\r\n </div>\r\n</div> -->\r\n<div class=\"grid-container e1tag-style\" [ngClass]=\"data.Class\" [style]=\"componentProperties.style.style\">\r\n\r\n <!-- <div *ngIf=\"data.Title\" class=\"gridTitle\">{{data.Title}}</div> -->\r\n <ng-template #template let-anchor>\r\n <span>{{ anchor.nativeElement.innerText }}</span>\r\n </ng-template>\r\n <kendo-popover #gridPopOver [position]=\"data.PopOverPosition || 'bottom'\" [templateData]=\"getContextData.bind(this)\">\r\n <!-- <ng-template kendoPopoverTitleTemplate let-data=\"data\" >\r\n <div [style]=\"data.TitleStyle\" *ngIf=\"data && data.Title\" [innerHTML]=\"data.Title\"></div>\r\n </ng-template> -->\r\n <ng-template kendoPopoverBodyTemplate let-data=\"data\">\r\n <div [style]=\"data.BodyStyle\" class=\"popoverbody\" *ngIf=\"data && data.Body\" [innerHTML]=\"data.Body | htmlSanitize\" [ngClass]=\"data.BodyClass\" (mouseleave)=\"closePopOver.call(this, $event)\"></div>\r\n </ng-template>\r\n </kendo-popover>\r\n\r\n <div kendoTooltip showOn=\"none\" [tooltipTemplate]=\"template\" filter=\".k-grid td\" (mouseover)=\"showTooltip($event)\" [style]=\"componentProperties.style.style1\" class=\"e1tag-style1\">\r\n <div kendoPopoverContainer [popover]=\"gridPopOver\" filter=\"div.gridCell.withPopoverInGrid\" showOn=\"none\" kendoPopoverContainer #popovercontainer=\"kendoPopoverContainer\">\r\n <kendo-grid [zgridbinding]=\"{data: data, group: group, params: params, gridSubject: gridSubject, gridSetting: gridSetting}\" [ngClass]=\"data.Class\" class=\"desktop-grid e1tag-style2\"\r\n [scrollable]=\"data.scrollAble === false ? 'none' : 'scrollable'\"\r\n [pageable]=\"pageable\"\r\n [class.hiden-pager]=\"!pageable\"\r\n [pageSize]=\"gridSetting.gridState.take\"\r\n [skip]=\"gridSetting.gridState.skip\"\r\n [sort]=\"gridSetting.gridState.sort\"\r\n [sortable]=\"{allowUnsort: true,mode: 'multiple'}\"\r\n [filter]=\"gridSetting.gridState.filter\"\r\n [filterable]=\"data.enableFiltering !== false\"\r\n [resizable]=\"true\"\r\n [reorderable]=\"true\"\r\n [columnMenu]=\"data.DisableGridColumnMenu ? false : { filter: true }\"\r\n [hidden]=\"!(!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible)\"\r\n (cellClick)=\"cellClickHandler($event)\"\r\n (cellClose)=\"editCellCloseHandler($event)\"\r\n (dataStateChange)=\"dataStateChange($event)\"\r\n (pageChange)=\"pageChange($event)\"\r\n (sortChange)=\"sortChange($event)\"\r\n (filterChange)=\"filterChange($event)\"\r\n [kendoGridSelectBy]=\"rowSelectionKey\"\r\n [selectable]=\"selectableSettings\"\r\n [(selectedKeys)]=\"mySelection\"\r\n [style]=\"componentProperties.style.style2\"\r\n [trackBy]=\"trackBy\"\r\n (cancel)=\"cancelHandler($event)\"\r\n (save)=\"saveHandler($event)\"\r\n (remove)=\"removeHandler($event)\"\r\n (edit)=\"editHandler($event)\"\r\n (add)=\"addHandler($event)\"\r\n (columnResize)=\"adjustWidthUponResize()\"\r\n (excelExport)=\"onExcelExport($event)\"\r\n [rowClass]=\"rowCallback.bind(this)\">\r\n <ng-template kendoGridToolbarTemplate\r\n *ngIf=\"data.AllowRefreshButton || data.AllowExport || data.AllowSaveState || data.Title || data.GridButtonFieldName_WF || data.GridButtonFieldName || data.EnableGridCommand || data.EnableCustomAddCommand || data.EnableCustomResetCommand\">\r\n <div class=\"toolbar-left-item\" *ngIf=\"gridTitle || data.AllowRefreshButton || data.AllowExport\">\r\n <!-- <fa-icon *ngIf=\"data.Icon\" class=\"gridTitleIcon\" [icon]=\"data.Icon\"></fa-icon> -->\r\n <kendo-label class=\"gridTitle\" *ngIf=\"gridTitle\">{{ gridTitle }}</kendo-label>\r\n <button title=\"Refresh\" type=\"button\" class=\"left-buttons refresh-button\" kendoButton (click)=\"refreshData()\"\r\n *ngIf=\"data.AllowRefreshButton\">\r\n <span class=\"k-icon k-grid-button k-i-refresh-sm\"></span>\r\n </button>\r\n <div class=\"toolbar-left-item-second-container\" *ngIf=\"data.AllowExport\" [class.with-grid-title]=\"gridTitle || data.AllowRefreshButton\">\r\n <button type=\"button\" class=\"left-buttons export-button\" kendoGridExcelCommand *ngIf=\"data.AllowExport\">\r\n <!-- <span class=\"k-icon k-i-file-excel\"></span> -->\r\n <fa-icon icon=\"download\"></fa-icon>\r\n <span class=\"export-to-excel-button-text\">{{ getToolBarItemLabelName('Download as Excel') }}</span>\r\n </button>\r\n </div>\r\n </div>\r\n <div class=\"toolbar-right-item\" *ngIf=\"gridBtn || data.CacheInfo?.EnableSaveState || gridDefaultStateExist || data.EnableGridCommand || data.EnableCustomAddCommand || data.EnableCustomResetCommand\">\r\n <app-zworkflowbuttons *ngIf=\"gridBtn && gridBtn.Type === 'zworkflowbuttons'\" [data]=\"gridBtn\" [group]=\"group\" [form]=\"form\"></app-zworkflowbuttons>\r\n <app-zbuttons *ngIf=\"gridBtn && gridBtn.Type === 'zbuttons'\" [data]=\"gridBtn\" [group]=\"group\" [form]=\"form\"></app-zbuttons>\r\n <button type=\"button\" kendoButton (click)=\"saveGridSettings()\" *ngIf=\"data.CacheInfo?.EnableSaveState\">\r\n <span class=\"k-icon k-icon-with-text k-i-star\"></span>{{ getToolBarItemLabelName('Save Settings') }}\r\n </button>\r\n <button type=\"button\" kendoButton (click)=\"restoreGridSettings()\" *ngIf=\"showRestoreGridSettingButton\">\r\n <span class=\"k-icon k-icon-with-text k-i-star-outline\"></span>{{ getToolBarItemLabelName('Restore Settings') }}\r\n </button>\r\n <button type=\"button\" kendoGridAddCommand *ngIf=\"data.EnableGridCommand\">\r\n <span class=\"k-icon k-icon-with-text k-i-add\"></span>{{ getToolBarItemLabelName(data.AddCommandButtonName ? data.AddCommandButtonName: 'Add') }}\r\n </button>\r\n <button type=\"button\" kendoButton (click)=\"gridCustomAddCommand(group)\" *ngIf=\"data.EnableCustomAddCommand\">\r\n <span class=\"k-icon k-icon-with-text k-i-add\"></span>{{ getToolBarItemLabelName(data.AddCommandButtonName ? data.AddCommandButtonName: 'Add') }}\r\n </button>\r\n <button type=\"button\" kendoButton (click)=\"gridCustomResetCommand(group)\" *ngIf=\"data.EnableCustomResetCommand\">\r\n <span class=\"k-icon k-icon-with-text k-i-trash\"></span>{{ getToolBarItemLabelName(data.ResetCommandButtonName ? data.ResetCommandButtonName: 'Reset') }}\r\n </button>\r\n </div>\r\n <div class=\"filter-container\" *ngIf=\"data.GridFilterBarField\">\r\n <div class=\"normal-filter-container\">\r\n <app-zform class=\"filter-fields\" [group]=\"filterGroup\" [fieldName]=\"data.GridFilterBarField\"></app-zform>\r\n <div class=\"filter-buttons\" [ngClass]=\"data.Class\">\r\n <ion-button fill=\"solid\" size=\"default\" strong=\"true\" color=\"primary\" (click)=\"search()\">\r\n <fa-icon icon=\"search\"></fa-icon>\r\n <span class=\"btn-label ion-text-capitalize\">{{ getToolBarItemLabelName('Search') }}</span>\r\n </ion-button>\r\n <ion-button fill=\"outline\" size=\"default\" strong=\"true\" color=\"primary\" (click)=\"cancelEdit()\" *ngIf=\"data.IsShowGridCancelFilterButton\">\r\n <fa-icon icon=\"times\"></fa-icon>\r\n </ion-button>\r\n <ion-button fill=\"solid\" size=\"default\" strong=\"true\" [ngClass]=\"isShowAdvFilter ? 'toggleOn' : 'toggleOff'\" (click)=\"advancedSearch()\" *ngIf=\"data.GridAdvFilterBarField\">\r\n <fa-icon icon=\"sliders-h\"></fa-icon>\r\n </ion-button>\r\n </div>\r\n </div>\r\n <app-zform *ngIf=\"data.GridAdvFilterBarField\" class=\"to-preload-the-fields\" [group]=\"advfilterGroup\" [fieldName]=\"data.GridAdvFilterBarField\" style=\"display:none;\"></app-zform>\r\n <div class=\"adv-filter-container\" *ngIf=\"isShowAdvFilter\" [@hideAndShowAnimation]>\r\n <div class=\"adv-filter-seperator\">\r\n <span>\r\n {{ getToolBarItemLabelName('Advanced Search') }}\r\n </span>\r\n </div>\r\n <app-zform class=\"advfilter-fields\" [group]=\"advfilterGroup\" [fieldName]=\"data.GridAdvFilterBarField\"></app-zform>\r\n </div>\r\n </div>\r\n </ng-template>\r\n <kendo-grid-checkbox-column *ngIf=\"!!data.SelectOptions\" [width]=\"60\" showSelectAll=\"true\" [columnMenu]=\"true\" [locked]=\"checkboxColumnPinned\">\r\n </kendo-grid-checkbox-column>\r\n <kendo-grid-column [style]=\"getGridColumnStyle()\" class=\"e1tag-style3\" *ngFor=\"let col of columns;\" [field]=\"col.field\" [title]=\"col.title\" [width]=\"col.width\"\r\n [minResizableWidth]=\"col.minResizableWidth\" [filter]=\"col.filter\" [filterable]=\"filterable(col.enableFiltering)\"\r\n [sortable]=\"sortable(col.enableSorting)\" [headerStyle]=\"getGridHeaderStyle()\" headerClass=\"e1tag-style4\"\r\n [footerStyle]=\"getGridFooterStyle()\" footerClass=\"e1tag-style9\" [hidden]=\"col.hidden\"\r\n [format]=\"col.format\" [class]=\"col.Class\" [locked]=\"locked(col)\" editor=\"numeric\" [columnMenu]=\"!col.disableColumnMenu\"\r\n [editor]=\"col.editorType\">\r\n <div [ngSwitch]=\"true\">\r\n <div *ngSwitchCase=\"col.fieldType === 'number'\r\n || col.fieldType === 'currency'\r\n || col.fieldType === 'znumeric'\">\r\n <ng-template kendoGridFilterCellTemplate let-filter let-column=\"column\">\r\n <kendo-grid-numeric-filter-cell [showOperators]=\"data.IsShowGridFilterOperator\" [column]=\"column\"\r\n [filter]=\"filter\" operator=\"eq\">\r\n <kendo-filter-eq-operator></kendo-filter-eq-operator>\r\n <kendo-filter-neq-operator></kendo-filter-neq-operator>\r\n <kendo-filter-lt-operator></kendo-filter-lt-operator>\r\n <kendo-filter-lte-operator></kendo-filter-lte-operator>\r\n <kendo-filter-gt-operator></kendo-filter-gt-operator>\r\n <kendo-filter-gte-operator></kendo-filter-gte-operator>\r\n <kendo-filter-isnull-operator></kendo-filter-isnull-operator>\r\n <kendo-filter-isnotnull-operator></kendo-filter-isnotnull-operator>\r\n </kendo-grid-numeric-filter-cell>\r\n </ng-template>\r\n </div>\r\n <div *ngSwitchCase=\"col.fieldType == 'zdate'\r\n || col.fieldType === 'ztime'\r\n || col.fieldType === 'zdatetime'\r\n || col.fieldType === 'zuidatetime'\">\r\n <div *ngIf=\"col.filterByDateRange === true\">\r\n <ng-template kendoGridFilterCellTemplate let-filter let-column=\"column\" operator=\"lte\">\r\n <date-range-filter-cell [showOperators]=\"data.IsShowGridFilterOperator\" class=\"date-range-filter\"\r\n [filter]=\"filter\" [field]=\"col.field\" [data]=\"data\">\r\n <kendo-filter-lt-operator></kendo-filter-lt-operator>\r\n <kendo-filter-lte-operator></kendo-filter-lte-operator>\r\n <kendo-filter-gt-operator></kendo-filter-gt-operator>\r\n <kendo-filter-gte-operator></kendo-filter-gte-operator>\r\n <kendo-filter-isnull-operator></kendo-filter-isnull-operator>\r\n <kendo-filter-isnotnull-operator></kendo-filter-isnotnull-operator>\r\n </date-range-filter-cell>\r\n </ng-template>\r\n </div>\r\n <div *ngIf=\"col.filterByDateRange === false\">\r\n <ng-template kendoGridFilterCellTemplate let-filter let-column=\"column\">\r\n <kendo-grid-date-filter-cell [showOperators]=\"data.IsShowGridFilterOperator\" [column]=\"column\"\r\n [filter]=\"filter\" operator=\"lte\">\r\n <kendo-filter-lt-operator></kendo-filter-lt-operator>\r\n <kendo-filter-lte-operator></kendo-filter-lte-operator>\r\n <kendo-filter-gt-operator></kendo-filter-gt-operator>\r\n <kendo-filter-gte-operator></kendo-filter-gte-operator>\r\n <kendo-filter-isnull-operator></kendo-filter-isnull-operator>\r\n <kendo-filter-isnotnull-operator></kendo-filter-isnotnull-operator>\r\n </kendo-grid-date-filter-cell>\r\n </ng-template>\r\n </div>\r\n </div>\r\n <div *ngSwitchCase=\"col.fieldType === 'checkbox'\">\r\n <ng-template kendoGridFilterCellTemplate let-filter let-column=\"column\">\r\n <kendo-grid-boolean-filter-cell [column]=\"column\" [filter]=\"filter\" operator=\"eq\">\r\n </kendo-grid-boolean-filter-cell>\r\n </ng-template>\r\n </div>\r\n <div *ngSwitchDefault>\r\n <ng-template kendoGridFilterCellTemplate let-filter let-column=\"column\">\r\n <kendo-grid-string-filter-cell [showOperators]=\"data.IsShowGridFilterOperator\" [column]=\"column\"\r\n [filter]=\"filter\" operator=\"contains\">\r\n <kendo-filter-contains-operator></kendo-filter-contains-operator>\r\n <kendo-filter-eq-operator></kendo-filter-eq-operator>\r\n <kendo-filter-neq-operator></kendo-filter-neq-operator>\r\n <kendo-filter-startswith-operator></kendo-filter-startswith-operator>\r\n <kendo-filter-endswith-operator></kendo-filter-endswith-operator>\r\n <kendo-filter-isnull-operator></kendo-filter-isnull-operator>\r\n <kendo-filter-isnotnull-operator></kendo-filter-isnotnull-operator>\r\n </kendo-grid-string-filter-cell>\r\n </ng-template>\r\n </div>\r\n </div>\r\n <!-- Grid Edit Template -->\r\n <ng-template kendoGridEditTemplate *ngIf=\"data.EnableGridCommand \" let-dataItem=\"dataItem\" let-column=\"col\" let-formGroup=\"formGroup\" let-isNew=\"isNew\">\r\n <div [ngSwitch]=\"col.fieldType\">\r\n <div *ngSwitchCase=\"'number'\">\r\n <kendo-numerictextbox #cellAnchor [formControl]=\"formGroup.get(col.field)\"></kendo-numerictextbox>\r\n <kendo-popup [anchor]=\"cellAnchor.numericInput\"\r\n *ngIf=\"formGroup.get(col.field).invalid && !(isNew && formGroup.get(col.field).untouched)\"\r\n popupClass=\"k-widget k-tooltip k-tooltip-validation k-invalid-msg\"\r\n style=\"padding-left: 2px; opacity: 0.5;\">\r\n <span class=\"k-icon k-i-warning\"></span>\r\n <ion-label style=\"padding-top: 1px; padding-left: 3px;\"\r\n *ngIf=\"formGroup.get(col.field).invalid && !formGroup.get(col.field).untouched && formGroup.get(col.field).errors?.required\">\r\n {{ col.Name }} required.\r\n </ion-label>\r\n <ion-label style=\"padding-top: 1px; padding-left: 3px;\"\r\n *ngIf=\"formGroup.get(col.field).invalid && !formGroup.get(col.field).untouched && formGroup.get(col.field).errors?.pattern\">\r\n {{ col.ValidatorMessage ? col.ValidatorMessage : \"Please check the input value.\" }}\r\n </ion-label>\r\n </kendo-popup>\r\n </div>\r\n <div *ngSwitchDefault>\r\n <kendo-textbox #cellAnchor [formControl]=\"formGroup.get(col.field)\"></kendo-textbox>\r\n <kendo-popup [anchor]=\"cellAnchor.input\"\r\n *ngIf=\"formGroup.get(col.field).invalid && !(isNew && formGroup.get(col.field).untouched)\"\r\n popupClass=\"k-widget k-tooltip k-tooltip-validation k-invalid-msg\"\r\n style=\"padding-left: 2px; opacity: 0.5;\">\r\n <span class=\"k-icon k-i-warning\"></span>\r\n <!--<ion-label style=\"padding-top: 1px; padding-left: 3px;\">{{ col.Name }} is required.</ion-label>-->\r\n -l\r\n\r\n <ion-label style=\"padding-top: 1px; padding-left: 3px;\"\r\n *ngIf=\"formGroup.get(col.field).invalid && !formGroup.get(col.field).untouched && formGroup.get(col.field).errors?.required\">\r\n {{ col.Name }} required.\r\n </ion-label>\r\n <ion-label style=\"padding-top: 1px; padding-left: 3px;\"\r\n *ngIf=\"formGroup.get(col.field).invalid && !formGroup.get(col.field).untouched && formGroup.get(col.field).errors?.pattern\">\r\n {{ col.ValidatorMessage ? col.ValidatorMessage : \"Please check the input value.\" }}\r\n </ion-label>\r\n </kendo-popup>\r\n </div>\r\n </div>\r\n </ng-template>\r\n <ng-template kendoGridCellTemplate let-dataItem let-rowIndex=\"rowIndex\">\r\n <div style=\"margin: 1px 0;\" *ngIf=\"!col.clickableIcons && col.isEditableInGrid !== true\"\r\n [ngSwitch]=\"col.fieldType\" [ngClass]=\"getClass(dataItem, col)\" [style]=\"getCellStyle(col, dataItem)\" [attr.data-id]=\"dataItem.Id\" [attr.column-name]=\"col.field\"\r\n (mouseenter)=\"showPopOver(col, $event)\" (mouseleave)=\"closePopOver($event)\">\r\n <span *ngSwitchCase=\"'zdate'\" class=\"grid-cell-data\">\r\n {{ dataItem[col.field] | date: col.FormatOptions ?? 'dd/MM/yyyy' }}\r\n </span>\r\n <span *ngSwitchCase=\"'ztime'\" class=\"grid-cell-data\">\r\n {{ dataItem[col.field] | date: col.FormatOptions ?? 'HH:mm' }}\r\n </span>\r\n <span *ngSwitchCase=\"'zshortdate'\" class=\"grid-cell-data\">\r\n {{ dataItem[col.field] | date: col.FormatOptions ?? 'MMM yyyy' }}\r\n </span>\r\n <span *ngSwitchCase=\"'zdatetime'\" class=\"grid-cell-data\">\r\n {{ dataItem[col.field] | date: col.FormatOptions ?? 'dd/MM/yyyy hh:mm:ss aa' }}\r\n </span>\r\n <span *ngSwitchCase=\"'zuidatetime'\" class=\"grid-cell-data\">\r\n {{ dataItem[col.field] | date: col.FormatOptions ?? 'dd/MM/yyyy hh:mm:ss aa' }}\r\n </span>\r\n <span *ngSwitchCase=\"'number'\" class=\"grid-cell-data\">\r\n {{ dataItem[col.field] | number }}\r\n </span>\r\n <span *ngSwitchCase=\"'currency'\" class=\"grid-cell-data\">\r\n {{ dataItem[col.field] | number: getFormat(col, '1.2-2') }}\r\n </span>\r\n <span *ngSwitchCase=\"'znumeric'\" class=\"grid-cell-data\">\r\n {{ dataItem[col.field] | number: getFormat(col) }}\r\n </span>\r\n <span *ngSwitchCase=\"'url'\" style=\"color: blue; cursor: pointer; text-decoration:underline;\" class=\"grid-cell-data\">\r\n {{ dataItem[col.field] }}\r\n </span>\r\n <span *ngSwitchDefault>\r\n <div style=\"margin: 5px 0;\" *ngIf=\"col.gridCellReplaceValue && getIconName(col.gridCellReplaceValue, dataItem[col.field]) !== ''\">\r\n <fa-icon [icon]=\"getIconName(col.gridCellReplaceValue, dataItem[col.field])\"></fa-icon>\r\n </div>\r\n <div *ngIf=\"!col.gridCellReplaceValue\" [ngSwitch]=\"cellStyleCondition(col, dataItem[col.field])\">\r\n <span *ngSwitchCase=true>\r\n <div class=\"cellStyleConditionDefault\" [style]=\"setCellStyleCondition(col, dataItem[col.field])\">\r\n <span class=\"grid-cell-data\">{{ dataItem[col.field] }} </span>\r\n </div>\r\n </span>\r\n <span *ngSwitchDefault>\r\n <span class=\"grid-cell-data\">{{ dataItem[col.field] }} </span>\r\n </span>\r\n </div>\r\n </span>\r\n </div>\r\n <!-- <span *ngIf=\"!!col.navigateTo\" (click)=\"onNavigateTo($event, col, dataItem, dataItem[col.field])\">\r\n <ion-button color=\"light\" size=\"small\">\r\n {{ col.ClickableIcons }}\r\n <ion-icon slot= \"end\" name=\"arrow-forward\"></ion-icon>\r\n </ion-button>\r\n </span> -->\r\n <div style=\"margin: 5px 0;\" *ngIf=\"col.isEditableInGrid === true && isInlineFormGroupHasValue() && !isInlineEditInputFieldLoading && !col.gridCellReplaceValue\" [style]=\"componentProperties.style.style5\"\r\n [ngClass]=\"getClass(dataItem, col)\" class=\"e1tag-style5\" [style]=\"getCellStyleForInlineEdit(col, dataItem, rowIndex)\">\r\n <app-zinput-container [data]=\"getInlineField(col.field)\" [group]=\"group\"\r\n [form]=\"getInlineForm(dataItem, rowIndex)\" [containerField]=\"containerField\" [style]=\"componentProperties.style.style6\" class=\"e1tag-style6\">\r\n </app-zinput-container>\r\n </div>\r\n <span style=\"margin-top: 10px;\" *ngFor=\"let icon of col.clickableIcons\">\r\n <span [ngClass]=\"icon.Class ? icon.Class : ''\" *ngIf=\"!!icon && (!!dataItem.WFS_StatusCode && !!icon)\r\n ? dataItem.WFS_StatusCode !== icon.WFS_StatusCode\r\n : true;\r\n else disabledButton\" (click)=\"onBtnClick($event, icon, dataItem, dataItem[col.field])\">\r\n {{icon.Name || dataItem[col.field]}} <fa-icon [icon]=\"icon.Icon\" style=\"padding: 4px 6px;\">\r\n </fa-icon>\r\n </span>\r\n <ng-template #disabledButton>\r\n </ng-template>\r\n </span>\r\n <!-- <strong>{{ dataItem[col.field] }}</strong> -->\r\n <!-- <span class=\"{{dataItem.Discontinued ? 'discontinued' : 'active'}}\">\r\n {{dataItem.Discontinued ? \"discontinued\" : \"active\"}}\r\n </span> -->\r\n </ng-template>\r\n <ng-template kendoGridFooterTemplate let-column let-columnIndex=\"columnIndex\" *ngIf=\"data.EnableAggregate\">\r\n <div style=\"margin: 5px 0;\" [ngSwitch]=\"col.fieldType\" [style]=\"componentProperties.style.style7\" class=\"e1tag-style7\">\r\n {{col.aggregateType}}\r\n <span *ngSwitchCase=\"'zdate'\">\r\n {{ col.aggregateValue | date: col.FormatOptions ?? 'dd/MM/yyyy' }}\r\n </span>\r\n <span *ngSwitchCase=\"'ztime'\">\r\n {{ col.aggregateValue | date: col.FormatOptions ?? 'HH:mm' }}\r\n </span>\r\n <span *ngSwitchCase=\"'zshortdate'\">\r\n {{ col.aggregateValue | date: col.FormatOptions ?? 'MMM yyyy' }}\r\n </span>\r\n <span *ngSwitchCase=\"'zdatetime'\">\r\n {{ col.aggregateValue | date: col.FormatOptions ?? 'dd/MM/yyyy hh:mm:ss aa' }}\r\n </span>\r\n <span *ngSwitchCase=\"'zuidatetime'\">\r\n {{ col.aggregateValue | date: col.FormatOptions ?? 'dd/MM/yyyy hh:mm:ss aa' }}\r\n </span>\r\n <span *ngSwitchCase=\"'number'\">\r\n {{ col.aggregateValue | number }}\r\n </span>\r\n <span *ngSwitchCase=\"'currency'\">\r\n {{ col.aggregateValue | number: getFormat(col, '1.2.2') }}\r\n </span>\r\n <span *ngSwitchCase=\"'znumeric'\">\r\n {{ col.aggregateValue | number: getFormat(col) }}\r\n </span>\r\n <span *ngSwitchCase=\"'url'\" style=\"color: blue; cursor: pointer; text-decoration:underline;\">\r\n {{ col.aggregateValue }}\r\n </span>\r\n <span *ngSwitchDefault>\r\n {{ col.aggregateValue }}\r\n </span>\r\n </div>\r\n </ng-template>\r\n </kendo-grid-column>\r\n <kendo-grid-command-column *ngIf=\"data.EnableGridCommand\" width=\"180\" [columnMenu]=\"false\" [style]=\"componentProperties.style.style8\" class=\"e1tag-style8\">\r\n <ng-template kendoGridCellTemplate let-isNew=\"isNew\">\r\n <button kendoGridSaveCommand>\r\n {{ isNew ? 'Save' : 'Update' }}\r\n </button>\r\n <button kendoGridCancelCommand [primary]=\"true\">\r\n {{ isNew ? 'Discard changes' : 'Cancel' }}\r\n </button>\r\n <button kendoGridEditCommand>\r\n {{ \"Edit\" }}\r\n </button>\r\n <button kendoGridRemoveCommand>\r\n {{ \"Remove\" }}\r\n </button>\r\n </ng-template>\r\n </kendo-grid-command-column>\r\n <kendo-grid-command-column *ngIf=\"data.EnableCustomRemoveCommand\" width=\"180\" [columnMenu]=\"false\" [style]=\"componentProperties.style.style8\" class=\"e1tag-style8\">\r\n <ng-template kendoGridCellTemplate let-isNew=\"isNew\" let-dataItem let-rowIndex=\"rowIndex\">\r\n <button type=\"button\" kendoButton (click)=\"gridCustomRemoveCommand(dataItem, rowIndex)\" *ngIf=\"data.EnableCustomRemoveCommand\">\r\n {{ \"Remove\" }}\r\n </button>\r\n </ng-template>\r\n </kendo-grid-command-column>\r\n <kendo-grid-excel fileName=\"Export.xlsx\" [fetchData]=\"allResults\"></kendo-grid-excel>\r\n </kendo-grid>\r\n <app-context-menu [data]=\"data\" [group]=\"group\" [form]=\"form\" #dataitemcontextmenu></app-context-menu>\r\n </div>\r\n </div>\r\n <!-- for DEC auto scrolling -->\r\n <div id=\"end-of-grid\"></div>\r\n</div>\r\n\r\n", styles: [".grid-container.align-with-input{margin:0 25px 0 10px}:host ::ng-deep kendo-treelist.desktop-grid,:host ::ng-deep kendo-grid.desktop-grid{border-width:0px;width:100%;background:transparent}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-content,:host ::ng-deep kendo-grid.desktop-grid .k-grid-content{white-space:nowrap}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar{margin-bottom:15px;padding:5px 0 0;display:flex;flex-direction:row;border:none;background:transparent;border-bottom:1px solid var(--ion-app-seperator-line-color)}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar .k-input,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar .k-picker,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar .k-input,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar .k-picker{width:100%}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item .k-button,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item .k-button,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item .k-button,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item .k-button,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item .k-button,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item .k-button{font-size:calc(var(--button-font-size) - 1px);margin-left:8px;margin-right:2px;border-radius:var(--button-border-radius);background:#fff;border:none;box-shadow:none;padding:5px}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item .k-button.left-buttons,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item .k-button.left-buttons,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item .k-button.left-buttons,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item .k-button.left-buttons,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item .k-button.left-buttons,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item .k-button.left-buttons{margin:auto 0 auto 5px}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item .k-button .k-grid-button,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item .k-button .k-grid-button,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item .k-button .k-grid-button,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item .k-button .k-grid-button,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item .k-button .k-grid-button,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item .k-button .k-grid-button{padding:0 6px}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item .k-button fa-icon,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item .k-button fa-icon,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item .k-button fa-icon,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item .k-button fa-icon,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item .k-button fa-icon,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item .k-button fa-icon{color:var(--ion-color-primary)}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item .k-button .k-icon,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item .k-button .k-icon,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item .k-button .k-icon,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item .k-button .k-icon,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item .k-button .k-icon,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item .k-button .k-icon{font-size:calc(var(--button-font-size) + 8px)}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item .k-button .k-icon-with-text,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item .k-button .k-icon-with-text,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item .k-button .k-icon-with-text,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item .k-button .k-icon-with-text,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item .k-button .k-icon-with-text,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item .k-button .k-icon-with-text{margin-right:2px;font-size:calc(var(--button-font-size) + 2px);padding-bottom:3px}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item .k-button:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item .k-button:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item .k-button:hover,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item .k-button:hover,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item .k-button:hover,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item .k-button:hover{background:rgba(var(--ion-color-primary-rgb),.2)}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container{margin-top:auto;padding-bottom:1px;gap:5px;display:flex}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container.with-grid-title,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container.with-grid-title,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container.with-grid-title,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container.with-grid-title,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container.with-grid-title,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container.with-grid-title{margin-left:10px;border-left:1px solid #c9c9c9;padding-left:8px}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text{height:18px;gap:8px;display:flex;margin:auto}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .k-i-file-excel,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .k-i-file-excel,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .k-i-file-excel,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .k-i-file-excel,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .k-i-file-excel,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .k-i-file-excel{margin-top:-1px;font-size:calc(var(--button-font-size) + 6px)}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .export-to-excel-button-text,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .export-to-excel-button-text,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .export-to-excel-button-text,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .export-to-excel-button-text,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .export-to-excel-button-text,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .export-to-excel-button-text{margin:auto}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container{flex:1 1 100%;border:1px solid var(--ion-app-seperator-line-color);display:grid}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.normal-filter-container,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.normal-filter-container{display:grid;grid-template-columns:80% 20%;width:100%}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons{display:flex;margin:auto 5px auto auto;padding:0 5px;position:relative}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons.filter-field-layout-type2,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons.filter-field-layout-type2{top:12px}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons>ion-button,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons>ion-button{font-size:var(--button-font-size);margin-left:10px;height:calc(var(--input-field-height) + 2px)}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons>ion-button.toggleOn,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons>ion-button.toggleOn{--background: rgba(var(--ion-color-primary-rgb), 15%);--background-hover: rgba(var(--ion-color-primary-rgb), 10%);--color: var(--ion-color-primary);--border-color: var(--ion-color-primary)}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons>ion-button.toggleOff,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons>ion-button.toggleOff{--background: var(--disabled-input-field-backgroundcolor);--border-color: var(--z-placeholder-color);--color: var(--z-placeholder-color);--background-hover: #efefef}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons>ion-button .btn-label,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons>ion-button .btn-label{padding-left:5px}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.adv-filter-container,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.adv-filter-container{margin-top:10px}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.adv-filter-container>.adv-filter-seperator,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.adv-filter-container>.adv-filter-seperator{width:100%;height:calc(var(--content-font-size) - 1px);border-bottom:1px solid var(--ion-color-primary);text-align:center}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.adv-filter-container>.adv-filter-seperator span,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.adv-filter-container>.adv-filter-seperator span{font-size:calc(var(--content-font-size) + 3px);background:#fff;padding:0 20px;color:var(--ion-color-primary);font-weight:600}:host ::ng-deep kendo-treelist.desktop-grid.toolbar-no-border .k-toolbar,:host ::ng-deep kendo-grid.desktop-grid.toolbar-no-border .k-toolbar{margin-bottom:0;border-width:0px}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-aria-root,:host ::ng-deep kendo-grid.desktop-grid .k-grid-aria-root{border:1px solid var(--ion-color-primary);border-radius:5px 5px 0 0}:host ::ng-deep kendo-treelist.desktop-grid.hiden-pager .k-grid-aria-root,:host ::ng-deep kendo-grid.desktop-grid.hiden-pager .k-grid-aria-root{border-radius:5px}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header{font-weight:600;font-size:var(--grid-header-font-size);background:rgba(var(--ion-color-primary-rgb),.25);color:#000}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-cell-inner>.k-link,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-cell-inner>.k-link{padding:12px 12px 8px}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-grid-filter,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-header-column-menu,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-hierarchy-cell .k-icon,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-grid-filter.k-active,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-header-column-menu.k-active,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-hierarchy-cell .k-icon.k-active .k-grid-filter.k-state-active,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-header-column-menu.k-state-active,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-hierarchy-cell .k-icon.k-state-active,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-grid-filter,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-header-column-menu,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-hierarchy-cell .k-icon,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-grid-filter.k-active,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-header-column-menu.k-active,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-hierarchy-cell .k-icon.k-active .k-grid-filter.k-state-active,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-header-column-menu.k-state-active,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-hierarchy-cell .k-icon.k-state-active{color:#000;background:transparent}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-filtercell .k-dropdown .k-dropdown-wrap,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-filtercell .k-dropdowntree .k-dropdown-wrap,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-filtercell .k-dropdown .k-dropdown-wrap,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-filtercell .k-dropdowntree .k-dropdown-wrap{background:var(--ion-color-primary-contrast);color:var(--ion-color-primary-shade)}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-filtercell .k-dropdown .k-button,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-filtercell .k-dropdowntree .k-button,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-filtercell .k-dropdown .k-button,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-filtercell .k-dropdowntree .k-button{color:var(--ion-color-primary-shade)}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-filtercell>.k-filtercell-wrapper>.k-filtercell-operator,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-filtercell>.k-filtercell-wrapper>.k-filtercell-operator{display:flex}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-filtercell>.k-filtercell-wrapper>.k-filtercell-operator>.k-button.k-clear-button-visible,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-filtercell>.k-filtercell-wrapper>.k-filtercell-operator>.k-button.k-clear-button-visible{margin-left:4px}:host ::ng-deep kendo-treelist.desktop-grid tbody>tr,:host ::ng-deep kendo-grid.desktop-grid tbody>tr{background:rgba(var(--ion-color-primary-rgb),.08);font-size:var(--grid-cell-font-size)}:host ::ng-deep kendo-treelist.desktop-grid tbody>tr.k-alt,:host ::ng-deep kendo-grid.desktop-grid tbody>tr.k-alt{background:rgba(var(--ion-color-primary-rgb),.01)}:host ::ng-deep kendo-treelist.desktop-grid tbody>td.k-selected,:host ::ng-deep kendo-treelist.desktop-grid tbody>td.k-selected.k-alt,:host ::ng-deep kendo-treelist.desktop-grid tbody>tr.k-selected>td,:host ::ng-deep kendo-treelist.desktop-grid tbody>tr.k-selected.k-alt>td,:host ::ng-deep kendo-treelist.desktop-grid tbody>td.k-state-selected,:host ::ng-deep kendo-treelist.desktop-grid tbody>td.k-state-selected.k-alt,:host ::ng-deep kendo-treelist.desktop-grid tbody>tr.k-state-selected>td,:host ::ng-deep kendo-treelist.desktop-grid tbody>tr.k-state-selected.k-alt>td,:host ::ng-deep kendo-grid.desktop-grid tbody>td.k-selected,:host ::ng-deep kendo-grid.desktop-grid tbody>td.k-selected.k-alt,:host ::ng-deep kendo-grid.desktop-grid tbody>tr.k-selected>td,:host ::ng-deep kendo-grid.desktop-grid tbody>tr.k-selected.k-alt>td,:host ::ng-deep kendo-grid.desktop-grid tbody>td.k-state-selected,:host ::ng-deep kendo-grid.desktop-grid tbody>td.k-state-selected.k-alt,:host ::ng-deep kendo-grid.desktop-grid tbody>tr.k-state-selected>td,:host ::ng-deep kendo-grid.desktop-grid tbody>tr.k-state-selected.k-alt>td{background:rgba(var(--ion-color-secondary-rgb),.8);color:var(--ion-color-secondary-contrast);font-weight:600}:host ::ng-deep kendo-treelist.desktop-grid tbody>tr:hover,:host ::ng-deep kendo-treelist.desktop-grid tbody>tr.k-hover,:host ::ng-deep kendo-treelist.desktop-grid tbody>tr.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid tbody>tr:hover,:host ::ng-deep kendo-grid.desktop-grid tbody>tr.k-hover,:host ::ng-deep kendo-grid.desktop-grid tbody>tr.k-state-hover{background-color:rgba(var(--ion-color-secondary-rgb),.15)}:host ::ng-deep kendo-treelist.desktop-grid tbody td>.gridCell>span>div>span,:host ::ng-deep kendo-grid.desktop-grid tbody td>.gridCell>span>div>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager{background-color:rgba(var(--ion-color-primary-rgb),.25);color:#000;border:1px solid var(--ion-color-primary);border-top:none;border-radius:0 0 5px 5px;font-size:calc(var(--grid-cell-font-size) - 2px);padding:2px 10px}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link{color:#000;border-radius:5px}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover{color:#fff;background-image:linear-gradient(rgba(var(--ion-color-primary-rgb),.7),rgba(var(--ion-color-primary-rgb),.8))}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-selected,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-selected:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-selected.k-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-selected,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-selected:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-selected.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-selected,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-selected:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-selected.k-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-state-selected,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-state-selected:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-state-selected.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-selected,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-selected:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-selected.k-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-selected,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-selected:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-selected.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-selected,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-selected:hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-selected.k-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-selected,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-selected:hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-selected.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-selected,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-selected:hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-selected.k-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-state-selected,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-state-selected:hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-state-selected.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-selected,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-selected:hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-selected.k-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-selected,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-selected:hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-selected.k-state-hover{color:var(--ion-color-primary);background:var(--ion-color-primary-contrast);font-weight:600}:host ::ng-deep kendo-treelist.desktop-grid.cellWrapText td>.gridCell>span>div>span,:host ::ng-deep kendo-grid.desktop-grid.cellWrapText td>.gridCell>span>div>span{white-space:pre-line}:host ::ng-deep kendo-treelist .cellStyleConditionDefault,:host ::ng-deep kendo-grid .cellStyleConditionDefault{border-radius:5px;text-align:center}:host ::ng-deep kendo-treelist .rightAligned,:host ::ng-deep kendo-grid .rightAligned{text-align:right}:host ::ng-deep kendo-treelist .centerAligned,:host ::ng-deep kendo-grid .centerAligned{text-align:center}.gridTitle{font-size:calc(var(--grid-header-font-size) + 8px);font-weight:700;margin:auto 5px;color:var(--ion-color-dark);padding-top:2px;display:inherit}.gridTitleIcon{color:var(--ion-color-dark);font-size:calc(var(--grid-header-font-size) + 2px);display:block;margin:auto 0;padding-top:2px}.refresh-btn{zoom:.8}.refresh-btn>.k-i-refresh-sm{transform:rotate(30deg);font-size:1.4rem}.toolbar-left-item{flex-grow:1;display:flex}.toolbar-right-item{bottom:2px;position:relative}.gridCell.primary{color:var(--ion-color-primary)}.gridCell.secondary{color:var(--ion-color-dark)}.gridCell.tertiary{color:var(--ion-color-tertiary)}.gridCell.success{color:var(--ion-color-success-shade)}.gridCell.warning{color:var(--ion-color-warning)}.gridCell.danger{color:var(--ion-color-danger)}.gridCell.dark{color:var(--ion-color-dark)}.gridCell.medium{color:var(--ion-color-medium)}.gridCell.light{color:var(--ion-color-light)}.k-i-loading{position:absolute;inset:100px 0 0;font-size:45px;background-color:#ffffff4d;color:#0f4800}\n"], components: [{ type: i7$2.PopoverComponent, selector: "kendo-popover", inputs: ["position", "offset", "width", "height", "title", "subtitle", "body", "callout", "animation", "templateData"], outputs: ["show", "shown", "hide", "hidden"] }, { type: i8.GridComponent, selector: "kendo-grid", inputs: ["data", "pageSize", "height", "rowHeight", "detailRowHeight", "skip", "scrollable", "selectable", "sort", "trackBy", "filter", "group", "virtualColumns", "filterable", "sortable", "pageable", "groupable", "navigable", "navigatable", "autoSize", "rowClass", "rowSticky", "rowSelected", "cellSelected", "resizable", "reorderable", "loading", "columnMenu", "hideHeader", "isDetailExpanded", "isGroupExpanded"], outputs: ["filterChange", "pageChange", "groupChange", "sortChange", "selectionChange", "dataStateChange", "groupExpand", "groupCollapse", "detailExpand", "detailCollapse", "edit", "cancel", "save", "remove", "add", "cellClose", "cellClick", "pdfExport", "excelExport", "columnResize", "columnReorder", "columnVisibilityChange", "columnLockedChange", "columnStickyChange", "scrollBottom", "contentScroll"], exportAs: ["kendoGrid"] }, { type: i16.LabelComponent, selector: "kendo-label", inputs: ["text", "for", "optional"], exportAs: ["kendoLabel"] }, { type: i4.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }, { type: ZworkflowbuttonsComponent, selector: "app-zworkflowbuttons" }, { type: ZbuttonsComponent, selector: "app-zbuttons" }, { type: ZformComponent, selector: "app-zform", inputs: ["group", "fieldName"] }, { type: i2$1.IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }, { type: i8.CheckboxColumnComponent, selector: "kendo-grid-checkbox-column", inputs: ["showSelectAll"] }, { type: i8.ColumnComponent, selector: "kendo-grid-column", inputs: ["field", "format", "sortable", "groupable", "editor", "filter", "filterable", "editable"] }, { type: i8.NumericFilterCellComponent, selector: "kendo-grid-numeric-filter-cell", inputs: ["filterDelay", "showOperators"] }, { type: i8.EqualFilterOperatorComponent, selector: "kendo-filter-eq-operator" }, { type: i8.NotEqualFilterOperatorComponent, selector: "kendo-filter-neq-operator" }, { type: i8.LessFilterOperatorComponent, selector: "kendo-filter-lt-operator" }, { type: i8.LessOrEqualToFilterOperatorComponent, selector: "kendo-filter-lte-operator" }, { type: i8.GreaterFilterOperatorComponent, selector: "kendo-filter-gt-operator" }, { type: i8.GreaterOrEqualToFilterOperatorComponent, selector: "kendo-filter-gte-operator" }, { type: i8.IsNullFilterOperatorComponent, selector: "kendo-filter-isnull-operator" }, { type: i8.IsNotNullFilterOperatorComponent, selector: "kendo-filter-isnotnull-operator" }, { type: DateRangeFilterCellComponent, selector: "date-range-filter-cell", inputs: ["filter", "field", "data"] }, { type: i8.DateFilterCellComponent, selector: "kendo-grid-date-filter-cell", inputs: ["showOperators"] }, { type: i8.BooleanFilterCellComponent, selector: "kendo-grid-boolean-filter-cell" }, { type: i8.StringFilterCellComponent, selector: "kendo-grid-string-filter-cell", inputs: ["filterDelay", "showOperators"] }, { type: i8.ContainsFilterOperatorComponent, selector: "kendo-filter-contains-operator" }, { type: i8.StartsWithFilterOperatorComponent, selector: "kendo-filter-startswith-operator" }, { type: i8.EndsWithFilterOperatorComponent, selector: "kendo-filter-endswith-operator" }, { type: i3$5.NumericTextBoxComponent, selector: "kendo-numerictextbox", inputs: ["focusableId", "disabled", "readonly", "title", "autoCorrect", "format", "max", "min", "decimals", "placeholder", "step", "spinners", "rangeValidation", "tabindex", "tabIndex", "changeValueOnScroll", "selectOnFocus", "value", "maxlength", "size", "rounded", "fillMode"], outputs: ["valueChange", "focus", "blur"], exportAs: ["kendoNumericTextBox"] }, { type: i2$4.PopupComponent, selector: "kendo-popup", inputs: ["animate", "anchor", "anchorAlign", "collision", "popupAlign", "copyAnchorStyles", "popupClass", "positionMode", "offset", "margin"], outputs: ["anchorViewportLeave", "close", "open", "positionChange"], exportAs: ["kendo-popup"] }, { type: i2$1.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { type: i3$5.TextBoxComponent, selector: "kendo-textbox", inputs: ["focusableId", "title", "disabled", "readonly", "tabindex", "value", "selectOnFocus", "showSuccessIcon", "showErrorIcon", "clearButton", "successIcon", "errorIcon", "clearButtonIcon", "size", "rounded", "fillMode", "tabIndex", "placeholder", "maxlength"], outputs: ["valueChange", "inputFocus", "inputBlur", "focus", "blur"], exportAs: ["kendoTextBox"] }, { type: ZInputContainerComponent, selector: "app-zinput-container" }, { type: i8.CommandColumnComponent, selector: "kendo-grid-command-column" }, { type: i8.ExcelComponent, selector: "kendo-grid-excel", inputs: ["fileName", "filterable", "creator", "date", "forceProxy", "proxyURL", "fetchData", "paddingCellOptions", "headerPaddingCellOptions", "collapsible"] }, { type: ContextMenuComponent, selector: "app-context-menu", inputs: ["target", "selectedData"] }], directives: [{ type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i7.DefaultClassDirective, selector: " [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl], [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl], [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }, { type: i7$2.PopoverBodyTemplateDirective, selector: "[kendoPopoverBodyTemplate]" }, { type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i7$2.TooltipDirective, selector: "[kendoTooltip]", inputs: ["filter", "position", "titleTemplate", "showOn", "showAfter", "callout", "closable", "offset", "tooltipWidth", "tooltipHeight", "tooltipClass", "collision", "closeTitle", "tooltipTemplate"], exportAs: ["kendoTooltip"] }, { type: i7$2.PopoverContainerDirective, selector: "[kendoPopoverContainer]", inputs: ["filter"], exportAs: ["kendoPopoverContainer"] }, { type: ZGridBindingDirective, selector: "[zgridbinding]", inputs: ["zgridbinding"] }, { type: i8.SelectionDirective, selector: "[kendoGridSelectBy]" }, { type: i8.ToolbarTemplateDirective, selector: "[kendoGridToolbarTemplate]", inputs: ["position"] }, { type: i3$3.ButtonDirective, selector: "button[kendoButton], span[kendoButton]", inputs: ["toggleable", "togglable", "selected", "tabIndex", "icon", "iconClass", "imageUrl", "disabled", "size", "rounded", "fillMode", "themeColor", "role", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { type: i8.ExcelCommandDirective, selector: "[kendoGridExcelCommand]" }, { type: i8.AddCommandDirective, selector: "[kendoGridAddCommand]" }, { type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i5.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i5.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i8.FilterCellTemplateDirective, selector: "[kendoGridFilterCellTemplate]" }, { type: i5.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { type: i8.EditTemplateDirective, selector: "[kendoGridEditTemplate]" }, { type: i4$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i8.CellTemplateDirective, selector: "[kendoGridCellTemplate]" }, { type: i8.FooterTemplateDirective, selector: "[kendoGridFooterTemplate]" }, { type: i8.FocusableDirective, selector: "[kendoGridFocusable], [kendoGridEditCommand], [kendoGridRemoveCommand], [kendoGridSaveCommand], [kendoGridCancelCommand], [kendoGridSelectionCheckbox] ", inputs: ["kendoGridFocusable"] }, { type: i8.SaveCommandDirective, selector: "[kendoGridSaveCommand]" }, { type: i8.CancelCommandDirective, selector: "[kendoGridCancelCommand]" }, { type: i8.EditCommandDirective, selector: "[kendoGridEditCommand]" }, { type: i8.RemoveCommandDirective, selector: "[kendoGridRemoveCommand]" }], pipes: { "htmlSanitize": HtmlSanitizePipe, "date": i5.DatePipe, "number": i5.DecimalPipe }, animations: [
|
|
10031
10108
|
hideAndShowVerticalAnimation
|
|
10032
10109
|
] });
|
|
10033
10110
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: ZgridComponent, decorators: [{
|
|
@@ -11732,7 +11809,7 @@ class ZtreeComponent extends DataListingFieldBase {
|
|
|
11732
11809
|
}
|
|
11733
11810
|
}
|
|
11734
11811
|
ZtreeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: ZtreeComponent, deps: [{ token: ZComponentService }], target: i0.ɵɵFactoryTarget.Component });
|
|
11735
|
-
ZtreeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.3", type: ZtreeComponent, selector: "app-ztree", viewQueries: [{ propertyName: "nodetemplate", first: true, predicate: ["nodetemplate"], descendants: true, static: true }, { propertyName: "zinput_textboxList", predicate: ["zinput_textbox"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div style=\"width:100%\" [style]=\"componentProperties.style.style\" class=\"e1tag-style\"\r\n *ngIf=\"(!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible)\">\r\n <kendo-treeview [nodes]=\"getItems()\"\r\n kendoTreeViewExpandable\r\n [kendoTreeViewSelectable]=\"selection\"\r\n kendoTreeViewDragAndDrop\r\n kendoTreeViewDragAndDropEditing\r\n [isExpanded]=\"isExpanded\"\r\n (collapse)=\"handleCollapse($event)\"\r\n (expand)=\"handleExpand($event)\"\r\n (nodeDrop)=\"handleNodeDrop($event)\"\r\n (nodeDragEnd)=\"handleNodeDragEnd($event)\"\r\n (selectionChange)=\"onSelectionChange($event)\"\r\n [(selectedKeys)]=\"selectedKeys\"\r\n kendoTreeViewHierarchyBinding\r\n childrenField=\"Value\"\r\n textField=\"Name\"\r\n [selectBy]=\"data.SelectOptions\"\r\n [filterable]=\"data.Filterable\"\r\n (filterChange)=\"handleFilter($event)\"\r\n [style]=\"componentProperties.style.style1\"\r\n class=\"e1tag-style1\"\r\n [ngClass]=\"data.Class\"\r\n [kendoTreeViewCheckable]=\"checkableSettings\"\r\n [checkBy]=\"data.SelectOptions\"\r\n [(checkedKeys)]=\"checkedKeys\"\r\n (checkedChange)=\"onCheckedChange($event)\"\r\n [kendoTreeViewDisable]=\"data.SelectOptions\"\r\n [isChecked]=\"isChecked\"\r\n [(disabledKeys)]=\"disabledCheckBoxKeys\"\r\n [disableParentNodesOnly]=\"data.DisableParentNodesOnly\"\r\n [expandDisabledNodes]=\"data.ExpandDisabledNodes\"\r\n (nodeClick)=\"onNodeClick($event)\">\r\n <ng-template kendoTreeViewNodeTemplate let-dataItem #nodetemplate>\r\n <div class=\"tree-content-container\">\r\n <ion-button *ngIf=\"!!data.OnAddNode && !data.isHideAllAddNode\"\r\n (click)=\"onAddNode($event, dataItem, data, group)\"\r\n style=\"zoom: 0.6; margin: 0 0 0 2px;\"\r\n mat-raised-button\r\n color=\"primary\"\r\n size=\"medium\"\r\n [hidden]=\"!!dataItem.OnAddNodeVisible\"\r\n [style]=\"componentProperties.style.style2\"\r\n class=\"e1tag-style2\">\r\n <fa-icon [icon]=\"'plus'\"></fa-icon>\r\n </ion-button>\r\n <ion-button *ngIf=\"!!data.OnRemoveNode && !data.isHideAllRemoveNode\"\r\n (click)=\"onRemoveNode($event, dataItem, data, group)\"\r\n style=\"zoom: 0.6; margin: 0 0 0 10px;\"\r\n color=\"danger\"\r\n mat-raised-button\r\n size=\"medium\"\r\n [hidden]=\"!!dataItem.OnRemoveNodeVisible\"\r\n [style]=\"componentProperties.style.style3\"\r\n class=\"e1tag-style3\">\r\n <fa-icon [icon]=\"'minus'\"></fa-icon>\r\n </ion-button>\r\n <span class=\"btn-seperator e1tag-style7\" [style]=\"componentProperties.style.style7\"></span>\r\n <span *ngFor=\"let icon of dataItem.IconList\">\r\n <fa-icon class=\"e1tag-style5 left-icon\" [icon]=\"icon\" [style]=\"componentProperties.style.style5\"></fa-icon>\r\n </span>\r\n <ion-label [style]=\"componentProperties.style.style4\" class=\"e1tag-style4\" [ngClass]=\"dataItem.class\" *ngIf=\"!dataItem.z_inputType\">\r\n <div [style]=\"componentProperties.style.style6\" class=\"e1tag-style6\" [innerHTML]=\"getTemplate(dataItem, data, group) | htmlSanitize\"></div>\r\n </ion-label>\r\n <div [style]=\"componentProperties.style.style4\" class=\"e1tag-style4\" [ngClass]=\"dataItem.class\" *ngIf=\"!!dataItem.z_inputType\">\r\n <kendo-textbox\r\n #zinput_textbox\r\n *ngIf=\"dataItem.z_inputType == 'text'\"\r\n class=\"input-field e1tag-style8\"\r\n [id]=\"data.Name + '_' + dataItem.z_inputType + '_' + dataItem.Id\"\r\n [style]=\"componentProperties.style.style8\"\r\n [(ngModel)]=\"dataItem.z_inputValue\">\r\n </kendo-textbox>\r\n </div>\r\n </div>\r\n </ng-template>\r\n </kendo-treeview>\r\n <app-context-menu [data]=\"data\" [group]=\"group\" [form]=\"form\" #dataitemcontextmenu></app-context-menu>\r\n</div>\r\n", styles: [":host ::ng-deep .k-treeview .k-treeview-leaf{width:100%;margin:5px;padding:9px 20px 9px 8px;border-radius:2px;background:rgba(var(--ion-color-primary-rgb),.15);color:var(--ion-color-primary-shade);border:1px solid rgba(var(--ion-color-primary-rgb),1);font-size:13px;cursor:pointer}:host ::ng-deep .k-treeview .k-treeview-leaf.k-selected,:host ::ng-deep .k-treeview .k-treeview-leaf.k-state-selected{width:100%;margin:5px;padding:9px 20px 9px 8px;border-radius:2px;background:rgba(var(--ion-color-primary-rgb),.5);font-size:13px;cursor:pointer}:host ::ng-deep .k-treeview .k-treeview-leaf:hover,:host ::ng-deep .k-treeview .k-treeview-leaf.k-hover .k-treeview-leaf.k-state-hover{width:100%;margin:5px;padding:9px 20px 9px 8px;border-radius:2px;background:rgba(var(--ion-color-primary-rgb),.1);font-size:13px;cursor:pointer}:host ::ng-deep .k-treeview .tree-content-container{display:flex;align-items:center;justify-content:center}:host ::ng-deep .k-treeview .btn-seperator{width:10px;display:inline-block}.left-icon{margin-right:8px}\n"], components: [{ type: i2$a.TreeViewComponent, selector: "kendo-treeview", inputs: ["filterInputPlaceholder", "expandDisabledNodes", "animate", "nodeTemplate", "loadMoreButtonTemplate", "trackBy", "nodes", "textField", "hasChildren", "isChecked", "isDisabled", "isExpanded", "isSelected", "isVisible", "navigable", "children", "loadOnDemand", "filterable", "filter", "size", "disableParentNodesOnly"], outputs: ["childrenLoaded", "blur", "focus", "expand", "collapse", "nodeDragStart", "nodeDrag", "filterStateChange", "nodeDrop", "nodeDragEnd", "addItem", "removeItem", "checkedChange", "selectionChange", "filterChange", "nodeClick", "nodeDblClick"], exportAs: ["kendoTreeView"] }, { type: i2$1.IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }, { type: i4.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }, { type: i2$1.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { type: i3$5.TextBoxComponent, selector: "kendo-textbox", inputs: ["focusableId", "title", "disabled", "readonly", "tabindex", "value", "selectOnFocus", "showSuccessIcon", "showErrorIcon", "clearButton", "successIcon", "errorIcon", "clearButtonIcon", "size", "rounded", "fillMode", "tabIndex", "placeholder", "maxlength"], outputs: ["valueChange", "inputFocus", "inputBlur", "focus", "blur"], exportAs: ["kendoTextBox"] }, { type: ContextMenuComponent, selector: "app-context-menu", inputs: ["target", "selectedData"] }], directives: [{ type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2$a.ExpandDirective, selector: "[kendoTreeViewExpandable]", inputs: ["isExpanded", "expandBy", "expandOnFilter", "expandedKeys"], outputs: ["expandedKeysChange"] }, { type: i2$a.DragAndDropDirective, selector: "[kendoTreeViewDragAndDrop]", inputs: ["allowCopy", "dropZoneTreeViews", "startDragAfter", "autoScroll"] }, { type: i2$a.DragAndDropEditingDirective, selector: "[kendoTreeViewDragAndDropEditing]", inputs: ["editService"] }, { type: i2$a.HierarchyBindingDirective, selector: "[kendoTreeViewHierarchyBinding]", inputs: ["childrenField", "nodes", "isVisible", "loadOnDemand"] }, { type: i2$a.SelectDirective, selector: "[kendoTreeViewSelectable]", inputs: ["isSelected", "selectBy", "kendoTreeViewSelectable", "selectedKeys"], outputs: ["selectedKeysChange"] }, { type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i7.DefaultClassDirective, selector: " [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl], [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl], [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }, { type: i2$a.CheckDirective, selector: "[kendoTreeViewCheckable]", inputs: ["isChecked", "checkBy", "checkedKeys", "kendoTreeViewCheckable"], outputs: ["checkedKeysChange"] }, { type: i2$a.DisableDirective, selector: "[kendoTreeViewDisable]", inputs: ["isDisabled", "kendoTreeViewDisable", "disabledKeys"] }, { type: i2$a.NodeTemplateDirective, selector: "[kendoTreeViewNodeTemplate]" }, { type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i4$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], pipes: { "htmlSanitize": HtmlSanitizePipe } });
|
|
11812
|
+
ZtreeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.3", type: ZtreeComponent, selector: "app-ztree", viewQueries: [{ propertyName: "nodetemplate", first: true, predicate: ["nodetemplate"], descendants: true, static: true }, { propertyName: "zinput_textboxList", predicate: ["zinput_textbox"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div style=\"width:100%\" [style]=\"componentProperties.style.style\" class=\"e1tag-style\"\r\n *ngIf=\"(!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible)\">\r\n <kendo-treeview [nodes]=\"getItems()\"\r\n kendoTreeViewExpandable\r\n [kendoTreeViewSelectable]=\"selection\"\r\n kendoTreeViewDragAndDrop\r\n kendoTreeViewDragAndDropEditing\r\n [isExpanded]=\"isExpanded\"\r\n (collapse)=\"handleCollapse($event)\"\r\n (expand)=\"handleExpand($event)\"\r\n (nodeDrop)=\"handleNodeDrop($event)\"\r\n (nodeDragEnd)=\"handleNodeDragEnd($event)\"\r\n (selectionChange)=\"onSelectionChange($event)\"\r\n [(selectedKeys)]=\"selectedKeys\"\r\n kendoTreeViewHierarchyBinding\r\n childrenField=\"Value\"\r\n textField=\"Name\"\r\n [selectBy]=\"data.SelectOptions\"\r\n [filterable]=\"data.Filterable\"\r\n (filterChange)=\"handleFilter($event)\"\r\n [style]=\"componentProperties.style.style1\"\r\n class=\"e1tag-style1\"\r\n [ngClass]=\"data.Class\"\r\n [kendoTreeViewCheckable]=\"checkableSettings\"\r\n [checkBy]=\"data.SelectOptions\"\r\n [(checkedKeys)]=\"checkedKeys\"\r\n (checkedChange)=\"onCheckedChange($event)\"\r\n [kendoTreeViewDisable]=\"data.SelectOptions\"\r\n [isChecked]=\"isChecked\"\r\n [(disabledKeys)]=\"disabledCheckBoxKeys\"\r\n [disableParentNodesOnly]=\"data.DisableParentNodesOnly\"\r\n [expandDisabledNodes]=\"data.ExpandDisabledNodes\"\r\n (nodeClick)=\"onNodeClick($event)\">\r\n <ng-template kendoTreeViewNodeTemplate let-dataItem #nodetemplate>\r\n <div class=\"tree-content-container\">\r\n <ion-button *ngIf=\"!!data.OnAddNode && !data.isHideAllAddNode\"\r\n (click)=\"onAddNode($event, dataItem, data, group)\"\r\n style=\"zoom: 0.6; margin: 0 0 0 2px;\"\r\n mat-raised-button\r\n color=\"primary\"\r\n size=\"medium\"\r\n [hidden]=\"!!dataItem.OnAddNodeVisible\"\r\n [style]=\"componentProperties.style.style2\"\r\n class=\"e1tag-style2\">\r\n <fa-icon [icon]=\"'plus'\"></fa-icon>\r\n </ion-button>\r\n <ion-button *ngIf=\"!!data.OnRemoveNode && !data.isHideAllRemoveNode\"\r\n (click)=\"onRemoveNode($event, dataItem, data, group)\"\r\n style=\"zoom: 0.6; margin: 0 0 0 10px;\"\r\n color=\"danger\"\r\n mat-raised-button\r\n size=\"medium\"\r\n [hidden]=\"!!dataItem.OnRemoveNodeVisible\"\r\n [style]=\"componentProperties.style.style3\"\r\n class=\"e1tag-style3\">\r\n <fa-icon [icon]=\"'minus'\"></fa-icon>\r\n </ion-button>\r\n <span class=\"btn-seperator e1tag-style7\" [style]=\"componentProperties.style.style7\"></span>\r\n <span *ngFor=\"let icon of dataItem.IconList\">\r\n <fa-icon class=\"e1tag-style5 left-icon\" [icon]=\"icon\" [style]=\"componentProperties.style.style5\"></fa-icon>\r\n </span>\r\n <ion-label [style]=\"componentProperties.style.style4\" class=\"e1tag-style4\" [ngClass]=\"dataItem.class\" *ngIf=\"!dataItem.z_inputType\">\r\n <div [style]=\"componentProperties.style.style6\" class=\"e1tag-style6\" [innerHTML]=\"getTemplate(dataItem, data, group) | htmlSanitize\"></div>\r\n </ion-label>\r\n <div [style]=\"componentProperties.style.style4\" class=\"e1tag-style4\" [ngClass]=\"dataItem.class\" *ngIf=\"!!dataItem.z_inputType\">\r\n <kendo-textbox\r\n #zinput_textbox\r\n *ngIf=\"dataItem.z_inputType == 'text'\"\r\n class=\"input-field e1tag-style8\"\r\n [id]=\"data.Name + '_' + dataItem.z_inputType + '_' + dataItem.Id\"\r\n [style]=\"componentProperties.style.style8\"\r\n [(ngModel)]=\"dataItem.z_inputValue\">\r\n </kendo-textbox>\r\n </div>\r\n </div>\r\n </ng-template>\r\n </kendo-treeview>\r\n <app-context-menu [data]=\"data\" [group]=\"group\" [form]=\"form\" #dataitemcontextmenu></app-context-menu>\r\n</div>\r\n", styles: [":host ::ng-deep .k-treeview .k-treeview-leaf{width:100%;margin:5px;padding:9px 20px 9px 8px;border-radius:2px;background:rgba(var(--ion-color-primary-rgb),.15);color:var(--ion-color-primary-shade);border:1px solid rgba(var(--ion-color-primary-rgb),1);font-size:13px;cursor:pointer}:host ::ng-deep .k-treeview .k-treeview-leaf.k-selected,:host ::ng-deep .k-treeview .k-treeview-leaf.k-state-selected{width:100%;margin:5px;padding:9px 20px 9px 8px;border-radius:2px;background:rgba(var(--ion-color-primary-rgb),.5);font-size:13px;cursor:pointer}:host ::ng-deep .k-treeview .k-treeview-leaf:hover,:host ::ng-deep .k-treeview .k-treeview-leaf.k-hover .k-treeview-leaf.k-state-hover{width:100%;margin:5px;padding:9px 20px 9px 8px;border-radius:2px;background:rgba(var(--ion-color-primary-rgb),.1);font-size:13px;cursor:pointer}:host ::ng-deep .k-treeview .tree-content-container{display:flex;align-items:center;justify-content:center}:host ::ng-deep .k-treeview .btn-seperator{width:10px;display:inline-block}.left-icon{margin-right:8px}\n"], components: [{ type: i2$b.TreeViewComponent, selector: "kendo-treeview", inputs: ["filterInputPlaceholder", "expandDisabledNodes", "animate", "nodeTemplate", "loadMoreButtonTemplate", "trackBy", "nodes", "textField", "hasChildren", "isChecked", "isDisabled", "isExpanded", "isSelected", "isVisible", "navigable", "children", "loadOnDemand", "filterable", "filter", "size", "disableParentNodesOnly"], outputs: ["childrenLoaded", "blur", "focus", "expand", "collapse", "nodeDragStart", "nodeDrag", "filterStateChange", "nodeDrop", "nodeDragEnd", "addItem", "removeItem", "checkedChange", "selectionChange", "filterChange", "nodeClick", "nodeDblClick"], exportAs: ["kendoTreeView"] }, { type: i2$1.IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }, { type: i4.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }, { type: i2$1.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { type: i3$5.TextBoxComponent, selector: "kendo-textbox", inputs: ["focusableId", "title", "disabled", "readonly", "tabindex", "value", "selectOnFocus", "showSuccessIcon", "showErrorIcon", "clearButton", "successIcon", "errorIcon", "clearButtonIcon", "size", "rounded", "fillMode", "tabIndex", "placeholder", "maxlength"], outputs: ["valueChange", "inputFocus", "inputBlur", "focus", "blur"], exportAs: ["kendoTextBox"] }, { type: ContextMenuComponent, selector: "app-context-menu", inputs: ["target", "selectedData"] }], directives: [{ type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2$b.ExpandDirective, selector: "[kendoTreeViewExpandable]", inputs: ["isExpanded", "expandBy", "expandOnFilter", "expandedKeys"], outputs: ["expandedKeysChange"] }, { type: i2$b.DragAndDropDirective, selector: "[kendoTreeViewDragAndDrop]", inputs: ["allowCopy", "dropZoneTreeViews", "startDragAfter", "autoScroll"] }, { type: i2$b.DragAndDropEditingDirective, selector: "[kendoTreeViewDragAndDropEditing]", inputs: ["editService"] }, { type: i2$b.HierarchyBindingDirective, selector: "[kendoTreeViewHierarchyBinding]", inputs: ["childrenField", "nodes", "isVisible", "loadOnDemand"] }, { type: i2$b.SelectDirective, selector: "[kendoTreeViewSelectable]", inputs: ["isSelected", "selectBy", "kendoTreeViewSelectable", "selectedKeys"], outputs: ["selectedKeysChange"] }, { type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i7.DefaultClassDirective, selector: " [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl], [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl], [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }, { type: i2$b.CheckDirective, selector: "[kendoTreeViewCheckable]", inputs: ["isChecked", "checkBy", "checkedKeys", "kendoTreeViewCheckable"], outputs: ["checkedKeysChange"] }, { type: i2$b.DisableDirective, selector: "[kendoTreeViewDisable]", inputs: ["isDisabled", "kendoTreeViewDisable", "disabledKeys"] }, { type: i2$b.NodeTemplateDirective, selector: "[kendoTreeViewNodeTemplate]" }, { type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i4$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], pipes: { "htmlSanitize": HtmlSanitizePipe } });
|
|
11736
11813
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: ZtreeComponent, decorators: [{
|
|
11737
11814
|
type: Component,
|
|
11738
11815
|
args: [{ selector: "app-ztree", template: "<div style=\"width:100%\" [style]=\"componentProperties.style.style\" class=\"e1tag-style\"\r\n *ngIf=\"(!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible)\">\r\n <kendo-treeview [nodes]=\"getItems()\"\r\n kendoTreeViewExpandable\r\n [kendoTreeViewSelectable]=\"selection\"\r\n kendoTreeViewDragAndDrop\r\n kendoTreeViewDragAndDropEditing\r\n [isExpanded]=\"isExpanded\"\r\n (collapse)=\"handleCollapse($event)\"\r\n (expand)=\"handleExpand($event)\"\r\n (nodeDrop)=\"handleNodeDrop($event)\"\r\n (nodeDragEnd)=\"handleNodeDragEnd($event)\"\r\n (selectionChange)=\"onSelectionChange($event)\"\r\n [(selectedKeys)]=\"selectedKeys\"\r\n kendoTreeViewHierarchyBinding\r\n childrenField=\"Value\"\r\n textField=\"Name\"\r\n [selectBy]=\"data.SelectOptions\"\r\n [filterable]=\"data.Filterable\"\r\n (filterChange)=\"handleFilter($event)\"\r\n [style]=\"componentProperties.style.style1\"\r\n class=\"e1tag-style1\"\r\n [ngClass]=\"data.Class\"\r\n [kendoTreeViewCheckable]=\"checkableSettings\"\r\n [checkBy]=\"data.SelectOptions\"\r\n [(checkedKeys)]=\"checkedKeys\"\r\n (checkedChange)=\"onCheckedChange($event)\"\r\n [kendoTreeViewDisable]=\"data.SelectOptions\"\r\n [isChecked]=\"isChecked\"\r\n [(disabledKeys)]=\"disabledCheckBoxKeys\"\r\n [disableParentNodesOnly]=\"data.DisableParentNodesOnly\"\r\n [expandDisabledNodes]=\"data.ExpandDisabledNodes\"\r\n (nodeClick)=\"onNodeClick($event)\">\r\n <ng-template kendoTreeViewNodeTemplate let-dataItem #nodetemplate>\r\n <div class=\"tree-content-container\">\r\n <ion-button *ngIf=\"!!data.OnAddNode && !data.isHideAllAddNode\"\r\n (click)=\"onAddNode($event, dataItem, data, group)\"\r\n style=\"zoom: 0.6; margin: 0 0 0 2px;\"\r\n mat-raised-button\r\n color=\"primary\"\r\n size=\"medium\"\r\n [hidden]=\"!!dataItem.OnAddNodeVisible\"\r\n [style]=\"componentProperties.style.style2\"\r\n class=\"e1tag-style2\">\r\n <fa-icon [icon]=\"'plus'\"></fa-icon>\r\n </ion-button>\r\n <ion-button *ngIf=\"!!data.OnRemoveNode && !data.isHideAllRemoveNode\"\r\n (click)=\"onRemoveNode($event, dataItem, data, group)\"\r\n style=\"zoom: 0.6; margin: 0 0 0 10px;\"\r\n color=\"danger\"\r\n mat-raised-button\r\n size=\"medium\"\r\n [hidden]=\"!!dataItem.OnRemoveNodeVisible\"\r\n [style]=\"componentProperties.style.style3\"\r\n class=\"e1tag-style3\">\r\n <fa-icon [icon]=\"'minus'\"></fa-icon>\r\n </ion-button>\r\n <span class=\"btn-seperator e1tag-style7\" [style]=\"componentProperties.style.style7\"></span>\r\n <span *ngFor=\"let icon of dataItem.IconList\">\r\n <fa-icon class=\"e1tag-style5 left-icon\" [icon]=\"icon\" [style]=\"componentProperties.style.style5\"></fa-icon>\r\n </span>\r\n <ion-label [style]=\"componentProperties.style.style4\" class=\"e1tag-style4\" [ngClass]=\"dataItem.class\" *ngIf=\"!dataItem.z_inputType\">\r\n <div [style]=\"componentProperties.style.style6\" class=\"e1tag-style6\" [innerHTML]=\"getTemplate(dataItem, data, group) | htmlSanitize\"></div>\r\n </ion-label>\r\n <div [style]=\"componentProperties.style.style4\" class=\"e1tag-style4\" [ngClass]=\"dataItem.class\" *ngIf=\"!!dataItem.z_inputType\">\r\n <kendo-textbox\r\n #zinput_textbox\r\n *ngIf=\"dataItem.z_inputType == 'text'\"\r\n class=\"input-field e1tag-style8\"\r\n [id]=\"data.Name + '_' + dataItem.z_inputType + '_' + dataItem.Id\"\r\n [style]=\"componentProperties.style.style8\"\r\n [(ngModel)]=\"dataItem.z_inputValue\">\r\n </kendo-textbox>\r\n </div>\r\n </div>\r\n </ng-template>\r\n </kendo-treeview>\r\n <app-context-menu [data]=\"data\" [group]=\"group\" [form]=\"form\" #dataitemcontextmenu></app-context-menu>\r\n</div>\r\n", styles: [":host ::ng-deep .k-treeview .k-treeview-leaf{width:100%;margin:5px;padding:9px 20px 9px 8px;border-radius:2px;background:rgba(var(--ion-color-primary-rgb),.15);color:var(--ion-color-primary-shade);border:1px solid rgba(var(--ion-color-primary-rgb),1);font-size:13px;cursor:pointer}:host ::ng-deep .k-treeview .k-treeview-leaf.k-selected,:host ::ng-deep .k-treeview .k-treeview-leaf.k-state-selected{width:100%;margin:5px;padding:9px 20px 9px 8px;border-radius:2px;background:rgba(var(--ion-color-primary-rgb),.5);font-size:13px;cursor:pointer}:host ::ng-deep .k-treeview .k-treeview-leaf:hover,:host ::ng-deep .k-treeview .k-treeview-leaf.k-hover .k-treeview-leaf.k-state-hover{width:100%;margin:5px;padding:9px 20px 9px 8px;border-radius:2px;background:rgba(var(--ion-color-primary-rgb),.1);font-size:13px;cursor:pointer}:host ::ng-deep .k-treeview .tree-content-container{display:flex;align-items:center;justify-content:center}:host ::ng-deep .k-treeview .btn-seperator{width:10px;display:inline-block}.left-icon{margin-right:8px}\n"] }]
|
|
@@ -12284,10 +12361,10 @@ class ZtreelistComponent extends DataListingFieldBase {
|
|
|
12284
12361
|
}
|
|
12285
12362
|
}
|
|
12286
12363
|
ZtreelistComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: ZtreelistComponent, deps: [{ token: ZComponentService }, { token: i2.FieldService }, { token: i2.WebApiService }, { token: i1.ActivatedRoute }, { token: i1.Router }, { token: i2.AuthService }], target: i0.ɵɵFactoryTarget.Component });
|
|
12287
|
-
ZtreelistComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.3", type: ZtreelistComponent, selector: "app-ztreelist", viewQueries: [{ propertyName: "tooltipDir", first: true, predicate: TooltipDirective, descendants: true }], usesInheritance: true, ngImport: i0, template: "<div *ngIf=\"!isLoading && (!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible)\"\r\n class=\"grid-container e1tag-style\" [style]=\"componentProperties.style.style\" [ngClass]=\"data.Class\">\r\n <ng-template #template let-anchor>\r\n <span>{{ anchor.nativeElement.innerText }}</span>\r\n </ng-template>\r\n <div kendoTooltip showOn=\"none\" [tooltipTemplate]=\"template\" filter=\".k-grid td\" (mouseover)=\"showTooltip($event)\" [style]=\"componentProperties.style.style1\" class=\"e1tag-style1\">\r\n <kendo-treelist [kendoTreeListFlatBinding]=\"dataSource\"\r\n kendoTreeListExpandable\r\n [style]=\"componentProperties.style.style2\"\r\n class=\"desktop-grid e1tag-style2\"\r\n [idField]=\"options.idField\"\r\n [parentIdField]=\"options.parentIdField\"\r\n [sortable]=\"options.sortable\"\r\n [resizable]=\"options.resizable\"\r\n [filterable]=\"options.filterable\"\r\n [reorderable]=\"false\"\r\n [columnMenu]=\"options.columnMenu\"\r\n [scrollable]=\"options.scrollable\"\r\n [aggregate]=\"options.aggregate\"\r\n [isExpanded]=\"isExpanded\"\r\n [class.hiden-pager]=\"!options.pageAble\"\r\n (cellClick)=\"cellClickHandler($event)\"\r\n (filterChange)=\"onFilterChange($event)\"\r\n (expand)=\"onExpand($event)\"\r\n (collapse)=\"onCollapse($event)\"\r\n [rowClass]=\"rowCallback.bind(this)\"\r\n [pageable]=\"options.pageAble\"\r\n [pageSize]=\"options.pageSize\">\r\n <ng-template kendoTreeListToolbarTemplate\r\n *ngIf=\"data.AllowRefreshButton || data.AllowExport || data.Title || data.GridButtonFieldName_WF || data.GridButtonFieldName\">\r\n <div class=\"toobar-left-item\">\r\n <fa-icon *ngIf=\"data.Icon\" class=\"gridTitleIcon\" [icon]=\"data.Icon\"></fa-icon>\r\n <kendo-label class=\"gridTitle\">{{data.Title}}</kendo-label>\r\n <button class=\"ion-activatable ripple-parent k-button refresh-btn\" (click)=\"refreshData()\" *ngIf=\"data.AllowRefreshButton\">\r\n <span class=\"k-icon k-i-refresh-sm\"></span>\r\n <ion-ripple-effect></ion-ripple-effect>\r\n </button>\r\n </div>\r\n <div class=\"toolbar-right-item\">\r\n <app-zworkflowbuttons *ngIf=\"gridBtn && gridBtn.Type === 'zworkflowbuttons'\" [data]=\"gridBtn\" [group]=\"group\" [form]=\"form\"></app-zworkflowbuttons>\r\n <app-zbuttons *ngIf=\"gridBtn && gridBtn.Type === 'zbuttons'\" [data]=\"gridBtn\" [group]=\"group\" [form]=\"form\"></app-zbuttons>\r\n <button class=\"ion-activatable ripple-parent k-button\" kendoTreeListExcelCommand\r\n *ngIf=\"data.AllowExport\">\r\n <span class=\"k-icon k-i-download\"></span>\r\n <ion-ripple-effect></ion-ripple-effect>\r\n </button>\r\n </div>\r\n </ng-template>\r\n <!--\r\n [filterable]=\"options.filterable\"\r\n [reorderable]=\"options.resizable\"\r\n -->\r\n <ng-container *ngFor=\"let col of options.columns; index as i\">\r\n <kendo-treelist-column *ngIf=\"!col.command\" [class]=\"col.class\" [expandable]=\"i===0\" [field]=\"col.field\"\r\n [title]=\"col.title || col.field\" [width]=\"col.width || 250\" [filterable]=\"filterable(col.enableFiltering)\"\r\n [sortable]=\"sortable(col.enableSorting)\" [hidden]=\"!isColumnsVisible(col.visible)\" [style]=\"getGridColumnStyle()\" class=\"e1tag-style3\"\r\n [headerStyle]=\"getGridHeaderStyle()\" headerClass=\"e1tag-style4\" [footerStyle]=\"getGridFooterStyle()\" footerClass=\"e1tag-style9\">\r\n <div [ngSwitch]=\"true\">\r\n <div *ngSwitchCase=\"col.fieldType === 'number'\r\n || col.fieldType === 'currency'\r\n || col.fieldType === 'znumeric'\">\r\n <ng-template kendoTreeListFilterCellTemplate let-filter let-column=\"column\">\r\n <kendo-treelist-numeric-filter-cell [showOperators]=\"data.IsShowGridFilterOperator\" [column]=\"column\" [filter]=\"filter\" operator=\"eq\">\r\n <kendo-filter-eq-operator></kendo-filter-eq-operator>\r\n <kendo-filter-neq-operator></kendo-filter-neq-operator>\r\n <kendo-filter-lt-operator></kendo-filter-lt-operator>\r\n <kendo-filter-lte-operator></kendo-filter-lte-operator>\r\n <kendo-filter-gt-operator></kendo-filter-gt-operator>\r\n <kendo-filter-gte-operator></kendo-filter-gte-operator>\r\n <kendo-filter-isnull-operator></kendo-filter-isnull-operator>\r\n <kendo-filter-isnotnull-operator></kendo-filter-isnotnull-operator>\r\n </kendo-treelist-numeric-filter-cell>\r\n </ng-template>\r\n </div>\r\n <div *ngSwitchCase=\"col.fieldType == 'zdate'\r\n || col.fieldType === 'zdatetime'\r\n || col.fieldType === 'zuidatetime'\">\r\n <div *ngIf=\"col.filterByDateRange === true\">\r\n <ng-template kendoTreeListFilterCellTemplate let-filter let-column=\"column\" operator=\"lte\">\r\n <date-range-filter-cell [showOperators]=\"data.IsShowGridFilterOperator\" class=\"date-range-filter\" [filter]=\"filter\" [field]=\"col.field\">\r\n <kendo-treelist-filter-lt-operator></kendo-treelist-filter-lt-operator>\r\n <kendo-treelist-filter-lte-operator></kendo-treelist-filter-lte-operator>\r\n <kendo-treelist-filter-gt-operator></kendo-treelist-filter-gt-operator>\r\n <kendo-treelist-filter-gte-operator></kendo-treelist-filter-gte-operator>\r\n <kendo-treelist-filter-isnull-operator></kendo-treelist-filter-isnull-operator>\r\n <kendo-treelist-filter-isnotnull-operator></kendo-treelist-filter-isnotnull-operator>\r\n </date-range-filter-cell>\r\n </ng-template>\r\n </div>\r\n <div *ngIf=\"col.filterByDateRange === false\">\r\n <ng-template kendoTreeListFilterCellTemplate let-filter let-column=\"column\">\r\n <kendo-treelist-date-filter-cell [showOperators]=\"data.IsShowGridFilterOperator\" [column]=\"column\" [filter]=\"filter\" operator=\"lte\">\r\n <kendo-treelist-filter-lt-operator></kendo-treelist-filter-lt-operator>\r\n <kendo-treelist-filter-lte-operator></kendo-treelist-filter-lte-operator>\r\n <kendo-treelist-filter-gt-operator></kendo-treelist-filter-gt-operator>\r\n <kendo-treelist-filter-gte-operator></kendo-treelist-filter-gte-operator>\r\n <kendo-treelist-filter-isnull-operator></kendo-treelist-filter-isnull-operator>\r\n <kendo-treelist-filter-isnotnull-operator></kendo-treelist-filter-isnotnull-operator>\r\n </kendo-treelist-date-filter-cell>\r\n </ng-template>\r\n </div>\r\n </div>\r\n <div *ngSwitchDefault>\r\n <ng-template kendoTreeListFilterCellTemplate let-filter let-column=\"column\">\r\n <kendo-treelist-string-filter-cell [showOperators]=\"data.IsShowGridFilterOperator\" [column]=\"column\" [filter]=\"filter\" operator=\"contains\">\r\n <kendo-treelist-filter-contains-operator></kendo-treelist-filter-contains-operator>\r\n <kendo-treelist-filter-eq-operator></kendo-treelist-filter-eq-operator>\r\n <kendo-treelist-filter-neq-operator></kendo-treelist-filter-neq-operator>\r\n <kendo-treelist-filter-startswith-operator></kendo-treelist-filter-startswith-operator>\r\n <kendo-treelist-filter-endswith-operator></kendo-treelist-filter-endswith-operator>\r\n <kendo-treelist-filter-isnull-operator></kendo-treelist-filter-isnull-operator>\r\n <kendo-treelist-filter-isnotnull-operator></kendo-treelist-filter-isnotnull-operator>\r\n </kendo-treelist-string-filter-cell>\r\n </ng-template>\r\n </div>\r\n </div>\r\n <ng-template kendoTreeListCellTemplate let-dataItem let-rowIndex=\"rowIndex\" let-cellContext=\"cellContext\">\r\n <div style=\"margin: 7px 0;display: inline;\" [style.color]=\"(!!dataItem.Color ? [dataItem.Color] : 'black')\"\r\n *ngIf=\"!col.navigateTo && col.isEditableInGrid !== true\" [ngSwitch]=\"col.fieldType\"\r\n [ngClass]=\"getColClass(dataItem, col)\">\r\n <span *ngSwitchCase=\"'zdate'\" class=\"grid-cell-data\">\r\n {{ dataItem[col.field] | date: 'dd/MM/yyyy' }}\r\n </span>\r\n <span *ngSwitchCase=\"'zshortdate'\" class=\"grid-cell-data\">\r\n {{ dataItem[col.field] | date: 'MMM yyyy' }}\r\n </span>\r\n <span *ngSwitchCase=\"'zdatetime'\" class=\"grid-cell-data\">\r\n {{ dataItem[col.field] | date: 'dd/MM/yyyy hh:mm:ss aa' }}\r\n </span>\r\n <span *ngSwitchCase=\"'zuidatetime'\" class=\"grid-cell-data\">\r\n {{ dataItem[col.field] | date: 'dd/MM/yyyy hh:mm:ss aa' }}\r\n </span>\r\n <span *ngSwitchCase=\"'number'\" class=\"grid-cell-data\">\r\n <div style=\"text-align:right;\">{{ dataItem[col.field] | number }} </div>\r\n </span>\r\n <span *ngSwitchCase=\"'currency'\" class=\"grid-cell-data\">\r\n <div style=\"text-align:right;\">{{ dataItem[col.field] | number: '1.2-2' }}</div>\r\n </span>\r\n <span *ngSwitchCase=\"'znumeric'\" class=\"grid-cell-data\">\r\n <div style=\"text-align:right;\">{{ dataItem[col.field] | number: getFormat(col) }}</div>\r\n </span>\r\n <span *ngSwitchCase=\"'url'\" style=\"color: blue; cursor: pointer; text-decoration:underline;\" class=\"grid-cell-data\">\r\n {{ dataItem[col.field] }}\r\n </span>\r\n <span *ngSwitchCase=\"'zlabel'\" class=\"grid-cell-data\">\r\n <div class=\"ztree-inline-block e1tag-style10\" [style]=\"componentProperties.style.style10\" [innerHTML]=\"dataItem[col.field] | htmlSanitize\"></div>\r\n </span>\r\n <span *ngSwitchDefault class=\"grid-cell-data\">\r\n {{ dataItem[col.field] }}\r\n </span>\r\n </div>\r\n <div style=\"margin: 7px 0;display: inline;\" [style.color]=\"(!!dataItem.Color ? [dataItem.Color] : 'black')\"\r\n *ngIf=\"!col.navigateTo && col.isEditableInGrid === true && isInlineEditColVisible(dataItem, col)\"\r\n [ngClass]=\"getColClass(dataItem, col)\" [style]=\"componentProperties.style.style5\" class=\"e1tag-style5\">\r\n <app-zinput-container [data]=\"getInlineField(col.field)\" [group]=\"group\"\r\n [form]=\"getInlineForm(dataItem, rowIndex)\" [containerField]=\"containerField\" [style]=\"componentProperties.style.style6\"\r\n class=\"e1tag-style6\">\r\n </app-zinput-container>\r\n </div>\r\n <span *ngIf=\"!!col.navigateTo\" (click)=\"onNavigateTo($event, col, dataItem, dataItem[col.field])\">\r\n <ion-button color=\"light\" size=\"small\">\r\n {{ dataItem[col.field] }}\r\n <!-- <ion-icon slot= \"end\" name=\"arrow-forward\"></ion-icon> -->\r\n <fa-icon slot=\"end\" [icon]=\"'arrow-right'\"></fa-icon>\r\n </ion-button>\r\n </span>\r\n </ng-template>\r\n <ng-template *ngIf=\"col.footerTemplate\" kendoTreeListFooterTemplate let-aggregates=\"aggregates\">\r\n <div *ngIf=\"!col.navigateTo\" [ngSwitch]=\"col.fieldType\" [style]=\"componentProperties.style.style7\"\r\n [ngClass]=\"{'rightAligned': col.fieldType === 'number' || col.fieldType === 'currency'}\" class=\"e1tag-style7\">\r\n <span *ngSwitchCase=\"'number'\">\r\n <b>\r\n {{ col.aggregateTitle | titlecase }} {{ aggregates[col.field][col.aggregateType] | number }}\r\n </b>\r\n </span>\r\n <span *ngSwitchCase=\"'currency'\">\r\n <b>\r\n {{ col.aggregateTitle | titlecase }} {{ aggregates[col.field][col.aggregateType] | number: '1.2-2' }}\r\n </b>\r\n </span>\r\n </div>\r\n </ng-template>\r\n </kendo-treelist-column>\r\n <kendo-treelist-command-column *ngIf=\"!!col.command\" [title]=\"col.title || col.field\"\r\n [width]=\"col.width || 250\" [style]=\"componentProperties.style.style8\" class=\"e1tag-style8\">\r\n <ng-template kendoTreeListCellTemplate let-cellContext=\"cellContext\">\r\n <div [ngClass]=\"col.class\">\r\n <button *ngFor=\"let col2 of col.command; index as i\" type=\"button\"\r\n [kendoTreeListEditCommand]=\"cellContext\" [title]=\"col2.text\" (click)=\"buttonClick(col2, cellContext)\"\r\n [hidden]=\"isButtonHidden(col2, cellContext)\">\r\n <fa-icon [icon]=\"col2.icon\" [style.color]=\"(!!col2.color ? [col2.color] : 'black')\">\r\n </fa-icon>\r\n <div *ngIf=\"col2.ShowLabel === undefined || col2.ShowLabel\">{{col2.text}}</div>\r\n </button>\r\n </div>\r\n </ng-template>\r\n </kendo-treelist-command-column>\r\n </ng-container>\r\n\r\n <!-- <kendo-treelist-command-column width=\"140\">\r\n <ng-template kendoTreeListCellTemplate let-isNew=\"isNew\" let-cellContext=\"cellContext\">\r\n <button [kendoTreeListAddCommand]=\"cellContext\"\r\n icon=\"filter-add-expression\" title=\"Add Child\">\r\n </button>\r\n <button [kendoTreeListCancelCommand]=\"cellContext\"\r\n icon=\"cancel\" title=\"{{ isNew ? 'Discard changes' : 'Cancel' }}\">\r\n </button>\r\n </ng-template>\r\n </kendo-treelist-command-column> -->\r\n </kendo-treelist>\r\n <app-context-menu [data]=\"data\" [group]=\"group\" [form]=\"form\" #dataitemcontextmenu></app-context-menu>\r\n </div>\r\n</div>\r\n", styles: [".grid-container{margin-top:10px}.grid-container.style1{margin:10px;border:1px solid rgba(0,0,0,.08);border-radius:var(--ion-container-border-radius);padding:8px 20px 20px;background:#ffffff}.grid-container.align-with-input{margin:0 25px 0 10px}.rightAligned{text-align:right;display:table!important;margin:0 0 0 auto!important}.centerAligned{text-align:center;display:table!important;margin:0 auto!important}.ztree-inline-block{display:inline-block}\n", ".grid-container.align-with-input{margin:0 25px 0 10px}:host ::ng-deep kendo-treelist.desktop-grid,:host ::ng-deep kendo-grid.desktop-grid{border-width:0px;width:100%;background:transparent}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-content,:host ::ng-deep kendo-grid.desktop-grid .k-grid-content{white-space:nowrap}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar{margin-bottom:15px;padding:5px 0 0;display:flex;flex-direction:row;border:none;background:transparent;border-bottom:1px solid var(--ion-app-seperator-line-color)}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar .k-input,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar .k-picker,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar .k-input,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar .k-picker{width:100%}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item .k-button,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item .k-button,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item .k-button,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item .k-button,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item .k-button,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item .k-button{font-size:calc(var(--button-font-size) - 1px);margin-left:8px;margin-right:2px;border-radius:var(--button-border-radius);background:#fff;border:none;box-shadow:none;padding:5px}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item .k-button.left-buttons,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item .k-button.left-buttons,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item .k-button.left-buttons,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item .k-button.left-buttons,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item .k-button.left-buttons,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item .k-button.left-buttons{margin:auto 0 auto 5px}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item .k-button .k-grid-button,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item .k-button .k-grid-button,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item .k-button .k-grid-button,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item .k-button .k-grid-button,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item .k-button .k-grid-button,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item .k-button .k-grid-button{padding:0 6px}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item .k-button fa-icon,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item .k-button fa-icon,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item .k-button fa-icon,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item .k-button fa-icon,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item .k-button fa-icon,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item .k-button fa-icon{color:var(--ion-color-primary)}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item .k-button .k-icon,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item .k-button .k-icon,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item .k-button .k-icon,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item .k-button .k-icon,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item .k-button .k-icon,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item .k-button .k-icon{font-size:calc(var(--button-font-size) + 8px)}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item .k-button .k-icon-with-text,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item .k-button .k-icon-with-text,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item .k-button .k-icon-with-text,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item .k-button .k-icon-with-text,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item .k-button .k-icon-with-text,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item .k-button .k-icon-with-text{margin-right:2px;font-size:calc(var(--button-font-size) + 2px);padding-bottom:3px}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item .k-button:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item .k-button:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item .k-button:hover,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item .k-button:hover,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item .k-button:hover,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item .k-button:hover{background:rgba(var(--ion-color-primary-rgb),.2)}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container{margin-top:auto;padding-bottom:1px;gap:5px;display:flex}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container.with-grid-title,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container.with-grid-title,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container.with-grid-title,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container.with-grid-title,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container.with-grid-title,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container.with-grid-title{margin-left:10px;border-left:1px solid #c9c9c9;padding-left:8px}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text{height:18px;gap:8px;display:flex;margin:auto}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .k-i-file-excel,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .k-i-file-excel,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .k-i-file-excel,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .k-i-file-excel,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .k-i-file-excel,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .k-i-file-excel{margin-top:-1px;font-size:calc(var(--button-font-size) + 6px)}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .export-to-excel-button-text,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .export-to-excel-button-text,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .export-to-excel-button-text,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .export-to-excel-button-text,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .export-to-excel-button-text,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .export-to-excel-button-text{margin:auto}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container{flex:1 1 100%;border:1px solid var(--ion-app-seperator-line-color);display:grid}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.normal-filter-container,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.normal-filter-container{display:grid;grid-template-columns:80% 20%;width:100%}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons{display:flex;margin:auto 5px auto auto;padding:0 5px;position:relative}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons.filter-field-layout-type2,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons.filter-field-layout-type2{top:12px}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons>ion-button,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons>ion-button{font-size:var(--button-font-size);margin-left:10px;height:calc(var(--input-field-height) + 2px)}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons>ion-button.toggleOn,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons>ion-button.toggleOn{--background: rgba(var(--ion-color-primary-rgb), 15%);--background-hover: rgba(var(--ion-color-primary-rgb), 10%);--color: var(--ion-color-primary);--border-color: var(--ion-color-primary)}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons>ion-button.toggleOff,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons>ion-button.toggleOff{--background: var(--disabled-input-field-backgroundcolor);--border-color: var(--z-placeholder-color);--color: var(--z-placeholder-color);--background-hover: #efefef}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons>ion-button .btn-label,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons>ion-button .btn-label{padding-left:5px}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.adv-filter-container,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.adv-filter-container{margin-top:10px}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.adv-filter-container>.adv-filter-seperator,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.adv-filter-container>.adv-filter-seperator{width:100%;height:calc(var(--content-font-size) - 1px);border-bottom:1px solid var(--ion-color-primary);text-align:center}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.adv-filter-container>.adv-filter-seperator span,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.adv-filter-container>.adv-filter-seperator span{font-size:calc(var(--content-font-size) + 3px);background:#fff;padding:0 20px;color:var(--ion-color-primary);font-weight:600}:host ::ng-deep kendo-treelist.desktop-grid.toolbar-no-border .k-toolbar,:host ::ng-deep kendo-grid.desktop-grid.toolbar-no-border .k-toolbar{margin-bottom:0;border-width:0px}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-aria-root,:host ::ng-deep kendo-grid.desktop-grid .k-grid-aria-root{border:1px solid var(--ion-color-primary);border-radius:5px 5px 0 0}:host ::ng-deep kendo-treelist.desktop-grid.hiden-pager .k-grid-aria-root,:host ::ng-deep kendo-grid.desktop-grid.hiden-pager .k-grid-aria-root{border-radius:5px}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header{font-weight:600;font-size:var(--grid-header-font-size);background:rgba(var(--ion-color-primary-rgb),.25);color:#000}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-cell-inner>.k-link,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-cell-inner>.k-link{padding:12px 12px 8px}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-grid-filter,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-header-column-menu,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-hierarchy-cell .k-icon,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-grid-filter.k-active,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-header-column-menu.k-active,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-hierarchy-cell .k-icon.k-active .k-grid-filter.k-state-active,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-header-column-menu.k-state-active,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-hierarchy-cell .k-icon.k-state-active,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-grid-filter,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-header-column-menu,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-hierarchy-cell .k-icon,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-grid-filter.k-active,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-header-column-menu.k-active,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-hierarchy-cell .k-icon.k-active .k-grid-filter.k-state-active,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-header-column-menu.k-state-active,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-hierarchy-cell .k-icon.k-state-active{color:#000;background:transparent}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-filtercell .k-dropdown .k-dropdown-wrap,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-filtercell .k-dropdowntree .k-dropdown-wrap,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-filtercell .k-dropdown .k-dropdown-wrap,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-filtercell .k-dropdowntree .k-dropdown-wrap{background:var(--ion-color-primary-contrast);color:var(--ion-color-primary-shade)}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-filtercell .k-dropdown .k-button,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-filtercell .k-dropdowntree .k-button,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-filtercell .k-dropdown .k-button,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-filtercell .k-dropdowntree .k-button{color:var(--ion-color-primary-shade)}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-filtercell>.k-filtercell-wrapper>.k-filtercell-operator,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-filtercell>.k-filtercell-wrapper>.k-filtercell-operator{display:flex}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-filtercell>.k-filtercell-wrapper>.k-filtercell-operator>.k-button.k-clear-button-visible,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-filtercell>.k-filtercell-wrapper>.k-filtercell-operator>.k-button.k-clear-button-visible{margin-left:4px}:host ::ng-deep kendo-treelist.desktop-grid tbody>tr,:host ::ng-deep kendo-grid.desktop-grid tbody>tr{background:rgba(var(--ion-color-primary-rgb),.08);font-size:var(--grid-cell-font-size)}:host ::ng-deep kendo-treelist.desktop-grid tbody>tr.k-alt,:host ::ng-deep kendo-grid.desktop-grid tbody>tr.k-alt{background:rgba(var(--ion-color-primary-rgb),.01)}:host ::ng-deep kendo-treelist.desktop-grid tbody>td.k-selected,:host ::ng-deep kendo-treelist.desktop-grid tbody>td.k-selected.k-alt,:host ::ng-deep kendo-treelist.desktop-grid tbody>tr.k-selected>td,:host ::ng-deep kendo-treelist.desktop-grid tbody>tr.k-selected.k-alt>td,:host ::ng-deep kendo-treelist.desktop-grid tbody>td.k-state-selected,:host ::ng-deep kendo-treelist.desktop-grid tbody>td.k-state-selected.k-alt,:host ::ng-deep kendo-treelist.desktop-grid tbody>tr.k-state-selected>td,:host ::ng-deep kendo-treelist.desktop-grid tbody>tr.k-state-selected.k-alt>td,:host ::ng-deep kendo-grid.desktop-grid tbody>td.k-selected,:host ::ng-deep kendo-grid.desktop-grid tbody>td.k-selected.k-alt,:host ::ng-deep kendo-grid.desktop-grid tbody>tr.k-selected>td,:host ::ng-deep kendo-grid.desktop-grid tbody>tr.k-selected.k-alt>td,:host ::ng-deep kendo-grid.desktop-grid tbody>td.k-state-selected,:host ::ng-deep kendo-grid.desktop-grid tbody>td.k-state-selected.k-alt,:host ::ng-deep kendo-grid.desktop-grid tbody>tr.k-state-selected>td,:host ::ng-deep kendo-grid.desktop-grid tbody>tr.k-state-selected.k-alt>td{background:rgba(var(--ion-color-secondary-rgb),.8);color:var(--ion-color-secondary-contrast);font-weight:600}:host ::ng-deep kendo-treelist.desktop-grid tbody>tr:hover,:host ::ng-deep kendo-treelist.desktop-grid tbody>tr.k-hover,:host ::ng-deep kendo-treelist.desktop-grid tbody>tr.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid tbody>tr:hover,:host ::ng-deep kendo-grid.desktop-grid tbody>tr.k-hover,:host ::ng-deep kendo-grid.desktop-grid tbody>tr.k-state-hover{background-color:rgba(var(--ion-color-secondary-rgb),.15)}:host ::ng-deep kendo-treelist.desktop-grid tbody td>.gridCell>span>div>span,:host ::ng-deep kendo-grid.desktop-grid tbody td>.gridCell>span>div>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager{background-color:rgba(var(--ion-color-primary-rgb),.25);color:#000;border:1px solid var(--ion-color-primary);border-top:none;border-radius:0 0 5px 5px;font-size:calc(var(--grid-cell-font-size) - 2px);padding:2px 10px}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link{color:#000;border-radius:5px}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover{color:#fff;background-image:linear-gradient(rgba(var(--ion-color-primary-rgb),.7),rgba(var(--ion-color-primary-rgb),.8))}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-selected,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-selected:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-selected.k-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-selected,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-selected:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-selected.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-selected,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-selected:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-selected.k-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-state-selected,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-state-selected:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-state-selected.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-selected,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-selected:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-selected.k-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-selected,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-selected:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-selected.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-selected,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-selected:hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-selected.k-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-selected,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-selected:hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-selected.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-selected,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-selected:hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-selected.k-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-state-selected,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-state-selected:hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-state-selected.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-selected,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-selected:hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-selected.k-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-selected,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-selected:hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-selected.k-state-hover{color:var(--ion-color-primary);background:var(--ion-color-primary-contrast);font-weight:600}:host ::ng-deep kendo-treelist.desktop-grid.cellWrapText td>.gridCell>span>div>span,:host ::ng-deep kendo-grid.desktop-grid.cellWrapText td>.gridCell>span>div>span{white-space:pre-line}:host ::ng-deep kendo-treelist .cellStyleConditionDefault,:host ::ng-deep kendo-grid .cellStyleConditionDefault{border-radius:5px;text-align:center}:host ::ng-deep kendo-treelist .rightAligned,:host ::ng-deep kendo-grid .rightAligned{text-align:right}:host ::ng-deep kendo-treelist .centerAligned,:host ::ng-deep kendo-grid .centerAligned{text-align:center}.gridTitle{font-size:calc(var(--grid-header-font-size) + 8px);font-weight:700;margin:auto 5px;color:var(--ion-color-dark);padding-top:2px;display:inherit}.gridTitleIcon{color:var(--ion-color-dark);font-size:calc(var(--grid-header-font-size) + 2px);display:block;margin:auto 0;padding-top:2px}.refresh-btn{zoom:.8}.refresh-btn>.k-i-refresh-sm{transform:rotate(30deg);font-size:1.4rem}.toolbar-left-item{flex-grow:1;display:flex}.toolbar-right-item{bottom:2px;position:relative}.gridCell.primary{color:var(--ion-color-primary)}.gridCell.secondary{color:var(--ion-color-dark)}.gridCell.tertiary{color:var(--ion-color-tertiary)}.gridCell.success{color:var(--ion-color-success-shade)}.gridCell.warning{color:var(--ion-color-warning)}.gridCell.danger{color:var(--ion-color-danger)}.gridCell.dark{color:var(--ion-color-dark)}.gridCell.medium{color:var(--ion-color-medium)}.gridCell.light{color:var(--ion-color-light)}.k-i-loading{position:absolute;inset:100px 0 0;font-size:45px;background-color:#ffffff4d;color:#0f4800}\n"], components: [{ type: i4$2.TreeListComponent, selector: "kendo-treelist", inputs: ["aria-label", "data", "pageSize", "height", "rowHeight", "skip", "scrollable", "sort", "trackBy", "filter", "virtualColumns", "filterable", "sortable", "pageable", "navigable", "navigatable", "autoSize", "rowClass", "resizable", "reorderable", "loading", "columnMenu", "hideHeader", "idField", "selectable", "isSelected", "columns", "fetchChildren", "hasChildren", "isExpanded"], outputs: ["selectionChange", "filterChange", "pageChange", "sortChange", "dataStateChange", "edit", "cancel", "save", "remove", "add", "cellClose", "cellClick", "pdfExport", "excelExport", "columnResize", "columnReorder", "columnVisibilityChange", "columnLockedChange", "scrollBottom", "contentScroll", "expand", "collapse", "expandStateChange"], exportAs: ["kendoTreeList"] }, { type: i4.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }, { type: i15.LabelComponent, selector: "kendo-label", inputs: ["text", "for", "optional"], exportAs: ["kendoLabel"] }, { type: i2$1.IonRippleEffect, selector: "ion-ripple-effect", inputs: ["type"] }, { type: ZworkflowbuttonsComponent, selector: "app-zworkflowbuttons" }, { type: ZbuttonsComponent, selector: "app-zbuttons" }, { type: i4$2.ColumnComponent, selector: "kendo-treelist-column", inputs: ["expandable", "field", "format", "sortable", "editor", "filter", "filterable", "editable"] }, { type: i4$2.NumericFilterCellComponent, selector: "kendo-treelist-numeric-filter-cell", inputs: ["filterDelay", "showOperators"] }, { type: i8.EqualFilterOperatorComponent, selector: "kendo-filter-eq-operator" }, { type: i8.NotEqualFilterOperatorComponent, selector: "kendo-filter-neq-operator" }, { type: i8.LessFilterOperatorComponent, selector: "kendo-filter-lt-operator" }, { type: i8.LessOrEqualToFilterOperatorComponent, selector: "kendo-filter-lte-operator" }, { type: i8.GreaterFilterOperatorComponent, selector: "kendo-filter-gt-operator" }, { type: i8.GreaterOrEqualToFilterOperatorComponent, selector: "kendo-filter-gte-operator" }, { type: i8.IsNullFilterOperatorComponent, selector: "kendo-filter-isnull-operator" }, { type: i8.IsNotNullFilterOperatorComponent, selector: "kendo-filter-isnotnull-operator" }, { type: DateRangeFilterCellComponent, selector: "date-range-filter-cell", inputs: ["filter", "field", "data"] }, { type: i4$2.LessFilterOperatorComponent, selector: "kendo-treelist-filter-lt-operator" }, { type: i4$2.LessOrEqualToFilterOperatorComponent, selector: "kendo-treelist-filter-lte-operator" }, { type: i4$2.GreaterFilterOperatorComponent, selector: "kendo-treelist-filter-gt-operator" }, { type: i4$2.GreaterOrEqualToFilterOperatorComponent, selector: "kendo-treelist-filter-gte-operator" }, { type: i4$2.IsNullFilterOperatorComponent, selector: "kendo-treelist-filter-isnull-operator" }, { type: i4$2.IsNotNullFilterOperatorComponent, selector: "kendo-treelist-filter-isnotnull-operator" }, { type: i4$2.DateFilterCellComponent, selector: "kendo-treelist-date-filter-cell", inputs: ["showOperators"] }, { type: i4$2.StringFilterCellComponent, selector: "kendo-treelist-string-filter-cell", inputs: ["filterDelay", "showOperators"] }, { type: i4$2.ContainsFilterOperatorComponent, selector: "kendo-treelist-filter-contains-operator" }, { type: i4$2.EqualFilterOperatorComponent, selector: "kendo-treelist-filter-eq-operator" }, { type: i4$2.NotEqualFilterOperatorComponent, selector: "kendo-treelist-filter-neq-operator" }, { type: i4$2.StartsWithFilterOperatorComponent, selector: "kendo-treelist-filter-startswith-operator" }, { type: i4$2.EndsWithFilterOperatorComponent, selector: "kendo-treelist-filter-endswith-operator" }, { type: ZInputContainerComponent, selector: "app-zinput-container" }, { type: i2$1.IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }, { type: i4$2.CommandColumnComponent, selector: "kendo-treelist-command-column" }, { type: ContextMenuComponent, selector: "app-context-menu", inputs: ["target", "selectedData"] }], directives: [{ type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i7.DefaultClassDirective, selector: " [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl], [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl], [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }, { type: i7$2.TooltipDirective, selector: "[kendoTooltip]", inputs: ["filter", "position", "titleTemplate", "showOn", "showAfter", "callout", "closable", "offset", "tooltipWidth", "tooltipHeight", "tooltipClass", "collision", "closeTitle", "tooltipTemplate"], exportAs: ["kendoTooltip"] }, { type: i4$2.ExpandableDirective, selector: "[kendoTreeListExpandable]", inputs: ["expandedKeys", "initiallyExpanded", "expandBy"], outputs: ["expandedKeysChange"], exportAs: ["kendoTreeListExpandable"] }, { type: i4$2.FlatBindingDirective, selector: "[kendoTreeListFlatBinding]", inputs: ["parentIdField", "idField", "kendoTreeListFlatBinding"], exportAs: ["kendoTreeListFlatBinding"] }, { type: i4$2.ToolbarTemplateDirective, selector: "[kendoTreeListToolbarTemplate]", inputs: ["position"] }, { type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i5.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i5.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i4$2.FilterCellTemplateDirective, selector: "[kendoTreeListFilterCellTemplate]" }, { type: i5.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { type: i4$2.CellTemplateDirective, selector: "[kendoTreeListCellTemplate]" }, { type: i4$2.FooterTemplateDirective, selector: "[kendoTreeListFooterTemplate]" }, { type: i4$2.FocusableDirective, selector: "[kendoTreeListFocusable], [kendoTreeListAddCommand], [kendoTreeListEditCommand], [kendoTreeListRemoveCommand], [kendoTreeListSaveCommand], [kendoTreeListCancelCommand] ", inputs: ["kendoTreeListFocusable", "kendoTreeListAddCommand", "kendoTreeListEditCommand", "kendoTreeListRemoveCommand", "kendoTreeListSaveCommand", "kendoTreeListCancelCommand"] }, { type: i4$2.EditCommandDirective, selector: "[kendoTreeListEditCommand]", inputs: ["kendoTreeListEditCommand"] }], pipes: { "date": i5.DatePipe, "number": i5.DecimalPipe, "htmlSanitize": HtmlSanitizePipe, "titlecase": i5.TitleCasePipe } });
|
|
12364
|
+
ZtreelistComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.3", type: ZtreelistComponent, selector: "app-ztreelist", viewQueries: [{ propertyName: "tooltipDir", first: true, predicate: TooltipDirective, descendants: true }], usesInheritance: true, ngImport: i0, template: "<div *ngIf=\"!isLoading && (!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible)\"\r\n class=\"grid-container e1tag-style\" [style]=\"componentProperties.style.style\" [ngClass]=\"data.Class\">\r\n <ng-template #template let-anchor>\r\n <span>{{ anchor.nativeElement.innerText }}</span>\r\n </ng-template>\r\n <div kendoTooltip showOn=\"none\" [tooltipTemplate]=\"template\" filter=\".k-grid td\" (mouseover)=\"showTooltip($event)\" [style]=\"componentProperties.style.style1\" class=\"e1tag-style1\">\r\n <kendo-treelist [kendoTreeListFlatBinding]=\"dataSource\"\r\n kendoTreeListExpandable\r\n [style]=\"componentProperties.style.style2\"\r\n class=\"desktop-grid e1tag-style2\"\r\n [idField]=\"options.idField\"\r\n [parentIdField]=\"options.parentIdField\"\r\n [sortable]=\"options.sortable\"\r\n [resizable]=\"options.resizable\"\r\n [filterable]=\"options.filterable\"\r\n [reorderable]=\"false\"\r\n [columnMenu]=\"options.columnMenu\"\r\n [scrollable]=\"options.scrollable\"\r\n [aggregate]=\"options.aggregate\"\r\n [isExpanded]=\"isExpanded\"\r\n [class.hiden-pager]=\"!options.pageAble\"\r\n (cellClick)=\"cellClickHandler($event)\"\r\n (filterChange)=\"onFilterChange($event)\"\r\n (expand)=\"onExpand($event)\"\r\n (collapse)=\"onCollapse($event)\"\r\n [rowClass]=\"rowCallback.bind(this)\"\r\n [pageable]=\"options.pageAble\"\r\n [pageSize]=\"options.pageSize\">\r\n <ng-template kendoTreeListToolbarTemplate\r\n *ngIf=\"data.AllowRefreshButton || data.AllowExport || data.Title || data.GridButtonFieldName_WF || data.GridButtonFieldName\">\r\n <div class=\"toobar-left-item\">\r\n <fa-icon *ngIf=\"data.Icon\" class=\"gridTitleIcon\" [icon]=\"data.Icon\"></fa-icon>\r\n <kendo-label class=\"gridTitle\">{{data.Title}}</kendo-label>\r\n <button class=\"ion-activatable ripple-parent k-button refresh-btn\" (click)=\"refreshData()\" *ngIf=\"data.AllowRefreshButton\">\r\n <span class=\"k-icon k-i-refresh-sm\"></span>\r\n <ion-ripple-effect></ion-ripple-effect>\r\n </button>\r\n </div>\r\n <div class=\"toolbar-right-item\">\r\n <app-zworkflowbuttons *ngIf=\"gridBtn && gridBtn.Type === 'zworkflowbuttons'\" [data]=\"gridBtn\" [group]=\"group\" [form]=\"form\"></app-zworkflowbuttons>\r\n <app-zbuttons *ngIf=\"gridBtn && gridBtn.Type === 'zbuttons'\" [data]=\"gridBtn\" [group]=\"group\" [form]=\"form\"></app-zbuttons>\r\n <button class=\"ion-activatable ripple-parent k-button\" kendoTreeListExcelCommand\r\n *ngIf=\"data.AllowExport\">\r\n <span class=\"k-icon k-i-download\"></span>\r\n <ion-ripple-effect></ion-ripple-effect>\r\n </button>\r\n </div>\r\n </ng-template>\r\n <!--\r\n [filterable]=\"options.filterable\"\r\n [reorderable]=\"options.resizable\"\r\n -->\r\n <ng-container *ngFor=\"let col of options.columns; index as i\">\r\n <kendo-treelist-column *ngIf=\"!col.command\" [class]=\"col.class\" [expandable]=\"i===0\" [field]=\"col.field\"\r\n [title]=\"col.title || col.field\" [width]=\"col.width || 250\" [filterable]=\"filterable(col.enableFiltering)\"\r\n [sortable]=\"sortable(col.enableSorting)\" [hidden]=\"!isColumnsVisible(col.visible)\" [style]=\"getGridColumnStyle()\" class=\"e1tag-style3\"\r\n [headerStyle]=\"getGridHeaderStyle()\" headerClass=\"e1tag-style4\" [footerStyle]=\"getGridFooterStyle()\" footerClass=\"e1tag-style9\">\r\n <div [ngSwitch]=\"true\">\r\n <div *ngSwitchCase=\"col.fieldType === 'number'\r\n || col.fieldType === 'currency'\r\n || col.fieldType === 'znumeric'\">\r\n <ng-template kendoTreeListFilterCellTemplate let-filter let-column=\"column\">\r\n <kendo-treelist-numeric-filter-cell [showOperators]=\"data.IsShowGridFilterOperator\" [column]=\"column\" [filter]=\"filter\" operator=\"eq\">\r\n <kendo-filter-eq-operator></kendo-filter-eq-operator>\r\n <kendo-filter-neq-operator></kendo-filter-neq-operator>\r\n <kendo-filter-lt-operator></kendo-filter-lt-operator>\r\n <kendo-filter-lte-operator></kendo-filter-lte-operator>\r\n <kendo-filter-gt-operator></kendo-filter-gt-operator>\r\n <kendo-filter-gte-operator></kendo-filter-gte-operator>\r\n <kendo-filter-isnull-operator></kendo-filter-isnull-operator>\r\n <kendo-filter-isnotnull-operator></kendo-filter-isnotnull-operator>\r\n </kendo-treelist-numeric-filter-cell>\r\n </ng-template>\r\n </div>\r\n <div *ngSwitchCase=\"col.fieldType == 'zdate'\r\n || col.fieldType === 'zdatetime'\r\n || col.fieldType === 'zuidatetime'\">\r\n <div *ngIf=\"col.filterByDateRange === true\">\r\n <ng-template kendoTreeListFilterCellTemplate let-filter let-column=\"column\" operator=\"lte\">\r\n <date-range-filter-cell [showOperators]=\"data.IsShowGridFilterOperator\" class=\"date-range-filter\" [filter]=\"filter\" [field]=\"col.field\">\r\n <kendo-treelist-filter-lt-operator></kendo-treelist-filter-lt-operator>\r\n <kendo-treelist-filter-lte-operator></kendo-treelist-filter-lte-operator>\r\n <kendo-treelist-filter-gt-operator></kendo-treelist-filter-gt-operator>\r\n <kendo-treelist-filter-gte-operator></kendo-treelist-filter-gte-operator>\r\n <kendo-treelist-filter-isnull-operator></kendo-treelist-filter-isnull-operator>\r\n <kendo-treelist-filter-isnotnull-operator></kendo-treelist-filter-isnotnull-operator>\r\n </date-range-filter-cell>\r\n </ng-template>\r\n </div>\r\n <div *ngIf=\"col.filterByDateRange === false\">\r\n <ng-template kendoTreeListFilterCellTemplate let-filter let-column=\"column\">\r\n <kendo-treelist-date-filter-cell [showOperators]=\"data.IsShowGridFilterOperator\" [column]=\"column\" [filter]=\"filter\" operator=\"lte\">\r\n <kendo-treelist-filter-lt-operator></kendo-treelist-filter-lt-operator>\r\n <kendo-treelist-filter-lte-operator></kendo-treelist-filter-lte-operator>\r\n <kendo-treelist-filter-gt-operator></kendo-treelist-filter-gt-operator>\r\n <kendo-treelist-filter-gte-operator></kendo-treelist-filter-gte-operator>\r\n <kendo-treelist-filter-isnull-operator></kendo-treelist-filter-isnull-operator>\r\n <kendo-treelist-filter-isnotnull-operator></kendo-treelist-filter-isnotnull-operator>\r\n </kendo-treelist-date-filter-cell>\r\n </ng-template>\r\n </div>\r\n </div>\r\n <div *ngSwitchDefault>\r\n <ng-template kendoTreeListFilterCellTemplate let-filter let-column=\"column\">\r\n <kendo-treelist-string-filter-cell [showOperators]=\"data.IsShowGridFilterOperator\" [column]=\"column\" [filter]=\"filter\" operator=\"contains\">\r\n <kendo-treelist-filter-contains-operator></kendo-treelist-filter-contains-operator>\r\n <kendo-treelist-filter-eq-operator></kendo-treelist-filter-eq-operator>\r\n <kendo-treelist-filter-neq-operator></kendo-treelist-filter-neq-operator>\r\n <kendo-treelist-filter-startswith-operator></kendo-treelist-filter-startswith-operator>\r\n <kendo-treelist-filter-endswith-operator></kendo-treelist-filter-endswith-operator>\r\n <kendo-treelist-filter-isnull-operator></kendo-treelist-filter-isnull-operator>\r\n <kendo-treelist-filter-isnotnull-operator></kendo-treelist-filter-isnotnull-operator>\r\n </kendo-treelist-string-filter-cell>\r\n </ng-template>\r\n </div>\r\n </div>\r\n <ng-template kendoTreeListCellTemplate let-dataItem let-rowIndex=\"rowIndex\" let-cellContext=\"cellContext\">\r\n <div style=\"margin: 7px 0;display: inline;\" [style.color]=\"(!!dataItem.Color ? [dataItem.Color] : 'black')\"\r\n *ngIf=\"!col.navigateTo && col.isEditableInGrid !== true\" [ngSwitch]=\"col.fieldType\"\r\n [ngClass]=\"getColClass(dataItem, col)\">\r\n <span *ngSwitchCase=\"'zdate'\" class=\"grid-cell-data\">\r\n {{ dataItem[col.field] | date: 'dd/MM/yyyy' }}\r\n </span>\r\n <span *ngSwitchCase=\"'zshortdate'\" class=\"grid-cell-data\">\r\n {{ dataItem[col.field] | date: 'MMM yyyy' }}\r\n </span>\r\n <span *ngSwitchCase=\"'zdatetime'\" class=\"grid-cell-data\">\r\n {{ dataItem[col.field] | date: 'dd/MM/yyyy hh:mm:ss aa' }}\r\n </span>\r\n <span *ngSwitchCase=\"'zuidatetime'\" class=\"grid-cell-data\">\r\n {{ dataItem[col.field] | date: 'dd/MM/yyyy hh:mm:ss aa' }}\r\n </span>\r\n <span *ngSwitchCase=\"'sfdatetimepicker'\" class=\"grid-cell-data\">\r\n {{ dataItem[col.field] | date: 'dd/MM/yyyy hh:mm:ss aa' }}\r\n </span>\r\n <span *ngSwitchCase=\"'number'\" class=\"grid-cell-data\">\r\n <div style=\"text-align:right;\">{{ dataItem[col.field] | number }} </div>\r\n </span>\r\n <span *ngSwitchCase=\"'currency'\" class=\"grid-cell-data\">\r\n <div style=\"text-align:right;\">{{ dataItem[col.field] | number: '1.2-2' }}</div>\r\n </span>\r\n <span *ngSwitchCase=\"'znumeric'\" class=\"grid-cell-data\">\r\n <div style=\"text-align:right;\">{{ dataItem[col.field] | number: getFormat(col) }}</div>\r\n </span>\r\n <span *ngSwitchCase=\"'url'\" style=\"color: blue; cursor: pointer; text-decoration:underline;\" class=\"grid-cell-data\">\r\n {{ dataItem[col.field] }}\r\n </span>\r\n <span *ngSwitchCase=\"'zlabel'\" class=\"grid-cell-data\">\r\n <div class=\"ztree-inline-block e1tag-style10\" [style]=\"componentProperties.style.style10\" [innerHTML]=\"dataItem[col.field] | htmlSanitize\"></div>\r\n </span>\r\n <span *ngSwitchDefault class=\"grid-cell-data\">\r\n {{ dataItem[col.field] }}\r\n </span>\r\n </div>\r\n <div style=\"margin: 7px 0;display: inline;\" [style.color]=\"(!!dataItem.Color ? [dataItem.Color] : 'black')\"\r\n *ngIf=\"!col.navigateTo && col.isEditableInGrid === true && isInlineEditColVisible(dataItem, col)\"\r\n [ngClass]=\"getColClass(dataItem, col)\" [style]=\"componentProperties.style.style5\" class=\"e1tag-style5\">\r\n <app-zinput-container [data]=\"getInlineField(col.field)\" [group]=\"group\"\r\n [form]=\"getInlineForm(dataItem, rowIndex)\" [containerField]=\"containerField\" [style]=\"componentProperties.style.style6\"\r\n class=\"e1tag-style6\">\r\n </app-zinput-container>\r\n </div>\r\n <span *ngIf=\"!!col.navigateTo\" (click)=\"onNavigateTo($event, col, dataItem, dataItem[col.field])\">\r\n <ion-button color=\"light\" size=\"small\">\r\n {{ dataItem[col.field] }}\r\n <!-- <ion-icon slot= \"end\" name=\"arrow-forward\"></ion-icon> -->\r\n <fa-icon slot=\"end\" [icon]=\"'arrow-right'\"></fa-icon>\r\n </ion-button>\r\n </span>\r\n </ng-template>\r\n <ng-template *ngIf=\"col.footerTemplate\" kendoTreeListFooterTemplate let-aggregates=\"aggregates\">\r\n <div *ngIf=\"!col.navigateTo\" [ngSwitch]=\"col.fieldType\" [style]=\"componentProperties.style.style7\"\r\n [ngClass]=\"{'rightAligned': col.fieldType === 'number' || col.fieldType === 'currency'}\" class=\"e1tag-style7\">\r\n <span *ngSwitchCase=\"'number'\">\r\n <b>\r\n {{ col.aggregateTitle | titlecase }} {{ aggregates[col.field][col.aggregateType] | number }}\r\n </b>\r\n </span>\r\n <span *ngSwitchCase=\"'currency'\">\r\n <b>\r\n {{ col.aggregateTitle | titlecase }} {{ aggregates[col.field][col.aggregateType] | number: '1.2-2' }}\r\n </b>\r\n </span>\r\n </div>\r\n </ng-template>\r\n </kendo-treelist-column>\r\n <kendo-treelist-command-column *ngIf=\"!!col.command\" [title]=\"col.title || col.field\"\r\n [width]=\"col.width || 250\" [style]=\"componentProperties.style.style8\" class=\"e1tag-style8\">\r\n <ng-template kendoTreeListCellTemplate let-cellContext=\"cellContext\">\r\n <div [ngClass]=\"col.class\">\r\n <button *ngFor=\"let col2 of col.command; index as i\" type=\"button\"\r\n [kendoTreeListEditCommand]=\"cellContext\" [title]=\"col2.text\" (click)=\"buttonClick(col2, cellContext)\"\r\n [hidden]=\"isButtonHidden(col2, cellContext)\">\r\n <fa-icon [icon]=\"col2.icon\" [style.color]=\"(!!col2.color ? [col2.color] : 'black')\">\r\n </fa-icon>\r\n <div *ngIf=\"col2.ShowLabel === undefined || col2.ShowLabel\">{{col2.text}}</div>\r\n </button>\r\n </div>\r\n </ng-template>\r\n </kendo-treelist-command-column>\r\n </ng-container>\r\n\r\n <!-- <kendo-treelist-command-column width=\"140\">\r\n <ng-template kendoTreeListCellTemplate let-isNew=\"isNew\" let-cellContext=\"cellContext\">\r\n <button [kendoTreeListAddCommand]=\"cellContext\"\r\n icon=\"filter-add-expression\" title=\"Add Child\">\r\n </button>\r\n <button [kendoTreeListCancelCommand]=\"cellContext\"\r\n icon=\"cancel\" title=\"{{ isNew ? 'Discard changes' : 'Cancel' }}\">\r\n </button>\r\n </ng-template>\r\n </kendo-treelist-command-column> -->\r\n </kendo-treelist>\r\n <app-context-menu [data]=\"data\" [group]=\"group\" [form]=\"form\" #dataitemcontextmenu></app-context-menu>\r\n </div>\r\n</div>\r\n", styles: [".grid-container{margin-top:10px}.grid-container.style1{margin:10px;border:1px solid rgba(0,0,0,.08);border-radius:var(--ion-container-border-radius);padding:8px 20px 20px;background:#ffffff}.grid-container.align-with-input{margin:0 25px 0 10px}.rightAligned{text-align:right;display:table!important;margin:0 0 0 auto!important}.centerAligned{text-align:center;display:table!important;margin:0 auto!important}.ztree-inline-block{display:inline-block}\n", ".grid-container.align-with-input{margin:0 25px 0 10px}:host ::ng-deep kendo-treelist.desktop-grid,:host ::ng-deep kendo-grid.desktop-grid{border-width:0px;width:100%;background:transparent}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-content,:host ::ng-deep kendo-grid.desktop-grid .k-grid-content{white-space:nowrap}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar{margin-bottom:15px;padding:5px 0 0;display:flex;flex-direction:row;border:none;background:transparent;border-bottom:1px solid var(--ion-app-seperator-line-color)}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar .k-input,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar .k-picker,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar .k-input,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar .k-picker{width:100%}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item .k-button,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item .k-button,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item .k-button,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item .k-button,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item .k-button,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item .k-button{font-size:calc(var(--button-font-size) - 1px);margin-left:8px;margin-right:2px;border-radius:var(--button-border-radius);background:#fff;border:none;box-shadow:none;padding:5px}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item .k-button.left-buttons,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item .k-button.left-buttons,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item .k-button.left-buttons,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item .k-button.left-buttons,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item .k-button.left-buttons,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item .k-button.left-buttons{margin:auto 0 auto 5px}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item .k-button .k-grid-button,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item .k-button .k-grid-button,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item .k-button .k-grid-button,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item .k-button .k-grid-button,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item .k-button .k-grid-button,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item .k-button .k-grid-button{padding:0 6px}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item .k-button fa-icon,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item .k-button fa-icon,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item .k-button fa-icon,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item .k-button fa-icon,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item .k-button fa-icon,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item .k-button fa-icon{color:var(--ion-color-primary)}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item .k-button .k-icon,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item .k-button .k-icon,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item .k-button .k-icon,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item .k-button .k-icon,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item .k-button .k-icon,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item .k-button .k-icon{font-size:calc(var(--button-font-size) + 8px)}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item .k-button .k-icon-with-text,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item .k-button .k-icon-with-text,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item .k-button .k-icon-with-text,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item .k-button .k-icon-with-text,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item .k-button .k-icon-with-text,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item .k-button .k-icon-with-text{margin-right:2px;font-size:calc(var(--button-font-size) + 2px);padding-bottom:3px}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item .k-button:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item .k-button:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item .k-button:hover,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item .k-button:hover,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item .k-button:hover,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item .k-button:hover{background:rgba(var(--ion-color-primary-rgb),.2)}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container{margin-top:auto;padding-bottom:1px;gap:5px;display:flex}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container.with-grid-title,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container.with-grid-title,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container.with-grid-title,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container.with-grid-title,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container.with-grid-title,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container.with-grid-title{margin-left:10px;border-left:1px solid #c9c9c9;padding-left:8px}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text{height:18px;gap:8px;display:flex;margin:auto}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .k-i-file-excel,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .k-i-file-excel,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .k-i-file-excel,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .k-i-file-excel,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .k-i-file-excel,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .k-i-file-excel{margin-top:-1px;font-size:calc(var(--button-font-size) + 6px)}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .export-to-excel-button-text,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .export-to-excel-button-text,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .export-to-excel-button-text,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .export-to-excel-button-text,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .export-to-excel-button-text,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .export-to-excel-button-text{margin:auto}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container{flex:1 1 100%;border:1px solid var(--ion-app-seperator-line-color);display:grid}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.normal-filter-container,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.normal-filter-container{display:grid;grid-template-columns:80% 20%;width:100%}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons{display:flex;margin:auto 5px auto auto;padding:0 5px;position:relative}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons.filter-field-layout-type2,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons.filter-field-layout-type2{top:12px}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons>ion-button,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons>ion-button{font-size:var(--button-font-size);margin-left:10px;height:calc(var(--input-field-height) + 2px)}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons>ion-button.toggleOn,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons>ion-button.toggleOn{--background: rgba(var(--ion-color-primary-rgb), 15%);--background-hover: rgba(var(--ion-color-primary-rgb), 10%);--color: var(--ion-color-primary);--border-color: var(--ion-color-primary)}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons>ion-button.toggleOff,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons>ion-button.toggleOff{--background: var(--disabled-input-field-backgroundcolor);--border-color: var(--z-placeholder-color);--color: var(--z-placeholder-color);--background-hover: #efefef}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons>ion-button .btn-label,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons>ion-button .btn-label{padding-left:5px}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.adv-filter-container,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.adv-filter-container{margin-top:10px}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.adv-filter-container>.adv-filter-seperator,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.adv-filter-container>.adv-filter-seperator{width:100%;height:calc(var(--content-font-size) - 1px);border-bottom:1px solid var(--ion-color-primary);text-align:center}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.adv-filter-container>.adv-filter-seperator span,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.adv-filter-container>.adv-filter-seperator span{font-size:calc(var(--content-font-size) + 3px);background:#fff;padding:0 20px;color:var(--ion-color-primary);font-weight:600}:host ::ng-deep kendo-treelist.desktop-grid.toolbar-no-border .k-toolbar,:host ::ng-deep kendo-grid.desktop-grid.toolbar-no-border .k-toolbar{margin-bottom:0;border-width:0px}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-aria-root,:host ::ng-deep kendo-grid.desktop-grid .k-grid-aria-root{border:1px solid var(--ion-color-primary);border-radius:5px 5px 0 0}:host ::ng-deep kendo-treelist.desktop-grid.hiden-pager .k-grid-aria-root,:host ::ng-deep kendo-grid.desktop-grid.hiden-pager .k-grid-aria-root{border-radius:5px}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header{font-weight:600;font-size:var(--grid-header-font-size);background:rgba(var(--ion-color-primary-rgb),.25);color:#000}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-cell-inner>.k-link,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-cell-inner>.k-link{padding:12px 12px 8px}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-grid-filter,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-header-column-menu,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-hierarchy-cell .k-icon,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-grid-filter.k-active,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-header-column-menu.k-active,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-hierarchy-cell .k-icon.k-active .k-grid-filter.k-state-active,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-header-column-menu.k-state-active,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-hierarchy-cell .k-icon.k-state-active,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-grid-filter,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-header-column-menu,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-hierarchy-cell .k-icon,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-grid-filter.k-active,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-header-column-menu.k-active,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-hierarchy-cell .k-icon.k-active .k-grid-filter.k-state-active,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-header-column-menu.k-state-active,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-hierarchy-cell .k-icon.k-state-active{color:#000;background:transparent}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-filtercell .k-dropdown .k-dropdown-wrap,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-filtercell .k-dropdowntree .k-dropdown-wrap,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-filtercell .k-dropdown .k-dropdown-wrap,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-filtercell .k-dropdowntree .k-dropdown-wrap{background:var(--ion-color-primary-contrast);color:var(--ion-color-primary-shade)}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-filtercell .k-dropdown .k-button,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-filtercell .k-dropdowntree .k-button,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-filtercell .k-dropdown .k-button,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-filtercell .k-dropdowntree .k-button{color:var(--ion-color-primary-shade)}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-filtercell>.k-filtercell-wrapper>.k-filtercell-operator,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-filtercell>.k-filtercell-wrapper>.k-filtercell-operator{display:flex}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-filtercell>.k-filtercell-wrapper>.k-filtercell-operator>.k-button.k-clear-button-visible,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-filtercell>.k-filtercell-wrapper>.k-filtercell-operator>.k-button.k-clear-button-visible{margin-left:4px}:host ::ng-deep kendo-treelist.desktop-grid tbody>tr,:host ::ng-deep kendo-grid.desktop-grid tbody>tr{background:rgba(var(--ion-color-primary-rgb),.08);font-size:var(--grid-cell-font-size)}:host ::ng-deep kendo-treelist.desktop-grid tbody>tr.k-alt,:host ::ng-deep kendo-grid.desktop-grid tbody>tr.k-alt{background:rgba(var(--ion-color-primary-rgb),.01)}:host ::ng-deep kendo-treelist.desktop-grid tbody>td.k-selected,:host ::ng-deep kendo-treelist.desktop-grid tbody>td.k-selected.k-alt,:host ::ng-deep kendo-treelist.desktop-grid tbody>tr.k-selected>td,:host ::ng-deep kendo-treelist.desktop-grid tbody>tr.k-selected.k-alt>td,:host ::ng-deep kendo-treelist.desktop-grid tbody>td.k-state-selected,:host ::ng-deep kendo-treelist.desktop-grid tbody>td.k-state-selected.k-alt,:host ::ng-deep kendo-treelist.desktop-grid tbody>tr.k-state-selected>td,:host ::ng-deep kendo-treelist.desktop-grid tbody>tr.k-state-selected.k-alt>td,:host ::ng-deep kendo-grid.desktop-grid tbody>td.k-selected,:host ::ng-deep kendo-grid.desktop-grid tbody>td.k-selected.k-alt,:host ::ng-deep kendo-grid.desktop-grid tbody>tr.k-selected>td,:host ::ng-deep kendo-grid.desktop-grid tbody>tr.k-selected.k-alt>td,:host ::ng-deep kendo-grid.desktop-grid tbody>td.k-state-selected,:host ::ng-deep kendo-grid.desktop-grid tbody>td.k-state-selected.k-alt,:host ::ng-deep kendo-grid.desktop-grid tbody>tr.k-state-selected>td,:host ::ng-deep kendo-grid.desktop-grid tbody>tr.k-state-selected.k-alt>td{background:rgba(var(--ion-color-secondary-rgb),.8);color:var(--ion-color-secondary-contrast);font-weight:600}:host ::ng-deep kendo-treelist.desktop-grid tbody>tr:hover,:host ::ng-deep kendo-treelist.desktop-grid tbody>tr.k-hover,:host ::ng-deep kendo-treelist.desktop-grid tbody>tr.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid tbody>tr:hover,:host ::ng-deep kendo-grid.desktop-grid tbody>tr.k-hover,:host ::ng-deep kendo-grid.desktop-grid tbody>tr.k-state-hover{background-color:rgba(var(--ion-color-secondary-rgb),.15)}:host ::ng-deep kendo-treelist.desktop-grid tbody td>.gridCell>span>div>span,:host ::ng-deep kendo-grid.desktop-grid tbody td>.gridCell>span>div>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager{background-color:rgba(var(--ion-color-primary-rgb),.25);color:#000;border:1px solid var(--ion-color-primary);border-top:none;border-radius:0 0 5px 5px;font-size:calc(var(--grid-cell-font-size) - 2px);padding:2px 10px}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link{color:#000;border-radius:5px}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover{color:#fff;background-image:linear-gradient(rgba(var(--ion-color-primary-rgb),.7),rgba(var(--ion-color-primary-rgb),.8))}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-selected,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-selected:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-selected.k-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-selected,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-selected:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-selected.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-selected,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-selected:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-selected.k-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-state-selected,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-state-selected:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-state-selected.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-selected,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-selected:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-selected.k-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-selected,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-selected:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-selected.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-selected,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-selected:hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-selected.k-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-selected,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-selected:hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-selected.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-selected,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-selected:hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-selected.k-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-state-selected,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-state-selected:hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-state-selected.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-selected,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-selected:hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-selected.k-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-selected,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-selected:hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-selected.k-state-hover{color:var(--ion-color-primary);background:var(--ion-color-primary-contrast);font-weight:600}:host ::ng-deep kendo-treelist.desktop-grid.cellWrapText td>.gridCell>span>div>span,:host ::ng-deep kendo-grid.desktop-grid.cellWrapText td>.gridCell>span>div>span{white-space:pre-line}:host ::ng-deep kendo-treelist .cellStyleConditionDefault,:host ::ng-deep kendo-grid .cellStyleConditionDefault{border-radius:5px;text-align:center}:host ::ng-deep kendo-treelist .rightAligned,:host ::ng-deep kendo-grid .rightAligned{text-align:right}:host ::ng-deep kendo-treelist .centerAligned,:host ::ng-deep kendo-grid .centerAligned{text-align:center}.gridTitle{font-size:calc(var(--grid-header-font-size) + 8px);font-weight:700;margin:auto 5px;color:var(--ion-color-dark);padding-top:2px;display:inherit}.gridTitleIcon{color:var(--ion-color-dark);font-size:calc(var(--grid-header-font-size) + 2px);display:block;margin:auto 0;padding-top:2px}.refresh-btn{zoom:.8}.refresh-btn>.k-i-refresh-sm{transform:rotate(30deg);font-size:1.4rem}.toolbar-left-item{flex-grow:1;display:flex}.toolbar-right-item{bottom:2px;position:relative}.gridCell.primary{color:var(--ion-color-primary)}.gridCell.secondary{color:var(--ion-color-dark)}.gridCell.tertiary{color:var(--ion-color-tertiary)}.gridCell.success{color:var(--ion-color-success-shade)}.gridCell.warning{color:var(--ion-color-warning)}.gridCell.danger{color:var(--ion-color-danger)}.gridCell.dark{color:var(--ion-color-dark)}.gridCell.medium{color:var(--ion-color-medium)}.gridCell.light{color:var(--ion-color-light)}.k-i-loading{position:absolute;inset:100px 0 0;font-size:45px;background-color:#ffffff4d;color:#0f4800}\n"], components: [{ type: i4$2.TreeListComponent, selector: "kendo-treelist", inputs: ["aria-label", "data", "pageSize", "height", "rowHeight", "skip", "scrollable", "sort", "trackBy", "filter", "virtualColumns", "filterable", "sortable", "pageable", "navigable", "navigatable", "autoSize", "rowClass", "resizable", "reorderable", "loading", "columnMenu", "hideHeader", "idField", "selectable", "isSelected", "columns", "fetchChildren", "hasChildren", "isExpanded"], outputs: ["selectionChange", "filterChange", "pageChange", "sortChange", "dataStateChange", "edit", "cancel", "save", "remove", "add", "cellClose", "cellClick", "pdfExport", "excelExport", "columnResize", "columnReorder", "columnVisibilityChange", "columnLockedChange", "scrollBottom", "contentScroll", "expand", "collapse", "expandStateChange"], exportAs: ["kendoTreeList"] }, { type: i4.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }, { type: i16.LabelComponent, selector: "kendo-label", inputs: ["text", "for", "optional"], exportAs: ["kendoLabel"] }, { type: i2$1.IonRippleEffect, selector: "ion-ripple-effect", inputs: ["type"] }, { type: ZworkflowbuttonsComponent, selector: "app-zworkflowbuttons" }, { type: ZbuttonsComponent, selector: "app-zbuttons" }, { type: i4$2.ColumnComponent, selector: "kendo-treelist-column", inputs: ["expandable", "field", "format", "sortable", "editor", "filter", "filterable", "editable"] }, { type: i4$2.NumericFilterCellComponent, selector: "kendo-treelist-numeric-filter-cell", inputs: ["filterDelay", "showOperators"] }, { type: i8.EqualFilterOperatorComponent, selector: "kendo-filter-eq-operator" }, { type: i8.NotEqualFilterOperatorComponent, selector: "kendo-filter-neq-operator" }, { type: i8.LessFilterOperatorComponent, selector: "kendo-filter-lt-operator" }, { type: i8.LessOrEqualToFilterOperatorComponent, selector: "kendo-filter-lte-operator" }, { type: i8.GreaterFilterOperatorComponent, selector: "kendo-filter-gt-operator" }, { type: i8.GreaterOrEqualToFilterOperatorComponent, selector: "kendo-filter-gte-operator" }, { type: i8.IsNullFilterOperatorComponent, selector: "kendo-filter-isnull-operator" }, { type: i8.IsNotNullFilterOperatorComponent, selector: "kendo-filter-isnotnull-operator" }, { type: DateRangeFilterCellComponent, selector: "date-range-filter-cell", inputs: ["filter", "field", "data"] }, { type: i4$2.LessFilterOperatorComponent, selector: "kendo-treelist-filter-lt-operator" }, { type: i4$2.LessOrEqualToFilterOperatorComponent, selector: "kendo-treelist-filter-lte-operator" }, { type: i4$2.GreaterFilterOperatorComponent, selector: "kendo-treelist-filter-gt-operator" }, { type: i4$2.GreaterOrEqualToFilterOperatorComponent, selector: "kendo-treelist-filter-gte-operator" }, { type: i4$2.IsNullFilterOperatorComponent, selector: "kendo-treelist-filter-isnull-operator" }, { type: i4$2.IsNotNullFilterOperatorComponent, selector: "kendo-treelist-filter-isnotnull-operator" }, { type: i4$2.DateFilterCellComponent, selector: "kendo-treelist-date-filter-cell", inputs: ["showOperators"] }, { type: i4$2.StringFilterCellComponent, selector: "kendo-treelist-string-filter-cell", inputs: ["filterDelay", "showOperators"] }, { type: i4$2.ContainsFilterOperatorComponent, selector: "kendo-treelist-filter-contains-operator" }, { type: i4$2.EqualFilterOperatorComponent, selector: "kendo-treelist-filter-eq-operator" }, { type: i4$2.NotEqualFilterOperatorComponent, selector: "kendo-treelist-filter-neq-operator" }, { type: i4$2.StartsWithFilterOperatorComponent, selector: "kendo-treelist-filter-startswith-operator" }, { type: i4$2.EndsWithFilterOperatorComponent, selector: "kendo-treelist-filter-endswith-operator" }, { type: ZInputContainerComponent, selector: "app-zinput-container" }, { type: i2$1.IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }, { type: i4$2.CommandColumnComponent, selector: "kendo-treelist-command-column" }, { type: ContextMenuComponent, selector: "app-context-menu", inputs: ["target", "selectedData"] }], directives: [{ type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i7.DefaultClassDirective, selector: " [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl], [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl], [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }, { type: i7$2.TooltipDirective, selector: "[kendoTooltip]", inputs: ["filter", "position", "titleTemplate", "showOn", "showAfter", "callout", "closable", "offset", "tooltipWidth", "tooltipHeight", "tooltipClass", "collision", "closeTitle", "tooltipTemplate"], exportAs: ["kendoTooltip"] }, { type: i4$2.ExpandableDirective, selector: "[kendoTreeListExpandable]", inputs: ["expandedKeys", "initiallyExpanded", "expandBy"], outputs: ["expandedKeysChange"], exportAs: ["kendoTreeListExpandable"] }, { type: i4$2.FlatBindingDirective, selector: "[kendoTreeListFlatBinding]", inputs: ["parentIdField", "idField", "kendoTreeListFlatBinding"], exportAs: ["kendoTreeListFlatBinding"] }, { type: i4$2.ToolbarTemplateDirective, selector: "[kendoTreeListToolbarTemplate]", inputs: ["position"] }, { type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i5.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i5.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i4$2.FilterCellTemplateDirective, selector: "[kendoTreeListFilterCellTemplate]" }, { type: i5.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { type: i4$2.CellTemplateDirective, selector: "[kendoTreeListCellTemplate]" }, { type: i4$2.FooterTemplateDirective, selector: "[kendoTreeListFooterTemplate]" }, { type: i4$2.FocusableDirective, selector: "[kendoTreeListFocusable], [kendoTreeListAddCommand], [kendoTreeListEditCommand], [kendoTreeListRemoveCommand], [kendoTreeListSaveCommand], [kendoTreeListCancelCommand] ", inputs: ["kendoTreeListFocusable", "kendoTreeListAddCommand", "kendoTreeListEditCommand", "kendoTreeListRemoveCommand", "kendoTreeListSaveCommand", "kendoTreeListCancelCommand"] }, { type: i4$2.EditCommandDirective, selector: "[kendoTreeListEditCommand]", inputs: ["kendoTreeListEditCommand"] }], pipes: { "date": i5.DatePipe, "number": i5.DecimalPipe, "htmlSanitize": HtmlSanitizePipe, "titlecase": i5.TitleCasePipe } });
|
|
12288
12365
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: ZtreelistComponent, decorators: [{
|
|
12289
12366
|
type: Component,
|
|
12290
|
-
args: [{ selector: "app-ztreelist", template: "<div *ngIf=\"!isLoading && (!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible)\"\r\n class=\"grid-container e1tag-style\" [style]=\"componentProperties.style.style\" [ngClass]=\"data.Class\">\r\n <ng-template #template let-anchor>\r\n <span>{{ anchor.nativeElement.innerText }}</span>\r\n </ng-template>\r\n <div kendoTooltip showOn=\"none\" [tooltipTemplate]=\"template\" filter=\".k-grid td\" (mouseover)=\"showTooltip($event)\" [style]=\"componentProperties.style.style1\" class=\"e1tag-style1\">\r\n <kendo-treelist [kendoTreeListFlatBinding]=\"dataSource\"\r\n kendoTreeListExpandable\r\n [style]=\"componentProperties.style.style2\"\r\n class=\"desktop-grid e1tag-style2\"\r\n [idField]=\"options.idField\"\r\n [parentIdField]=\"options.parentIdField\"\r\n [sortable]=\"options.sortable\"\r\n [resizable]=\"options.resizable\"\r\n [filterable]=\"options.filterable\"\r\n [reorderable]=\"false\"\r\n [columnMenu]=\"options.columnMenu\"\r\n [scrollable]=\"options.scrollable\"\r\n [aggregate]=\"options.aggregate\"\r\n [isExpanded]=\"isExpanded\"\r\n [class.hiden-pager]=\"!options.pageAble\"\r\n (cellClick)=\"cellClickHandler($event)\"\r\n (filterChange)=\"onFilterChange($event)\"\r\n (expand)=\"onExpand($event)\"\r\n (collapse)=\"onCollapse($event)\"\r\n [rowClass]=\"rowCallback.bind(this)\"\r\n [pageable]=\"options.pageAble\"\r\n [pageSize]=\"options.pageSize\">\r\n <ng-template kendoTreeListToolbarTemplate\r\n *ngIf=\"data.AllowRefreshButton || data.AllowExport || data.Title || data.GridButtonFieldName_WF || data.GridButtonFieldName\">\r\n <div class=\"toobar-left-item\">\r\n <fa-icon *ngIf=\"data.Icon\" class=\"gridTitleIcon\" [icon]=\"data.Icon\"></fa-icon>\r\n <kendo-label class=\"gridTitle\">{{data.Title}}</kendo-label>\r\n <button class=\"ion-activatable ripple-parent k-button refresh-btn\" (click)=\"refreshData()\" *ngIf=\"data.AllowRefreshButton\">\r\n <span class=\"k-icon k-i-refresh-sm\"></span>\r\n <ion-ripple-effect></ion-ripple-effect>\r\n </button>\r\n </div>\r\n <div class=\"toolbar-right-item\">\r\n <app-zworkflowbuttons *ngIf=\"gridBtn && gridBtn.Type === 'zworkflowbuttons'\" [data]=\"gridBtn\" [group]=\"group\" [form]=\"form\"></app-zworkflowbuttons>\r\n <app-zbuttons *ngIf=\"gridBtn && gridBtn.Type === 'zbuttons'\" [data]=\"gridBtn\" [group]=\"group\" [form]=\"form\"></app-zbuttons>\r\n <button class=\"ion-activatable ripple-parent k-button\" kendoTreeListExcelCommand\r\n *ngIf=\"data.AllowExport\">\r\n <span class=\"k-icon k-i-download\"></span>\r\n <ion-ripple-effect></ion-ripple-effect>\r\n </button>\r\n </div>\r\n </ng-template>\r\n <!--\r\n [filterable]=\"options.filterable\"\r\n [reorderable]=\"options.resizable\"\r\n -->\r\n <ng-container *ngFor=\"let col of options.columns; index as i\">\r\n <kendo-treelist-column *ngIf=\"!col.command\" [class]=\"col.class\" [expandable]=\"i===0\" [field]=\"col.field\"\r\n [title]=\"col.title || col.field\" [width]=\"col.width || 250\" [filterable]=\"filterable(col.enableFiltering)\"\r\n [sortable]=\"sortable(col.enableSorting)\" [hidden]=\"!isColumnsVisible(col.visible)\" [style]=\"getGridColumnStyle()\" class=\"e1tag-style3\"\r\n [headerStyle]=\"getGridHeaderStyle()\" headerClass=\"e1tag-style4\" [footerStyle]=\"getGridFooterStyle()\" footerClass=\"e1tag-style9\">\r\n <div [ngSwitch]=\"true\">\r\n <div *ngSwitchCase=\"col.fieldType === 'number'\r\n || col.fieldType === 'currency'\r\n || col.fieldType === 'znumeric'\">\r\n <ng-template kendoTreeListFilterCellTemplate let-filter let-column=\"column\">\r\n <kendo-treelist-numeric-filter-cell [showOperators]=\"data.IsShowGridFilterOperator\" [column]=\"column\" [filter]=\"filter\" operator=\"eq\">\r\n <kendo-filter-eq-operator></kendo-filter-eq-operator>\r\n <kendo-filter-neq-operator></kendo-filter-neq-operator>\r\n <kendo-filter-lt-operator></kendo-filter-lt-operator>\r\n <kendo-filter-lte-operator></kendo-filter-lte-operator>\r\n <kendo-filter-gt-operator></kendo-filter-gt-operator>\r\n <kendo-filter-gte-operator></kendo-filter-gte-operator>\r\n <kendo-filter-isnull-operator></kendo-filter-isnull-operator>\r\n <kendo-filter-isnotnull-operator></kendo-filter-isnotnull-operator>\r\n </kendo-treelist-numeric-filter-cell>\r\n </ng-template>\r\n </div>\r\n <div *ngSwitchCase=\"col.fieldType == 'zdate'\r\n || col.fieldType === 'zdatetime'\r\n || col.fieldType === 'zuidatetime'\">\r\n <div *ngIf=\"col.filterByDateRange === true\">\r\n <ng-template kendoTreeListFilterCellTemplate let-filter let-column=\"column\" operator=\"lte\">\r\n <date-range-filter-cell [showOperators]=\"data.IsShowGridFilterOperator\" class=\"date-range-filter\" [filter]=\"filter\" [field]=\"col.field\">\r\n <kendo-treelist-filter-lt-operator></kendo-treelist-filter-lt-operator>\r\n <kendo-treelist-filter-lte-operator></kendo-treelist-filter-lte-operator>\r\n <kendo-treelist-filter-gt-operator></kendo-treelist-filter-gt-operator>\r\n <kendo-treelist-filter-gte-operator></kendo-treelist-filter-gte-operator>\r\n <kendo-treelist-filter-isnull-operator></kendo-treelist-filter-isnull-operator>\r\n <kendo-treelist-filter-isnotnull-operator></kendo-treelist-filter-isnotnull-operator>\r\n </date-range-filter-cell>\r\n </ng-template>\r\n </div>\r\n <div *ngIf=\"col.filterByDateRange === false\">\r\n <ng-template kendoTreeListFilterCellTemplate let-filter let-column=\"column\">\r\n <kendo-treelist-date-filter-cell [showOperators]=\"data.IsShowGridFilterOperator\" [column]=\"column\" [filter]=\"filter\" operator=\"lte\">\r\n <kendo-treelist-filter-lt-operator></kendo-treelist-filter-lt-operator>\r\n <kendo-treelist-filter-lte-operator></kendo-treelist-filter-lte-operator>\r\n <kendo-treelist-filter-gt-operator></kendo-treelist-filter-gt-operator>\r\n <kendo-treelist-filter-gte-operator></kendo-treelist-filter-gte-operator>\r\n <kendo-treelist-filter-isnull-operator></kendo-treelist-filter-isnull-operator>\r\n <kendo-treelist-filter-isnotnull-operator></kendo-treelist-filter-isnotnull-operator>\r\n </kendo-treelist-date-filter-cell>\r\n </ng-template>\r\n </div>\r\n </div>\r\n <div *ngSwitchDefault>\r\n <ng-template kendoTreeListFilterCellTemplate let-filter let-column=\"column\">\r\n <kendo-treelist-string-filter-cell [showOperators]=\"data.IsShowGridFilterOperator\" [column]=\"column\" [filter]=\"filter\" operator=\"contains\">\r\n <kendo-treelist-filter-contains-operator></kendo-treelist-filter-contains-operator>\r\n <kendo-treelist-filter-eq-operator></kendo-treelist-filter-eq-operator>\r\n <kendo-treelist-filter-neq-operator></kendo-treelist-filter-neq-operator>\r\n <kendo-treelist-filter-startswith-operator></kendo-treelist-filter-startswith-operator>\r\n <kendo-treelist-filter-endswith-operator></kendo-treelist-filter-endswith-operator>\r\n <kendo-treelist-filter-isnull-operator></kendo-treelist-filter-isnull-operator>\r\n <kendo-treelist-filter-isnotnull-operator></kendo-treelist-filter-isnotnull-operator>\r\n </kendo-treelist-string-filter-cell>\r\n </ng-template>\r\n </div>\r\n </div>\r\n <ng-template kendoTreeListCellTemplate let-dataItem let-rowIndex=\"rowIndex\" let-cellContext=\"cellContext\">\r\n <div style=\"margin: 7px 0;display: inline;\" [style.color]=\"(!!dataItem.Color ? [dataItem.Color] : 'black')\"\r\n *ngIf=\"!col.navigateTo && col.isEditableInGrid !== true\" [ngSwitch]=\"col.fieldType\"\r\n [ngClass]=\"getColClass(dataItem, col)\">\r\n <span *ngSwitchCase=\"'zdate'\" class=\"grid-cell-data\">\r\n {{ dataItem[col.field] | date: 'dd/MM/yyyy' }}\r\n </span>\r\n <span *ngSwitchCase=\"'zshortdate'\" class=\"grid-cell-data\">\r\n {{ dataItem[col.field] | date: 'MMM yyyy' }}\r\n </span>\r\n <span *ngSwitchCase=\"'zdatetime'\" class=\"grid-cell-data\">\r\n {{ dataItem[col.field] | date: 'dd/MM/yyyy hh:mm:ss aa' }}\r\n </span>\r\n <span *ngSwitchCase=\"'zuidatetime'\" class=\"grid-cell-data\">\r\n {{ dataItem[col.field] | date: 'dd/MM/yyyy hh:mm:ss aa' }}\r\n </span>\r\n <span *ngSwitchCase=\"'number'\" class=\"grid-cell-data\">\r\n <div style=\"text-align:right;\">{{ dataItem[col.field] | number }} </div>\r\n </span>\r\n <span *ngSwitchCase=\"'currency'\" class=\"grid-cell-data\">\r\n <div style=\"text-align:right;\">{{ dataItem[col.field] | number: '1.2-2' }}</div>\r\n </span>\r\n <span *ngSwitchCase=\"'znumeric'\" class=\"grid-cell-data\">\r\n <div style=\"text-align:right;\">{{ dataItem[col.field] | number: getFormat(col) }}</div>\r\n </span>\r\n <span *ngSwitchCase=\"'url'\" style=\"color: blue; cursor: pointer; text-decoration:underline;\" class=\"grid-cell-data\">\r\n {{ dataItem[col.field] }}\r\n </span>\r\n <span *ngSwitchCase=\"'zlabel'\" class=\"grid-cell-data\">\r\n <div class=\"ztree-inline-block e1tag-style10\" [style]=\"componentProperties.style.style10\" [innerHTML]=\"dataItem[col.field] | htmlSanitize\"></div>\r\n </span>\r\n <span *ngSwitchDefault class=\"grid-cell-data\">\r\n {{ dataItem[col.field] }}\r\n </span>\r\n </div>\r\n <div style=\"margin: 7px 0;display: inline;\" [style.color]=\"(!!dataItem.Color ? [dataItem.Color] : 'black')\"\r\n *ngIf=\"!col.navigateTo && col.isEditableInGrid === true && isInlineEditColVisible(dataItem, col)\"\r\n [ngClass]=\"getColClass(dataItem, col)\" [style]=\"componentProperties.style.style5\" class=\"e1tag-style5\">\r\n <app-zinput-container [data]=\"getInlineField(col.field)\" [group]=\"group\"\r\n [form]=\"getInlineForm(dataItem, rowIndex)\" [containerField]=\"containerField\" [style]=\"componentProperties.style.style6\"\r\n class=\"e1tag-style6\">\r\n </app-zinput-container>\r\n </div>\r\n <span *ngIf=\"!!col.navigateTo\" (click)=\"onNavigateTo($event, col, dataItem, dataItem[col.field])\">\r\n <ion-button color=\"light\" size=\"small\">\r\n {{ dataItem[col.field] }}\r\n <!-- <ion-icon slot= \"end\" name=\"arrow-forward\"></ion-icon> -->\r\n <fa-icon slot=\"end\" [icon]=\"'arrow-right'\"></fa-icon>\r\n </ion-button>\r\n </span>\r\n </ng-template>\r\n <ng-template *ngIf=\"col.footerTemplate\" kendoTreeListFooterTemplate let-aggregates=\"aggregates\">\r\n <div *ngIf=\"!col.navigateTo\" [ngSwitch]=\"col.fieldType\" [style]=\"componentProperties.style.style7\"\r\n [ngClass]=\"{'rightAligned': col.fieldType === 'number' || col.fieldType === 'currency'}\" class=\"e1tag-style7\">\r\n <span *ngSwitchCase=\"'number'\">\r\n <b>\r\n {{ col.aggregateTitle | titlecase }} {{ aggregates[col.field][col.aggregateType] | number }}\r\n </b>\r\n </span>\r\n <span *ngSwitchCase=\"'currency'\">\r\n <b>\r\n {{ col.aggregateTitle | titlecase }} {{ aggregates[col.field][col.aggregateType] | number: '1.2-2' }}\r\n </b>\r\n </span>\r\n </div>\r\n </ng-template>\r\n </kendo-treelist-column>\r\n <kendo-treelist-command-column *ngIf=\"!!col.command\" [title]=\"col.title || col.field\"\r\n [width]=\"col.width || 250\" [style]=\"componentProperties.style.style8\" class=\"e1tag-style8\">\r\n <ng-template kendoTreeListCellTemplate let-cellContext=\"cellContext\">\r\n <div [ngClass]=\"col.class\">\r\n <button *ngFor=\"let col2 of col.command; index as i\" type=\"button\"\r\n [kendoTreeListEditCommand]=\"cellContext\" [title]=\"col2.text\" (click)=\"buttonClick(col2, cellContext)\"\r\n [hidden]=\"isButtonHidden(col2, cellContext)\">\r\n <fa-icon [icon]=\"col2.icon\" [style.color]=\"(!!col2.color ? [col2.color] : 'black')\">\r\n </fa-icon>\r\n <div *ngIf=\"col2.ShowLabel === undefined || col2.ShowLabel\">{{col2.text}}</div>\r\n </button>\r\n </div>\r\n </ng-template>\r\n </kendo-treelist-command-column>\r\n </ng-container>\r\n\r\n <!-- <kendo-treelist-command-column width=\"140\">\r\n <ng-template kendoTreeListCellTemplate let-isNew=\"isNew\" let-cellContext=\"cellContext\">\r\n <button [kendoTreeListAddCommand]=\"cellContext\"\r\n icon=\"filter-add-expression\" title=\"Add Child\">\r\n </button>\r\n <button [kendoTreeListCancelCommand]=\"cellContext\"\r\n icon=\"cancel\" title=\"{{ isNew ? 'Discard changes' : 'Cancel' }}\">\r\n </button>\r\n </ng-template>\r\n </kendo-treelist-command-column> -->\r\n </kendo-treelist>\r\n <app-context-menu [data]=\"data\" [group]=\"group\" [form]=\"form\" #dataitemcontextmenu></app-context-menu>\r\n </div>\r\n</div>\r\n", styles: [".grid-container{margin-top:10px}.grid-container.style1{margin:10px;border:1px solid rgba(0,0,0,.08);border-radius:var(--ion-container-border-radius);padding:8px 20px 20px;background:#ffffff}.grid-container.align-with-input{margin:0 25px 0 10px}.rightAligned{text-align:right;display:table!important;margin:0 0 0 auto!important}.centerAligned{text-align:center;display:table!important;margin:0 auto!important}.ztree-inline-block{display:inline-block}\n", ".grid-container.align-with-input{margin:0 25px 0 10px}:host ::ng-deep kendo-treelist.desktop-grid,:host ::ng-deep kendo-grid.desktop-grid{border-width:0px;width:100%;background:transparent}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-content,:host ::ng-deep kendo-grid.desktop-grid .k-grid-content{white-space:nowrap}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar{margin-bottom:15px;padding:5px 0 0;display:flex;flex-direction:row;border:none;background:transparent;border-bottom:1px solid var(--ion-app-seperator-line-color)}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar .k-input,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar .k-picker,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar .k-input,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar .k-picker{width:100%}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item .k-button,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item .k-button,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item .k-button,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item .k-button,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item .k-button,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item .k-button{font-size:calc(var(--button-font-size) - 1px);margin-left:8px;margin-right:2px;border-radius:var(--button-border-radius);background:#fff;border:none;box-shadow:none;padding:5px}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item .k-button.left-buttons,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item .k-button.left-buttons,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item .k-button.left-buttons,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item .k-button.left-buttons,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item .k-button.left-buttons,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item .k-button.left-buttons{margin:auto 0 auto 5px}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item .k-button .k-grid-button,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item .k-button .k-grid-button,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item .k-button .k-grid-button,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item .k-button .k-grid-button,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item .k-button .k-grid-button,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item .k-button .k-grid-button{padding:0 6px}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item .k-button fa-icon,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item .k-button fa-icon,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item .k-button fa-icon,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item .k-button fa-icon,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item .k-button fa-icon,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item .k-button fa-icon{color:var(--ion-color-primary)}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item .k-button .k-icon,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item .k-button .k-icon,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item .k-button .k-icon,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item .k-button .k-icon,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item .k-button .k-icon,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item .k-button .k-icon{font-size:calc(var(--button-font-size) + 8px)}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item .k-button .k-icon-with-text,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item .k-button .k-icon-with-text,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item .k-button .k-icon-with-text,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item .k-button .k-icon-with-text,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item .k-button .k-icon-with-text,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item .k-button .k-icon-with-text{margin-right:2px;font-size:calc(var(--button-font-size) + 2px);padding-bottom:3px}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item .k-button:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item .k-button:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item .k-button:hover,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item .k-button:hover,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item .k-button:hover,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item .k-button:hover{background:rgba(var(--ion-color-primary-rgb),.2)}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container{margin-top:auto;padding-bottom:1px;gap:5px;display:flex}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container.with-grid-title,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container.with-grid-title,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container.with-grid-title,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container.with-grid-title,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container.with-grid-title,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container.with-grid-title{margin-left:10px;border-left:1px solid #c9c9c9;padding-left:8px}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text{height:18px;gap:8px;display:flex;margin:auto}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .k-i-file-excel,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .k-i-file-excel,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .k-i-file-excel,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .k-i-file-excel,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .k-i-file-excel,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .k-i-file-excel{margin-top:-1px;font-size:calc(var(--button-font-size) + 6px)}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .export-to-excel-button-text,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .export-to-excel-button-text,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .export-to-excel-button-text,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .export-to-excel-button-text,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .export-to-excel-button-text,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .export-to-excel-button-text{margin:auto}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container{flex:1 1 100%;border:1px solid var(--ion-app-seperator-line-color);display:grid}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.normal-filter-container,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.normal-filter-container{display:grid;grid-template-columns:80% 20%;width:100%}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons{display:flex;margin:auto 5px auto auto;padding:0 5px;position:relative}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons.filter-field-layout-type2,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons.filter-field-layout-type2{top:12px}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons>ion-button,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons>ion-button{font-size:var(--button-font-size);margin-left:10px;height:calc(var(--input-field-height) + 2px)}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons>ion-button.toggleOn,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons>ion-button.toggleOn{--background: rgba(var(--ion-color-primary-rgb), 15%);--background-hover: rgba(var(--ion-color-primary-rgb), 10%);--color: var(--ion-color-primary);--border-color: var(--ion-color-primary)}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons>ion-button.toggleOff,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons>ion-button.toggleOff{--background: var(--disabled-input-field-backgroundcolor);--border-color: var(--z-placeholder-color);--color: var(--z-placeholder-color);--background-hover: #efefef}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons>ion-button .btn-label,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons>ion-button .btn-label{padding-left:5px}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.adv-filter-container,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.adv-filter-container{margin-top:10px}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.adv-filter-container>.adv-filter-seperator,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.adv-filter-container>.adv-filter-seperator{width:100%;height:calc(var(--content-font-size) - 1px);border-bottom:1px solid var(--ion-color-primary);text-align:center}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.adv-filter-container>.adv-filter-seperator span,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.adv-filter-container>.adv-filter-seperator span{font-size:calc(var(--content-font-size) + 3px);background:#fff;padding:0 20px;color:var(--ion-color-primary);font-weight:600}:host ::ng-deep kendo-treelist.desktop-grid.toolbar-no-border .k-toolbar,:host ::ng-deep kendo-grid.desktop-grid.toolbar-no-border .k-toolbar{margin-bottom:0;border-width:0px}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-aria-root,:host ::ng-deep kendo-grid.desktop-grid .k-grid-aria-root{border:1px solid var(--ion-color-primary);border-radius:5px 5px 0 0}:host ::ng-deep kendo-treelist.desktop-grid.hiden-pager .k-grid-aria-root,:host ::ng-deep kendo-grid.desktop-grid.hiden-pager .k-grid-aria-root{border-radius:5px}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header{font-weight:600;font-size:var(--grid-header-font-size);background:rgba(var(--ion-color-primary-rgb),.25);color:#000}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-cell-inner>.k-link,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-cell-inner>.k-link{padding:12px 12px 8px}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-grid-filter,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-header-column-menu,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-hierarchy-cell .k-icon,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-grid-filter.k-active,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-header-column-menu.k-active,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-hierarchy-cell .k-icon.k-active .k-grid-filter.k-state-active,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-header-column-menu.k-state-active,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-hierarchy-cell .k-icon.k-state-active,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-grid-filter,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-header-column-menu,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-hierarchy-cell .k-icon,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-grid-filter.k-active,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-header-column-menu.k-active,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-hierarchy-cell .k-icon.k-active .k-grid-filter.k-state-active,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-header-column-menu.k-state-active,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-hierarchy-cell .k-icon.k-state-active{color:#000;background:transparent}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-filtercell .k-dropdown .k-dropdown-wrap,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-filtercell .k-dropdowntree .k-dropdown-wrap,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-filtercell .k-dropdown .k-dropdown-wrap,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-filtercell .k-dropdowntree .k-dropdown-wrap{background:var(--ion-color-primary-contrast);color:var(--ion-color-primary-shade)}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-filtercell .k-dropdown .k-button,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-filtercell .k-dropdowntree .k-button,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-filtercell .k-dropdown .k-button,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-filtercell .k-dropdowntree .k-button{color:var(--ion-color-primary-shade)}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-filtercell>.k-filtercell-wrapper>.k-filtercell-operator,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-filtercell>.k-filtercell-wrapper>.k-filtercell-operator{display:flex}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-filtercell>.k-filtercell-wrapper>.k-filtercell-operator>.k-button.k-clear-button-visible,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-filtercell>.k-filtercell-wrapper>.k-filtercell-operator>.k-button.k-clear-button-visible{margin-left:4px}:host ::ng-deep kendo-treelist.desktop-grid tbody>tr,:host ::ng-deep kendo-grid.desktop-grid tbody>tr{background:rgba(var(--ion-color-primary-rgb),.08);font-size:var(--grid-cell-font-size)}:host ::ng-deep kendo-treelist.desktop-grid tbody>tr.k-alt,:host ::ng-deep kendo-grid.desktop-grid tbody>tr.k-alt{background:rgba(var(--ion-color-primary-rgb),.01)}:host ::ng-deep kendo-treelist.desktop-grid tbody>td.k-selected,:host ::ng-deep kendo-treelist.desktop-grid tbody>td.k-selected.k-alt,:host ::ng-deep kendo-treelist.desktop-grid tbody>tr.k-selected>td,:host ::ng-deep kendo-treelist.desktop-grid tbody>tr.k-selected.k-alt>td,:host ::ng-deep kendo-treelist.desktop-grid tbody>td.k-state-selected,:host ::ng-deep kendo-treelist.desktop-grid tbody>td.k-state-selected.k-alt,:host ::ng-deep kendo-treelist.desktop-grid tbody>tr.k-state-selected>td,:host ::ng-deep kendo-treelist.desktop-grid tbody>tr.k-state-selected.k-alt>td,:host ::ng-deep kendo-grid.desktop-grid tbody>td.k-selected,:host ::ng-deep kendo-grid.desktop-grid tbody>td.k-selected.k-alt,:host ::ng-deep kendo-grid.desktop-grid tbody>tr.k-selected>td,:host ::ng-deep kendo-grid.desktop-grid tbody>tr.k-selected.k-alt>td,:host ::ng-deep kendo-grid.desktop-grid tbody>td.k-state-selected,:host ::ng-deep kendo-grid.desktop-grid tbody>td.k-state-selected.k-alt,:host ::ng-deep kendo-grid.desktop-grid tbody>tr.k-state-selected>td,:host ::ng-deep kendo-grid.desktop-grid tbody>tr.k-state-selected.k-alt>td{background:rgba(var(--ion-color-secondary-rgb),.8);color:var(--ion-color-secondary-contrast);font-weight:600}:host ::ng-deep kendo-treelist.desktop-grid tbody>tr:hover,:host ::ng-deep kendo-treelist.desktop-grid tbody>tr.k-hover,:host ::ng-deep kendo-treelist.desktop-grid tbody>tr.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid tbody>tr:hover,:host ::ng-deep kendo-grid.desktop-grid tbody>tr.k-hover,:host ::ng-deep kendo-grid.desktop-grid tbody>tr.k-state-hover{background-color:rgba(var(--ion-color-secondary-rgb),.15)}:host ::ng-deep kendo-treelist.desktop-grid tbody td>.gridCell>span>div>span,:host ::ng-deep kendo-grid.desktop-grid tbody td>.gridCell>span>div>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager{background-color:rgba(var(--ion-color-primary-rgb),.25);color:#000;border:1px solid var(--ion-color-primary);border-top:none;border-radius:0 0 5px 5px;font-size:calc(var(--grid-cell-font-size) - 2px);padding:2px 10px}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link{color:#000;border-radius:5px}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover{color:#fff;background-image:linear-gradient(rgba(var(--ion-color-primary-rgb),.7),rgba(var(--ion-color-primary-rgb),.8))}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-selected,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-selected:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-selected.k-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-selected,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-selected:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-selected.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-selected,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-selected:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-selected.k-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-state-selected,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-state-selected:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-state-selected.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-selected,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-selected:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-selected.k-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-selected,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-selected:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-selected.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-selected,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-selected:hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-selected.k-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-selected,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-selected:hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-selected.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-selected,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-selected:hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-selected.k-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-state-selected,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-state-selected:hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-state-selected.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-selected,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-selected:hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-selected.k-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-selected,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-selected:hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-selected.k-state-hover{color:var(--ion-color-primary);background:var(--ion-color-primary-contrast);font-weight:600}:host ::ng-deep kendo-treelist.desktop-grid.cellWrapText td>.gridCell>span>div>span,:host ::ng-deep kendo-grid.desktop-grid.cellWrapText td>.gridCell>span>div>span{white-space:pre-line}:host ::ng-deep kendo-treelist .cellStyleConditionDefault,:host ::ng-deep kendo-grid .cellStyleConditionDefault{border-radius:5px;text-align:center}:host ::ng-deep kendo-treelist .rightAligned,:host ::ng-deep kendo-grid .rightAligned{text-align:right}:host ::ng-deep kendo-treelist .centerAligned,:host ::ng-deep kendo-grid .centerAligned{text-align:center}.gridTitle{font-size:calc(var(--grid-header-font-size) + 8px);font-weight:700;margin:auto 5px;color:var(--ion-color-dark);padding-top:2px;display:inherit}.gridTitleIcon{color:var(--ion-color-dark);font-size:calc(var(--grid-header-font-size) + 2px);display:block;margin:auto 0;padding-top:2px}.refresh-btn{zoom:.8}.refresh-btn>.k-i-refresh-sm{transform:rotate(30deg);font-size:1.4rem}.toolbar-left-item{flex-grow:1;display:flex}.toolbar-right-item{bottom:2px;position:relative}.gridCell.primary{color:var(--ion-color-primary)}.gridCell.secondary{color:var(--ion-color-dark)}.gridCell.tertiary{color:var(--ion-color-tertiary)}.gridCell.success{color:var(--ion-color-success-shade)}.gridCell.warning{color:var(--ion-color-warning)}.gridCell.danger{color:var(--ion-color-danger)}.gridCell.dark{color:var(--ion-color-dark)}.gridCell.medium{color:var(--ion-color-medium)}.gridCell.light{color:var(--ion-color-light)}.k-i-loading{position:absolute;inset:100px 0 0;font-size:45px;background-color:#ffffff4d;color:#0f4800}\n"] }]
|
|
12367
|
+
args: [{ selector: "app-ztreelist", template: "<div *ngIf=\"!isLoading && (!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible)\"\r\n class=\"grid-container e1tag-style\" [style]=\"componentProperties.style.style\" [ngClass]=\"data.Class\">\r\n <ng-template #template let-anchor>\r\n <span>{{ anchor.nativeElement.innerText }}</span>\r\n </ng-template>\r\n <div kendoTooltip showOn=\"none\" [tooltipTemplate]=\"template\" filter=\".k-grid td\" (mouseover)=\"showTooltip($event)\" [style]=\"componentProperties.style.style1\" class=\"e1tag-style1\">\r\n <kendo-treelist [kendoTreeListFlatBinding]=\"dataSource\"\r\n kendoTreeListExpandable\r\n [style]=\"componentProperties.style.style2\"\r\n class=\"desktop-grid e1tag-style2\"\r\n [idField]=\"options.idField\"\r\n [parentIdField]=\"options.parentIdField\"\r\n [sortable]=\"options.sortable\"\r\n [resizable]=\"options.resizable\"\r\n [filterable]=\"options.filterable\"\r\n [reorderable]=\"false\"\r\n [columnMenu]=\"options.columnMenu\"\r\n [scrollable]=\"options.scrollable\"\r\n [aggregate]=\"options.aggregate\"\r\n [isExpanded]=\"isExpanded\"\r\n [class.hiden-pager]=\"!options.pageAble\"\r\n (cellClick)=\"cellClickHandler($event)\"\r\n (filterChange)=\"onFilterChange($event)\"\r\n (expand)=\"onExpand($event)\"\r\n (collapse)=\"onCollapse($event)\"\r\n [rowClass]=\"rowCallback.bind(this)\"\r\n [pageable]=\"options.pageAble\"\r\n [pageSize]=\"options.pageSize\">\r\n <ng-template kendoTreeListToolbarTemplate\r\n *ngIf=\"data.AllowRefreshButton || data.AllowExport || data.Title || data.GridButtonFieldName_WF || data.GridButtonFieldName\">\r\n <div class=\"toobar-left-item\">\r\n <fa-icon *ngIf=\"data.Icon\" class=\"gridTitleIcon\" [icon]=\"data.Icon\"></fa-icon>\r\n <kendo-label class=\"gridTitle\">{{data.Title}}</kendo-label>\r\n <button class=\"ion-activatable ripple-parent k-button refresh-btn\" (click)=\"refreshData()\" *ngIf=\"data.AllowRefreshButton\">\r\n <span class=\"k-icon k-i-refresh-sm\"></span>\r\n <ion-ripple-effect></ion-ripple-effect>\r\n </button>\r\n </div>\r\n <div class=\"toolbar-right-item\">\r\n <app-zworkflowbuttons *ngIf=\"gridBtn && gridBtn.Type === 'zworkflowbuttons'\" [data]=\"gridBtn\" [group]=\"group\" [form]=\"form\"></app-zworkflowbuttons>\r\n <app-zbuttons *ngIf=\"gridBtn && gridBtn.Type === 'zbuttons'\" [data]=\"gridBtn\" [group]=\"group\" [form]=\"form\"></app-zbuttons>\r\n <button class=\"ion-activatable ripple-parent k-button\" kendoTreeListExcelCommand\r\n *ngIf=\"data.AllowExport\">\r\n <span class=\"k-icon k-i-download\"></span>\r\n <ion-ripple-effect></ion-ripple-effect>\r\n </button>\r\n </div>\r\n </ng-template>\r\n <!--\r\n [filterable]=\"options.filterable\"\r\n [reorderable]=\"options.resizable\"\r\n -->\r\n <ng-container *ngFor=\"let col of options.columns; index as i\">\r\n <kendo-treelist-column *ngIf=\"!col.command\" [class]=\"col.class\" [expandable]=\"i===0\" [field]=\"col.field\"\r\n [title]=\"col.title || col.field\" [width]=\"col.width || 250\" [filterable]=\"filterable(col.enableFiltering)\"\r\n [sortable]=\"sortable(col.enableSorting)\" [hidden]=\"!isColumnsVisible(col.visible)\" [style]=\"getGridColumnStyle()\" class=\"e1tag-style3\"\r\n [headerStyle]=\"getGridHeaderStyle()\" headerClass=\"e1tag-style4\" [footerStyle]=\"getGridFooterStyle()\" footerClass=\"e1tag-style9\">\r\n <div [ngSwitch]=\"true\">\r\n <div *ngSwitchCase=\"col.fieldType === 'number'\r\n || col.fieldType === 'currency'\r\n || col.fieldType === 'znumeric'\">\r\n <ng-template kendoTreeListFilterCellTemplate let-filter let-column=\"column\">\r\n <kendo-treelist-numeric-filter-cell [showOperators]=\"data.IsShowGridFilterOperator\" [column]=\"column\" [filter]=\"filter\" operator=\"eq\">\r\n <kendo-filter-eq-operator></kendo-filter-eq-operator>\r\n <kendo-filter-neq-operator></kendo-filter-neq-operator>\r\n <kendo-filter-lt-operator></kendo-filter-lt-operator>\r\n <kendo-filter-lte-operator></kendo-filter-lte-operator>\r\n <kendo-filter-gt-operator></kendo-filter-gt-operator>\r\n <kendo-filter-gte-operator></kendo-filter-gte-operator>\r\n <kendo-filter-isnull-operator></kendo-filter-isnull-operator>\r\n <kendo-filter-isnotnull-operator></kendo-filter-isnotnull-operator>\r\n </kendo-treelist-numeric-filter-cell>\r\n </ng-template>\r\n </div>\r\n <div *ngSwitchCase=\"col.fieldType == 'zdate'\r\n || col.fieldType === 'zdatetime'\r\n || col.fieldType === 'zuidatetime'\">\r\n <div *ngIf=\"col.filterByDateRange === true\">\r\n <ng-template kendoTreeListFilterCellTemplate let-filter let-column=\"column\" operator=\"lte\">\r\n <date-range-filter-cell [showOperators]=\"data.IsShowGridFilterOperator\" class=\"date-range-filter\" [filter]=\"filter\" [field]=\"col.field\">\r\n <kendo-treelist-filter-lt-operator></kendo-treelist-filter-lt-operator>\r\n <kendo-treelist-filter-lte-operator></kendo-treelist-filter-lte-operator>\r\n <kendo-treelist-filter-gt-operator></kendo-treelist-filter-gt-operator>\r\n <kendo-treelist-filter-gte-operator></kendo-treelist-filter-gte-operator>\r\n <kendo-treelist-filter-isnull-operator></kendo-treelist-filter-isnull-operator>\r\n <kendo-treelist-filter-isnotnull-operator></kendo-treelist-filter-isnotnull-operator>\r\n </date-range-filter-cell>\r\n </ng-template>\r\n </div>\r\n <div *ngIf=\"col.filterByDateRange === false\">\r\n <ng-template kendoTreeListFilterCellTemplate let-filter let-column=\"column\">\r\n <kendo-treelist-date-filter-cell [showOperators]=\"data.IsShowGridFilterOperator\" [column]=\"column\" [filter]=\"filter\" operator=\"lte\">\r\n <kendo-treelist-filter-lt-operator></kendo-treelist-filter-lt-operator>\r\n <kendo-treelist-filter-lte-operator></kendo-treelist-filter-lte-operator>\r\n <kendo-treelist-filter-gt-operator></kendo-treelist-filter-gt-operator>\r\n <kendo-treelist-filter-gte-operator></kendo-treelist-filter-gte-operator>\r\n <kendo-treelist-filter-isnull-operator></kendo-treelist-filter-isnull-operator>\r\n <kendo-treelist-filter-isnotnull-operator></kendo-treelist-filter-isnotnull-operator>\r\n </kendo-treelist-date-filter-cell>\r\n </ng-template>\r\n </div>\r\n </div>\r\n <div *ngSwitchDefault>\r\n <ng-template kendoTreeListFilterCellTemplate let-filter let-column=\"column\">\r\n <kendo-treelist-string-filter-cell [showOperators]=\"data.IsShowGridFilterOperator\" [column]=\"column\" [filter]=\"filter\" operator=\"contains\">\r\n <kendo-treelist-filter-contains-operator></kendo-treelist-filter-contains-operator>\r\n <kendo-treelist-filter-eq-operator></kendo-treelist-filter-eq-operator>\r\n <kendo-treelist-filter-neq-operator></kendo-treelist-filter-neq-operator>\r\n <kendo-treelist-filter-startswith-operator></kendo-treelist-filter-startswith-operator>\r\n <kendo-treelist-filter-endswith-operator></kendo-treelist-filter-endswith-operator>\r\n <kendo-treelist-filter-isnull-operator></kendo-treelist-filter-isnull-operator>\r\n <kendo-treelist-filter-isnotnull-operator></kendo-treelist-filter-isnotnull-operator>\r\n </kendo-treelist-string-filter-cell>\r\n </ng-template>\r\n </div>\r\n </div>\r\n <ng-template kendoTreeListCellTemplate let-dataItem let-rowIndex=\"rowIndex\" let-cellContext=\"cellContext\">\r\n <div style=\"margin: 7px 0;display: inline;\" [style.color]=\"(!!dataItem.Color ? [dataItem.Color] : 'black')\"\r\n *ngIf=\"!col.navigateTo && col.isEditableInGrid !== true\" [ngSwitch]=\"col.fieldType\"\r\n [ngClass]=\"getColClass(dataItem, col)\">\r\n <span *ngSwitchCase=\"'zdate'\" class=\"grid-cell-data\">\r\n {{ dataItem[col.field] | date: 'dd/MM/yyyy' }}\r\n </span>\r\n <span *ngSwitchCase=\"'zshortdate'\" class=\"grid-cell-data\">\r\n {{ dataItem[col.field] | date: 'MMM yyyy' }}\r\n </span>\r\n <span *ngSwitchCase=\"'zdatetime'\" class=\"grid-cell-data\">\r\n {{ dataItem[col.field] | date: 'dd/MM/yyyy hh:mm:ss aa' }}\r\n </span>\r\n <span *ngSwitchCase=\"'zuidatetime'\" class=\"grid-cell-data\">\r\n {{ dataItem[col.field] | date: 'dd/MM/yyyy hh:mm:ss aa' }}\r\n </span>\r\n <span *ngSwitchCase=\"'sfdatetimepicker'\" class=\"grid-cell-data\">\r\n {{ dataItem[col.field] | date: 'dd/MM/yyyy hh:mm:ss aa' }}\r\n </span>\r\n <span *ngSwitchCase=\"'number'\" class=\"grid-cell-data\">\r\n <div style=\"text-align:right;\">{{ dataItem[col.field] | number }} </div>\r\n </span>\r\n <span *ngSwitchCase=\"'currency'\" class=\"grid-cell-data\">\r\n <div style=\"text-align:right;\">{{ dataItem[col.field] | number: '1.2-2' }}</div>\r\n </span>\r\n <span *ngSwitchCase=\"'znumeric'\" class=\"grid-cell-data\">\r\n <div style=\"text-align:right;\">{{ dataItem[col.field] | number: getFormat(col) }}</div>\r\n </span>\r\n <span *ngSwitchCase=\"'url'\" style=\"color: blue; cursor: pointer; text-decoration:underline;\" class=\"grid-cell-data\">\r\n {{ dataItem[col.field] }}\r\n </span>\r\n <span *ngSwitchCase=\"'zlabel'\" class=\"grid-cell-data\">\r\n <div class=\"ztree-inline-block e1tag-style10\" [style]=\"componentProperties.style.style10\" [innerHTML]=\"dataItem[col.field] | htmlSanitize\"></div>\r\n </span>\r\n <span *ngSwitchDefault class=\"grid-cell-data\">\r\n {{ dataItem[col.field] }}\r\n </span>\r\n </div>\r\n <div style=\"margin: 7px 0;display: inline;\" [style.color]=\"(!!dataItem.Color ? [dataItem.Color] : 'black')\"\r\n *ngIf=\"!col.navigateTo && col.isEditableInGrid === true && isInlineEditColVisible(dataItem, col)\"\r\n [ngClass]=\"getColClass(dataItem, col)\" [style]=\"componentProperties.style.style5\" class=\"e1tag-style5\">\r\n <app-zinput-container [data]=\"getInlineField(col.field)\" [group]=\"group\"\r\n [form]=\"getInlineForm(dataItem, rowIndex)\" [containerField]=\"containerField\" [style]=\"componentProperties.style.style6\"\r\n class=\"e1tag-style6\">\r\n </app-zinput-container>\r\n </div>\r\n <span *ngIf=\"!!col.navigateTo\" (click)=\"onNavigateTo($event, col, dataItem, dataItem[col.field])\">\r\n <ion-button color=\"light\" size=\"small\">\r\n {{ dataItem[col.field] }}\r\n <!-- <ion-icon slot= \"end\" name=\"arrow-forward\"></ion-icon> -->\r\n <fa-icon slot=\"end\" [icon]=\"'arrow-right'\"></fa-icon>\r\n </ion-button>\r\n </span>\r\n </ng-template>\r\n <ng-template *ngIf=\"col.footerTemplate\" kendoTreeListFooterTemplate let-aggregates=\"aggregates\">\r\n <div *ngIf=\"!col.navigateTo\" [ngSwitch]=\"col.fieldType\" [style]=\"componentProperties.style.style7\"\r\n [ngClass]=\"{'rightAligned': col.fieldType === 'number' || col.fieldType === 'currency'}\" class=\"e1tag-style7\">\r\n <span *ngSwitchCase=\"'number'\">\r\n <b>\r\n {{ col.aggregateTitle | titlecase }} {{ aggregates[col.field][col.aggregateType] | number }}\r\n </b>\r\n </span>\r\n <span *ngSwitchCase=\"'currency'\">\r\n <b>\r\n {{ col.aggregateTitle | titlecase }} {{ aggregates[col.field][col.aggregateType] | number: '1.2-2' }}\r\n </b>\r\n </span>\r\n </div>\r\n </ng-template>\r\n </kendo-treelist-column>\r\n <kendo-treelist-command-column *ngIf=\"!!col.command\" [title]=\"col.title || col.field\"\r\n [width]=\"col.width || 250\" [style]=\"componentProperties.style.style8\" class=\"e1tag-style8\">\r\n <ng-template kendoTreeListCellTemplate let-cellContext=\"cellContext\">\r\n <div [ngClass]=\"col.class\">\r\n <button *ngFor=\"let col2 of col.command; index as i\" type=\"button\"\r\n [kendoTreeListEditCommand]=\"cellContext\" [title]=\"col2.text\" (click)=\"buttonClick(col2, cellContext)\"\r\n [hidden]=\"isButtonHidden(col2, cellContext)\">\r\n <fa-icon [icon]=\"col2.icon\" [style.color]=\"(!!col2.color ? [col2.color] : 'black')\">\r\n </fa-icon>\r\n <div *ngIf=\"col2.ShowLabel === undefined || col2.ShowLabel\">{{col2.text}}</div>\r\n </button>\r\n </div>\r\n </ng-template>\r\n </kendo-treelist-command-column>\r\n </ng-container>\r\n\r\n <!-- <kendo-treelist-command-column width=\"140\">\r\n <ng-template kendoTreeListCellTemplate let-isNew=\"isNew\" let-cellContext=\"cellContext\">\r\n <button [kendoTreeListAddCommand]=\"cellContext\"\r\n icon=\"filter-add-expression\" title=\"Add Child\">\r\n </button>\r\n <button [kendoTreeListCancelCommand]=\"cellContext\"\r\n icon=\"cancel\" title=\"{{ isNew ? 'Discard changes' : 'Cancel' }}\">\r\n </button>\r\n </ng-template>\r\n </kendo-treelist-command-column> -->\r\n </kendo-treelist>\r\n <app-context-menu [data]=\"data\" [group]=\"group\" [form]=\"form\" #dataitemcontextmenu></app-context-menu>\r\n </div>\r\n</div>\r\n", styles: [".grid-container{margin-top:10px}.grid-container.style1{margin:10px;border:1px solid rgba(0,0,0,.08);border-radius:var(--ion-container-border-radius);padding:8px 20px 20px;background:#ffffff}.grid-container.align-with-input{margin:0 25px 0 10px}.rightAligned{text-align:right;display:table!important;margin:0 0 0 auto!important}.centerAligned{text-align:center;display:table!important;margin:0 auto!important}.ztree-inline-block{display:inline-block}\n", ".grid-container.align-with-input{margin:0 25px 0 10px}:host ::ng-deep kendo-treelist.desktop-grid,:host ::ng-deep kendo-grid.desktop-grid{border-width:0px;width:100%;background:transparent}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-content,:host ::ng-deep kendo-grid.desktop-grid .k-grid-content{white-space:nowrap}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar{margin-bottom:15px;padding:5px 0 0;display:flex;flex-direction:row;border:none;background:transparent;border-bottom:1px solid var(--ion-app-seperator-line-color)}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar .k-input,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar .k-picker,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar .k-input,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar .k-picker{width:100%}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item .k-button,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item .k-button,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item .k-button,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item .k-button,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item .k-button,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item .k-button{font-size:calc(var(--button-font-size) - 1px);margin-left:8px;margin-right:2px;border-radius:var(--button-border-radius);background:#fff;border:none;box-shadow:none;padding:5px}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item .k-button.left-buttons,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item .k-button.left-buttons,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item .k-button.left-buttons,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item .k-button.left-buttons,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item .k-button.left-buttons,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item .k-button.left-buttons{margin:auto 0 auto 5px}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item .k-button .k-grid-button,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item .k-button .k-grid-button,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item .k-button .k-grid-button,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item .k-button .k-grid-button,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item .k-button .k-grid-button,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item .k-button .k-grid-button{padding:0 6px}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item .k-button fa-icon,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item .k-button fa-icon,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item .k-button fa-icon,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item .k-button fa-icon,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item .k-button fa-icon,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item .k-button fa-icon{color:var(--ion-color-primary)}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item .k-button .k-icon,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item .k-button .k-icon,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item .k-button .k-icon,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item .k-button .k-icon,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item .k-button .k-icon,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item .k-button .k-icon{font-size:calc(var(--button-font-size) + 8px)}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item .k-button .k-icon-with-text,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item .k-button .k-icon-with-text,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item .k-button .k-icon-with-text,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item .k-button .k-icon-with-text,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item .k-button .k-icon-with-text,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item .k-button .k-icon-with-text{margin-right:2px;font-size:calc(var(--button-font-size) + 2px);padding-bottom:3px}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item .k-button:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item .k-button:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item .k-button:hover,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item .k-button:hover,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item .k-button:hover,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item .k-button:hover{background:rgba(var(--ion-color-primary-rgb),.2)}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container{margin-top:auto;padding-bottom:1px;gap:5px;display:flex}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container.with-grid-title,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container.with-grid-title,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container.with-grid-title,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container.with-grid-title,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container.with-grid-title,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container.with-grid-title{margin-left:10px;border-left:1px solid #c9c9c9;padding-left:8px}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text{height:18px;gap:8px;display:flex;margin:auto}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .k-i-file-excel,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .k-i-file-excel,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .k-i-file-excel,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .k-i-file-excel,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .k-i-file-excel,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .k-i-file-excel{margin-top:-1px;font-size:calc(var(--button-font-size) + 6px)}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .export-to-excel-button-text,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .export-to-excel-button-text,:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .export-to-excel-button-text,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .export-to-excel-button-text,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-left-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .export-to-excel-button-text,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.toolbar-right-item>.toolbar-left-item-second-container .k-button.k-grid-excel>.k-button-text .export-to-excel-button-text{margin:auto}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container{flex:1 1 100%;border:1px solid var(--ion-app-seperator-line-color);display:grid}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.normal-filter-container,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.normal-filter-container{display:grid;grid-template-columns:80% 20%;width:100%}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons{display:flex;margin:auto 5px auto auto;padding:0 5px;position:relative}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons.filter-field-layout-type2,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons.filter-field-layout-type2{top:12px}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons>ion-button,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons>ion-button{font-size:var(--button-font-size);margin-left:10px;height:calc(var(--input-field-height) + 2px)}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons>ion-button.toggleOn,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons>ion-button.toggleOn{--background: rgba(var(--ion-color-primary-rgb), 15%);--background-hover: rgba(var(--ion-color-primary-rgb), 10%);--color: var(--ion-color-primary);--border-color: var(--ion-color-primary)}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons>ion-button.toggleOff,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons>ion-button.toggleOff{--background: var(--disabled-input-field-backgroundcolor);--border-color: var(--z-placeholder-color);--color: var(--z-placeholder-color);--background-hover: #efefef}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons>ion-button .btn-label,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.normal-filter-container>.filter-buttons>ion-button .btn-label{padding-left:5px}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.adv-filter-container,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.adv-filter-container{margin-top:10px}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.adv-filter-container>.adv-filter-seperator,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.adv-filter-container>.adv-filter-seperator{width:100%;height:calc(var(--content-font-size) - 1px);border-bottom:1px solid var(--ion-color-primary);text-align:center}:host ::ng-deep kendo-treelist.desktop-grid .k-toolbar>.filter-container>.adv-filter-container>.adv-filter-seperator span,:host ::ng-deep kendo-grid.desktop-grid .k-toolbar>.filter-container>.adv-filter-container>.adv-filter-seperator span{font-size:calc(var(--content-font-size) + 3px);background:#fff;padding:0 20px;color:var(--ion-color-primary);font-weight:600}:host ::ng-deep kendo-treelist.desktop-grid.toolbar-no-border .k-toolbar,:host ::ng-deep kendo-grid.desktop-grid.toolbar-no-border .k-toolbar{margin-bottom:0;border-width:0px}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-aria-root,:host ::ng-deep kendo-grid.desktop-grid .k-grid-aria-root{border:1px solid var(--ion-color-primary);border-radius:5px 5px 0 0}:host ::ng-deep kendo-treelist.desktop-grid.hiden-pager .k-grid-aria-root,:host ::ng-deep kendo-grid.desktop-grid.hiden-pager .k-grid-aria-root{border-radius:5px}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header{font-weight:600;font-size:var(--grid-header-font-size);background:rgba(var(--ion-color-primary-rgb),.25);color:#000}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-cell-inner>.k-link,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-cell-inner>.k-link{padding:12px 12px 8px}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-grid-filter,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-header-column-menu,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-hierarchy-cell .k-icon,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-grid-filter.k-active,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-header-column-menu.k-active,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-hierarchy-cell .k-icon.k-active .k-grid-filter.k-state-active,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-header-column-menu.k-state-active,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-hierarchy-cell .k-icon.k-state-active,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-grid-filter,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-header-column-menu,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-hierarchy-cell .k-icon,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-grid-filter.k-active,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-header-column-menu.k-active,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-hierarchy-cell .k-icon.k-active .k-grid-filter.k-state-active,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-header-column-menu.k-state-active,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-hierarchy-cell .k-icon.k-state-active{color:#000;background:transparent}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-filtercell .k-dropdown .k-dropdown-wrap,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-filtercell .k-dropdowntree .k-dropdown-wrap,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-filtercell .k-dropdown .k-dropdown-wrap,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-filtercell .k-dropdowntree .k-dropdown-wrap{background:var(--ion-color-primary-contrast);color:var(--ion-color-primary-shade)}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-filtercell .k-dropdown .k-button,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-filtercell .k-dropdowntree .k-button,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-filtercell .k-dropdown .k-button,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-filtercell .k-dropdowntree .k-button{color:var(--ion-color-primary-shade)}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-filtercell>.k-filtercell-wrapper>.k-filtercell-operator,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-filtercell>.k-filtercell-wrapper>.k-filtercell-operator{display:flex}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-header .k-filtercell>.k-filtercell-wrapper>.k-filtercell-operator>.k-button.k-clear-button-visible,:host ::ng-deep kendo-grid.desktop-grid .k-grid-header .k-filtercell>.k-filtercell-wrapper>.k-filtercell-operator>.k-button.k-clear-button-visible{margin-left:4px}:host ::ng-deep kendo-treelist.desktop-grid tbody>tr,:host ::ng-deep kendo-grid.desktop-grid tbody>tr{background:rgba(var(--ion-color-primary-rgb),.08);font-size:var(--grid-cell-font-size)}:host ::ng-deep kendo-treelist.desktop-grid tbody>tr.k-alt,:host ::ng-deep kendo-grid.desktop-grid tbody>tr.k-alt{background:rgba(var(--ion-color-primary-rgb),.01)}:host ::ng-deep kendo-treelist.desktop-grid tbody>td.k-selected,:host ::ng-deep kendo-treelist.desktop-grid tbody>td.k-selected.k-alt,:host ::ng-deep kendo-treelist.desktop-grid tbody>tr.k-selected>td,:host ::ng-deep kendo-treelist.desktop-grid tbody>tr.k-selected.k-alt>td,:host ::ng-deep kendo-treelist.desktop-grid tbody>td.k-state-selected,:host ::ng-deep kendo-treelist.desktop-grid tbody>td.k-state-selected.k-alt,:host ::ng-deep kendo-treelist.desktop-grid tbody>tr.k-state-selected>td,:host ::ng-deep kendo-treelist.desktop-grid tbody>tr.k-state-selected.k-alt>td,:host ::ng-deep kendo-grid.desktop-grid tbody>td.k-selected,:host ::ng-deep kendo-grid.desktop-grid tbody>td.k-selected.k-alt,:host ::ng-deep kendo-grid.desktop-grid tbody>tr.k-selected>td,:host ::ng-deep kendo-grid.desktop-grid tbody>tr.k-selected.k-alt>td,:host ::ng-deep kendo-grid.desktop-grid tbody>td.k-state-selected,:host ::ng-deep kendo-grid.desktop-grid tbody>td.k-state-selected.k-alt,:host ::ng-deep kendo-grid.desktop-grid tbody>tr.k-state-selected>td,:host ::ng-deep kendo-grid.desktop-grid tbody>tr.k-state-selected.k-alt>td{background:rgba(var(--ion-color-secondary-rgb),.8);color:var(--ion-color-secondary-contrast);font-weight:600}:host ::ng-deep kendo-treelist.desktop-grid tbody>tr:hover,:host ::ng-deep kendo-treelist.desktop-grid tbody>tr.k-hover,:host ::ng-deep kendo-treelist.desktop-grid tbody>tr.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid tbody>tr:hover,:host ::ng-deep kendo-grid.desktop-grid tbody>tr.k-hover,:host ::ng-deep kendo-grid.desktop-grid tbody>tr.k-state-hover{background-color:rgba(var(--ion-color-secondary-rgb),.15)}:host ::ng-deep kendo-treelist.desktop-grid tbody td>.gridCell>span>div>span,:host ::ng-deep kendo-grid.desktop-grid tbody td>.gridCell>span>div>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager{background-color:rgba(var(--ion-color-primary-rgb),.25);color:#000;border:1px solid var(--ion-color-primary);border-top:none;border-radius:0 0 5px 5px;font-size:calc(var(--grid-cell-font-size) - 2px);padding:2px 10px}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link{color:#000;border-radius:5px}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-hover :host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-hover{color:#fff;background-image:linear-gradient(rgba(var(--ion-color-primary-rgb),.7),rgba(var(--ion-color-primary-rgb),.8))}:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-selected,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-selected:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-selected.k-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-selected,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-selected:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-selected.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-selected,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-selected:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-selected.k-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-state-selected,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-state-selected:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-refresh.k-state-selected.k-state-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-selected,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-selected:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-selected.k-hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-selected,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-selected:hover,:host ::ng-deep kendo-treelist.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-selected.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-selected,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-selected:hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-selected.k-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-selected,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-selected:hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-numbers .k-link.k-state-selected.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-selected,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-selected:hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-selected.k-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-state-selected,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-state-selected:hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-refresh.k-state-selected.k-state-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-selected,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-selected:hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-selected.k-hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-selected,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-selected:hover,:host ::ng-deep kendo-grid.desktop-grid .k-grid-pager .k-pager-nav.k-link.k-state-selected.k-state-hover{color:var(--ion-color-primary);background:var(--ion-color-primary-contrast);font-weight:600}:host ::ng-deep kendo-treelist.desktop-grid.cellWrapText td>.gridCell>span>div>span,:host ::ng-deep kendo-grid.desktop-grid.cellWrapText td>.gridCell>span>div>span{white-space:pre-line}:host ::ng-deep kendo-treelist .cellStyleConditionDefault,:host ::ng-deep kendo-grid .cellStyleConditionDefault{border-radius:5px;text-align:center}:host ::ng-deep kendo-treelist .rightAligned,:host ::ng-deep kendo-grid .rightAligned{text-align:right}:host ::ng-deep kendo-treelist .centerAligned,:host ::ng-deep kendo-grid .centerAligned{text-align:center}.gridTitle{font-size:calc(var(--grid-header-font-size) + 8px);font-weight:700;margin:auto 5px;color:var(--ion-color-dark);padding-top:2px;display:inherit}.gridTitleIcon{color:var(--ion-color-dark);font-size:calc(var(--grid-header-font-size) + 2px);display:block;margin:auto 0;padding-top:2px}.refresh-btn{zoom:.8}.refresh-btn>.k-i-refresh-sm{transform:rotate(30deg);font-size:1.4rem}.toolbar-left-item{flex-grow:1;display:flex}.toolbar-right-item{bottom:2px;position:relative}.gridCell.primary{color:var(--ion-color-primary)}.gridCell.secondary{color:var(--ion-color-dark)}.gridCell.tertiary{color:var(--ion-color-tertiary)}.gridCell.success{color:var(--ion-color-success-shade)}.gridCell.warning{color:var(--ion-color-warning)}.gridCell.danger{color:var(--ion-color-danger)}.gridCell.dark{color:var(--ion-color-dark)}.gridCell.medium{color:var(--ion-color-medium)}.gridCell.light{color:var(--ion-color-light)}.k-i-loading{position:absolute;inset:100px 0 0;font-size:45px;background-color:#ffffff4d;color:#0f4800}\n"] }]
|
|
12291
12368
|
}], ctorParameters: function () { return [{ type: ZComponentService }, { type: i2.FieldService }, { type: i2.WebApiService }, { type: i1.ActivatedRoute }, { type: i1.Router }, { type: i2.AuthService }]; }, propDecorators: { tooltipDir: [{
|
|
12292
12369
|
type: ViewChild,
|
|
12293
12370
|
args: [TooltipDirective]
|
|
@@ -13463,7 +13540,7 @@ class ZprogressbarComponent extends FieldBase {
|
|
|
13463
13540
|
}
|
|
13464
13541
|
}
|
|
13465
13542
|
ZprogressbarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: ZprogressbarComponent, deps: [{ token: ZComponentService }], target: i0.ɵɵFactoryTarget.Component });
|
|
13466
|
-
ZprogressbarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.3", type: ZprogressbarComponent, selector: "app-zprogressbar", usesInheritance: true, ngImport: i0, template: "<div *ngIf=\"(!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible)\"\r\n [style]=\"componentProperties.style.style\" class=\"e1tag-style\">\r\n <div class=\"top-title e1tag-style1\" [style]=\"componentProperties.style.style1\" *ngIf=\"data.Label\">\r\n {{data.Label}}\r\n </div>\r\n <kendo-progressbar [min]=\"minValue\" [max]=\"maxValue\" [indeterminate]=\"options.indeterminate\" [value]=\"value\" class=\"e1tag-style2\"\r\n [style]=\"componentProperties.style.style2\" [progressCssStyle]=\"options.progressStyles\"\r\n [emptyCssStyle]=\"options.emptyStyles\" [label]=\"options.label\" [animation]=\"options.animation\"></kendo-progressbar>\r\n</div>\r\n", styles: [""], components: [{ type: i2$
|
|
13543
|
+
ZprogressbarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.3", type: ZprogressbarComponent, selector: "app-zprogressbar", usesInheritance: true, ngImport: i0, template: "<div *ngIf=\"(!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible)\"\r\n [style]=\"componentProperties.style.style\" class=\"e1tag-style\">\r\n <div class=\"top-title e1tag-style1\" [style]=\"componentProperties.style.style1\" *ngIf=\"data.Label\">\r\n {{data.Label}}\r\n </div>\r\n <kendo-progressbar [min]=\"minValue\" [max]=\"maxValue\" [indeterminate]=\"options.indeterminate\" [value]=\"value\" class=\"e1tag-style2\"\r\n [style]=\"componentProperties.style.style2\" [progressCssStyle]=\"options.progressStyles\"\r\n [emptyCssStyle]=\"options.emptyStyles\" [label]=\"options.label\" [animation]=\"options.animation\"></kendo-progressbar>\r\n</div>\r\n", styles: [""], components: [{ type: i2$c.ProgressBarComponent, selector: "kendo-progressbar", inputs: ["label", "progressCssStyle", "progressCssClass", "emptyCssStyle", "emptyCssClass", "animation"], outputs: ["animationEnd"], exportAs: ["kendoProgressBar"] }], directives: [{ type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
13467
13544
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: ZprogressbarComponent, decorators: [{
|
|
13468
13545
|
type: Component,
|
|
13469
13546
|
args: [{ selector: 'app-zprogressbar', template: "<div *ngIf=\"(!!componentProperties.isVisibleField ? group[componentProperties.isVisibleField] : componentProperties.isVisible)\"\r\n [style]=\"componentProperties.style.style\" class=\"e1tag-style\">\r\n <div class=\"top-title e1tag-style1\" [style]=\"componentProperties.style.style1\" *ngIf=\"data.Label\">\r\n {{data.Label}}\r\n </div>\r\n <kendo-progressbar [min]=\"minValue\" [max]=\"maxValue\" [indeterminate]=\"options.indeterminate\" [value]=\"value\" class=\"e1tag-style2\"\r\n [style]=\"componentProperties.style.style2\" [progressCssStyle]=\"options.progressStyles\"\r\n [emptyCssStyle]=\"options.emptyStyles\" [label]=\"options.label\" [animation]=\"options.animation\"></kendo-progressbar>\r\n</div>\r\n", styles: [""] }]
|
|
@@ -14433,10 +14510,10 @@ class KScrollViewComponent extends ContainerFieldBase {
|
|
|
14433
14510
|
}
|
|
14434
14511
|
}
|
|
14435
14512
|
KScrollViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: KScrollViewComponent, deps: [{ token: ZComponentService }], target: i0.ɵɵFactoryTarget.Component });
|
|
14436
|
-
KScrollViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.3", type: KScrollViewComponent, selector: "app-kscrollview", usesInheritance: true, ngImport: i0, template: "<div class=\"kscrollview-container\" [style]=\"componentProperties.containerStyle.style\" class=\"e1tag-container-style\"\r\n *ngIf=\"!isLoading\">\r\n <kendo-scrollview [style]=\"componentProperties.containerStyle.style1\" class=\"e1tag-container-style1 scrollview\"\r\n [ngClass]=\"data.Class\" [data]=\"panelItems\" [arrows]=\"options.arrows\" [pageable]=\"options.pageAble\"\r\n [endless]=\"options.endless\">\r\n <ng-template let-item=\"item\">\r\n <div [style]=\"componentProperties.containerStyle.style2\" class=\"e1tag-container-style2\" (click)=\"onItemClick($event, item)\">\r\n <div [style]=\"componentProperties.containerStyle.style3\" class=\"e1tag-container-style3 kscrollview-title\">\r\n {{item.Label}}\r\n </div>\r\n <img [src]='item.SourceUrl' [alt]='item.Label' [style]=\"componentProperties.containerStyle.style4\"\r\n class=\"e1tag-container-style4\" draggable=\"true\" />\r\n </div>\r\n </ng-template>\r\n </kendo-scrollview>\r\n</div>\r\n", styles: [".k-scrollview-wrap{margin:0 auto}.kscrollview-title{position:absolute;top:0;left:0;right:0;margin:0;padding:8px 8px 10px;color:#fff;background:linear-gradient(rgba(0,0,0,.8)
|
|
14513
|
+
KScrollViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.3", type: KScrollViewComponent, selector: "app-kscrollview", usesInheritance: true, ngImport: i0, template: "<div class=\"kscrollview-container\" [style]=\"componentProperties.containerStyle.style\" class=\"e1tag-container-style\"\r\n *ngIf=\"!isLoading\">\r\n <kendo-scrollview [style]=\"componentProperties.containerStyle.style1\" class=\"e1tag-container-style1 scrollview\"\r\n [ngClass]=\"data.Class\" [data]=\"panelItems\" [arrows]=\"options.arrows\" [pageable]=\"options.pageAble\"\r\n [endless]=\"options.endless\">\r\n <ng-template let-item=\"item\">\r\n <div [style]=\"componentProperties.containerStyle.style2\" class=\"e1tag-container-style2\" (click)=\"onItemClick($event, item)\">\r\n <div [style]=\"componentProperties.containerStyle.style3\" class=\"e1tag-container-style3 kscrollview-title\">\r\n {{item.Label}}\r\n </div>\r\n <img [src]='item.SourceUrl' [alt]='item.Label' [style]=\"componentProperties.containerStyle.style4\"\r\n class=\"e1tag-container-style4\" draggable=\"true\" />\r\n </div>\r\n </ng-template>\r\n </kendo-scrollview>\r\n</div>\r\n", styles: [".k-scrollview-wrap{margin:0 auto}.kscrollview-title{position:absolute;top:0;left:0;right:0;margin:0;padding:8px 8px 10px;color:#fff;background:linear-gradient(rgba(0,0,0,.8),#cacaca78);text-align:center;font-size:16px}.scrollview{height:400px}.title-bottom .kscrollview-title{top:unset;bottom:0;background:linear-gradient(#cacaca78,rgba(0,0,0,.8));padding-bottom:15px;padding-top:10px}.show-title-when-hover .kscrollview-title{opacity:0;transition:opacity .5s}.show-title-when-hover:hover .kscrollview-title{opacity:1;transition:opacity .5s}\n"], components: [{ type: i2$d.ScrollViewComponent, selector: "kendo-scrollview", inputs: ["data", "activeIndex", "width", "height", "endless", "pagerOverlay", "animate", "pageable", "arrows"], outputs: ["itemChanged", "activeIndexChange"], exportAs: ["kendoScrollView"] }], directives: [{ type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i7.DefaultClassDirective, selector: " [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl], [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl], [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }] });
|
|
14437
14514
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: KScrollViewComponent, decorators: [{
|
|
14438
14515
|
type: Component,
|
|
14439
|
-
args: [{ selector: "app-kscrollview", template: "<div class=\"kscrollview-container\" [style]=\"componentProperties.containerStyle.style\" class=\"e1tag-container-style\"\r\n *ngIf=\"!isLoading\">\r\n <kendo-scrollview [style]=\"componentProperties.containerStyle.style1\" class=\"e1tag-container-style1 scrollview\"\r\n [ngClass]=\"data.Class\" [data]=\"panelItems\" [arrows]=\"options.arrows\" [pageable]=\"options.pageAble\"\r\n [endless]=\"options.endless\">\r\n <ng-template let-item=\"item\">\r\n <div [style]=\"componentProperties.containerStyle.style2\" class=\"e1tag-container-style2\" (click)=\"onItemClick($event, item)\">\r\n <div [style]=\"componentProperties.containerStyle.style3\" class=\"e1tag-container-style3 kscrollview-title\">\r\n {{item.Label}}\r\n </div>\r\n <img [src]='item.SourceUrl' [alt]='item.Label' [style]=\"componentProperties.containerStyle.style4\"\r\n class=\"e1tag-container-style4\" draggable=\"true\" />\r\n </div>\r\n </ng-template>\r\n </kendo-scrollview>\r\n</div>\r\n", styles: [".k-scrollview-wrap{margin:0 auto}.kscrollview-title{position:absolute;top:0;left:0;right:0;margin:0;padding:8px 8px 10px;color:#fff;background:linear-gradient(rgba(0,0,0,.8)
|
|
14516
|
+
args: [{ selector: "app-kscrollview", template: "<div class=\"kscrollview-container\" [style]=\"componentProperties.containerStyle.style\" class=\"e1tag-container-style\"\r\n *ngIf=\"!isLoading\">\r\n <kendo-scrollview [style]=\"componentProperties.containerStyle.style1\" class=\"e1tag-container-style1 scrollview\"\r\n [ngClass]=\"data.Class\" [data]=\"panelItems\" [arrows]=\"options.arrows\" [pageable]=\"options.pageAble\"\r\n [endless]=\"options.endless\">\r\n <ng-template let-item=\"item\">\r\n <div [style]=\"componentProperties.containerStyle.style2\" class=\"e1tag-container-style2\" (click)=\"onItemClick($event, item)\">\r\n <div [style]=\"componentProperties.containerStyle.style3\" class=\"e1tag-container-style3 kscrollview-title\">\r\n {{item.Label}}\r\n </div>\r\n <img [src]='item.SourceUrl' [alt]='item.Label' [style]=\"componentProperties.containerStyle.style4\"\r\n class=\"e1tag-container-style4\" draggable=\"true\" />\r\n </div>\r\n </ng-template>\r\n </kendo-scrollview>\r\n</div>\r\n", styles: [".k-scrollview-wrap{margin:0 auto}.kscrollview-title{position:absolute;top:0;left:0;right:0;margin:0;padding:8px 8px 10px;color:#fff;background:linear-gradient(rgba(0,0,0,.8),#cacaca78);text-align:center;font-size:16px}.scrollview{height:400px}.title-bottom .kscrollview-title{top:unset;bottom:0;background:linear-gradient(#cacaca78,rgba(0,0,0,.8));padding-bottom:15px;padding-top:10px}.show-title-when-hover .kscrollview-title{opacity:0;transition:opacity .5s}.show-title-when-hover:hover .kscrollview-title{opacity:1;transition:opacity .5s}\n"] }]
|
|
14440
14517
|
}], ctorParameters: function () { return [{ type: ZComponentService }]; } });
|
|
14441
14518
|
|
|
14442
14519
|
class FiconComponent {
|
|
@@ -14471,7 +14548,7 @@ class FiconComponent {
|
|
|
14471
14548
|
}
|
|
14472
14549
|
}
|
|
14473
14550
|
FiconComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: FiconComponent, deps: [{ token: i2.FontAweSomeService }], target: i0.ɵɵFactoryTarget.Component });
|
|
14474
|
-
FiconComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.3", type: FiconComponent, selector: "app-ficon", inputs: { data: "data", group: "group", form: "form" }, ngImport: i0, template: "<div> \r\n <div class=\"search-box\">\r\n <kendo-floatinglabel [labelCssClass]=\"'custom-label-class'\"\r\n text=\"Search icons\">\r\n <kendo-textbox [(ngModel)]=\"searchTerm\"\r\n (ngModelChange)=\"filterIcon(searchTerm)\"\r\n placeholder=\"Search icons\"\r\n [clearButton]=\"true\"\r\n [rounded]=\"rounded\"\r\n [style.width.px]=\"480\">\r\n </kendo-textbox>\r\n </kendo-floatinglabel> \r\n </div>\r\n\r\n <ul class=\"icons-wrapper\">\r\n <li *ngFor=\"let icon of filteredIcons\" class=\"icon-item\">\r\n <fa-icon [icon]=\"icon.definition\" size=\"3x\"></fa-icon>\r\n <div class=\"icon-name\" style=\"text-align:center\">{{ icon.formattedName }}</div>\r\n </li>\r\n </ul>\r\n</div>\r\n", styles: [".icons-wrapper{display:flex;flex-wrap:wrap;justify-content:center;list-style:none;padding:1em;margin:1em}.icon-item{display:flex;flex-direction:column;align-items:center;margin:0 8px 16px 0;width:150px;height:100px;text-align:center;font-size:12px;box-shadow:0 4px 8px #0000001a;border-radius:8px;padding:12px;background-color:#f5f5f5}.icon-item kendo-svgicon{margin-bottom:8px}.icon-name{word-spacing:100px;white-space:initial;max-width:150px;padding-top:1em}.k-icon{display:block;clear:both;margin:0 auto 10px;color:#656565;font-size:32px}.custom-label-class{margin-left:30px}.search-box{display:flex;justify-content:center;margin-top:30px;margin-bottom:20px}\n"], components: [{ type:
|
|
14551
|
+
FiconComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.3", type: FiconComponent, selector: "app-ficon", inputs: { data: "data", group: "group", form: "form" }, ngImport: i0, template: "<div> \r\n <div class=\"search-box\">\r\n <kendo-floatinglabel [labelCssClass]=\"'custom-label-class'\"\r\n text=\"Search icons\">\r\n <kendo-textbox [(ngModel)]=\"searchTerm\"\r\n (ngModelChange)=\"filterIcon(searchTerm)\"\r\n placeholder=\"Search icons\"\r\n [clearButton]=\"true\"\r\n [rounded]=\"rounded\"\r\n [style.width.px]=\"480\">\r\n </kendo-textbox>\r\n </kendo-floatinglabel> \r\n </div>\r\n\r\n <ul class=\"icons-wrapper\">\r\n <li *ngFor=\"let icon of filteredIcons\" class=\"icon-item\">\r\n <fa-icon [icon]=\"icon.definition\" size=\"3x\"></fa-icon>\r\n <div class=\"icon-name\" style=\"text-align:center\">{{ icon.formattedName }}</div>\r\n </li>\r\n </ul>\r\n</div>\r\n", styles: [".icons-wrapper{display:flex;flex-wrap:wrap;justify-content:center;list-style:none;padding:1em;margin:1em}.icon-item{display:flex;flex-direction:column;align-items:center;margin:0 8px 16px 0;width:150px;height:100px;text-align:center;font-size:12px;box-shadow:0 4px 8px #0000001a;border-radius:8px;padding:12px;background-color:#f5f5f5}.icon-item kendo-svgicon{margin-bottom:8px}.icon-name{word-spacing:100px;white-space:initial;max-width:150px;padding-top:1em}.k-icon{display:block;clear:both;margin:0 auto 10px;color:#656565;font-size:32px}.custom-label-class{margin-left:30px}.search-box{display:flex;justify-content:center;margin-top:30px;margin-bottom:20px}\n"], components: [{ type: i16.FloatingLabelComponent, selector: "kendo-floatinglabel", inputs: ["labelCssStyle", "labelCssClass", "id", "text", "optional"], outputs: ["positionChange"], exportAs: ["kendoFloatingLabel"] }, { type: i3$5.TextBoxComponent, selector: "kendo-textbox", inputs: ["focusableId", "title", "disabled", "readonly", "tabindex", "value", "selectOnFocus", "showSuccessIcon", "showErrorIcon", "clearButton", "successIcon", "errorIcon", "clearButtonIcon", "size", "rounded", "fillMode", "tabIndex", "placeholder", "maxlength"], outputs: ["valueChange", "inputFocus", "inputBlur", "focus", "blur"], exportAs: ["kendoTextBox"] }, { type: i4.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }], directives: [{ type: i4$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i4$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
|
|
14475
14552
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: FiconComponent, decorators: [{
|
|
14476
14553
|
type: Component,
|
|
14477
14554
|
args: [{ selector: 'app-ficon', template: "<div> \r\n <div class=\"search-box\">\r\n <kendo-floatinglabel [labelCssClass]=\"'custom-label-class'\"\r\n text=\"Search icons\">\r\n <kendo-textbox [(ngModel)]=\"searchTerm\"\r\n (ngModelChange)=\"filterIcon(searchTerm)\"\r\n placeholder=\"Search icons\"\r\n [clearButton]=\"true\"\r\n [rounded]=\"rounded\"\r\n [style.width.px]=\"480\">\r\n </kendo-textbox>\r\n </kendo-floatinglabel> \r\n </div>\r\n\r\n <ul class=\"icons-wrapper\">\r\n <li *ngFor=\"let icon of filteredIcons\" class=\"icon-item\">\r\n <fa-icon [icon]=\"icon.definition\" size=\"3x\"></fa-icon>\r\n <div class=\"icon-name\" style=\"text-align:center\">{{ icon.formattedName }}</div>\r\n </li>\r\n </ul>\r\n</div>\r\n", styles: [".icons-wrapper{display:flex;flex-wrap:wrap;justify-content:center;list-style:none;padding:1em;margin:1em}.icon-item{display:flex;flex-direction:column;align-items:center;margin:0 8px 16px 0;width:150px;height:100px;text-align:center;font-size:12px;box-shadow:0 4px 8px #0000001a;border-radius:8px;padding:12px;background-color:#f5f5f5}.icon-item kendo-svgicon{margin-bottom:8px}.icon-name{word-spacing:100px;white-space:initial;max-width:150px;padding-top:1em}.k-icon{display:block;clear:both;margin:0 auto 10px;color:#656565;font-size:32px}.custom-label-class{margin-left:30px}.search-box{display:flex;justify-content:center;margin-top:30px;margin-bottom:20px}\n"] }]
|
|
@@ -14569,7 +14646,8 @@ MmhglobalDynamicformModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.
|
|
|
14569
14646
|
KmenuComponent,
|
|
14570
14647
|
KScrollViewComponent,
|
|
14571
14648
|
ContextMenuComponent,
|
|
14572
|
-
FiconComponent
|
|
14649
|
+
FiconComponent,
|
|
14650
|
+
SfdatetimepickerComponent], imports: [IonicModule,
|
|
14573
14651
|
IonicSelectableModule,
|
|
14574
14652
|
CommonModule,
|
|
14575
14653
|
RouterModule,
|
|
@@ -14617,7 +14695,8 @@ MmhglobalDynamicformModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.
|
|
|
14617
14695
|
QueryBuilderModule,
|
|
14618
14696
|
ColorPickerModule,
|
|
14619
14697
|
ScrollViewModule,
|
|
14620
|
-
MenusModule
|
|
14698
|
+
MenusModule,
|
|
14699
|
+
DateTimePickerModule], exports: [ScrollbarThemeDirective,
|
|
14621
14700
|
FieldElementDirective,
|
|
14622
14701
|
ZGridBindingDirective,
|
|
14623
14702
|
ZGridPopupAnchorDirective,
|
|
@@ -14697,7 +14776,8 @@ MmhglobalDynamicformModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.
|
|
|
14697
14776
|
ZcolorpickerComponent,
|
|
14698
14777
|
KmenuComponent,
|
|
14699
14778
|
KScrollViewComponent,
|
|
14700
|
-
FiconComponent
|
|
14779
|
+
FiconComponent,
|
|
14780
|
+
SfdatetimepickerComponent] });
|
|
14701
14781
|
MmhglobalDynamicformModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: MmhglobalDynamicformModule, providers: [
|
|
14702
14782
|
ModalService
|
|
14703
14783
|
], imports: [[
|
|
@@ -14749,7 +14829,8 @@ MmhglobalDynamicformModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.
|
|
|
14749
14829
|
QueryBuilderModule,
|
|
14750
14830
|
ColorPickerModule,
|
|
14751
14831
|
ScrollViewModule,
|
|
14752
|
-
MenusModule
|
|
14832
|
+
MenusModule,
|
|
14833
|
+
DateTimePickerModule
|
|
14753
14834
|
]] });
|
|
14754
14835
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImport: i0, type: MmhglobalDynamicformModule, decorators: [{
|
|
14755
14836
|
type: NgModule,
|
|
@@ -14837,7 +14918,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImpor
|
|
|
14837
14918
|
KmenuComponent,
|
|
14838
14919
|
KScrollViewComponent,
|
|
14839
14920
|
ContextMenuComponent,
|
|
14840
|
-
FiconComponent
|
|
14921
|
+
FiconComponent,
|
|
14922
|
+
SfdatetimepickerComponent
|
|
14841
14923
|
],
|
|
14842
14924
|
imports: [
|
|
14843
14925
|
IonicModule,
|
|
@@ -14888,7 +14970,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImpor
|
|
|
14888
14970
|
QueryBuilderModule,
|
|
14889
14971
|
ColorPickerModule,
|
|
14890
14972
|
ScrollViewModule,
|
|
14891
|
-
MenusModule
|
|
14973
|
+
MenusModule,
|
|
14974
|
+
DateTimePickerModule
|
|
14892
14975
|
],
|
|
14893
14976
|
exports: [
|
|
14894
14977
|
ScrollbarThemeDirective,
|
|
@@ -14971,7 +15054,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImpor
|
|
|
14971
15054
|
ZcolorpickerComponent,
|
|
14972
15055
|
KmenuComponent,
|
|
14973
15056
|
KScrollViewComponent,
|
|
14974
|
-
FiconComponent
|
|
15057
|
+
FiconComponent,
|
|
15058
|
+
SfdatetimepickerComponent
|
|
14975
15059
|
],
|
|
14976
15060
|
providers: [
|
|
14977
15061
|
ModalService
|
|
@@ -14988,5 +15072,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.3", ngImpor
|
|
|
14988
15072
|
* Generated bundle index. Do not edit.
|
|
14989
15073
|
*/
|
|
14990
15074
|
|
|
14991
|
-
export { ButtonFieldBase, ContainerFieldBase, ContextMenuComponent, DataListingFieldBase, DateIonicFormatParser, DateIonicMinMaxParser, DateKendoFormatParser, DateParserFilter, DateRangeFilterCellComponent, DivzLayout, EditorFilter, ElementContainerDirective, FiconComponent, FieldBase, FieldElementDirective, HtmlSanitizePipe, InputErrorMessageComponent, InputFieldAddOnsComponent, InputFieldBase, KScrollViewComponent, KcardComponent, KmenuComponent, KsplitterComponent, MainService, MmhglobalDynamicformModule, MyFileInfo, OpenOnFocusDirective, PageLoaderComponent, PanelAreaFilter, ProcessingRecordLoaderComponent, ScrollbarThemeDirective, SfquerybuilderComponent, SpinnerComponent, TabFilter, UiactionbuttonComponent, UiappmenucontentComponent, UibulletinComponent, UicontainerComponent, UicontentComponent, UiheaderComponent, UimenubuttonComponent, UimenucontentComponent, UipageComponent, UivalidationmessageComponent, VirtualScrollComponent, ZBulletComponent, ZChipComponent, ZComponentService, ZGridBindingDirective, ZGridPopupAnchorDirective, ZInputContainerComponent, ZInputParser, ZNumericParser, ZSchedulerToolBarComponent, ZSelectTranslationParser, ZTreeListOptions, ZbuttonsComponent, ZcardComponent, ZchartComponent, ZcheckboxComponent, ZcodeeditorComponent, ZcolorpickerComponent, ZdaterangeComponent, ZdatetimeComponent, ZdivComponent, ZformComponent, ZformcontrolComponent, ZgaugeComponent, ZgridComponent, ZgridContainerComponent, ZimgComponent, ZlabelComponent, ZloopComponent, ZmfbComponent, ZmodalComponent, ZmodalMobileComponent, ZnumericComponent, ZpostselectinputComponent, ZprogressbarComponent, ZreportComponent, ZschedulerComponent, ZselectmultipleComponent, ZtabComponent, ZtextComponent, ZtextareaComponent, ZtexteditorComponent, ZtreeComponent, ZtreelistComponent, ZtrendcardComponent, ZudfComponent, ZunknownComponent, ZuploadComponent, ZworkflowbuttonsComponent, refreshGrid };
|
|
15075
|
+
export { ButtonFieldBase, ContainerFieldBase, ContextMenuComponent, DataListingFieldBase, DateIonicFormatParser, DateIonicMinMaxParser, DateKendoFormatParser, DateParserFilter, DateRangeFilterCellComponent, DivzLayout, EditorFilter, ElementContainerDirective, FiconComponent, FieldBase, FieldElementDirective, HtmlSanitizePipe, InputErrorMessageComponent, InputFieldAddOnsComponent, InputFieldBase, KScrollViewComponent, KcardComponent, KmenuComponent, KsplitterComponent, MainService, MmhglobalDynamicformModule, MyFileInfo, OpenOnFocusDirective, PageLoaderComponent, PanelAreaFilter, ProcessingRecordLoaderComponent, ScrollbarThemeDirective, SfdatetimepickerComponent, SfquerybuilderComponent, SpinnerComponent, TabFilter, UiactionbuttonComponent, UiappmenucontentComponent, UibulletinComponent, UicontainerComponent, UicontentComponent, UiheaderComponent, UimenubuttonComponent, UimenucontentComponent, UipageComponent, UivalidationmessageComponent, VirtualScrollComponent, ZBulletComponent, ZChipComponent, ZComponentService, ZGridBindingDirective, ZGridPopupAnchorDirective, ZInputContainerComponent, ZInputParser, ZNumericParser, ZSchedulerToolBarComponent, ZSelectTranslationParser, ZTreeListOptions, ZbuttonsComponent, ZcardComponent, ZchartComponent, ZcheckboxComponent, ZcodeeditorComponent, ZcolorpickerComponent, ZdaterangeComponent, ZdatetimeComponent, ZdivComponent, ZformComponent, ZformcontrolComponent, ZgaugeComponent, ZgridComponent, ZgridContainerComponent, ZimgComponent, ZlabelComponent, ZloopComponent, ZmfbComponent, ZmodalComponent, ZmodalMobileComponent, ZnumericComponent, ZpostselectinputComponent, ZprogressbarComponent, ZreportComponent, ZschedulerComponent, ZselectmultipleComponent, ZtabComponent, ZtextComponent, ZtextareaComponent, ZtexteditorComponent, ZtreeComponent, ZtreelistComponent, ZtrendcardComponent, ZudfComponent, ZunknownComponent, ZuploadComponent, ZworkflowbuttonsComponent, refreshGrid };
|
|
14992
15076
|
//# sourceMappingURL=mmhglobal-dynamicform.mjs.map
|