ets-fe-ng-sdk 19.0.9 → 19.0.10
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fesm2022/ets-fe-ng-sdk.mjs +53 -58
- package/fesm2022/ets-fe-ng-sdk.mjs.map +1 -1
- package/lib/Reusables/reusable-comps/find-item/find-item.component.d.ts +2 -1
- package/lib/Services/utility.service.d.ts +1 -1
- package/lib/Shared/components/btn/btn.component.d.ts +2 -2
- package/lib/Shared/components/index-comp-layout/index-comp-layout.component.d.ts +1 -1
- package/lib/Shared/components/table/table-https/table-https.component.d.ts +3 -3
- package/lib/Shared/components/vertical-nav/vertical-nav.component.d.ts +1 -6
- package/package.json +1 -1
|
@@ -15145,7 +15145,7 @@ class TableBaseComponent {
|
|
|
15145
15145
|
// const dateFields = { createdOn: 1, updatedOn: 1 };
|
|
15146
15146
|
for (let index = 0; index < columns.length; index++) {
|
|
15147
15147
|
const item = columns[index];
|
|
15148
|
-
item.customTemplate = customTemplates?.[item.f];
|
|
15148
|
+
item.customTemplate = item.customTemplate || customTemplates?.[item.f];
|
|
15149
15149
|
if (!(item.previewOnHover === false ||
|
|
15150
15150
|
(!item.onHoverHandler && !this.tS.generalColumnPropMap[item.f]?.onHoverHandler))) {
|
|
15151
15151
|
item._onHoverFunction = (event, row) => (item.onHoverHandler || this.tS.generalColumnPropMap[item.f]?.onHoverHandler).action(row, event);
|
|
@@ -15294,7 +15294,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0", ngImpor
|
|
|
15294
15294
|
type: Component,
|
|
15295
15295
|
args: [{
|
|
15296
15296
|
template: '',
|
|
15297
|
-
imports: []
|
|
15297
|
+
imports: [],
|
|
15298
15298
|
}]
|
|
15299
15299
|
}], propDecorators: { _rowClick: [{
|
|
15300
15300
|
type: Output,
|
|
@@ -16181,8 +16181,8 @@ class VerticalNavComponent {
|
|
|
16181
16181
|
this.uS = inject(UtilityService);
|
|
16182
16182
|
this.router = inject(Router);
|
|
16183
16183
|
this.shouldShowChildInput = input();
|
|
16184
|
-
|
|
16185
|
-
|
|
16184
|
+
// readonly autoExpandToCurrentPage = input<boolean>();
|
|
16185
|
+
// readonly autoExpandToCurrentPageMatcher = input<(menuItem: IMenuItem) => boolean>();
|
|
16186
16186
|
this.shouldShowChild = computed(() => this.shouldShowChildInput() || (() => true));
|
|
16187
16187
|
this.toolbarTitle = input();
|
|
16188
16188
|
this.toolbarLogo = input();
|
|
@@ -16208,6 +16208,47 @@ class VerticalNavComponent {
|
|
|
16208
16208
|
this.treeControl = signal(new NestedTreeControl((node) => node.subs));
|
|
16209
16209
|
this.drawer = viewChild('snav');
|
|
16210
16210
|
this.toolbarContRef = viewChild('toolbarCont');
|
|
16211
|
+
// protected currentMenuItem: IMenuItem;
|
|
16212
|
+
// protected _expandToCurrentPage(menu: IMenuItem[]) {
|
|
16213
|
+
// if (this.currentMenuItem) return;
|
|
16214
|
+
// const autoExpandToCurrentPageMatcher = this.autoExpandToCurrentPageMatcher();
|
|
16215
|
+
// for (const x of menu) {
|
|
16216
|
+
// if (this.currentMenuItem) break;
|
|
16217
|
+
// if (autoExpandToCurrentPageMatcher(x)) {
|
|
16218
|
+
// this.treeControl().expand(x);
|
|
16219
|
+
// this.currentMenuItem = x;
|
|
16220
|
+
// return;
|
|
16221
|
+
// }else if(x.subs)this._expandToCurrentPage(x.subs)
|
|
16222
|
+
// }
|
|
16223
|
+
// }
|
|
16224
|
+
// expandToCurrentPage() {
|
|
16225
|
+
// const autoExpandToCurrentPageMatcher = this.autoExpandToCurrentPageMatcher();
|
|
16226
|
+
// let currentMenuList = this.menuItems();
|
|
16227
|
+
// if (autoExpandToCurrentPageMatcher) {
|
|
16228
|
+
// this._expandToCurrentPage(currentMenuList);
|
|
16229
|
+
// } else {
|
|
16230
|
+
// const path = location.pathname;
|
|
16231
|
+
// if (!(path?.length > 1)) return;
|
|
16232
|
+
// for (const x of currentMenuList) {
|
|
16233
|
+
// if (x.link == path) {
|
|
16234
|
+
// this.treeControl().expand(x);
|
|
16235
|
+
// return;
|
|
16236
|
+
// }
|
|
16237
|
+
// }
|
|
16238
|
+
// for (const x of currentMenuList) {
|
|
16239
|
+
// if (x.link.endsWith(path)) {
|
|
16240
|
+
// this.treeControl().expand(x);
|
|
16241
|
+
// return;
|
|
16242
|
+
// }
|
|
16243
|
+
// }
|
|
16244
|
+
// for (const x of currentMenuList) {
|
|
16245
|
+
// if (x.link.startsWith(path)) {
|
|
16246
|
+
// this.treeControl().expand(x);
|
|
16247
|
+
// return;
|
|
16248
|
+
// }
|
|
16249
|
+
// }
|
|
16250
|
+
// }
|
|
16251
|
+
// }
|
|
16211
16252
|
this.hasChild = signal((_, node) => node.subs?.length && this.shouldShowChild()(_, node));
|
|
16212
16253
|
}
|
|
16213
16254
|
ngAfterViewInit() {
|
|
@@ -16221,59 +16262,12 @@ class VerticalNavComponent {
|
|
|
16221
16262
|
minScrollbarLength: 40,
|
|
16222
16263
|
});
|
|
16223
16264
|
}
|
|
16224
|
-
setTimeout(() => {
|
|
16225
|
-
|
|
16226
|
-
|
|
16227
|
-
}, 500);
|
|
16228
|
-
}
|
|
16229
|
-
_expandToCurrentPage(menu) {
|
|
16230
|
-
if (this.currentMenuItem)
|
|
16231
|
-
return;
|
|
16232
|
-
const autoExpandToCurrentPageMatcher = this.autoExpandToCurrentPageMatcher();
|
|
16233
|
-
for (const x of menu) {
|
|
16234
|
-
if (this.currentMenuItem)
|
|
16235
|
-
break;
|
|
16236
|
-
if (autoExpandToCurrentPageMatcher(x)) {
|
|
16237
|
-
this.treeControl().expand(x);
|
|
16238
|
-
this.currentMenuItem = x;
|
|
16239
|
-
return;
|
|
16240
|
-
}
|
|
16241
|
-
else if (x.subs)
|
|
16242
|
-
this._expandToCurrentPage(x.subs);
|
|
16243
|
-
}
|
|
16244
|
-
}
|
|
16245
|
-
expandToCurrentPage() {
|
|
16246
|
-
const autoExpandToCurrentPageMatcher = this.autoExpandToCurrentPageMatcher();
|
|
16247
|
-
let currentMenuList = this.menuItems();
|
|
16248
|
-
if (autoExpandToCurrentPageMatcher) {
|
|
16249
|
-
this._expandToCurrentPage(currentMenuList);
|
|
16250
|
-
}
|
|
16251
|
-
else {
|
|
16252
|
-
const path = location.pathname;
|
|
16253
|
-
if (!(path?.length > 1))
|
|
16254
|
-
return;
|
|
16255
|
-
for (const x of currentMenuList) {
|
|
16256
|
-
if (x.link == path) {
|
|
16257
|
-
this.treeControl().expand(x);
|
|
16258
|
-
return;
|
|
16259
|
-
}
|
|
16260
|
-
}
|
|
16261
|
-
for (const x of currentMenuList) {
|
|
16262
|
-
if (x.link.endsWith(path)) {
|
|
16263
|
-
this.treeControl().expand(x);
|
|
16264
|
-
return;
|
|
16265
|
-
}
|
|
16266
|
-
}
|
|
16267
|
-
for (const x of currentMenuList) {
|
|
16268
|
-
if (x.link.startsWith(path)) {
|
|
16269
|
-
this.treeControl().expand(x);
|
|
16270
|
-
return;
|
|
16271
|
-
}
|
|
16272
|
-
}
|
|
16273
|
-
}
|
|
16265
|
+
// setTimeout(() => {
|
|
16266
|
+
// if (this.autoExpandToCurrentPage()) this.expandToCurrentPage();
|
|
16267
|
+
// }, 500);
|
|
16274
16268
|
}
|
|
16275
16269
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: VerticalNavComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
16276
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.0", type: VerticalNavComponent, isStandalone: true, selector: "vertical-nav", inputs: { shouldShowChildInput: { classPropertyName: "shouldShowChildInput", publicName: "shouldShowChildInput", isSignal: true, isRequired: false, transformFunction: null }, autoExpandToCurrentPage: { classPropertyName: "autoExpandToCurrentPage", publicName: "autoExpandToCurrentPage", isSignal: true, isRequired: false, transformFunction: null }, autoExpandToCurrentPageMatcher: { classPropertyName: "autoExpandToCurrentPageMatcher", publicName: "autoExpandToCurrentPageMatcher", isSignal: true, isRequired: false, transformFunction: null }, toolbarTitle: { classPropertyName: "toolbarTitle", publicName: "toolbarTitle", isSignal: true, isRequired: false, transformFunction: null }, toolbarLogo: { classPropertyName: "toolbarLogo", publicName: "toolbarLogo", isSignal: true, isRequired: false, transformFunction: null }, toolbarLogoStyle: { classPropertyName: "toolbarLogoStyle", publicName: "toolbarLogoStyle", isSignal: true, isRequired: false, transformFunction: null }, fixedTopGap: { classPropertyName: "fixedTopGap", publicName: "fixedTopGap", isSignal: true, isRequired: false, transformFunction: null }, sidenavTemplate: { classPropertyName: "sidenavTemplate", publicName: "sidenavTemplate", isSignal: true, isRequired: false, transformFunction: null }, toolbarTemplate: { classPropertyName: "toolbarTemplate", publicName: "toolbarTemplate", isSignal: true, isRequired: false, transformFunction: null }, toolbarEndTemplate: { classPropertyName: "toolbarEndTemplate", publicName: "toolbarEndTemplate", isSignal: true, isRequired: false, transformFunction: null }, bodyTemplate: { classPropertyName: "bodyTemplate", publicName: "bodyTemplate", isSignal: true, isRequired: false, transformFunction: null }, useToolbar: { classPropertyName: "useToolbar", publicName: "useToolbar", isSignal: true, isRequired: false, transformFunction: null }, showMenu: { classPropertyName: "showMenu", publicName: "showMenu", isSignal: true, isRequired: false, transformFunction: null }, menuItems: { classPropertyName: "menuItems", publicName: "menuItems", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "drawer", first: true, predicate: ["snav"], descendants: true, isSignal: true }, { propertyName: "toolbarContRef", first: true, predicate: ["toolbarCont"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"vertical-nav\" [class.vertical-nav-is-mobile]=\"uS.isMobileSignal()\">\n @if (useToolbar()) {\n <div #toolbarCont class=\"vertical-nav-toolbar\">\n @if (toolbarTemplate()) {\n <ng-container *ngTemplateOutlet=\"toolbarTemplate()\" />\n } @else {\n <mat-toolbar color=\"primary\" class=\"bg-primary d-flex justify-content-between\">\n <div class=\"d-flex align-items-center w-100\">\n @if (showMenu()) {\n <button mat-icon-button (click)=\"snav.toggle()\">\n <mat-icon>menu</mat-icon>\n </button>\n }\n @if (toolbarLogo()) {\n <img\n [src]=\"toolbarLogo()\"\n [ngStyle]=\"toolbarLogoStyle()\"\n alt=\"toolbar logo\"\n class=\"toolbarLogo\" />\n }\n @if (toolbarTitle()) {\n <h1 class=\"vertical-nav-app-name\">{{ toolbarTitle() | appTranslate | async }}</h1>\n }\n </div>\n <div>\n @if (toolbarEndTemplate()) {\n <ng-container *ngTemplateOutlet=\"toolbarEndTemplate()\" />\n }\n </div>\n </mat-toolbar>\n }\n </div>\n }\n\n <mat-sidenav-container\n [id]=\"id()\"\n class=\"vertical-nav-container\"\n [style.marginTop.px]=\"\n uS.isMobileSignal() ? fixedTopGap() || toolbarContRef()?.nativeElement?.offsetHeight : 0\n \">\n <mat-sidenav\n class=\"side-w\"\n [ngClass]=\"{ mobile: this.uS.isMobileSignal() }\"\n #snav\n [mode]=\"uS.isMobileSignal() ? 'over' : 'side'\"\n [opened]=\"!uS.isMobileSignal() && showMenu()\"\n [fixedInViewport]=\"uS.isMobileSignal()\"\n [fixedTopGap]=\"\n uS.isMobileSignal() ? fixedTopGap() || toolbarContRef()?.nativeElement?.offsetHeight : 0\n \"\n [hidden]=\"!showMenu()\">\n <div class=\"vertical-nav-side-padding\">\n @if (sidenavTemplate()) {\n <ng-container *ngTemplateOutlet=\"sidenavTemplate()\" />\n } @else {\n <mat-tree\n [dataSource]=\"dataSource()\"\n [treeControl]=\"treeControl()\"\n class=\"vertical-nav-tree\">\n <!-- This is the tree node template for leaf nodes -->\n <!-- This is the tree node template for expandable nodes -->\n <mat-nested-tree-node\n *matTreeNodeDef=\"let node; when: hasChild()\"\n class=\"expandable-node\">\n <div class=\"mat-tree-node\">\n <button\n matTreeNodeToggle\n [attr.aria-label]=\"'Toggle ' + node.label\"\n class=\"menu-btn level{{ node.level }}\">\n <div class=\"row\">\n <div class=\"col\">\n <span class=\"{{ node.icon }}\"></span>\n {{ node.label | appTranslate | async }}\n </div>\n <div class=\"col-auto\">\n <span\n class=\"fa {{\n treeControl().isExpanded(node) ? 'fa-chevron-down' : 'fa-chevron-right'\n }} \"></span>\n </div>\n </div>\n </button>\n </div>\n <div>\n <!-- There is inline padding applied to this div using styles.\n This padding value depends on the mat-icon-button width. -->\n <div\n [class.vertical-nav-tree-invisible]=\"!treeControl().isExpanded(node)\"\n role=\"group\"\n class=\"group\">\n <ng-container matTreeNodeOutlet />\n </div>\n </div>\n </mat-nested-tree-node>\n <!-- There is inline padding applied to this node using styles.\n This padding value depends on the mat-icon-button width. -->\n <mat-tree-node\n *matTreeNodeDef=\"let node; when: shouldShowChild()\"\n matTreeNodeToggle\n class=\"single-node level{{ node.level }}\">\n @if (node.link != null || node.queryParams) {\n <a [routerLink]=\"node.link\" routerLinkActive=\"active\" [queryParams]=\"node.queryParams\" class=\"d-block w-100\">\n <span class=\"{{ node.icon }}\"></span>\n {{ node.label | appTranslate | async }}\n </a>\n } @else {\n <a (click)=\"node.action?.(node)\" class=\"d-block w-100 pointer\">\n <span class=\"{{ node.icon }}\"></span>\n {{ node.label | appTranslate | async }}\n </a>\n }\n </mat-tree-node>\n <mat-tree-node\n *matTreeNodeDef=\"let node\"\n matTreeNodeToggle\n class=\"single-node restricted level{{ node.level }}\" />\n </mat-tree>\n }\n </div>\n </mat-sidenav>\n\n <mat-sidenav-content class=\"vertical-nav-body\">\n @if (bodyTemplate()) {\n <ng-container *ngTemplateOutlet=\"bodyTemplate()\" />\n } @else {\n <ng-content />\n }\n </mat-sidenav-content>\n </mat-sidenav-container>\n</div>\n", styles: [".menu{background-color:#fff}.vertical-nav{display:flex;flex-direction:column;height:100%}.vertical-nav.fullScreen{position:absolute;inset:0}.toolbarLogo{--toolbarLogoDimen: 50px;height:var(--toolbarLogoDimen)}h1.vertical-nav-app-name{margin-left:8px}.vertical-nav-container{flex:1}.vertical-nav-is-mobile .vertical-nav-toolbar{position:fixed;z-index:2;width:100%}.vertical-nav-is-mobile .vertical-nav-container{flex:1 0 auto}.mat-drawer-container{background-color:unset}.mat-drawer-content{background-color:#e9e9e9}.expandable-node button{width:100%;border-radius:0;text-align:left}.single-node button{width:24px}.level0{border-bottom:1px solid rgba(141,141,141,.231372549)}.side-w{width:var(--sideNavWidth, auto);margin:10px;border-radius:16px}.side-w.mobile{width:90%;margin:0;border-radius:0}.vertical-nav-tree-invisible{display:none}.vertical-nav-tree ul,.vertical-nav-tree li{margin-top:0;margin-bottom:0;list-style-type:none}.vertical-nav-tree div[role=group]{border-radius:var(--borderRadius);background-color:#ffffff57}.vertical-nav-tree div[role=group]>.mat-tree-node{padding:10px 20px}a{color:inherit}.restricted{display:none}mat-sidenav.mat-drawer.mat-drawer-opened.mat-drawer-side.mat-sidenav{min-width:200px;overflow-x:auto;white-space:nowrap}.menu-btn{background-color:#ffffff57;border-radius:var(--borderRadius)!important;padding:10px 20px;color:#2b2b2b;border:none}.expandable-node .group{border:1px solid rgba(0,0,0,.11)!important}.profile{position:sticky;bottom:0;right:0;left:0;background-color:var(--primary);background-image:linear-gradient(45deg,#ffffffa8,#ffffffa8);padding:10px}.vertical-nav-body{margin-left:var(--contentMarginLeft, inherit)}.vertical-nav-side-padding{padding:var(--space-8)}\n"], dependencies: [{ kind: "ngmodule", type: MatToolbarModule }, { kind: "component", type: i1$6.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i2$3.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i9$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatSidenavModule }, { kind: "component", type: i4.MatSidenav, selector: "mat-sidenav", inputs: ["fixedInViewport", "fixedTopGap", "fixedBottomGap"], exportAs: ["matSidenav"] }, { kind: "component", type: i4.MatSidenavContainer, selector: "mat-sidenav-container", exportAs: ["matSidenavContainer"] }, { kind: "component", type: i4.MatSidenavContent, selector: "mat-sidenav-content" }, { kind: "ngmodule", type: MatTreeModule }, { kind: "directive", type: i5$1.MatNestedTreeNode, selector: "mat-nested-tree-node", inputs: ["matNestedTreeNode", "disabled", "tabIndex"], outputs: ["activation", "expandedChange"], exportAs: ["matNestedTreeNode"] }, { kind: "directive", type: i5$1.MatTreeNodeDef, selector: "[matTreeNodeDef]", inputs: ["matTreeNodeDefWhen", "matTreeNode"] }, { kind: "directive", type: i5$1.MatTreeNodeToggle, selector: "[matTreeNodeToggle]", inputs: ["matTreeNodeToggleRecursive"] }, { kind: "component", type: i5$1.MatTree, selector: "mat-tree", exportAs: ["matTree"] }, { kind: "directive", type: i5$1.MatTreeNode, selector: "mat-tree-node", inputs: ["tabIndex", "disabled"], outputs: ["activation", "expandedChange"], exportAs: ["matTreeNode"] }, { kind: "directive", type: i5$1.MatTreeNodeOutlet, selector: "[matTreeNodeOutlet]" }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: SDKTranslatePipe, name: "appTranslate" }] }); }
|
|
16270
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.0", type: VerticalNavComponent, isStandalone: true, selector: "vertical-nav", inputs: { shouldShowChildInput: { classPropertyName: "shouldShowChildInput", publicName: "shouldShowChildInput", isSignal: true, isRequired: false, transformFunction: null }, toolbarTitle: { classPropertyName: "toolbarTitle", publicName: "toolbarTitle", isSignal: true, isRequired: false, transformFunction: null }, toolbarLogo: { classPropertyName: "toolbarLogo", publicName: "toolbarLogo", isSignal: true, isRequired: false, transformFunction: null }, toolbarLogoStyle: { classPropertyName: "toolbarLogoStyle", publicName: "toolbarLogoStyle", isSignal: true, isRequired: false, transformFunction: null }, fixedTopGap: { classPropertyName: "fixedTopGap", publicName: "fixedTopGap", isSignal: true, isRequired: false, transformFunction: null }, sidenavTemplate: { classPropertyName: "sidenavTemplate", publicName: "sidenavTemplate", isSignal: true, isRequired: false, transformFunction: null }, toolbarTemplate: { classPropertyName: "toolbarTemplate", publicName: "toolbarTemplate", isSignal: true, isRequired: false, transformFunction: null }, toolbarEndTemplate: { classPropertyName: "toolbarEndTemplate", publicName: "toolbarEndTemplate", isSignal: true, isRequired: false, transformFunction: null }, bodyTemplate: { classPropertyName: "bodyTemplate", publicName: "bodyTemplate", isSignal: true, isRequired: false, transformFunction: null }, useToolbar: { classPropertyName: "useToolbar", publicName: "useToolbar", isSignal: true, isRequired: false, transformFunction: null }, showMenu: { classPropertyName: "showMenu", publicName: "showMenu", isSignal: true, isRequired: false, transformFunction: null }, menuItems: { classPropertyName: "menuItems", publicName: "menuItems", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "drawer", first: true, predicate: ["snav"], descendants: true, isSignal: true }, { propertyName: "toolbarContRef", first: true, predicate: ["toolbarCont"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"vertical-nav\" [class.vertical-nav-is-mobile]=\"uS.isMobileSignal()\">\n @if (useToolbar()) {\n <div #toolbarCont class=\"vertical-nav-toolbar\">\n @if (toolbarTemplate()) {\n <ng-container *ngTemplateOutlet=\"toolbarTemplate()\" />\n } @else {\n <mat-toolbar color=\"primary\" class=\"bg-primary d-flex justify-content-between\">\n <div class=\"d-flex align-items-center w-100\">\n @if (showMenu()) {\n <button mat-icon-button (click)=\"snav.toggle()\">\n <mat-icon>menu</mat-icon>\n </button>\n }\n @if (toolbarLogo()) {\n <img\n [src]=\"toolbarLogo()\"\n [ngStyle]=\"toolbarLogoStyle()\"\n alt=\"toolbar logo\"\n class=\"toolbarLogo\" />\n }\n @if (toolbarTitle()) {\n <h1 class=\"vertical-nav-app-name\">{{ toolbarTitle() | appTranslate | async }}</h1>\n }\n </div>\n <div>\n @if (toolbarEndTemplate()) {\n <ng-container *ngTemplateOutlet=\"toolbarEndTemplate()\" />\n }\n </div>\n </mat-toolbar>\n }\n </div>\n }\n\n <mat-sidenav-container\n [id]=\"id()\"\n class=\"vertical-nav-container\"\n [style.marginTop.px]=\"\n uS.isMobileSignal() ? fixedTopGap() || toolbarContRef()?.nativeElement?.offsetHeight : 0\n \">\n <mat-sidenav\n class=\"side-w\"\n [ngClass]=\"{ mobile: this.uS.isMobileSignal() }\"\n #snav\n [mode]=\"uS.isMobileSignal() ? 'over' : 'side'\"\n [opened]=\"!uS.isMobileSignal() && showMenu()\"\n [fixedInViewport]=\"uS.isMobileSignal()\"\n [fixedTopGap]=\"\n uS.isMobileSignal() ? fixedTopGap() || toolbarContRef()?.nativeElement?.offsetHeight : 0\n \"\n [hidden]=\"!showMenu()\">\n <div class=\"vertical-nav-side-padding\">\n @if (sidenavTemplate()) {\n <ng-container *ngTemplateOutlet=\"sidenavTemplate()\" />\n } @else {\n <mat-tree\n [dataSource]=\"dataSource()\"\n [treeControl]=\"treeControl()\"\n class=\"vertical-nav-tree\">\n <!-- This is the tree node template for leaf nodes -->\n <!-- This is the tree node template for expandable nodes -->\n <mat-nested-tree-node\n *matTreeNodeDef=\"let node; when: hasChild()\"\n class=\"expandable-node\">\n <div class=\"mat-tree-node\">\n <button\n matTreeNodeToggle\n [attr.aria-label]=\"'Toggle ' + node.label\"\n class=\"menu-btn level{{ node.level }}\">\n <div class=\"row\">\n <div class=\"col\">\n <span class=\"{{ node.icon }}\"></span>\n {{ node.label | appTranslate | async }}\n </div>\n <div class=\"col-auto\">\n <span\n class=\"fa {{\n treeControl().isExpanded(node) ? 'fa-chevron-down' : 'fa-chevron-right'\n }} \"></span>\n </div>\n </div>\n </button>\n </div>\n <div>\n <!-- There is inline padding applied to this div using styles.\n This padding value depends on the mat-icon-button width. -->\n <div\n [class.vertical-nav-tree-invisible]=\"!treeControl().isExpanded(node)\"\n role=\"group\"\n class=\"group\">\n <ng-container matTreeNodeOutlet />\n </div>\n </div>\n </mat-nested-tree-node>\n <!-- There is inline padding applied to this node using styles.\n This padding value depends on the mat-icon-button width. -->\n <mat-tree-node\n *matTreeNodeDef=\"let node; when: shouldShowChild()\"\n matTreeNodeToggle\n class=\"single-node level{{ node.level }}\">\n @if (node.link != null || node.queryParams) {\n <a\n [routerLink]=\"node.link\"\n routerLinkActive=\"active\"\n [queryParams]=\"node.queryParams\"\n class=\"d-block w-100\">\n <span class=\"{{ node.icon }}\"></span>\n {{ node.label | appTranslate | async }}\n </a>\n } @else {\n <a (click)=\"node.action?.(node)\" class=\"d-block w-100 pointer\">\n <span class=\"{{ node.icon }}\"></span>\n {{ node.label | appTranslate | async }}\n </a>\n }\n </mat-tree-node>\n <mat-tree-node\n *matTreeNodeDef=\"let node\"\n matTreeNodeToggle\n class=\"single-node restricted level{{ node.level }}\" />\n </mat-tree>\n }\n </div>\n </mat-sidenav>\n\n <mat-sidenav-content class=\"vertical-nav-body\">\n @if (bodyTemplate()) {\n <ng-container *ngTemplateOutlet=\"bodyTemplate()\" />\n } @else {\n <ng-content />\n }\n </mat-sidenav-content>\n </mat-sidenav-container>\n</div>\n", styles: [".menu{background-color:#fff}.vertical-nav{display:flex;flex-direction:column;height:100%}.vertical-nav.fullScreen{position:absolute;inset:0}.toolbarLogo{--toolbarLogoDimen: 50px;height:var(--toolbarLogoDimen)}h1.vertical-nav-app-name{margin-left:8px}.vertical-nav-container{flex:1}.vertical-nav-is-mobile .vertical-nav-toolbar{position:fixed;z-index:2;width:100%}.vertical-nav-is-mobile .vertical-nav-container{flex:1 0 auto}.mat-drawer-container{background-color:unset}.mat-drawer-content{background-color:#e9e9e9}.expandable-node button{width:100%;border-radius:0;text-align:left}.single-node button{width:24px}.level0{border-bottom:1px solid rgba(141,141,141,.231372549)}.side-w{width:var(--sideNavWidth, auto);margin:10px;border-radius:16px}.side-w.mobile{width:90%;margin:0;border-radius:0}.vertical-nav-tree-invisible{display:none}.vertical-nav-tree ul,.vertical-nav-tree li{margin-top:0;margin-bottom:0;list-style-type:none}.vertical-nav-tree div[role=group]{border-radius:var(--borderRadius);background-color:#ffffff57}.vertical-nav-tree div[role=group]>.mat-tree-node{padding:10px 20px}a{color:inherit}.restricted{display:none}mat-sidenav.mat-drawer.mat-drawer-opened.mat-drawer-side.mat-sidenav{min-width:200px;overflow-x:auto;white-space:nowrap}.menu-btn{background-color:#ffffff57;border-radius:var(--borderRadius)!important;padding:10px 20px;color:#2b2b2b;border:none}.expandable-node .group{border:1px solid rgba(0,0,0,.11)!important}.profile{position:sticky;bottom:0;right:0;left:0;background-color:var(--primary);background-image:linear-gradient(45deg,#ffffffa8,#ffffffa8);padding:10px}.vertical-nav-body{margin-left:var(--contentMarginLeft, inherit)}.vertical-nav-side-padding{padding:var(--space-8)}\n"], dependencies: [{ kind: "ngmodule", type: MatToolbarModule }, { kind: "component", type: i1$6.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i2$3.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i9$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatSidenavModule }, { kind: "component", type: i4.MatSidenav, selector: "mat-sidenav", inputs: ["fixedInViewport", "fixedTopGap", "fixedBottomGap"], exportAs: ["matSidenav"] }, { kind: "component", type: i4.MatSidenavContainer, selector: "mat-sidenav-container", exportAs: ["matSidenavContainer"] }, { kind: "component", type: i4.MatSidenavContent, selector: "mat-sidenav-content" }, { kind: "ngmodule", type: MatTreeModule }, { kind: "directive", type: i5$1.MatNestedTreeNode, selector: "mat-nested-tree-node", inputs: ["matNestedTreeNode", "disabled", "tabIndex"], outputs: ["activation", "expandedChange"], exportAs: ["matNestedTreeNode"] }, { kind: "directive", type: i5$1.MatTreeNodeDef, selector: "[matTreeNodeDef]", inputs: ["matTreeNodeDefWhen", "matTreeNode"] }, { kind: "directive", type: i5$1.MatTreeNodeToggle, selector: "[matTreeNodeToggle]", inputs: ["matTreeNodeToggleRecursive"] }, { kind: "component", type: i5$1.MatTree, selector: "mat-tree", exportAs: ["matTree"] }, { kind: "directive", type: i5$1.MatTreeNode, selector: "mat-tree-node", inputs: ["tabIndex", "disabled"], outputs: ["activation", "expandedChange"], exportAs: ["matTreeNode"] }, { kind: "directive", type: i5$1.MatTreeNodeOutlet, selector: "[matTreeNodeOutlet]" }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: SDKTranslatePipe, name: "appTranslate" }] }); }
|
|
16277
16271
|
}
|
|
16278
16272
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: VerticalNavComponent, decorators: [{
|
|
16279
16273
|
type: Component,
|
|
@@ -16289,7 +16283,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0", ngImpor
|
|
|
16289
16283
|
ImageLoaderDirective,
|
|
16290
16284
|
CommonModule,
|
|
16291
16285
|
SDKTranslatePipe,
|
|
16292
|
-
], template: "<div class=\"vertical-nav\" [class.vertical-nav-is-mobile]=\"uS.isMobileSignal()\">\n @if (useToolbar()) {\n <div #toolbarCont class=\"vertical-nav-toolbar\">\n @if (toolbarTemplate()) {\n <ng-container *ngTemplateOutlet=\"toolbarTemplate()\" />\n } @else {\n <mat-toolbar color=\"primary\" class=\"bg-primary d-flex justify-content-between\">\n <div class=\"d-flex align-items-center w-100\">\n @if (showMenu()) {\n <button mat-icon-button (click)=\"snav.toggle()\">\n <mat-icon>menu</mat-icon>\n </button>\n }\n @if (toolbarLogo()) {\n <img\n [src]=\"toolbarLogo()\"\n [ngStyle]=\"toolbarLogoStyle()\"\n alt=\"toolbar logo\"\n class=\"toolbarLogo\" />\n }\n @if (toolbarTitle()) {\n <h1 class=\"vertical-nav-app-name\">{{ toolbarTitle() | appTranslate | async }}</h1>\n }\n </div>\n <div>\n @if (toolbarEndTemplate()) {\n <ng-container *ngTemplateOutlet=\"toolbarEndTemplate()\" />\n }\n </div>\n </mat-toolbar>\n }\n </div>\n }\n\n <mat-sidenav-container\n [id]=\"id()\"\n class=\"vertical-nav-container\"\n [style.marginTop.px]=\"\n uS.isMobileSignal() ? fixedTopGap() || toolbarContRef()?.nativeElement?.offsetHeight : 0\n \">\n <mat-sidenav\n class=\"side-w\"\n [ngClass]=\"{ mobile: this.uS.isMobileSignal() }\"\n #snav\n [mode]=\"uS.isMobileSignal() ? 'over' : 'side'\"\n [opened]=\"!uS.isMobileSignal() && showMenu()\"\n [fixedInViewport]=\"uS.isMobileSignal()\"\n [fixedTopGap]=\"\n uS.isMobileSignal() ? fixedTopGap() || toolbarContRef()?.nativeElement?.offsetHeight : 0\n \"\n [hidden]=\"!showMenu()\">\n <div class=\"vertical-nav-side-padding\">\n @if (sidenavTemplate()) {\n <ng-container *ngTemplateOutlet=\"sidenavTemplate()\" />\n } @else {\n <mat-tree\n [dataSource]=\"dataSource()\"\n [treeControl]=\"treeControl()\"\n class=\"vertical-nav-tree\">\n <!-- This is the tree node template for leaf nodes -->\n <!-- This is the tree node template for expandable nodes -->\n <mat-nested-tree-node\n *matTreeNodeDef=\"let node; when: hasChild()\"\n class=\"expandable-node\">\n <div class=\"mat-tree-node\">\n <button\n matTreeNodeToggle\n [attr.aria-label]=\"'Toggle ' + node.label\"\n class=\"menu-btn level{{ node.level }}\">\n <div class=\"row\">\n <div class=\"col\">\n <span class=\"{{ node.icon }}\"></span>\n {{ node.label | appTranslate | async }}\n </div>\n <div class=\"col-auto\">\n <span\n class=\"fa {{\n treeControl().isExpanded(node) ? 'fa-chevron-down' : 'fa-chevron-right'\n }} \"></span>\n </div>\n </div>\n </button>\n </div>\n <div>\n <!-- There is inline padding applied to this div using styles.\n This padding value depends on the mat-icon-button width. -->\n <div\n [class.vertical-nav-tree-invisible]=\"!treeControl().isExpanded(node)\"\n role=\"group\"\n class=\"group\">\n <ng-container matTreeNodeOutlet />\n </div>\n </div>\n </mat-nested-tree-node>\n <!-- There is inline padding applied to this node using styles.\n This padding value depends on the mat-icon-button width. -->\n <mat-tree-node\n *matTreeNodeDef=\"let node; when: shouldShowChild()\"\n matTreeNodeToggle\n class=\"single-node level{{ node.level }}\">\n @if (node.link != null || node.queryParams) {\n <a
|
|
16286
|
+
], template: "<div class=\"vertical-nav\" [class.vertical-nav-is-mobile]=\"uS.isMobileSignal()\">\n @if (useToolbar()) {\n <div #toolbarCont class=\"vertical-nav-toolbar\">\n @if (toolbarTemplate()) {\n <ng-container *ngTemplateOutlet=\"toolbarTemplate()\" />\n } @else {\n <mat-toolbar color=\"primary\" class=\"bg-primary d-flex justify-content-between\">\n <div class=\"d-flex align-items-center w-100\">\n @if (showMenu()) {\n <button mat-icon-button (click)=\"snav.toggle()\">\n <mat-icon>menu</mat-icon>\n </button>\n }\n @if (toolbarLogo()) {\n <img\n [src]=\"toolbarLogo()\"\n [ngStyle]=\"toolbarLogoStyle()\"\n alt=\"toolbar logo\"\n class=\"toolbarLogo\" />\n }\n @if (toolbarTitle()) {\n <h1 class=\"vertical-nav-app-name\">{{ toolbarTitle() | appTranslate | async }}</h1>\n }\n </div>\n <div>\n @if (toolbarEndTemplate()) {\n <ng-container *ngTemplateOutlet=\"toolbarEndTemplate()\" />\n }\n </div>\n </mat-toolbar>\n }\n </div>\n }\n\n <mat-sidenav-container\n [id]=\"id()\"\n class=\"vertical-nav-container\"\n [style.marginTop.px]=\"\n uS.isMobileSignal() ? fixedTopGap() || toolbarContRef()?.nativeElement?.offsetHeight : 0\n \">\n <mat-sidenav\n class=\"side-w\"\n [ngClass]=\"{ mobile: this.uS.isMobileSignal() }\"\n #snav\n [mode]=\"uS.isMobileSignal() ? 'over' : 'side'\"\n [opened]=\"!uS.isMobileSignal() && showMenu()\"\n [fixedInViewport]=\"uS.isMobileSignal()\"\n [fixedTopGap]=\"\n uS.isMobileSignal() ? fixedTopGap() || toolbarContRef()?.nativeElement?.offsetHeight : 0\n \"\n [hidden]=\"!showMenu()\">\n <div class=\"vertical-nav-side-padding\">\n @if (sidenavTemplate()) {\n <ng-container *ngTemplateOutlet=\"sidenavTemplate()\" />\n } @else {\n <mat-tree\n [dataSource]=\"dataSource()\"\n [treeControl]=\"treeControl()\"\n class=\"vertical-nav-tree\">\n <!-- This is the tree node template for leaf nodes -->\n <!-- This is the tree node template for expandable nodes -->\n <mat-nested-tree-node\n *matTreeNodeDef=\"let node; when: hasChild()\"\n class=\"expandable-node\">\n <div class=\"mat-tree-node\">\n <button\n matTreeNodeToggle\n [attr.aria-label]=\"'Toggle ' + node.label\"\n class=\"menu-btn level{{ node.level }}\">\n <div class=\"row\">\n <div class=\"col\">\n <span class=\"{{ node.icon }}\"></span>\n {{ node.label | appTranslate | async }}\n </div>\n <div class=\"col-auto\">\n <span\n class=\"fa {{\n treeControl().isExpanded(node) ? 'fa-chevron-down' : 'fa-chevron-right'\n }} \"></span>\n </div>\n </div>\n </button>\n </div>\n <div>\n <!-- There is inline padding applied to this div using styles.\n This padding value depends on the mat-icon-button width. -->\n <div\n [class.vertical-nav-tree-invisible]=\"!treeControl().isExpanded(node)\"\n role=\"group\"\n class=\"group\">\n <ng-container matTreeNodeOutlet />\n </div>\n </div>\n </mat-nested-tree-node>\n <!-- There is inline padding applied to this node using styles.\n This padding value depends on the mat-icon-button width. -->\n <mat-tree-node\n *matTreeNodeDef=\"let node; when: shouldShowChild()\"\n matTreeNodeToggle\n class=\"single-node level{{ node.level }}\">\n @if (node.link != null || node.queryParams) {\n <a\n [routerLink]=\"node.link\"\n routerLinkActive=\"active\"\n [queryParams]=\"node.queryParams\"\n class=\"d-block w-100\">\n <span class=\"{{ node.icon }}\"></span>\n {{ node.label | appTranslate | async }}\n </a>\n } @else {\n <a (click)=\"node.action?.(node)\" class=\"d-block w-100 pointer\">\n <span class=\"{{ node.icon }}\"></span>\n {{ node.label | appTranslate | async }}\n </a>\n }\n </mat-tree-node>\n <mat-tree-node\n *matTreeNodeDef=\"let node\"\n matTreeNodeToggle\n class=\"single-node restricted level{{ node.level }}\" />\n </mat-tree>\n }\n </div>\n </mat-sidenav>\n\n <mat-sidenav-content class=\"vertical-nav-body\">\n @if (bodyTemplate()) {\n <ng-container *ngTemplateOutlet=\"bodyTemplate()\" />\n } @else {\n <ng-content />\n }\n </mat-sidenav-content>\n </mat-sidenav-container>\n</div>\n", styles: [".menu{background-color:#fff}.vertical-nav{display:flex;flex-direction:column;height:100%}.vertical-nav.fullScreen{position:absolute;inset:0}.toolbarLogo{--toolbarLogoDimen: 50px;height:var(--toolbarLogoDimen)}h1.vertical-nav-app-name{margin-left:8px}.vertical-nav-container{flex:1}.vertical-nav-is-mobile .vertical-nav-toolbar{position:fixed;z-index:2;width:100%}.vertical-nav-is-mobile .vertical-nav-container{flex:1 0 auto}.mat-drawer-container{background-color:unset}.mat-drawer-content{background-color:#e9e9e9}.expandable-node button{width:100%;border-radius:0;text-align:left}.single-node button{width:24px}.level0{border-bottom:1px solid rgba(141,141,141,.231372549)}.side-w{width:var(--sideNavWidth, auto);margin:10px;border-radius:16px}.side-w.mobile{width:90%;margin:0;border-radius:0}.vertical-nav-tree-invisible{display:none}.vertical-nav-tree ul,.vertical-nav-tree li{margin-top:0;margin-bottom:0;list-style-type:none}.vertical-nav-tree div[role=group]{border-radius:var(--borderRadius);background-color:#ffffff57}.vertical-nav-tree div[role=group]>.mat-tree-node{padding:10px 20px}a{color:inherit}.restricted{display:none}mat-sidenav.mat-drawer.mat-drawer-opened.mat-drawer-side.mat-sidenav{min-width:200px;overflow-x:auto;white-space:nowrap}.menu-btn{background-color:#ffffff57;border-radius:var(--borderRadius)!important;padding:10px 20px;color:#2b2b2b;border:none}.expandable-node .group{border:1px solid rgba(0,0,0,.11)!important}.profile{position:sticky;bottom:0;right:0;left:0;background-color:var(--primary);background-image:linear-gradient(45deg,#ffffffa8,#ffffffa8);padding:10px}.vertical-nav-body{margin-left:var(--contentMarginLeft, inherit)}.vertical-nav-side-padding{padding:var(--space-8)}\n"] }]
|
|
16293
16287
|
}], ctorParameters: () => [] });
|
|
16294
16288
|
|
|
16295
16289
|
class TextAreaModalComponent {
|
|
@@ -18357,6 +18351,7 @@ class FindItemComponent extends BaseFormGenerator {
|
|
|
18357
18351
|
*/
|
|
18358
18352
|
this.gridClass = input('col-md-4 col-xxl-3');
|
|
18359
18353
|
this.hideForm = input(false);
|
|
18354
|
+
this.customTableCellTemplates = input({});
|
|
18360
18355
|
this.expandedRowTemplate = input();
|
|
18361
18356
|
this.isTablePaginated = computed(() => !!this.searchObservableFunc());
|
|
18362
18357
|
this.rowOptionsMap = input();
|
|
@@ -18721,7 +18716,7 @@ class FindItemComponent extends BaseFormGenerator {
|
|
|
18721
18716
|
this._loading.set(false);
|
|
18722
18717
|
}
|
|
18723
18718
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: FindItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
18724
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.0", type: FindItemComponent, isStandalone: true, selector: "app-find-item,find-item", inputs: { autoFormatSchema: { classPropertyName: "autoFormatSchema", publicName: "autoFormatSchema", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, autoOrder: { classPropertyName: "autoOrder", publicName: "autoOrder", isSignal: true, isRequired: false, transformFunction: null }, centerCells: { classPropertyName: "centerCells", publicName: "centerCells", isSignal: true, isRequired: false, transformFunction: null }, _displayedColumns: { classPropertyName: "_displayedColumns", publicName: "displayedColumns", isSignal: true, isRequired: false, transformFunction: null }, gridClass: { classPropertyName: "gridClass", publicName: "gridClass", isSignal: true, isRequired: false, transformFunction: null }, hideForm: { classPropertyName: "hideForm", publicName: "hideForm", isSignal: true, isRequired: false, transformFunction: null }, expandedRowTemplate: { classPropertyName: "expandedRowTemplate", publicName: "expandedRowTemplate", isSignal: true, isRequired: false, transformFunction: null }, rowOptionsMap: { classPropertyName: "rowOptionsMap", publicName: "rowOptionsMap", isSignal: true, isRequired: false, transformFunction: null }, isExpandable: { classPropertyName: "isExpandable", publicName: "isExpandable", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, nowrap: { classPropertyName: "nowrap", publicName: "nowrap", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "rowOptions", isSignal: true, isRequired: false, transformFunction: null }, orderDirection: { classPropertyName: "orderDirection", publicName: "orderDirection", isSignal: true, isRequired: false, transformFunction: null }, orderField: { classPropertyName: "orderField", publicName: "orderField", isSignal: true, isRequired: false, transformFunction: null }, pageSize: { classPropertyName: "pageSize", publicName: "pageSize", isSignal: true, isRequired: false, transformFunction: null }, searchFunction: { classPropertyName: "searchFunction", publicName: "searchFunction", isSignal: true, isRequired: false, transformFunction: null }, showData: { classPropertyName: "showData", publicName: "showData", isSignal: true, isRequired: false, transformFunction: null }, searchIfNoQuery: { classPropertyName: "searchIfNoQuery", publicName: "searchIfNoQuery", isSignal: true, isRequired: false, transformFunction: null }, isCompact: { classPropertyName: "isCompact", publicName: "isCompact", isSignal: true, isRequired: false, transformFunction: null }, showExport: { classPropertyName: "showExport", publicName: "showExport", isSignal: true, isRequired: false, transformFunction: null }, showFilter: { classPropertyName: "showFilter", publicName: "showFilter", isSignal: true, isRequired: false, transformFunction: null }, showRefreshBtn: { classPropertyName: "showRefreshBtn", publicName: "showRefreshBtn", isSignal: true, isRequired: false, transformFunction: null }, startSectionTemplate: { classPropertyName: "startSectionTemplate", publicName: "startSectionTemplate", isSignal: true, isRequired: false, transformFunction: null }, showSearchBtn: { classPropertyName: "showSearchBtn", publicName: "showSearchBtn", isSignal: true, isRequired: false, transformFunction: null }, showClearBtn: { classPropertyName: "showClearBtn", publicName: "showClearBtn", isSignal: true, isRequired: false, transformFunction: null }, showValidationMsg: { classPropertyName: "showValidationMsg", publicName: "showValidationMsg", isSignal: true, isRequired: false, transformFunction: null }, createBtnRoute: { classPropertyName: "createBtnRoute", publicName: "createBtnRoute", isSignal: true, isRequired: false, transformFunction: null }, showAdditionalColumns: { classPropertyName: "showAdditionalColumns", publicName: "showAdditionalColumns", isSignal: true, isRequired: false, transformFunction: null }, smallerFonts: { classPropertyName: "smallerFonts", publicName: "smallerFonts", isSignal: true, isRequired: false, transformFunction: null }, useSelection: { classPropertyName: "useSelection", publicName: "useSelection", isSignal: true, isRequired: false, transformFunction: null }, initialQuery: { classPropertyName: "initialQuery", publicName: "initialQuery", isSignal: true, isRequired: false, transformFunction: null }, createButton: { classPropertyName: "createButton", publicName: "createButton", isSignal: true, isRequired: false, transformFunction: null }, _formSchema: { classPropertyName: "_formSchema", publicName: "formSchema", isSignal: false, isRequired: false, transformFunction: null }, searchObservableFunc: { classPropertyName: "searchObservableFunc", publicName: "searchObservableFunc", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { initialQuery: "initialQueryChange", _rowClick: "rowClick", clickedCreate: "clickedCreate" }, viewQueries: [{ propertyName: "tableHTTPSREF", first: true, predicate: (TableHttpsComponent), descendants: true, isSignal: true }, { propertyName: "tablePlainRef", first: true, predicate: (TablePlainComponent), descendants: true, isSignal: true }, { propertyName: "tableHTTPSREFSignal", first: true, predicate: TableHttpsComponent, descendants: true, isSignal: true }, { propertyName: "tablePlainRefSignal", first: true, predicate: TablePlainComponent, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<loader [loading]=\"_loading()\">\n @if (!hideForm() && searchForm()) {\n <form (ngSubmit)=\"search()\">\n <div class=\"row align-items-center\">\n @for (scheme of computedFormSchema(); track scheme.field) {\n <div class=\"{{ gridClass() }} \">\n <div class=\"row align-items-end\">\n <ng-template #defaultInpTempl>\n <app-input-basic\n #formField\n [name]=\"scheme.field\"\n [form]=\"scheme.form\"\n [type]=\"scheme.type\"\n [autoPickValueField]=\"scheme.autoPickValueField\"\n [valueField]=\"scheme.valueField\"\n [labelType]=\"scheme.labelType | toAny\"\n [checkedSignal]=\"scheme.checked\"\n [showValidation]=\"formField.hasValue() && !!scheme.asyncValidators\"\n [showValidationIcon]=\"formField.hasValue() && !!scheme.asyncValidators\"\n [noFormat]=\"true\"\n [labelField]=\"scheme.labelField\"\n [optionFormatter]=\"scheme.optionFormatter\"\n [options]=\"scheme.options\"\n [decimalPoints]=\"scheme.decimalPoints\"\n [hint]=\"scheme.hint\"\n [max]=\"scheme.max\"\n [min]=\"scheme.min\"\n [placeholder]=\"scheme.placeholder\"\n [label]=\"scheme.label\"\n [disabled]=\"\n scheme.disabledIf | functionCaller2: searchFormValue : (scheme.field | toAny)\n \" />\n </ng-template>\n\n @switch (true) {\n @case (scheme.type == 'tel') {\n <div class=\"col\">\n <app-phone-number\n [form]=\"scheme.form\"\n [label]=\"scheme.label\"\n [name]=\"scheme.field\"\n [showLabel]=\"false\"\n [showValidation]=\"scheme.showValidation\"\n [showValidationIcon]=\"scheme.showValidationIcon\"\n [countryCode3]=\"scheme.countryCode3\"\n [disabled]=\"\n scheme.disabledIf\n | functionCaller2: searchFormValue() : (scheme.field | toAny)\n \"\n #inputTag />\n @if (showValidationMsg()) {\n <app-validation-message [input]=\"inputTag\" />\n }\n </div>\n }\n @case (scheme.type == 'autocomplete') {\n <div class=\"col\">\n <app-autocomplete\n [form]=\"scheme.form\"\n [label]=\"scheme.label\"\n [labelField]=\"scheme.labelField\"\n [autoPickValueField]=\"scheme.autoPickValueField\"\n [labelType]=\"scheme.labelType | toAny\"\n [optionsFunc]=\"scheme.optionsFunc\"\n [name]=\"scheme.field\"\n [optionFormatter]=\"scheme.optionFormatter\"\n [valueField]=\"scheme.valueField\"\n [options]=\"scheme.options\"\n [hint]=\"scheme.hint\"\n [disabled]=\"\n scheme.disabledIf\n | functionCaller2: searchFormValue : (scheme.field | toAny)\n \"\n #inputTag />\n @if (showValidationMsg()) {\n <app-validation-message [input]=\"inputTag\" />\n }\n </div>\n }\n @case (scheme.standalone || scheme.action) {\n <div class=\"col\">\n <form (ngSubmit)=\"fieldAction(scheme)\">\n <div class=\"gx-2 row align-items-end\">\n <div class=\"col\">\n <app-input-basic\n #formField\n [name]=\"scheme.field\"\n [form]=\"scheme.form\"\n [type]=\"scheme.type\"\n [autoPickValueField]=\"scheme.autoPickValueField\"\n [valueField]=\"scheme.valueField\"\n [labelType]=\"scheme.labelType | toAny\"\n [checkedSignal]=\"scheme.checked\"\n [showValidation]=\"formField.hasValue() && !!scheme.asyncValidators\"\n [showValidationIcon]=\"formField.hasValue() && !!scheme.asyncValidators\"\n [noFormat]=\"true\"\n [labelField]=\"scheme.labelField\"\n [optionFormatter]=\"scheme.optionFormatter\"\n [options]=\"scheme.options\"\n [decimalPoints]=\"scheme.decimalPoints\"\n [hint]=\"scheme.hint\"\n [max]=\"scheme.max\"\n [min]=\"scheme.min\"\n [placeholder]=\"scheme.placeholder\"\n [label]=\"scheme.label\"\n [disabled]=\"\n scheme.disabledIf\n | functionCaller2: searchFormValue : (scheme.field | toAny)\n \" />\n </div>\n <div class=\"col-auto\">\n <app-btn\n [icon]=\"scheme.icon || 'show'\"\n [group]=\"scheme.standalone && scheme.action ? 'show' : null\"\n actionType=\"submit\"\n [disabled]=\"!formField?.validSignal()\" />\n </div>\n </div>\n </form>\n </div>\n @if (showValidationMsg()) {\n <app-validation-message [input]=\"formField\" />\n }\n }\n @default {\n <div class=\"col\">\n <app-input-basic\n #formField\n [name]=\"scheme.field\"\n [form]=\"scheme.form\"\n [type]=\"scheme.type\"\n [autoPickValueField]=\"scheme.autoPickValueField\"\n [valueField]=\"scheme.valueField\"\n [labelType]=\"scheme.labelType | toAny\"\n [checkedSignal]=\"scheme.checked\"\n [showValidation]=\"formField.hasValue() && !!scheme.asyncValidators\"\n [showValidationIcon]=\"formField.hasValue() && !!scheme.asyncValidators\"\n [noFormat]=\"true\"\n [labelField]=\"scheme.labelField\"\n [optionFormatter]=\"scheme.optionFormatter\"\n [options]=\"scheme.options\"\n [decimalPoints]=\"scheme.decimalPoints\"\n [hint]=\"scheme.hint\"\n [showValidationMsg]=\"showValidationMsg()\"\n [max]=\"scheme.max\"\n [min]=\"scheme.min\"\n [placeholder]=\"scheme.placeholder\"\n [label]=\"scheme.label\"\n [disabled]=\"\n scheme.disabledIf\n | functionCaller2: searchFormValue : (scheme.field | toAny)\n \" />\n </div>\n }\n }\n </div>\n </div>\n }\n <div class=\"col-md justify-content-end align-items-center d-flex\">\n @if (showClearBtn()) {\n <app-btn type=\"danger-outline\" text=\"Clear\" icon=\"delete\" (mclick)=\"clearFilters()\" />\n }\n <span class=\"mx-1\"></span>\n @if (showSearchBtn()) {\n <app-btn\n [group]=\"'search'\"\n [iconBtn]=\"true\"\n text=\"Search\"\n actionType=\"submit\"\n [excludeLogging]=\"true\"\n [disabled]=\"!searchFunction() && !isTablePaginated()\" />\n }\n @if (isCompact()) {\n <app-btn\n [showHelpIcon]=\"false\"\n mclass=\"ms-1\"\n [excludeLogging]=\"true\"\n help=\"Search Fields\"\n customIcon=\"fa fa-ellipsis-v\"\n (mclick)=\"extraFieldsModal.open(); tempSelectedCompactedFields.set([])\" />\n <modal-comp #extraFieldsModal header=\"Additional Search Fields\" width=\"800px\">\n <ng-template modalBody>\n <toggle-input-form\n [valueField]=\"'field' | toAny\"\n labelField=\"label\"\n [gridNo]=\"3\"\n [checkedChecker]=\"asfCheckedChecker()\"\n [list]=\"compactedFields()\"\n (selected)=\"tempSelectedCompactedFields.set($event)\" />\n </ng-template>\n <ng-template modalFooter>\n <app-btn\n icon=\"save\"\n (mclick)=\"extraFieldsModal.close(); selectedCompactedFields()\"\n text=\"Save\" />\n </ng-template>\n </modal-comp>\n }\n @if (createButton()) {\n <span class=\"mx-1\"></span>\n @if (createBtnRoute()) {\n <app-btn\n type=\"outline\"\n text=\"Create\"\n icon=\"add\"\n (mclick)=\"clickedCreate.emit()\"\n routerLink=\"{{ createBtnRoute() }}\" />\n } @else {\n <app-btn type=\"outline\" text=\"Create\" icon=\"add\" (mclick)=\"clickedCreate.emit()\" />\n }\n }\n </div>\n </div>\n </form>\n }\n\n <ng-content select=\"[tablePanel]\"></ng-content>\n <!-- {{searchForm()?.getRawValue()|json}}\n <hr>\n {{standaloneForm()?.getRawValue()|json}} -->\n @if (hasColumns()) {\n <div class=\"mt-3\" [hidden]=\"hideTable()\">\n <ng-container>\n @if (isTablePaginated()) {\n <table-https\n #tableHTTPS\n [searchIfNoQuery]=\"searchIfNoQuery()\"\n [displayedColumns]=\"displayedColumns()\"\n [observableFunc]=\"searchObservableFunc()\"\n (rowClick)=\"rowClick($event)\"\n [centerCells]=\"centerCells()\"\n [expandedRowTemplate]=\"expandedRowTemplate()\"\n [isExpandable]=\"isExpandable()\"\n [label]=\"label()\"\n [nowrap]=\"nowrap()\"\n [orderDirection]=\"orderDirection()\"\n [orderField]=\"orderField()\"\n [pageSize]=\"pageSize()\"\n [rowOptions]=\"options()\"\n [debug]=\"debug()\"\n [rowOptionsMap]=\"rowOptionsMap()\"\n [(queryData)]=\"initialQuery\"\n [showAdditionalColumns]=\"showAdditionalColumns()\"\n [showExport]=\"showExport()\"\n [showRefreshBtn]=\"showRefreshBtn()\"\n [smallerFonts]=\"smallerFonts()\"\n [startSectionTemplate]=\"startSectionTemplate()\"\n [useSelection]=\"useSelection()\"\n noItemTxt=\"No results found\" />\n } @else {\n <table-plain\n [distinct]=\"true\"\n [showPager]=\"true\"\n [pageSize]=\"pageSize()\"\n [centerCells]=\"false\"\n [startSectionTemplate]=\"startSectionTemplate()\"\n [smallerFonts]=\"smallerFonts()\"\n [nowrap]=\"nowrap()\"\n [showFilter]=\"showFilter()\"\n [showExport]=\"showExport()\"\n [isExpandable]=\"isExpandable()\"\n [expandedRowTemplate]=\"expandedRowTemplate()\"\n [label]=\"label()\"\n noItemTxt=\"No results found\"\n (rowClick)=\"rowClick($event)\"\n [orderField]=\"orderField()\"\n [rowOptions]=\"options()\"\n [debug]=\"debug()\"\n [rowOptionsMap]=\"rowOptionsMap()\"\n [showAdditionalColumns]=\"showAdditionalColumns()\"\n [orderDirection]=\"orderDirection()\"\n [displayedColumns]=\"displayedColumns()\"\n [data]=\"data()\" />\n }\n </ng-container>\n </div>\n }\n</loader>\n", styles: [""], dependencies: [{ kind: "component", type: LoaderComponent, selector: "loader", inputs: ["class", "text", "loading", "height", "width", "ratioHW"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3$1.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: PhoneNumberComponent, selector: "app-phone-number", inputs: ["showLabel", "countryCode3", "config"], outputs: ["onCountrySelect"] }, { kind: "component", type: ValidationMessageComponent, selector: "app-validation-message", inputs: ["maxLength", "minLength", "control", "customMessage", "debug", "ignoreDirtiness", "input", "label", "hideOverflow"], outputs: ["labelChange"] }, { kind: "component", type: AutocompleteComponent, selector: "app-autocomplete,autocomplete", inputs: ["showRequiredTag", "validate", "skipDoesOptionExistCheck", "options"], outputs: ["skipDoesOptionExistCheckChange"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: InputBasicComponent, selector: "app-input-basic,app-input", inputs: ["accept", "autocomplete", "input", "contextData", "decimalPoints", "files", "hide", "clearOnDisable", "labelLink", "loading", "multiple", "optionsFunc", "vms", "setCurrentDate", "options"], outputs: ["mSelectedOptionLabel"] }, { kind: "component", type: ModalComponent, selector: "modal-comp", inputs: ["header", "bodyTemplateRef", "footerTemplateRef", "showHeader", "loading", "isFullscreen", "showFooter", "width", "minWidth", "height", "maxHeight", "icon", "data", "disableClose", "hasBackdrop"], outputs: ["headerChange", "showHeaderChange", "mouseLeft", "loadingChange", "showFooterChange", "modalOpen", "modalClose"] }, { kind: "directive", type: ModalBodyDirective, selector: "[modalBody]" }, { kind: "directive", type: ModalFooterDirective, selector: "[modalFooter]" }, { kind: "component", type: BtnComponent, selector: "app-btn", inputs: ["formSchema", "debug", "centerBtn", "danger", "warning", "verbose", "translatorOptions", "loading", "icon", "rightIcon", "leftIcon", "type", "group", "actionType", "animate", "excludeLogging", "loggingValue", "badge", "class", "customIcon", "form", "forms", "help", "helpShowDelay", "iconBtn", "mclass", "showHelpIcon", "rightCustomIcon", "leftCustomIcon", "text", "valid", "mini", "onFormInvalid", "disabled"], outputs: ["loadingChange", "leftCustomIconChange", "mclick", "disabledChange"] }, { kind: "component", type: ToggleInputFormComponent, selector: "toggle-input-form", inputs: ["addToFormFunc", "defaultToggleAll", "readOnly", "hideSearchMenu", "hideGridMenu", "hideToggle", "deleteFromFormFunc", "gridNo", "labelField", "labelSeparator", "searchQuery", "showToggleAll", "valueField", "checkedChecker", "list"], outputs: ["gridNoChange", "searchQueryChange", "selected"] }, { kind: "component", type: TableHttpsComponent, selector: "table-https", inputs: ["observableFunc", "pageNumber", "queryData", "searchIfNoQuery", "showRefreshBtn"], outputs: ["queryDataChange", "dataFetched"] }, { kind: "component", type: TablePlainComponent, selector: "table-plain", inputs: ["customSelectClass", "idField", "obsDataSource", "showFilter", "showPager", "disableSelectionByField", "data", "filterFields", "filterFieldsMap", "selectionPerPage"], outputs: ["view", "dataChanged", "filterChange", "listMutated"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "pipe", type: FunctionCaller2, name: "functionCaller2" }, { kind: "pipe", type: ToAnyPipe, name: "toAny" }] }); }
|
|
18719
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.0", type: FindItemComponent, isStandalone: true, selector: "app-find-item,find-item", inputs: { autoFormatSchema: { classPropertyName: "autoFormatSchema", publicName: "autoFormatSchema", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, autoOrder: { classPropertyName: "autoOrder", publicName: "autoOrder", isSignal: true, isRequired: false, transformFunction: null }, centerCells: { classPropertyName: "centerCells", publicName: "centerCells", isSignal: true, isRequired: false, transformFunction: null }, _displayedColumns: { classPropertyName: "_displayedColumns", publicName: "displayedColumns", isSignal: true, isRequired: false, transformFunction: null }, gridClass: { classPropertyName: "gridClass", publicName: "gridClass", isSignal: true, isRequired: false, transformFunction: null }, hideForm: { classPropertyName: "hideForm", publicName: "hideForm", isSignal: true, isRequired: false, transformFunction: null }, customTableCellTemplates: { classPropertyName: "customTableCellTemplates", publicName: "customTableCellTemplates", isSignal: true, isRequired: false, transformFunction: null }, expandedRowTemplate: { classPropertyName: "expandedRowTemplate", publicName: "expandedRowTemplate", isSignal: true, isRequired: false, transformFunction: null }, rowOptionsMap: { classPropertyName: "rowOptionsMap", publicName: "rowOptionsMap", isSignal: true, isRequired: false, transformFunction: null }, isExpandable: { classPropertyName: "isExpandable", publicName: "isExpandable", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, nowrap: { classPropertyName: "nowrap", publicName: "nowrap", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "rowOptions", isSignal: true, isRequired: false, transformFunction: null }, orderDirection: { classPropertyName: "orderDirection", publicName: "orderDirection", isSignal: true, isRequired: false, transformFunction: null }, orderField: { classPropertyName: "orderField", publicName: "orderField", isSignal: true, isRequired: false, transformFunction: null }, pageSize: { classPropertyName: "pageSize", publicName: "pageSize", isSignal: true, isRequired: false, transformFunction: null }, searchFunction: { classPropertyName: "searchFunction", publicName: "searchFunction", isSignal: true, isRequired: false, transformFunction: null }, showData: { classPropertyName: "showData", publicName: "showData", isSignal: true, isRequired: false, transformFunction: null }, searchIfNoQuery: { classPropertyName: "searchIfNoQuery", publicName: "searchIfNoQuery", isSignal: true, isRequired: false, transformFunction: null }, isCompact: { classPropertyName: "isCompact", publicName: "isCompact", isSignal: true, isRequired: false, transformFunction: null }, showExport: { classPropertyName: "showExport", publicName: "showExport", isSignal: true, isRequired: false, transformFunction: null }, showFilter: { classPropertyName: "showFilter", publicName: "showFilter", isSignal: true, isRequired: false, transformFunction: null }, showRefreshBtn: { classPropertyName: "showRefreshBtn", publicName: "showRefreshBtn", isSignal: true, isRequired: false, transformFunction: null }, startSectionTemplate: { classPropertyName: "startSectionTemplate", publicName: "startSectionTemplate", isSignal: true, isRequired: false, transformFunction: null }, showSearchBtn: { classPropertyName: "showSearchBtn", publicName: "showSearchBtn", isSignal: true, isRequired: false, transformFunction: null }, showClearBtn: { classPropertyName: "showClearBtn", publicName: "showClearBtn", isSignal: true, isRequired: false, transformFunction: null }, showValidationMsg: { classPropertyName: "showValidationMsg", publicName: "showValidationMsg", isSignal: true, isRequired: false, transformFunction: null }, createBtnRoute: { classPropertyName: "createBtnRoute", publicName: "createBtnRoute", isSignal: true, isRequired: false, transformFunction: null }, showAdditionalColumns: { classPropertyName: "showAdditionalColumns", publicName: "showAdditionalColumns", isSignal: true, isRequired: false, transformFunction: null }, smallerFonts: { classPropertyName: "smallerFonts", publicName: "smallerFonts", isSignal: true, isRequired: false, transformFunction: null }, useSelection: { classPropertyName: "useSelection", publicName: "useSelection", isSignal: true, isRequired: false, transformFunction: null }, initialQuery: { classPropertyName: "initialQuery", publicName: "initialQuery", isSignal: true, isRequired: false, transformFunction: null }, createButton: { classPropertyName: "createButton", publicName: "createButton", isSignal: true, isRequired: false, transformFunction: null }, _formSchema: { classPropertyName: "_formSchema", publicName: "formSchema", isSignal: false, isRequired: false, transformFunction: null }, searchObservableFunc: { classPropertyName: "searchObservableFunc", publicName: "searchObservableFunc", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { initialQuery: "initialQueryChange", _rowClick: "rowClick", clickedCreate: "clickedCreate" }, viewQueries: [{ propertyName: "tableHTTPSREF", first: true, predicate: (TableHttpsComponent), descendants: true, isSignal: true }, { propertyName: "tablePlainRef", first: true, predicate: (TablePlainComponent), descendants: true, isSignal: true }, { propertyName: "tableHTTPSREFSignal", first: true, predicate: TableHttpsComponent, descendants: true, isSignal: true }, { propertyName: "tablePlainRefSignal", first: true, predicate: TablePlainComponent, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<loader [loading]=\"_loading()\">\n @if (!hideForm() && searchForm()) {\n <form (ngSubmit)=\"search()\">\n <div class=\"row align-items-center\">\n @for (scheme of computedFormSchema(); track scheme.field) {\n <div class=\"{{ gridClass() }} \">\n <div class=\"row align-items-end\">\n <ng-template #defaultInpTempl>\n <app-input-basic\n #formField\n [name]=\"scheme.field\"\n [form]=\"scheme.form\"\n [type]=\"scheme.type\"\n [autoPickValueField]=\"scheme.autoPickValueField\"\n [valueField]=\"scheme.valueField\"\n [labelType]=\"scheme.labelType | toAny\"\n [checkedSignal]=\"scheme.checked\"\n [showValidation]=\"formField.hasValue() && !!scheme.asyncValidators\"\n [showValidationIcon]=\"formField.hasValue() && !!scheme.asyncValidators\"\n [noFormat]=\"true\"\n [labelField]=\"scheme.labelField\"\n [optionFormatter]=\"scheme.optionFormatter\"\n [options]=\"scheme.options\"\n [decimalPoints]=\"scheme.decimalPoints\"\n [hint]=\"scheme.hint\"\n [max]=\"scheme.max\"\n [min]=\"scheme.min\"\n [placeholder]=\"scheme.placeholder\"\n [label]=\"scheme.label\"\n [disabled]=\"\n scheme.disabledIf | functionCaller2: searchFormValue : (scheme.field | toAny)\n \" />\n </ng-template>\n\n @switch (true) {\n @case (scheme.type == 'tel') {\n <div class=\"col\">\n <app-phone-number\n [form]=\"scheme.form\"\n [label]=\"scheme.label\"\n [name]=\"scheme.field\"\n [showLabel]=\"false\"\n [showValidation]=\"scheme.showValidation\"\n [showValidationIcon]=\"scheme.showValidationIcon\"\n [countryCode3]=\"scheme.countryCode3\"\n [disabled]=\"\n scheme.disabledIf\n | functionCaller2: searchFormValue() : (scheme.field | toAny)\n \"\n #inputTag />\n @if (showValidationMsg()) {\n <app-validation-message [input]=\"inputTag\" />\n }\n </div>\n }\n @case (scheme.type == 'autocomplete') {\n <div class=\"col\">\n <app-autocomplete\n [form]=\"scheme.form\"\n [label]=\"scheme.label\"\n [labelField]=\"scheme.labelField\"\n [autoPickValueField]=\"scheme.autoPickValueField\"\n [labelType]=\"scheme.labelType | toAny\"\n [optionsFunc]=\"scheme.optionsFunc\"\n [name]=\"scheme.field\"\n [optionFormatter]=\"scheme.optionFormatter\"\n [valueField]=\"scheme.valueField\"\n [options]=\"scheme.options\"\n [hint]=\"scheme.hint\"\n [disabled]=\"\n scheme.disabledIf\n | functionCaller2: searchFormValue : (scheme.field | toAny)\n \"\n #inputTag />\n @if (showValidationMsg()) {\n <app-validation-message [input]=\"inputTag\" />\n }\n </div>\n }\n @case (scheme.standalone || scheme.action) {\n <div class=\"col\">\n <form (ngSubmit)=\"fieldAction(scheme)\">\n <div class=\"gx-2 row align-items-end\">\n <div class=\"col\">\n <app-input-basic\n #formField\n [name]=\"scheme.field\"\n [form]=\"scheme.form\"\n [type]=\"scheme.type\"\n [autoPickValueField]=\"scheme.autoPickValueField\"\n [valueField]=\"scheme.valueField\"\n [labelType]=\"scheme.labelType | toAny\"\n [checkedSignal]=\"scheme.checked\"\n [showValidation]=\"formField.hasValue() && !!scheme.asyncValidators\"\n [showValidationIcon]=\"formField.hasValue() && !!scheme.asyncValidators\"\n [noFormat]=\"true\"\n [labelField]=\"scheme.labelField\"\n [optionFormatter]=\"scheme.optionFormatter\"\n [options]=\"scheme.options\"\n [decimalPoints]=\"scheme.decimalPoints\"\n [hint]=\"scheme.hint\"\n [max]=\"scheme.max\"\n [min]=\"scheme.min\"\n [placeholder]=\"scheme.placeholder\"\n [label]=\"scheme.label\"\n [disabled]=\"\n scheme.disabledIf\n | functionCaller2: searchFormValue : (scheme.field | toAny)\n \" />\n </div>\n <div class=\"col-auto\">\n <app-btn\n [icon]=\"scheme.icon || 'show'\"\n [group]=\"scheme.standalone && scheme.action ? 'show' : null\"\n actionType=\"submit\"\n [disabled]=\"!formField?.validSignal()\" />\n </div>\n </div>\n </form>\n </div>\n @if (showValidationMsg()) {\n <app-validation-message [input]=\"formField\" />\n }\n }\n @default {\n <div class=\"col\">\n <app-input-basic\n #formField\n [name]=\"scheme.field\"\n [form]=\"scheme.form\"\n [type]=\"scheme.type\"\n [autoPickValueField]=\"scheme.autoPickValueField\"\n [valueField]=\"scheme.valueField\"\n [labelType]=\"scheme.labelType | toAny\"\n [checkedSignal]=\"scheme.checked\"\n [showValidation]=\"formField.hasValue() && !!scheme.asyncValidators\"\n [showValidationIcon]=\"formField.hasValue() && !!scheme.asyncValidators\"\n [noFormat]=\"true\"\n [labelField]=\"scheme.labelField\"\n [optionFormatter]=\"scheme.optionFormatter\"\n [options]=\"scheme.options\"\n [decimalPoints]=\"scheme.decimalPoints\"\n [hint]=\"scheme.hint\"\n [showValidationMsg]=\"showValidationMsg()\"\n [max]=\"scheme.max\"\n [min]=\"scheme.min\"\n [placeholder]=\"scheme.placeholder\"\n [label]=\"scheme.label\"\n [disabled]=\"\n scheme.disabledIf\n | functionCaller2: searchFormValue : (scheme.field | toAny)\n \" />\n </div>\n }\n }\n </div>\n </div>\n }\n <div class=\"col-md justify-content-end align-items-center d-flex\">\n @if (showClearBtn()) {\n <app-btn type=\"danger-outline\" text=\"Clear\" icon=\"delete\" (mclick)=\"clearFilters()\" />\n }\n <span class=\"mx-1\"></span>\n @if (showSearchBtn()) {\n <app-btn\n [group]=\"'search'\"\n [iconBtn]=\"true\"\n text=\"Search\"\n actionType=\"submit\"\n [excludeLogging]=\"true\"\n [disabled]=\"!searchFunction() && !isTablePaginated()\" />\n }\n @if (isCompact()) {\n <app-btn\n [showHelpIcon]=\"false\"\n mclass=\"ms-1\"\n [excludeLogging]=\"true\"\n help=\"Search Fields\"\n customIcon=\"fa fa-ellipsis-v\"\n (mclick)=\"extraFieldsModal.open(); tempSelectedCompactedFields.set([])\" />\n <modal-comp #extraFieldsModal header=\"Additional Search Fields\" width=\"800px\">\n <ng-template modalBody>\n <toggle-input-form\n [valueField]=\"'field' | toAny\"\n labelField=\"label\"\n [gridNo]=\"3\"\n [checkedChecker]=\"asfCheckedChecker()\"\n [list]=\"compactedFields()\"\n (selected)=\"tempSelectedCompactedFields.set($event)\" />\n </ng-template>\n <ng-template modalFooter>\n <app-btn\n icon=\"save\"\n (mclick)=\"extraFieldsModal.close(); selectedCompactedFields()\"\n text=\"Save\" />\n </ng-template>\n </modal-comp>\n }\n @if (createButton()) {\n <span class=\"mx-1\"></span>\n @if (createBtnRoute()) {\n <app-btn\n type=\"outline\"\n text=\"Create\"\n icon=\"add\"\n (mclick)=\"clickedCreate.emit()\"\n routerLink=\"{{ createBtnRoute() }}\" />\n } @else {\n <app-btn type=\"outline\" text=\"Create\" icon=\"add\" (mclick)=\"clickedCreate.emit()\" />\n }\n }\n </div>\n </div>\n </form>\n }\n\n <ng-content select=\"[tablePanel]\"></ng-content>\n <!-- {{searchForm()?.getRawValue()|json}}\n <hr>\n {{standaloneForm()?.getRawValue()|json}} -->\n @if (hasColumns()) {\n <div class=\"mt-3\" [hidden]=\"hideTable()\">\n <ng-container>\n @if (isTablePaginated()) {\n <table-https\n #tableHTTPS\n [searchIfNoQuery]=\"searchIfNoQuery()\"\n [displayedColumns]=\"displayedColumns()\"\n [observableFunc]=\"searchObservableFunc()\"\n (rowClick)=\"rowClick($event)\"\n [centerCells]=\"centerCells()\"\n [expandedRowTemplate]=\"expandedRowTemplate()\"\n [isExpandable]=\"isExpandable()\"\n [customTemplates]=\"customTableCellTemplates()\"\n [label]=\"label()\"\n [nowrap]=\"nowrap()\"\n [orderDirection]=\"orderDirection()\"\n [orderField]=\"orderField()\"\n [pageSize]=\"pageSize()\"\n [rowOptions]=\"options()\"\n [debug]=\"debug()\"\n [rowOptionsMap]=\"rowOptionsMap()\"\n [(queryData)]=\"initialQuery\"\n [showAdditionalColumns]=\"showAdditionalColumns()\"\n [showExport]=\"showExport()\"\n [showRefreshBtn]=\"showRefreshBtn()\"\n [smallerFonts]=\"smallerFonts()\"\n [startSectionTemplate]=\"startSectionTemplate()\"\n [useSelection]=\"useSelection()\"\n noItemTxt=\"No results found\" />\n } @else {\n <table-plain\n [distinct]=\"true\"\n [showPager]=\"true\"\n [pageSize]=\"pageSize()\"\n [centerCells]=\"false\"\n [startSectionTemplate]=\"startSectionTemplate()\"\n [smallerFonts]=\"smallerFonts()\"\n [nowrap]=\"nowrap()\"\n [showFilter]=\"showFilter()\"\n [showExport]=\"showExport()\"\n [isExpandable]=\"isExpandable()\"\n [customTemplates]=\"customTableCellTemplates()\"\n [expandedRowTemplate]=\"expandedRowTemplate()\"\n [label]=\"label()\"\n noItemTxt=\"No results found\"\n (rowClick)=\"rowClick($event)\"\n [orderField]=\"orderField()\"\n [rowOptions]=\"options()\"\n [debug]=\"debug()\"\n [rowOptionsMap]=\"rowOptionsMap()\"\n [showAdditionalColumns]=\"showAdditionalColumns()\"\n [orderDirection]=\"orderDirection()\"\n [displayedColumns]=\"displayedColumns()\"\n [data]=\"data()\" />\n }\n </ng-container>\n </div>\n }\n</loader>\n", styles: [""], dependencies: [{ kind: "component", type: LoaderComponent, selector: "loader", inputs: ["class", "text", "loading", "height", "width", "ratioHW"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3$1.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: PhoneNumberComponent, selector: "app-phone-number", inputs: ["showLabel", "countryCode3", "config"], outputs: ["onCountrySelect"] }, { kind: "component", type: ValidationMessageComponent, selector: "app-validation-message", inputs: ["maxLength", "minLength", "control", "customMessage", "debug", "ignoreDirtiness", "input", "label", "hideOverflow"], outputs: ["labelChange"] }, { kind: "component", type: AutocompleteComponent, selector: "app-autocomplete,autocomplete", inputs: ["showRequiredTag", "validate", "skipDoesOptionExistCheck", "options"], outputs: ["skipDoesOptionExistCheckChange"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: InputBasicComponent, selector: "app-input-basic,app-input", inputs: ["accept", "autocomplete", "input", "contextData", "decimalPoints", "files", "hide", "clearOnDisable", "labelLink", "loading", "multiple", "optionsFunc", "vms", "setCurrentDate", "options"], outputs: ["mSelectedOptionLabel"] }, { kind: "component", type: ModalComponent, selector: "modal-comp", inputs: ["header", "bodyTemplateRef", "footerTemplateRef", "showHeader", "loading", "isFullscreen", "showFooter", "width", "minWidth", "height", "maxHeight", "icon", "data", "disableClose", "hasBackdrop"], outputs: ["headerChange", "showHeaderChange", "mouseLeft", "loadingChange", "showFooterChange", "modalOpen", "modalClose"] }, { kind: "directive", type: ModalBodyDirective, selector: "[modalBody]" }, { kind: "directive", type: ModalFooterDirective, selector: "[modalFooter]" }, { kind: "component", type: BtnComponent, selector: "app-btn", inputs: ["formSchema", "debug", "centerBtn", "danger", "warning", "verbose", "translatorOptions", "loading", "icon", "rightIcon", "leftIcon", "type", "group", "actionType", "animate", "excludeLogging", "loggingValue", "badge", "class", "customIcon", "form", "forms", "help", "helpShowDelay", "iconBtn", "mclass", "showHelpIcon", "rightCustomIcon", "leftCustomIcon", "text", "valid", "mini", "onFormInvalid", "disabled"], outputs: ["loadingChange", "leftCustomIconChange", "mclick", "disabledChange"] }, { kind: "component", type: ToggleInputFormComponent, selector: "toggle-input-form", inputs: ["addToFormFunc", "defaultToggleAll", "readOnly", "hideSearchMenu", "hideGridMenu", "hideToggle", "deleteFromFormFunc", "gridNo", "labelField", "labelSeparator", "searchQuery", "showToggleAll", "valueField", "checkedChecker", "list"], outputs: ["gridNoChange", "searchQueryChange", "selected"] }, { kind: "component", type: TableHttpsComponent, selector: "table-https", inputs: ["observableFunc", "pageNumber", "queryData", "searchIfNoQuery", "showRefreshBtn"], outputs: ["queryDataChange", "dataFetched"] }, { kind: "component", type: TablePlainComponent, selector: "table-plain", inputs: ["customSelectClass", "idField", "obsDataSource", "showFilter", "showPager", "disableSelectionByField", "data", "filterFields", "filterFieldsMap", "selectionPerPage"], outputs: ["view", "dataChanged", "filterChange", "listMutated"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "pipe", type: FunctionCaller2, name: "functionCaller2" }, { kind: "pipe", type: ToAnyPipe, name: "toAny" }] }); }
|
|
18725
18720
|
}
|
|
18726
18721
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0", ngImport: i0, type: FindItemComponent, decorators: [{
|
|
18727
18722
|
type: Component,
|
|
@@ -18750,7 +18745,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0", ngImpor
|
|
|
18750
18745
|
ReactiveFormsModule,
|
|
18751
18746
|
FunctionCaller2,
|
|
18752
18747
|
ToAnyPipe,
|
|
18753
|
-
], template: "<loader [loading]=\"_loading()\">\n @if (!hideForm() && searchForm()) {\n <form (ngSubmit)=\"search()\">\n <div class=\"row align-items-center\">\n @for (scheme of computedFormSchema(); track scheme.field) {\n <div class=\"{{ gridClass() }} \">\n <div class=\"row align-items-end\">\n <ng-template #defaultInpTempl>\n <app-input-basic\n #formField\n [name]=\"scheme.field\"\n [form]=\"scheme.form\"\n [type]=\"scheme.type\"\n [autoPickValueField]=\"scheme.autoPickValueField\"\n [valueField]=\"scheme.valueField\"\n [labelType]=\"scheme.labelType | toAny\"\n [checkedSignal]=\"scheme.checked\"\n [showValidation]=\"formField.hasValue() && !!scheme.asyncValidators\"\n [showValidationIcon]=\"formField.hasValue() && !!scheme.asyncValidators\"\n [noFormat]=\"true\"\n [labelField]=\"scheme.labelField\"\n [optionFormatter]=\"scheme.optionFormatter\"\n [options]=\"scheme.options\"\n [decimalPoints]=\"scheme.decimalPoints\"\n [hint]=\"scheme.hint\"\n [max]=\"scheme.max\"\n [min]=\"scheme.min\"\n [placeholder]=\"scheme.placeholder\"\n [label]=\"scheme.label\"\n [disabled]=\"\n scheme.disabledIf | functionCaller2: searchFormValue : (scheme.field | toAny)\n \" />\n </ng-template>\n\n @switch (true) {\n @case (scheme.type == 'tel') {\n <div class=\"col\">\n <app-phone-number\n [form]=\"scheme.form\"\n [label]=\"scheme.label\"\n [name]=\"scheme.field\"\n [showLabel]=\"false\"\n [showValidation]=\"scheme.showValidation\"\n [showValidationIcon]=\"scheme.showValidationIcon\"\n [countryCode3]=\"scheme.countryCode3\"\n [disabled]=\"\n scheme.disabledIf\n | functionCaller2: searchFormValue() : (scheme.field | toAny)\n \"\n #inputTag />\n @if (showValidationMsg()) {\n <app-validation-message [input]=\"inputTag\" />\n }\n </div>\n }\n @case (scheme.type == 'autocomplete') {\n <div class=\"col\">\n <app-autocomplete\n [form]=\"scheme.form\"\n [label]=\"scheme.label\"\n [labelField]=\"scheme.labelField\"\n [autoPickValueField]=\"scheme.autoPickValueField\"\n [labelType]=\"scheme.labelType | toAny\"\n [optionsFunc]=\"scheme.optionsFunc\"\n [name]=\"scheme.field\"\n [optionFormatter]=\"scheme.optionFormatter\"\n [valueField]=\"scheme.valueField\"\n [options]=\"scheme.options\"\n [hint]=\"scheme.hint\"\n [disabled]=\"\n scheme.disabledIf\n | functionCaller2: searchFormValue : (scheme.field | toAny)\n \"\n #inputTag />\n @if (showValidationMsg()) {\n <app-validation-message [input]=\"inputTag\" />\n }\n </div>\n }\n @case (scheme.standalone || scheme.action) {\n <div class=\"col\">\n <form (ngSubmit)=\"fieldAction(scheme)\">\n <div class=\"gx-2 row align-items-end\">\n <div class=\"col\">\n <app-input-basic\n #formField\n [name]=\"scheme.field\"\n [form]=\"scheme.form\"\n [type]=\"scheme.type\"\n [autoPickValueField]=\"scheme.autoPickValueField\"\n [valueField]=\"scheme.valueField\"\n [labelType]=\"scheme.labelType | toAny\"\n [checkedSignal]=\"scheme.checked\"\n [showValidation]=\"formField.hasValue() && !!scheme.asyncValidators\"\n [showValidationIcon]=\"formField.hasValue() && !!scheme.asyncValidators\"\n [noFormat]=\"true\"\n [labelField]=\"scheme.labelField\"\n [optionFormatter]=\"scheme.optionFormatter\"\n [options]=\"scheme.options\"\n [decimalPoints]=\"scheme.decimalPoints\"\n [hint]=\"scheme.hint\"\n [max]=\"scheme.max\"\n [min]=\"scheme.min\"\n [placeholder]=\"scheme.placeholder\"\n [label]=\"scheme.label\"\n [disabled]=\"\n scheme.disabledIf\n | functionCaller2: searchFormValue : (scheme.field | toAny)\n \" />\n </div>\n <div class=\"col-auto\">\n <app-btn\n [icon]=\"scheme.icon || 'show'\"\n [group]=\"scheme.standalone && scheme.action ? 'show' : null\"\n actionType=\"submit\"\n [disabled]=\"!formField?.validSignal()\" />\n </div>\n </div>\n </form>\n </div>\n @if (showValidationMsg()) {\n <app-validation-message [input]=\"formField\" />\n }\n }\n @default {\n <div class=\"col\">\n <app-input-basic\n #formField\n [name]=\"scheme.field\"\n [form]=\"scheme.form\"\n [type]=\"scheme.type\"\n [autoPickValueField]=\"scheme.autoPickValueField\"\n [valueField]=\"scheme.valueField\"\n [labelType]=\"scheme.labelType | toAny\"\n [checkedSignal]=\"scheme.checked\"\n [showValidation]=\"formField.hasValue() && !!scheme.asyncValidators\"\n [showValidationIcon]=\"formField.hasValue() && !!scheme.asyncValidators\"\n [noFormat]=\"true\"\n [labelField]=\"scheme.labelField\"\n [optionFormatter]=\"scheme.optionFormatter\"\n [options]=\"scheme.options\"\n [decimalPoints]=\"scheme.decimalPoints\"\n [hint]=\"scheme.hint\"\n [showValidationMsg]=\"showValidationMsg()\"\n [max]=\"scheme.max\"\n [min]=\"scheme.min\"\n [placeholder]=\"scheme.placeholder\"\n [label]=\"scheme.label\"\n [disabled]=\"\n scheme.disabledIf\n | functionCaller2: searchFormValue : (scheme.field | toAny)\n \" />\n </div>\n }\n }\n </div>\n </div>\n }\n <div class=\"col-md justify-content-end align-items-center d-flex\">\n @if (showClearBtn()) {\n <app-btn type=\"danger-outline\" text=\"Clear\" icon=\"delete\" (mclick)=\"clearFilters()\" />\n }\n <span class=\"mx-1\"></span>\n @if (showSearchBtn()) {\n <app-btn\n [group]=\"'search'\"\n [iconBtn]=\"true\"\n text=\"Search\"\n actionType=\"submit\"\n [excludeLogging]=\"true\"\n [disabled]=\"!searchFunction() && !isTablePaginated()\" />\n }\n @if (isCompact()) {\n <app-btn\n [showHelpIcon]=\"false\"\n mclass=\"ms-1\"\n [excludeLogging]=\"true\"\n help=\"Search Fields\"\n customIcon=\"fa fa-ellipsis-v\"\n (mclick)=\"extraFieldsModal.open(); tempSelectedCompactedFields.set([])\" />\n <modal-comp #extraFieldsModal header=\"Additional Search Fields\" width=\"800px\">\n <ng-template modalBody>\n <toggle-input-form\n [valueField]=\"'field' | toAny\"\n labelField=\"label\"\n [gridNo]=\"3\"\n [checkedChecker]=\"asfCheckedChecker()\"\n [list]=\"compactedFields()\"\n (selected)=\"tempSelectedCompactedFields.set($event)\" />\n </ng-template>\n <ng-template modalFooter>\n <app-btn\n icon=\"save\"\n (mclick)=\"extraFieldsModal.close(); selectedCompactedFields()\"\n text=\"Save\" />\n </ng-template>\n </modal-comp>\n }\n @if (createButton()) {\n <span class=\"mx-1\"></span>\n @if (createBtnRoute()) {\n <app-btn\n type=\"outline\"\n text=\"Create\"\n icon=\"add\"\n (mclick)=\"clickedCreate.emit()\"\n routerLink=\"{{ createBtnRoute() }}\" />\n } @else {\n <app-btn type=\"outline\" text=\"Create\" icon=\"add\" (mclick)=\"clickedCreate.emit()\" />\n }\n }\n </div>\n </div>\n </form>\n }\n\n <ng-content select=\"[tablePanel]\"></ng-content>\n <!-- {{searchForm()?.getRawValue()|json}}\n <hr>\n {{standaloneForm()?.getRawValue()|json}} -->\n @if (hasColumns()) {\n <div class=\"mt-3\" [hidden]=\"hideTable()\">\n <ng-container>\n @if (isTablePaginated()) {\n <table-https\n #tableHTTPS\n [searchIfNoQuery]=\"searchIfNoQuery()\"\n [displayedColumns]=\"displayedColumns()\"\n [observableFunc]=\"searchObservableFunc()\"\n (rowClick)=\"rowClick($event)\"\n [centerCells]=\"centerCells()\"\n [expandedRowTemplate]=\"expandedRowTemplate()\"\n [isExpandable]=\"isExpandable()\"\n [label]=\"label()\"\n [nowrap]=\"nowrap()\"\n [orderDirection]=\"orderDirection()\"\n [orderField]=\"orderField()\"\n [pageSize]=\"pageSize()\"\n [rowOptions]=\"options()\"\n [debug]=\"debug()\"\n [rowOptionsMap]=\"rowOptionsMap()\"\n [(queryData)]=\"initialQuery\"\n [showAdditionalColumns]=\"showAdditionalColumns()\"\n [showExport]=\"showExport()\"\n [showRefreshBtn]=\"showRefreshBtn()\"\n [smallerFonts]=\"smallerFonts()\"\n [startSectionTemplate]=\"startSectionTemplate()\"\n [useSelection]=\"useSelection()\"\n noItemTxt=\"No results found\" />\n } @else {\n <table-plain\n [distinct]=\"true\"\n [showPager]=\"true\"\n [pageSize]=\"pageSize()\"\n [centerCells]=\"false\"\n [startSectionTemplate]=\"startSectionTemplate()\"\n [smallerFonts]=\"smallerFonts()\"\n [nowrap]=\"nowrap()\"\n [showFilter]=\"showFilter()\"\n [showExport]=\"showExport()\"\n [isExpandable]=\"isExpandable()\"\n [expandedRowTemplate]=\"expandedRowTemplate()\"\n [label]=\"label()\"\n noItemTxt=\"No results found\"\n (rowClick)=\"rowClick($event)\"\n [orderField]=\"orderField()\"\n [rowOptions]=\"options()\"\n [debug]=\"debug()\"\n [rowOptionsMap]=\"rowOptionsMap()\"\n [showAdditionalColumns]=\"showAdditionalColumns()\"\n [orderDirection]=\"orderDirection()\"\n [displayedColumns]=\"displayedColumns()\"\n [data]=\"data()\" />\n }\n </ng-container>\n </div>\n }\n</loader>\n" }]
|
|
18748
|
+
], template: "<loader [loading]=\"_loading()\">\n @if (!hideForm() && searchForm()) {\n <form (ngSubmit)=\"search()\">\n <div class=\"row align-items-center\">\n @for (scheme of computedFormSchema(); track scheme.field) {\n <div class=\"{{ gridClass() }} \">\n <div class=\"row align-items-end\">\n <ng-template #defaultInpTempl>\n <app-input-basic\n #formField\n [name]=\"scheme.field\"\n [form]=\"scheme.form\"\n [type]=\"scheme.type\"\n [autoPickValueField]=\"scheme.autoPickValueField\"\n [valueField]=\"scheme.valueField\"\n [labelType]=\"scheme.labelType | toAny\"\n [checkedSignal]=\"scheme.checked\"\n [showValidation]=\"formField.hasValue() && !!scheme.asyncValidators\"\n [showValidationIcon]=\"formField.hasValue() && !!scheme.asyncValidators\"\n [noFormat]=\"true\"\n [labelField]=\"scheme.labelField\"\n [optionFormatter]=\"scheme.optionFormatter\"\n [options]=\"scheme.options\"\n [decimalPoints]=\"scheme.decimalPoints\"\n [hint]=\"scheme.hint\"\n [max]=\"scheme.max\"\n [min]=\"scheme.min\"\n [placeholder]=\"scheme.placeholder\"\n [label]=\"scheme.label\"\n [disabled]=\"\n scheme.disabledIf | functionCaller2: searchFormValue : (scheme.field | toAny)\n \" />\n </ng-template>\n\n @switch (true) {\n @case (scheme.type == 'tel') {\n <div class=\"col\">\n <app-phone-number\n [form]=\"scheme.form\"\n [label]=\"scheme.label\"\n [name]=\"scheme.field\"\n [showLabel]=\"false\"\n [showValidation]=\"scheme.showValidation\"\n [showValidationIcon]=\"scheme.showValidationIcon\"\n [countryCode3]=\"scheme.countryCode3\"\n [disabled]=\"\n scheme.disabledIf\n | functionCaller2: searchFormValue() : (scheme.field | toAny)\n \"\n #inputTag />\n @if (showValidationMsg()) {\n <app-validation-message [input]=\"inputTag\" />\n }\n </div>\n }\n @case (scheme.type == 'autocomplete') {\n <div class=\"col\">\n <app-autocomplete\n [form]=\"scheme.form\"\n [label]=\"scheme.label\"\n [labelField]=\"scheme.labelField\"\n [autoPickValueField]=\"scheme.autoPickValueField\"\n [labelType]=\"scheme.labelType | toAny\"\n [optionsFunc]=\"scheme.optionsFunc\"\n [name]=\"scheme.field\"\n [optionFormatter]=\"scheme.optionFormatter\"\n [valueField]=\"scheme.valueField\"\n [options]=\"scheme.options\"\n [hint]=\"scheme.hint\"\n [disabled]=\"\n scheme.disabledIf\n | functionCaller2: searchFormValue : (scheme.field | toAny)\n \"\n #inputTag />\n @if (showValidationMsg()) {\n <app-validation-message [input]=\"inputTag\" />\n }\n </div>\n }\n @case (scheme.standalone || scheme.action) {\n <div class=\"col\">\n <form (ngSubmit)=\"fieldAction(scheme)\">\n <div class=\"gx-2 row align-items-end\">\n <div class=\"col\">\n <app-input-basic\n #formField\n [name]=\"scheme.field\"\n [form]=\"scheme.form\"\n [type]=\"scheme.type\"\n [autoPickValueField]=\"scheme.autoPickValueField\"\n [valueField]=\"scheme.valueField\"\n [labelType]=\"scheme.labelType | toAny\"\n [checkedSignal]=\"scheme.checked\"\n [showValidation]=\"formField.hasValue() && !!scheme.asyncValidators\"\n [showValidationIcon]=\"formField.hasValue() && !!scheme.asyncValidators\"\n [noFormat]=\"true\"\n [labelField]=\"scheme.labelField\"\n [optionFormatter]=\"scheme.optionFormatter\"\n [options]=\"scheme.options\"\n [decimalPoints]=\"scheme.decimalPoints\"\n [hint]=\"scheme.hint\"\n [max]=\"scheme.max\"\n [min]=\"scheme.min\"\n [placeholder]=\"scheme.placeholder\"\n [label]=\"scheme.label\"\n [disabled]=\"\n scheme.disabledIf\n | functionCaller2: searchFormValue : (scheme.field | toAny)\n \" />\n </div>\n <div class=\"col-auto\">\n <app-btn\n [icon]=\"scheme.icon || 'show'\"\n [group]=\"scheme.standalone && scheme.action ? 'show' : null\"\n actionType=\"submit\"\n [disabled]=\"!formField?.validSignal()\" />\n </div>\n </div>\n </form>\n </div>\n @if (showValidationMsg()) {\n <app-validation-message [input]=\"formField\" />\n }\n }\n @default {\n <div class=\"col\">\n <app-input-basic\n #formField\n [name]=\"scheme.field\"\n [form]=\"scheme.form\"\n [type]=\"scheme.type\"\n [autoPickValueField]=\"scheme.autoPickValueField\"\n [valueField]=\"scheme.valueField\"\n [labelType]=\"scheme.labelType | toAny\"\n [checkedSignal]=\"scheme.checked\"\n [showValidation]=\"formField.hasValue() && !!scheme.asyncValidators\"\n [showValidationIcon]=\"formField.hasValue() && !!scheme.asyncValidators\"\n [noFormat]=\"true\"\n [labelField]=\"scheme.labelField\"\n [optionFormatter]=\"scheme.optionFormatter\"\n [options]=\"scheme.options\"\n [decimalPoints]=\"scheme.decimalPoints\"\n [hint]=\"scheme.hint\"\n [showValidationMsg]=\"showValidationMsg()\"\n [max]=\"scheme.max\"\n [min]=\"scheme.min\"\n [placeholder]=\"scheme.placeholder\"\n [label]=\"scheme.label\"\n [disabled]=\"\n scheme.disabledIf\n | functionCaller2: searchFormValue : (scheme.field | toAny)\n \" />\n </div>\n }\n }\n </div>\n </div>\n }\n <div class=\"col-md justify-content-end align-items-center d-flex\">\n @if (showClearBtn()) {\n <app-btn type=\"danger-outline\" text=\"Clear\" icon=\"delete\" (mclick)=\"clearFilters()\" />\n }\n <span class=\"mx-1\"></span>\n @if (showSearchBtn()) {\n <app-btn\n [group]=\"'search'\"\n [iconBtn]=\"true\"\n text=\"Search\"\n actionType=\"submit\"\n [excludeLogging]=\"true\"\n [disabled]=\"!searchFunction() && !isTablePaginated()\" />\n }\n @if (isCompact()) {\n <app-btn\n [showHelpIcon]=\"false\"\n mclass=\"ms-1\"\n [excludeLogging]=\"true\"\n help=\"Search Fields\"\n customIcon=\"fa fa-ellipsis-v\"\n (mclick)=\"extraFieldsModal.open(); tempSelectedCompactedFields.set([])\" />\n <modal-comp #extraFieldsModal header=\"Additional Search Fields\" width=\"800px\">\n <ng-template modalBody>\n <toggle-input-form\n [valueField]=\"'field' | toAny\"\n labelField=\"label\"\n [gridNo]=\"3\"\n [checkedChecker]=\"asfCheckedChecker()\"\n [list]=\"compactedFields()\"\n (selected)=\"tempSelectedCompactedFields.set($event)\" />\n </ng-template>\n <ng-template modalFooter>\n <app-btn\n icon=\"save\"\n (mclick)=\"extraFieldsModal.close(); selectedCompactedFields()\"\n text=\"Save\" />\n </ng-template>\n </modal-comp>\n }\n @if (createButton()) {\n <span class=\"mx-1\"></span>\n @if (createBtnRoute()) {\n <app-btn\n type=\"outline\"\n text=\"Create\"\n icon=\"add\"\n (mclick)=\"clickedCreate.emit()\"\n routerLink=\"{{ createBtnRoute() }}\" />\n } @else {\n <app-btn type=\"outline\" text=\"Create\" icon=\"add\" (mclick)=\"clickedCreate.emit()\" />\n }\n }\n </div>\n </div>\n </form>\n }\n\n <ng-content select=\"[tablePanel]\"></ng-content>\n <!-- {{searchForm()?.getRawValue()|json}}\n <hr>\n {{standaloneForm()?.getRawValue()|json}} -->\n @if (hasColumns()) {\n <div class=\"mt-3\" [hidden]=\"hideTable()\">\n <ng-container>\n @if (isTablePaginated()) {\n <table-https\n #tableHTTPS\n [searchIfNoQuery]=\"searchIfNoQuery()\"\n [displayedColumns]=\"displayedColumns()\"\n [observableFunc]=\"searchObservableFunc()\"\n (rowClick)=\"rowClick($event)\"\n [centerCells]=\"centerCells()\"\n [expandedRowTemplate]=\"expandedRowTemplate()\"\n [isExpandable]=\"isExpandable()\"\n [customTemplates]=\"customTableCellTemplates()\"\n [label]=\"label()\"\n [nowrap]=\"nowrap()\"\n [orderDirection]=\"orderDirection()\"\n [orderField]=\"orderField()\"\n [pageSize]=\"pageSize()\"\n [rowOptions]=\"options()\"\n [debug]=\"debug()\"\n [rowOptionsMap]=\"rowOptionsMap()\"\n [(queryData)]=\"initialQuery\"\n [showAdditionalColumns]=\"showAdditionalColumns()\"\n [showExport]=\"showExport()\"\n [showRefreshBtn]=\"showRefreshBtn()\"\n [smallerFonts]=\"smallerFonts()\"\n [startSectionTemplate]=\"startSectionTemplate()\"\n [useSelection]=\"useSelection()\"\n noItemTxt=\"No results found\" />\n } @else {\n <table-plain\n [distinct]=\"true\"\n [showPager]=\"true\"\n [pageSize]=\"pageSize()\"\n [centerCells]=\"false\"\n [startSectionTemplate]=\"startSectionTemplate()\"\n [smallerFonts]=\"smallerFonts()\"\n [nowrap]=\"nowrap()\"\n [showFilter]=\"showFilter()\"\n [showExport]=\"showExport()\"\n [isExpandable]=\"isExpandable()\"\n [customTemplates]=\"customTableCellTemplates()\"\n [expandedRowTemplate]=\"expandedRowTemplate()\"\n [label]=\"label()\"\n noItemTxt=\"No results found\"\n (rowClick)=\"rowClick($event)\"\n [orderField]=\"orderField()\"\n [rowOptions]=\"options()\"\n [debug]=\"debug()\"\n [rowOptionsMap]=\"rowOptionsMap()\"\n [showAdditionalColumns]=\"showAdditionalColumns()\"\n [orderDirection]=\"orderDirection()\"\n [displayedColumns]=\"displayedColumns()\"\n [data]=\"data()\" />\n }\n </ng-container>\n </div>\n }\n</loader>\n" }]
|
|
18754
18749
|
}], propDecorators: { _formSchema: [{
|
|
18755
18750
|
type: Input,
|
|
18756
18751
|
args: ['formSchema']
|