cloud-ide-core 2.0.135 → 2.0.136
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/{cloud-ide-core-page-form.component-B9tSopSN.mjs → cloud-ide-core-page-form.component-DXbHvMOC.mjs} +4 -4
- package/fesm2022/{cloud-ide-core-page-form.component-B9tSopSN.mjs.map → cloud-ide-core-page-form.component-DXbHvMOC.mjs.map} +1 -1
- package/fesm2022/{cloud-ide-core-workflow-registry-list.component-HrnKDaiv.mjs → cloud-ide-core-workflow-registry-list.component-zwz2r0iS.mjs} +7 -7
- package/fesm2022/{cloud-ide-core-workflow-registry-list.component-HrnKDaiv.mjs.map → cloud-ide-core-workflow-registry-list.component-zwz2r0iS.mjs.map} +1 -1
- package/fesm2022/cloud-ide-core.mjs +1177 -165
- package/fesm2022/cloud-ide-core.mjs.map +1 -1
- package/index.d.ts +53 -2
- package/package.json +1 -1
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { authGuard, SharedObjectIdService, CideSharedOrgStructureComponent } from 'cloud-ide-shared';
|
|
1
|
+
import { authGuard, SharedObjectIdService, CideSharedOrgStructureComponent, ENTITY_SERVICE_TOKEN } from 'cloud-ide-shared';
|
|
2
2
|
import * as i0 from '@angular/core';
|
|
3
3
|
import { Injectable, Component, inject, DestroyRef, viewChild, signal, computed, input, output, ChangeDetectorRef, effect, ViewChild } from '@angular/core';
|
|
4
4
|
import * as i1$1 from '@angular/common';
|
|
@@ -63,7 +63,7 @@ const coreRoutes = [
|
|
|
63
63
|
},
|
|
64
64
|
{
|
|
65
65
|
path: 'page-form',
|
|
66
|
-
loadComponent: () => import('./cloud-ide-core-page-form.component-
|
|
66
|
+
loadComponent: () => import('./cloud-ide-core-page-form.component-DXbHvMOC.mjs').then(c => c.CideCorePageFormComponent),
|
|
67
67
|
title: 'Page Form',
|
|
68
68
|
canActivate: [authGuard],
|
|
69
69
|
data: {
|
|
@@ -72,7 +72,7 @@ const coreRoutes = [
|
|
|
72
72
|
},
|
|
73
73
|
{
|
|
74
74
|
path: 'page-form/:query',
|
|
75
|
-
loadComponent: () => import('./cloud-ide-core-page-form.component-
|
|
75
|
+
loadComponent: () => import('./cloud-ide-core-page-form.component-DXbHvMOC.mjs').then(c => c.CideCorePageFormComponent),
|
|
76
76
|
title: 'Page Form',
|
|
77
77
|
canActivate: [authGuard],
|
|
78
78
|
data: {
|
|
@@ -261,7 +261,7 @@ const coreRoutes = [
|
|
|
261
261
|
// Workflow Management Routes
|
|
262
262
|
{
|
|
263
263
|
path: 'workflow-registry',
|
|
264
|
-
loadComponent: () => import('./cloud-ide-core-workflow-registry-list.component-
|
|
264
|
+
loadComponent: () => import('./cloud-ide-core-workflow-registry-list.component-zwz2r0iS.mjs').then(c => c.CideCoreWorkflowRegistryListComponent),
|
|
265
265
|
title: 'Workflow Registry',
|
|
266
266
|
canActivate: [authGuard],
|
|
267
267
|
data: {
|
|
@@ -272,10 +272,10 @@ const coreRoutes = [
|
|
|
272
272
|
|
|
273
273
|
class CloudIdeCoreService {
|
|
274
274
|
constructor() { }
|
|
275
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
276
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.
|
|
275
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CloudIdeCoreService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
276
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CloudIdeCoreService, providedIn: 'root' });
|
|
277
277
|
}
|
|
278
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
278
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CloudIdeCoreService, decorators: [{
|
|
279
279
|
type: Injectable,
|
|
280
280
|
args: [{
|
|
281
281
|
providedIn: 'root'
|
|
@@ -283,14 +283,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImpor
|
|
|
283
283
|
}], ctorParameters: () => [] });
|
|
284
284
|
|
|
285
285
|
class CloudIdeCoreComponent {
|
|
286
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
287
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.
|
|
286
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CloudIdeCoreComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
287
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: CloudIdeCoreComponent, isStandalone: true, selector: "cide-core", ngImport: i0, template: `
|
|
288
288
|
<p>
|
|
289
289
|
cloud-ide-core works!
|
|
290
290
|
</p>
|
|
291
291
|
`, isInline: true, styles: [""] });
|
|
292
292
|
}
|
|
293
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
293
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CloudIdeCoreComponent, decorators: [{
|
|
294
294
|
type: Component,
|
|
295
295
|
args: [{ selector: 'cide-core', standalone: true, imports: [], template: `
|
|
296
296
|
<p>
|
|
@@ -508,10 +508,10 @@ class MenuManagementService {
|
|
|
508
508
|
console.error('Menu Management Service Error:', errorMessage);
|
|
509
509
|
return throwError(() => new Error(errorMessage));
|
|
510
510
|
}
|
|
511
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
512
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.
|
|
511
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MenuManagementService, deps: [{ token: i1.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
512
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MenuManagementService, providedIn: 'root' });
|
|
513
513
|
}
|
|
514
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
514
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MenuManagementService, decorators: [{
|
|
515
515
|
type: Injectable,
|
|
516
516
|
args: [{
|
|
517
517
|
providedIn: 'root'
|
|
@@ -668,10 +668,10 @@ class CideCoreGeneralMasterService {
|
|
|
668
668
|
console.error('General Master Service Error:', errorMessage);
|
|
669
669
|
return throwError(() => new Error(errorMessage));
|
|
670
670
|
}
|
|
671
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
672
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.
|
|
671
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreGeneralMasterService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
672
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreGeneralMasterService, providedIn: 'root' });
|
|
673
673
|
}
|
|
674
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
674
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreGeneralMasterService, decorators: [{
|
|
675
675
|
type: Injectable,
|
|
676
676
|
args: [{
|
|
677
677
|
providedIn: 'root'
|
|
@@ -865,10 +865,10 @@ class CideCoreGeneralMasterTypeService {
|
|
|
865
865
|
console.error('General Master Type Service Error:', errorMessage);
|
|
866
866
|
return throwError(() => new Error(errorMessage));
|
|
867
867
|
}
|
|
868
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
869
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.
|
|
868
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreGeneralMasterTypeService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
869
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreGeneralMasterTypeService, providedIn: 'root' });
|
|
870
870
|
}
|
|
871
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
871
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreGeneralMasterTypeService, decorators: [{
|
|
872
872
|
type: Injectable,
|
|
873
873
|
args: [{
|
|
874
874
|
providedIn: 'root'
|
|
@@ -958,10 +958,10 @@ class CideCorePageManagementService {
|
|
|
958
958
|
console.error('Page Management Service Error:', errorMessage);
|
|
959
959
|
return throwError(() => new Error(errorMessage));
|
|
960
960
|
}
|
|
961
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
962
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.
|
|
961
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCorePageManagementService, deps: [{ token: i1.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
962
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCorePageManagementService, providedIn: 'root' });
|
|
963
963
|
}
|
|
964
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
964
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCorePageManagementService, decorators: [{
|
|
965
965
|
type: Injectable,
|
|
966
966
|
args: [{
|
|
967
967
|
providedIn: 'root'
|
|
@@ -2345,10 +2345,10 @@ class MenuListComponent {
|
|
|
2345
2345
|
break;
|
|
2346
2346
|
}
|
|
2347
2347
|
}
|
|
2348
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
2349
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.7", type: MenuListComponent, isStandalone: true, selector: "cide-core-app-menu-list", viewQueries: [{ propertyName: "menuDetailsRendererTemplate", first: true, predicate: ["menuDetailsRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "menuTypeRendererTemplate", first: true, predicate: ["menuTypeRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "permissionsRendererTemplate", first: true, predicate: ["permissionsRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "actionsDropdownRendererTemplate", first: true, predicate: ["actionsDropdownRendererTemplate"], descendants: true, isSignal: true }], ngImport: i0, template: "<!-- Menu List with Shared Wrapper -->\n<cide-lyt-shared-wrapper [shared_wrapper_setup_param]=\"{ sypg_page_code: 'core_menu_list' }\">\n<div class=\"tw-table tw-w-full tw-h-full\">\n\n <!-- Quick Add Form Section -->\n <div class=\"tw-table-row tw-h-0\">\n <div class=\"tw-table-cell tw-px-6 tw-py-4 tw-border-b tw-border-gray-200 tw-bg-white\">\n <div class=\"tw-flex tw-items-center tw-justify-between tw-mb-3\">\n <div class=\"tw-flex tw-items-center tw-space-x-3\">\n <cide-ele-icon class=\"tw-text-blue-600 tw-w-5 tw-h-5\">{{ isEditMode() ? 'edit' : 'add' }}</cide-ele-icon>\n <h6 class=\"tw-text-sm tw-font-medium tw-text-gray-900 tw-m-0\">{{ isEditMode() ? 'Edit Menu Item' : 'Quick Add Menu Item' }}</h6>\n </div>\n @if (selectedParentItem()) {\n <div class=\"tw-flex tw-items-center tw-space-x-3 tw-bg-blue-50 tw-border tw-border-blue-200 tw-px-4 tw-py-2 tw-rounded-lg\">\n <cide-ele-icon class=\"tw-text-blue-600 tw-w-4 tw-h-4\">account_tree</cide-ele-icon>\n <div class=\"tw-flex tw-items-center tw-space-x-2\">\n <span class=\"tw-text-sm tw-text-blue-600 tw-font-medium\">{{ isEditMode() ? 'Parent:' : 'Creating child under:' }}</span>\n <span class=\"tw-text-sm tw-text-blue-800 tw-font-semibold\">{{ selectedParentItem()?.syme_title }}</span>\n </div>\n <button \n cideEleButton \n variant=\"ghost\" \n size=\"xs\" \n type=\"button\" \n (click)=\"clearSelectedParent()\" \n class=\"tw-text-blue-400 hover:tw-text-blue-600\">\n <svg class=\"tw-w-4 tw-h-4\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M6 18L18 6M6 6l12 12\"/>\n </svg>\n </button>\n </div>\n }\n </div>\n \n <form [formGroup]=\"quickAddForm\" (ngSubmit)=\"quickAddMenuItem()\">\n <!-- First Row -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-4 tw-gap-3 tw-mb-3\">\n <!-- Menu Title -->\n <div>\n <cide-ele-input \n id=\"syme_title\" \n label=\"Title\" \n formControlName=\"syme_title\"\n size=\"sm\">\n </cide-ele-input>\n </div>\n \n <!-- Menu Type -->\n <div>\n <cide-ele-select \n label=\"Type\" \n [options]=\"menuTypeOptions()\" \n formControlName=\"syme_type\"\n placeholder=\"Select type\"\n size=\"sm\"\n (ngModelChange)=\"onMenuTypeChange()\">\n </cide-ele-select>\n </div>\n \n <!-- Path -->\n <div>\n <cide-ele-input \n id=\"quickPath\" \n type=\"text\"\n label=\"Path\" \n formControlName=\"syme_path\"\n placeholder=\"/path/to/route\"\n size=\"sm\">\n </cide-ele-input>\n </div>\n \n <!-- Icon -->\n <div>\n <cide-ele-input \n id=\"quickIcon\" \n type=\"text\"\n label=\"Icon\" \n formControlName=\"syme_icon\"\n placeholder=\"Icon name\"\n size=\"sm\">\n </cide-ele-input>\n </div>\n \n <!-- Empty div for spacing -->\n <div></div>\n </div>\n \n <!-- Second Row -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-4 tw-gap-3 tw-items-end\">\n <!-- Description -->\n <div>\n <cide-ele-textarea \n id=\"syme_desc\" \n label=\"Description\" \n formControlName=\"syme_desc\"\n placeholder=\"Menu description\"\n rows=\"2\"\n size=\"sm\">\n </cide-ele-textarea>\n </div>\n \n <!-- Permissions (only show for menu and title types) -->\n @if (quickAddForm.get('syme_type')?.value === 'menu') {\n <div>\n <cide-ele-select \n label=\"Permissions\" \n [options]=\"permissionOptions()\" \n formControlName=\"syme_permissions_id_sygms\"\n placeholder=\"Select permissions for this menu\"\n [multiple]=\"true\"\n size=\"sm\">\n </cide-ele-select>\n </div>\n }\n \n <!-- Pages (multiselect) -->\n <div>\n <cide-ele-select \n label=\"Pages\" \n [options]=\"pageOptions()\" \n formControlName=\"syme_pages_id_sypg\"\n placeholder=\"Select pages to connect\"\n [multiple]=\"true\"\n [loading]=\"pagesLoading()\"\n [searchable]=\"true\"\n size=\"sm\">\n </cide-ele-select>\n </div>\n \n <!-- Link -->\n <div>\n <cide-ele-input \n id=\"quickLink\" \n type=\"text\"\n label=\"Link\" \n formControlName=\"syme_link\"\n placeholder=\"External link\"\n size=\"sm\">\n </cide-ele-input>\n </div>\n \n <!-- Active Status and Action Buttons -->\n <div class=\"tw-flex tw-flex-col tw-justify-end\">\n <div class=\"tw-flex tw-items-center tw-space-x-3\">\n <!-- Active Checkbox -->\n <cide-ele-input \n id=\"quickIsActive\"\n type=\"checkbox\"\n label=\"Active\"\n formControlName=\"syme_isactive\"\n size=\"sm\">\n </cide-ele-input>\n \n <!-- Action Buttons -->\n <button \n cideEleButton \n variant=\"primary\" \n size=\"sm\" \n type=\"submit\"\n [disabled]=\"quickAddForm.invalid\"\n class=\"tw-px-2 tw-py-1 tw-w-20\">\n <cide-ele-icon size=\"xs\" class=\"tw-w-4 tw-h-4 tw-mr-1\">{{ isEditMode() ? 'edit' : 'add' }}</cide-ele-icon>\n {{ isEditMode() ? 'Update' : 'Add' }}\n </button>\n <button \n cideEleButton \n variant=\"outline\" \n size=\"sm\" \n type=\"button\"\n (click)=\"resetQuickAddForm()\"\n class=\"tw-px-2 tw-py-1 tw-w-16\">\n <cide-ele-icon size=\"xs\" class=\"tw-w-4 tw-h-4 tw-mr-1\">refresh</cide-ele-icon>\n Reset\n </button>\n </div>\n </div>\n </div>\n </form>\n </div>\n </div>\n\n <!-- Main Content Area -->\n <div class=\"tw-table-row\">\n <div class=\"tw-table-cell tw-h-full tw-relative tw-p-0\">\n <!-- Data Grid Component -->\n <div class=\"tw-h-full tw-w-full tw-overflow-auto\">\n \n <cide-ele-data-grid \n [config]=\"gridConfig()\" \n [templateRenderers]=\"getTemplateRenderers()\"\n [actionHandlers]=\"actionHandlers\"\n [dragDropEnabled]=\"true\" \n (gridEvent)=\"onGridEvent($event)\">\n </cide-ele-data-grid>\n </div>\n\n\n </div>\n </div>\n\n</div>\n\n<!-- \n Angular Template References for Grid Renderers (Best Practice)\n \n These ng-template elements represent the Angular best practice for custom rendering.\n They provide:\n - Type safety with template context\n - Component lifecycle integration\n - Change detection optimization\n - Proper event handling\n - Accessibility features\n \n Note: Current data grid uses string renderers for compatibility.\n Templates are maintained for future component enhancement.\n-->\n\n\n\n<!-- Menu Details Renderer Template -->\n<ng-template #menuDetailsRendererTemplate let-row=\"row\" let-value=\"value\">\n <div class=\"tw-flex tw-items-center tw-min-w-0\">\n <!-- Menu Icon -->\n <div class=\"tw-flex-shrink-0\">\n <cide-ele-icon \n class=\"tw-text-gray-400\" \n size=\"xs\">\n {{ row.syme_icon || 'folder_open' }}\n </cide-ele-icon>\n </div>\n \n <!-- Menu Details -->\n <div class=\"tw-ml-3 tw-min-w-0 tw-flex-1\">\n <div class=\"tw-text-xs tw-font-medium tw-text-gray-900 tw-truncate\" \n [title]=\"row.syme_title\">\n {{ row.syme_title || 'Untitled' }}\n </div>\n @if (row.syme_desc) {\n <div class=\"tw-text-xs tw-text-gray-500 tw-truncate\" \n [title]=\"row.syme_desc\">\n {{ row.syme_desc }}\n </div>\n }\n </div>\n </div>\n</ng-template>\n\n<!-- Menu Type Renderer Template -->\n<ng-template #menuTypeRendererTemplate let-row=\"row\" let-value=\"value\">\n <span class=\"tw-inline-flex tw-items-center tw-px-2.5 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium tw-whitespace-nowrap\"\n [ngClass]=\"getMenuTypeClass(row.syme_type)\">\n {{ getMenuTypeLabel(row.syme_type) }}\n </span>\n</ng-template>\n\n<!-- Actions Dropdown Renderer Template -->\n<ng-template #actionsDropdownRendererTemplate let-row=\"row\" let-value=\"value\">\n <cide-ele-dropdown \n [items]=\"getDropdownItems(row)\"\n [config]=\"{ triggerIcon: 'more_vert', triggerSize: 'sm' }\"\n (itemClick)=\"onDropdownItemClick($event, row)\">\n </cide-ele-dropdown>\n</ng-template>\n\n<!-- Permissions Renderer Template -->\n<ng-template #permissionsRendererTemplate let-row=\"row\" let-value=\"value\">\n <div class=\"tw-flex tw-flex-wrap tw-gap-1 tw-max-w-full tw-items-center\">\n @if (row.syme_type === 'menu') {\n @if (row.syme_permissions_id_sygms && row.syme_permissions_id_sygms.length > 0) {\n @for (permissionId of row.syme_permissions_id_sygms.slice(0, 3); track permissionId) {\n <span class=\"tw-inline-flex tw-items-center tw-px-2.5 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium tw-bg-blue-100 tw-text-blue-800 tw-whitespace-nowrap tw-h-5\">\n {{ getPermissionById(permissionId)?.sygms_title || getPermissionById(permissionId)?.sygms_code || 'Unknown' }}\n </span>\n }\n @if (row.syme_permissions_id_sygms.length > 3) {\n <span \n class=\"tw-inline-flex tw-items-center tw-px-2.5 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium tw-bg-gray-100 tw-text-gray-600 tw-whitespace-nowrap tw-cursor-help tw-h-5\"\n [title]=\"getAllPermissionNames(row.syme_permissions_id_sygms)\">\n +{{ row.syme_permissions_id_sygms.length - 3 }} more\n </span>\n }\n } @else {\n <span class=\"tw-text-xs tw-text-gray-500 tw-h-5 tw-flex tw-items-center\">No permissions</span>\n }\n } @else {\n <!-- Show N/A for module, section, and title types -->\n <span class=\"tw-text-xs tw-text-gray-400 tw-h-5 tw-flex tw-items-center\">N/A</span>\n }\n </div>\n</ng-template>\n</cide-lyt-shared-wrapper>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "component", type: CideEleDataGridComponent, selector: "cide-ele-data-grid", inputs: ["config", "templateRenderers", "customFormatters", "actionHandlers", "serverSidePagination", "totalServerItems", "currentServerPage", "currentServerPageSize", "dragDropEnabled"], outputs: ["gridEvent"] }, { kind: "component", type: CideEleButtonComponent, selector: "button[cideEleButton], a[cideEleButton], cide-ele-button", inputs: ["label", "variant", "size", "type", "shape", "elevation", "disabled", "id", "loading", "fullWidth", "leftIcon", "rightIcon", "customClass", "tooltip", "ariaLabel", "testId", "routerLink", "routerExtras", "preventDoubleClick", "animated"], outputs: ["btnClick", "doubleClick"] }, { kind: "component", type: CideInputComponent, selector: "cide-ele-input", inputs: ["fill", "label", "labelHide", "disabled", "clearInput", "labelPlacement", "labelDir", "placeholder", "leadingIcon", "trailingIcon", "helperText", "helperTextCollapse", "hideHelperAndErrorText", "errorText", "maxlength", "minlength", "required", "autocapitalize", "autocomplete", "type", "width", "id", "ngModel", "option", "min", "max", "step", "size"], outputs: ["ngModelChange"] }, { kind: "component", type: CideSelectComponent, selector: "cide-ele-select", inputs: ["label", "labelHide", "placeholder", "helperText", "errorText", "required", "disabled", "id", "ngModel", "size", "fill", "labelPlacement", "labelDir", "leadingIcon", "trailingIcon", "clearInput", "options", "multiple", "searchable", "showSearchInput", "loading", "valueKey", "labelKey", "treeView"], outputs: ["ngModelChange", "change", "searchChange"] }, { kind: "component", type: CideTextareaComponent, selector: "cide-ele-textarea", inputs: ["label", "labelHide", "placeholder", "helperText", "errorText", "required", "disabled", "minlength", "maxlength", "rows", "id", "ngModel", "size", "fill", "labelPlacement", "labelDir", "leadingIcon", "trailingIcon", "clearInput"], outputs: ["ngModelChange"] }, { kind: "component", type: CideIconComponent, selector: "cide-ele-icon", inputs: ["size", "type", "toolTip"] }, { kind: "component", type: CideEleDropdownComponent, selector: "cide-ele-dropdown", inputs: ["items", "config", "triggerTemplate", "menuTemplate"], outputs: ["itemClick", "dropdownToggle"] }, { kind: "component", type: CideLytSharedWrapperComponent, selector: "cide-lyt-shared-wrapper", inputs: ["shared_wrapper_setup_param", "breadcrumb_data"] }] });
|
|
2348
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MenuListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2349
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: MenuListComponent, isStandalone: true, selector: "cide-core-app-menu-list", viewQueries: [{ propertyName: "menuDetailsRendererTemplate", first: true, predicate: ["menuDetailsRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "menuTypeRendererTemplate", first: true, predicate: ["menuTypeRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "permissionsRendererTemplate", first: true, predicate: ["permissionsRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "actionsDropdownRendererTemplate", first: true, predicate: ["actionsDropdownRendererTemplate"], descendants: true, isSignal: true }], ngImport: i0, template: "<!-- Menu List with Shared Wrapper -->\n<cide-lyt-shared-wrapper [shared_wrapper_setup_param]=\"{ sypg_page_code: 'core_menu_list' }\">\n<div class=\"tw-table tw-w-full tw-h-full\">\n\n <!-- Quick Add Form Section -->\n <div class=\"tw-table-row tw-h-0\">\n <div class=\"tw-table-cell tw-px-6 tw-py-4 tw-border-b tw-border-gray-200 tw-bg-white\">\n <div class=\"tw-flex tw-items-center tw-justify-between tw-mb-3\">\n <div class=\"tw-flex tw-items-center tw-space-x-3\">\n <cide-ele-icon class=\"tw-text-blue-600 tw-w-5 tw-h-5\">{{ isEditMode() ? 'edit' : 'add' }}</cide-ele-icon>\n <h6 class=\"tw-text-sm tw-font-medium tw-text-gray-900 tw-m-0\">{{ isEditMode() ? 'Edit Menu Item' : 'Quick Add Menu Item' }}</h6>\n </div>\n @if (selectedParentItem()) {\n <div class=\"tw-flex tw-items-center tw-space-x-3 tw-bg-blue-50 tw-border tw-border-blue-200 tw-px-4 tw-py-2 tw-rounded-lg\">\n <cide-ele-icon class=\"tw-text-blue-600 tw-w-4 tw-h-4\">account_tree</cide-ele-icon>\n <div class=\"tw-flex tw-items-center tw-space-x-2\">\n <span class=\"tw-text-sm tw-text-blue-600 tw-font-medium\">{{ isEditMode() ? 'Parent:' : 'Creating child under:' }}</span>\n <span class=\"tw-text-sm tw-text-blue-800 tw-font-semibold\">{{ selectedParentItem()?.syme_title }}</span>\n </div>\n <button \n cideEleButton \n variant=\"ghost\" \n size=\"xs\" \n type=\"button\" \n (click)=\"clearSelectedParent()\" \n class=\"tw-text-blue-400 hover:tw-text-blue-600\">\n <svg class=\"tw-w-4 tw-h-4\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M6 18L18 6M6 6l12 12\"/>\n </svg>\n </button>\n </div>\n }\n </div>\n \n <form [formGroup]=\"quickAddForm\" (ngSubmit)=\"quickAddMenuItem()\">\n <!-- First Row -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-4 tw-gap-3 tw-mb-3\">\n <!-- Menu Title -->\n <div>\n <cide-ele-input \n id=\"syme_title\" \n label=\"Title\" \n formControlName=\"syme_title\"\n size=\"sm\">\n </cide-ele-input>\n </div>\n \n <!-- Menu Type -->\n <div>\n <cide-ele-select \n label=\"Type\" \n [options]=\"menuTypeOptions()\" \n formControlName=\"syme_type\"\n placeholder=\"Select type\"\n size=\"sm\"\n (ngModelChange)=\"onMenuTypeChange()\">\n </cide-ele-select>\n </div>\n \n <!-- Path -->\n <div>\n <cide-ele-input \n id=\"quickPath\" \n type=\"text\"\n label=\"Path\" \n formControlName=\"syme_path\"\n placeholder=\"/path/to/route\"\n size=\"sm\">\n </cide-ele-input>\n </div>\n \n <!-- Icon -->\n <div>\n <cide-ele-input \n id=\"quickIcon\" \n type=\"text\"\n label=\"Icon\" \n formControlName=\"syme_icon\"\n placeholder=\"Icon name\"\n size=\"sm\">\n </cide-ele-input>\n </div>\n \n <!-- Empty div for spacing -->\n <div></div>\n </div>\n \n <!-- Second Row -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-4 tw-gap-3 tw-items-end\">\n <!-- Description -->\n <div>\n <cide-ele-textarea \n id=\"syme_desc\" \n label=\"Description\" \n formControlName=\"syme_desc\"\n placeholder=\"Menu description\"\n rows=\"2\"\n size=\"sm\">\n </cide-ele-textarea>\n </div>\n \n <!-- Permissions (only show for menu and title types) -->\n @if (quickAddForm.get('syme_type')?.value === 'menu') {\n <div>\n <cide-ele-select \n label=\"Permissions\" \n [options]=\"permissionOptions()\" \n formControlName=\"syme_permissions_id_sygms\"\n placeholder=\"Select permissions for this menu\"\n [multiple]=\"true\"\n size=\"sm\">\n </cide-ele-select>\n </div>\n }\n \n <!-- Pages (multiselect) -->\n <div>\n <cide-ele-select \n label=\"Pages\" \n [options]=\"pageOptions()\" \n formControlName=\"syme_pages_id_sypg\"\n placeholder=\"Select pages to connect\"\n [multiple]=\"true\"\n [loading]=\"pagesLoading()\"\n [searchable]=\"true\"\n size=\"sm\">\n </cide-ele-select>\n </div>\n \n <!-- Link -->\n <div>\n <cide-ele-input \n id=\"quickLink\" \n type=\"text\"\n label=\"Link\" \n formControlName=\"syme_link\"\n placeholder=\"External link\"\n size=\"sm\">\n </cide-ele-input>\n </div>\n \n <!-- Active Status and Action Buttons -->\n <div class=\"tw-flex tw-flex-col tw-justify-end\">\n <div class=\"tw-flex tw-items-center tw-space-x-3\">\n <!-- Active Checkbox -->\n <cide-ele-input \n id=\"quickIsActive\"\n type=\"checkbox\"\n label=\"Active\"\n formControlName=\"syme_isactive\"\n size=\"sm\">\n </cide-ele-input>\n \n <!-- Action Buttons -->\n <button \n cideEleButton \n variant=\"primary\" \n size=\"sm\" \n type=\"submit\"\n [disabled]=\"quickAddForm.invalid\"\n class=\"tw-px-2 tw-py-1 tw-w-20\">\n <cide-ele-icon size=\"xs\" class=\"tw-w-4 tw-h-4 tw-mr-1\">{{ isEditMode() ? 'edit' : 'add' }}</cide-ele-icon>\n {{ isEditMode() ? 'Update' : 'Add' }}\n </button>\n <button \n cideEleButton \n variant=\"outline\" \n size=\"sm\" \n type=\"button\"\n (click)=\"resetQuickAddForm()\"\n class=\"tw-px-2 tw-py-1 tw-w-16\">\n <cide-ele-icon size=\"xs\" class=\"tw-w-4 tw-h-4 tw-mr-1\">refresh</cide-ele-icon>\n Reset\n </button>\n </div>\n </div>\n </div>\n </form>\n </div>\n </div>\n\n <!-- Main Content Area -->\n <div class=\"tw-table-row\">\n <div class=\"tw-table-cell tw-h-full tw-relative tw-p-0\">\n <!-- Data Grid Component -->\n <div class=\"tw-h-full tw-w-full tw-overflow-auto\">\n \n <cide-ele-data-grid \n [config]=\"gridConfig()\" \n [templateRenderers]=\"getTemplateRenderers()\"\n [actionHandlers]=\"actionHandlers\"\n [dragDropEnabled]=\"true\" \n (gridEvent)=\"onGridEvent($event)\">\n </cide-ele-data-grid>\n </div>\n\n\n </div>\n </div>\n\n</div>\n\n<!-- \n Angular Template References for Grid Renderers (Best Practice)\n \n These ng-template elements represent the Angular best practice for custom rendering.\n They provide:\n - Type safety with template context\n - Component lifecycle integration\n - Change detection optimization\n - Proper event handling\n - Accessibility features\n \n Note: Current data grid uses string renderers for compatibility.\n Templates are maintained for future component enhancement.\n-->\n\n\n\n<!-- Menu Details Renderer Template -->\n<ng-template #menuDetailsRendererTemplate let-row=\"row\" let-value=\"value\">\n <div class=\"tw-flex tw-items-center tw-min-w-0\">\n <!-- Menu Icon -->\n <div class=\"tw-flex-shrink-0\">\n <cide-ele-icon \n class=\"tw-text-gray-400\" \n size=\"xs\">\n {{ row.syme_icon || 'folder_open' }}\n </cide-ele-icon>\n </div>\n \n <!-- Menu Details -->\n <div class=\"tw-ml-3 tw-min-w-0 tw-flex-1\">\n <div class=\"tw-text-xs tw-font-medium tw-text-gray-900 tw-truncate\" \n [title]=\"row.syme_title\">\n {{ row.syme_title || 'Untitled' }}\n </div>\n @if (row.syme_desc) {\n <div class=\"tw-text-xs tw-text-gray-500 tw-truncate\" \n [title]=\"row.syme_desc\">\n {{ row.syme_desc }}\n </div>\n }\n </div>\n </div>\n</ng-template>\n\n<!-- Menu Type Renderer Template -->\n<ng-template #menuTypeRendererTemplate let-row=\"row\" let-value=\"value\">\n <span class=\"tw-inline-flex tw-items-center tw-px-2.5 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium tw-whitespace-nowrap\"\n [ngClass]=\"getMenuTypeClass(row.syme_type)\">\n {{ getMenuTypeLabel(row.syme_type) }}\n </span>\n</ng-template>\n\n<!-- Actions Dropdown Renderer Template -->\n<ng-template #actionsDropdownRendererTemplate let-row=\"row\" let-value=\"value\">\n <cide-ele-dropdown \n [items]=\"getDropdownItems(row)\"\n [config]=\"{ triggerIcon: 'more_vert', triggerSize: 'sm' }\"\n (itemClick)=\"onDropdownItemClick($event, row)\">\n </cide-ele-dropdown>\n</ng-template>\n\n<!-- Permissions Renderer Template -->\n<ng-template #permissionsRendererTemplate let-row=\"row\" let-value=\"value\">\n <div class=\"tw-flex tw-flex-wrap tw-gap-1 tw-max-w-full tw-items-center\">\n @if (row.syme_type === 'menu') {\n @if (row.syme_permissions_id_sygms && row.syme_permissions_id_sygms.length > 0) {\n @for (permissionId of row.syme_permissions_id_sygms.slice(0, 3); track permissionId) {\n <span class=\"tw-inline-flex tw-items-center tw-px-2.5 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium tw-bg-blue-100 tw-text-blue-800 tw-whitespace-nowrap tw-h-5\">\n {{ getPermissionById(permissionId)?.sygms_title || getPermissionById(permissionId)?.sygms_code || 'Unknown' }}\n </span>\n }\n @if (row.syme_permissions_id_sygms.length > 3) {\n <span \n class=\"tw-inline-flex tw-items-center tw-px-2.5 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium tw-bg-gray-100 tw-text-gray-600 tw-whitespace-nowrap tw-cursor-help tw-h-5\"\n [title]=\"getAllPermissionNames(row.syme_permissions_id_sygms)\">\n +{{ row.syme_permissions_id_sygms.length - 3 }} more\n </span>\n }\n } @else {\n <span class=\"tw-text-xs tw-text-gray-500 tw-h-5 tw-flex tw-items-center\">No permissions</span>\n }\n } @else {\n <!-- Show N/A for module, section, and title types -->\n <span class=\"tw-text-xs tw-text-gray-400 tw-h-5 tw-flex tw-items-center\">N/A</span>\n }\n </div>\n</ng-template>\n</cide-lyt-shared-wrapper>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "component", type: CideEleDataGridComponent, selector: "cide-ele-data-grid", inputs: ["config", "templateRenderers", "customFormatters", "actionHandlers", "serverSidePagination", "totalServerItems", "currentServerPage", "currentServerPageSize", "dragDropEnabled"], outputs: ["gridEvent"] }, { kind: "component", type: CideEleButtonComponent, selector: "button[cideEleButton], a[cideEleButton], cide-ele-button", inputs: ["label", "variant", "size", "type", "shape", "elevation", "disabled", "id", "loading", "fullWidth", "leftIcon", "rightIcon", "customClass", "tooltip", "ariaLabel", "testId", "routerLink", "routerExtras", "preventDoubleClick", "animated"], outputs: ["btnClick", "doubleClick"] }, { kind: "component", type: CideInputComponent, selector: "cide-ele-input", inputs: ["fill", "label", "labelHide", "disabled", "clearInput", "labelPlacement", "labelDir", "placeholder", "leadingIcon", "trailingIcon", "helperText", "helperTextCollapse", "hideHelperAndErrorText", "errorText", "maxlength", "minlength", "required", "autocapitalize", "autocomplete", "type", "width", "id", "ngModel", "option", "min", "max", "step", "size"], outputs: ["ngModelChange"] }, { kind: "component", type: CideSelectComponent, selector: "cide-ele-select", inputs: ["label", "labelHide", "placeholder", "helperText", "errorText", "required", "disabled", "id", "ngModel", "size", "fill", "labelPlacement", "labelDir", "leadingIcon", "trailingIcon", "clearInput", "options", "multiple", "searchable", "showSearchInput", "loading", "valueKey", "labelKey", "treeView"], outputs: ["ngModelChange", "change", "searchChange"] }, { kind: "component", type: CideTextareaComponent, selector: "cide-ele-textarea", inputs: ["label", "labelHide", "placeholder", "helperText", "errorText", "required", "disabled", "minlength", "maxlength", "rows", "id", "ngModel", "size", "fill", "labelPlacement", "labelDir", "leadingIcon", "trailingIcon", "clearInput"], outputs: ["ngModelChange"] }, { kind: "component", type: CideIconComponent, selector: "cide-ele-icon", inputs: ["size", "type", "toolTip"] }, { kind: "component", type: CideEleDropdownComponent, selector: "cide-ele-dropdown", inputs: ["items", "config", "triggerTemplate", "menuTemplate"], outputs: ["itemClick", "dropdownToggle"] }, { kind: "component", type: CideLytSharedWrapperComponent, selector: "cide-lyt-shared-wrapper", inputs: ["shared_wrapper_setup_param", "breadcrumb_data"] }] });
|
|
2350
2350
|
}
|
|
2351
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
2351
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: MenuListComponent, decorators: [{
|
|
2352
2352
|
type: Component,
|
|
2353
2353
|
args: [{ selector: 'cide-core-app-menu-list', standalone: true, imports: [
|
|
2354
2354
|
CommonModule,
|
|
@@ -2363,7 +2363,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImpor
|
|
|
2363
2363
|
CideEleDropdownComponent,
|
|
2364
2364
|
CideLytSharedWrapperComponent
|
|
2365
2365
|
], template: "<!-- Menu List with Shared Wrapper -->\n<cide-lyt-shared-wrapper [shared_wrapper_setup_param]=\"{ sypg_page_code: 'core_menu_list' }\">\n<div class=\"tw-table tw-w-full tw-h-full\">\n\n <!-- Quick Add Form Section -->\n <div class=\"tw-table-row tw-h-0\">\n <div class=\"tw-table-cell tw-px-6 tw-py-4 tw-border-b tw-border-gray-200 tw-bg-white\">\n <div class=\"tw-flex tw-items-center tw-justify-between tw-mb-3\">\n <div class=\"tw-flex tw-items-center tw-space-x-3\">\n <cide-ele-icon class=\"tw-text-blue-600 tw-w-5 tw-h-5\">{{ isEditMode() ? 'edit' : 'add' }}</cide-ele-icon>\n <h6 class=\"tw-text-sm tw-font-medium tw-text-gray-900 tw-m-0\">{{ isEditMode() ? 'Edit Menu Item' : 'Quick Add Menu Item' }}</h6>\n </div>\n @if (selectedParentItem()) {\n <div class=\"tw-flex tw-items-center tw-space-x-3 tw-bg-blue-50 tw-border tw-border-blue-200 tw-px-4 tw-py-2 tw-rounded-lg\">\n <cide-ele-icon class=\"tw-text-blue-600 tw-w-4 tw-h-4\">account_tree</cide-ele-icon>\n <div class=\"tw-flex tw-items-center tw-space-x-2\">\n <span class=\"tw-text-sm tw-text-blue-600 tw-font-medium\">{{ isEditMode() ? 'Parent:' : 'Creating child under:' }}</span>\n <span class=\"tw-text-sm tw-text-blue-800 tw-font-semibold\">{{ selectedParentItem()?.syme_title }}</span>\n </div>\n <button \n cideEleButton \n variant=\"ghost\" \n size=\"xs\" \n type=\"button\" \n (click)=\"clearSelectedParent()\" \n class=\"tw-text-blue-400 hover:tw-text-blue-600\">\n <svg class=\"tw-w-4 tw-h-4\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M6 18L18 6M6 6l12 12\"/>\n </svg>\n </button>\n </div>\n }\n </div>\n \n <form [formGroup]=\"quickAddForm\" (ngSubmit)=\"quickAddMenuItem()\">\n <!-- First Row -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-4 tw-gap-3 tw-mb-3\">\n <!-- Menu Title -->\n <div>\n <cide-ele-input \n id=\"syme_title\" \n label=\"Title\" \n formControlName=\"syme_title\"\n size=\"sm\">\n </cide-ele-input>\n </div>\n \n <!-- Menu Type -->\n <div>\n <cide-ele-select \n label=\"Type\" \n [options]=\"menuTypeOptions()\" \n formControlName=\"syme_type\"\n placeholder=\"Select type\"\n size=\"sm\"\n (ngModelChange)=\"onMenuTypeChange()\">\n </cide-ele-select>\n </div>\n \n <!-- Path -->\n <div>\n <cide-ele-input \n id=\"quickPath\" \n type=\"text\"\n label=\"Path\" \n formControlName=\"syme_path\"\n placeholder=\"/path/to/route\"\n size=\"sm\">\n </cide-ele-input>\n </div>\n \n <!-- Icon -->\n <div>\n <cide-ele-input \n id=\"quickIcon\" \n type=\"text\"\n label=\"Icon\" \n formControlName=\"syme_icon\"\n placeholder=\"Icon name\"\n size=\"sm\">\n </cide-ele-input>\n </div>\n \n <!-- Empty div for spacing -->\n <div></div>\n </div>\n \n <!-- Second Row -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-4 tw-gap-3 tw-items-end\">\n <!-- Description -->\n <div>\n <cide-ele-textarea \n id=\"syme_desc\" \n label=\"Description\" \n formControlName=\"syme_desc\"\n placeholder=\"Menu description\"\n rows=\"2\"\n size=\"sm\">\n </cide-ele-textarea>\n </div>\n \n <!-- Permissions (only show for menu and title types) -->\n @if (quickAddForm.get('syme_type')?.value === 'menu') {\n <div>\n <cide-ele-select \n label=\"Permissions\" \n [options]=\"permissionOptions()\" \n formControlName=\"syme_permissions_id_sygms\"\n placeholder=\"Select permissions for this menu\"\n [multiple]=\"true\"\n size=\"sm\">\n </cide-ele-select>\n </div>\n }\n \n <!-- Pages (multiselect) -->\n <div>\n <cide-ele-select \n label=\"Pages\" \n [options]=\"pageOptions()\" \n formControlName=\"syme_pages_id_sypg\"\n placeholder=\"Select pages to connect\"\n [multiple]=\"true\"\n [loading]=\"pagesLoading()\"\n [searchable]=\"true\"\n size=\"sm\">\n </cide-ele-select>\n </div>\n \n <!-- Link -->\n <div>\n <cide-ele-input \n id=\"quickLink\" \n type=\"text\"\n label=\"Link\" \n formControlName=\"syme_link\"\n placeholder=\"External link\"\n size=\"sm\">\n </cide-ele-input>\n </div>\n \n <!-- Active Status and Action Buttons -->\n <div class=\"tw-flex tw-flex-col tw-justify-end\">\n <div class=\"tw-flex tw-items-center tw-space-x-3\">\n <!-- Active Checkbox -->\n <cide-ele-input \n id=\"quickIsActive\"\n type=\"checkbox\"\n label=\"Active\"\n formControlName=\"syme_isactive\"\n size=\"sm\">\n </cide-ele-input>\n \n <!-- Action Buttons -->\n <button \n cideEleButton \n variant=\"primary\" \n size=\"sm\" \n type=\"submit\"\n [disabled]=\"quickAddForm.invalid\"\n class=\"tw-px-2 tw-py-1 tw-w-20\">\n <cide-ele-icon size=\"xs\" class=\"tw-w-4 tw-h-4 tw-mr-1\">{{ isEditMode() ? 'edit' : 'add' }}</cide-ele-icon>\n {{ isEditMode() ? 'Update' : 'Add' }}\n </button>\n <button \n cideEleButton \n variant=\"outline\" \n size=\"sm\" \n type=\"button\"\n (click)=\"resetQuickAddForm()\"\n class=\"tw-px-2 tw-py-1 tw-w-16\">\n <cide-ele-icon size=\"xs\" class=\"tw-w-4 tw-h-4 tw-mr-1\">refresh</cide-ele-icon>\n Reset\n </button>\n </div>\n </div>\n </div>\n </form>\n </div>\n </div>\n\n <!-- Main Content Area -->\n <div class=\"tw-table-row\">\n <div class=\"tw-table-cell tw-h-full tw-relative tw-p-0\">\n <!-- Data Grid Component -->\n <div class=\"tw-h-full tw-w-full tw-overflow-auto\">\n \n <cide-ele-data-grid \n [config]=\"gridConfig()\" \n [templateRenderers]=\"getTemplateRenderers()\"\n [actionHandlers]=\"actionHandlers\"\n [dragDropEnabled]=\"true\" \n (gridEvent)=\"onGridEvent($event)\">\n </cide-ele-data-grid>\n </div>\n\n\n </div>\n </div>\n\n</div>\n\n<!-- \n Angular Template References for Grid Renderers (Best Practice)\n \n These ng-template elements represent the Angular best practice for custom rendering.\n They provide:\n - Type safety with template context\n - Component lifecycle integration\n - Change detection optimization\n - Proper event handling\n - Accessibility features\n \n Note: Current data grid uses string renderers for compatibility.\n Templates are maintained for future component enhancement.\n-->\n\n\n\n<!-- Menu Details Renderer Template -->\n<ng-template #menuDetailsRendererTemplate let-row=\"row\" let-value=\"value\">\n <div class=\"tw-flex tw-items-center tw-min-w-0\">\n <!-- Menu Icon -->\n <div class=\"tw-flex-shrink-0\">\n <cide-ele-icon \n class=\"tw-text-gray-400\" \n size=\"xs\">\n {{ row.syme_icon || 'folder_open' }}\n </cide-ele-icon>\n </div>\n \n <!-- Menu Details -->\n <div class=\"tw-ml-3 tw-min-w-0 tw-flex-1\">\n <div class=\"tw-text-xs tw-font-medium tw-text-gray-900 tw-truncate\" \n [title]=\"row.syme_title\">\n {{ row.syme_title || 'Untitled' }}\n </div>\n @if (row.syme_desc) {\n <div class=\"tw-text-xs tw-text-gray-500 tw-truncate\" \n [title]=\"row.syme_desc\">\n {{ row.syme_desc }}\n </div>\n }\n </div>\n </div>\n</ng-template>\n\n<!-- Menu Type Renderer Template -->\n<ng-template #menuTypeRendererTemplate let-row=\"row\" let-value=\"value\">\n <span class=\"tw-inline-flex tw-items-center tw-px-2.5 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium tw-whitespace-nowrap\"\n [ngClass]=\"getMenuTypeClass(row.syme_type)\">\n {{ getMenuTypeLabel(row.syme_type) }}\n </span>\n</ng-template>\n\n<!-- Actions Dropdown Renderer Template -->\n<ng-template #actionsDropdownRendererTemplate let-row=\"row\" let-value=\"value\">\n <cide-ele-dropdown \n [items]=\"getDropdownItems(row)\"\n [config]=\"{ triggerIcon: 'more_vert', triggerSize: 'sm' }\"\n (itemClick)=\"onDropdownItemClick($event, row)\">\n </cide-ele-dropdown>\n</ng-template>\n\n<!-- Permissions Renderer Template -->\n<ng-template #permissionsRendererTemplate let-row=\"row\" let-value=\"value\">\n <div class=\"tw-flex tw-flex-wrap tw-gap-1 tw-max-w-full tw-items-center\">\n @if (row.syme_type === 'menu') {\n @if (row.syme_permissions_id_sygms && row.syme_permissions_id_sygms.length > 0) {\n @for (permissionId of row.syme_permissions_id_sygms.slice(0, 3); track permissionId) {\n <span class=\"tw-inline-flex tw-items-center tw-px-2.5 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium tw-bg-blue-100 tw-text-blue-800 tw-whitespace-nowrap tw-h-5\">\n {{ getPermissionById(permissionId)?.sygms_title || getPermissionById(permissionId)?.sygms_code || 'Unknown' }}\n </span>\n }\n @if (row.syme_permissions_id_sygms.length > 3) {\n <span \n class=\"tw-inline-flex tw-items-center tw-px-2.5 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium tw-bg-gray-100 tw-text-gray-600 tw-whitespace-nowrap tw-cursor-help tw-h-5\"\n [title]=\"getAllPermissionNames(row.syme_permissions_id_sygms)\">\n +{{ row.syme_permissions_id_sygms.length - 3 }} more\n </span>\n }\n } @else {\n <span class=\"tw-text-xs tw-text-gray-500 tw-h-5 tw-flex tw-items-center\">No permissions</span>\n }\n } @else {\n <!-- Show N/A for module, section, and title types -->\n <span class=\"tw-text-xs tw-text-gray-400 tw-h-5 tw-flex tw-items-center\">N/A</span>\n }\n </div>\n</ng-template>\n</cide-lyt-shared-wrapper>\n" }]
|
|
2366
|
-
}], ctorParameters: () => [] });
|
|
2366
|
+
}], ctorParameters: () => [], propDecorators: { menuDetailsRendererTemplate: [{ type: i0.ViewChild, args: ['menuDetailsRendererTemplate', { isSignal: true }] }], menuTypeRendererTemplate: [{ type: i0.ViewChild, args: ['menuTypeRendererTemplate', { isSignal: true }] }], permissionsRendererTemplate: [{ type: i0.ViewChild, args: ['permissionsRendererTemplate', { isSignal: true }] }], actionsDropdownRendererTemplate: [{ type: i0.ViewChild, args: ['actionsDropdownRendererTemplate', { isSignal: true }] }] } });
|
|
2367
2367
|
|
|
2368
2368
|
var menuList_component = /*#__PURE__*/Object.freeze({
|
|
2369
2369
|
__proto__: null,
|
|
@@ -2547,10 +2547,10 @@ class CideCoreDepartmentManagementService {
|
|
|
2547
2547
|
console.error('Department Management Service Error:', errorMessage);
|
|
2548
2548
|
return throwError(() => new Error(errorMessage));
|
|
2549
2549
|
}
|
|
2550
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
2551
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.
|
|
2550
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreDepartmentManagementService, deps: [{ token: i1.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
2551
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreDepartmentManagementService, providedIn: 'root' });
|
|
2552
2552
|
}
|
|
2553
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
2553
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreDepartmentManagementService, decorators: [{
|
|
2554
2554
|
type: Injectable,
|
|
2555
2555
|
args: [{
|
|
2556
2556
|
providedIn: 'root'
|
|
@@ -3303,10 +3303,10 @@ class CideCoreDepartmentListComponent {
|
|
|
3303
3303
|
trackByItemId(index, item) {
|
|
3304
3304
|
return item._id || '';
|
|
3305
3305
|
}
|
|
3306
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
3307
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.7", type: CideCoreDepartmentListComponent, isStandalone: true, selector: "cide-core-department-list", viewQueries: [{ propertyName: "departmentDetailsRendererTemplate", first: true, predicate: ["departmentDetailsRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "departmentStatusRendererTemplate", first: true, predicate: ["departmentStatusRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "actionsDropdownRendererTemplate", first: true, predicate: ["actionsDropdownRendererTemplate"], descendants: true, isSignal: true }], ngImport: i0, template: "<!-- Department List with Shared Wrapper -->\n<cide-lyt-shared-wrapper [shared_wrapper_setup_param]=\"{ sypg_page_code: 'core_department_list' }\">\n <div class=\"tw-table tw-w-full tw-h-full\">\n\n<!-- Global Notifications -->\n<cide-ele-global-notifications></cide-ele-global-notifications>\n\n <!-- Quick Add Form Section -->\n <div class=\"tw-table-row tw-h-0\">\n <div class=\"tw-table-cell tw-px-6 tw-py-4 tw-border-b tw-border-gray-200 tw-bg-white\">\n <div class=\"tw-flex tw-items-center tw-justify-between tw-mb-0\">\n <div class=\"tw-flex tw-items-center tw-space-x-3 tw-mb-3\">\n <cide-ele-icon class=\"tw-text-blue-600 tw-w-5 tw-h-5\">{{ isEditMode() ? 'edit' : 'add' }}</cide-ele-icon>\n <h6 class=\"tw-text-sm tw-font-medium tw-text-gray-900 tw-m-0\">{{ isEditMode() ? 'Edit Department' : 'Quick Add Department' }}</h6>\n </div>\n @if (selectedParentDepartment()) {\n <div class=\"tw-flex tw-items-center tw-space-x-3 tw-bg-blue-50 tw-border tw-border-blue-200 tw-px-4 tw-py-1 tw-rounded-lg\">\n <cide-ele-icon class=\"tw-text-blue-600 tw-w-4 tw-h-4\">account_tree</cide-ele-icon>\n <div class=\"tw-flex tw-items-center tw-space-x-2\">\n <span class=\"tw-text-sm tw-text-blue-600 tw-font-medium\">{{ isEditMode() ? 'Parent:' : 'Creating child under:' }}</span>\n <span class=\"tw-text-sm tw-text-blue-800 tw-font-semibold\">{{ selectedParentDepartment()?.sydept_name }}</span>\n </div>\n <button \n cideEleButton \n variant=\"ghost\" \n size=\"xs\" \n type=\"button\" \n (click)=\"clearSelectedParent()\" \n class=\"tw-text-blue-400 hover:tw-text-blue-600\">\n <svg class=\"tw-w-4 tw-h-4\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M6 18L18 6M6 6l12 12\"/>\n </svg>\n </button>\n </div>\n }\n </div>\n \n <form [formGroup]=\"quickAddForm\" (ngSubmit)=\"quickAddDepartment()\">\n <!-- First Row -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-4 tw-gap-3 tw-mb-3\">\n <!-- Department Code -->\n <div>\n <cide-ele-input \n id=\"sydept_code\" \n label=\"Code\" \n formControlName=\"sydept_code\"\n placeholder=\"DEPT001\"\n size=\"sm\">\n </cide-ele-input>\n </div>\n \n <!-- Department Name -->\n <div>\n <cide-ele-input \n id=\"sydept_name\" \n label=\"Name\" \n formControlName=\"sydept_name\"\n placeholder=\"Department name\"\n size=\"sm\">\n </cide-ele-input>\n </div>\n \n\n \n <!-- Active Status -->\n <div class=\"tw-flex tw-flex-col tw-justify-end\">\n <cide-ele-input \n id=\"sydept_isactive\"\n type=\"checkbox\"\n label=\"Active\"\n formControlName=\"sydept_isactive\"\n size=\"sm\">\n </cide-ele-input>\n </div>\n </div>\n \n <!-- Second Row -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-4 tw-gap-3 tw-items-end\">\n <!-- Description -->\n <div>\n <cide-ele-textarea \n id=\"sydept_description\" \n label=\"Description\" \n formControlName=\"sydept_description\"\n placeholder=\"Department description\"\n rows=\"2\"\n size=\"sm\">\n </cide-ele-textarea>\n </div>\n \n\n \n <!-- Action Buttons -->\n <div class=\"tw-flex tw-flex-col tw-justify-end\">\n <div class=\"tw-flex tw-space-x-2\">\n <button \n cideEleButton \n variant=\"primary\" \n size=\"sm\" \n type=\"submit\"\n [disabled]=\"quickAddForm.invalid\"\n class=\"tw-px-2 tw-py-1 tw-w-20\">\n <cide-ele-icon size=\"xs\" class=\"tw-w-4 tw-h-4 tw-mr-1\">{{ isEditMode() ? 'edit' : 'add' }}</cide-ele-icon>\n {{ isEditMode() ? 'Update' : 'Add' }}\n </button>\n <button \n cideEleButton \n variant=\"outline\" \n size=\"sm\" \n type=\"button\"\n (click)=\"resetQuickAddForm()\"\n class=\"tw-px-2 tw-py-1 tw-w-16\">\n <cide-ele-icon size=\"xs\" class=\"tw-w-4 tw-h-4 tw-mr-1\">refresh</cide-ele-icon>\n Reset\n </button>\n </div>\n </div>\n </div>\n </form>\n </div>\n </div>\n\n <!-- Header Section with Filters -->\n <div class=\"tw-table-row tw-h-0\">\n <div class=\"tw-table-cell tw-px-6 tw-py-3 tw-border-b tw-border-gray-200 tw-bg-gray-50\">\n <div\n class=\"tw-flex tw-flex-col sm:tw-flex-row tw-justify-between tw-items-start sm:tw-items-center tw-space-y-3 sm:tw-space-y-0\">\n\n <!-- Actions -->\n <div\n class=\"tw-flex tw-flex-col sm:tw-flex-row tw-items-start sm:tw-items-center tw-space-y-3 sm:tw-space-y-0 sm:tw-space-x-3\">\n <!-- Search functionality is handled by the data grid -->\n </div>\n </div>\n\n <!-- Error Message -->\n @if (error()) {\n <div class=\"tw-mt-4 tw-p-4 tw-bg-red-50 tw-border tw-border-red-200 tw-rounded-md\">\n <div class=\"tw-flex tw-items-start\">\n <cide-ele-icon name=\"error\" class=\"tw-text-red-400 tw-w-5 tw-h-5 tw-mt-0.5 tw-flex-shrink-0\"></cide-ele-icon>\n <div class=\"tw-ml-3\">\n <h3 class=\"tw-text-sm tw-font-medium tw-text-red-800 tw-m-0\">Error</h3>\n <p class=\"tw-text-sm tw-text-red-700 tw-mt-1 tw-m-0\">{{ error() }}</p>\n </div>\n </div>\n </div>\n }\n </div>\n </div>\n\n <!-- Main Content Area -->\n <div class=\"tw-table-row\">\n <div class=\"tw-table-cell tw-h-full tw-relative\">\n \n <!-- Data Grid Component -->\n <div class=\"tw-h-full tw-overflow-auto\">\n \n <cide-ele-data-grid \n [config]=\"gridConfig()\" \n [templateRenderers]=\"getTemplateRenderers()\"\n [actionHandlers]=\"actionHandlers\"\n [serverSidePagination]=\"true\" \n [totalServerItems]=\"totalItems()\" \n [currentServerPage]=\"currentPage()\"\n [currentServerPageSize]=\"pageSize()\" \n (gridEvent)=\"onGridEvent($event)\">\n </cide-ele-data-grid>\n </div>\n\n </div>\n </div>\n\n</div>\n\n<!-- Department Details Renderer Template -->\n<ng-template #departmentDetailsRendererTemplate let-row=\"row\" let-value=\"value\">\n <div class=\"tw-flex tw-items-center tw-min-w-0\">\n <!-- Department Icon -->\n <div class=\"tw-flex-shrink-0\">\n <cide-ele-icon \n class=\"tw-text-gray-400\" \n size=\"xs\">\n business\n </cide-ele-icon>\n </div>\n \n <!-- Department Details -->\n <div class=\"tw-ml-3 tw-min-w-0 tw-flex-1\">\n <div class=\"tw-text-sm tw-font-medium tw-text-gray-900 tw-truncate\" \n [title]=\"row.sydept_name\">\n {{ row.sydept_name || 'Untitled' }}\n </div>\n @if (row.sydept_description) {\n <div class=\"tw-text-xs tw-text-gray-500 tw-truncate\" \n [title]=\"row.sydept_description\">\n {{ row.sydept_description }}\n </div>\n }\n </div>\n </div>\n</ng-template>\n\n<!-- Department Status Renderer Template -->\n<ng-template #departmentStatusRendererTemplate let-row=\"row\" let-value=\"value\">\n <span class=\"tw-inline-flex tw-items-center tw-px-2.5 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium tw-whitespace-nowrap\"\n [ngClass]=\"getStatusClass(row.sydept_isactive)\">\n {{ getStatusDisplay(row.sydept_isactive) }}\n </span>\n</ng-template>\n\n<!-- Actions Dropdown Renderer Template -->\n<ng-template #actionsDropdownRendererTemplate let-row=\"row\" let-value=\"value\">\n <cide-ele-dropdown \n [items]=\"getDropdownItems(row)\"\n [config]=\"{ triggerIcon: 'more_vert', triggerSize: 'sm' }\"\n (itemClick)=\"onDropdownItemClick($event, row)\">\n </cide-ele-dropdown>\n</ng-template>\n</cide-lyt-shared-wrapper> ", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "component", type: CideEleDataGridComponent, selector: "cide-ele-data-grid", inputs: ["config", "templateRenderers", "customFormatters", "actionHandlers", "serverSidePagination", "totalServerItems", "currentServerPage", "currentServerPageSize", "dragDropEnabled"], outputs: ["gridEvent"] }, { kind: "component", type: CideEleButtonComponent, selector: "button[cideEleButton], a[cideEleButton], cide-ele-button", inputs: ["label", "variant", "size", "type", "shape", "elevation", "disabled", "id", "loading", "fullWidth", "leftIcon", "rightIcon", "customClass", "tooltip", "ariaLabel", "testId", "routerLink", "routerExtras", "preventDoubleClick", "animated"], outputs: ["btnClick", "doubleClick"] }, { kind: "component", type: CideInputComponent, selector: "cide-ele-input", inputs: ["fill", "label", "labelHide", "disabled", "clearInput", "labelPlacement", "labelDir", "placeholder", "leadingIcon", "trailingIcon", "helperText", "helperTextCollapse", "hideHelperAndErrorText", "errorText", "maxlength", "minlength", "required", "autocapitalize", "autocomplete", "type", "width", "id", "ngModel", "option", "min", "max", "step", "size"], outputs: ["ngModelChange"] }, { kind: "component", type: CideTextareaComponent, selector: "cide-ele-textarea", inputs: ["label", "labelHide", "placeholder", "helperText", "errorText", "required", "disabled", "minlength", "maxlength", "rows", "id", "ngModel", "size", "fill", "labelPlacement", "labelDir", "leadingIcon", "trailingIcon", "clearInput"], outputs: ["ngModelChange"] }, { kind: "component", type: CideIconComponent, selector: "cide-ele-icon", inputs: ["size", "type", "toolTip"] }, { kind: "component", type: CideEleDropdownComponent, selector: "cide-ele-dropdown", inputs: ["items", "config", "triggerTemplate", "menuTemplate"], outputs: ["itemClick", "dropdownToggle"] }, { kind: "component", type: CideEleGlobalNotificationsComponent, selector: "cide-ele-global-notifications" }, { kind: "component", type: CideLytSharedWrapperComponent, selector: "cide-lyt-shared-wrapper", inputs: ["shared_wrapper_setup_param", "breadcrumb_data"] }] });
|
|
3306
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreDepartmentListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3307
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: CideCoreDepartmentListComponent, isStandalone: true, selector: "cide-core-department-list", viewQueries: [{ propertyName: "departmentDetailsRendererTemplate", first: true, predicate: ["departmentDetailsRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "departmentStatusRendererTemplate", first: true, predicate: ["departmentStatusRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "actionsDropdownRendererTemplate", first: true, predicate: ["actionsDropdownRendererTemplate"], descendants: true, isSignal: true }], ngImport: i0, template: "<!-- Department List with Shared Wrapper -->\n<cide-lyt-shared-wrapper [shared_wrapper_setup_param]=\"{ sypg_page_code: 'core_department_list' }\">\n <div class=\"tw-table tw-w-full tw-h-full\">\n\n<!-- Global Notifications -->\n<cide-ele-global-notifications></cide-ele-global-notifications>\n\n <!-- Quick Add Form Section -->\n <div class=\"tw-table-row tw-h-0\">\n <div class=\"tw-table-cell tw-px-6 tw-py-4 tw-border-b tw-border-gray-200 tw-bg-white\">\n <div class=\"tw-flex tw-items-center tw-justify-between tw-mb-0\">\n <div class=\"tw-flex tw-items-center tw-space-x-3 tw-mb-3\">\n <cide-ele-icon class=\"tw-text-blue-600 tw-w-5 tw-h-5\">{{ isEditMode() ? 'edit' : 'add' }}</cide-ele-icon>\n <h6 class=\"tw-text-sm tw-font-medium tw-text-gray-900 tw-m-0\">{{ isEditMode() ? 'Edit Department' : 'Quick Add Department' }}</h6>\n </div>\n @if (selectedParentDepartment()) {\n <div class=\"tw-flex tw-items-center tw-space-x-3 tw-bg-blue-50 tw-border tw-border-blue-200 tw-px-4 tw-py-1 tw-rounded-lg\">\n <cide-ele-icon class=\"tw-text-blue-600 tw-w-4 tw-h-4\">account_tree</cide-ele-icon>\n <div class=\"tw-flex tw-items-center tw-space-x-2\">\n <span class=\"tw-text-sm tw-text-blue-600 tw-font-medium\">{{ isEditMode() ? 'Parent:' : 'Creating child under:' }}</span>\n <span class=\"tw-text-sm tw-text-blue-800 tw-font-semibold\">{{ selectedParentDepartment()?.sydept_name }}</span>\n </div>\n <button \n cideEleButton \n variant=\"ghost\" \n size=\"xs\" \n type=\"button\" \n (click)=\"clearSelectedParent()\" \n class=\"tw-text-blue-400 hover:tw-text-blue-600\">\n <svg class=\"tw-w-4 tw-h-4\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M6 18L18 6M6 6l12 12\"/>\n </svg>\n </button>\n </div>\n }\n </div>\n \n <form [formGroup]=\"quickAddForm\" (ngSubmit)=\"quickAddDepartment()\">\n <!-- First Row -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-4 tw-gap-3 tw-mb-3\">\n <!-- Department Code -->\n <div>\n <cide-ele-input \n id=\"sydept_code\" \n label=\"Code\" \n formControlName=\"sydept_code\"\n placeholder=\"DEPT001\"\n size=\"sm\">\n </cide-ele-input>\n </div>\n \n <!-- Department Name -->\n <div>\n <cide-ele-input \n id=\"sydept_name\" \n label=\"Name\" \n formControlName=\"sydept_name\"\n placeholder=\"Department name\"\n size=\"sm\">\n </cide-ele-input>\n </div>\n \n\n \n <!-- Active Status -->\n <div class=\"tw-flex tw-flex-col tw-justify-end\">\n <cide-ele-input \n id=\"sydept_isactive\"\n type=\"checkbox\"\n label=\"Active\"\n formControlName=\"sydept_isactive\"\n size=\"sm\">\n </cide-ele-input>\n </div>\n </div>\n \n <!-- Second Row -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-4 tw-gap-3 tw-items-end\">\n <!-- Description -->\n <div>\n <cide-ele-textarea \n id=\"sydept_description\" \n label=\"Description\" \n formControlName=\"sydept_description\"\n placeholder=\"Department description\"\n rows=\"2\"\n size=\"sm\">\n </cide-ele-textarea>\n </div>\n \n\n \n <!-- Action Buttons -->\n <div class=\"tw-flex tw-flex-col tw-justify-end\">\n <div class=\"tw-flex tw-space-x-2\">\n <button \n cideEleButton \n variant=\"primary\" \n size=\"sm\" \n type=\"submit\"\n [disabled]=\"quickAddForm.invalid\"\n class=\"tw-px-2 tw-py-1 tw-w-20\">\n <cide-ele-icon size=\"xs\" class=\"tw-w-4 tw-h-4 tw-mr-1\">{{ isEditMode() ? 'edit' : 'add' }}</cide-ele-icon>\n {{ isEditMode() ? 'Update' : 'Add' }}\n </button>\n <button \n cideEleButton \n variant=\"outline\" \n size=\"sm\" \n type=\"button\"\n (click)=\"resetQuickAddForm()\"\n class=\"tw-px-2 tw-py-1 tw-w-16\">\n <cide-ele-icon size=\"xs\" class=\"tw-w-4 tw-h-4 tw-mr-1\">refresh</cide-ele-icon>\n Reset\n </button>\n </div>\n </div>\n </div>\n </form>\n </div>\n </div>\n\n <!-- Header Section with Filters -->\n <div class=\"tw-table-row tw-h-0\">\n <div class=\"tw-table-cell tw-px-6 tw-py-3 tw-border-b tw-border-gray-200 tw-bg-gray-50\">\n <div\n class=\"tw-flex tw-flex-col sm:tw-flex-row tw-justify-between tw-items-start sm:tw-items-center tw-space-y-3 sm:tw-space-y-0\">\n\n <!-- Actions -->\n <div\n class=\"tw-flex tw-flex-col sm:tw-flex-row tw-items-start sm:tw-items-center tw-space-y-3 sm:tw-space-y-0 sm:tw-space-x-3\">\n <!-- Search functionality is handled by the data grid -->\n </div>\n </div>\n\n <!-- Error Message -->\n @if (error()) {\n <div class=\"tw-mt-4 tw-p-4 tw-bg-red-50 tw-border tw-border-red-200 tw-rounded-md\">\n <div class=\"tw-flex tw-items-start\">\n <cide-ele-icon name=\"error\" class=\"tw-text-red-400 tw-w-5 tw-h-5 tw-mt-0.5 tw-flex-shrink-0\"></cide-ele-icon>\n <div class=\"tw-ml-3\">\n <h3 class=\"tw-text-sm tw-font-medium tw-text-red-800 tw-m-0\">Error</h3>\n <p class=\"tw-text-sm tw-text-red-700 tw-mt-1 tw-m-0\">{{ error() }}</p>\n </div>\n </div>\n </div>\n }\n </div>\n </div>\n\n <!-- Main Content Area -->\n <div class=\"tw-table-row\">\n <div class=\"tw-table-cell tw-h-full tw-relative\">\n \n <!-- Data Grid Component -->\n <div class=\"tw-h-full tw-overflow-auto\">\n \n <cide-ele-data-grid \n [config]=\"gridConfig()\" \n [templateRenderers]=\"getTemplateRenderers()\"\n [actionHandlers]=\"actionHandlers\"\n [serverSidePagination]=\"true\" \n [totalServerItems]=\"totalItems()\" \n [currentServerPage]=\"currentPage()\"\n [currentServerPageSize]=\"pageSize()\" \n (gridEvent)=\"onGridEvent($event)\">\n </cide-ele-data-grid>\n </div>\n\n </div>\n </div>\n\n</div>\n\n<!-- Department Details Renderer Template -->\n<ng-template #departmentDetailsRendererTemplate let-row=\"row\" let-value=\"value\">\n <div class=\"tw-flex tw-items-center tw-min-w-0\">\n <!-- Department Icon -->\n <div class=\"tw-flex-shrink-0\">\n <cide-ele-icon \n class=\"tw-text-gray-400\" \n size=\"xs\">\n business\n </cide-ele-icon>\n </div>\n \n <!-- Department Details -->\n <div class=\"tw-ml-3 tw-min-w-0 tw-flex-1\">\n <div class=\"tw-text-sm tw-font-medium tw-text-gray-900 tw-truncate\" \n [title]=\"row.sydept_name\">\n {{ row.sydept_name || 'Untitled' }}\n </div>\n @if (row.sydept_description) {\n <div class=\"tw-text-xs tw-text-gray-500 tw-truncate\" \n [title]=\"row.sydept_description\">\n {{ row.sydept_description }}\n </div>\n }\n </div>\n </div>\n</ng-template>\n\n<!-- Department Status Renderer Template -->\n<ng-template #departmentStatusRendererTemplate let-row=\"row\" let-value=\"value\">\n <span class=\"tw-inline-flex tw-items-center tw-px-2.5 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium tw-whitespace-nowrap\"\n [ngClass]=\"getStatusClass(row.sydept_isactive)\">\n {{ getStatusDisplay(row.sydept_isactive) }}\n </span>\n</ng-template>\n\n<!-- Actions Dropdown Renderer Template -->\n<ng-template #actionsDropdownRendererTemplate let-row=\"row\" let-value=\"value\">\n <cide-ele-dropdown \n [items]=\"getDropdownItems(row)\"\n [config]=\"{ triggerIcon: 'more_vert', triggerSize: 'sm' }\"\n (itemClick)=\"onDropdownItemClick($event, row)\">\n </cide-ele-dropdown>\n</ng-template>\n</cide-lyt-shared-wrapper> ", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "component", type: CideEleDataGridComponent, selector: "cide-ele-data-grid", inputs: ["config", "templateRenderers", "customFormatters", "actionHandlers", "serverSidePagination", "totalServerItems", "currentServerPage", "currentServerPageSize", "dragDropEnabled"], outputs: ["gridEvent"] }, { kind: "component", type: CideEleButtonComponent, selector: "button[cideEleButton], a[cideEleButton], cide-ele-button", inputs: ["label", "variant", "size", "type", "shape", "elevation", "disabled", "id", "loading", "fullWidth", "leftIcon", "rightIcon", "customClass", "tooltip", "ariaLabel", "testId", "routerLink", "routerExtras", "preventDoubleClick", "animated"], outputs: ["btnClick", "doubleClick"] }, { kind: "component", type: CideInputComponent, selector: "cide-ele-input", inputs: ["fill", "label", "labelHide", "disabled", "clearInput", "labelPlacement", "labelDir", "placeholder", "leadingIcon", "trailingIcon", "helperText", "helperTextCollapse", "hideHelperAndErrorText", "errorText", "maxlength", "minlength", "required", "autocapitalize", "autocomplete", "type", "width", "id", "ngModel", "option", "min", "max", "step", "size"], outputs: ["ngModelChange"] }, { kind: "component", type: CideTextareaComponent, selector: "cide-ele-textarea", inputs: ["label", "labelHide", "placeholder", "helperText", "errorText", "required", "disabled", "minlength", "maxlength", "rows", "id", "ngModel", "size", "fill", "labelPlacement", "labelDir", "leadingIcon", "trailingIcon", "clearInput"], outputs: ["ngModelChange"] }, { kind: "component", type: CideIconComponent, selector: "cide-ele-icon", inputs: ["size", "type", "toolTip"] }, { kind: "component", type: CideEleDropdownComponent, selector: "cide-ele-dropdown", inputs: ["items", "config", "triggerTemplate", "menuTemplate"], outputs: ["itemClick", "dropdownToggle"] }, { kind: "component", type: CideEleGlobalNotificationsComponent, selector: "cide-ele-global-notifications" }, { kind: "component", type: CideLytSharedWrapperComponent, selector: "cide-lyt-shared-wrapper", inputs: ["shared_wrapper_setup_param", "breadcrumb_data"] }] });
|
|
3308
3308
|
}
|
|
3309
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
3309
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreDepartmentListComponent, decorators: [{
|
|
3310
3310
|
type: Component,
|
|
3311
3311
|
args: [{ selector: 'cide-core-department-list', standalone: true, imports: [
|
|
3312
3312
|
CommonModule,
|
|
@@ -3321,7 +3321,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImpor
|
|
|
3321
3321
|
CideEleGlobalNotificationsComponent,
|
|
3322
3322
|
CideLytSharedWrapperComponent
|
|
3323
3323
|
], template: "<!-- Department List with Shared Wrapper -->\n<cide-lyt-shared-wrapper [shared_wrapper_setup_param]=\"{ sypg_page_code: 'core_department_list' }\">\n <div class=\"tw-table tw-w-full tw-h-full\">\n\n<!-- Global Notifications -->\n<cide-ele-global-notifications></cide-ele-global-notifications>\n\n <!-- Quick Add Form Section -->\n <div class=\"tw-table-row tw-h-0\">\n <div class=\"tw-table-cell tw-px-6 tw-py-4 tw-border-b tw-border-gray-200 tw-bg-white\">\n <div class=\"tw-flex tw-items-center tw-justify-between tw-mb-0\">\n <div class=\"tw-flex tw-items-center tw-space-x-3 tw-mb-3\">\n <cide-ele-icon class=\"tw-text-blue-600 tw-w-5 tw-h-5\">{{ isEditMode() ? 'edit' : 'add' }}</cide-ele-icon>\n <h6 class=\"tw-text-sm tw-font-medium tw-text-gray-900 tw-m-0\">{{ isEditMode() ? 'Edit Department' : 'Quick Add Department' }}</h6>\n </div>\n @if (selectedParentDepartment()) {\n <div class=\"tw-flex tw-items-center tw-space-x-3 tw-bg-blue-50 tw-border tw-border-blue-200 tw-px-4 tw-py-1 tw-rounded-lg\">\n <cide-ele-icon class=\"tw-text-blue-600 tw-w-4 tw-h-4\">account_tree</cide-ele-icon>\n <div class=\"tw-flex tw-items-center tw-space-x-2\">\n <span class=\"tw-text-sm tw-text-blue-600 tw-font-medium\">{{ isEditMode() ? 'Parent:' : 'Creating child under:' }}</span>\n <span class=\"tw-text-sm tw-text-blue-800 tw-font-semibold\">{{ selectedParentDepartment()?.sydept_name }}</span>\n </div>\n <button \n cideEleButton \n variant=\"ghost\" \n size=\"xs\" \n type=\"button\" \n (click)=\"clearSelectedParent()\" \n class=\"tw-text-blue-400 hover:tw-text-blue-600\">\n <svg class=\"tw-w-4 tw-h-4\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M6 18L18 6M6 6l12 12\"/>\n </svg>\n </button>\n </div>\n }\n </div>\n \n <form [formGroup]=\"quickAddForm\" (ngSubmit)=\"quickAddDepartment()\">\n <!-- First Row -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-4 tw-gap-3 tw-mb-3\">\n <!-- Department Code -->\n <div>\n <cide-ele-input \n id=\"sydept_code\" \n label=\"Code\" \n formControlName=\"sydept_code\"\n placeholder=\"DEPT001\"\n size=\"sm\">\n </cide-ele-input>\n </div>\n \n <!-- Department Name -->\n <div>\n <cide-ele-input \n id=\"sydept_name\" \n label=\"Name\" \n formControlName=\"sydept_name\"\n placeholder=\"Department name\"\n size=\"sm\">\n </cide-ele-input>\n </div>\n \n\n \n <!-- Active Status -->\n <div class=\"tw-flex tw-flex-col tw-justify-end\">\n <cide-ele-input \n id=\"sydept_isactive\"\n type=\"checkbox\"\n label=\"Active\"\n formControlName=\"sydept_isactive\"\n size=\"sm\">\n </cide-ele-input>\n </div>\n </div>\n \n <!-- Second Row -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-4 tw-gap-3 tw-items-end\">\n <!-- Description -->\n <div>\n <cide-ele-textarea \n id=\"sydept_description\" \n label=\"Description\" \n formControlName=\"sydept_description\"\n placeholder=\"Department description\"\n rows=\"2\"\n size=\"sm\">\n </cide-ele-textarea>\n </div>\n \n\n \n <!-- Action Buttons -->\n <div class=\"tw-flex tw-flex-col tw-justify-end\">\n <div class=\"tw-flex tw-space-x-2\">\n <button \n cideEleButton \n variant=\"primary\" \n size=\"sm\" \n type=\"submit\"\n [disabled]=\"quickAddForm.invalid\"\n class=\"tw-px-2 tw-py-1 tw-w-20\">\n <cide-ele-icon size=\"xs\" class=\"tw-w-4 tw-h-4 tw-mr-1\">{{ isEditMode() ? 'edit' : 'add' }}</cide-ele-icon>\n {{ isEditMode() ? 'Update' : 'Add' }}\n </button>\n <button \n cideEleButton \n variant=\"outline\" \n size=\"sm\" \n type=\"button\"\n (click)=\"resetQuickAddForm()\"\n class=\"tw-px-2 tw-py-1 tw-w-16\">\n <cide-ele-icon size=\"xs\" class=\"tw-w-4 tw-h-4 tw-mr-1\">refresh</cide-ele-icon>\n Reset\n </button>\n </div>\n </div>\n </div>\n </form>\n </div>\n </div>\n\n <!-- Header Section with Filters -->\n <div class=\"tw-table-row tw-h-0\">\n <div class=\"tw-table-cell tw-px-6 tw-py-3 tw-border-b tw-border-gray-200 tw-bg-gray-50\">\n <div\n class=\"tw-flex tw-flex-col sm:tw-flex-row tw-justify-between tw-items-start sm:tw-items-center tw-space-y-3 sm:tw-space-y-0\">\n\n <!-- Actions -->\n <div\n class=\"tw-flex tw-flex-col sm:tw-flex-row tw-items-start sm:tw-items-center tw-space-y-3 sm:tw-space-y-0 sm:tw-space-x-3\">\n <!-- Search functionality is handled by the data grid -->\n </div>\n </div>\n\n <!-- Error Message -->\n @if (error()) {\n <div class=\"tw-mt-4 tw-p-4 tw-bg-red-50 tw-border tw-border-red-200 tw-rounded-md\">\n <div class=\"tw-flex tw-items-start\">\n <cide-ele-icon name=\"error\" class=\"tw-text-red-400 tw-w-5 tw-h-5 tw-mt-0.5 tw-flex-shrink-0\"></cide-ele-icon>\n <div class=\"tw-ml-3\">\n <h3 class=\"tw-text-sm tw-font-medium tw-text-red-800 tw-m-0\">Error</h3>\n <p class=\"tw-text-sm tw-text-red-700 tw-mt-1 tw-m-0\">{{ error() }}</p>\n </div>\n </div>\n </div>\n }\n </div>\n </div>\n\n <!-- Main Content Area -->\n <div class=\"tw-table-row\">\n <div class=\"tw-table-cell tw-h-full tw-relative\">\n \n <!-- Data Grid Component -->\n <div class=\"tw-h-full tw-overflow-auto\">\n \n <cide-ele-data-grid \n [config]=\"gridConfig()\" \n [templateRenderers]=\"getTemplateRenderers()\"\n [actionHandlers]=\"actionHandlers\"\n [serverSidePagination]=\"true\" \n [totalServerItems]=\"totalItems()\" \n [currentServerPage]=\"currentPage()\"\n [currentServerPageSize]=\"pageSize()\" \n (gridEvent)=\"onGridEvent($event)\">\n </cide-ele-data-grid>\n </div>\n\n </div>\n </div>\n\n</div>\n\n<!-- Department Details Renderer Template -->\n<ng-template #departmentDetailsRendererTemplate let-row=\"row\" let-value=\"value\">\n <div class=\"tw-flex tw-items-center tw-min-w-0\">\n <!-- Department Icon -->\n <div class=\"tw-flex-shrink-0\">\n <cide-ele-icon \n class=\"tw-text-gray-400\" \n size=\"xs\">\n business\n </cide-ele-icon>\n </div>\n \n <!-- Department Details -->\n <div class=\"tw-ml-3 tw-min-w-0 tw-flex-1\">\n <div class=\"tw-text-sm tw-font-medium tw-text-gray-900 tw-truncate\" \n [title]=\"row.sydept_name\">\n {{ row.sydept_name || 'Untitled' }}\n </div>\n @if (row.sydept_description) {\n <div class=\"tw-text-xs tw-text-gray-500 tw-truncate\" \n [title]=\"row.sydept_description\">\n {{ row.sydept_description }}\n </div>\n }\n </div>\n </div>\n</ng-template>\n\n<!-- Department Status Renderer Template -->\n<ng-template #departmentStatusRendererTemplate let-row=\"row\" let-value=\"value\">\n <span class=\"tw-inline-flex tw-items-center tw-px-2.5 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium tw-whitespace-nowrap\"\n [ngClass]=\"getStatusClass(row.sydept_isactive)\">\n {{ getStatusDisplay(row.sydept_isactive) }}\n </span>\n</ng-template>\n\n<!-- Actions Dropdown Renderer Template -->\n<ng-template #actionsDropdownRendererTemplate let-row=\"row\" let-value=\"value\">\n <cide-ele-dropdown \n [items]=\"getDropdownItems(row)\"\n [config]=\"{ triggerIcon: 'more_vert', triggerSize: 'sm' }\"\n (itemClick)=\"onDropdownItemClick($event, row)\">\n </cide-ele-dropdown>\n</ng-template>\n</cide-lyt-shared-wrapper> " }]
|
|
3324
|
-
}], ctorParameters: () => [] });
|
|
3324
|
+
}], ctorParameters: () => [], propDecorators: { departmentDetailsRendererTemplate: [{ type: i0.ViewChild, args: ['departmentDetailsRendererTemplate', { isSignal: true }] }], departmentStatusRendererTemplate: [{ type: i0.ViewChild, args: ['departmentStatusRendererTemplate', { isSignal: true }] }], actionsDropdownRendererTemplate: [{ type: i0.ViewChild, args: ['actionsDropdownRendererTemplate', { isSignal: true }] }] } });
|
|
3325
3325
|
|
|
3326
3326
|
var departmentList_component = /*#__PURE__*/Object.freeze({
|
|
3327
3327
|
__proto__: null,
|
|
@@ -3509,10 +3509,10 @@ class CideCoreDesignationManagementService {
|
|
|
3509
3509
|
console.error('Designation Management Service Error:', errorMessage);
|
|
3510
3510
|
return throwError(() => new Error(errorMessage));
|
|
3511
3511
|
}
|
|
3512
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
3513
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.
|
|
3512
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreDesignationManagementService, deps: [{ token: i1.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
3513
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreDesignationManagementService, providedIn: 'root' });
|
|
3514
3514
|
}
|
|
3515
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
3515
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreDesignationManagementService, decorators: [{
|
|
3516
3516
|
type: Injectable,
|
|
3517
3517
|
args: [{
|
|
3518
3518
|
providedIn: 'root'
|
|
@@ -3688,10 +3688,10 @@ class CideCoreGradeLevelManagementService {
|
|
|
3688
3688
|
console.error('Grade Level Management Service Error:', errorMessage);
|
|
3689
3689
|
return throwError(() => new Error(errorMessage));
|
|
3690
3690
|
}
|
|
3691
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
3692
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.
|
|
3691
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreGradeLevelManagementService, deps: [{ token: i1.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
3692
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreGradeLevelManagementService, providedIn: 'root' });
|
|
3693
3693
|
}
|
|
3694
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
3694
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreGradeLevelManagementService, decorators: [{
|
|
3695
3695
|
type: Injectable,
|
|
3696
3696
|
args: [{
|
|
3697
3697
|
providedIn: 'root'
|
|
@@ -5077,10 +5077,10 @@ class CideCoreDesignationListComponent {
|
|
|
5077
5077
|
trackByItemId(index, item) {
|
|
5078
5078
|
return item._id || '';
|
|
5079
5079
|
}
|
|
5080
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
5081
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.7", type: CideCoreDesignationListComponent, isStandalone: true, selector: "cide-core-designation-list", viewQueries: [{ propertyName: "designationDetailsRendererTemplate", first: true, predicate: ["designationDetailsRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "designationStatusRendererTemplate", first: true, predicate: ["designationStatusRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "actionsDropdownRendererTemplate", first: true, predicate: ["actionsDropdownRendererTemplate"], descendants: true, isSignal: true }], ngImport: i0, template: "<!-- Designation List with Shared Wrapper -->\n<cide-lyt-shared-wrapper [shared_wrapper_setup_param]=\"{ sypg_page_code: 'core_designation_list' }\">\n <div class=\"tw-table tw-w-full tw-h-full\">\n\n <!-- Quick Add Form Section -->\n <div class=\"tw-table-row tw-h-0\">\n <div class=\"tw-table-cell tw-px-6 tw-py-4 tw-border-b tw-border-gray-200 tw-bg-white\">\n <div class=\"tw-flex tw-items-center tw-justify-between tw-mb-0\">\n <div class=\"tw-flex tw-items-center tw-space-x-3 tw-mb-3\">\n <cide-ele-icon class=\"tw-text-blue-600 tw-w-5 tw-h-5\">{{ isEditMode() ? 'edit' : 'add' }}</cide-ele-icon>\n <h6 class=\"tw-text-sm tw-font-medium tw-text-gray-900 tw-m-0\">{{ isEditMode() ? 'Edit Designation' : 'Quick Add Designation' }}</h6>\n </div>\n @if (selectedParentDesignation()) {\n <div\n class=\"tw-flex tw-items-center tw-space-x-3 tw-bg-blue-50 tw-border tw-border-blue-200 tw-px-4 tw-py-1 tw-rounded-lg\">\n <cide-ele-icon class=\"tw-text-blue-600 tw-w-4 tw-h-4\">account_tree</cide-ele-icon>\n <div class=\"tw-flex tw-items-center tw-space-x-2\">\n <span class=\"tw-text-sm tw-text-blue-600 tw-font-medium\">{{ isEditMode() ? 'Parent:' : 'Creating child under:' }}</span>\n <span class=\"tw-text-sm tw-text-blue-800 tw-font-semibold\">{{ selectedParentDesignation()?.sydsg_name\n }}</span>\n </div>\n <button cideEleButton variant=\"ghost\" size=\"xs\" type=\"button\" (click)=\"clearSelectedParent()\"\n class=\"tw-text-blue-400 hover:tw-text-blue-600\">\n <svg class=\"tw-w-4 tw-h-4\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M6 18L18 6M6 6l12 12\" />\n </svg>\n </button>\n </div>\n }\n @if (selectedParentDepartment()) {\n <div\n class=\"tw-flex tw-items-center tw-space-x-3 tw-bg-green-50 tw-border tw-border-green-200 tw-px-4 tw-py-1 tw-rounded-lg\">\n <cide-ele-icon class=\"tw-text-green-600 tw-w-4 tw-h-4\">business</cide-ele-icon>\n <div class=\"tw-flex tw-items-center tw-space-x-2\">\n <span class=\"tw-text-sm tw-text-green-600 tw-font-medium\">{{ isEditMode() ? 'Department:' : 'Department:'\n }}</span>\n <span class=\"tw-text-sm tw-text-green-800 tw-font-semibold\">{{ selectedParentDepartment()?.sydept_name\n }}</span>\n </div>\n <button cideEleButton variant=\"ghost\" size=\"xs\" type=\"button\" (click)=\"clearSelectedParentDepartment()\"\n class=\"tw-text-green-400 hover:tw-text-green-600\">\n <svg class=\"tw-w-4 tw-h-4\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M6 18L18 6M6 6l12 12\" />\n </svg>\n </button>\n </div>\n }\n </div>\n\n <form [formGroup]=\"quickAddForm\" (ngSubmit)=\"quickAddDesignation()\">\n <!-- First Row -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-5 tw-gap-3 tw-mb-3\">\n <!-- Designation Name -->\n <div>\n <cide-ele-input id=\"sydsg_name\" label=\"Name\" formControlName=\"sydsg_name\" placeholder=\"Designation name\"\n size=\"sm\">\n </cide-ele-input>\n </div>\n\n <!-- Designation Code -->\n <div>\n <cide-ele-input id=\"sydsg_code\" label=\"Code\" formControlName=\"sydsg_code\" placeholder=\"DESG001\"\n size=\"sm\">\n </cide-ele-input>\n </div>\n <!-- Grade Level -->\n <div>\n <cide-ele-select id=\"sydsg_grade_level_id_sydsgl\" label=\"Grade Level\" [options]=\"gradeLevelOptions()\"\n formControlName=\"sydsg_grade_level_id_sydsgl\" placeholder=\"Select grade level\" size=\"sm\">\n </cide-ele-select>\n </div>\n\n <!-- Department -->\n <div>\n <cide-ele-select id=\"sydsg_department_id_sydpt\" label=\"Department\" [options]=\"departmentOptions()\"\n formControlName=\"sydsg_department_id_sydpt\" placeholder=\"Select department\" size=\"sm\">\n </cide-ele-select>\n </div>\n\n <!-- Active Status -->\n <div class=\"tw-flex tw-flex-col tw-justify-end\">\n <cide-ele-input id=\"sydsg_isactive\" type=\"checkbox\" label=\"Active\" formControlName=\"sydsg_isactive\"\n size=\"sm\">\n </cide-ele-input>\n </div>\n </div>\n\n <!-- Second Row -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-4 tw-gap-3 tw-items-end\">\n <!-- Description -->\n <div>\n <cide-ele-textarea id=\"sydsg_description\" label=\"Description\" formControlName=\"sydsg_description\"\n placeholder=\"Designation description\" rows=\"2\" size=\"sm\">\n </cide-ele-textarea>\n </div>\n\n <!-- Entity ID (Hidden) -->\n <div class=\"tw-hidden\">\n <cide-ele-input id=\"desg_entity_id_syen\" label=\"Entity ID\" formControlName=\"desg_entity_id_syen\"\n placeholder=\"Entity ID\" size=\"sm\">\n </cide-ele-input>\n </div>\n\n <!-- Action Buttons -->\n <div class=\"tw-flex tw-flex-col tw-justify-end\">\n <div class=\"tw-flex tw-space-x-2\">\n <button cideEleButton variant=\"primary\" size=\"sm\" type=\"submit\" [disabled]=\"quickAddForm.invalid\"\n class=\"tw-px-2 tw-py-1 tw-w-20\">\n <cide-ele-icon size=\"xs\" class=\"tw-w-4 tw-h-4 tw-mr-1\">{{ isEditMode() ? 'edit' : 'add'\n }}</cide-ele-icon>\n {{ isEditMode() ? 'Update' : 'Add' }}\n </button>\n <button cideEleButton variant=\"outline\" size=\"sm\" type=\"button\" (click)=\"resetQuickAddForm()\"\n class=\"tw-px-2 tw-py-1 tw-w-16\">\n <cide-ele-icon size=\"xs\" class=\"tw-w-4 tw-h-4 tw-mr-1\">refresh</cide-ele-icon>\n Reset\n </button>\n </div>\n </div>\n </div>\n </form>\n </div>\n </div>\n\n\n\n <!-- Header Section with Filters -->\n <div class=\"tw-table-row tw-h-0\">\n <div class=\"tw-table-cell tw-px-6 tw-py-3 tw-border-b tw-border-gray-200 tw-bg-gray-50\">\n <div\n class=\"tw-flex tw-flex-col sm:tw-flex-row tw-justify-between tw-items-start sm:tw-items-center tw-space-y-3 sm:tw-space-y-0\">\n\n <!-- Actions -->\n <div\n class=\"tw-flex tw-flex-col sm:tw-flex-row tw-items-start sm:tw-items-center tw-space-y-3 sm:tw-space-y-0 sm:tw-space-x-3\">\n <!-- Search functionality is handled by the data grid -->\n </div>\n </div>\n\n <!-- Error Message -->\n @if (error()) {\n <div class=\"tw-mt-4 tw-p-4 tw-bg-red-50 tw-border tw-border-red-200 tw-rounded-md\">\n <div class=\"tw-flex tw-items-start\">\n <cide-ele-icon name=\"error\"\n class=\"tw-text-red-400 tw-w-5 tw-h-5 tw-mt-0.5 tw-flex-shrink-0\"></cide-ele-icon>\n <div class=\"tw-ml-3\">\n <h3 class=\"tw-text-sm tw-font-medium tw-text-red-800 tw-m-0\">Error</h3>\n <p class=\"tw-text-sm tw-text-red-700 tw-mt-1 tw-m-0\">{{ error() }}</p>\n </div>\n </div>\n </div>\n }\n </div>\n </div>\n\n <!-- Main Content Area -->\n <div class=\"tw-table-row\">\n <div class=\"tw-table-cell tw-h-full tw-relative\">\n\n <!-- Data Grid Component -->\n <div class=\"tw-h-full tw-overflow-auto\">\n\n <cide-ele-data-grid [config]=\"gridConfig()\" [templateRenderers]=\"getTemplateRenderers()\"\n [actionHandlers]=\"actionHandlers\" [serverSidePagination]=\"true\" [totalServerItems]=\"totalItems()\"\n [currentServerPage]=\"currentPage()\" [currentServerPageSize]=\"pageSize()\" (gridEvent)=\"onGridEvent($event)\">\n </cide-ele-data-grid>\n </div>\n\n </div>\n </div>\n\n </div>\n\n <!-- Designation Details Renderer Template -->\n <ng-template #designationDetailsRendererTemplate let-row=\"row\" let-value=\"value\">\n <div class=\"tw-flex tw-items-center tw-min-w-0\">\n <!-- Dynamic Icon based on type -->\n <div class=\"tw-flex-shrink-0\">\n <cide-ele-icon [class]=\"row.type === 'department' ? 'tw-text-green-500' : 'tw-text-blue-500'\" size=\"xs\">\n {{ row.type === 'department' ? 'business' : 'work' }}\n </cide-ele-icon>\n </div>\n\n <!-- Details -->\n <div class=\"tw-ml-3 tw-min-w-0 tw-flex-1\">\n <div class=\"tw-flex tw-items-center tw-space-x-2\">\n <div class=\"tw-text-sm tw-font-medium tw-text-gray-900 tw-truncate\" [title]=\"row.name\">\n {{ row.name || 'Untitled' }}\n </div>\n @if (row.type === 'department') {\n <span\n class=\"tw-inline-flex tw-items-center tw-px-2 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium tw-bg-green-100 tw-text-green-800\">\n Department\n </span>\n }\n </div>\n @if (row.description) {\n <div class=\"tw-text-xs tw-text-gray-500 tw-truncate\" [title]=\"row.description\">\n {{ row.description }}\n </div>\n }\n </div>\n </div>\n </ng-template>\n\n <!-- Designation Status Renderer Template -->\n <ng-template #designationStatusRendererTemplate let-row=\"row\" let-value=\"value\">\n <span\n class=\"tw-inline-flex tw-items-center tw-px-2.5 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium tw-whitespace-nowrap\"\n [ngClass]=\"getStatusClass(row.status)\">\n {{ getStatusDisplay(row.status) }}\n </span>\n </ng-template>\n\n <!-- Actions Dropdown Renderer Template -->\n <ng-template #actionsDropdownRendererTemplate let-row=\"row\" let-value=\"value\">\n <cide-ele-dropdown [items]=\"getDropdownItems(row)\" [config]=\"{ triggerIcon: 'more_vert', triggerSize: 'sm' }\"\n (itemClick)=\"onDropdownItemClick($event, row)\">\n </cide-ele-dropdown>\n </ng-template>\n</cide-lyt-shared-wrapper>", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "component", type: CideEleDataGridComponent, selector: "cide-ele-data-grid", inputs: ["config", "templateRenderers", "customFormatters", "actionHandlers", "serverSidePagination", "totalServerItems", "currentServerPage", "currentServerPageSize", "dragDropEnabled"], outputs: ["gridEvent"] }, { kind: "component", type: CideEleButtonComponent, selector: "button[cideEleButton], a[cideEleButton], cide-ele-button", inputs: ["label", "variant", "size", "type", "shape", "elevation", "disabled", "id", "loading", "fullWidth", "leftIcon", "rightIcon", "customClass", "tooltip", "ariaLabel", "testId", "routerLink", "routerExtras", "preventDoubleClick", "animated"], outputs: ["btnClick", "doubleClick"] }, { kind: "component", type: CideInputComponent, selector: "cide-ele-input", inputs: ["fill", "label", "labelHide", "disabled", "clearInput", "labelPlacement", "labelDir", "placeholder", "leadingIcon", "trailingIcon", "helperText", "helperTextCollapse", "hideHelperAndErrorText", "errorText", "maxlength", "minlength", "required", "autocapitalize", "autocomplete", "type", "width", "id", "ngModel", "option", "min", "max", "step", "size"], outputs: ["ngModelChange"] }, { kind: "component", type: CideSelectComponent, selector: "cide-ele-select", inputs: ["label", "labelHide", "placeholder", "helperText", "errorText", "required", "disabled", "id", "ngModel", "size", "fill", "labelPlacement", "labelDir", "leadingIcon", "trailingIcon", "clearInput", "options", "multiple", "searchable", "showSearchInput", "loading", "valueKey", "labelKey", "treeView"], outputs: ["ngModelChange", "change", "searchChange"] }, { kind: "component", type: CideTextareaComponent, selector: "cide-ele-textarea", inputs: ["label", "labelHide", "placeholder", "helperText", "errorText", "required", "disabled", "minlength", "maxlength", "rows", "id", "ngModel", "size", "fill", "labelPlacement", "labelDir", "leadingIcon", "trailingIcon", "clearInput"], outputs: ["ngModelChange"] }, { kind: "component", type: CideIconComponent, selector: "cide-ele-icon", inputs: ["size", "type", "toolTip"] }, { kind: "component", type: CideEleDropdownComponent, selector: "cide-ele-dropdown", inputs: ["items", "config", "triggerTemplate", "menuTemplate"], outputs: ["itemClick", "dropdownToggle"] }, { kind: "component", type: CideLytSharedWrapperComponent, selector: "cide-lyt-shared-wrapper", inputs: ["shared_wrapper_setup_param", "breadcrumb_data"] }] });
|
|
5080
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreDesignationListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5081
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: CideCoreDesignationListComponent, isStandalone: true, selector: "cide-core-designation-list", viewQueries: [{ propertyName: "designationDetailsRendererTemplate", first: true, predicate: ["designationDetailsRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "designationStatusRendererTemplate", first: true, predicate: ["designationStatusRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "actionsDropdownRendererTemplate", first: true, predicate: ["actionsDropdownRendererTemplate"], descendants: true, isSignal: true }], ngImport: i0, template: "<!-- Designation List with Shared Wrapper -->\n<cide-lyt-shared-wrapper [shared_wrapper_setup_param]=\"{ sypg_page_code: 'core_designation_list' }\">\n <div class=\"tw-table tw-w-full tw-h-full\">\n\n <!-- Quick Add Form Section -->\n <div class=\"tw-table-row tw-h-0\">\n <div class=\"tw-table-cell tw-px-6 tw-py-4 tw-border-b tw-border-gray-200 tw-bg-white\">\n <div class=\"tw-flex tw-items-center tw-justify-between tw-mb-0\">\n <div class=\"tw-flex tw-items-center tw-space-x-3 tw-mb-3\">\n <cide-ele-icon class=\"tw-text-blue-600 tw-w-5 tw-h-5\">{{ isEditMode() ? 'edit' : 'add' }}</cide-ele-icon>\n <h6 class=\"tw-text-sm tw-font-medium tw-text-gray-900 tw-m-0\">{{ isEditMode() ? 'Edit Designation' : 'Quick Add Designation' }}</h6>\n </div>\n @if (selectedParentDesignation()) {\n <div\n class=\"tw-flex tw-items-center tw-space-x-3 tw-bg-blue-50 tw-border tw-border-blue-200 tw-px-4 tw-py-1 tw-rounded-lg\">\n <cide-ele-icon class=\"tw-text-blue-600 tw-w-4 tw-h-4\">account_tree</cide-ele-icon>\n <div class=\"tw-flex tw-items-center tw-space-x-2\">\n <span class=\"tw-text-sm tw-text-blue-600 tw-font-medium\">{{ isEditMode() ? 'Parent:' : 'Creating child under:' }}</span>\n <span class=\"tw-text-sm tw-text-blue-800 tw-font-semibold\">{{ selectedParentDesignation()?.sydsg_name\n }}</span>\n </div>\n <button cideEleButton variant=\"ghost\" size=\"xs\" type=\"button\" (click)=\"clearSelectedParent()\"\n class=\"tw-text-blue-400 hover:tw-text-blue-600\">\n <svg class=\"tw-w-4 tw-h-4\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M6 18L18 6M6 6l12 12\" />\n </svg>\n </button>\n </div>\n }\n @if (selectedParentDepartment()) {\n <div\n class=\"tw-flex tw-items-center tw-space-x-3 tw-bg-green-50 tw-border tw-border-green-200 tw-px-4 tw-py-1 tw-rounded-lg\">\n <cide-ele-icon class=\"tw-text-green-600 tw-w-4 tw-h-4\">business</cide-ele-icon>\n <div class=\"tw-flex tw-items-center tw-space-x-2\">\n <span class=\"tw-text-sm tw-text-green-600 tw-font-medium\">{{ isEditMode() ? 'Department:' : 'Department:'\n }}</span>\n <span class=\"tw-text-sm tw-text-green-800 tw-font-semibold\">{{ selectedParentDepartment()?.sydept_name\n }}</span>\n </div>\n <button cideEleButton variant=\"ghost\" size=\"xs\" type=\"button\" (click)=\"clearSelectedParentDepartment()\"\n class=\"tw-text-green-400 hover:tw-text-green-600\">\n <svg class=\"tw-w-4 tw-h-4\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M6 18L18 6M6 6l12 12\" />\n </svg>\n </button>\n </div>\n }\n </div>\n\n <form [formGroup]=\"quickAddForm\" (ngSubmit)=\"quickAddDesignation()\">\n <!-- First Row -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-5 tw-gap-3 tw-mb-3\">\n <!-- Designation Name -->\n <div>\n <cide-ele-input id=\"sydsg_name\" label=\"Name\" formControlName=\"sydsg_name\" placeholder=\"Designation name\"\n size=\"sm\">\n </cide-ele-input>\n </div>\n\n <!-- Designation Code -->\n <div>\n <cide-ele-input id=\"sydsg_code\" label=\"Code\" formControlName=\"sydsg_code\" placeholder=\"DESG001\"\n size=\"sm\">\n </cide-ele-input>\n </div>\n <!-- Grade Level -->\n <div>\n <cide-ele-select id=\"sydsg_grade_level_id_sydsgl\" label=\"Grade Level\" [options]=\"gradeLevelOptions()\"\n formControlName=\"sydsg_grade_level_id_sydsgl\" placeholder=\"Select grade level\" size=\"sm\">\n </cide-ele-select>\n </div>\n\n <!-- Department -->\n <div>\n <cide-ele-select id=\"sydsg_department_id_sydpt\" label=\"Department\" [options]=\"departmentOptions()\"\n formControlName=\"sydsg_department_id_sydpt\" placeholder=\"Select department\" size=\"sm\">\n </cide-ele-select>\n </div>\n\n <!-- Active Status -->\n <div class=\"tw-flex tw-flex-col tw-justify-end\">\n <cide-ele-input id=\"sydsg_isactive\" type=\"checkbox\" label=\"Active\" formControlName=\"sydsg_isactive\"\n size=\"sm\">\n </cide-ele-input>\n </div>\n </div>\n\n <!-- Second Row -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-4 tw-gap-3 tw-items-end\">\n <!-- Description -->\n <div>\n <cide-ele-textarea id=\"sydsg_description\" label=\"Description\" formControlName=\"sydsg_description\"\n placeholder=\"Designation description\" rows=\"2\" size=\"sm\">\n </cide-ele-textarea>\n </div>\n\n <!-- Entity ID (Hidden) -->\n <div class=\"tw-hidden\">\n <cide-ele-input id=\"desg_entity_id_syen\" label=\"Entity ID\" formControlName=\"desg_entity_id_syen\"\n placeholder=\"Entity ID\" size=\"sm\">\n </cide-ele-input>\n </div>\n\n <!-- Action Buttons -->\n <div class=\"tw-flex tw-flex-col tw-justify-end\">\n <div class=\"tw-flex tw-space-x-2\">\n <button cideEleButton variant=\"primary\" size=\"sm\" type=\"submit\" [disabled]=\"quickAddForm.invalid\"\n class=\"tw-px-2 tw-py-1 tw-w-20\">\n <cide-ele-icon size=\"xs\" class=\"tw-w-4 tw-h-4 tw-mr-1\">{{ isEditMode() ? 'edit' : 'add'\n }}</cide-ele-icon>\n {{ isEditMode() ? 'Update' : 'Add' }}\n </button>\n <button cideEleButton variant=\"outline\" size=\"sm\" type=\"button\" (click)=\"resetQuickAddForm()\"\n class=\"tw-px-2 tw-py-1 tw-w-16\">\n <cide-ele-icon size=\"xs\" class=\"tw-w-4 tw-h-4 tw-mr-1\">refresh</cide-ele-icon>\n Reset\n </button>\n </div>\n </div>\n </div>\n </form>\n </div>\n </div>\n\n\n\n <!-- Header Section with Filters -->\n <div class=\"tw-table-row tw-h-0\">\n <div class=\"tw-table-cell tw-px-6 tw-py-3 tw-border-b tw-border-gray-200 tw-bg-gray-50\">\n <div\n class=\"tw-flex tw-flex-col sm:tw-flex-row tw-justify-between tw-items-start sm:tw-items-center tw-space-y-3 sm:tw-space-y-0\">\n\n <!-- Actions -->\n <div\n class=\"tw-flex tw-flex-col sm:tw-flex-row tw-items-start sm:tw-items-center tw-space-y-3 sm:tw-space-y-0 sm:tw-space-x-3\">\n <!-- Search functionality is handled by the data grid -->\n </div>\n </div>\n\n <!-- Error Message -->\n @if (error()) {\n <div class=\"tw-mt-4 tw-p-4 tw-bg-red-50 tw-border tw-border-red-200 tw-rounded-md\">\n <div class=\"tw-flex tw-items-start\">\n <cide-ele-icon name=\"error\"\n class=\"tw-text-red-400 tw-w-5 tw-h-5 tw-mt-0.5 tw-flex-shrink-0\"></cide-ele-icon>\n <div class=\"tw-ml-3\">\n <h3 class=\"tw-text-sm tw-font-medium tw-text-red-800 tw-m-0\">Error</h3>\n <p class=\"tw-text-sm tw-text-red-700 tw-mt-1 tw-m-0\">{{ error() }}</p>\n </div>\n </div>\n </div>\n }\n </div>\n </div>\n\n <!-- Main Content Area -->\n <div class=\"tw-table-row\">\n <div class=\"tw-table-cell tw-h-full tw-relative\">\n\n <!-- Data Grid Component -->\n <div class=\"tw-h-full tw-overflow-auto\">\n\n <cide-ele-data-grid [config]=\"gridConfig()\" [templateRenderers]=\"getTemplateRenderers()\"\n [actionHandlers]=\"actionHandlers\" [serverSidePagination]=\"true\" [totalServerItems]=\"totalItems()\"\n [currentServerPage]=\"currentPage()\" [currentServerPageSize]=\"pageSize()\" (gridEvent)=\"onGridEvent($event)\">\n </cide-ele-data-grid>\n </div>\n\n </div>\n </div>\n\n </div>\n\n <!-- Designation Details Renderer Template -->\n <ng-template #designationDetailsRendererTemplate let-row=\"row\" let-value=\"value\">\n <div class=\"tw-flex tw-items-center tw-min-w-0\">\n <!-- Dynamic Icon based on type -->\n <div class=\"tw-flex-shrink-0\">\n <cide-ele-icon [class]=\"row.type === 'department' ? 'tw-text-green-500' : 'tw-text-blue-500'\" size=\"xs\">\n {{ row.type === 'department' ? 'business' : 'work' }}\n </cide-ele-icon>\n </div>\n\n <!-- Details -->\n <div class=\"tw-ml-3 tw-min-w-0 tw-flex-1\">\n <div class=\"tw-flex tw-items-center tw-space-x-2\">\n <div class=\"tw-text-sm tw-font-medium tw-text-gray-900 tw-truncate\" [title]=\"row.name\">\n {{ row.name || 'Untitled' }}\n </div>\n @if (row.type === 'department') {\n <span\n class=\"tw-inline-flex tw-items-center tw-px-2 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium tw-bg-green-100 tw-text-green-800\">\n Department\n </span>\n }\n </div>\n @if (row.description) {\n <div class=\"tw-text-xs tw-text-gray-500 tw-truncate\" [title]=\"row.description\">\n {{ row.description }}\n </div>\n }\n </div>\n </div>\n </ng-template>\n\n <!-- Designation Status Renderer Template -->\n <ng-template #designationStatusRendererTemplate let-row=\"row\" let-value=\"value\">\n <span\n class=\"tw-inline-flex tw-items-center tw-px-2.5 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium tw-whitespace-nowrap\"\n [ngClass]=\"getStatusClass(row.status)\">\n {{ getStatusDisplay(row.status) }}\n </span>\n </ng-template>\n\n <!-- Actions Dropdown Renderer Template -->\n <ng-template #actionsDropdownRendererTemplate let-row=\"row\" let-value=\"value\">\n <cide-ele-dropdown [items]=\"getDropdownItems(row)\" [config]=\"{ triggerIcon: 'more_vert', triggerSize: 'sm' }\"\n (itemClick)=\"onDropdownItemClick($event, row)\">\n </cide-ele-dropdown>\n </ng-template>\n</cide-lyt-shared-wrapper>", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "component", type: CideEleDataGridComponent, selector: "cide-ele-data-grid", inputs: ["config", "templateRenderers", "customFormatters", "actionHandlers", "serverSidePagination", "totalServerItems", "currentServerPage", "currentServerPageSize", "dragDropEnabled"], outputs: ["gridEvent"] }, { kind: "component", type: CideEleButtonComponent, selector: "button[cideEleButton], a[cideEleButton], cide-ele-button", inputs: ["label", "variant", "size", "type", "shape", "elevation", "disabled", "id", "loading", "fullWidth", "leftIcon", "rightIcon", "customClass", "tooltip", "ariaLabel", "testId", "routerLink", "routerExtras", "preventDoubleClick", "animated"], outputs: ["btnClick", "doubleClick"] }, { kind: "component", type: CideInputComponent, selector: "cide-ele-input", inputs: ["fill", "label", "labelHide", "disabled", "clearInput", "labelPlacement", "labelDir", "placeholder", "leadingIcon", "trailingIcon", "helperText", "helperTextCollapse", "hideHelperAndErrorText", "errorText", "maxlength", "minlength", "required", "autocapitalize", "autocomplete", "type", "width", "id", "ngModel", "option", "min", "max", "step", "size"], outputs: ["ngModelChange"] }, { kind: "component", type: CideSelectComponent, selector: "cide-ele-select", inputs: ["label", "labelHide", "placeholder", "helperText", "errorText", "required", "disabled", "id", "ngModel", "size", "fill", "labelPlacement", "labelDir", "leadingIcon", "trailingIcon", "clearInput", "options", "multiple", "searchable", "showSearchInput", "loading", "valueKey", "labelKey", "treeView"], outputs: ["ngModelChange", "change", "searchChange"] }, { kind: "component", type: CideTextareaComponent, selector: "cide-ele-textarea", inputs: ["label", "labelHide", "placeholder", "helperText", "errorText", "required", "disabled", "minlength", "maxlength", "rows", "id", "ngModel", "size", "fill", "labelPlacement", "labelDir", "leadingIcon", "trailingIcon", "clearInput"], outputs: ["ngModelChange"] }, { kind: "component", type: CideIconComponent, selector: "cide-ele-icon", inputs: ["size", "type", "toolTip"] }, { kind: "component", type: CideEleDropdownComponent, selector: "cide-ele-dropdown", inputs: ["items", "config", "triggerTemplate", "menuTemplate"], outputs: ["itemClick", "dropdownToggle"] }, { kind: "component", type: CideLytSharedWrapperComponent, selector: "cide-lyt-shared-wrapper", inputs: ["shared_wrapper_setup_param", "breadcrumb_data"] }] });
|
|
5082
5082
|
}
|
|
5083
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
5083
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreDesignationListComponent, decorators: [{
|
|
5084
5084
|
type: Component,
|
|
5085
5085
|
args: [{ selector: 'cide-core-designation-list', standalone: true, imports: [
|
|
5086
5086
|
CommonModule,
|
|
@@ -5095,7 +5095,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImpor
|
|
|
5095
5095
|
CideEleDropdownComponent,
|
|
5096
5096
|
CideLytSharedWrapperComponent
|
|
5097
5097
|
], template: "<!-- Designation List with Shared Wrapper -->\n<cide-lyt-shared-wrapper [shared_wrapper_setup_param]=\"{ sypg_page_code: 'core_designation_list' }\">\n <div class=\"tw-table tw-w-full tw-h-full\">\n\n <!-- Quick Add Form Section -->\n <div class=\"tw-table-row tw-h-0\">\n <div class=\"tw-table-cell tw-px-6 tw-py-4 tw-border-b tw-border-gray-200 tw-bg-white\">\n <div class=\"tw-flex tw-items-center tw-justify-between tw-mb-0\">\n <div class=\"tw-flex tw-items-center tw-space-x-3 tw-mb-3\">\n <cide-ele-icon class=\"tw-text-blue-600 tw-w-5 tw-h-5\">{{ isEditMode() ? 'edit' : 'add' }}</cide-ele-icon>\n <h6 class=\"tw-text-sm tw-font-medium tw-text-gray-900 tw-m-0\">{{ isEditMode() ? 'Edit Designation' : 'Quick Add Designation' }}</h6>\n </div>\n @if (selectedParentDesignation()) {\n <div\n class=\"tw-flex tw-items-center tw-space-x-3 tw-bg-blue-50 tw-border tw-border-blue-200 tw-px-4 tw-py-1 tw-rounded-lg\">\n <cide-ele-icon class=\"tw-text-blue-600 tw-w-4 tw-h-4\">account_tree</cide-ele-icon>\n <div class=\"tw-flex tw-items-center tw-space-x-2\">\n <span class=\"tw-text-sm tw-text-blue-600 tw-font-medium\">{{ isEditMode() ? 'Parent:' : 'Creating child under:' }}</span>\n <span class=\"tw-text-sm tw-text-blue-800 tw-font-semibold\">{{ selectedParentDesignation()?.sydsg_name\n }}</span>\n </div>\n <button cideEleButton variant=\"ghost\" size=\"xs\" type=\"button\" (click)=\"clearSelectedParent()\"\n class=\"tw-text-blue-400 hover:tw-text-blue-600\">\n <svg class=\"tw-w-4 tw-h-4\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M6 18L18 6M6 6l12 12\" />\n </svg>\n </button>\n </div>\n }\n @if (selectedParentDepartment()) {\n <div\n class=\"tw-flex tw-items-center tw-space-x-3 tw-bg-green-50 tw-border tw-border-green-200 tw-px-4 tw-py-1 tw-rounded-lg\">\n <cide-ele-icon class=\"tw-text-green-600 tw-w-4 tw-h-4\">business</cide-ele-icon>\n <div class=\"tw-flex tw-items-center tw-space-x-2\">\n <span class=\"tw-text-sm tw-text-green-600 tw-font-medium\">{{ isEditMode() ? 'Department:' : 'Department:'\n }}</span>\n <span class=\"tw-text-sm tw-text-green-800 tw-font-semibold\">{{ selectedParentDepartment()?.sydept_name\n }}</span>\n </div>\n <button cideEleButton variant=\"ghost\" size=\"xs\" type=\"button\" (click)=\"clearSelectedParentDepartment()\"\n class=\"tw-text-green-400 hover:tw-text-green-600\">\n <svg class=\"tw-w-4 tw-h-4\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M6 18L18 6M6 6l12 12\" />\n </svg>\n </button>\n </div>\n }\n </div>\n\n <form [formGroup]=\"quickAddForm\" (ngSubmit)=\"quickAddDesignation()\">\n <!-- First Row -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-5 tw-gap-3 tw-mb-3\">\n <!-- Designation Name -->\n <div>\n <cide-ele-input id=\"sydsg_name\" label=\"Name\" formControlName=\"sydsg_name\" placeholder=\"Designation name\"\n size=\"sm\">\n </cide-ele-input>\n </div>\n\n <!-- Designation Code -->\n <div>\n <cide-ele-input id=\"sydsg_code\" label=\"Code\" formControlName=\"sydsg_code\" placeholder=\"DESG001\"\n size=\"sm\">\n </cide-ele-input>\n </div>\n <!-- Grade Level -->\n <div>\n <cide-ele-select id=\"sydsg_grade_level_id_sydsgl\" label=\"Grade Level\" [options]=\"gradeLevelOptions()\"\n formControlName=\"sydsg_grade_level_id_sydsgl\" placeholder=\"Select grade level\" size=\"sm\">\n </cide-ele-select>\n </div>\n\n <!-- Department -->\n <div>\n <cide-ele-select id=\"sydsg_department_id_sydpt\" label=\"Department\" [options]=\"departmentOptions()\"\n formControlName=\"sydsg_department_id_sydpt\" placeholder=\"Select department\" size=\"sm\">\n </cide-ele-select>\n </div>\n\n <!-- Active Status -->\n <div class=\"tw-flex tw-flex-col tw-justify-end\">\n <cide-ele-input id=\"sydsg_isactive\" type=\"checkbox\" label=\"Active\" formControlName=\"sydsg_isactive\"\n size=\"sm\">\n </cide-ele-input>\n </div>\n </div>\n\n <!-- Second Row -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-4 tw-gap-3 tw-items-end\">\n <!-- Description -->\n <div>\n <cide-ele-textarea id=\"sydsg_description\" label=\"Description\" formControlName=\"sydsg_description\"\n placeholder=\"Designation description\" rows=\"2\" size=\"sm\">\n </cide-ele-textarea>\n </div>\n\n <!-- Entity ID (Hidden) -->\n <div class=\"tw-hidden\">\n <cide-ele-input id=\"desg_entity_id_syen\" label=\"Entity ID\" formControlName=\"desg_entity_id_syen\"\n placeholder=\"Entity ID\" size=\"sm\">\n </cide-ele-input>\n </div>\n\n <!-- Action Buttons -->\n <div class=\"tw-flex tw-flex-col tw-justify-end\">\n <div class=\"tw-flex tw-space-x-2\">\n <button cideEleButton variant=\"primary\" size=\"sm\" type=\"submit\" [disabled]=\"quickAddForm.invalid\"\n class=\"tw-px-2 tw-py-1 tw-w-20\">\n <cide-ele-icon size=\"xs\" class=\"tw-w-4 tw-h-4 tw-mr-1\">{{ isEditMode() ? 'edit' : 'add'\n }}</cide-ele-icon>\n {{ isEditMode() ? 'Update' : 'Add' }}\n </button>\n <button cideEleButton variant=\"outline\" size=\"sm\" type=\"button\" (click)=\"resetQuickAddForm()\"\n class=\"tw-px-2 tw-py-1 tw-w-16\">\n <cide-ele-icon size=\"xs\" class=\"tw-w-4 tw-h-4 tw-mr-1\">refresh</cide-ele-icon>\n Reset\n </button>\n </div>\n </div>\n </div>\n </form>\n </div>\n </div>\n\n\n\n <!-- Header Section with Filters -->\n <div class=\"tw-table-row tw-h-0\">\n <div class=\"tw-table-cell tw-px-6 tw-py-3 tw-border-b tw-border-gray-200 tw-bg-gray-50\">\n <div\n class=\"tw-flex tw-flex-col sm:tw-flex-row tw-justify-between tw-items-start sm:tw-items-center tw-space-y-3 sm:tw-space-y-0\">\n\n <!-- Actions -->\n <div\n class=\"tw-flex tw-flex-col sm:tw-flex-row tw-items-start sm:tw-items-center tw-space-y-3 sm:tw-space-y-0 sm:tw-space-x-3\">\n <!-- Search functionality is handled by the data grid -->\n </div>\n </div>\n\n <!-- Error Message -->\n @if (error()) {\n <div class=\"tw-mt-4 tw-p-4 tw-bg-red-50 tw-border tw-border-red-200 tw-rounded-md\">\n <div class=\"tw-flex tw-items-start\">\n <cide-ele-icon name=\"error\"\n class=\"tw-text-red-400 tw-w-5 tw-h-5 tw-mt-0.5 tw-flex-shrink-0\"></cide-ele-icon>\n <div class=\"tw-ml-3\">\n <h3 class=\"tw-text-sm tw-font-medium tw-text-red-800 tw-m-0\">Error</h3>\n <p class=\"tw-text-sm tw-text-red-700 tw-mt-1 tw-m-0\">{{ error() }}</p>\n </div>\n </div>\n </div>\n }\n </div>\n </div>\n\n <!-- Main Content Area -->\n <div class=\"tw-table-row\">\n <div class=\"tw-table-cell tw-h-full tw-relative\">\n\n <!-- Data Grid Component -->\n <div class=\"tw-h-full tw-overflow-auto\">\n\n <cide-ele-data-grid [config]=\"gridConfig()\" [templateRenderers]=\"getTemplateRenderers()\"\n [actionHandlers]=\"actionHandlers\" [serverSidePagination]=\"true\" [totalServerItems]=\"totalItems()\"\n [currentServerPage]=\"currentPage()\" [currentServerPageSize]=\"pageSize()\" (gridEvent)=\"onGridEvent($event)\">\n </cide-ele-data-grid>\n </div>\n\n </div>\n </div>\n\n </div>\n\n <!-- Designation Details Renderer Template -->\n <ng-template #designationDetailsRendererTemplate let-row=\"row\" let-value=\"value\">\n <div class=\"tw-flex tw-items-center tw-min-w-0\">\n <!-- Dynamic Icon based on type -->\n <div class=\"tw-flex-shrink-0\">\n <cide-ele-icon [class]=\"row.type === 'department' ? 'tw-text-green-500' : 'tw-text-blue-500'\" size=\"xs\">\n {{ row.type === 'department' ? 'business' : 'work' }}\n </cide-ele-icon>\n </div>\n\n <!-- Details -->\n <div class=\"tw-ml-3 tw-min-w-0 tw-flex-1\">\n <div class=\"tw-flex tw-items-center tw-space-x-2\">\n <div class=\"tw-text-sm tw-font-medium tw-text-gray-900 tw-truncate\" [title]=\"row.name\">\n {{ row.name || 'Untitled' }}\n </div>\n @if (row.type === 'department') {\n <span\n class=\"tw-inline-flex tw-items-center tw-px-2 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium tw-bg-green-100 tw-text-green-800\">\n Department\n </span>\n }\n </div>\n @if (row.description) {\n <div class=\"tw-text-xs tw-text-gray-500 tw-truncate\" [title]=\"row.description\">\n {{ row.description }}\n </div>\n }\n </div>\n </div>\n </ng-template>\n\n <!-- Designation Status Renderer Template -->\n <ng-template #designationStatusRendererTemplate let-row=\"row\" let-value=\"value\">\n <span\n class=\"tw-inline-flex tw-items-center tw-px-2.5 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium tw-whitespace-nowrap\"\n [ngClass]=\"getStatusClass(row.status)\">\n {{ getStatusDisplay(row.status) }}\n </span>\n </ng-template>\n\n <!-- Actions Dropdown Renderer Template -->\n <ng-template #actionsDropdownRendererTemplate let-row=\"row\" let-value=\"value\">\n <cide-ele-dropdown [items]=\"getDropdownItems(row)\" [config]=\"{ triggerIcon: 'more_vert', triggerSize: 'sm' }\"\n (itemClick)=\"onDropdownItemClick($event, row)\">\n </cide-ele-dropdown>\n </ng-template>\n</cide-lyt-shared-wrapper>" }]
|
|
5098
|
-
}], ctorParameters: () => [] });
|
|
5098
|
+
}], ctorParameters: () => [], propDecorators: { designationDetailsRendererTemplate: [{ type: i0.ViewChild, args: ['designationDetailsRendererTemplate', { isSignal: true }] }], designationStatusRendererTemplate: [{ type: i0.ViewChild, args: ['designationStatusRendererTemplate', { isSignal: true }] }], actionsDropdownRendererTemplate: [{ type: i0.ViewChild, args: ['actionsDropdownRendererTemplate', { isSignal: true }] }] } });
|
|
5099
5099
|
|
|
5100
5100
|
var designationList_component = /*#__PURE__*/Object.freeze({
|
|
5101
5101
|
__proto__: null,
|
|
@@ -5944,10 +5944,10 @@ class CideCoreGradeLevelListComponent {
|
|
|
5944
5944
|
trackByItemId(index, item) {
|
|
5945
5945
|
return item._id || '';
|
|
5946
5946
|
}
|
|
5947
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
5948
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.7", type: CideCoreGradeLevelListComponent, isStandalone: true, selector: "cide-core-grade-level-list", viewQueries: [{ propertyName: "dragHandleRendererTemplate", first: true, predicate: ["dragHandleRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "gradeLevelDetailsRendererTemplate", first: true, predicate: ["gradeLevelDetailsRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "gradeLevelStatusRendererTemplate", first: true, predicate: ["gradeLevelStatusRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "actionsDropdownRendererTemplate", first: true, predicate: ["actionsDropdownRendererTemplate"], descendants: true, isSignal: true }], ngImport: i0, template: "<!-- Grade Level List with Shared Wrapper -->\n<cide-lyt-shared-wrapper [shared_wrapper_setup_param]=\"{ sypg_page_code: 'core_grade_level_list' }\">\n<div class=\"tw-table tw-w-full tw-h-full\">\n\n <!-- Quick Add Form Section -->\n <div class=\"tw-table-row tw-h-0\">\n <div class=\"tw-table-cell tw-px-6 tw-py-4 tw-border-b tw-border-gray-200 tw-bg-white\">\n <div class=\"tw-flex tw-items-center tw-justify-between tw-mb-3\">\n <div class=\"tw-flex tw-items-center tw-space-x-3\">\n <cide-ele-icon class=\"tw-text-blue-600 tw-w-5 tw-h-5\">{{ isEditMode() ? 'edit' : 'add' }}</cide-ele-icon>\n <h6 class=\"tw-text-sm tw-font-medium tw-text-gray-900 tw-m-0\">{{ isEditMode() ? 'Edit Grade Level' : 'Quick Add Grade Level' }}</h6>\n </div>\n </div>\n \n <form [formGroup]=\"quickAddForm\" (ngSubmit)=\"quickAddGradeLevel()\">\n <!-- First Row -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-4 tw-gap-3 tw-mb-3\">\n <!-- Grade Level Name -->\n <div>\n <cide-ele-input \n id=\"sydsgl_name\" \n label=\"Name\" \n formControlName=\"sydsgl_name\"\n placeholder=\"Grade level name\"\n size=\"sm\">\n </cide-ele-input>\n </div>\n \n <!-- Active Status -->\n <div class=\"tw-flex tw-flex-col tw-justify-end\">\n <cide-ele-input \n id=\"sydsgl_isactive\"\n type=\"checkbox\"\n label=\"Active\"\n formControlName=\"sydsgl_isactive\"\n size=\"sm\">\n </cide-ele-input>\n </div>\n </div>\n \n <!-- Second Row -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-4 tw-gap-3 tw-items-end\">\n <!-- Description -->\n <div>\n <cide-ele-textarea \n id=\"sydsgl_description\" \n label=\"Description\" \n formControlName=\"sydsgl_description\"\n placeholder=\"Grade level description\"\n rows=\"2\"\n size=\"sm\">\n </cide-ele-textarea>\n </div>\n \n <!-- Entity ID (Hidden) -->\n <div class=\"tw-hidden\">\n <cide-ele-input \n id=\"sydsgl_entity_id_syen\" \n label=\"Entity ID\" \n formControlName=\"sydsgl_entity_id_syen\"\n placeholder=\"Entity ID\"\n size=\"sm\">\n </cide-ele-input>\n </div>\n \n <!-- Action Buttons -->\n <div class=\"tw-flex tw-flex-col tw-justify-end\">\n <div class=\"tw-flex tw-space-x-2\">\n <button \n cideEleButton \n variant=\"primary\" \n size=\"sm\" \n type=\"submit\"\n [disabled]=\"quickAddForm.invalid\"\n class=\"tw-px-2 tw-py-1 tw-w-20\">\n <cide-ele-icon size=\"xs\" class=\"tw-w-4 tw-h-4 tw-mr-1\">{{ isEditMode() ? 'edit' : 'add' }}</cide-ele-icon>\n {{ isEditMode() ? 'Update' : 'Add' }}\n </button>\n <button \n cideEleButton \n variant=\"outline\" \n size=\"sm\" \n type=\"button\"\n (click)=\"resetQuickAddForm()\"\n class=\"tw-px-2 tw-py-1 tw-w-16\">\n <cide-ele-icon size=\"xs\" class=\"tw-w-4 tw-h-4 tw-mr-1\">refresh</cide-ele-icon>\n Reset\n </button>\n </div>\n </div>\n </div>\n </form>\n </div>\n </div>\n\n <!-- Main Content Area -->\n <div class=\"tw-table-row\">\n <div class=\"tw-table-cell tw-h-full tw-relative\">\n \n <!-- Data Grid Component -->\n <div class=\"tw-h-full tw-overflow-auto\">\n \n <cide-ele-data-grid \n [config]=\"gridConfig()\" \n [templateRenderers]=\"getTemplateRenderers()\"\n [actionHandlers]=\"actionHandlers\"\n [serverSidePagination]=\"true\" \n [totalServerItems]=\"totalItems()\" \n [currentServerPage]=\"currentPage()\"\n [currentServerPageSize]=\"pageSize()\" \n [dragDropEnabled]=\"true\"\n (gridEvent)=\"onGridEvent($event)\">\n </cide-ele-data-grid>\n </div>\n\n </div>\n </div>\n\n</div>\n\n<!-- Drag Handle Renderer Template -->\n<ng-template #dragHandleRendererTemplate let-row=\"row\" let-value=\"value\">\n <div class=\"tw-flex tw-items-center tw-justify-center tw-w-full tw-h-full tw-cursor-move drag-handle\">\n <cide-ele-icon \n class=\"tw-text-gray-400 hover:tw-text-gray-600 tw-transition-colors\" \n size=\"xs\">\n drag_indicator\n </cide-ele-icon>\n </div>\n</ng-template>\n\n<!-- Grade Level Details Renderer Template -->\n<ng-template #gradeLevelDetailsRendererTemplate let-row=\"row\" let-value=\"value\">\n <div class=\"tw-flex tw-items-center tw-min-w-0\">\n <!-- Grade Level Icon -->\n <div class=\"tw-flex-shrink-0\">\n <cide-ele-icon \n class=\"tw-text-gray-400\" \n size=\"xs\">\n school\n </cide-ele-icon>\n </div>\n \n <!-- Grade Level Details -->\n <div class=\"tw-ml-3 tw-min-w-0 tw-flex-1\">\n <div class=\"tw-text-sm tw-font-medium tw-text-gray-900 tw-truncate\" \n [title]=\"row.sydsgl_name\">\n {{ row.sydsgl_name || 'Untitled' }}\n </div>\n @if (row.sydsgl_description) {\n <div class=\"tw-text-xs tw-text-gray-500 tw-truncate\" \n [title]=\"row.sydsgl_description\">\n {{ row.sydsgl_description }}\n </div>\n }\n </div>\n </div>\n</ng-template>\n\n<!-- Grade Level Status Renderer Template -->\n<ng-template #gradeLevelStatusRendererTemplate let-row=\"row\" let-value=\"value\">\n <span class=\"tw-inline-flex tw-items-center tw-px-2.5 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium tw-whitespace-nowrap\"\n [ngClass]=\"getStatusClass(row.sydsgl_isactive)\">\n {{ getStatusDisplay(row.sydsgl_isactive) }}\n </span>\n</ng-template>\n\n<!-- Actions Dropdown Renderer Template -->\n<ng-template #actionsDropdownRendererTemplate let-row=\"row\" let-value=\"value\">\n <cide-ele-dropdown \n [items]=\"getDropdownItems(row)\"\n [config]=\"{ triggerIcon: 'more_vert', triggerSize: 'sm' }\"\n (itemClick)=\"onDropdownItemClick($event, row)\">\n </cide-ele-dropdown>\n</ng-template>\n\n<!-- Confirmation Modal -->\n</cide-lyt-shared-wrapper>\n<cide-ele-confirmation-modal></cide-ele-confirmation-modal> ", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "component", type: CideEleDataGridComponent, selector: "cide-ele-data-grid", inputs: ["config", "templateRenderers", "customFormatters", "actionHandlers", "serverSidePagination", "totalServerItems", "currentServerPage", "currentServerPageSize", "dragDropEnabled"], outputs: ["gridEvent"] }, { kind: "component", type: CideEleButtonComponent, selector: "button[cideEleButton], a[cideEleButton], cide-ele-button", inputs: ["label", "variant", "size", "type", "shape", "elevation", "disabled", "id", "loading", "fullWidth", "leftIcon", "rightIcon", "customClass", "tooltip", "ariaLabel", "testId", "routerLink", "routerExtras", "preventDoubleClick", "animated"], outputs: ["btnClick", "doubleClick"] }, { kind: "component", type: CideInputComponent, selector: "cide-ele-input", inputs: ["fill", "label", "labelHide", "disabled", "clearInput", "labelPlacement", "labelDir", "placeholder", "leadingIcon", "trailingIcon", "helperText", "helperTextCollapse", "hideHelperAndErrorText", "errorText", "maxlength", "minlength", "required", "autocapitalize", "autocomplete", "type", "width", "id", "ngModel", "option", "min", "max", "step", "size"], outputs: ["ngModelChange"] }, { kind: "component", type: CideTextareaComponent, selector: "cide-ele-textarea", inputs: ["label", "labelHide", "placeholder", "helperText", "errorText", "required", "disabled", "minlength", "maxlength", "rows", "id", "ngModel", "size", "fill", "labelPlacement", "labelDir", "leadingIcon", "trailingIcon", "clearInput"], outputs: ["ngModelChange"] }, { kind: "component", type: CideIconComponent, selector: "cide-ele-icon", inputs: ["size", "type", "toolTip"] }, { kind: "component", type: CideEleDropdownComponent, selector: "cide-ele-dropdown", inputs: ["items", "config", "triggerTemplate", "menuTemplate"], outputs: ["itemClick", "dropdownToggle"] }, { kind: "component", type: CideLytSharedWrapperComponent, selector: "cide-lyt-shared-wrapper", inputs: ["shared_wrapper_setup_param", "breadcrumb_data"] }, { kind: "component", type: CideEleConfirmationModalComponent, selector: "cide-ele-confirmation-modal" }] });
|
|
5947
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreGradeLevelListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5948
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: CideCoreGradeLevelListComponent, isStandalone: true, selector: "cide-core-grade-level-list", viewQueries: [{ propertyName: "dragHandleRendererTemplate", first: true, predicate: ["dragHandleRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "gradeLevelDetailsRendererTemplate", first: true, predicate: ["gradeLevelDetailsRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "gradeLevelStatusRendererTemplate", first: true, predicate: ["gradeLevelStatusRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "actionsDropdownRendererTemplate", first: true, predicate: ["actionsDropdownRendererTemplate"], descendants: true, isSignal: true }], ngImport: i0, template: "<!-- Grade Level List with Shared Wrapper -->\n<cide-lyt-shared-wrapper [shared_wrapper_setup_param]=\"{ sypg_page_code: 'core_grade_level_list' }\">\n<div class=\"tw-table tw-w-full tw-h-full\">\n\n <!-- Quick Add Form Section -->\n <div class=\"tw-table-row tw-h-0\">\n <div class=\"tw-table-cell tw-px-6 tw-py-4 tw-border-b tw-border-gray-200 tw-bg-white\">\n <div class=\"tw-flex tw-items-center tw-justify-between tw-mb-3\">\n <div class=\"tw-flex tw-items-center tw-space-x-3\">\n <cide-ele-icon class=\"tw-text-blue-600 tw-w-5 tw-h-5\">{{ isEditMode() ? 'edit' : 'add' }}</cide-ele-icon>\n <h6 class=\"tw-text-sm tw-font-medium tw-text-gray-900 tw-m-0\">{{ isEditMode() ? 'Edit Grade Level' : 'Quick Add Grade Level' }}</h6>\n </div>\n </div>\n \n <form [formGroup]=\"quickAddForm\" (ngSubmit)=\"quickAddGradeLevel()\">\n <!-- First Row -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-4 tw-gap-3 tw-mb-3\">\n <!-- Grade Level Name -->\n <div>\n <cide-ele-input \n id=\"sydsgl_name\" \n label=\"Name\" \n formControlName=\"sydsgl_name\"\n placeholder=\"Grade level name\"\n size=\"sm\">\n </cide-ele-input>\n </div>\n \n <!-- Active Status -->\n <div class=\"tw-flex tw-flex-col tw-justify-end\">\n <cide-ele-input \n id=\"sydsgl_isactive\"\n type=\"checkbox\"\n label=\"Active\"\n formControlName=\"sydsgl_isactive\"\n size=\"sm\">\n </cide-ele-input>\n </div>\n </div>\n \n <!-- Second Row -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-4 tw-gap-3 tw-items-end\">\n <!-- Description -->\n <div>\n <cide-ele-textarea \n id=\"sydsgl_description\" \n label=\"Description\" \n formControlName=\"sydsgl_description\"\n placeholder=\"Grade level description\"\n rows=\"2\"\n size=\"sm\">\n </cide-ele-textarea>\n </div>\n \n <!-- Entity ID (Hidden) -->\n <div class=\"tw-hidden\">\n <cide-ele-input \n id=\"sydsgl_entity_id_syen\" \n label=\"Entity ID\" \n formControlName=\"sydsgl_entity_id_syen\"\n placeholder=\"Entity ID\"\n size=\"sm\">\n </cide-ele-input>\n </div>\n \n <!-- Action Buttons -->\n <div class=\"tw-flex tw-flex-col tw-justify-end\">\n <div class=\"tw-flex tw-space-x-2\">\n <button \n cideEleButton \n variant=\"primary\" \n size=\"sm\" \n type=\"submit\"\n [disabled]=\"quickAddForm.invalid\"\n class=\"tw-px-2 tw-py-1 tw-w-20\">\n <cide-ele-icon size=\"xs\" class=\"tw-w-4 tw-h-4 tw-mr-1\">{{ isEditMode() ? 'edit' : 'add' }}</cide-ele-icon>\n {{ isEditMode() ? 'Update' : 'Add' }}\n </button>\n <button \n cideEleButton \n variant=\"outline\" \n size=\"sm\" \n type=\"button\"\n (click)=\"resetQuickAddForm()\"\n class=\"tw-px-2 tw-py-1 tw-w-16\">\n <cide-ele-icon size=\"xs\" class=\"tw-w-4 tw-h-4 tw-mr-1\">refresh</cide-ele-icon>\n Reset\n </button>\n </div>\n </div>\n </div>\n </form>\n </div>\n </div>\n\n <!-- Main Content Area -->\n <div class=\"tw-table-row\">\n <div class=\"tw-table-cell tw-h-full tw-relative\">\n \n <!-- Data Grid Component -->\n <div class=\"tw-h-full tw-overflow-auto\">\n \n <cide-ele-data-grid \n [config]=\"gridConfig()\" \n [templateRenderers]=\"getTemplateRenderers()\"\n [actionHandlers]=\"actionHandlers\"\n [serverSidePagination]=\"true\" \n [totalServerItems]=\"totalItems()\" \n [currentServerPage]=\"currentPage()\"\n [currentServerPageSize]=\"pageSize()\" \n [dragDropEnabled]=\"true\"\n (gridEvent)=\"onGridEvent($event)\">\n </cide-ele-data-grid>\n </div>\n\n </div>\n </div>\n\n</div>\n\n<!-- Drag Handle Renderer Template -->\n<ng-template #dragHandleRendererTemplate let-row=\"row\" let-value=\"value\">\n <div class=\"tw-flex tw-items-center tw-justify-center tw-w-full tw-h-full tw-cursor-move drag-handle\">\n <cide-ele-icon \n class=\"tw-text-gray-400 hover:tw-text-gray-600 tw-transition-colors\" \n size=\"xs\">\n drag_indicator\n </cide-ele-icon>\n </div>\n</ng-template>\n\n<!-- Grade Level Details Renderer Template -->\n<ng-template #gradeLevelDetailsRendererTemplate let-row=\"row\" let-value=\"value\">\n <div class=\"tw-flex tw-items-center tw-min-w-0\">\n <!-- Grade Level Icon -->\n <div class=\"tw-flex-shrink-0\">\n <cide-ele-icon \n class=\"tw-text-gray-400\" \n size=\"xs\">\n school\n </cide-ele-icon>\n </div>\n \n <!-- Grade Level Details -->\n <div class=\"tw-ml-3 tw-min-w-0 tw-flex-1\">\n <div class=\"tw-text-sm tw-font-medium tw-text-gray-900 tw-truncate\" \n [title]=\"row.sydsgl_name\">\n {{ row.sydsgl_name || 'Untitled' }}\n </div>\n @if (row.sydsgl_description) {\n <div class=\"tw-text-xs tw-text-gray-500 tw-truncate\" \n [title]=\"row.sydsgl_description\">\n {{ row.sydsgl_description }}\n </div>\n }\n </div>\n </div>\n</ng-template>\n\n<!-- Grade Level Status Renderer Template -->\n<ng-template #gradeLevelStatusRendererTemplate let-row=\"row\" let-value=\"value\">\n <span class=\"tw-inline-flex tw-items-center tw-px-2.5 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium tw-whitespace-nowrap\"\n [ngClass]=\"getStatusClass(row.sydsgl_isactive)\">\n {{ getStatusDisplay(row.sydsgl_isactive) }}\n </span>\n</ng-template>\n\n<!-- Actions Dropdown Renderer Template -->\n<ng-template #actionsDropdownRendererTemplate let-row=\"row\" let-value=\"value\">\n <cide-ele-dropdown \n [items]=\"getDropdownItems(row)\"\n [config]=\"{ triggerIcon: 'more_vert', triggerSize: 'sm' }\"\n (itemClick)=\"onDropdownItemClick($event, row)\">\n </cide-ele-dropdown>\n</ng-template>\n\n<!-- Confirmation Modal -->\n</cide-lyt-shared-wrapper>\n<cide-ele-confirmation-modal></cide-ele-confirmation-modal> ", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "component", type: CideEleDataGridComponent, selector: "cide-ele-data-grid", inputs: ["config", "templateRenderers", "customFormatters", "actionHandlers", "serverSidePagination", "totalServerItems", "currentServerPage", "currentServerPageSize", "dragDropEnabled"], outputs: ["gridEvent"] }, { kind: "component", type: CideEleButtonComponent, selector: "button[cideEleButton], a[cideEleButton], cide-ele-button", inputs: ["label", "variant", "size", "type", "shape", "elevation", "disabled", "id", "loading", "fullWidth", "leftIcon", "rightIcon", "customClass", "tooltip", "ariaLabel", "testId", "routerLink", "routerExtras", "preventDoubleClick", "animated"], outputs: ["btnClick", "doubleClick"] }, { kind: "component", type: CideInputComponent, selector: "cide-ele-input", inputs: ["fill", "label", "labelHide", "disabled", "clearInput", "labelPlacement", "labelDir", "placeholder", "leadingIcon", "trailingIcon", "helperText", "helperTextCollapse", "hideHelperAndErrorText", "errorText", "maxlength", "minlength", "required", "autocapitalize", "autocomplete", "type", "width", "id", "ngModel", "option", "min", "max", "step", "size"], outputs: ["ngModelChange"] }, { kind: "component", type: CideTextareaComponent, selector: "cide-ele-textarea", inputs: ["label", "labelHide", "placeholder", "helperText", "errorText", "required", "disabled", "minlength", "maxlength", "rows", "id", "ngModel", "size", "fill", "labelPlacement", "labelDir", "leadingIcon", "trailingIcon", "clearInput"], outputs: ["ngModelChange"] }, { kind: "component", type: CideIconComponent, selector: "cide-ele-icon", inputs: ["size", "type", "toolTip"] }, { kind: "component", type: CideEleDropdownComponent, selector: "cide-ele-dropdown", inputs: ["items", "config", "triggerTemplate", "menuTemplate"], outputs: ["itemClick", "dropdownToggle"] }, { kind: "component", type: CideLytSharedWrapperComponent, selector: "cide-lyt-shared-wrapper", inputs: ["shared_wrapper_setup_param", "breadcrumb_data"] }, { kind: "component", type: CideEleConfirmationModalComponent, selector: "cide-ele-confirmation-modal" }] });
|
|
5949
5949
|
}
|
|
5950
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
5950
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreGradeLevelListComponent, decorators: [{
|
|
5951
5951
|
type: Component,
|
|
5952
5952
|
args: [{ selector: 'cide-core-grade-level-list', standalone: true, imports: [
|
|
5953
5953
|
CommonModule,
|
|
@@ -5962,7 +5962,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImpor
|
|
|
5962
5962
|
CideLytSharedWrapperComponent,
|
|
5963
5963
|
CideEleConfirmationModalComponent
|
|
5964
5964
|
], template: "<!-- Grade Level List with Shared Wrapper -->\n<cide-lyt-shared-wrapper [shared_wrapper_setup_param]=\"{ sypg_page_code: 'core_grade_level_list' }\">\n<div class=\"tw-table tw-w-full tw-h-full\">\n\n <!-- Quick Add Form Section -->\n <div class=\"tw-table-row tw-h-0\">\n <div class=\"tw-table-cell tw-px-6 tw-py-4 tw-border-b tw-border-gray-200 tw-bg-white\">\n <div class=\"tw-flex tw-items-center tw-justify-between tw-mb-3\">\n <div class=\"tw-flex tw-items-center tw-space-x-3\">\n <cide-ele-icon class=\"tw-text-blue-600 tw-w-5 tw-h-5\">{{ isEditMode() ? 'edit' : 'add' }}</cide-ele-icon>\n <h6 class=\"tw-text-sm tw-font-medium tw-text-gray-900 tw-m-0\">{{ isEditMode() ? 'Edit Grade Level' : 'Quick Add Grade Level' }}</h6>\n </div>\n </div>\n \n <form [formGroup]=\"quickAddForm\" (ngSubmit)=\"quickAddGradeLevel()\">\n <!-- First Row -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-4 tw-gap-3 tw-mb-3\">\n <!-- Grade Level Name -->\n <div>\n <cide-ele-input \n id=\"sydsgl_name\" \n label=\"Name\" \n formControlName=\"sydsgl_name\"\n placeholder=\"Grade level name\"\n size=\"sm\">\n </cide-ele-input>\n </div>\n \n <!-- Active Status -->\n <div class=\"tw-flex tw-flex-col tw-justify-end\">\n <cide-ele-input \n id=\"sydsgl_isactive\"\n type=\"checkbox\"\n label=\"Active\"\n formControlName=\"sydsgl_isactive\"\n size=\"sm\">\n </cide-ele-input>\n </div>\n </div>\n \n <!-- Second Row -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-4 tw-gap-3 tw-items-end\">\n <!-- Description -->\n <div>\n <cide-ele-textarea \n id=\"sydsgl_description\" \n label=\"Description\" \n formControlName=\"sydsgl_description\"\n placeholder=\"Grade level description\"\n rows=\"2\"\n size=\"sm\">\n </cide-ele-textarea>\n </div>\n \n <!-- Entity ID (Hidden) -->\n <div class=\"tw-hidden\">\n <cide-ele-input \n id=\"sydsgl_entity_id_syen\" \n label=\"Entity ID\" \n formControlName=\"sydsgl_entity_id_syen\"\n placeholder=\"Entity ID\"\n size=\"sm\">\n </cide-ele-input>\n </div>\n \n <!-- Action Buttons -->\n <div class=\"tw-flex tw-flex-col tw-justify-end\">\n <div class=\"tw-flex tw-space-x-2\">\n <button \n cideEleButton \n variant=\"primary\" \n size=\"sm\" \n type=\"submit\"\n [disabled]=\"quickAddForm.invalid\"\n class=\"tw-px-2 tw-py-1 tw-w-20\">\n <cide-ele-icon size=\"xs\" class=\"tw-w-4 tw-h-4 tw-mr-1\">{{ isEditMode() ? 'edit' : 'add' }}</cide-ele-icon>\n {{ isEditMode() ? 'Update' : 'Add' }}\n </button>\n <button \n cideEleButton \n variant=\"outline\" \n size=\"sm\" \n type=\"button\"\n (click)=\"resetQuickAddForm()\"\n class=\"tw-px-2 tw-py-1 tw-w-16\">\n <cide-ele-icon size=\"xs\" class=\"tw-w-4 tw-h-4 tw-mr-1\">refresh</cide-ele-icon>\n Reset\n </button>\n </div>\n </div>\n </div>\n </form>\n </div>\n </div>\n\n <!-- Main Content Area -->\n <div class=\"tw-table-row\">\n <div class=\"tw-table-cell tw-h-full tw-relative\">\n \n <!-- Data Grid Component -->\n <div class=\"tw-h-full tw-overflow-auto\">\n \n <cide-ele-data-grid \n [config]=\"gridConfig()\" \n [templateRenderers]=\"getTemplateRenderers()\"\n [actionHandlers]=\"actionHandlers\"\n [serverSidePagination]=\"true\" \n [totalServerItems]=\"totalItems()\" \n [currentServerPage]=\"currentPage()\"\n [currentServerPageSize]=\"pageSize()\" \n [dragDropEnabled]=\"true\"\n (gridEvent)=\"onGridEvent($event)\">\n </cide-ele-data-grid>\n </div>\n\n </div>\n </div>\n\n</div>\n\n<!-- Drag Handle Renderer Template -->\n<ng-template #dragHandleRendererTemplate let-row=\"row\" let-value=\"value\">\n <div class=\"tw-flex tw-items-center tw-justify-center tw-w-full tw-h-full tw-cursor-move drag-handle\">\n <cide-ele-icon \n class=\"tw-text-gray-400 hover:tw-text-gray-600 tw-transition-colors\" \n size=\"xs\">\n drag_indicator\n </cide-ele-icon>\n </div>\n</ng-template>\n\n<!-- Grade Level Details Renderer Template -->\n<ng-template #gradeLevelDetailsRendererTemplate let-row=\"row\" let-value=\"value\">\n <div class=\"tw-flex tw-items-center tw-min-w-0\">\n <!-- Grade Level Icon -->\n <div class=\"tw-flex-shrink-0\">\n <cide-ele-icon \n class=\"tw-text-gray-400\" \n size=\"xs\">\n school\n </cide-ele-icon>\n </div>\n \n <!-- Grade Level Details -->\n <div class=\"tw-ml-3 tw-min-w-0 tw-flex-1\">\n <div class=\"tw-text-sm tw-font-medium tw-text-gray-900 tw-truncate\" \n [title]=\"row.sydsgl_name\">\n {{ row.sydsgl_name || 'Untitled' }}\n </div>\n @if (row.sydsgl_description) {\n <div class=\"tw-text-xs tw-text-gray-500 tw-truncate\" \n [title]=\"row.sydsgl_description\">\n {{ row.sydsgl_description }}\n </div>\n }\n </div>\n </div>\n</ng-template>\n\n<!-- Grade Level Status Renderer Template -->\n<ng-template #gradeLevelStatusRendererTemplate let-row=\"row\" let-value=\"value\">\n <span class=\"tw-inline-flex tw-items-center tw-px-2.5 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium tw-whitespace-nowrap\"\n [ngClass]=\"getStatusClass(row.sydsgl_isactive)\">\n {{ getStatusDisplay(row.sydsgl_isactive) }}\n </span>\n</ng-template>\n\n<!-- Actions Dropdown Renderer Template -->\n<ng-template #actionsDropdownRendererTemplate let-row=\"row\" let-value=\"value\">\n <cide-ele-dropdown \n [items]=\"getDropdownItems(row)\"\n [config]=\"{ triggerIcon: 'more_vert', triggerSize: 'sm' }\"\n (itemClick)=\"onDropdownItemClick($event, row)\">\n </cide-ele-dropdown>\n</ng-template>\n\n<!-- Confirmation Modal -->\n</cide-lyt-shared-wrapper>\n<cide-ele-confirmation-modal></cide-ele-confirmation-modal> " }]
|
|
5965
|
-
}], ctorParameters: () => [] });
|
|
5965
|
+
}], ctorParameters: () => [], propDecorators: { dragHandleRendererTemplate: [{ type: i0.ViewChild, args: ['dragHandleRendererTemplate', { isSignal: true }] }], gradeLevelDetailsRendererTemplate: [{ type: i0.ViewChild, args: ['gradeLevelDetailsRendererTemplate', { isSignal: true }] }], gradeLevelStatusRendererTemplate: [{ type: i0.ViewChild, args: ['gradeLevelStatusRendererTemplate', { isSignal: true }] }], actionsDropdownRendererTemplate: [{ type: i0.ViewChild, args: ['actionsDropdownRendererTemplate', { isSignal: true }] }] } });
|
|
5966
5966
|
|
|
5967
5967
|
var gradeLevelList_component = /*#__PURE__*/Object.freeze({
|
|
5968
5968
|
__proto__: null,
|
|
@@ -6373,10 +6373,10 @@ class CideCorePageListComponent {
|
|
|
6373
6373
|
const event = new MouseEvent('click', { bubbles: true });
|
|
6374
6374
|
document.dispatchEvent(event);
|
|
6375
6375
|
}
|
|
6376
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
6377
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.
|
|
6376
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCorePageListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
6377
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: CideCorePageListComponent, isStandalone: true, selector: "cide-core-page-list", viewQueries: [{ propertyName: "pageDetailsRendererTemplate", first: true, predicate: ["pageDetailsRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "pageStatusRendererTemplate", first: true, predicate: ["pageStatusRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "actionsDropdownRendererTemplate", first: true, predicate: ["actionsDropdownRendererTemplate"], descendants: true, isSignal: true }], ngImport: i0, template: "<!-- Page List with Shared Wrapper -->\n<cide-lyt-shared-wrapper [shared_wrapper_setup_param]=\"{ sypg_page_code: 'core_page_list' }\">\n<div class=\"tw-table tw-w-full tw-h-full\">\n\n <!-- Header Section with Filters -->\n <div class=\"tw-table-row tw-h-0\">\n <div class=\"tw-table-cell tw-px-6 tw-py-3 tw-border-b tw-border-gray-200 tw-bg-gray-50\">\n <div class=\"tw-flex tw-flex-col sm:tw-flex-row tw-justify-between tw-items-start sm:tw-items-center tw-space-y-3 sm:tw-space-y-0\">\n\n <!-- Title -->\n <div class=\"tw-flex tw-items-center tw-space-x-2\">\n <cide-ele-icon class=\"tw-text-blue-600 tw-w-5 tw-h-5\">web</cide-ele-icon>\n <h5 class=\"tw-text-base tw-font-medium tw-text-gray-900 tw-m-0\">Page Management</h5>\n </div>\n\n <!-- Actions -->\n <div class=\"tw-flex tw-flex-col sm:tw-flex-row tw-items-start sm:tw-items-center tw-space-y-3 sm:tw-space-y-0 sm:tw-space-x-3\">\n <!-- Add Page Button -->\n @if (canCreate()) {\n <button\n cideEleButton\n variant=\"primary\"\n size=\"sm\"\n (click)=\"createPage()\"\n leftIcon=\"add\"\n class=\"tw-whitespace-nowrap tw-flex tw-items-center tw-gap-2\">\n Create New Page\n </button>\n }\n </div>\n </div>\n\n <!-- Error Message -->\n @if (error()) {\n <div class=\"tw-mt-4 tw-p-4 tw-bg-red-50 tw-border tw-border-red-200 tw-rounded-md\">\n <div class=\"tw-flex tw-items-start\">\n <cide-ele-icon class=\"tw-text-red-400 tw-w-5 tw-h-5 tw-mt-0.5 tw-flex-shrink-0\">error</cide-ele-icon>\n <div class=\"tw-ml-3\">\n <h3 class=\"tw-text-sm tw-font-medium tw-text-red-800 tw-m-0\">Error</h3>\n <p class=\"tw-text-sm tw-text-red-700 tw-mt-1 tw-m-0\">{{ error() }}</p>\n </div>\n </div>\n </div>\n }\n </div>\n </div>\n\n <!-- Main Content Area -->\n <div class=\"tw-table-row\">\n <div class=\"tw-table-cell tw-h-full tw-relative\">\n \n <!-- Data Grid Component -->\n <div class=\"tw-h-full tw-overflow-auto\">\n <cide-ele-data-grid\n [config]=\"gridConfig()\"\n [templateRenderers]=\"getTemplateRenderers()\"\n [actionHandlers]=\"actionHandlers\"\n [serverSidePagination]=\"true\"\n [totalServerItems]=\"totalItems()\"\n [currentServerPage]=\"currentPage()\"\n [currentServerPageSize]=\"pageSize()\"\n (gridEvent)=\"onGridEvent($event)\">\n </cide-ele-data-grid>\n </div>\n\n </div>\n </div>\n\n</div>\n\n<!-- Page Details Renderer Template -->\n<ng-template #pageDetailsRendererTemplate let-row=\"row\" let-value=\"value\">\n <div class=\"tw-flex tw-items-center tw-min-w-0\">\n <!-- Page Icon -->\n <div class=\"tw-flex-shrink-0\">\n <cide-ele-icon class=\"tw-text-gray-400 tw-w-4 tw-h-4\">web</cide-ele-icon>\n </div>\n \n <!-- Page Details -->\n <div class=\"tw-ml-3 tw-min-w-0 tw-flex-1\">\n <div class=\"tw-text-sm tw-font-medium tw-text-gray-900 tw-truncate\" \n [title]=\"row.sypg_title\">\n {{ row.sypg_title || 'Untitled' }}\n </div>\n @if (row.sypg_desc) {\n <div class=\"tw-text-xs tw-text-gray-500 tw-truncate\" \n [title]=\"row.sypg_desc\">\n {{ row.sypg_desc }}\n </div>\n }\n </div>\n </div>\n</ng-template>\n\n<!-- Page Status Renderer Template -->\n<ng-template #pageStatusRendererTemplate let-row=\"row\" let-value=\"value\">\n <span class=\"tw-inline-flex tw-items-center tw-px-2.5 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium tw-whitespace-nowrap\"\n [ngClass]=\"row.sypg_isactive ? 'tw-bg-green-100 tw-text-green-800' : 'tw-bg-red-100 tw-text-red-800'\">\n {{ row.sypg_isactive ? 'Active' : 'Inactive' }}\n </span>\n</ng-template>\n\n<!-- Actions Dropdown Renderer Template -->\n<ng-template #actionsDropdownRendererTemplate let-row=\"row\" let-value=\"value\">\n <cide-ele-dropdown\n [items]=\"getActionDropdownItems(row)\"\n [config]=\"{ triggerIcon: 'more_vert', triggerSize: 'sm' }\"\n (itemClick)=\"onDropdownItemClick($event, row)\">\n </cide-ele-dropdown>\n</ng-template>\n</cide-lyt-shared-wrapper> ", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: CideEleDataGridComponent, selector: "cide-ele-data-grid", inputs: ["config", "templateRenderers", "customFormatters", "actionHandlers", "serverSidePagination", "totalServerItems", "currentServerPage", "currentServerPageSize", "dragDropEnabled"], outputs: ["gridEvent"] }, { kind: "component", type: CideEleButtonComponent, selector: "button[cideEleButton], a[cideEleButton], cide-ele-button", inputs: ["label", "variant", "size", "type", "shape", "elevation", "disabled", "id", "loading", "fullWidth", "leftIcon", "rightIcon", "customClass", "tooltip", "ariaLabel", "testId", "routerLink", "routerExtras", "preventDoubleClick", "animated"], outputs: ["btnClick", "doubleClick"] }, { kind: "component", type: CideIconComponent, selector: "cide-ele-icon", inputs: ["size", "type", "toolTip"] }, { kind: "component", type: CideEleDropdownComponent, selector: "cide-ele-dropdown", inputs: ["items", "config", "triggerTemplate", "menuTemplate"], outputs: ["itemClick", "dropdownToggle"] }, { kind: "component", type: CideLytSharedWrapperComponent, selector: "cide-lyt-shared-wrapper", inputs: ["shared_wrapper_setup_param", "breadcrumb_data"] }] });
|
|
6378
6378
|
}
|
|
6379
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
6379
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCorePageListComponent, decorators: [{
|
|
6380
6380
|
type: Component,
|
|
6381
6381
|
args: [{ selector: 'cide-core-page-list', standalone: true, imports: [
|
|
6382
6382
|
CommonModule,
|
|
@@ -6386,7 +6386,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImpor
|
|
|
6386
6386
|
CideEleDropdownComponent,
|
|
6387
6387
|
CideLytSharedWrapperComponent
|
|
6388
6388
|
], template: "<!-- Page List with Shared Wrapper -->\n<cide-lyt-shared-wrapper [shared_wrapper_setup_param]=\"{ sypg_page_code: 'core_page_list' }\">\n<div class=\"tw-table tw-w-full tw-h-full\">\n\n <!-- Header Section with Filters -->\n <div class=\"tw-table-row tw-h-0\">\n <div class=\"tw-table-cell tw-px-6 tw-py-3 tw-border-b tw-border-gray-200 tw-bg-gray-50\">\n <div class=\"tw-flex tw-flex-col sm:tw-flex-row tw-justify-between tw-items-start sm:tw-items-center tw-space-y-3 sm:tw-space-y-0\">\n\n <!-- Title -->\n <div class=\"tw-flex tw-items-center tw-space-x-2\">\n <cide-ele-icon class=\"tw-text-blue-600 tw-w-5 tw-h-5\">web</cide-ele-icon>\n <h5 class=\"tw-text-base tw-font-medium tw-text-gray-900 tw-m-0\">Page Management</h5>\n </div>\n\n <!-- Actions -->\n <div class=\"tw-flex tw-flex-col sm:tw-flex-row tw-items-start sm:tw-items-center tw-space-y-3 sm:tw-space-y-0 sm:tw-space-x-3\">\n <!-- Add Page Button -->\n @if (canCreate()) {\n <button\n cideEleButton\n variant=\"primary\"\n size=\"sm\"\n (click)=\"createPage()\"\n leftIcon=\"add\"\n class=\"tw-whitespace-nowrap tw-flex tw-items-center tw-gap-2\">\n Create New Page\n </button>\n }\n </div>\n </div>\n\n <!-- Error Message -->\n @if (error()) {\n <div class=\"tw-mt-4 tw-p-4 tw-bg-red-50 tw-border tw-border-red-200 tw-rounded-md\">\n <div class=\"tw-flex tw-items-start\">\n <cide-ele-icon class=\"tw-text-red-400 tw-w-5 tw-h-5 tw-mt-0.5 tw-flex-shrink-0\">error</cide-ele-icon>\n <div class=\"tw-ml-3\">\n <h3 class=\"tw-text-sm tw-font-medium tw-text-red-800 tw-m-0\">Error</h3>\n <p class=\"tw-text-sm tw-text-red-700 tw-mt-1 tw-m-0\">{{ error() }}</p>\n </div>\n </div>\n </div>\n }\n </div>\n </div>\n\n <!-- Main Content Area -->\n <div class=\"tw-table-row\">\n <div class=\"tw-table-cell tw-h-full tw-relative\">\n \n <!-- Data Grid Component -->\n <div class=\"tw-h-full tw-overflow-auto\">\n <cide-ele-data-grid\n [config]=\"gridConfig()\"\n [templateRenderers]=\"getTemplateRenderers()\"\n [actionHandlers]=\"actionHandlers\"\n [serverSidePagination]=\"true\"\n [totalServerItems]=\"totalItems()\"\n [currentServerPage]=\"currentPage()\"\n [currentServerPageSize]=\"pageSize()\"\n (gridEvent)=\"onGridEvent($event)\">\n </cide-ele-data-grid>\n </div>\n\n </div>\n </div>\n\n</div>\n\n<!-- Page Details Renderer Template -->\n<ng-template #pageDetailsRendererTemplate let-row=\"row\" let-value=\"value\">\n <div class=\"tw-flex tw-items-center tw-min-w-0\">\n <!-- Page Icon -->\n <div class=\"tw-flex-shrink-0\">\n <cide-ele-icon class=\"tw-text-gray-400 tw-w-4 tw-h-4\">web</cide-ele-icon>\n </div>\n \n <!-- Page Details -->\n <div class=\"tw-ml-3 tw-min-w-0 tw-flex-1\">\n <div class=\"tw-text-sm tw-font-medium tw-text-gray-900 tw-truncate\" \n [title]=\"row.sypg_title\">\n {{ row.sypg_title || 'Untitled' }}\n </div>\n @if (row.sypg_desc) {\n <div class=\"tw-text-xs tw-text-gray-500 tw-truncate\" \n [title]=\"row.sypg_desc\">\n {{ row.sypg_desc }}\n </div>\n }\n </div>\n </div>\n</ng-template>\n\n<!-- Page Status Renderer Template -->\n<ng-template #pageStatusRendererTemplate let-row=\"row\" let-value=\"value\">\n <span class=\"tw-inline-flex tw-items-center tw-px-2.5 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium tw-whitespace-nowrap\"\n [ngClass]=\"row.sypg_isactive ? 'tw-bg-green-100 tw-text-green-800' : 'tw-bg-red-100 tw-text-red-800'\">\n {{ row.sypg_isactive ? 'Active' : 'Inactive' }}\n </span>\n</ng-template>\n\n<!-- Actions Dropdown Renderer Template -->\n<ng-template #actionsDropdownRendererTemplate let-row=\"row\" let-value=\"value\">\n <cide-ele-dropdown\n [items]=\"getActionDropdownItems(row)\"\n [config]=\"{ triggerIcon: 'more_vert', triggerSize: 'sm' }\"\n (itemClick)=\"onDropdownItemClick($event, row)\">\n </cide-ele-dropdown>\n</ng-template>\n</cide-lyt-shared-wrapper> " }]
|
|
6389
|
-
}], ctorParameters: () => [] });
|
|
6389
|
+
}], ctorParameters: () => [], propDecorators: { pageDetailsRendererTemplate: [{ type: i0.ViewChild, args: ['pageDetailsRendererTemplate', { isSignal: true }] }], pageStatusRendererTemplate: [{ type: i0.ViewChild, args: ['pageStatusRendererTemplate', { isSignal: true }] }], actionsDropdownRendererTemplate: [{ type: i0.ViewChild, args: ['actionsDropdownRendererTemplate', { isSignal: true }] }] } });
|
|
6390
6390
|
|
|
6391
6391
|
var pageList_component = /*#__PURE__*/Object.freeze({
|
|
6392
6392
|
__proto__: null,
|
|
@@ -6485,10 +6485,10 @@ class CideCorePageThemeService {
|
|
|
6485
6485
|
console.error('Page Theme Service Error:', errorMessage);
|
|
6486
6486
|
return throwError(() => new Error(errorMessage));
|
|
6487
6487
|
}
|
|
6488
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
6489
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.
|
|
6488
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCorePageThemeService, deps: [{ token: i1.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
6489
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCorePageThemeService, providedIn: 'root' });
|
|
6490
6490
|
}
|
|
6491
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
6491
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCorePageThemeService, decorators: [{
|
|
6492
6492
|
type: Injectable,
|
|
6493
6493
|
args: [{
|
|
6494
6494
|
providedIn: 'root'
|
|
@@ -7260,10 +7260,10 @@ class CideCorePageThemeComponent {
|
|
|
7260
7260
|
onPreviewImageUploadProgress(progress) {
|
|
7261
7261
|
console.log('Preview image upload progress:', progress + '%');
|
|
7262
7262
|
}
|
|
7263
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
7264
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.7", type: CideCorePageThemeComponent, isStandalone: true, selector: "cide-core-page-theme", viewQueries: [{ propertyName: "themeDetailsRendererTemplate", first: true, predicate: ["themeDetailsRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "themeStatusRendererTemplate", first: true, predicate: ["themeStatusRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "actionsDropdownRendererTemplate", first: true, predicate: ["actionsDropdownRendererTemplate"], descendants: true, isSignal: true }], ngImport: i0, template: "<!-- Page Theme Container -->\n<div class=\"tw-flex tw-h-full tw-w-full\">\n \n <!-- Left: Form and header (60%) -->\n <div class=\"tw-w-full lg:tw-w-3/5 tw-flex tw-flex-col tw-border-r tw-border-gray-200\">\n\n <!-- Header Section -->\n <div class=\"tw-px-6 tw-py-2 tw-border-b tw-border-gray-200 tw-bg-gray-50\">\n <div class=\"tw-flex tw-flex-col sm:tw-flex-row tw-justify-between tw-items-start sm:tw-items-center tw-space-y-2 sm:tw-space-y-0\">\n\n <!-- Title and Back Button -->\n <div class=\"tw-flex tw-items-center tw-space-x-4\">\n <button cideEleButton variant=\"ghost\" size=\"sm\" (click)=\"goBack();\" class=\"tw-text-gray-600 hover:tw-text-gray-900\">\n <cide-ele-icon class=\"tw-w-4 tw-h-4\">arrow_back</cide-ele-icon>\n </button>\n <div class=\"tw-flex tw-items-center tw-space-x-2\">\n <cide-ele-icon class=\"tw-text-blue-600 tw-w-5 tw-h-5\">palette</cide-ele-icon>\n <div>\n <h5 class=\"tw-text-base tw-font-medium tw-text-gray-900 tw-m-0\">Theme Management</h5>\n <p class=\"tw-text-sm tw-text-gray-500 tw-m-0\">Page: {{ pageTitle() }}</p>\n </div>\n </div>\n </div>\n </div>\n\n <!-- Error Message -->\n @if (error()) {\n <div class=\"tw-mt-4 tw-p-4 tw-bg-red-50 tw-border tw-border-red-200 tw-rounded-md\">\n <div class=\"tw-flex tw-items-start\">\n <cide-ele-icon name=\"error\" class=\"tw-text-red-400 tw-w-5 tw-h-5 tw-mt-0.5 tw-flex-shrink-0\"></cide-ele-icon>\n <div class=\"tw-ml-3\">\n <h3 class=\"tw-text-sm tw-font-medium tw-text-red-800 tw-m-0\">Error</h3>\n <p class=\"tw-text-sm tw-text-red-700 tw-mt-1 tw-m-0\">{{ error() }}</p>\n </div>\n </div>\n </div>\n }\n </div>\n\n <!-- Quick Add/Edit Form Section -->\n <div class=\"tw-px-6 tw-py-3 tw-bg-white tw-overflow-auto\">\n <div class=\"tw-flex tw-items-center tw-justify-between tw-mb-2\">\n <div class=\"tw-flex tw-items-center tw-space-x-3\">\n <cide-ele-icon class=\"tw-text-blue-600 tw-w-5 tw-h-5\">{{ isEditMode() ? 'edit' : 'add' }}</cide-ele-icon>\n <h6 class=\"tw-text-sm tw-font-medium tw-text-gray-900 tw-m-0\">{{ isEditMode() ? 'Edit Theme' : 'Quick Add Theme' }}</h6>\n </div>\n </div>\n\n <!-- Form (kept as-is) -->\n <form [formGroup]=\"themeForm\" (ngSubmit)=\"saveTheme()\" class=\"tw-space-y-4\">\n <div class=\"tw-grid tw-grid-cols-1 lg:tw-grid-cols-[1fr_200px] tw-gap-4\">\n <!-- Left Side: All Input Fields -->\n <div class=\"tw-space-y-4\">\n <!-- Row 1: Theme Title and Theme Code -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 tw-gap-4\">\n <div class=\"tw-space-y-2\">\n <cide-ele-input id=\"sytm_title\" formControlName=\"sytm_title\" placeholder=\"Enter theme title\" label=\"Theme Title\" size=\"sm\"></cide-ele-input>\n </div>\n <div class=\"tw-space-y-2\">\n <cide-ele-input id=\"sytm_theme_code\" formControlName=\"sytm_theme_code\" placeholder=\"Enter theme code\" label=\"Theme Code\" size=\"sm\"></cide-ele-input>\n </div>\n </div>\n \n <!-- Row 2: Sub Title and Active Status -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 tw-gap-4\">\n <div class=\"tw-space-y-2\">\n <cide-ele-input id=\"sytm_sub_title\" formControlName=\"sytm_sub_title\" placeholder=\"Enter sub title\" label=\"Sub Title\" size=\"sm\"></cide-ele-input>\n </div>\n <div class=\"tw-space-y-2 tw-flex tw-items-center\">\n <cide-ele-input\n id=\"sytm_isactive_cb\"\n type=\"checkbox\"\n label=\"Active\"\n size=\"sm\"\n formControlName=\"sytm_isactive\">\n </cide-ele-input>\n </div>\n </div>\n \n <!-- Row 3: Description -->\n <div class=\"tw-space-y-2\">\n <cide-ele-textarea id=\"sytm_desc\" formControlName=\"sytm_desc\" placeholder=\"Enter theme description\" rows=\"2\" label=\"Description\" size=\"sm\"></cide-ele-textarea>\n </div>\n </div>\n \n <!-- Right Side: File Upload -->\n <div class=\"tw-flex tw-flex-col tw-justify-start tw-items-center tw-p-0\">\n <cide-ele-file-input \n id=\"sytm_preview_id_fm\" \n formControlName=\"sytm_preview_id_fm\"\n accept=\"image/*\"\n [showPreview]=\"true\"\n [previewBoxMode]=\"true\"\n [showFileName]=\"false\"\n previewWidth=\"180px\"\n previewHeight=\"120px\"\n placeholderText=\"Upload Preview Image\"\n placeholderIcon=\"image\"\n [autoUpload]=\"true\"\n [uploadData]=\"getPreviewImageUploadData()\"\n (uploadSuccess)=\"onPreviewImageUploadSuccess($event)\"\n (uploadError)=\"onPreviewImageUploadError($event)\"\n (uploadProgressChange)=\"onPreviewImageUploadProgress($event)\">\n </cide-ele-file-input>\n </div>\n </div>\n \n <!-- Configuration JSON -->\n <div class=\"tw-space-y-2\">\n <cide-ele-json-editor label=\"Configuration JSON\" formControlName=\"sytm_configuration\" [required]=\"true\" [config]=\"{\n showLineNumbers: true,\n autoFormat: true,\n validateOnChange: true,\n minHeight: 150,\n maxHeight: 300,\n placeholder: 'Enter theme configuration JSON...'\n }\" helperText=\"Enter valid JSON configuration for the theme\"></cide-ele-json-editor>\n </div>\n <!-- Layout Configuration + Selection -->\n <div class=\"tw-grid tw-grid-cols-1 lg:tw-grid-cols-2 tw-gap-6\">\n <div class=\"tw-space-y-2\">\n <div class=\"tw-text-sm tw-font-medium tw-text-gray-700\">Layout & Selection</div>\n <!-- Selected toggle -->\n <div class=\"tw-bg-white tw-border tw-border-gray-200 tw-rounded-md tw-px-3 tw-py-2\">\n <cide-ele-input\n id=\"sytm_isselected\"\n type=\"checkbox\"\n label=\"Selected (Default)\"\n size=\"sm\"\n formControlName=\"sytm_isselected\">\n </cide-ele-input>\n </div>\n <div formGroupName=\"sytm_layout\" class=\"tw-bg-white tw-border tw-border-gray-200 tw-rounded-md tw-divide-y tw-overflow-hidden\">\n <!-- Sidebar -->\n <div class=\"tw-px-3 tw-py-2\" formGroupName=\"sytm_layout_sidebar\">\n <cide-ele-input id=\"layout_sidebar_status\" type=\"checkbox\" label=\"Sidebar\" size=\"sm\" formControlName=\"status\"></cide-ele-input>\n </div>\n <!-- Header -->\n <div class=\"tw-px-3 tw-py-2\" formGroupName=\"sytm_layout_header\">\n <cide-ele-input id=\"layout_header_status\" type=\"checkbox\" label=\"Header\" size=\"sm\" formControlName=\"status\"></cide-ele-input>\n </div>\n <!-- Footer -->\n <div class=\"tw-px-3 tw-py-2\" formGroupName=\"sytm_layout_footer\">\n <cide-ele-input id=\"layout_footer_status\" type=\"checkbox\" label=\"Footer\" size=\"sm\" formControlName=\"status\"></cide-ele-input>\n </div>\n <!-- Breadcrumb -->\n <div class=\"tw-px-3 tw-py-2\" formGroupName=\"sytm_layout_breadcrumb\">\n <cide-ele-input id=\"layout_breadcrumb_status\" type=\"checkbox\" label=\"Breadcrumb\" size=\"sm\" formControlName=\"status\"></cide-ele-input>\n </div>\n <!-- Console -->\n <div class=\"tw-px-3 tw-py-2\" formGroupName=\"sytm_layout_console\">\n <cide-ele-input id=\"layout_console_status\" type=\"checkbox\" label=\"Console\" size=\"sm\" formControlName=\"status\"></cide-ele-input>\n </div>\n <!-- Request -->\n <div class=\"tw-px-3 tw-py-2\" formGroupName=\"sytm_layout_request\">\n <cide-ele-input id=\"layout_request_status\" type=\"checkbox\" label=\"Request\" size=\"sm\" formControlName=\"status\"></cide-ele-input>\n </div>\n </div>\n <p class=\"tw-text-xs tw-text-gray-500 tw-pt-1\">Toggle active sections. Only one theme can be selected as default. More options can be added here later.</p>\n </div>\n \n <!-- Drawer Configuration -->\n <div class=\"tw-space-y-2\">\n <div class=\"tw-flex tw-items-center tw-justify-between\">\n <div class=\"tw-text-sm tw-font-medium tw-text-gray-700\">Drawers</div>\n <button cideEleButton type=\"button\" size=\"xs\" variant=\"outline\" (click)=\"addDrawer()\">\n Add Drawer\n </button>\n </div>\n\n <div formGroupName=\"sytm_layout\">\n <div class=\"tw-space-y-2\" formArrayName=\"sytm_layout_drawer\">\n <div *ngFor=\"let drawerGrp of drawerArray.controls; let i = index\" [formGroupName]=\"i\" class=\"tw-border tw-border-gray-200 tw-rounded-md tw-p-3 tw-flex tw-items-center tw-gap-3\">\n <cide-ele-input id=\"drawer_active_{{i}}\" type=\"checkbox\" label=\"Active\" size=\"sm\" formControlName=\"syth_status\"></cide-ele-input>\n <div class=\"tw-flex-1\">\n <cide-ele-select\n id=\"drawer_config_{{i}}\"\n label=\"Drawer For\"\n size=\"sm\"\n [options]=\"drawerConfigOptions\"\n formControlName=\"syth_config_syco_for\">\n </cide-ele-select>\n </div>\n <button cideEleButton type=\"button\" size=\"xs\" variant=\"ghost\" (click)=\"removeDrawer(i)\">\n <cide-ele-icon class=\"tw-w-4 tw-h-4\">delete</cide-ele-icon>\n </button>\n </div>\n <p class=\"tw-text-xs tw-text-gray-500\">Configure multiple drawers as needed.</p>\n </div>\n </div>\n </div>\n </div>\n\n <!-- Form Actions -->\n <div class=\"tw-flex tw-flex-col tw-gap-2 tw-pt-4 tw-border-t tw-border-gray-200\">\n <div class=\"tw-flex tw-items-center tw-justify-end tw-space-x-3\">\n <button cideEleButton type=\"button\" variant=\"outline\" (click)=\"cancelForm()\" [disabled]=\"loading()\">Cancel</button>\n <button cideEleButton type=\"submit\" variant=\"primary\" leftIcon=\"add\" [disabled]=\"!themeForm.valid || loading()\" [loading]=\"loading()\">\n {{ isEditMode() ? 'Update Theme' : 'Create Theme' }}\n </button>\n </div>\n </div>\n </form>\n </div>\n </div>\n\n <!-- Right: Theme gallery (40%) -->\n <div class=\"tw-hidden lg:tw-flex tw-w-2/5 tw-flex-col\">\n <!-- (Header consolidated above) -->\n\n <!-- Gallery list -->\n <div class=\"tw-flex-1 tw-overflow-auto tw-bg-gray-50\">\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 tw-gap-3 tw-p-4\">\n @for (theme of filteredThemes(); track theme._id) {\n <div class=\"tw-rounded-md tw-transition tw-cursor-pointer tw-relative\"\n [ngClass]=\"theme.sytm_isselected\n ? 'tw-border tw-border-blue-500 tw-ring-2 tw-ring-blue-200 tw-bg-blue-50/50'\n : 'tw-bg-white tw-border tw-border-gray-200 hover:tw-shadow-sm'\"\n (click)=\"editTheme(theme)\"\n role=\"button\"\n tabindex=\"0\"\n [attr.aria-selected]=\"theme.sytm_isselected ? 'true' : 'false'\"\n [attr.aria-label]=\"'Edit theme ' + (theme.sytm_title || theme.sytm_theme_code)\"\n (keydown.enter)=\"editTheme(theme)\"\n (keydown.space)=\"$event.preventDefault(); editTheme(theme)\">\n\n <!-- Selected badge -->\n <div *ngIf=\"theme.sytm_isselected\"\n class=\"tw-absolute tw-top-2 tw-right-2 tw-flex tw-items-center tw-justify-center tw-w-6 tw-h-6 tw-rounded-full tw-bg-blue-600 tw-text-white\">\n <cide-ele-icon class=\"tw-w-4 tw-h-4\">check</cide-ele-icon>\n </div>\n \n <div class=\"tw-aspect-[16/9] tw-bg-gray-100 tw-rounded-t-md tw-overflow-hidden tw-flex tw-items-center tw-justify-center\">\n @if (theme.sytm_preview_id_fm) {\n <img \n cideEleFileImage \n [fileId]=\"theme.sytm_preview_id_fm\" \n [altText]=\"'Theme Preview'\"\n class=\"tw-w-full tw-h-full tw-object-cover\" />\n } @else {\n <div class=\"tw-text-gray-400 tw-text-xs\">No preview</div>\n }\n </div>\n <div class=\"tw-p-3 tw-space-y-1\">\n <div class=\"tw-text-sm tw-font-medium tw-text-gray-900 tw-truncate\" [title]=\"theme.sytm_title\">{{ theme.sytm_title || 'Untitled Theme' }}</div>\n <div class=\"tw-text-xs tw-text-gray-500 tw-truncate\" [title]=\"theme.sytm_theme_code\">{{ theme.sytm_theme_code }}</div>\n <div class=\"tw-flex tw-items-center tw-justify-between tw-pt-1\">\n <span class=\"tw-inline-flex tw-items-center tw-gap-1 tw-text-xs\" [ngClass]=\"theme.sytm_isactive ? 'tw-text-green-700' : 'tw-text-red-700'\">\n <span class=\"tw-w-1.5 tw-h-1.5 tw-rounded-full\" [ngClass]=\"theme.sytm_isactive ? 'tw-bg-green-500' : 'tw-bg-red-500'\"></span>\n {{ theme.sytm_isactive ? 'Active' : 'Inactive' }}\n </span>\n <div class=\"tw-flex tw-items-center tw-gap-1\">\n <!-- Set Selected Button - Clear and Simple -->\n @if (theme.sytm_isselected) {\n <span class=\"tw-inline-flex tw-items-center tw-gap-1 tw-px-2 tw-py-1 tw-bg-green-100 tw-text-green-800 tw-rounded-md tw-text-xs tw-font-medium\">\n <cide-ele-icon class=\"tw-w-3 tw-h-3\">check</cide-ele-icon>\n Selected\n </span>\n } @else {\n <button cideEleButton \n variant=\"outline\" \n size=\"xs\"\n (click)=\"$event.stopPropagation(); setSelectedTheme(theme)\"\n [attr.aria-label]=\"'Select ' + (theme.sytm_title || theme.sytm_theme_code) + ' theme'\"\n class=\"tw-text-xs\">\n Select\n </button>\n }\n <button cideEleButton variant=\"ghost\" size=\"xs\" (click)=\"$event.stopPropagation(); editTheme(theme)\"\n [attr.aria-label]=\"'Edit theme ' + (theme.sytm_title || theme.sytm_theme_code)\">\n <cide-ele-icon class=\"tw-w-4 tw-h-4\">edit</cide-ele-icon>\n </button>\n <button cideEleButton variant=\"ghost\" size=\"xs\" (click)=\"$event.stopPropagation(); deleteTheme(theme)\"\n [attr.aria-label]=\"'Delete theme ' + (theme.sytm_title || theme.sytm_theme_code)\">\n <cide-ele-icon class=\"tw-w-4 tw-h-4\">delete</cide-ele-icon>\n </button>\n </div>\n </div>\n </div>\n </div>\n }\n\n @if (!loading() && filteredThemes().length === 0) {\n <div class=\"tw-col-span-full tw-text-center tw-text-xs tw-text-gray-500 tw-py-8\">No themes found</div>\n }\n </div>\n </div>\n </div>\n</div>\n\n<!-- \n Angular Template References for Grid Renderers (Best Practice)\n \n These ng-template elements represent the Angular best practice for custom rendering.\n They provide:\n - Type safety with template context\n - Component lifecycle integration\n - Change detection optimization\n - Proper event handling\n - Accessibility features\n \n Note: Current data grid uses string renderers for compatibility.\n Templates are maintained for future component enhancement.\n-->\n\n<!-- Theme Details Renderer Template -->\n<ng-template #themeDetailsRendererTemplate let-row=\"row\" let-value=\"value\">\n <div class=\"tw-flex tw-items-center tw-min-w-0\">\n <!-- Theme Icon -->\n <div class=\"tw-flex-shrink-0\">\n <cide-ele-icon \n class=\"tw-text-purple-600\" \n size=\"xs\">\n palette\n </cide-ele-icon>\n </div>\n \n <!-- Theme Details -->\n <div class=\"tw-ml-3 tw-min-w-0 tw-flex-1\">\n <div class=\"tw-text-sm tw-font-medium tw-text-gray-900 tw-truncate\" \n [title]=\"row.sytm_title\">\n {{ row.sytm_title || 'Untitled' }}\n </div>\n @if (row.sytm_desc) {\n <div class=\"tw-text-xs tw-text-gray-500 tw-truncate\" \n [title]=\"row.sytm_desc\">\n {{ row.sytm_desc }}\n </div>\n }\n </div>\n </div>\n</ng-template>\n\n<!-- Theme Status Renderer Template -->\n<ng-template #themeStatusRendererTemplate let-row=\"row\" let-value=\"value\">\n <span class=\"tw-inline-flex tw-items-center tw-px-2.5 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium tw-whitespace-nowrap\"\n [ngClass]=\"row.sytm_isactive ? 'tw-bg-green-100 tw-text-green-800' : 'tw-bg-red-100 tw-text-red-800'\">\n {{ row.sytm_isactive ? 'Active' : 'Inactive' }}\n </span>\n</ng-template>\n\n<!-- Actions Dropdown Renderer Template -->\n<ng-template #actionsDropdownRendererTemplate let-row=\"row\" let-value=\"value\">\n <cide-ele-dropdown \n [items]=\"getActionDropdownItems(row)\"\n [config]=\"{ triggerIcon: 'more_vert', triggerSize: 'sm' }\"\n (itemClick)=\"onDropdownItemClick($event, row)\">\n </cide-ele-dropdown>\n</ng-template> ", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$2.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i1$2.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "ngmodule", type: FormsModule }, { kind: "component", type: CideEleButtonComponent, selector: "button[cideEleButton], a[cideEleButton], cide-ele-button", inputs: ["label", "variant", "size", "type", "shape", "elevation", "disabled", "id", "loading", "fullWidth", "leftIcon", "rightIcon", "customClass", "tooltip", "ariaLabel", "testId", "routerLink", "routerExtras", "preventDoubleClick", "animated"], outputs: ["btnClick", "doubleClick"] }, { kind: "component", type: CideInputComponent, selector: "cide-ele-input", inputs: ["fill", "label", "labelHide", "disabled", "clearInput", "labelPlacement", "labelDir", "placeholder", "leadingIcon", "trailingIcon", "helperText", "helperTextCollapse", "hideHelperAndErrorText", "errorText", "maxlength", "minlength", "required", "autocapitalize", "autocomplete", "type", "width", "id", "ngModel", "option", "min", "max", "step", "size"], outputs: ["ngModelChange"] }, { kind: "component", type: CideSelectComponent, selector: "cide-ele-select", inputs: ["label", "labelHide", "placeholder", "helperText", "errorText", "required", "disabled", "id", "ngModel", "size", "fill", "labelPlacement", "labelDir", "leadingIcon", "trailingIcon", "clearInput", "options", "multiple", "searchable", "showSearchInput", "loading", "valueKey", "labelKey", "treeView"], outputs: ["ngModelChange", "change", "searchChange"] }, { kind: "component", type: CideTextareaComponent, selector: "cide-ele-textarea", inputs: ["label", "labelHide", "placeholder", "helperText", "errorText", "required", "disabled", "minlength", "maxlength", "rows", "id", "ngModel", "size", "fill", "labelPlacement", "labelDir", "leadingIcon", "trailingIcon", "clearInput"], outputs: ["ngModelChange"] }, { kind: "component", type: CideIconComponent, selector: "cide-ele-icon", inputs: ["size", "type", "toolTip"] }, { kind: "component", type: CideEleDropdownComponent, selector: "cide-ele-dropdown", inputs: ["items", "config", "triggerTemplate", "menuTemplate"], outputs: ["itemClick", "dropdownToggle"] }, { kind: "component", type: CideEleJsonEditorComponent, selector: "cide-ele-json-editor", inputs: ["label", "helperText", "required", "disabled", "showCharacterCount", "config"], outputs: ["valueChange", "objectChange", "errorsChange", "validChange"] }, { kind: "component", type: CideEleFileInputComponent, selector: "cide-ele-file-input", inputs: ["label", "accept", "multiple", "disabled", "required", "helperText", "errorText", "showPreview", "previewWidth", "previewHeight", "previewBoxMode", "showFileName", "placeholderText", "placeholderIcon", "autoUpload", "uploadData", "showFloatingUploader", "floatingUploaderGroupId"], outputs: ["fileChange", "uploadSuccess", "uploadError", "uploadProgressChange"] }, { kind: "directive", type: CideEleFileImageDirective, selector: "[cideEleFileImage]", inputs: ["fileId", "altText"] }] });
|
|
7263
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCorePageThemeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
7264
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: CideCorePageThemeComponent, isStandalone: true, selector: "cide-core-page-theme", viewQueries: [{ propertyName: "themeDetailsRendererTemplate", first: true, predicate: ["themeDetailsRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "themeStatusRendererTemplate", first: true, predicate: ["themeStatusRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "actionsDropdownRendererTemplate", first: true, predicate: ["actionsDropdownRendererTemplate"], descendants: true, isSignal: true }], ngImport: i0, template: "<!-- Page Theme Container -->\n<div class=\"tw-flex tw-h-full tw-w-full\">\n \n <!-- Left: Form and header (60%) -->\n <div class=\"tw-w-full lg:tw-w-3/5 tw-flex tw-flex-col tw-border-r tw-border-gray-200\">\n\n <!-- Header Section -->\n <div class=\"tw-px-6 tw-py-2 tw-border-b tw-border-gray-200 tw-bg-gray-50\">\n <div class=\"tw-flex tw-flex-col sm:tw-flex-row tw-justify-between tw-items-start sm:tw-items-center tw-space-y-2 sm:tw-space-y-0\">\n\n <!-- Title and Back Button -->\n <div class=\"tw-flex tw-items-center tw-space-x-4\">\n <button cideEleButton variant=\"ghost\" size=\"sm\" (click)=\"goBack();\" class=\"tw-text-gray-600 hover:tw-text-gray-900\">\n <cide-ele-icon class=\"tw-w-4 tw-h-4\">arrow_back</cide-ele-icon>\n </button>\n <div class=\"tw-flex tw-items-center tw-space-x-2\">\n <cide-ele-icon class=\"tw-text-blue-600 tw-w-5 tw-h-5\">palette</cide-ele-icon>\n <div>\n <h5 class=\"tw-text-base tw-font-medium tw-text-gray-900 tw-m-0\">Theme Management</h5>\n <p class=\"tw-text-sm tw-text-gray-500 tw-m-0\">Page: {{ pageTitle() }}</p>\n </div>\n </div>\n </div>\n </div>\n\n <!-- Error Message -->\n @if (error()) {\n <div class=\"tw-mt-4 tw-p-4 tw-bg-red-50 tw-border tw-border-red-200 tw-rounded-md\">\n <div class=\"tw-flex tw-items-start\">\n <cide-ele-icon name=\"error\" class=\"tw-text-red-400 tw-w-5 tw-h-5 tw-mt-0.5 tw-flex-shrink-0\"></cide-ele-icon>\n <div class=\"tw-ml-3\">\n <h3 class=\"tw-text-sm tw-font-medium tw-text-red-800 tw-m-0\">Error</h3>\n <p class=\"tw-text-sm tw-text-red-700 tw-mt-1 tw-m-0\">{{ error() }}</p>\n </div>\n </div>\n </div>\n }\n </div>\n\n <!-- Quick Add/Edit Form Section -->\n <div class=\"tw-px-6 tw-py-3 tw-bg-white tw-overflow-auto\">\n <div class=\"tw-flex tw-items-center tw-justify-between tw-mb-2\">\n <div class=\"tw-flex tw-items-center tw-space-x-3\">\n <cide-ele-icon class=\"tw-text-blue-600 tw-w-5 tw-h-5\">{{ isEditMode() ? 'edit' : 'add' }}</cide-ele-icon>\n <h6 class=\"tw-text-sm tw-font-medium tw-text-gray-900 tw-m-0\">{{ isEditMode() ? 'Edit Theme' : 'Quick Add Theme' }}</h6>\n </div>\n </div>\n\n <!-- Form (kept as-is) -->\n <form [formGroup]=\"themeForm\" (ngSubmit)=\"saveTheme()\" class=\"tw-space-y-4\">\n <div class=\"tw-grid tw-grid-cols-1 lg:tw-grid-cols-[1fr_200px] tw-gap-4\">\n <!-- Left Side: All Input Fields -->\n <div class=\"tw-space-y-4\">\n <!-- Row 1: Theme Title and Theme Code -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 tw-gap-4\">\n <div class=\"tw-space-y-2\">\n <cide-ele-input id=\"sytm_title\" formControlName=\"sytm_title\" placeholder=\"Enter theme title\" label=\"Theme Title\" size=\"sm\"></cide-ele-input>\n </div>\n <div class=\"tw-space-y-2\">\n <cide-ele-input id=\"sytm_theme_code\" formControlName=\"sytm_theme_code\" placeholder=\"Enter theme code\" label=\"Theme Code\" size=\"sm\"></cide-ele-input>\n </div>\n </div>\n \n <!-- Row 2: Sub Title and Active Status -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 tw-gap-4\">\n <div class=\"tw-space-y-2\">\n <cide-ele-input id=\"sytm_sub_title\" formControlName=\"sytm_sub_title\" placeholder=\"Enter sub title\" label=\"Sub Title\" size=\"sm\"></cide-ele-input>\n </div>\n <div class=\"tw-space-y-2 tw-flex tw-items-center\">\n <cide-ele-input\n id=\"sytm_isactive_cb\"\n type=\"checkbox\"\n label=\"Active\"\n size=\"sm\"\n formControlName=\"sytm_isactive\">\n </cide-ele-input>\n </div>\n </div>\n \n <!-- Row 3: Description -->\n <div class=\"tw-space-y-2\">\n <cide-ele-textarea id=\"sytm_desc\" formControlName=\"sytm_desc\" placeholder=\"Enter theme description\" rows=\"2\" label=\"Description\" size=\"sm\"></cide-ele-textarea>\n </div>\n </div>\n \n <!-- Right Side: File Upload -->\n <div class=\"tw-flex tw-flex-col tw-justify-start tw-items-center tw-p-0\">\n <cide-ele-file-input \n id=\"sytm_preview_id_fm\" \n formControlName=\"sytm_preview_id_fm\"\n accept=\"image/*\"\n [showPreview]=\"true\"\n [previewBoxMode]=\"true\"\n [showFileName]=\"false\"\n previewWidth=\"180px\"\n previewHeight=\"120px\"\n placeholderText=\"Upload Preview Image\"\n placeholderIcon=\"image\"\n [autoUpload]=\"true\"\n [uploadData]=\"getPreviewImageUploadData()\"\n (uploadSuccess)=\"onPreviewImageUploadSuccess($event)\"\n (uploadError)=\"onPreviewImageUploadError($event)\"\n (uploadProgressChange)=\"onPreviewImageUploadProgress($event)\">\n </cide-ele-file-input>\n </div>\n </div>\n \n <!-- Configuration JSON -->\n <div class=\"tw-space-y-2\">\n <cide-ele-json-editor label=\"Configuration JSON\" formControlName=\"sytm_configuration\" [required]=\"true\" [config]=\"{\n showLineNumbers: true,\n autoFormat: true,\n validateOnChange: true,\n minHeight: 150,\n maxHeight: 300,\n placeholder: 'Enter theme configuration JSON...'\n }\" helperText=\"Enter valid JSON configuration for the theme\"></cide-ele-json-editor>\n </div>\n <!-- Layout Configuration + Selection -->\n <div class=\"tw-grid tw-grid-cols-1 lg:tw-grid-cols-2 tw-gap-6\">\n <div class=\"tw-space-y-2\">\n <div class=\"tw-text-sm tw-font-medium tw-text-gray-700\">Layout & Selection</div>\n <!-- Selected toggle -->\n <div class=\"tw-bg-white tw-border tw-border-gray-200 tw-rounded-md tw-px-3 tw-py-2\">\n <cide-ele-input\n id=\"sytm_isselected\"\n type=\"checkbox\"\n label=\"Selected (Default)\"\n size=\"sm\"\n formControlName=\"sytm_isselected\">\n </cide-ele-input>\n </div>\n <div formGroupName=\"sytm_layout\" class=\"tw-bg-white tw-border tw-border-gray-200 tw-rounded-md tw-divide-y tw-overflow-hidden\">\n <!-- Sidebar -->\n <div class=\"tw-px-3 tw-py-2\" formGroupName=\"sytm_layout_sidebar\">\n <cide-ele-input id=\"layout_sidebar_status\" type=\"checkbox\" label=\"Sidebar\" size=\"sm\" formControlName=\"status\"></cide-ele-input>\n </div>\n <!-- Header -->\n <div class=\"tw-px-3 tw-py-2\" formGroupName=\"sytm_layout_header\">\n <cide-ele-input id=\"layout_header_status\" type=\"checkbox\" label=\"Header\" size=\"sm\" formControlName=\"status\"></cide-ele-input>\n </div>\n <!-- Footer -->\n <div class=\"tw-px-3 tw-py-2\" formGroupName=\"sytm_layout_footer\">\n <cide-ele-input id=\"layout_footer_status\" type=\"checkbox\" label=\"Footer\" size=\"sm\" formControlName=\"status\"></cide-ele-input>\n </div>\n <!-- Breadcrumb -->\n <div class=\"tw-px-3 tw-py-2\" formGroupName=\"sytm_layout_breadcrumb\">\n <cide-ele-input id=\"layout_breadcrumb_status\" type=\"checkbox\" label=\"Breadcrumb\" size=\"sm\" formControlName=\"status\"></cide-ele-input>\n </div>\n <!-- Console -->\n <div class=\"tw-px-3 tw-py-2\" formGroupName=\"sytm_layout_console\">\n <cide-ele-input id=\"layout_console_status\" type=\"checkbox\" label=\"Console\" size=\"sm\" formControlName=\"status\"></cide-ele-input>\n </div>\n <!-- Request -->\n <div class=\"tw-px-3 tw-py-2\" formGroupName=\"sytm_layout_request\">\n <cide-ele-input id=\"layout_request_status\" type=\"checkbox\" label=\"Request\" size=\"sm\" formControlName=\"status\"></cide-ele-input>\n </div>\n </div>\n <p class=\"tw-text-xs tw-text-gray-500 tw-pt-1\">Toggle active sections. Only one theme can be selected as default. More options can be added here later.</p>\n </div>\n \n <!-- Drawer Configuration -->\n <div class=\"tw-space-y-2\">\n <div class=\"tw-flex tw-items-center tw-justify-between\">\n <div class=\"tw-text-sm tw-font-medium tw-text-gray-700\">Drawers</div>\n <button cideEleButton type=\"button\" size=\"xs\" variant=\"outline\" (click)=\"addDrawer()\">\n Add Drawer\n </button>\n </div>\n\n <div formGroupName=\"sytm_layout\">\n <div class=\"tw-space-y-2\" formArrayName=\"sytm_layout_drawer\">\n <div *ngFor=\"let drawerGrp of drawerArray.controls; let i = index\" [formGroupName]=\"i\" class=\"tw-border tw-border-gray-200 tw-rounded-md tw-p-3 tw-flex tw-items-center tw-gap-3\">\n <cide-ele-input id=\"drawer_active_{{i}}\" type=\"checkbox\" label=\"Active\" size=\"sm\" formControlName=\"syth_status\"></cide-ele-input>\n <div class=\"tw-flex-1\">\n <cide-ele-select\n id=\"drawer_config_{{i}}\"\n label=\"Drawer For\"\n size=\"sm\"\n [options]=\"drawerConfigOptions\"\n formControlName=\"syth_config_syco_for\">\n </cide-ele-select>\n </div>\n <button cideEleButton type=\"button\" size=\"xs\" variant=\"ghost\" (click)=\"removeDrawer(i)\">\n <cide-ele-icon class=\"tw-w-4 tw-h-4\">delete</cide-ele-icon>\n </button>\n </div>\n <p class=\"tw-text-xs tw-text-gray-500\">Configure multiple drawers as needed.</p>\n </div>\n </div>\n </div>\n </div>\n\n <!-- Form Actions -->\n <div class=\"tw-flex tw-flex-col tw-gap-2 tw-pt-4 tw-border-t tw-border-gray-200\">\n <div class=\"tw-flex tw-items-center tw-justify-end tw-space-x-3\">\n <button cideEleButton type=\"button\" variant=\"outline\" (click)=\"cancelForm()\" [disabled]=\"loading()\">Cancel</button>\n <button cideEleButton type=\"submit\" variant=\"primary\" leftIcon=\"add\" [disabled]=\"!themeForm.valid || loading()\" [loading]=\"loading()\">\n {{ isEditMode() ? 'Update Theme' : 'Create Theme' }}\n </button>\n </div>\n </div>\n </form>\n </div>\n </div>\n\n <!-- Right: Theme gallery (40%) -->\n <div class=\"tw-hidden lg:tw-flex tw-w-2/5 tw-flex-col\">\n <!-- (Header consolidated above) -->\n\n <!-- Gallery list -->\n <div class=\"tw-flex-1 tw-overflow-auto tw-bg-gray-50\">\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 tw-gap-3 tw-p-4\">\n @for (theme of filteredThemes(); track theme._id) {\n <div class=\"tw-rounded-md tw-transition tw-cursor-pointer tw-relative\"\n [ngClass]=\"theme.sytm_isselected\n ? 'tw-border tw-border-blue-500 tw-ring-2 tw-ring-blue-200 tw-bg-blue-50/50'\n : 'tw-bg-white tw-border tw-border-gray-200 hover:tw-shadow-sm'\"\n (click)=\"editTheme(theme)\"\n role=\"button\"\n tabindex=\"0\"\n [attr.aria-selected]=\"theme.sytm_isselected ? 'true' : 'false'\"\n [attr.aria-label]=\"'Edit theme ' + (theme.sytm_title || theme.sytm_theme_code)\"\n (keydown.enter)=\"editTheme(theme)\"\n (keydown.space)=\"$event.preventDefault(); editTheme(theme)\">\n\n <!-- Selected badge -->\n <div *ngIf=\"theme.sytm_isselected\"\n class=\"tw-absolute tw-top-2 tw-right-2 tw-flex tw-items-center tw-justify-center tw-w-6 tw-h-6 tw-rounded-full tw-bg-blue-600 tw-text-white\">\n <cide-ele-icon class=\"tw-w-4 tw-h-4\">check</cide-ele-icon>\n </div>\n \n <div class=\"tw-aspect-[16/9] tw-bg-gray-100 tw-rounded-t-md tw-overflow-hidden tw-flex tw-items-center tw-justify-center\">\n @if (theme.sytm_preview_id_fm) {\n <img \n cideEleFileImage \n [fileId]=\"theme.sytm_preview_id_fm\" \n [altText]=\"'Theme Preview'\"\n class=\"tw-w-full tw-h-full tw-object-cover\" />\n } @else {\n <div class=\"tw-text-gray-400 tw-text-xs\">No preview</div>\n }\n </div>\n <div class=\"tw-p-3 tw-space-y-1\">\n <div class=\"tw-text-sm tw-font-medium tw-text-gray-900 tw-truncate\" [title]=\"theme.sytm_title\">{{ theme.sytm_title || 'Untitled Theme' }}</div>\n <div class=\"tw-text-xs tw-text-gray-500 tw-truncate\" [title]=\"theme.sytm_theme_code\">{{ theme.sytm_theme_code }}</div>\n <div class=\"tw-flex tw-items-center tw-justify-between tw-pt-1\">\n <span class=\"tw-inline-flex tw-items-center tw-gap-1 tw-text-xs\" [ngClass]=\"theme.sytm_isactive ? 'tw-text-green-700' : 'tw-text-red-700'\">\n <span class=\"tw-w-1.5 tw-h-1.5 tw-rounded-full\" [ngClass]=\"theme.sytm_isactive ? 'tw-bg-green-500' : 'tw-bg-red-500'\"></span>\n {{ theme.sytm_isactive ? 'Active' : 'Inactive' }}\n </span>\n <div class=\"tw-flex tw-items-center tw-gap-1\">\n <!-- Set Selected Button - Clear and Simple -->\n @if (theme.sytm_isselected) {\n <span class=\"tw-inline-flex tw-items-center tw-gap-1 tw-px-2 tw-py-1 tw-bg-green-100 tw-text-green-800 tw-rounded-md tw-text-xs tw-font-medium\">\n <cide-ele-icon class=\"tw-w-3 tw-h-3\">check</cide-ele-icon>\n Selected\n </span>\n } @else {\n <button cideEleButton \n variant=\"outline\" \n size=\"xs\"\n (click)=\"$event.stopPropagation(); setSelectedTheme(theme)\"\n [attr.aria-label]=\"'Select ' + (theme.sytm_title || theme.sytm_theme_code) + ' theme'\"\n class=\"tw-text-xs\">\n Select\n </button>\n }\n <button cideEleButton variant=\"ghost\" size=\"xs\" (click)=\"$event.stopPropagation(); editTheme(theme)\"\n [attr.aria-label]=\"'Edit theme ' + (theme.sytm_title || theme.sytm_theme_code)\">\n <cide-ele-icon class=\"tw-w-4 tw-h-4\">edit</cide-ele-icon>\n </button>\n <button cideEleButton variant=\"ghost\" size=\"xs\" (click)=\"$event.stopPropagation(); deleteTheme(theme)\"\n [attr.aria-label]=\"'Delete theme ' + (theme.sytm_title || theme.sytm_theme_code)\">\n <cide-ele-icon class=\"tw-w-4 tw-h-4\">delete</cide-ele-icon>\n </button>\n </div>\n </div>\n </div>\n </div>\n }\n\n @if (!loading() && filteredThemes().length === 0) {\n <div class=\"tw-col-span-full tw-text-center tw-text-xs tw-text-gray-500 tw-py-8\">No themes found</div>\n }\n </div>\n </div>\n </div>\n</div>\n\n<!-- \n Angular Template References for Grid Renderers (Best Practice)\n \n These ng-template elements represent the Angular best practice for custom rendering.\n They provide:\n - Type safety with template context\n - Component lifecycle integration\n - Change detection optimization\n - Proper event handling\n - Accessibility features\n \n Note: Current data grid uses string renderers for compatibility.\n Templates are maintained for future component enhancement.\n-->\n\n<!-- Theme Details Renderer Template -->\n<ng-template #themeDetailsRendererTemplate let-row=\"row\" let-value=\"value\">\n <div class=\"tw-flex tw-items-center tw-min-w-0\">\n <!-- Theme Icon -->\n <div class=\"tw-flex-shrink-0\">\n <cide-ele-icon \n class=\"tw-text-purple-600\" \n size=\"xs\">\n palette\n </cide-ele-icon>\n </div>\n \n <!-- Theme Details -->\n <div class=\"tw-ml-3 tw-min-w-0 tw-flex-1\">\n <div class=\"tw-text-sm tw-font-medium tw-text-gray-900 tw-truncate\" \n [title]=\"row.sytm_title\">\n {{ row.sytm_title || 'Untitled' }}\n </div>\n @if (row.sytm_desc) {\n <div class=\"tw-text-xs tw-text-gray-500 tw-truncate\" \n [title]=\"row.sytm_desc\">\n {{ row.sytm_desc }}\n </div>\n }\n </div>\n </div>\n</ng-template>\n\n<!-- Theme Status Renderer Template -->\n<ng-template #themeStatusRendererTemplate let-row=\"row\" let-value=\"value\">\n <span class=\"tw-inline-flex tw-items-center tw-px-2.5 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium tw-whitespace-nowrap\"\n [ngClass]=\"row.sytm_isactive ? 'tw-bg-green-100 tw-text-green-800' : 'tw-bg-red-100 tw-text-red-800'\">\n {{ row.sytm_isactive ? 'Active' : 'Inactive' }}\n </span>\n</ng-template>\n\n<!-- Actions Dropdown Renderer Template -->\n<ng-template #actionsDropdownRendererTemplate let-row=\"row\" let-value=\"value\">\n <cide-ele-dropdown \n [items]=\"getActionDropdownItems(row)\"\n [config]=\"{ triggerIcon: 'more_vert', triggerSize: 'sm' }\"\n (itemClick)=\"onDropdownItemClick($event, row)\">\n </cide-ele-dropdown>\n</ng-template> ", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$2.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i1$2.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "ngmodule", type: FormsModule }, { kind: "component", type: CideEleButtonComponent, selector: "button[cideEleButton], a[cideEleButton], cide-ele-button", inputs: ["label", "variant", "size", "type", "shape", "elevation", "disabled", "id", "loading", "fullWidth", "leftIcon", "rightIcon", "customClass", "tooltip", "ariaLabel", "testId", "routerLink", "routerExtras", "preventDoubleClick", "animated"], outputs: ["btnClick", "doubleClick"] }, { kind: "component", type: CideInputComponent, selector: "cide-ele-input", inputs: ["fill", "label", "labelHide", "disabled", "clearInput", "labelPlacement", "labelDir", "placeholder", "leadingIcon", "trailingIcon", "helperText", "helperTextCollapse", "hideHelperAndErrorText", "errorText", "maxlength", "minlength", "required", "autocapitalize", "autocomplete", "type", "width", "id", "ngModel", "option", "min", "max", "step", "size"], outputs: ["ngModelChange"] }, { kind: "component", type: CideSelectComponent, selector: "cide-ele-select", inputs: ["label", "labelHide", "placeholder", "helperText", "errorText", "required", "disabled", "id", "ngModel", "size", "fill", "labelPlacement", "labelDir", "leadingIcon", "trailingIcon", "clearInput", "options", "multiple", "searchable", "showSearchInput", "loading", "valueKey", "labelKey", "treeView"], outputs: ["ngModelChange", "change", "searchChange"] }, { kind: "component", type: CideTextareaComponent, selector: "cide-ele-textarea", inputs: ["label", "labelHide", "placeholder", "helperText", "errorText", "required", "disabled", "minlength", "maxlength", "rows", "id", "ngModel", "size", "fill", "labelPlacement", "labelDir", "leadingIcon", "trailingIcon", "clearInput"], outputs: ["ngModelChange"] }, { kind: "component", type: CideIconComponent, selector: "cide-ele-icon", inputs: ["size", "type", "toolTip"] }, { kind: "component", type: CideEleDropdownComponent, selector: "cide-ele-dropdown", inputs: ["items", "config", "triggerTemplate", "menuTemplate"], outputs: ["itemClick", "dropdownToggle"] }, { kind: "component", type: CideEleJsonEditorComponent, selector: "cide-ele-json-editor", inputs: ["label", "helperText", "required", "disabled", "showCharacterCount", "config"], outputs: ["valueChange", "objectChange", "errorsChange", "validChange"] }, { kind: "component", type: CideEleFileInputComponent, selector: "cide-ele-file-input", inputs: ["label", "accept", "multiple", "disabled", "required", "helperText", "errorText", "showPreview", "previewWidth", "previewHeight", "previewBoxMode", "showFileName", "placeholderText", "placeholderIcon", "autoUpload", "uploadData", "showFloatingUploader", "floatingUploaderGroupId"], outputs: ["fileChange", "uploadSuccess", "uploadError", "uploadProgressChange"] }, { kind: "directive", type: CideEleFileImageDirective, selector: "[cideEleFileImage]", inputs: ["fileId", "altText"] }] });
|
|
7265
7265
|
}
|
|
7266
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
7266
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCorePageThemeComponent, decorators: [{
|
|
7267
7267
|
type: Component,
|
|
7268
7268
|
args: [{ selector: 'cide-core-page-theme', standalone: true, imports: [
|
|
7269
7269
|
CommonModule,
|
|
@@ -7279,7 +7279,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImpor
|
|
|
7279
7279
|
CideEleFileInputComponent,
|
|
7280
7280
|
CideEleFileImageDirective,
|
|
7281
7281
|
], template: "<!-- Page Theme Container -->\n<div class=\"tw-flex tw-h-full tw-w-full\">\n \n <!-- Left: Form and header (60%) -->\n <div class=\"tw-w-full lg:tw-w-3/5 tw-flex tw-flex-col tw-border-r tw-border-gray-200\">\n\n <!-- Header Section -->\n <div class=\"tw-px-6 tw-py-2 tw-border-b tw-border-gray-200 tw-bg-gray-50\">\n <div class=\"tw-flex tw-flex-col sm:tw-flex-row tw-justify-between tw-items-start sm:tw-items-center tw-space-y-2 sm:tw-space-y-0\">\n\n <!-- Title and Back Button -->\n <div class=\"tw-flex tw-items-center tw-space-x-4\">\n <button cideEleButton variant=\"ghost\" size=\"sm\" (click)=\"goBack();\" class=\"tw-text-gray-600 hover:tw-text-gray-900\">\n <cide-ele-icon class=\"tw-w-4 tw-h-4\">arrow_back</cide-ele-icon>\n </button>\n <div class=\"tw-flex tw-items-center tw-space-x-2\">\n <cide-ele-icon class=\"tw-text-blue-600 tw-w-5 tw-h-5\">palette</cide-ele-icon>\n <div>\n <h5 class=\"tw-text-base tw-font-medium tw-text-gray-900 tw-m-0\">Theme Management</h5>\n <p class=\"tw-text-sm tw-text-gray-500 tw-m-0\">Page: {{ pageTitle() }}</p>\n </div>\n </div>\n </div>\n </div>\n\n <!-- Error Message -->\n @if (error()) {\n <div class=\"tw-mt-4 tw-p-4 tw-bg-red-50 tw-border tw-border-red-200 tw-rounded-md\">\n <div class=\"tw-flex tw-items-start\">\n <cide-ele-icon name=\"error\" class=\"tw-text-red-400 tw-w-5 tw-h-5 tw-mt-0.5 tw-flex-shrink-0\"></cide-ele-icon>\n <div class=\"tw-ml-3\">\n <h3 class=\"tw-text-sm tw-font-medium tw-text-red-800 tw-m-0\">Error</h3>\n <p class=\"tw-text-sm tw-text-red-700 tw-mt-1 tw-m-0\">{{ error() }}</p>\n </div>\n </div>\n </div>\n }\n </div>\n\n <!-- Quick Add/Edit Form Section -->\n <div class=\"tw-px-6 tw-py-3 tw-bg-white tw-overflow-auto\">\n <div class=\"tw-flex tw-items-center tw-justify-between tw-mb-2\">\n <div class=\"tw-flex tw-items-center tw-space-x-3\">\n <cide-ele-icon class=\"tw-text-blue-600 tw-w-5 tw-h-5\">{{ isEditMode() ? 'edit' : 'add' }}</cide-ele-icon>\n <h6 class=\"tw-text-sm tw-font-medium tw-text-gray-900 tw-m-0\">{{ isEditMode() ? 'Edit Theme' : 'Quick Add Theme' }}</h6>\n </div>\n </div>\n\n <!-- Form (kept as-is) -->\n <form [formGroup]=\"themeForm\" (ngSubmit)=\"saveTheme()\" class=\"tw-space-y-4\">\n <div class=\"tw-grid tw-grid-cols-1 lg:tw-grid-cols-[1fr_200px] tw-gap-4\">\n <!-- Left Side: All Input Fields -->\n <div class=\"tw-space-y-4\">\n <!-- Row 1: Theme Title and Theme Code -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 tw-gap-4\">\n <div class=\"tw-space-y-2\">\n <cide-ele-input id=\"sytm_title\" formControlName=\"sytm_title\" placeholder=\"Enter theme title\" label=\"Theme Title\" size=\"sm\"></cide-ele-input>\n </div>\n <div class=\"tw-space-y-2\">\n <cide-ele-input id=\"sytm_theme_code\" formControlName=\"sytm_theme_code\" placeholder=\"Enter theme code\" label=\"Theme Code\" size=\"sm\"></cide-ele-input>\n </div>\n </div>\n \n <!-- Row 2: Sub Title and Active Status -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 tw-gap-4\">\n <div class=\"tw-space-y-2\">\n <cide-ele-input id=\"sytm_sub_title\" formControlName=\"sytm_sub_title\" placeholder=\"Enter sub title\" label=\"Sub Title\" size=\"sm\"></cide-ele-input>\n </div>\n <div class=\"tw-space-y-2 tw-flex tw-items-center\">\n <cide-ele-input\n id=\"sytm_isactive_cb\"\n type=\"checkbox\"\n label=\"Active\"\n size=\"sm\"\n formControlName=\"sytm_isactive\">\n </cide-ele-input>\n </div>\n </div>\n \n <!-- Row 3: Description -->\n <div class=\"tw-space-y-2\">\n <cide-ele-textarea id=\"sytm_desc\" formControlName=\"sytm_desc\" placeholder=\"Enter theme description\" rows=\"2\" label=\"Description\" size=\"sm\"></cide-ele-textarea>\n </div>\n </div>\n \n <!-- Right Side: File Upload -->\n <div class=\"tw-flex tw-flex-col tw-justify-start tw-items-center tw-p-0\">\n <cide-ele-file-input \n id=\"sytm_preview_id_fm\" \n formControlName=\"sytm_preview_id_fm\"\n accept=\"image/*\"\n [showPreview]=\"true\"\n [previewBoxMode]=\"true\"\n [showFileName]=\"false\"\n previewWidth=\"180px\"\n previewHeight=\"120px\"\n placeholderText=\"Upload Preview Image\"\n placeholderIcon=\"image\"\n [autoUpload]=\"true\"\n [uploadData]=\"getPreviewImageUploadData()\"\n (uploadSuccess)=\"onPreviewImageUploadSuccess($event)\"\n (uploadError)=\"onPreviewImageUploadError($event)\"\n (uploadProgressChange)=\"onPreviewImageUploadProgress($event)\">\n </cide-ele-file-input>\n </div>\n </div>\n \n <!-- Configuration JSON -->\n <div class=\"tw-space-y-2\">\n <cide-ele-json-editor label=\"Configuration JSON\" formControlName=\"sytm_configuration\" [required]=\"true\" [config]=\"{\n showLineNumbers: true,\n autoFormat: true,\n validateOnChange: true,\n minHeight: 150,\n maxHeight: 300,\n placeholder: 'Enter theme configuration JSON...'\n }\" helperText=\"Enter valid JSON configuration for the theme\"></cide-ele-json-editor>\n </div>\n <!-- Layout Configuration + Selection -->\n <div class=\"tw-grid tw-grid-cols-1 lg:tw-grid-cols-2 tw-gap-6\">\n <div class=\"tw-space-y-2\">\n <div class=\"tw-text-sm tw-font-medium tw-text-gray-700\">Layout & Selection</div>\n <!-- Selected toggle -->\n <div class=\"tw-bg-white tw-border tw-border-gray-200 tw-rounded-md tw-px-3 tw-py-2\">\n <cide-ele-input\n id=\"sytm_isselected\"\n type=\"checkbox\"\n label=\"Selected (Default)\"\n size=\"sm\"\n formControlName=\"sytm_isselected\">\n </cide-ele-input>\n </div>\n <div formGroupName=\"sytm_layout\" class=\"tw-bg-white tw-border tw-border-gray-200 tw-rounded-md tw-divide-y tw-overflow-hidden\">\n <!-- Sidebar -->\n <div class=\"tw-px-3 tw-py-2\" formGroupName=\"sytm_layout_sidebar\">\n <cide-ele-input id=\"layout_sidebar_status\" type=\"checkbox\" label=\"Sidebar\" size=\"sm\" formControlName=\"status\"></cide-ele-input>\n </div>\n <!-- Header -->\n <div class=\"tw-px-3 tw-py-2\" formGroupName=\"sytm_layout_header\">\n <cide-ele-input id=\"layout_header_status\" type=\"checkbox\" label=\"Header\" size=\"sm\" formControlName=\"status\"></cide-ele-input>\n </div>\n <!-- Footer -->\n <div class=\"tw-px-3 tw-py-2\" formGroupName=\"sytm_layout_footer\">\n <cide-ele-input id=\"layout_footer_status\" type=\"checkbox\" label=\"Footer\" size=\"sm\" formControlName=\"status\"></cide-ele-input>\n </div>\n <!-- Breadcrumb -->\n <div class=\"tw-px-3 tw-py-2\" formGroupName=\"sytm_layout_breadcrumb\">\n <cide-ele-input id=\"layout_breadcrumb_status\" type=\"checkbox\" label=\"Breadcrumb\" size=\"sm\" formControlName=\"status\"></cide-ele-input>\n </div>\n <!-- Console -->\n <div class=\"tw-px-3 tw-py-2\" formGroupName=\"sytm_layout_console\">\n <cide-ele-input id=\"layout_console_status\" type=\"checkbox\" label=\"Console\" size=\"sm\" formControlName=\"status\"></cide-ele-input>\n </div>\n <!-- Request -->\n <div class=\"tw-px-3 tw-py-2\" formGroupName=\"sytm_layout_request\">\n <cide-ele-input id=\"layout_request_status\" type=\"checkbox\" label=\"Request\" size=\"sm\" formControlName=\"status\"></cide-ele-input>\n </div>\n </div>\n <p class=\"tw-text-xs tw-text-gray-500 tw-pt-1\">Toggle active sections. Only one theme can be selected as default. More options can be added here later.</p>\n </div>\n \n <!-- Drawer Configuration -->\n <div class=\"tw-space-y-2\">\n <div class=\"tw-flex tw-items-center tw-justify-between\">\n <div class=\"tw-text-sm tw-font-medium tw-text-gray-700\">Drawers</div>\n <button cideEleButton type=\"button\" size=\"xs\" variant=\"outline\" (click)=\"addDrawer()\">\n Add Drawer\n </button>\n </div>\n\n <div formGroupName=\"sytm_layout\">\n <div class=\"tw-space-y-2\" formArrayName=\"sytm_layout_drawer\">\n <div *ngFor=\"let drawerGrp of drawerArray.controls; let i = index\" [formGroupName]=\"i\" class=\"tw-border tw-border-gray-200 tw-rounded-md tw-p-3 tw-flex tw-items-center tw-gap-3\">\n <cide-ele-input id=\"drawer_active_{{i}}\" type=\"checkbox\" label=\"Active\" size=\"sm\" formControlName=\"syth_status\"></cide-ele-input>\n <div class=\"tw-flex-1\">\n <cide-ele-select\n id=\"drawer_config_{{i}}\"\n label=\"Drawer For\"\n size=\"sm\"\n [options]=\"drawerConfigOptions\"\n formControlName=\"syth_config_syco_for\">\n </cide-ele-select>\n </div>\n <button cideEleButton type=\"button\" size=\"xs\" variant=\"ghost\" (click)=\"removeDrawer(i)\">\n <cide-ele-icon class=\"tw-w-4 tw-h-4\">delete</cide-ele-icon>\n </button>\n </div>\n <p class=\"tw-text-xs tw-text-gray-500\">Configure multiple drawers as needed.</p>\n </div>\n </div>\n </div>\n </div>\n\n <!-- Form Actions -->\n <div class=\"tw-flex tw-flex-col tw-gap-2 tw-pt-4 tw-border-t tw-border-gray-200\">\n <div class=\"tw-flex tw-items-center tw-justify-end tw-space-x-3\">\n <button cideEleButton type=\"button\" variant=\"outline\" (click)=\"cancelForm()\" [disabled]=\"loading()\">Cancel</button>\n <button cideEleButton type=\"submit\" variant=\"primary\" leftIcon=\"add\" [disabled]=\"!themeForm.valid || loading()\" [loading]=\"loading()\">\n {{ isEditMode() ? 'Update Theme' : 'Create Theme' }}\n </button>\n </div>\n </div>\n </form>\n </div>\n </div>\n\n <!-- Right: Theme gallery (40%) -->\n <div class=\"tw-hidden lg:tw-flex tw-w-2/5 tw-flex-col\">\n <!-- (Header consolidated above) -->\n\n <!-- Gallery list -->\n <div class=\"tw-flex-1 tw-overflow-auto tw-bg-gray-50\">\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 tw-gap-3 tw-p-4\">\n @for (theme of filteredThemes(); track theme._id) {\n <div class=\"tw-rounded-md tw-transition tw-cursor-pointer tw-relative\"\n [ngClass]=\"theme.sytm_isselected\n ? 'tw-border tw-border-blue-500 tw-ring-2 tw-ring-blue-200 tw-bg-blue-50/50'\n : 'tw-bg-white tw-border tw-border-gray-200 hover:tw-shadow-sm'\"\n (click)=\"editTheme(theme)\"\n role=\"button\"\n tabindex=\"0\"\n [attr.aria-selected]=\"theme.sytm_isselected ? 'true' : 'false'\"\n [attr.aria-label]=\"'Edit theme ' + (theme.sytm_title || theme.sytm_theme_code)\"\n (keydown.enter)=\"editTheme(theme)\"\n (keydown.space)=\"$event.preventDefault(); editTheme(theme)\">\n\n <!-- Selected badge -->\n <div *ngIf=\"theme.sytm_isselected\"\n class=\"tw-absolute tw-top-2 tw-right-2 tw-flex tw-items-center tw-justify-center tw-w-6 tw-h-6 tw-rounded-full tw-bg-blue-600 tw-text-white\">\n <cide-ele-icon class=\"tw-w-4 tw-h-4\">check</cide-ele-icon>\n </div>\n \n <div class=\"tw-aspect-[16/9] tw-bg-gray-100 tw-rounded-t-md tw-overflow-hidden tw-flex tw-items-center tw-justify-center\">\n @if (theme.sytm_preview_id_fm) {\n <img \n cideEleFileImage \n [fileId]=\"theme.sytm_preview_id_fm\" \n [altText]=\"'Theme Preview'\"\n class=\"tw-w-full tw-h-full tw-object-cover\" />\n } @else {\n <div class=\"tw-text-gray-400 tw-text-xs\">No preview</div>\n }\n </div>\n <div class=\"tw-p-3 tw-space-y-1\">\n <div class=\"tw-text-sm tw-font-medium tw-text-gray-900 tw-truncate\" [title]=\"theme.sytm_title\">{{ theme.sytm_title || 'Untitled Theme' }}</div>\n <div class=\"tw-text-xs tw-text-gray-500 tw-truncate\" [title]=\"theme.sytm_theme_code\">{{ theme.sytm_theme_code }}</div>\n <div class=\"tw-flex tw-items-center tw-justify-between tw-pt-1\">\n <span class=\"tw-inline-flex tw-items-center tw-gap-1 tw-text-xs\" [ngClass]=\"theme.sytm_isactive ? 'tw-text-green-700' : 'tw-text-red-700'\">\n <span class=\"tw-w-1.5 tw-h-1.5 tw-rounded-full\" [ngClass]=\"theme.sytm_isactive ? 'tw-bg-green-500' : 'tw-bg-red-500'\"></span>\n {{ theme.sytm_isactive ? 'Active' : 'Inactive' }}\n </span>\n <div class=\"tw-flex tw-items-center tw-gap-1\">\n <!-- Set Selected Button - Clear and Simple -->\n @if (theme.sytm_isselected) {\n <span class=\"tw-inline-flex tw-items-center tw-gap-1 tw-px-2 tw-py-1 tw-bg-green-100 tw-text-green-800 tw-rounded-md tw-text-xs tw-font-medium\">\n <cide-ele-icon class=\"tw-w-3 tw-h-3\">check</cide-ele-icon>\n Selected\n </span>\n } @else {\n <button cideEleButton \n variant=\"outline\" \n size=\"xs\"\n (click)=\"$event.stopPropagation(); setSelectedTheme(theme)\"\n [attr.aria-label]=\"'Select ' + (theme.sytm_title || theme.sytm_theme_code) + ' theme'\"\n class=\"tw-text-xs\">\n Select\n </button>\n }\n <button cideEleButton variant=\"ghost\" size=\"xs\" (click)=\"$event.stopPropagation(); editTheme(theme)\"\n [attr.aria-label]=\"'Edit theme ' + (theme.sytm_title || theme.sytm_theme_code)\">\n <cide-ele-icon class=\"tw-w-4 tw-h-4\">edit</cide-ele-icon>\n </button>\n <button cideEleButton variant=\"ghost\" size=\"xs\" (click)=\"$event.stopPropagation(); deleteTheme(theme)\"\n [attr.aria-label]=\"'Delete theme ' + (theme.sytm_title || theme.sytm_theme_code)\">\n <cide-ele-icon class=\"tw-w-4 tw-h-4\">delete</cide-ele-icon>\n </button>\n </div>\n </div>\n </div>\n </div>\n }\n\n @if (!loading() && filteredThemes().length === 0) {\n <div class=\"tw-col-span-full tw-text-center tw-text-xs tw-text-gray-500 tw-py-8\">No themes found</div>\n }\n </div>\n </div>\n </div>\n</div>\n\n<!-- \n Angular Template References for Grid Renderers (Best Practice)\n \n These ng-template elements represent the Angular best practice for custom rendering.\n They provide:\n - Type safety with template context\n - Component lifecycle integration\n - Change detection optimization\n - Proper event handling\n - Accessibility features\n \n Note: Current data grid uses string renderers for compatibility.\n Templates are maintained for future component enhancement.\n-->\n\n<!-- Theme Details Renderer Template -->\n<ng-template #themeDetailsRendererTemplate let-row=\"row\" let-value=\"value\">\n <div class=\"tw-flex tw-items-center tw-min-w-0\">\n <!-- Theme Icon -->\n <div class=\"tw-flex-shrink-0\">\n <cide-ele-icon \n class=\"tw-text-purple-600\" \n size=\"xs\">\n palette\n </cide-ele-icon>\n </div>\n \n <!-- Theme Details -->\n <div class=\"tw-ml-3 tw-min-w-0 tw-flex-1\">\n <div class=\"tw-text-sm tw-font-medium tw-text-gray-900 tw-truncate\" \n [title]=\"row.sytm_title\">\n {{ row.sytm_title || 'Untitled' }}\n </div>\n @if (row.sytm_desc) {\n <div class=\"tw-text-xs tw-text-gray-500 tw-truncate\" \n [title]=\"row.sytm_desc\">\n {{ row.sytm_desc }}\n </div>\n }\n </div>\n </div>\n</ng-template>\n\n<!-- Theme Status Renderer Template -->\n<ng-template #themeStatusRendererTemplate let-row=\"row\" let-value=\"value\">\n <span class=\"tw-inline-flex tw-items-center tw-px-2.5 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium tw-whitespace-nowrap\"\n [ngClass]=\"row.sytm_isactive ? 'tw-bg-green-100 tw-text-green-800' : 'tw-bg-red-100 tw-text-red-800'\">\n {{ row.sytm_isactive ? 'Active' : 'Inactive' }}\n </span>\n</ng-template>\n\n<!-- Actions Dropdown Renderer Template -->\n<ng-template #actionsDropdownRendererTemplate let-row=\"row\" let-value=\"value\">\n <cide-ele-dropdown \n [items]=\"getActionDropdownItems(row)\"\n [config]=\"{ triggerIcon: 'more_vert', triggerSize: 'sm' }\"\n (itemClick)=\"onDropdownItemClick($event, row)\">\n </cide-ele-dropdown>\n</ng-template> " }]
|
|
7282
|
-
}] });
|
|
7282
|
+
}], propDecorators: { themeDetailsRendererTemplate: [{ type: i0.ViewChild, args: ['themeDetailsRendererTemplate', { isSignal: true }] }], themeStatusRendererTemplate: [{ type: i0.ViewChild, args: ['themeStatusRendererTemplate', { isSignal: true }] }], actionsDropdownRendererTemplate: [{ type: i0.ViewChild, args: ['actionsDropdownRendererTemplate', { isSignal: true }] }] } });
|
|
7283
7283
|
|
|
7284
7284
|
var pageTheme_component = /*#__PURE__*/Object.freeze({
|
|
7285
7285
|
__proto__: null,
|
|
@@ -7407,10 +7407,10 @@ class CideCorePageControlsService {
|
|
|
7407
7407
|
console.error('Page Controls Service Error:', errorMessage);
|
|
7408
7408
|
return throwError(() => new Error(errorMessage));
|
|
7409
7409
|
}
|
|
7410
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
7411
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.
|
|
7410
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCorePageControlsService, deps: [{ token: i1.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
7411
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCorePageControlsService, providedIn: 'root' });
|
|
7412
7412
|
}
|
|
7413
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
7413
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCorePageControlsService, decorators: [{
|
|
7414
7414
|
type: Injectable,
|
|
7415
7415
|
args: [{
|
|
7416
7416
|
providedIn: 'root'
|
|
@@ -7869,10 +7869,10 @@ class CideCorePageControlsComponent {
|
|
|
7869
7869
|
trackByControlId(index, control) {
|
|
7870
7870
|
return control._id || '';
|
|
7871
7871
|
}
|
|
7872
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
7873
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.7", type: CideCorePageControlsComponent, isStandalone: true, selector: "cide-core-page-controls", ngImport: i0, template: "<!-- Page Controls Container -->\r\n<div class=\"tw-flex tw-flex-col tw-h-full tw-bg-gray-50\">\r\n <!-- Header Section -->\r\n <div class=\"tw-bg-white tw-border-b tw-border-gray-200 tw-px-6 tw-py-4\">\r\n <div class=\"tw-flex tw-items-center tw-justify-between\">\r\n <div class=\"tw-flex tw-items-center tw-space-x-4\">\r\n <button \r\n cideEleButton\r\n variant=\"ghost\"\r\n size=\"sm\"\r\n (click)=\"goBack()\"\r\n class=\"tw-flex tw-items-center tw-justify-center tw-w-8 tw-h-8 tw-text-gray-600 hover:tw-text-gray-900 hover:tw-bg-gray-100 tw-rounded-md tw-transition-colors\">\r\n <cide-ele-icon>arrow_back</cide-ele-icon>\r\n </button>\r\n <div class=\"tw-flex tw-items-center tw-space-x-3\">\r\n <cide-ele-icon class=\"tw-text-blue-600 tw-text-xl\">settings</cide-ele-icon>\r\n <div>\r\n <h1 class=\"tw-text-xl tw-font-semibold tw-text-gray-900 tw-mb-0\">Control Management</h1>\r\n <p class=\"tw-text-sm tw-text-gray-500 tw-mb-0\">Page: {{ pageTitle() }}</p>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <!-- Error Message -->\r\n <div class=\"tw-bg-red-50 tw-border tw-border-red-200 tw-rounded-md tw-p-4 tw-mx-6 tw-mt-4 tw-flex tw-items-start tw-space-x-3\" *ngIf=\"error()\">\r\n <cide-ele-icon class=\"tw-text-red-500 tw-flex-shrink-0 tw-mt-0.5\">error</cide-ele-icon>\r\n <div>\r\n <h3 class=\"tw-text-red-800 tw-font-medium tw-mb-1\">Error</h3>\r\n <p class=\"tw-text-red-700 tw-text-sm tw-mb-0\">{{ error() }}</p>\r\n </div>\r\n </div>\r\n\r\n <!-- Main Content Area -->\r\n <div class=\"tw-flex tw-flex-1 tw-gap-6 tw-p-6 tw-overflow-hidden lg:tw-flex-row tw-flex-col\">\r\n <!-- Form Section -->\r\n <div class=\"tw-w-full lg:tw-w-3/5 tw-bg-white tw-rounded-lg tw-border tw-border-gray-200 tw-shadow-sm tw-flex tw-flex-col\">\r\n <div class=\"tw-flex tw-items-center tw-space-x-3 tw-p-6 tw-border-b tw-border-gray-200\">\r\n <cide-ele-icon class=\"tw-text-blue-600\">{{ isEditMode() ? 'edit' : 'add' }}</cide-ele-icon>\r\n <h3 class=\"tw-text-lg tw-font-medium tw-text-gray-900 tw-mb-0\">{{ isEditMode() ? 'Edit Control' : 'Quick Add Control' }}</h3>\r\n </div>\r\n\r\n <!-- Form -->\r\n <form [formGroup]=\"controlForm\" (ngSubmit)=\"saveControl()\" class=\"tw-flex tw-flex-col tw-flex-1 tw-p-6 tw-overflow-y-auto\">\r\n <div class=\"tw-grid tw-grid-cols-1 lg:tw-grid-cols-2 tw-gap-4 tw-mb-6\">\r\n \r\n <!-- Basic Information Section -->\r\n <!-- Control Key -->\r\n <div class=\"tw-space-y-1\">\r\n <cide-ele-input\r\n id=\"sype_key\"\r\n formControlName=\"sype_key\"\r\n placeholder=\"Enter control key\"\r\n label=\"Control Key\"\r\n size=\"sm\">\r\n </cide-ele-input>\r\n </div>\r\n\r\n <!-- Control Label -->\r\n <div class=\"tw-space-y-1\">\r\n <cide-ele-input\r\n id=\"sype_label\"\r\n formControlName=\"sype_label\"\r\n placeholder=\"Enter control label\"\r\n label=\"Control Label\"\r\n size=\"sm\">\r\n </cide-ele-input>\r\n </div>\r\n\r\n <!-- Control Type -->\r\n <div class=\"tw-space-y-1\">\r\n <cide-ele-select\r\n id=\"sype_type\"\r\n formControlName=\"sype_type\"\r\n [options]=\"[\r\n { value: 'text', label: 'Text Input' },\r\n { value: 'textarea', label: 'Text Area' },\r\n { value: 'select', label: 'Select' },\r\n { value: 'checkbox', label: 'Checkbox' },\r\n { value: 'radio', label: 'Radio' },\r\n { value: 'date', label: 'Date' },\r\n { value: 'number', label: 'Number' },\r\n { value: 'email', label: 'Email' },\r\n { value: 'password', label: 'Password' },\r\n { value: 'file', label: 'File Upload' }\r\n ]\"\r\n label=\"Control Type\"\r\n size=\"sm\">\r\n </cide-ele-select>\r\n </div>\r\n\r\n <!-- Status - Checkbox aligned properly -->\r\n <div class=\"tw-space-y-1\">\r\n <cide-ele-input\r\n id=\"sype_isactive\"\r\n type=\"checkbox\"\r\n formControlName=\"sype_isactive\"\r\n label=\"Active Status\"\r\n size=\"sm\">\r\n </cide-ele-input>\r\n </div>\r\n\r\n <!-- Placeholder -->\r\n <div class=\"tw-space-y-1\">\r\n <cide-ele-input\r\n id=\"sype_placeholder\"\r\n formControlName=\"sype_placeholder\"\r\n placeholder=\"Enter placeholder text\"\r\n label=\"Placeholder\"\r\n size=\"sm\">\r\n </cide-ele-input>\r\n </div>\r\n\r\n <!-- Auto Complete - Checkbox aligned properly -->\r\n <div class=\"tw-space-y-1\">\r\n <cide-ele-input\r\n id=\"sype_auto_complete\"\r\n type=\"checkbox\"\r\n formControlName=\"sype_auto_complete\"\r\n label=\"Auto Complete\"\r\n size=\"sm\">\r\n </cide-ele-input>\r\n </div>\r\n\r\n <!-- Tooltip -->\r\n <div class=\"tw-space-y-1\">\r\n <cide-ele-input\r\n id=\"sype_tooltip\"\r\n formControlName=\"sype_tooltip\"\r\n placeholder=\"Enter tooltip text\"\r\n label=\"Tooltip\"\r\n size=\"sm\">\r\n </cide-ele-input>\r\n </div>\r\n\r\n <!-- Validation & Sizing Section -->\r\n <!-- Min/Max Length - Side by side -->\r\n <div class=\"tw-col-span-2 tw-flex tw-gap-4\">\r\n <div class=\"tw-flex-1 tw-space-y-1\">\r\n <cide-ele-input\r\n id=\"sype_min_length\"\r\n type=\"number\"\r\n formControlName=\"sype_min_length\"\r\n placeholder=\"0\"\r\n label=\"Min Length\"\r\n size=\"xs\">\r\n </cide-ele-input>\r\n </div>\r\n <div class=\"tw-flex-1 tw-space-y-1\">\r\n <cide-ele-input\r\n id=\"sype_max_length\"\r\n type=\"number\"\r\n formControlName=\"sype_max_length\"\r\n placeholder=\"20\"\r\n label=\"Max Length\"\r\n size=\"xs\">\r\n </cide-ele-input>\r\n </div>\r\n </div>\r\n\r\n <!-- Size & Label Placement - Side by side -->\r\n <div class=\"tw-col-span-2 tw-flex tw-gap-4\">\r\n <div class=\"tw-flex-1 tw-space-y-1\">\r\n <cide-ele-select\r\n id=\"sype_size\"\r\n formControlName=\"sype_size\"\r\n label=\"Size\"\r\n size=\"xs\"\r\n [options]=\"[\r\n { value: 'xs', label: 'XS' },\r\n { value: 'sm', label: 'SM' },\r\n { value: 'md', label: 'MD' },\r\n { value: 'lg', label: 'LG' },\r\n { value: 'xl', label: 'XL' },\r\n { value: 'xxl', label: 'XXL' }\r\n ]\">\r\n </cide-ele-select>\r\n </div>\r\n <div class=\"tw-flex-1 tw-space-y-1\">\r\n <cide-ele-select\r\n id=\"sype_label_placement\"\r\n formControlName=\"sype_label_placement\"\r\n label=\"Label Placement\"\r\n size=\"xs\"\r\n [options]=\"[\r\n { value: 'left', label: 'Left' },\r\n { value: 'floating', label: 'Floating' },\r\n { value: 'fixed', label: 'Fixed' }\r\n ]\">\r\n </cide-ele-select>\r\n </div>\r\n </div>\r\n\r\n <!-- Width & Height - Side by side -->\r\n <div class=\"tw-col-span-2 tw-flex tw-gap-4\">\r\n <div class=\"tw-flex-1 tw-space-y-1\">\r\n <cide-ele-input\r\n id=\"sype_width\"\r\n type=\"text\"\r\n formControlName=\"sype_width\"\r\n placeholder=\"20px\"\r\n label=\"Width\"\r\n size=\"xs\">\r\n </cide-ele-input>\r\n </div>\r\n <div class=\"tw-flex-1 tw-space-y-1\">\r\n <cide-ele-input\r\n id=\"sype_height\"\r\n type=\"text\"\r\n formControlName=\"sype_height\"\r\n placeholder=\"20px\"\r\n label=\"Height\"\r\n size=\"xs\">\r\n </cide-ele-input>\r\n </div>\r\n </div>\r\n\r\n <!-- Leading Icon -->\r\n <div class=\"tw-space-y-1\">\r\n <cide-ele-input\r\n id=\"sype_leading_icon\"\r\n formControlName=\"sype_leading_icon\"\r\n placeholder=\"Enter icon name\"\r\n label=\"Leading Icon\"\r\n size=\"sm\">\r\n </cide-ele-input>\r\n </div>\r\n\r\n <!-- Default Value -->\r\n <div class=\"tw-space-y-1\">\r\n <cide-ele-input\r\n id=\"sype_default\"\r\n formControlName=\"sype_default\"\r\n placeholder=\"Enter default value\"\r\n label=\"Default Value\"\r\n size=\"sm\">\r\n </cide-ele-input>\r\n </div>\r\n\r\n <!-- Regex Pattern -->\r\n <div class=\"tw-space-y-1\">\r\n <cide-ele-input\r\n id=\"sype_regex\"\r\n formControlName=\"sype_regex\"\r\n placeholder=\"Enter regex pattern\"\r\n label=\"Regex Pattern\"\r\n size=\"sm\">\r\n </cide-ele-input>\r\n </div>\r\n\r\n <!-- Option Key -->\r\n <div class=\"tw-space-y-1\">\r\n <cide-ele-input\r\n id=\"sype_option_key\"\r\n formControlName=\"sype_option_key\"\r\n placeholder=\"Enter option key\"\r\n label=\"Option Key\"\r\n size=\"sm\">\r\n </cide-ele-input>\r\n </div>\r\n\r\n <!-- Entity ID (Auto-assigned from AppState) - Hidden -->\r\n <div class=\"tw-space-y-1\" style=\"display: none;\">\r\n <cide-ele-input\r\n id=\"sype_entity_id_syen\"\r\n formControlName=\"sype_entity_id_syen\"\r\n placeholder=\"Auto-assigned from system\"\r\n label=\"Entity ID (Auto-assigned)\"\r\n size=\"sm\"\r\n readonly>\r\n </cide-ele-input>\r\n </div>\r\n\r\n <!-- Control Options -->\r\n <div class=\"tw-col-span-2 tw-space-y-1\">\r\n <h6 class=\"tw-text-sm tw-font-medium tw-text-gray-900 tw-mb-3\">Control Options</h6>\r\n <div class=\"tw-grid tw-grid-cols-1 sm:tw-grid-cols-2 lg:tw-grid-cols-3 tw-gap-3\">\r\n \r\n <!-- Required -->\r\n <div class=\"tw-flex tw-items-center tw-space-x-2\">\r\n <cide-ele-input\r\n id=\"sype_required\"\r\n type=\"checkbox\"\r\n formControlName=\"sype_required\"\r\n label=\"Required\"\r\n size=\"xs\">\r\n </cide-ele-input>\r\n </div>\r\n\r\n <!-- Disabled -->\r\n <div class=\"tw-flex tw-items-center tw-space-x-2\">\r\n <cide-ele-input\r\n id=\"sype_disabled\"\r\n type=\"checkbox\"\r\n formControlName=\"sype_disabled\"\r\n label=\"Disabled\"\r\n size=\"xs\">\r\n </cide-ele-input>\r\n </div>\r\n\r\n <!-- Hide Label -->\r\n <div class=\"tw-flex tw-items-center tw-space-x-2\">\r\n <cide-ele-input\r\n id=\"sype_label_hide\"\r\n type=\"checkbox\"\r\n formControlName=\"sype_label_hide\"\r\n label=\"Hide Label\"\r\n size=\"xs\">\r\n </cide-ele-input>\r\n </div>\r\n\r\n <!-- Hide Helper Text -->\r\n <div class=\"tw-flex tw-items-center tw-space-x-2\">\r\n <cide-ele-input\r\n id=\"sype_hide_helper_and_error_text\"\r\n type=\"checkbox\"\r\n formControlName=\"sype_hide_helper_and_error_text\"\r\n label=\"Hide Helper Text\"\r\n size=\"xs\">\r\n </cide-ele-input>\r\n </div>\r\n\r\n <!-- Helper Text Collapse -->\r\n <div class=\"tw-flex tw-items-center tw-space-x-2\">\r\n <cide-ele-input\r\n id=\"sype_helper_text_collapse\"\r\n type=\"checkbox\"\r\n formControlName=\"sype_helper_text_collapse\"\r\n label=\"Collapse Helper\"\r\n size=\"xs\">\r\n </cide-ele-input>\r\n </div>\r\n\r\n </div>\r\n </div>\r\n\r\n </div>\r\n\r\n <!-- Form Actions -->\r\n <div class=\"tw-flex tw-justify-between tw-items-center tw-pt-4 tw-border-t tw-border-gray-200 tw-mt-auto\">\r\n <!-- Error Message (Left Side) -->\r\n <cide-form-field-error [formGroup]=\"controlForm\"></cide-form-field-error>\r\n \r\n <!-- Action Buttons (Right Side) -->\r\n <div class=\"tw-flex tw-gap-3\">\r\n <button \r\n cideEleButton\r\n type=\"button\"\r\n variant=\"outline\"\r\n (click)=\"cancelForm()\"\r\n [disabled]=\"loading()\">\r\n Cancel\r\n </button>\r\n <button \r\n cideEleButton\r\n type=\"submit\"\r\n variant=\"primary\"\r\n [disabled]=\"loading()\">\r\n {{ isEditMode() ? 'Update Control' : 'Create Control' }}\r\n </button>\r\n </div>\r\n </div>\r\n </form>\r\n </div>\r\n\r\n <!-- Controls List Section -->\r\n <div class=\"tw-w-full lg:tw-w-2/5 tw-bg-white tw-rounded-lg tw-border tw-border-gray-200 tw-shadow-sm tw-flex tw-flex-col lg:tw-max-h-none tw-max-h-96\">\r\n <div class=\"tw-p-6 tw-border-b tw-border-gray-200\">\r\n <h3 class=\"tw-text-lg tw-font-medium tw-text-gray-900 tw-mb-1\">Page Controls</h3>\r\n <p class=\"tw-text-sm tw-text-gray-500 tw-mb-0\">Controls connected to this page</p>\r\n </div>\r\n \r\n <div class=\"tw-flex-1 tw-overflow-y-auto tw-p-4\" *ngIf=\"!loading() && controls().length > 0\">\r\n <div \r\n class=\"tw-bg-gray-50 tw-border tw-border-gray-200 tw-rounded-lg tw-p-4 tw-mb-3 tw-cursor-pointer tw-transition-all tw-duration-200 hover:tw-shadow-md hover:tw-border-gray-300 focus:tw-outline-none focus:tw-ring-2 focus:tw-ring-blue-500 focus:tw-ring-offset-2\" \r\n *ngFor=\"let control of controls(); trackBy: trackByControlId\"\r\n [class.tw-bg-blue-50]=\"selectedControlId() === control._id\"\r\n [class.tw-border-blue-300]=\"selectedControlId() === control._id\"\r\n [class.tw-shadow-md]=\"selectedControlId() === control._id\"\r\n (click)=\"selectControl(control)\"\r\n (keyup.enter)=\"selectControl(control)\"\r\n (keyup.space)=\"selectControl(control)\"\r\n tabindex=\"0\"\r\n role=\"button\"\r\n [attr.aria-label]=\"'Select control ' + (control.sype_label || control.sype_key)\">\r\n <div class=\"tw-flex tw-items-start tw-space-x-3\">\r\n <div class=\"tw-flex-shrink-0 tw-w-10 tw-h-10 tw-bg-blue-100 tw-rounded-lg tw-flex tw-items-center tw-justify-center\">\r\n <cide-ele-icon class=\"tw-text-blue-600\">settings_input_component</cide-ele-icon>\r\n </div>\r\n <div class=\"tw-flex-1 tw-min-w-0\">\r\n <h4 class=\"tw-text-sm tw-font-medium tw-text-gray-900 tw-mb-1 tw-truncate\">{{ control.sype_label || control.sype_key }}</h4>\r\n <p class=\"tw-text-xs tw-text-gray-500 tw-mb-2 tw-truncate\">{{ control.sype_tooltip || 'No tooltip' }}</p>\r\n <div class=\"tw-flex tw-items-center tw-space-x-2\">\r\n <span class=\"tw-inline-flex tw-items-center tw-px-2 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium tw-bg-gray-100 tw-text-gray-800\">{{ control.sype_type }}</span>\r\n <span class=\"tw-inline-flex tw-items-center tw-px-2 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium\" \r\n [class.tw-bg-red-100]=\"!control.sype_isactive\"\r\n [class.tw-text-red-800]=\"!control.sype_isactive\"\r\n [class.tw-bg-green-100]=\"control.sype_isactive\"\r\n [class.tw-text-green-800]=\"control.sype_isactive\">\r\n {{ control.sype_isactive ? 'Active' : 'Inactive' }}\r\n </span>\r\n </div>\r\n </div>\r\n <div class=\"tw-flex tw-items-center tw-space-x-1 tw-opacity-0 tw-transition-opacity tw-duration-200 group-hover:tw-opacity-100\" \r\n [class.tw-opacity-100]=\"selectedControlId() === control._id\">\r\n <button \r\n cideEleButton\r\n variant=\"ghost\"\r\n size=\"sm\"\r\n (click)=\"editControl(control); $event.stopPropagation()\">\r\n <cide-ele-icon>edit</cide-ele-icon>\r\n </button>\r\n <button \r\n cideEleButton\r\n variant=\"ghost\"\r\n size=\"sm\"\r\n (click)=\"deleteControl(control); $event.stopPropagation()\">\r\n <cide-ele-icon>delete</cide-ele-icon>\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"tw-flex tw-flex-col tw-items-center tw-justify-center tw-py-12 tw-text-center\" *ngIf=\"!loading() && controls().length === 0\">\r\n <cide-ele-icon class=\"tw-text-4xl tw-text-gray-300 tw-mb-4\">settings_input_component</cide-ele-icon>\r\n <p class=\"tw-text-gray-500 tw-font-medium tw-mb-1\">No controls available</p>\r\n <small class=\"tw-text-gray-400\">Create controls using the form on the left</small>\r\n </div>\r\n\r\n <div class=\"tw-flex tw-flex-col tw-items-center tw-justify-center tw-py-12 tw-text-center\" *ngIf=\"loading()\">\r\n <cide-ele-icon class=\"tw-text-2xl tw-text-blue-500 tw-mb-4 tw-animate-spin\">refresh</cide-ele-icon>\r\n <p class=\"tw-text-gray-500\">Loading controls...</p>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n ", styles: [".checkbox-field{margin:.25rem 0}.checkbox-label{display:flex;flex-direction:column;gap:.25rem;cursor:pointer;padding:.75rem 0;background:transparent;border:none;border-radius:0;transition:all .2s ease}.checkbox-label:hover{background:#667eea05}.checkbox-label .checkbox-input{width:1rem;height:1rem;accent-color:#667eea;border-radius:3px;margin-bottom:.125rem}.checkbox-label .checkbox-text{font-weight:600;color:#374151;font-size:.875rem}.checkbox-label .checkbox-description{font-size:.75rem;color:#6b7280;margin-top:.125rem}@media (max-width: 640px){.main-content{padding:1rem;gap:1rem}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "component", type: CideEleButtonComponent, selector: "button[cideEleButton], a[cideEleButton], cide-ele-button", inputs: ["label", "variant", "size", "type", "shape", "elevation", "disabled", "id", "loading", "fullWidth", "leftIcon", "rightIcon", "customClass", "tooltip", "ariaLabel", "testId", "routerLink", "routerExtras", "preventDoubleClick", "animated"], outputs: ["btnClick", "doubleClick"] }, { kind: "component", type: CideInputComponent, selector: "cide-ele-input", inputs: ["fill", "label", "labelHide", "disabled", "clearInput", "labelPlacement", "labelDir", "placeholder", "leadingIcon", "trailingIcon", "helperText", "helperTextCollapse", "hideHelperAndErrorText", "errorText", "maxlength", "minlength", "required", "autocapitalize", "autocomplete", "type", "width", "id", "ngModel", "option", "min", "max", "step", "size"], outputs: ["ngModelChange"] }, { kind: "component", type: CideSelectComponent, selector: "cide-ele-select", inputs: ["label", "labelHide", "placeholder", "helperText", "errorText", "required", "disabled", "id", "ngModel", "size", "fill", "labelPlacement", "labelDir", "leadingIcon", "trailingIcon", "clearInput", "options", "multiple", "searchable", "showSearchInput", "loading", "valueKey", "labelKey", "treeView"], outputs: ["ngModelChange", "change", "searchChange"] }, { kind: "component", type: CideIconComponent, selector: "cide-ele-icon", inputs: ["size", "type", "toolTip"] }, { kind: "component", type: CideFormFieldErrorComponent, selector: "cide-form-field-error", inputs: ["control", "formGroup", "fieldName", "customMessages"] }] });
|
|
7872
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCorePageControlsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
7873
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: CideCorePageControlsComponent, isStandalone: true, selector: "cide-core-page-controls", ngImport: i0, template: "<!-- Page Controls Container -->\r\n<div class=\"tw-flex tw-flex-col tw-h-full tw-bg-gray-50\">\r\n <!-- Header Section -->\r\n <div class=\"tw-bg-white tw-border-b tw-border-gray-200 tw-px-6 tw-py-4\">\r\n <div class=\"tw-flex tw-items-center tw-justify-between\">\r\n <div class=\"tw-flex tw-items-center tw-space-x-4\">\r\n <button \r\n cideEleButton\r\n variant=\"ghost\"\r\n size=\"sm\"\r\n (click)=\"goBack()\"\r\n class=\"tw-flex tw-items-center tw-justify-center tw-w-8 tw-h-8 tw-text-gray-600 hover:tw-text-gray-900 hover:tw-bg-gray-100 tw-rounded-md tw-transition-colors\">\r\n <cide-ele-icon>arrow_back</cide-ele-icon>\r\n </button>\r\n <div class=\"tw-flex tw-items-center tw-space-x-3\">\r\n <cide-ele-icon class=\"tw-text-blue-600 tw-text-xl\">settings</cide-ele-icon>\r\n <div>\r\n <h1 class=\"tw-text-xl tw-font-semibold tw-text-gray-900 tw-mb-0\">Control Management</h1>\r\n <p class=\"tw-text-sm tw-text-gray-500 tw-mb-0\">Page: {{ pageTitle() }}</p>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <!-- Error Message -->\r\n <div class=\"tw-bg-red-50 tw-border tw-border-red-200 tw-rounded-md tw-p-4 tw-mx-6 tw-mt-4 tw-flex tw-items-start tw-space-x-3\" *ngIf=\"error()\">\r\n <cide-ele-icon class=\"tw-text-red-500 tw-flex-shrink-0 tw-mt-0.5\">error</cide-ele-icon>\r\n <div>\r\n <h3 class=\"tw-text-red-800 tw-font-medium tw-mb-1\">Error</h3>\r\n <p class=\"tw-text-red-700 tw-text-sm tw-mb-0\">{{ error() }}</p>\r\n </div>\r\n </div>\r\n\r\n <!-- Main Content Area -->\r\n <div class=\"tw-flex tw-flex-1 tw-gap-6 tw-p-6 tw-overflow-hidden lg:tw-flex-row tw-flex-col\">\r\n <!-- Form Section -->\r\n <div class=\"tw-w-full lg:tw-w-3/5 tw-bg-white tw-rounded-lg tw-border tw-border-gray-200 tw-shadow-sm tw-flex tw-flex-col\">\r\n <div class=\"tw-flex tw-items-center tw-space-x-3 tw-p-6 tw-border-b tw-border-gray-200\">\r\n <cide-ele-icon class=\"tw-text-blue-600\">{{ isEditMode() ? 'edit' : 'add' }}</cide-ele-icon>\r\n <h3 class=\"tw-text-lg tw-font-medium tw-text-gray-900 tw-mb-0\">{{ isEditMode() ? 'Edit Control' : 'Quick Add Control' }}</h3>\r\n </div>\r\n\r\n <!-- Form -->\r\n <form [formGroup]=\"controlForm\" (ngSubmit)=\"saveControl()\" class=\"tw-flex tw-flex-col tw-flex-1 tw-p-6 tw-overflow-y-auto\">\r\n <div class=\"tw-grid tw-grid-cols-1 lg:tw-grid-cols-2 tw-gap-4 tw-mb-6\">\r\n \r\n <!-- Basic Information Section -->\r\n <!-- Control Key -->\r\n <div class=\"tw-space-y-1\">\r\n <cide-ele-input\r\n id=\"sype_key\"\r\n formControlName=\"sype_key\"\r\n placeholder=\"Enter control key\"\r\n label=\"Control Key\"\r\n size=\"sm\">\r\n </cide-ele-input>\r\n </div>\r\n\r\n <!-- Control Label -->\r\n <div class=\"tw-space-y-1\">\r\n <cide-ele-input\r\n id=\"sype_label\"\r\n formControlName=\"sype_label\"\r\n placeholder=\"Enter control label\"\r\n label=\"Control Label\"\r\n size=\"sm\">\r\n </cide-ele-input>\r\n </div>\r\n\r\n <!-- Control Type -->\r\n <div class=\"tw-space-y-1\">\r\n <cide-ele-select\r\n id=\"sype_type\"\r\n formControlName=\"sype_type\"\r\n [options]=\"[\r\n { value: 'text', label: 'Text Input' },\r\n { value: 'textarea', label: 'Text Area' },\r\n { value: 'select', label: 'Select' },\r\n { value: 'checkbox', label: 'Checkbox' },\r\n { value: 'radio', label: 'Radio' },\r\n { value: 'date', label: 'Date' },\r\n { value: 'number', label: 'Number' },\r\n { value: 'email', label: 'Email' },\r\n { value: 'password', label: 'Password' },\r\n { value: 'file', label: 'File Upload' }\r\n ]\"\r\n label=\"Control Type\"\r\n size=\"sm\">\r\n </cide-ele-select>\r\n </div>\r\n\r\n <!-- Status - Checkbox aligned properly -->\r\n <div class=\"tw-space-y-1\">\r\n <cide-ele-input\r\n id=\"sype_isactive\"\r\n type=\"checkbox\"\r\n formControlName=\"sype_isactive\"\r\n label=\"Active Status\"\r\n size=\"sm\">\r\n </cide-ele-input>\r\n </div>\r\n\r\n <!-- Placeholder -->\r\n <div class=\"tw-space-y-1\">\r\n <cide-ele-input\r\n id=\"sype_placeholder\"\r\n formControlName=\"sype_placeholder\"\r\n placeholder=\"Enter placeholder text\"\r\n label=\"Placeholder\"\r\n size=\"sm\">\r\n </cide-ele-input>\r\n </div>\r\n\r\n <!-- Auto Complete - Checkbox aligned properly -->\r\n <div class=\"tw-space-y-1\">\r\n <cide-ele-input\r\n id=\"sype_auto_complete\"\r\n type=\"checkbox\"\r\n formControlName=\"sype_auto_complete\"\r\n label=\"Auto Complete\"\r\n size=\"sm\">\r\n </cide-ele-input>\r\n </div>\r\n\r\n <!-- Tooltip -->\r\n <div class=\"tw-space-y-1\">\r\n <cide-ele-input\r\n id=\"sype_tooltip\"\r\n formControlName=\"sype_tooltip\"\r\n placeholder=\"Enter tooltip text\"\r\n label=\"Tooltip\"\r\n size=\"sm\">\r\n </cide-ele-input>\r\n </div>\r\n\r\n <!-- Validation & Sizing Section -->\r\n <!-- Min/Max Length - Side by side -->\r\n <div class=\"tw-col-span-2 tw-flex tw-gap-4\">\r\n <div class=\"tw-flex-1 tw-space-y-1\">\r\n <cide-ele-input\r\n id=\"sype_min_length\"\r\n type=\"number\"\r\n formControlName=\"sype_min_length\"\r\n placeholder=\"0\"\r\n label=\"Min Length\"\r\n size=\"xs\">\r\n </cide-ele-input>\r\n </div>\r\n <div class=\"tw-flex-1 tw-space-y-1\">\r\n <cide-ele-input\r\n id=\"sype_max_length\"\r\n type=\"number\"\r\n formControlName=\"sype_max_length\"\r\n placeholder=\"20\"\r\n label=\"Max Length\"\r\n size=\"xs\">\r\n </cide-ele-input>\r\n </div>\r\n </div>\r\n\r\n <!-- Size & Label Placement - Side by side -->\r\n <div class=\"tw-col-span-2 tw-flex tw-gap-4\">\r\n <div class=\"tw-flex-1 tw-space-y-1\">\r\n <cide-ele-select\r\n id=\"sype_size\"\r\n formControlName=\"sype_size\"\r\n label=\"Size\"\r\n size=\"xs\"\r\n [options]=\"[\r\n { value: 'xs', label: 'XS' },\r\n { value: 'sm', label: 'SM' },\r\n { value: 'md', label: 'MD' },\r\n { value: 'lg', label: 'LG' },\r\n { value: 'xl', label: 'XL' },\r\n { value: 'xxl', label: 'XXL' }\r\n ]\">\r\n </cide-ele-select>\r\n </div>\r\n <div class=\"tw-flex-1 tw-space-y-1\">\r\n <cide-ele-select\r\n id=\"sype_label_placement\"\r\n formControlName=\"sype_label_placement\"\r\n label=\"Label Placement\"\r\n size=\"xs\"\r\n [options]=\"[\r\n { value: 'left', label: 'Left' },\r\n { value: 'floating', label: 'Floating' },\r\n { value: 'fixed', label: 'Fixed' }\r\n ]\">\r\n </cide-ele-select>\r\n </div>\r\n </div>\r\n\r\n <!-- Width & Height - Side by side -->\r\n <div class=\"tw-col-span-2 tw-flex tw-gap-4\">\r\n <div class=\"tw-flex-1 tw-space-y-1\">\r\n <cide-ele-input\r\n id=\"sype_width\"\r\n type=\"text\"\r\n formControlName=\"sype_width\"\r\n placeholder=\"20px\"\r\n label=\"Width\"\r\n size=\"xs\">\r\n </cide-ele-input>\r\n </div>\r\n <div class=\"tw-flex-1 tw-space-y-1\">\r\n <cide-ele-input\r\n id=\"sype_height\"\r\n type=\"text\"\r\n formControlName=\"sype_height\"\r\n placeholder=\"20px\"\r\n label=\"Height\"\r\n size=\"xs\">\r\n </cide-ele-input>\r\n </div>\r\n </div>\r\n\r\n <!-- Leading Icon -->\r\n <div class=\"tw-space-y-1\">\r\n <cide-ele-input\r\n id=\"sype_leading_icon\"\r\n formControlName=\"sype_leading_icon\"\r\n placeholder=\"Enter icon name\"\r\n label=\"Leading Icon\"\r\n size=\"sm\">\r\n </cide-ele-input>\r\n </div>\r\n\r\n <!-- Default Value -->\r\n <div class=\"tw-space-y-1\">\r\n <cide-ele-input\r\n id=\"sype_default\"\r\n formControlName=\"sype_default\"\r\n placeholder=\"Enter default value\"\r\n label=\"Default Value\"\r\n size=\"sm\">\r\n </cide-ele-input>\r\n </div>\r\n\r\n <!-- Regex Pattern -->\r\n <div class=\"tw-space-y-1\">\r\n <cide-ele-input\r\n id=\"sype_regex\"\r\n formControlName=\"sype_regex\"\r\n placeholder=\"Enter regex pattern\"\r\n label=\"Regex Pattern\"\r\n size=\"sm\">\r\n </cide-ele-input>\r\n </div>\r\n\r\n <!-- Option Key -->\r\n <div class=\"tw-space-y-1\">\r\n <cide-ele-input\r\n id=\"sype_option_key\"\r\n formControlName=\"sype_option_key\"\r\n placeholder=\"Enter option key\"\r\n label=\"Option Key\"\r\n size=\"sm\">\r\n </cide-ele-input>\r\n </div>\r\n\r\n <!-- Entity ID (Auto-assigned from AppState) - Hidden -->\r\n <div class=\"tw-space-y-1\" style=\"display: none;\">\r\n <cide-ele-input\r\n id=\"sype_entity_id_syen\"\r\n formControlName=\"sype_entity_id_syen\"\r\n placeholder=\"Auto-assigned from system\"\r\n label=\"Entity ID (Auto-assigned)\"\r\n size=\"sm\"\r\n readonly>\r\n </cide-ele-input>\r\n </div>\r\n\r\n <!-- Control Options -->\r\n <div class=\"tw-col-span-2 tw-space-y-1\">\r\n <h6 class=\"tw-text-sm tw-font-medium tw-text-gray-900 tw-mb-3\">Control Options</h6>\r\n <div class=\"tw-grid tw-grid-cols-1 sm:tw-grid-cols-2 lg:tw-grid-cols-3 tw-gap-3\">\r\n \r\n <!-- Required -->\r\n <div class=\"tw-flex tw-items-center tw-space-x-2\">\r\n <cide-ele-input\r\n id=\"sype_required\"\r\n type=\"checkbox\"\r\n formControlName=\"sype_required\"\r\n label=\"Required\"\r\n size=\"xs\">\r\n </cide-ele-input>\r\n </div>\r\n\r\n <!-- Disabled -->\r\n <div class=\"tw-flex tw-items-center tw-space-x-2\">\r\n <cide-ele-input\r\n id=\"sype_disabled\"\r\n type=\"checkbox\"\r\n formControlName=\"sype_disabled\"\r\n label=\"Disabled\"\r\n size=\"xs\">\r\n </cide-ele-input>\r\n </div>\r\n\r\n <!-- Hide Label -->\r\n <div class=\"tw-flex tw-items-center tw-space-x-2\">\r\n <cide-ele-input\r\n id=\"sype_label_hide\"\r\n type=\"checkbox\"\r\n formControlName=\"sype_label_hide\"\r\n label=\"Hide Label\"\r\n size=\"xs\">\r\n </cide-ele-input>\r\n </div>\r\n\r\n <!-- Hide Helper Text -->\r\n <div class=\"tw-flex tw-items-center tw-space-x-2\">\r\n <cide-ele-input\r\n id=\"sype_hide_helper_and_error_text\"\r\n type=\"checkbox\"\r\n formControlName=\"sype_hide_helper_and_error_text\"\r\n label=\"Hide Helper Text\"\r\n size=\"xs\">\r\n </cide-ele-input>\r\n </div>\r\n\r\n <!-- Helper Text Collapse -->\r\n <div class=\"tw-flex tw-items-center tw-space-x-2\">\r\n <cide-ele-input\r\n id=\"sype_helper_text_collapse\"\r\n type=\"checkbox\"\r\n formControlName=\"sype_helper_text_collapse\"\r\n label=\"Collapse Helper\"\r\n size=\"xs\">\r\n </cide-ele-input>\r\n </div>\r\n\r\n </div>\r\n </div>\r\n\r\n </div>\r\n\r\n <!-- Form Actions -->\r\n <div class=\"tw-flex tw-justify-between tw-items-center tw-pt-4 tw-border-t tw-border-gray-200 tw-mt-auto\">\r\n <!-- Error Message (Left Side) -->\r\n <cide-form-field-error [formGroup]=\"controlForm\"></cide-form-field-error>\r\n \r\n <!-- Action Buttons (Right Side) -->\r\n <div class=\"tw-flex tw-gap-3\">\r\n <button \r\n cideEleButton\r\n type=\"button\"\r\n variant=\"outline\"\r\n (click)=\"cancelForm()\"\r\n [disabled]=\"loading()\">\r\n Cancel\r\n </button>\r\n <button \r\n cideEleButton\r\n type=\"submit\"\r\n variant=\"primary\"\r\n [disabled]=\"loading()\">\r\n {{ isEditMode() ? 'Update Control' : 'Create Control' }}\r\n </button>\r\n </div>\r\n </div>\r\n </form>\r\n </div>\r\n\r\n <!-- Controls List Section -->\r\n <div class=\"tw-w-full lg:tw-w-2/5 tw-bg-white tw-rounded-lg tw-border tw-border-gray-200 tw-shadow-sm tw-flex tw-flex-col lg:tw-max-h-none tw-max-h-96\">\r\n <div class=\"tw-p-6 tw-border-b tw-border-gray-200\">\r\n <h3 class=\"tw-text-lg tw-font-medium tw-text-gray-900 tw-mb-1\">Page Controls</h3>\r\n <p class=\"tw-text-sm tw-text-gray-500 tw-mb-0\">Controls connected to this page</p>\r\n </div>\r\n \r\n <div class=\"tw-flex-1 tw-overflow-y-auto tw-p-4\" *ngIf=\"!loading() && controls().length > 0\">\r\n <div \r\n class=\"tw-bg-gray-50 tw-border tw-border-gray-200 tw-rounded-lg tw-p-4 tw-mb-3 tw-cursor-pointer tw-transition-all tw-duration-200 hover:tw-shadow-md hover:tw-border-gray-300 focus:tw-outline-none focus:tw-ring-2 focus:tw-ring-blue-500 focus:tw-ring-offset-2\" \r\n *ngFor=\"let control of controls(); trackBy: trackByControlId\"\r\n [class.tw-bg-blue-50]=\"selectedControlId() === control._id\"\r\n [class.tw-border-blue-300]=\"selectedControlId() === control._id\"\r\n [class.tw-shadow-md]=\"selectedControlId() === control._id\"\r\n (click)=\"selectControl(control)\"\r\n (keyup.enter)=\"selectControl(control)\"\r\n (keyup.space)=\"selectControl(control)\"\r\n tabindex=\"0\"\r\n role=\"button\"\r\n [attr.aria-label]=\"'Select control ' + (control.sype_label || control.sype_key)\">\r\n <div class=\"tw-flex tw-items-start tw-space-x-3\">\r\n <div class=\"tw-flex-shrink-0 tw-w-10 tw-h-10 tw-bg-blue-100 tw-rounded-lg tw-flex tw-items-center tw-justify-center\">\r\n <cide-ele-icon class=\"tw-text-blue-600\">settings_input_component</cide-ele-icon>\r\n </div>\r\n <div class=\"tw-flex-1 tw-min-w-0\">\r\n <h4 class=\"tw-text-sm tw-font-medium tw-text-gray-900 tw-mb-1 tw-truncate\">{{ control.sype_label || control.sype_key }}</h4>\r\n <p class=\"tw-text-xs tw-text-gray-500 tw-mb-2 tw-truncate\">{{ control.sype_tooltip || 'No tooltip' }}</p>\r\n <div class=\"tw-flex tw-items-center tw-space-x-2\">\r\n <span class=\"tw-inline-flex tw-items-center tw-px-2 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium tw-bg-gray-100 tw-text-gray-800\">{{ control.sype_type }}</span>\r\n <span class=\"tw-inline-flex tw-items-center tw-px-2 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium\" \r\n [class.tw-bg-red-100]=\"!control.sype_isactive\"\r\n [class.tw-text-red-800]=\"!control.sype_isactive\"\r\n [class.tw-bg-green-100]=\"control.sype_isactive\"\r\n [class.tw-text-green-800]=\"control.sype_isactive\">\r\n {{ control.sype_isactive ? 'Active' : 'Inactive' }}\r\n </span>\r\n </div>\r\n </div>\r\n <div class=\"tw-flex tw-items-center tw-space-x-1 tw-opacity-0 tw-transition-opacity tw-duration-200 group-hover:tw-opacity-100\" \r\n [class.tw-opacity-100]=\"selectedControlId() === control._id\">\r\n <button \r\n cideEleButton\r\n variant=\"ghost\"\r\n size=\"sm\"\r\n (click)=\"editControl(control); $event.stopPropagation()\">\r\n <cide-ele-icon>edit</cide-ele-icon>\r\n </button>\r\n <button \r\n cideEleButton\r\n variant=\"ghost\"\r\n size=\"sm\"\r\n (click)=\"deleteControl(control); $event.stopPropagation()\">\r\n <cide-ele-icon>delete</cide-ele-icon>\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"tw-flex tw-flex-col tw-items-center tw-justify-center tw-py-12 tw-text-center\" *ngIf=\"!loading() && controls().length === 0\">\r\n <cide-ele-icon class=\"tw-text-4xl tw-text-gray-300 tw-mb-4\">settings_input_component</cide-ele-icon>\r\n <p class=\"tw-text-gray-500 tw-font-medium tw-mb-1\">No controls available</p>\r\n <small class=\"tw-text-gray-400\">Create controls using the form on the left</small>\r\n </div>\r\n\r\n <div class=\"tw-flex tw-flex-col tw-items-center tw-justify-center tw-py-12 tw-text-center\" *ngIf=\"loading()\">\r\n <cide-ele-icon class=\"tw-text-2xl tw-text-blue-500 tw-mb-4 tw-animate-spin\">refresh</cide-ele-icon>\r\n <p class=\"tw-text-gray-500\">Loading controls...</p>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n ", styles: [".checkbox-field{margin:.25rem 0}.checkbox-label{display:flex;flex-direction:column;gap:.25rem;cursor:pointer;padding:.75rem 0;background:transparent;border:none;border-radius:0;transition:all .2s ease}.checkbox-label:hover{background:#667eea05}.checkbox-label .checkbox-input{width:1rem;height:1rem;accent-color:#667eea;border-radius:3px;margin-bottom:.125rem}.checkbox-label .checkbox-text{font-weight:600;color:#374151;font-size:.875rem}.checkbox-label .checkbox-description{font-size:.75rem;color:#6b7280;margin-top:.125rem}@media (max-width: 640px){.main-content{padding:1rem;gap:1rem}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "component", type: CideEleButtonComponent, selector: "button[cideEleButton], a[cideEleButton], cide-ele-button", inputs: ["label", "variant", "size", "type", "shape", "elevation", "disabled", "id", "loading", "fullWidth", "leftIcon", "rightIcon", "customClass", "tooltip", "ariaLabel", "testId", "routerLink", "routerExtras", "preventDoubleClick", "animated"], outputs: ["btnClick", "doubleClick"] }, { kind: "component", type: CideInputComponent, selector: "cide-ele-input", inputs: ["fill", "label", "labelHide", "disabled", "clearInput", "labelPlacement", "labelDir", "placeholder", "leadingIcon", "trailingIcon", "helperText", "helperTextCollapse", "hideHelperAndErrorText", "errorText", "maxlength", "minlength", "required", "autocapitalize", "autocomplete", "type", "width", "id", "ngModel", "option", "min", "max", "step", "size"], outputs: ["ngModelChange"] }, { kind: "component", type: CideSelectComponent, selector: "cide-ele-select", inputs: ["label", "labelHide", "placeholder", "helperText", "errorText", "required", "disabled", "id", "ngModel", "size", "fill", "labelPlacement", "labelDir", "leadingIcon", "trailingIcon", "clearInput", "options", "multiple", "searchable", "showSearchInput", "loading", "valueKey", "labelKey", "treeView"], outputs: ["ngModelChange", "change", "searchChange"] }, { kind: "component", type: CideIconComponent, selector: "cide-ele-icon", inputs: ["size", "type", "toolTip"] }, { kind: "component", type: CideFormFieldErrorComponent, selector: "cide-form-field-error", inputs: ["control", "formGroup", "fieldName", "customMessages"] }] });
|
|
7874
7874
|
}
|
|
7875
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
7875
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCorePageControlsComponent, decorators: [{
|
|
7876
7876
|
type: Component,
|
|
7877
7877
|
args: [{ selector: 'cide-core-page-controls', standalone: true, imports: [
|
|
7878
7878
|
CommonModule,
|
|
@@ -8018,10 +8018,10 @@ class CideCoreUserMasterService {
|
|
|
8018
8018
|
return throwError(() => error);
|
|
8019
8019
|
}));
|
|
8020
8020
|
}
|
|
8021
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
8022
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.
|
|
8021
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreUserMasterService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
8022
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreUserMasterService, providedIn: 'root' });
|
|
8023
8023
|
}
|
|
8024
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
8024
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreUserMasterService, decorators: [{
|
|
8025
8025
|
type: Injectable,
|
|
8026
8026
|
args: [{
|
|
8027
8027
|
providedIn: 'root'
|
|
@@ -8067,10 +8067,10 @@ class CideCoreRoleSelectService {
|
|
|
8067
8067
|
getAllRoles() {
|
|
8068
8068
|
return this.getRoleOptions();
|
|
8069
8069
|
}
|
|
8070
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
8071
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.
|
|
8070
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreRoleSelectService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
8071
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreRoleSelectService, providedIn: 'root' });
|
|
8072
8072
|
}
|
|
8073
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
8073
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreRoleSelectService, decorators: [{
|
|
8074
8074
|
type: Injectable,
|
|
8075
8075
|
args: [{
|
|
8076
8076
|
providedIn: 'root'
|
|
@@ -8156,10 +8156,21 @@ class CideCoreUserRoleService {
|
|
|
8156
8156
|
]);
|
|
8157
8157
|
return this.http.patch(url, payload);
|
|
8158
8158
|
}
|
|
8159
|
-
|
|
8160
|
-
|
|
8159
|
+
/**
|
|
8160
|
+
* Get roles by entity ID
|
|
8161
|
+
* @param entityId - Entity ID to filter roles
|
|
8162
|
+
* @returns Observable of user role list response
|
|
8163
|
+
*/
|
|
8164
|
+
getRolesByEntity(entityId) {
|
|
8165
|
+
return this.getUserRoleList({
|
|
8166
|
+
syusrol_role_entity_id_syen: entityId,
|
|
8167
|
+
syusrol_isactive: true
|
|
8168
|
+
});
|
|
8169
|
+
}
|
|
8170
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreUserRoleService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
8171
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreUserRoleService, providedIn: 'root' });
|
|
8161
8172
|
}
|
|
8162
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
8173
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreUserRoleService, decorators: [{
|
|
8163
8174
|
type: Injectable,
|
|
8164
8175
|
args: [{
|
|
8165
8176
|
providedIn: 'root'
|
|
@@ -8233,10 +8244,10 @@ class CideCoreEntityManagementService {
|
|
|
8233
8244
|
]);
|
|
8234
8245
|
return this.http.delete(url);
|
|
8235
8246
|
}
|
|
8236
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
8237
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.
|
|
8247
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreEntityManagementService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
8248
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreEntityManagementService, providedIn: 'root' });
|
|
8238
8249
|
}
|
|
8239
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
8250
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreEntityManagementService, decorators: [{
|
|
8240
8251
|
type: Injectable,
|
|
8241
8252
|
args: [{
|
|
8242
8253
|
providedIn: 'root'
|
|
@@ -8841,10 +8852,10 @@ class CideCoreGeneralMasterTypeComponent {
|
|
|
8841
8852
|
const event = new MouseEvent('click', { bubbles: true });
|
|
8842
8853
|
document.dispatchEvent(event);
|
|
8843
8854
|
}
|
|
8844
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
8845
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.7", type: CideCoreGeneralMasterTypeComponent, isStandalone: true, selector: "cide-core-general-master-type", viewQueries: [{ propertyName: "typeDetailsRendererTemplate", first: true, predicate: ["typeDetailsRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "typeStatusRendererTemplate", first: true, predicate: ["typeStatusRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "actionsDropdownRendererTemplate", first: true, predicate: ["actionsDropdownRendererTemplate"], descendants: true, isSignal: true }], ngImport: i0, template: "<!-- General Master Type Container -->\n<div class=\"tw-table tw-w-full tw-h-full\">\n\n <!-- Quick Add Form Section -->\n <div class=\"tw-table-row tw-h-0\">\n <div class=\"tw-table-cell tw-px-4 tw-py-3 tw-border-b tw-border-gray-200 tw-bg-white\">\n <div class=\"tw-flex tw-items-center tw-justify-between tw-mb-0\">\n <div class=\"tw-flex tw-items-center tw-space-x-3 tw-mb-3\">\n <cide-ele-icon class=\"tw-text-blue-600 tw-w-4 tw-h-4\">{{ isEditMode() ? 'edit' : 'add' }}</cide-ele-icon>\n <h6 class=\"tw-text-sm tw-font-medium tw-text-gray-900 tw-m-0\">{{ isEditMode() ? 'Edit Type' : 'General Master\n Type Management' }}</h6>\n </div>\n\n <!-- Parent Type Info (shown when adding child) -->\n @if (typeForm.get('sygmt_id_sygmt')?.value) {\n <div\n class=\"tw-flex tw-items-center tw-space-x-3 tw-bg-blue-50 tw-border tw-border-blue-200 tw-px-4 tw-py-1 tw-rounded-lg\">\n <cide-ele-icon class=\"tw-text-blue-600 tw-w-4 tw-h-4\">account_tree</cide-ele-icon>\n <div class=\"tw-flex tw-items-center tw-space-x-2\">\n <span class=\"tw-text-sm tw-text-blue-600 tw-font-medium\">{{ isEditMode() ? 'Parent:' : 'Creating child\n under:' }}</span>\n <span class=\"tw-text-sm tw-text-blue-800 tw-font-semibold\">{{ getParentTypeDisplay() }}</span>\n </div>\n <button cideEleButton variant=\"ghost\" size=\"xs\" type=\"button\" (click)=\"clearParentType()\"\n class=\"tw-text-blue-400 hover:tw-text-blue-600\">\n <svg class=\"tw-w-4 tw-h-4\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M6 18L18 6M6 6l12 12\" />\n </svg>\n </button>\n </div>\n }\n </div>\n\n <form [formGroup]=\"typeForm\" (ngSubmit)=\"onSubmit($event)\" class=\"tw-space-y-2 tw-relative\">\n <!-- Hidden field for parent type ID -->\n <input type=\"hidden\" formControlName=\"sygmt_id_sygmt\">\n\n <!-- First Row - Basic fields -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-6 tw-gap-2\">\n <!-- Type Code -->\n <div class=\"lg:tw-col-span-1\">\n <cide-ele-input formControlName=\"sygmt_code\" label=\"Type Code\" placeholder=\"Enter type code\" size=\"sm\"\n [maxlength]=\"40\">\n </cide-ele-input>\n </div>\n\n <!-- Type Title -->\n <div class=\"lg:tw-col-span-2\">\n <cide-ele-input formControlName=\"sygmt_title\" label=\"Type Title\" placeholder=\"Enter type title\" size=\"sm\"\n [maxlength]=\"100\">\n </cide-ele-input>\n </div>\n\n <!-- Active Status -->\n <div class=\"lg:tw-col-span-1 tw-flex tw-items-center tw-pt-0\">\n <cide-ele-input formControlName=\"sygmt_isactive\" type=\"checkbox\" label=\"Active\" size=\"sm\">\n </cide-ele-input>\n </div>\n </div>\n <!-- Second Row - JSON Configuration and Description/Save side by side -->\n <div class=\"tw-flex tw-gap-4\">\n <!-- JSON Configuration (60% width) -->\n <div class=\"tw-w-3/5\">\n <cide-ele-json-editor formControlName=\"sygmt_configuration\" label=\"Configuration\" size=\"sm\">\n </cide-ele-json-editor>\n </div>\n\n <!-- Description and Save Button (40% width) -->\n <div class=\"tw-w-2/5 tw-flex tw-flex-col tw-space-y-4\">\n <!-- Description -->\n <div class=\"tw-flex-1\">\n <cide-ele-textarea formControlName=\"sygmt_desc\" label=\"Description\" placeholder=\"Enter description\"\n size=\"sm\" [maxlength]=\"255\" [rows]=\"4\">\n </cide-ele-textarea>\n </div>\n\n <!-- Action Buttons -->\n <div class=\"tw-flex tw-justify-end tw-space-x-2\">\n <button cideEleButton variant=\"outline\" size=\"sm\" type=\"button\" (click)=\"cancelForm()\"\n [disabled]=\"loading()\" class=\"tw-px-4 tw-py-2\">\n Cancel\n </button>\n <button cideEleButton variant=\"primary\" size=\"sm\" type=\"submit\" [disabled]=\"loading()\"\n class=\"tw-px-4 tw-py-2\" [leftIcon]=\"isEditMode() ? 'edit' : 'add'\">\n {{ isEditMode() ? 'Update' : 'Save' }}\n </button>\n </div>\n </div>\n </div>\n </form>\n </div>\n </div>\n\n <!-- Header Section with Filters -->\n <div class=\"tw-table-row tw-h-0\">\n <div class=\"tw-table-cell tw-px-4 tw-border-b tw-border-gray-200 tw-bg-gray-50\">\n\n <!-- Error Message -->\n @if (error()) {\n <div class=\"tw-mt-3 tw-p-3 tw-bg-red-50 tw-border tw-border-red-200 tw-rounded-md\">\n <div class=\"tw-flex tw-items-start\">\n <cide-ele-icon name=\"error\" class=\"tw-text-red-400 tw-w-4 tw-h-4 tw-mt-0.5 tw-flex-shrink-0\"></cide-ele-icon>\n <div class=\"tw-ml-2\">\n <h3 class=\"tw-text-xs tw-font-medium tw-text-red-800 tw-m-0\">Error</h3>\n <p class=\"tw-text-xs tw-text-red-700 tw-mt-1 tw-m-0\">{{ error() }}</p>\n </div>\n </div>\n </div>\n }\n </div>\n </div>\n\n <!-- Main Content Area -->\n <div class=\"tw-table-row\">\n <div class=\"tw-table-cell tw-h-full tw-relative\">\n\n <!-- Data Grid Component -->\n <div class=\"tw-h-full tw-overflow-auto\">\n <cide-ele-data-grid [config]=\"gridConfig()\" [templateRenderers]=\"templateRenderers()\"\n (gridEvent)=\"onGridEvent($event)\">\n </cide-ele-data-grid>\n </div>\n\n </div>\n </div>\n\n</div>\n\n<!-- Template Renderers -->\n<ng-template #typeDetailsRendererTemplate let-row=\"row\">\n <div class=\"tw-flex tw-flex-col\">\n <div class=\"tw-font-medium tw-text-gray-900\">{{ row.sygmt_title || 'N/A' }}</div>\n <div class=\"tw-text-sm tw-text-gray-500 tw-truncate tw-max-w-xs\" title=\"{{ row.sygmt_desc || 'No description' }}\">{{\n row.sygmt_desc || 'No description' }}</div>\n </div>\n</ng-template>\n\n<ng-template #typeStatusRendererTemplate let-row=\"row\">\n <span class=\"tw-inline-flex tw-items-center tw-px-2.5 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium\"\n [class.tw-bg-green-100]=\"row.sygmt_isactive\" [class.tw-text-green-800]=\"row.sygmt_isactive\"\n [class.tw-bg-red-100]=\"!row.sygmt_isactive\" [class.tw-text-red-800]=\"!row.sygmt_isactive\">\n {{ row.sygmt_isactive ? 'Active' : 'Inactive' }}\n </span>\n</ng-template>\n\n\n\n<ng-template #actionsDropdownRendererTemplate let-row=\"row\">\n <cide-ele-dropdown [items]=\"getActionDropdownItems(row)\" [config]=\"getDropdownConfig()\"\n (itemClick)=\"onDropdownItemClick($event, row)\">\n </cide-ele-dropdown>\n</ng-template>", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "component", type: CideEleDataGridComponent, selector: "cide-ele-data-grid", inputs: ["config", "templateRenderers", "customFormatters", "actionHandlers", "serverSidePagination", "totalServerItems", "currentServerPage", "currentServerPageSize", "dragDropEnabled"], outputs: ["gridEvent"] }, { kind: "component", type: CideEleButtonComponent, selector: "button[cideEleButton], a[cideEleButton], cide-ele-button", inputs: ["label", "variant", "size", "type", "shape", "elevation", "disabled", "id", "loading", "fullWidth", "leftIcon", "rightIcon", "customClass", "tooltip", "ariaLabel", "testId", "routerLink", "routerExtras", "preventDoubleClick", "animated"], outputs: ["btnClick", "doubleClick"] }, { kind: "component", type: CideInputComponent, selector: "cide-ele-input", inputs: ["fill", "label", "labelHide", "disabled", "clearInput", "labelPlacement", "labelDir", "placeholder", "leadingIcon", "trailingIcon", "helperText", "helperTextCollapse", "hideHelperAndErrorText", "errorText", "maxlength", "minlength", "required", "autocapitalize", "autocomplete", "type", "width", "id", "ngModel", "option", "min", "max", "step", "size"], outputs: ["ngModelChange"] }, { kind: "component", type: CideTextareaComponent, selector: "cide-ele-textarea", inputs: ["label", "labelHide", "placeholder", "helperText", "errorText", "required", "disabled", "minlength", "maxlength", "rows", "id", "ngModel", "size", "fill", "labelPlacement", "labelDir", "leadingIcon", "trailingIcon", "clearInput"], outputs: ["ngModelChange"] }, { kind: "component", type: CideIconComponent, selector: "cide-ele-icon", inputs: ["size", "type", "toolTip"] }, { kind: "component", type: CideEleDropdownComponent, selector: "cide-ele-dropdown", inputs: ["items", "config", "triggerTemplate", "menuTemplate"], outputs: ["itemClick", "dropdownToggle"] }, { kind: "component", type: CideEleJsonEditorComponent, selector: "cide-ele-json-editor", inputs: ["label", "helperText", "required", "disabled", "showCharacterCount", "config"], outputs: ["valueChange", "objectChange", "errorsChange", "validChange"] }] });
|
|
8855
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreGeneralMasterTypeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
8856
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: CideCoreGeneralMasterTypeComponent, isStandalone: true, selector: "cide-core-general-master-type", viewQueries: [{ propertyName: "typeDetailsRendererTemplate", first: true, predicate: ["typeDetailsRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "typeStatusRendererTemplate", first: true, predicate: ["typeStatusRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "actionsDropdownRendererTemplate", first: true, predicate: ["actionsDropdownRendererTemplate"], descendants: true, isSignal: true }], ngImport: i0, template: "<!-- General Master Type Container -->\n<div class=\"tw-table tw-w-full tw-h-full\">\n\n <!-- Quick Add Form Section -->\n <div class=\"tw-table-row tw-h-0\">\n <div class=\"tw-table-cell tw-px-4 tw-py-3 tw-border-b tw-border-gray-200 tw-bg-white\">\n <div class=\"tw-flex tw-items-center tw-justify-between tw-mb-0\">\n <div class=\"tw-flex tw-items-center tw-space-x-3 tw-mb-3\">\n <cide-ele-icon class=\"tw-text-blue-600 tw-w-4 tw-h-4\">{{ isEditMode() ? 'edit' : 'add' }}</cide-ele-icon>\n <h6 class=\"tw-text-sm tw-font-medium tw-text-gray-900 tw-m-0\">{{ isEditMode() ? 'Edit Type' : 'General Master\n Type Management' }}</h6>\n </div>\n\n <!-- Parent Type Info (shown when adding child) -->\n @if (typeForm.get('sygmt_id_sygmt')?.value) {\n <div\n class=\"tw-flex tw-items-center tw-space-x-3 tw-bg-blue-50 tw-border tw-border-blue-200 tw-px-4 tw-py-1 tw-rounded-lg\">\n <cide-ele-icon class=\"tw-text-blue-600 tw-w-4 tw-h-4\">account_tree</cide-ele-icon>\n <div class=\"tw-flex tw-items-center tw-space-x-2\">\n <span class=\"tw-text-sm tw-text-blue-600 tw-font-medium\">{{ isEditMode() ? 'Parent:' : 'Creating child\n under:' }}</span>\n <span class=\"tw-text-sm tw-text-blue-800 tw-font-semibold\">{{ getParentTypeDisplay() }}</span>\n </div>\n <button cideEleButton variant=\"ghost\" size=\"xs\" type=\"button\" (click)=\"clearParentType()\"\n class=\"tw-text-blue-400 hover:tw-text-blue-600\">\n <svg class=\"tw-w-4 tw-h-4\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M6 18L18 6M6 6l12 12\" />\n </svg>\n </button>\n </div>\n }\n </div>\n\n <form [formGroup]=\"typeForm\" (ngSubmit)=\"onSubmit($event)\" class=\"tw-space-y-2 tw-relative\">\n <!-- Hidden field for parent type ID -->\n <input type=\"hidden\" formControlName=\"sygmt_id_sygmt\">\n\n <!-- First Row - Basic fields -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-6 tw-gap-2\">\n <!-- Type Code -->\n <div class=\"lg:tw-col-span-1\">\n <cide-ele-input formControlName=\"sygmt_code\" label=\"Type Code\" placeholder=\"Enter type code\" size=\"sm\"\n [maxlength]=\"40\">\n </cide-ele-input>\n </div>\n\n <!-- Type Title -->\n <div class=\"lg:tw-col-span-2\">\n <cide-ele-input formControlName=\"sygmt_title\" label=\"Type Title\" placeholder=\"Enter type title\" size=\"sm\"\n [maxlength]=\"100\">\n </cide-ele-input>\n </div>\n\n <!-- Active Status -->\n <div class=\"lg:tw-col-span-1 tw-flex tw-items-center tw-pt-0\">\n <cide-ele-input formControlName=\"sygmt_isactive\" type=\"checkbox\" label=\"Active\" size=\"sm\">\n </cide-ele-input>\n </div>\n </div>\n <!-- Second Row - JSON Configuration and Description/Save side by side -->\n <div class=\"tw-flex tw-gap-4\">\n <!-- JSON Configuration (60% width) -->\n <div class=\"tw-w-3/5\">\n <cide-ele-json-editor formControlName=\"sygmt_configuration\" label=\"Configuration\" size=\"sm\">\n </cide-ele-json-editor>\n </div>\n\n <!-- Description and Save Button (40% width) -->\n <div class=\"tw-w-2/5 tw-flex tw-flex-col tw-space-y-4\">\n <!-- Description -->\n <div class=\"tw-flex-1\">\n <cide-ele-textarea formControlName=\"sygmt_desc\" label=\"Description\" placeholder=\"Enter description\"\n size=\"sm\" [maxlength]=\"255\" [rows]=\"4\">\n </cide-ele-textarea>\n </div>\n\n <!-- Action Buttons -->\n <div class=\"tw-flex tw-justify-end tw-space-x-2\">\n <button cideEleButton variant=\"outline\" size=\"sm\" type=\"button\" (click)=\"cancelForm()\"\n [disabled]=\"loading()\" class=\"tw-px-4 tw-py-2\">\n Cancel\n </button>\n <button cideEleButton variant=\"primary\" size=\"sm\" type=\"submit\" [disabled]=\"loading()\"\n class=\"tw-px-4 tw-py-2\" [leftIcon]=\"isEditMode() ? 'edit' : 'add'\">\n {{ isEditMode() ? 'Update' : 'Save' }}\n </button>\n </div>\n </div>\n </div>\n </form>\n </div>\n </div>\n\n <!-- Header Section with Filters -->\n <div class=\"tw-table-row tw-h-0\">\n <div class=\"tw-table-cell tw-px-4 tw-border-b tw-border-gray-200 tw-bg-gray-50\">\n\n <!-- Error Message -->\n @if (error()) {\n <div class=\"tw-mt-3 tw-p-3 tw-bg-red-50 tw-border tw-border-red-200 tw-rounded-md\">\n <div class=\"tw-flex tw-items-start\">\n <cide-ele-icon name=\"error\" class=\"tw-text-red-400 tw-w-4 tw-h-4 tw-mt-0.5 tw-flex-shrink-0\"></cide-ele-icon>\n <div class=\"tw-ml-2\">\n <h3 class=\"tw-text-xs tw-font-medium tw-text-red-800 tw-m-0\">Error</h3>\n <p class=\"tw-text-xs tw-text-red-700 tw-mt-1 tw-m-0\">{{ error() }}</p>\n </div>\n </div>\n </div>\n }\n </div>\n </div>\n\n <!-- Main Content Area -->\n <div class=\"tw-table-row\">\n <div class=\"tw-table-cell tw-h-full tw-relative\">\n\n <!-- Data Grid Component -->\n <div class=\"tw-h-full tw-overflow-auto\">\n <cide-ele-data-grid [config]=\"gridConfig()\" [templateRenderers]=\"templateRenderers()\"\n (gridEvent)=\"onGridEvent($event)\">\n </cide-ele-data-grid>\n </div>\n\n </div>\n </div>\n\n</div>\n\n<!-- Template Renderers -->\n<ng-template #typeDetailsRendererTemplate let-row=\"row\">\n <div class=\"tw-flex tw-flex-col\">\n <div class=\"tw-font-medium tw-text-gray-900\">{{ row.sygmt_title || 'N/A' }}</div>\n <div class=\"tw-text-sm tw-text-gray-500 tw-truncate tw-max-w-xs\" title=\"{{ row.sygmt_desc || 'No description' }}\">{{\n row.sygmt_desc || 'No description' }}</div>\n </div>\n</ng-template>\n\n<ng-template #typeStatusRendererTemplate let-row=\"row\">\n <span class=\"tw-inline-flex tw-items-center tw-px-2.5 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium\"\n [class.tw-bg-green-100]=\"row.sygmt_isactive\" [class.tw-text-green-800]=\"row.sygmt_isactive\"\n [class.tw-bg-red-100]=\"!row.sygmt_isactive\" [class.tw-text-red-800]=\"!row.sygmt_isactive\">\n {{ row.sygmt_isactive ? 'Active' : 'Inactive' }}\n </span>\n</ng-template>\n\n\n\n<ng-template #actionsDropdownRendererTemplate let-row=\"row\">\n <cide-ele-dropdown [items]=\"getActionDropdownItems(row)\" [config]=\"getDropdownConfig()\"\n (itemClick)=\"onDropdownItemClick($event, row)\">\n </cide-ele-dropdown>\n</ng-template>", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "component", type: CideEleDataGridComponent, selector: "cide-ele-data-grid", inputs: ["config", "templateRenderers", "customFormatters", "actionHandlers", "serverSidePagination", "totalServerItems", "currentServerPage", "currentServerPageSize", "dragDropEnabled"], outputs: ["gridEvent"] }, { kind: "component", type: CideEleButtonComponent, selector: "button[cideEleButton], a[cideEleButton], cide-ele-button", inputs: ["label", "variant", "size", "type", "shape", "elevation", "disabled", "id", "loading", "fullWidth", "leftIcon", "rightIcon", "customClass", "tooltip", "ariaLabel", "testId", "routerLink", "routerExtras", "preventDoubleClick", "animated"], outputs: ["btnClick", "doubleClick"] }, { kind: "component", type: CideInputComponent, selector: "cide-ele-input", inputs: ["fill", "label", "labelHide", "disabled", "clearInput", "labelPlacement", "labelDir", "placeholder", "leadingIcon", "trailingIcon", "helperText", "helperTextCollapse", "hideHelperAndErrorText", "errorText", "maxlength", "minlength", "required", "autocapitalize", "autocomplete", "type", "width", "id", "ngModel", "option", "min", "max", "step", "size"], outputs: ["ngModelChange"] }, { kind: "component", type: CideTextareaComponent, selector: "cide-ele-textarea", inputs: ["label", "labelHide", "placeholder", "helperText", "errorText", "required", "disabled", "minlength", "maxlength", "rows", "id", "ngModel", "size", "fill", "labelPlacement", "labelDir", "leadingIcon", "trailingIcon", "clearInput"], outputs: ["ngModelChange"] }, { kind: "component", type: CideIconComponent, selector: "cide-ele-icon", inputs: ["size", "type", "toolTip"] }, { kind: "component", type: CideEleDropdownComponent, selector: "cide-ele-dropdown", inputs: ["items", "config", "triggerTemplate", "menuTemplate"], outputs: ["itemClick", "dropdownToggle"] }, { kind: "component", type: CideEleJsonEditorComponent, selector: "cide-ele-json-editor", inputs: ["label", "helperText", "required", "disabled", "showCharacterCount", "config"], outputs: ["valueChange", "objectChange", "errorsChange", "validChange"] }] });
|
|
8846
8857
|
}
|
|
8847
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
8858
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreGeneralMasterTypeComponent, decorators: [{
|
|
8848
8859
|
type: Component,
|
|
8849
8860
|
args: [{ selector: 'cide-core-general-master-type', standalone: true, imports: [
|
|
8850
8861
|
CommonModule,
|
|
@@ -8858,7 +8869,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImpor
|
|
|
8858
8869
|
CideEleDropdownComponent,
|
|
8859
8870
|
CideEleJsonEditorComponent
|
|
8860
8871
|
], template: "<!-- General Master Type Container -->\n<div class=\"tw-table tw-w-full tw-h-full\">\n\n <!-- Quick Add Form Section -->\n <div class=\"tw-table-row tw-h-0\">\n <div class=\"tw-table-cell tw-px-4 tw-py-3 tw-border-b tw-border-gray-200 tw-bg-white\">\n <div class=\"tw-flex tw-items-center tw-justify-between tw-mb-0\">\n <div class=\"tw-flex tw-items-center tw-space-x-3 tw-mb-3\">\n <cide-ele-icon class=\"tw-text-blue-600 tw-w-4 tw-h-4\">{{ isEditMode() ? 'edit' : 'add' }}</cide-ele-icon>\n <h6 class=\"tw-text-sm tw-font-medium tw-text-gray-900 tw-m-0\">{{ isEditMode() ? 'Edit Type' : 'General Master\n Type Management' }}</h6>\n </div>\n\n <!-- Parent Type Info (shown when adding child) -->\n @if (typeForm.get('sygmt_id_sygmt')?.value) {\n <div\n class=\"tw-flex tw-items-center tw-space-x-3 tw-bg-blue-50 tw-border tw-border-blue-200 tw-px-4 tw-py-1 tw-rounded-lg\">\n <cide-ele-icon class=\"tw-text-blue-600 tw-w-4 tw-h-4\">account_tree</cide-ele-icon>\n <div class=\"tw-flex tw-items-center tw-space-x-2\">\n <span class=\"tw-text-sm tw-text-blue-600 tw-font-medium\">{{ isEditMode() ? 'Parent:' : 'Creating child\n under:' }}</span>\n <span class=\"tw-text-sm tw-text-blue-800 tw-font-semibold\">{{ getParentTypeDisplay() }}</span>\n </div>\n <button cideEleButton variant=\"ghost\" size=\"xs\" type=\"button\" (click)=\"clearParentType()\"\n class=\"tw-text-blue-400 hover:tw-text-blue-600\">\n <svg class=\"tw-w-4 tw-h-4\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M6 18L18 6M6 6l12 12\" />\n </svg>\n </button>\n </div>\n }\n </div>\n\n <form [formGroup]=\"typeForm\" (ngSubmit)=\"onSubmit($event)\" class=\"tw-space-y-2 tw-relative\">\n <!-- Hidden field for parent type ID -->\n <input type=\"hidden\" formControlName=\"sygmt_id_sygmt\">\n\n <!-- First Row - Basic fields -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-6 tw-gap-2\">\n <!-- Type Code -->\n <div class=\"lg:tw-col-span-1\">\n <cide-ele-input formControlName=\"sygmt_code\" label=\"Type Code\" placeholder=\"Enter type code\" size=\"sm\"\n [maxlength]=\"40\">\n </cide-ele-input>\n </div>\n\n <!-- Type Title -->\n <div class=\"lg:tw-col-span-2\">\n <cide-ele-input formControlName=\"sygmt_title\" label=\"Type Title\" placeholder=\"Enter type title\" size=\"sm\"\n [maxlength]=\"100\">\n </cide-ele-input>\n </div>\n\n <!-- Active Status -->\n <div class=\"lg:tw-col-span-1 tw-flex tw-items-center tw-pt-0\">\n <cide-ele-input formControlName=\"sygmt_isactive\" type=\"checkbox\" label=\"Active\" size=\"sm\">\n </cide-ele-input>\n </div>\n </div>\n <!-- Second Row - JSON Configuration and Description/Save side by side -->\n <div class=\"tw-flex tw-gap-4\">\n <!-- JSON Configuration (60% width) -->\n <div class=\"tw-w-3/5\">\n <cide-ele-json-editor formControlName=\"sygmt_configuration\" label=\"Configuration\" size=\"sm\">\n </cide-ele-json-editor>\n </div>\n\n <!-- Description and Save Button (40% width) -->\n <div class=\"tw-w-2/5 tw-flex tw-flex-col tw-space-y-4\">\n <!-- Description -->\n <div class=\"tw-flex-1\">\n <cide-ele-textarea formControlName=\"sygmt_desc\" label=\"Description\" placeholder=\"Enter description\"\n size=\"sm\" [maxlength]=\"255\" [rows]=\"4\">\n </cide-ele-textarea>\n </div>\n\n <!-- Action Buttons -->\n <div class=\"tw-flex tw-justify-end tw-space-x-2\">\n <button cideEleButton variant=\"outline\" size=\"sm\" type=\"button\" (click)=\"cancelForm()\"\n [disabled]=\"loading()\" class=\"tw-px-4 tw-py-2\">\n Cancel\n </button>\n <button cideEleButton variant=\"primary\" size=\"sm\" type=\"submit\" [disabled]=\"loading()\"\n class=\"tw-px-4 tw-py-2\" [leftIcon]=\"isEditMode() ? 'edit' : 'add'\">\n {{ isEditMode() ? 'Update' : 'Save' }}\n </button>\n </div>\n </div>\n </div>\n </form>\n </div>\n </div>\n\n <!-- Header Section with Filters -->\n <div class=\"tw-table-row tw-h-0\">\n <div class=\"tw-table-cell tw-px-4 tw-border-b tw-border-gray-200 tw-bg-gray-50\">\n\n <!-- Error Message -->\n @if (error()) {\n <div class=\"tw-mt-3 tw-p-3 tw-bg-red-50 tw-border tw-border-red-200 tw-rounded-md\">\n <div class=\"tw-flex tw-items-start\">\n <cide-ele-icon name=\"error\" class=\"tw-text-red-400 tw-w-4 tw-h-4 tw-mt-0.5 tw-flex-shrink-0\"></cide-ele-icon>\n <div class=\"tw-ml-2\">\n <h3 class=\"tw-text-xs tw-font-medium tw-text-red-800 tw-m-0\">Error</h3>\n <p class=\"tw-text-xs tw-text-red-700 tw-mt-1 tw-m-0\">{{ error() }}</p>\n </div>\n </div>\n </div>\n }\n </div>\n </div>\n\n <!-- Main Content Area -->\n <div class=\"tw-table-row\">\n <div class=\"tw-table-cell tw-h-full tw-relative\">\n\n <!-- Data Grid Component -->\n <div class=\"tw-h-full tw-overflow-auto\">\n <cide-ele-data-grid [config]=\"gridConfig()\" [templateRenderers]=\"templateRenderers()\"\n (gridEvent)=\"onGridEvent($event)\">\n </cide-ele-data-grid>\n </div>\n\n </div>\n </div>\n\n</div>\n\n<!-- Template Renderers -->\n<ng-template #typeDetailsRendererTemplate let-row=\"row\">\n <div class=\"tw-flex tw-flex-col\">\n <div class=\"tw-font-medium tw-text-gray-900\">{{ row.sygmt_title || 'N/A' }}</div>\n <div class=\"tw-text-sm tw-text-gray-500 tw-truncate tw-max-w-xs\" title=\"{{ row.sygmt_desc || 'No description' }}\">{{\n row.sygmt_desc || 'No description' }}</div>\n </div>\n</ng-template>\n\n<ng-template #typeStatusRendererTemplate let-row=\"row\">\n <span class=\"tw-inline-flex tw-items-center tw-px-2.5 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium\"\n [class.tw-bg-green-100]=\"row.sygmt_isactive\" [class.tw-text-green-800]=\"row.sygmt_isactive\"\n [class.tw-bg-red-100]=\"!row.sygmt_isactive\" [class.tw-text-red-800]=\"!row.sygmt_isactive\">\n {{ row.sygmt_isactive ? 'Active' : 'Inactive' }}\n </span>\n</ng-template>\n\n\n\n<ng-template #actionsDropdownRendererTemplate let-row=\"row\">\n <cide-ele-dropdown [items]=\"getActionDropdownItems(row)\" [config]=\"getDropdownConfig()\"\n (itemClick)=\"onDropdownItemClick($event, row)\">\n </cide-ele-dropdown>\n</ng-template>" }]
|
|
8861
|
-
}] });
|
|
8872
|
+
}], propDecorators: { typeDetailsRendererTemplate: [{ type: i0.ViewChild, args: ['typeDetailsRendererTemplate', { isSignal: true }] }], typeStatusRendererTemplate: [{ type: i0.ViewChild, args: ['typeStatusRendererTemplate', { isSignal: true }] }], actionsDropdownRendererTemplate: [{ type: i0.ViewChild, args: ['actionsDropdownRendererTemplate', { isSignal: true }] }] } });
|
|
8862
8873
|
|
|
8863
8874
|
var generalMasterType_component = /*#__PURE__*/Object.freeze({
|
|
8864
8875
|
__proto__: null,
|
|
@@ -9685,10 +9696,10 @@ class CideCoreGeneralMasterComponent {
|
|
|
9685
9696
|
const event = new MouseEvent('click', { bubbles: true });
|
|
9686
9697
|
document.dispatchEvent(event);
|
|
9687
9698
|
}
|
|
9688
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
9689
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.7", type: CideCoreGeneralMasterComponent, isStandalone: true, selector: "cide-core-general-master", viewQueries: [{ propertyName: "masterDetailsRendererTemplate", first: true, predicate: ["masterDetailsRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "masterStatusRendererTemplate", first: true, predicate: ["masterStatusRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "actionsDropdownRendererTemplate", first: true, predicate: ["actionsDropdownRendererTemplate"], descendants: true, isSignal: true }], ngImport: i0, template: "<!-- General Master with Shared Wrapper -->\n<cide-lyt-shared-wrapper [shared_wrapper_setup_param]=\"{ sypg_page_code: 'core_general_master' }\">\n<div class=\"tw-table tw-w-full tw-h-full\">\n\n <!-- Quick Add Form Section -->\n <div class=\"tw-table-row tw-h-0\">\n <div class=\"tw-table-cell tw-px-4 tw-py-3 tw-border-b tw-border-gray-200 tw-bg-white\">\n <div class=\"tw-flex tw-items-center tw-justify-between tw-mb-0\">\n <div class=\"tw-flex tw-items-center tw-space-x-3 tw-mb-3\">\n <cide-ele-icon class=\"tw-text-blue-600 tw-w-4 tw-h-4\">{{ isEditMode() ? 'edit' : 'add' }}</cide-ele-icon>\n <div class=\"tw-flex tw-flex-col\">\n <h6 class=\"tw-text-sm tw-font-medium tw-text-gray-900 tw-m-0\">{{ isEditMode() ? 'Edit Master' : 'Quick Add Master' }}</h6>\n @if (typeTitle()) {\n <p class=\"tw-text-xs tw-text-gray-500 tw-m-0 tw-mt-0.5\">Type: <span class=\"tw-font-medium tw-text-gray-700\">{{ typeTitle() }}</span></p>\n }\n </div>\n </div>\n \n <!-- Parent Master Info Box -->\n @if (masterForm.get('sygms_id_sygms')?.value) {\n <div class=\"tw-flex tw-items-center tw-space-x-3 tw-bg-blue-50 tw-border tw-border-blue-200 tw-px-4 tw-py-1 tw-rounded-lg\">\n <cide-ele-icon class=\"tw-text-blue-600 tw-w-4 tw-h-4\">account_tree</cide-ele-icon>\n <span class=\"tw-text-sm tw-font-medium tw-text-blue-800\">Adding Child</span>\n <span class=\"tw-text-xs tw-text-blue-700\">\n Parent: <span class=\"tw-font-medium\">{{ getParentMasterDisplay() }}</span>\n </span>\n <button \n type=\"button\"\n (click)=\"clearParentMaster()\"\n class=\"tw-text-sm tw-text-blue-600 hover:tw-text-blue-800 hover:tw-bg-blue-100 tw-rounded tw-px-1\">\n \u00D7\n </button>\n </div>\n }\n </div>\n \n <form [formGroup]=\"masterForm\" class=\"tw-space-y-2\">\n \n <!-- First Row - Basic fields -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-6 tw-gap-2\">\n <!-- Master Code -->\n <div class=\"lg:tw-col-span-1\">\n <cide-ele-input \n formControlName=\"sygms_code\" \n label=\"Master Code\" \n placeholder=\"Enter master code\"\n size=\"sm\"\n [required]=\"true\" \n [maxlength]=\"40\">\n </cide-ele-input>\n </div>\n \n <!-- Master Title -->\n <div class=\"lg:tw-col-span-3\">\n <cide-ele-input \n formControlName=\"sygms_title\" \n label=\"Master Title\" \n placeholder=\"Enter master title\"\n size=\"sm\"\n [required]=\"true\" \n [maxlength]=\"150\">\n </cide-ele-input>\n </div>\n \n <!-- Active Status -->\n <div class=\"lg:tw-col-span-1 tw-flex tw-items-center tw-pt-0\">\n <cide-ele-input \n formControlName=\"sygms_isactive\"\n type=\"checkbox\"\n label=\"Active\"\n size=\"sm\">\n </cide-ele-input>\n </div>\n </div>\n \n <!-- Third Row - JSON Configuration and Description/Save side by side -->\n <div class=\"tw-flex tw-gap-4\">\n <!-- JSON Configuration (60% width) -->\n <div class=\"tw-w-3/5\">\n <cide-ele-json-editor \n formControlName=\"sygms_configuration\" \n label=\"Configuration\" \n size=\"sm\"\n [required]=\"true\">\n </cide-ele-json-editor>\n </div>\n \n <!-- Description and Save Button (40% width) -->\n <div class=\"tw-w-2/5 tw-flex tw-flex-col tw-space-y-4\">\n <!-- Description -->\n <div class=\"tw-flex-1\">\n <cide-ele-textarea \n formControlName=\"sygms_desc\" \n label=\"Description\" \n placeholder=\"Enter description\"\n size=\"sm\"\n [maxlength]=\"500\" \n [rows]=\"4\">\n </cide-ele-textarea>\n </div>\n \n <!-- Action Buttons -->\n <div class=\"tw-flex tw-justify-end tw-space-x-2\">\n <button \n cideEleButton \n variant=\"outline\" \n size=\"sm\" \n type=\"button\" \n (click)=\"resetForm()\"\n [disabled]=\"loading()\"\n class=\"tw-px-4 tw-py-2\">\n Reset\n </button>\n @if (isEditMode()) {\n <button \n cideEleButton \n variant=\"outline\" \n size=\"sm\" \n type=\"button\" \n (click)=\"cancelForm()\"\n [disabled]=\"loading()\"\n class=\"tw-px-4 tw-py-2\">\n Cancel\n </button>\n }\n <button \n cideEleButton \n variant=\"primary\" \n size=\"sm\" \n type=\"submit\"\n (click)=\"saveMaster()\"\n [disabled]=\"!masterForm.valid || loading()\"\n class=\"tw-px-4 tw-py-2\">\n <cide-ele-icon size=\"xs\" class=\"tw-w-4 tw-h-4 tw-mr-1\">{{ isEditMode() ? 'edit' : 'add' }}</cide-ele-icon>\n {{ isEditMode() ? 'Update' : 'Save' }}\n </button>\n </div>\n </div>\n </div>\n </form>\n </div>\n </div>\n\n <!-- Header Section with Filters -->\n <div class=\"tw-table-row tw-h-0\">\n <div class=\"tw-table-cell tw-px-4 tw-py-2 tw-border-b tw-border-gray-200 tw-bg-gray-50\">\n <div class=\"tw-flex tw-flex-col sm:tw-flex-row tw-justify-between tw-items-start sm:tw-items-center tw-space-y-2 sm:tw-space-y-0\">\n \n <!-- Title and Back Button -->\n <div class=\"tw-flex tw-items-center tw-space-x-3\">\n <div class=\"tw-flex tw-items-center tw-space-x-2\">\n @if (typeTitle()) {\n <div>\n <p class=\"tw-text-xs tw-text-gray-500 tw-m-0\">Type: {{ typeTitle() }}</p>\n </div>\n }\n </div>\n </div>\n\n <!-- Actions -->\n <div class=\"tw-flex tw-flex-col sm:tw-flex-row tw-items-start sm:tw-items-center tw-space-y-2 sm:tw-space-y-0 sm:tw-space-x-3\">\n <!-- Actions can be added here in the future -->\n </div>\n </div>\n\n <!-- Error Message -->\n @if (error()) {\n <div class=\"tw-mt-3 tw-p-3 tw-bg-red-50 tw-border tw-border-red-200 tw-rounded-md\">\n <div class=\"tw-flex tw-items-start\">\n <cide-ele-icon name=\"error\" class=\"tw-text-red-400 tw-w-4 tw-h-4 tw-mt-0.5 tw-flex-shrink-0\"></cide-ele-icon>\n <div class=\"tw-ml-3\">\n <h3 class=\"tw-text-sm tw-font-medium tw-text-red-800 tw-m-0\">Error</h3>\n <p class=\"tw-text-sm tw-text-red-700 tw-mt-1 tw-m-0\">{{ error() }}</p>\n </div>\n </div>\n </div>\n }\n </div>\n </div>\n\n <!-- Main Content Area -->\n <div class=\"tw-table-row tw-h-0\">\n <div class=\"tw-table-cell tw-h-full tw-relative tw-p-0\">\n \n <!-- Data Grid Component -->\n <div class=\"tw-h-full tw-overflow-hidden\">\n <cide-ele-data-grid \n class=\"tw-h-full\"\n [config]=\"gridConfig()\" \n [templateRenderers]=\"templateRenderers()\"\n (gridEvent)=\"onGridEvent($event)\">\n </cide-ele-data-grid>\n </div>\n\n </div>\n </div>\n\n</div>\n\n<!-- Template Renderers -->\n<ng-template #masterDetailsRendererTemplate let-row=\"row\">\n <div class=\"tw-flex tw-flex-col tw-w-full\">\n <div class=\"tw-font-medium tw-text-gray-900\">{{ row.sygms_title || 'N/A' }}</div>\n <div class=\"tw-text-sm tw-text-gray-500 tw-truncate\">{{ row.sygms_desc || 'No description' }}</div>\n </div>\n</ng-template>\n\n<ng-template #masterStatusRendererTemplate let-row=\"row\">\n <span class=\"tw-inline-flex tw-items-center tw-px-2.5 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium\"\n [class.tw-bg-green-100]=\"row.sygms_isactive\"\n [class.tw-text-green-800]=\"row.sygms_isactive\"\n [class.tw-bg-red-100]=\"!row.sygms_isactive\"\n [class.tw-text-red-800]=\"!row.sygms_isactive\">\n {{ row.sygms_isactive ? 'Active' : 'Inactive' }}\n </span>\n</ng-template>\n\n<ng-template #actionsDropdownRendererTemplate let-row=\"row\">\n <cide-ele-dropdown\n [items]=\"getActionDropdownItems(row)\"\n [config]=\"getDropdownConfig()\"\n (itemClick)=\"onDropdownItemClick($event, row)\">\n </cide-ele-dropdown>\n</ng-template>\n</cide-lyt-shared-wrapper> ", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "component", type: CideEleButtonComponent, selector: "button[cideEleButton], a[cideEleButton], cide-ele-button", inputs: ["label", "variant", "size", "type", "shape", "elevation", "disabled", "id", "loading", "fullWidth", "leftIcon", "rightIcon", "customClass", "tooltip", "ariaLabel", "testId", "routerLink", "routerExtras", "preventDoubleClick", "animated"], outputs: ["btnClick", "doubleClick"] }, { kind: "component", type: CideEleDataGridComponent, selector: "cide-ele-data-grid", inputs: ["config", "templateRenderers", "customFormatters", "actionHandlers", "serverSidePagination", "totalServerItems", "currentServerPage", "currentServerPageSize", "dragDropEnabled"], outputs: ["gridEvent"] }, { kind: "component", type: CideInputComponent, selector: "cide-ele-input", inputs: ["fill", "label", "labelHide", "disabled", "clearInput", "labelPlacement", "labelDir", "placeholder", "leadingIcon", "trailingIcon", "helperText", "helperTextCollapse", "hideHelperAndErrorText", "errorText", "maxlength", "minlength", "required", "autocapitalize", "autocomplete", "type", "width", "id", "ngModel", "option", "min", "max", "step", "size"], outputs: ["ngModelChange"] }, { kind: "component", type: CideTextareaComponent, selector: "cide-ele-textarea", inputs: ["label", "labelHide", "placeholder", "helperText", "errorText", "required", "disabled", "minlength", "maxlength", "rows", "id", "ngModel", "size", "fill", "labelPlacement", "labelDir", "leadingIcon", "trailingIcon", "clearInput"], outputs: ["ngModelChange"] }, { kind: "component", type: CideIconComponent, selector: "cide-ele-icon", inputs: ["size", "type", "toolTip"] }, { kind: "component", type: CideEleDropdownComponent, selector: "cide-ele-dropdown", inputs: ["items", "config", "triggerTemplate", "menuTemplate"], outputs: ["itemClick", "dropdownToggle"] }, { kind: "component", type: CideEleJsonEditorComponent, selector: "cide-ele-json-editor", inputs: ["label", "helperText", "required", "disabled", "showCharacterCount", "config"], outputs: ["valueChange", "objectChange", "errorsChange", "validChange"] }, { kind: "component", type: CideLytSharedWrapperComponent, selector: "cide-lyt-shared-wrapper", inputs: ["shared_wrapper_setup_param", "breadcrumb_data"] }] });
|
|
9699
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreGeneralMasterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
9700
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: CideCoreGeneralMasterComponent, isStandalone: true, selector: "cide-core-general-master", viewQueries: [{ propertyName: "masterDetailsRendererTemplate", first: true, predicate: ["masterDetailsRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "masterStatusRendererTemplate", first: true, predicate: ["masterStatusRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "actionsDropdownRendererTemplate", first: true, predicate: ["actionsDropdownRendererTemplate"], descendants: true, isSignal: true }], ngImport: i0, template: "<!-- General Master with Shared Wrapper -->\n<cide-lyt-shared-wrapper [shared_wrapper_setup_param]=\"{ sypg_page_code: 'core_general_master' }\">\n<div class=\"tw-table tw-w-full tw-h-full\">\n\n <!-- Quick Add Form Section -->\n <div class=\"tw-table-row tw-h-0\">\n <div class=\"tw-table-cell tw-px-4 tw-py-3 tw-border-b tw-border-gray-200 tw-bg-white\">\n <div class=\"tw-flex tw-items-center tw-justify-between tw-mb-0\">\n <div class=\"tw-flex tw-items-center tw-space-x-3 tw-mb-3\">\n <cide-ele-icon class=\"tw-text-blue-600 tw-w-4 tw-h-4\">{{ isEditMode() ? 'edit' : 'add' }}</cide-ele-icon>\n <div class=\"tw-flex tw-flex-col\">\n <h6 class=\"tw-text-sm tw-font-medium tw-text-gray-900 tw-m-0\">{{ isEditMode() ? 'Edit Master' : 'Quick Add Master' }}</h6>\n @if (typeTitle()) {\n <p class=\"tw-text-xs tw-text-gray-500 tw-m-0 tw-mt-0.5\">Type: <span class=\"tw-font-medium tw-text-gray-700\">{{ typeTitle() }}</span></p>\n }\n </div>\n </div>\n \n <!-- Parent Master Info Box -->\n @if (masterForm.get('sygms_id_sygms')?.value) {\n <div class=\"tw-flex tw-items-center tw-space-x-3 tw-bg-blue-50 tw-border tw-border-blue-200 tw-px-4 tw-py-1 tw-rounded-lg\">\n <cide-ele-icon class=\"tw-text-blue-600 tw-w-4 tw-h-4\">account_tree</cide-ele-icon>\n <span class=\"tw-text-sm tw-font-medium tw-text-blue-800\">Adding Child</span>\n <span class=\"tw-text-xs tw-text-blue-700\">\n Parent: <span class=\"tw-font-medium\">{{ getParentMasterDisplay() }}</span>\n </span>\n <button \n type=\"button\"\n (click)=\"clearParentMaster()\"\n class=\"tw-text-sm tw-text-blue-600 hover:tw-text-blue-800 hover:tw-bg-blue-100 tw-rounded tw-px-1\">\n \u00D7\n </button>\n </div>\n }\n </div>\n \n <form [formGroup]=\"masterForm\" class=\"tw-space-y-2\">\n \n <!-- First Row - Basic fields -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-6 tw-gap-2\">\n <!-- Master Code -->\n <div class=\"lg:tw-col-span-1\">\n <cide-ele-input \n formControlName=\"sygms_code\" \n label=\"Master Code\" \n placeholder=\"Enter master code\"\n size=\"sm\"\n [required]=\"true\" \n [maxlength]=\"40\">\n </cide-ele-input>\n </div>\n \n <!-- Master Title -->\n <div class=\"lg:tw-col-span-3\">\n <cide-ele-input \n formControlName=\"sygms_title\" \n label=\"Master Title\" \n placeholder=\"Enter master title\"\n size=\"sm\"\n [required]=\"true\" \n [maxlength]=\"150\">\n </cide-ele-input>\n </div>\n \n <!-- Active Status -->\n <div class=\"lg:tw-col-span-1 tw-flex tw-items-center tw-pt-0\">\n <cide-ele-input \n formControlName=\"sygms_isactive\"\n type=\"checkbox\"\n label=\"Active\"\n size=\"sm\">\n </cide-ele-input>\n </div>\n </div>\n \n <!-- Third Row - JSON Configuration and Description/Save side by side -->\n <div class=\"tw-flex tw-gap-4\">\n <!-- JSON Configuration (60% width) -->\n <div class=\"tw-w-3/5\">\n <cide-ele-json-editor \n formControlName=\"sygms_configuration\" \n label=\"Configuration\" \n size=\"sm\"\n [required]=\"true\">\n </cide-ele-json-editor>\n </div>\n \n <!-- Description and Save Button (40% width) -->\n <div class=\"tw-w-2/5 tw-flex tw-flex-col tw-space-y-4\">\n <!-- Description -->\n <div class=\"tw-flex-1\">\n <cide-ele-textarea \n formControlName=\"sygms_desc\" \n label=\"Description\" \n placeholder=\"Enter description\"\n size=\"sm\"\n [maxlength]=\"500\" \n [rows]=\"4\">\n </cide-ele-textarea>\n </div>\n \n <!-- Action Buttons -->\n <div class=\"tw-flex tw-justify-end tw-space-x-2\">\n <button \n cideEleButton \n variant=\"outline\" \n size=\"sm\" \n type=\"button\" \n (click)=\"resetForm()\"\n [disabled]=\"loading()\"\n class=\"tw-px-4 tw-py-2\">\n Reset\n </button>\n @if (isEditMode()) {\n <button \n cideEleButton \n variant=\"outline\" \n size=\"sm\" \n type=\"button\" \n (click)=\"cancelForm()\"\n [disabled]=\"loading()\"\n class=\"tw-px-4 tw-py-2\">\n Cancel\n </button>\n }\n <button \n cideEleButton \n variant=\"primary\" \n size=\"sm\" \n type=\"submit\"\n (click)=\"saveMaster()\"\n [disabled]=\"!masterForm.valid || loading()\"\n class=\"tw-px-4 tw-py-2\">\n <cide-ele-icon size=\"xs\" class=\"tw-w-4 tw-h-4 tw-mr-1\">{{ isEditMode() ? 'edit' : 'add' }}</cide-ele-icon>\n {{ isEditMode() ? 'Update' : 'Save' }}\n </button>\n </div>\n </div>\n </div>\n </form>\n </div>\n </div>\n\n <!-- Header Section with Filters -->\n <div class=\"tw-table-row tw-h-0\">\n <div class=\"tw-table-cell tw-px-4 tw-py-2 tw-border-b tw-border-gray-200 tw-bg-gray-50\">\n <div class=\"tw-flex tw-flex-col sm:tw-flex-row tw-justify-between tw-items-start sm:tw-items-center tw-space-y-2 sm:tw-space-y-0\">\n \n <!-- Title and Back Button -->\n <div class=\"tw-flex tw-items-center tw-space-x-3\">\n <div class=\"tw-flex tw-items-center tw-space-x-2\">\n @if (typeTitle()) {\n <div>\n <p class=\"tw-text-xs tw-text-gray-500 tw-m-0\">Type: {{ typeTitle() }}</p>\n </div>\n }\n </div>\n </div>\n\n <!-- Actions -->\n <div class=\"tw-flex tw-flex-col sm:tw-flex-row tw-items-start sm:tw-items-center tw-space-y-2 sm:tw-space-y-0 sm:tw-space-x-3\">\n <!-- Actions can be added here in the future -->\n </div>\n </div>\n\n <!-- Error Message -->\n @if (error()) {\n <div class=\"tw-mt-3 tw-p-3 tw-bg-red-50 tw-border tw-border-red-200 tw-rounded-md\">\n <div class=\"tw-flex tw-items-start\">\n <cide-ele-icon name=\"error\" class=\"tw-text-red-400 tw-w-4 tw-h-4 tw-mt-0.5 tw-flex-shrink-0\"></cide-ele-icon>\n <div class=\"tw-ml-3\">\n <h3 class=\"tw-text-sm tw-font-medium tw-text-red-800 tw-m-0\">Error</h3>\n <p class=\"tw-text-sm tw-text-red-700 tw-mt-1 tw-m-0\">{{ error() }}</p>\n </div>\n </div>\n </div>\n }\n </div>\n </div>\n\n <!-- Main Content Area -->\n <div class=\"tw-table-row tw-h-0\">\n <div class=\"tw-table-cell tw-h-full tw-relative tw-p-0\">\n \n <!-- Data Grid Component -->\n <div class=\"tw-h-full tw-overflow-hidden\">\n <cide-ele-data-grid \n class=\"tw-h-full\"\n [config]=\"gridConfig()\" \n [templateRenderers]=\"templateRenderers()\"\n (gridEvent)=\"onGridEvent($event)\">\n </cide-ele-data-grid>\n </div>\n\n </div>\n </div>\n\n</div>\n\n<!-- Template Renderers -->\n<ng-template #masterDetailsRendererTemplate let-row=\"row\">\n <div class=\"tw-flex tw-flex-col tw-w-full\">\n <div class=\"tw-font-medium tw-text-gray-900\">{{ row.sygms_title || 'N/A' }}</div>\n <div class=\"tw-text-sm tw-text-gray-500 tw-truncate\">{{ row.sygms_desc || 'No description' }}</div>\n </div>\n</ng-template>\n\n<ng-template #masterStatusRendererTemplate let-row=\"row\">\n <span class=\"tw-inline-flex tw-items-center tw-px-2.5 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium\"\n [class.tw-bg-green-100]=\"row.sygms_isactive\"\n [class.tw-text-green-800]=\"row.sygms_isactive\"\n [class.tw-bg-red-100]=\"!row.sygms_isactive\"\n [class.tw-text-red-800]=\"!row.sygms_isactive\">\n {{ row.sygms_isactive ? 'Active' : 'Inactive' }}\n </span>\n</ng-template>\n\n<ng-template #actionsDropdownRendererTemplate let-row=\"row\">\n <cide-ele-dropdown\n [items]=\"getActionDropdownItems(row)\"\n [config]=\"getDropdownConfig()\"\n (itemClick)=\"onDropdownItemClick($event, row)\">\n </cide-ele-dropdown>\n</ng-template>\n</cide-lyt-shared-wrapper> ", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "component", type: CideEleButtonComponent, selector: "button[cideEleButton], a[cideEleButton], cide-ele-button", inputs: ["label", "variant", "size", "type", "shape", "elevation", "disabled", "id", "loading", "fullWidth", "leftIcon", "rightIcon", "customClass", "tooltip", "ariaLabel", "testId", "routerLink", "routerExtras", "preventDoubleClick", "animated"], outputs: ["btnClick", "doubleClick"] }, { kind: "component", type: CideEleDataGridComponent, selector: "cide-ele-data-grid", inputs: ["config", "templateRenderers", "customFormatters", "actionHandlers", "serverSidePagination", "totalServerItems", "currentServerPage", "currentServerPageSize", "dragDropEnabled"], outputs: ["gridEvent"] }, { kind: "component", type: CideInputComponent, selector: "cide-ele-input", inputs: ["fill", "label", "labelHide", "disabled", "clearInput", "labelPlacement", "labelDir", "placeholder", "leadingIcon", "trailingIcon", "helperText", "helperTextCollapse", "hideHelperAndErrorText", "errorText", "maxlength", "minlength", "required", "autocapitalize", "autocomplete", "type", "width", "id", "ngModel", "option", "min", "max", "step", "size"], outputs: ["ngModelChange"] }, { kind: "component", type: CideTextareaComponent, selector: "cide-ele-textarea", inputs: ["label", "labelHide", "placeholder", "helperText", "errorText", "required", "disabled", "minlength", "maxlength", "rows", "id", "ngModel", "size", "fill", "labelPlacement", "labelDir", "leadingIcon", "trailingIcon", "clearInput"], outputs: ["ngModelChange"] }, { kind: "component", type: CideIconComponent, selector: "cide-ele-icon", inputs: ["size", "type", "toolTip"] }, { kind: "component", type: CideEleDropdownComponent, selector: "cide-ele-dropdown", inputs: ["items", "config", "triggerTemplate", "menuTemplate"], outputs: ["itemClick", "dropdownToggle"] }, { kind: "component", type: CideEleJsonEditorComponent, selector: "cide-ele-json-editor", inputs: ["label", "helperText", "required", "disabled", "showCharacterCount", "config"], outputs: ["valueChange", "objectChange", "errorsChange", "validChange"] }, { kind: "component", type: CideLytSharedWrapperComponent, selector: "cide-lyt-shared-wrapper", inputs: ["shared_wrapper_setup_param", "breadcrumb_data"] }] });
|
|
9690
9701
|
}
|
|
9691
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
9702
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreGeneralMasterComponent, decorators: [{
|
|
9692
9703
|
type: Component,
|
|
9693
9704
|
args: [{ selector: 'cide-core-general-master', standalone: true, imports: [
|
|
9694
9705
|
CommonModule,
|
|
@@ -9703,7 +9714,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImpor
|
|
|
9703
9714
|
CideEleJsonEditorComponent,
|
|
9704
9715
|
CideLytSharedWrapperComponent
|
|
9705
9716
|
], template: "<!-- General Master with Shared Wrapper -->\n<cide-lyt-shared-wrapper [shared_wrapper_setup_param]=\"{ sypg_page_code: 'core_general_master' }\">\n<div class=\"tw-table tw-w-full tw-h-full\">\n\n <!-- Quick Add Form Section -->\n <div class=\"tw-table-row tw-h-0\">\n <div class=\"tw-table-cell tw-px-4 tw-py-3 tw-border-b tw-border-gray-200 tw-bg-white\">\n <div class=\"tw-flex tw-items-center tw-justify-between tw-mb-0\">\n <div class=\"tw-flex tw-items-center tw-space-x-3 tw-mb-3\">\n <cide-ele-icon class=\"tw-text-blue-600 tw-w-4 tw-h-4\">{{ isEditMode() ? 'edit' : 'add' }}</cide-ele-icon>\n <div class=\"tw-flex tw-flex-col\">\n <h6 class=\"tw-text-sm tw-font-medium tw-text-gray-900 tw-m-0\">{{ isEditMode() ? 'Edit Master' : 'Quick Add Master' }}</h6>\n @if (typeTitle()) {\n <p class=\"tw-text-xs tw-text-gray-500 tw-m-0 tw-mt-0.5\">Type: <span class=\"tw-font-medium tw-text-gray-700\">{{ typeTitle() }}</span></p>\n }\n </div>\n </div>\n \n <!-- Parent Master Info Box -->\n @if (masterForm.get('sygms_id_sygms')?.value) {\n <div class=\"tw-flex tw-items-center tw-space-x-3 tw-bg-blue-50 tw-border tw-border-blue-200 tw-px-4 tw-py-1 tw-rounded-lg\">\n <cide-ele-icon class=\"tw-text-blue-600 tw-w-4 tw-h-4\">account_tree</cide-ele-icon>\n <span class=\"tw-text-sm tw-font-medium tw-text-blue-800\">Adding Child</span>\n <span class=\"tw-text-xs tw-text-blue-700\">\n Parent: <span class=\"tw-font-medium\">{{ getParentMasterDisplay() }}</span>\n </span>\n <button \n type=\"button\"\n (click)=\"clearParentMaster()\"\n class=\"tw-text-sm tw-text-blue-600 hover:tw-text-blue-800 hover:tw-bg-blue-100 tw-rounded tw-px-1\">\n \u00D7\n </button>\n </div>\n }\n </div>\n \n <form [formGroup]=\"masterForm\" class=\"tw-space-y-2\">\n \n <!-- First Row - Basic fields -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-6 tw-gap-2\">\n <!-- Master Code -->\n <div class=\"lg:tw-col-span-1\">\n <cide-ele-input \n formControlName=\"sygms_code\" \n label=\"Master Code\" \n placeholder=\"Enter master code\"\n size=\"sm\"\n [required]=\"true\" \n [maxlength]=\"40\">\n </cide-ele-input>\n </div>\n \n <!-- Master Title -->\n <div class=\"lg:tw-col-span-3\">\n <cide-ele-input \n formControlName=\"sygms_title\" \n label=\"Master Title\" \n placeholder=\"Enter master title\"\n size=\"sm\"\n [required]=\"true\" \n [maxlength]=\"150\">\n </cide-ele-input>\n </div>\n \n <!-- Active Status -->\n <div class=\"lg:tw-col-span-1 tw-flex tw-items-center tw-pt-0\">\n <cide-ele-input \n formControlName=\"sygms_isactive\"\n type=\"checkbox\"\n label=\"Active\"\n size=\"sm\">\n </cide-ele-input>\n </div>\n </div>\n \n <!-- Third Row - JSON Configuration and Description/Save side by side -->\n <div class=\"tw-flex tw-gap-4\">\n <!-- JSON Configuration (60% width) -->\n <div class=\"tw-w-3/5\">\n <cide-ele-json-editor \n formControlName=\"sygms_configuration\" \n label=\"Configuration\" \n size=\"sm\"\n [required]=\"true\">\n </cide-ele-json-editor>\n </div>\n \n <!-- Description and Save Button (40% width) -->\n <div class=\"tw-w-2/5 tw-flex tw-flex-col tw-space-y-4\">\n <!-- Description -->\n <div class=\"tw-flex-1\">\n <cide-ele-textarea \n formControlName=\"sygms_desc\" \n label=\"Description\" \n placeholder=\"Enter description\"\n size=\"sm\"\n [maxlength]=\"500\" \n [rows]=\"4\">\n </cide-ele-textarea>\n </div>\n \n <!-- Action Buttons -->\n <div class=\"tw-flex tw-justify-end tw-space-x-2\">\n <button \n cideEleButton \n variant=\"outline\" \n size=\"sm\" \n type=\"button\" \n (click)=\"resetForm()\"\n [disabled]=\"loading()\"\n class=\"tw-px-4 tw-py-2\">\n Reset\n </button>\n @if (isEditMode()) {\n <button \n cideEleButton \n variant=\"outline\" \n size=\"sm\" \n type=\"button\" \n (click)=\"cancelForm()\"\n [disabled]=\"loading()\"\n class=\"tw-px-4 tw-py-2\">\n Cancel\n </button>\n }\n <button \n cideEleButton \n variant=\"primary\" \n size=\"sm\" \n type=\"submit\"\n (click)=\"saveMaster()\"\n [disabled]=\"!masterForm.valid || loading()\"\n class=\"tw-px-4 tw-py-2\">\n <cide-ele-icon size=\"xs\" class=\"tw-w-4 tw-h-4 tw-mr-1\">{{ isEditMode() ? 'edit' : 'add' }}</cide-ele-icon>\n {{ isEditMode() ? 'Update' : 'Save' }}\n </button>\n </div>\n </div>\n </div>\n </form>\n </div>\n </div>\n\n <!-- Header Section with Filters -->\n <div class=\"tw-table-row tw-h-0\">\n <div class=\"tw-table-cell tw-px-4 tw-py-2 tw-border-b tw-border-gray-200 tw-bg-gray-50\">\n <div class=\"tw-flex tw-flex-col sm:tw-flex-row tw-justify-between tw-items-start sm:tw-items-center tw-space-y-2 sm:tw-space-y-0\">\n \n <!-- Title and Back Button -->\n <div class=\"tw-flex tw-items-center tw-space-x-3\">\n <div class=\"tw-flex tw-items-center tw-space-x-2\">\n @if (typeTitle()) {\n <div>\n <p class=\"tw-text-xs tw-text-gray-500 tw-m-0\">Type: {{ typeTitle() }}</p>\n </div>\n }\n </div>\n </div>\n\n <!-- Actions -->\n <div class=\"tw-flex tw-flex-col sm:tw-flex-row tw-items-start sm:tw-items-center tw-space-y-2 sm:tw-space-y-0 sm:tw-space-x-3\">\n <!-- Actions can be added here in the future -->\n </div>\n </div>\n\n <!-- Error Message -->\n @if (error()) {\n <div class=\"tw-mt-3 tw-p-3 tw-bg-red-50 tw-border tw-border-red-200 tw-rounded-md\">\n <div class=\"tw-flex tw-items-start\">\n <cide-ele-icon name=\"error\" class=\"tw-text-red-400 tw-w-4 tw-h-4 tw-mt-0.5 tw-flex-shrink-0\"></cide-ele-icon>\n <div class=\"tw-ml-3\">\n <h3 class=\"tw-text-sm tw-font-medium tw-text-red-800 tw-m-0\">Error</h3>\n <p class=\"tw-text-sm tw-text-red-700 tw-mt-1 tw-m-0\">{{ error() }}</p>\n </div>\n </div>\n </div>\n }\n </div>\n </div>\n\n <!-- Main Content Area -->\n <div class=\"tw-table-row tw-h-0\">\n <div class=\"tw-table-cell tw-h-full tw-relative tw-p-0\">\n \n <!-- Data Grid Component -->\n <div class=\"tw-h-full tw-overflow-hidden\">\n <cide-ele-data-grid \n class=\"tw-h-full\"\n [config]=\"gridConfig()\" \n [templateRenderers]=\"templateRenderers()\"\n (gridEvent)=\"onGridEvent($event)\">\n </cide-ele-data-grid>\n </div>\n\n </div>\n </div>\n\n</div>\n\n<!-- Template Renderers -->\n<ng-template #masterDetailsRendererTemplate let-row=\"row\">\n <div class=\"tw-flex tw-flex-col tw-w-full\">\n <div class=\"tw-font-medium tw-text-gray-900\">{{ row.sygms_title || 'N/A' }}</div>\n <div class=\"tw-text-sm tw-text-gray-500 tw-truncate\">{{ row.sygms_desc || 'No description' }}</div>\n </div>\n</ng-template>\n\n<ng-template #masterStatusRendererTemplate let-row=\"row\">\n <span class=\"tw-inline-flex tw-items-center tw-px-2.5 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium\"\n [class.tw-bg-green-100]=\"row.sygms_isactive\"\n [class.tw-text-green-800]=\"row.sygms_isactive\"\n [class.tw-bg-red-100]=\"!row.sygms_isactive\"\n [class.tw-text-red-800]=\"!row.sygms_isactive\">\n {{ row.sygms_isactive ? 'Active' : 'Inactive' }}\n </span>\n</ng-template>\n\n<ng-template #actionsDropdownRendererTemplate let-row=\"row\">\n <cide-ele-dropdown\n [items]=\"getActionDropdownItems(row)\"\n [config]=\"getDropdownConfig()\"\n (itemClick)=\"onDropdownItemClick($event, row)\">\n </cide-ele-dropdown>\n</ng-template>\n</cide-lyt-shared-wrapper> " }]
|
|
9706
|
-
}] });
|
|
9717
|
+
}], propDecorators: { masterDetailsRendererTemplate: [{ type: i0.ViewChild, args: ['masterDetailsRendererTemplate', { isSignal: true }] }], masterStatusRendererTemplate: [{ type: i0.ViewChild, args: ['masterStatusRendererTemplate', { isSignal: true }] }], actionsDropdownRendererTemplate: [{ type: i0.ViewChild, args: ['actionsDropdownRendererTemplate', { isSignal: true }] }] } });
|
|
9707
9718
|
|
|
9708
9719
|
var generalMaster_component = /*#__PURE__*/Object.freeze({
|
|
9709
9720
|
__proto__: null,
|
|
@@ -9754,10 +9765,10 @@ class CideCorePinCodeService {
|
|
|
9754
9765
|
};
|
|
9755
9766
|
return this.getPinCodeData(payload);
|
|
9756
9767
|
}
|
|
9757
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
9758
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.
|
|
9768
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCorePinCodeService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
9769
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCorePinCodeService, providedIn: 'root' });
|
|
9759
9770
|
}
|
|
9760
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
9771
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCorePinCodeService, decorators: [{
|
|
9761
9772
|
type: Injectable,
|
|
9762
9773
|
args: [{
|
|
9763
9774
|
providedIn: 'root'
|
|
@@ -9787,10 +9798,10 @@ class CideCoreCurrencyService {
|
|
|
9787
9798
|
console.log('💰 CURRENCY SERVICE: Payload:', body);
|
|
9788
9799
|
return this.http.get(url);
|
|
9789
9800
|
}
|
|
9790
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
9791
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.
|
|
9801
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreCurrencyService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
9802
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreCurrencyService, providedIn: 'root' });
|
|
9792
9803
|
}
|
|
9793
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
9804
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreCurrencyService, decorators: [{
|
|
9794
9805
|
type: Injectable,
|
|
9795
9806
|
args: [{
|
|
9796
9807
|
providedIn: 'root'
|
|
@@ -9860,10 +9871,10 @@ class CideCoreCountryService {
|
|
|
9860
9871
|
}; // Temporary fix - update when MSyctrList interface is available
|
|
9861
9872
|
return this.getAllCountries(payload);
|
|
9862
9873
|
}
|
|
9863
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
9864
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.
|
|
9874
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreCountryService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
9875
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreCountryService, providedIn: 'root' });
|
|
9865
9876
|
}
|
|
9866
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
9877
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreCountryService, decorators: [{
|
|
9867
9878
|
type: Injectable,
|
|
9868
9879
|
args: [{
|
|
9869
9880
|
providedIn: 'root'
|
|
@@ -11144,10 +11155,10 @@ class CideCoreEntityCreateComponent {
|
|
|
11144
11155
|
onBack() {
|
|
11145
11156
|
this.router.navigate(['/control-panel/entity-list']);
|
|
11146
11157
|
}
|
|
11147
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
11148
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.7", type: CideCoreEntityCreateComponent, isStandalone: true, selector: "cide-core-entity-create", viewQueries: [{ propertyName: "userCellRendererTemplate", first: true, predicate: ["userCell"], descendants: true, isSignal: true }, { propertyName: "actionsCellRendererTemplate", first: true, predicate: ["actionsCell"], descendants: true, isSignal: true }], ngImport: i0, template: "<cide-lyt-shared-wrapper [shared_wrapper_setup_param]=\"{ sypg_page_code: 'core_entity_form' }\"\r\n [breadcrumb_data]=\"breadcrumbData()\">\r\n <!-- Modern Entity Create Form -->\r\n <div class=\"tw-min-h-screen\">\r\n <div class=\"tw-mx-auto\">\r\n\r\n <form [formGroup]=\"entityForm\" [class.tw-opacity-60]=\"loading()\" [class.tw-pointer-events-none]=\"loading()\"\r\n (ngSubmit)=\"onSubmit()\">\r\n\r\n <!-- Breadcrumb is now rendered by shared wrapper; inline breadcrumb removed -->\r\n\r\n <!-- Basic Information Section -->\r\n <div class=\"tw-p-2 tw-pb-0\">\r\n <div class=\"tw-space-y-6\">\r\n <!-- Top Section: Image on Right, Form Fields on Left -->\r\n <div class=\"tw-grid tw-grid-cols-1 lg:tw-grid-cols-[1fr_200px] tw-gap-4\">\r\n <!-- Left Side: Form Fields -->\r\n <div class=\"tw-space-y-6\">\r\n <!-- Institution Name, Entity Type & Active Status -->\r\n <div\r\n class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-[1fr_250px_120px] tw-gap-4 tw-items-end\">\r\n <cide-ele-input id=\"syen_name\" type=\"text\" label=\"Institution Name\" formControlName=\"syen_name\"\r\n placeholder=\"Enter institution name\" size=\"sm\">\r\n </cide-ele-input>\r\n\r\n <cide-ele-select label=\"Entity Type\" labelPlacement=\"floating\" [options]=\"entityTypes()\"\r\n formControlName=\"syen_entity_type_sygms\" placeholder=\"Select institution type\" size=\"sm\">\r\n </cide-ele-select>\r\n\r\n <div class=\"tw-flex tw-items-center tw-justify-center tw-gap-1 tw-h-full\">\r\n <cide-ele-input type=\"checkbox\" formControlName=\"syen_isactive\" size=\"sm\" label=\"Is Active\">\r\n </cide-ele-input>\r\n </div>\r\n </div>\r\n\r\n <!-- UDISE, Affiliation & Institution Code -->\r\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-3 tw-gap-4\">\r\n <cide-ele-input label=\"UDISE Number\" formControlName=\"syen_udise_no\" placeholder=\"Enter UDISE number\"\r\n size=\"sm\">\r\n </cide-ele-input>\r\n\r\n <cide-ele-input label=\"Affiliation Number\" formControlName=\"syen_affiliation_no\"\r\n placeholder=\"Enter affiliation number\" size=\"sm\">\r\n </cide-ele-input>\r\n\r\n <cide-ele-input label=\"Institution Code\" formControlName=\"syen_entity_code\"\r\n placeholder=\"Enter unique code\" size=\"sm\">\r\n </cide-ele-input>\r\n </div>\r\n </div>\r\n\r\n <!-- Right Side: Entity Image Upload -->\r\n <div class=\"tw-flex tw-items-start tw-justify-center tw-pt-0\">\r\n <cide-ele-file-input id=\"entity_image_upload\" formControlName=\"syen_photo_id_cyfm\" accept=\"image/*\"\r\n [showPreview]=\"true\" [previewBoxMode]=\"true\" [showFileName]=\"false\" previewWidth=\"180px\"\r\n previewHeight=\"120px\" [required]=\"true\" placeholderText=\"Upload Logo\" placeholderIcon=\"cloud_upload\"\r\n [autoUpload]=\"true\" [uploadData]=\"getUploadData()\" (uploadSuccess)=\"onImageUploadSuccess($event)\"\r\n (uploadError)=\"onImageUploadError($event)\" (uploadProgressChange)=\"onImageUploadProgress($event)\">\r\n </cide-ele-file-input>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <!-- Tab Navigation -->\r\n <div class=\"tw-px-4 !tw-mt-0\">\r\n <cide-ele-tab [tabs]=\"entityTabs()\" [activeTabId]=\"activeTab()\" size=\"sm\" variant=\"default\"\r\n (tabChange)=\"onTabChange($event)\">\r\n </cide-ele-tab>\r\n </div>\r\n\r\n <!-- Tab Content -->\r\n <div class=\"tw-transition-all tw-duration-300 tw-ease-in-out !tw-mt-2\" [class.tw-opacity-60]=\"loading()\"\r\n [class.tw-pointer-events-none]=\"loading()\">\r\n @switch (activeTab()) {\r\n\r\n @case ('corporate') {\r\n <div class=\"tw-p-4\">\r\n <div class=\"tw-space-y-6\">\r\n <!-- Corporate Address - Full Width -->\r\n <div class=\"tw-w-full\">\r\n <cide-ele-textarea label=\"Corporate Address\" formControlName=\"syen_corporate_address\"\r\n placeholder=\"Enter complete corporate address\" [rows]=\"4\">\r\n </cide-ele-textarea>\r\n </div>\r\n\r\n <!-- Postal Code, City, State & Country - Four Columns -->\r\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-[220px_0.8fr_0.7fr_240px] tw-gap-6\">\r\n <cide-ele-select label=\"Postal Code\" [options]=\"postalCodes()\"\r\n formControlName=\"syen_corporate_pin_sypin\" placeholder=\"Select postal code\" [searchable]=\"true\"\r\n [loading]=\"postalCodesLoading()\" (searchChange)=\"onPostalCodeSearch($event)\" size=\"sm\">\r\n </cide-ele-select>\r\n\r\n <cide-ele-input label=\"City\" formControlName=\"syen_corporate_city_sypin\" placeholder=\"Enter city name\">\r\n </cide-ele-input>\r\n\r\n <cide-ele-input label=\"State\" formControlName=\"syen_corporate_state_sypin\"\r\n placeholder=\"Enter state name\">\r\n </cide-ele-input>\r\n\r\n <cide-ele-select label=\"Country\" [options]=\"corporateCountries()\"\r\n formControlName=\"syen_corporate_country_syctr\" placeholder=\"Select country\" [searchable]=\"true\"\r\n (searchChange)=\"onCorporateCountrySearch($event)\" [loading]=\"corporateCountriesLoading()\" size=\"sm\">\r\n </cide-ele-select>\r\n </div>\r\n\r\n <!-- Contact Person, Phone, Email & Fax - Four Columns -->\r\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-[1fr_200px_1fr_150px] tw-gap-6\">\r\n <cide-ele-select label=\"Contact Person\" [options]=\"users()\"\r\n formControlName=\"syen_corporate_contact_person_user\" placeholder=\"Select contact person\"\r\n [searchable]=\"true\" [loading]=\"usersLoading()\" (searchChange)=\"onUserSearch($event)\">\r\n </cide-ele-select>\r\n\r\n <cide-ele-input label=\"Phone\" formControlName=\"syen_corporate_phone\" type=\"tel\"\r\n placeholder=\"Enter phone number\" size=\"sm\">\r\n </cide-ele-input>\r\n\r\n <cide-ele-input label=\"Email\" formControlName=\"syen_corporate_email\" type=\"email\"\r\n placeholder=\"Enter email address\">\r\n </cide-ele-input>\r\n\r\n <cide-ele-input label=\"Fax\" formControlName=\"syen_corporate_fax\" placeholder=\"Enter fax number\"\r\n size=\"sm\">\r\n </cide-ele-input>\r\n </div>\r\n </div>\r\n </div>\r\n }\r\n\r\n @case ('contact') {\r\n <div class=\"tw-p-4\">\r\n <div class=\"tw-space-y-6\">\r\n <!-- Currency Selection -->\r\n <div class=\"tw-w-full\">\r\n <cide-ele-select label=\"Currency\" [options]=\"currencies()\" formControlName=\"syen_currency_sycr\"\r\n placeholder=\"Select currency\">\r\n </cide-ele-select>\r\n </div>\r\n\r\n <!-- Alternate Phone & Website - Two Columns -->\r\n <div class=\"tw-grid tw-grid-cols-1 lg:tw-grid-cols-2 tw-gap-6\">\r\n <cide-ele-input label=\"Alternate Phone\" formControlName=\"syen_corporate_phone_alt\" type=\"tel\"\r\n placeholder=\"Enter alternate phone number\">\r\n </cide-ele-input>\r\n\r\n <cide-ele-input label=\"Website URL\" formControlName=\"syen_website\" type=\"url\"\r\n placeholder=\"https://example.com\" autocomplete=\"url\" leadingIcon=\"language\"\r\n helperText=\"Enter a valid website URL starting with http:// or https://\">\r\n </cide-ele-input>\r\n </div>\r\n\r\n <!-- Alternate Email - Full Width -->\r\n <div class=\"tw-w-full\">\r\n <cide-ele-input label=\"Alternate Email\" formControlName=\"syen_corporate_email_alt\" type=\"email\"\r\n placeholder=\"Enter alternate email address\">\r\n </cide-ele-input>\r\n </div>\r\n </div>\r\n </div>\r\n }\r\n\r\n @case ('registered') {\r\n <div class=\"tw-p-4\">\r\n <div class=\"tw-space-y-6\">\r\n <!-- Registered Address - Full Width -->\r\n <div class=\"tw-w-full\">\r\n <cide-ele-textarea label=\"Registered Address\" formControlName=\"syen_registered_address\"\r\n placeholder=\"Enter complete registered address\" [rows]=\"4\">\r\n </cide-ele-textarea>\r\n </div>\r\n\r\n <!-- Postal Code, City, State & Country - Four Columns -->\r\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-[220px_0.8fr_0.7fr_240px] tw-gap-6\">\r\n <cide-ele-select label=\"Postal Code\" [options]=\"postalCodes()\"\r\n formControlName=\"syen_registered_pin_sypin\" placeholder=\"Select postal code\" [searchable]=\"true\"\r\n [loading]=\"postalCodesLoading()\" (searchChange)=\"onPostalCodeSearch($event)\" size=\"sm\">\r\n </cide-ele-select>\r\n\r\n <cide-ele-input label=\"City\" formControlName=\"syen_registered_city_sypin\" placeholder=\"Enter city name\">\r\n </cide-ele-input>\r\n\r\n <cide-ele-input label=\"State\" formControlName=\"syen_registered_state_sypin\"\r\n placeholder=\"Enter state name\">\r\n </cide-ele-input>\r\n\r\n <cide-ele-select label=\"Country\" [options]=\"registeredCountries()\"\r\n formControlName=\"syen_registered_country_syctr\" placeholder=\"Select country\" [searchable]=\"true\"\r\n (searchChange)=\"onRegisteredCountrySearch($event)\" [loading]=\"registeredCountriesLoading()\" size=\"sm\">\r\n </cide-ele-select>\r\n </div>\r\n\r\n <!-- Contact Person, Phone, Email & Fax - Four Columns -->\r\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-[1fr_200px_1fr_150px] tw-gap-6\">\r\n <cide-ele-select label=\"Contact Person\" [options]=\"users()\"\r\n formControlName=\"syen_registered_contact_person_user\" placeholder=\"Select contact person\"\r\n [searchable]=\"true\" [loading]=\"usersLoading()\" (searchChange)=\"onUserSearch($event)\">\r\n </cide-ele-select>\r\n\r\n <cide-ele-input label=\"Phone\" formControlName=\"syen_registered_phone\" type=\"tel\"\r\n placeholder=\"Enter phone number\" size=\"sm\">\r\n </cide-ele-input>\r\n\r\n <cide-ele-input label=\"Email\" formControlName=\"syen_registered_email\" type=\"email\"\r\n placeholder=\"Enter email address\">\r\n </cide-ele-input>\r\n\r\n <cide-ele-input label=\"Fax\" formControlName=\"syen_registered_fax\" placeholder=\"Enter fax number\"\r\n size=\"sm\">\r\n </cide-ele-input>\r\n </div>\r\n </div>\r\n </div>\r\n }\r\n\r\n @case ('user-mapping') {\r\n <div class=\"tw-p-2\">\r\n <div class=\"tw-space-y-4\">\r\n <!-- Add User Mapping Form -->\r\n <div class=\"tw-bg-white tw-p-4 tw-rounded-lg tw-border tw-shadow-sm\">\r\n <div class=\"tw-flex tw-items-center tw-gap-2 tw-mb-3\">\r\n <cide-ele-icon class=\"tw-text-blue-600 tw-text-sm\">person_add</cide-ele-icon>\r\n <h3 class=\"tw-text-sm tw-font-semibold tw-text-gray-800\">Add User to Entity</h3>\r\n </div>\r\n\r\n <form [formGroup]=\"userMappingForm\" (ngSubmit)=\"addUserMapping()\">\r\n <div class=\"tw-flex tw-items-end tw-gap-3\">\r\n <div class=\"tw-flex-1\">\r\n <cide-ele-select label=\"Select User\" [options]=\"availableUsers()\" formControlName=\"syenm_id_user\"\r\n placeholder=\"Choose user to add to entity\" [searchable]=\"true\"\r\n [loading]=\"availableUsersLoading()\" size=\"md\">\r\n </cide-ele-select>\r\n </div>\r\n\r\n <!-- Add Button -->\r\n <div class=\"tw-flex tw-items-end\">\r\n <button cideEleButton type=\"submit\" variant=\"primary\" size=\"sm\"\r\n [disabled]=\"userMappingForm.invalid || availableUsersLoading()\"\r\n class=\"tw-shadow-sm tw-h-8 tw-px-3\">\r\n <cide-ele-icon class=\"tw-mr-1 tw-text-xs\">add</cide-ele-icon>\r\n <span class=\"tw-text-xs\">Add</span>\r\n </button>\r\n </div>\r\n </div>\r\n </form>\r\n </div>\r\n\r\n <!-- User Mappings Grid -->\r\n <div class=\"tw-bg-white tw-rounded-md tw-border tw-overflow-hidden tw-shadow-sm\">\r\n @if (userEntityMappingsLoading()) {\r\n <div class=\"tw-p-4 tw-text-center\">\r\n <div class=\"tw-inline-flex tw-items-center tw-gap-2 tw-text-gray-500\">\r\n <div class=\"tw-animate-spin tw-rounded-full tw-h-3 tw-w-3 tw-border-b-2 tw-border-gray-500\"></div>\r\n <span class=\"tw-text-xs\">Loading...</span>\r\n </div>\r\n </div>\r\n } @else if (userEntityMappings().length === 0) {\r\n <div class=\"tw-p-4 tw-text-center tw-text-gray-500\">\r\n <cide-ele-icon class=\"tw-text-2xl tw-mb-1 tw-text-gray-300\">people_outline</cide-ele-icon>\r\n <p class=\"tw-text-sm tw-font-medium tw-mb-1\">No users mapped yet</p>\r\n <p class=\"tw-text-xs tw-text-gray-400\">Add users above to grant them access to this entity</p>\r\n </div>\r\n } @else {\r\n <cide-ele-data-grid [config]=\"userMappingsGridConfig\" [templateRenderers]=\"getUserMappingsTemplateRenderers()\">\r\n\r\n <!-- Custom user cell template -->\r\n <ng-template #userCell let-row=\"row\">\r\n <div class=\"tw-flex tw-items-center tw-gap-2\">\r\n <div\r\n class=\"tw-w-6 tw-h-6 tw-bg-gradient-to-br tw-from-blue-100 tw-to-indigo-100 tw-rounded-full tw-flex tw-items-center tw-justify-center tw-shadow-sm\">\r\n <cide-ele-icon class=\"tw-text-blue-600 tw-text-xs\">person</cide-ele-icon>\r\n </div>\r\n <div class=\"tw-flex tw-flex-col\">\r\n <span class=\"tw-font-medium tw-text-gray-900 tw-text-xs\">\r\n {{ row?._displayUserName }}\r\n </span>\r\n </div>\r\n </div>\r\n </ng-template>\r\n\r\n <!-- Custom actions cell template -->\r\n <ng-template #actionsCell let-row=\"row\">\r\n <div class=\"tw-flex tw-items-center tw-gap-1 tw-justify-center\">\r\n <button\r\n (click)=\"updateUserMapping(row._id!, { syenm_isactive: !row.syenm_isactive })\"\r\n class=\"tw-w-8 tw-h-8 tw-flex tw-items-center tw-justify-center tw-rounded-md tw-transition-colors tw-border tw-border-transparent hover:tw-border-gray-300\"\r\n [class.tw-bg-green-100]=\"row.syenm_isactive\"\r\n [class.tw-text-green-700]=\"row.syenm_isactive\"\r\n [class.tw-bg-gray-100]=\"!row.syenm_isactive\"\r\n [class.tw-text-gray-600]=\"!row.syenm_isactive\"\r\n [title]=\"row.syenm_isactive ? 'Deactivate' : 'Activate'\">\r\n <cide-ele-icon class=\"tw-text-sm\">\r\n {{ row.syenm_isactive ? 'pause' : 'play_arrow' }}\r\n </cide-ele-icon>\r\n </button>\r\n\r\n <button (click)=\"removeUserMapping(row._id!)\"\r\n class=\"tw-w-8 tw-h-8 tw-flex tw-items-center tw-justify-center tw-rounded-md tw-bg-red-100 tw-text-red-600 hover:tw-bg-red-200 tw-transition-colors tw-border tw-border-transparent hover:tw-border-red-300\"\r\n title=\"Remove User\">\r\n <cide-ele-icon class=\"tw-text-sm\">delete</cide-ele-icon>\r\n </button>\r\n </div>\r\n </ng-template>\r\n </cide-ele-data-grid>\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n }\r\n\r\n }\r\n\r\n <!-- Form Actions -->\r\n <div class=\"tw-p-4\">\r\n <div class=\"tw-flex tw-items-center tw-justify-between tw-gap-3\">\r\n <!-- Error Message (Left Side) -->\r\n <cide-form-field-error [formGroup]=\"entityForm\"></cide-form-field-error>\r\n\r\n <!-- Action Buttons (Right Side) -->\r\n <div class=\"tw-flex tw-gap-3\">\r\n <button cideEleButton type=\"button\" variant=\"outline\" size=\"md\" (click)=\"onBack()\"\r\n [disabled]=\"loading()\">\r\n <cide-ele-icon>arrow_back</cide-ele-icon>\r\n Back\r\n </button>\r\n\r\n <button cideEleButton type=\"button\" variant=\"secondary\" size=\"md\" (click)=\"onReset()\"\r\n [disabled]=\"loading()\">\r\n <cide-ele-icon>refresh</cide-ele-icon>\r\n Reset Form\r\n </button>\r\n\r\n <button cideEleButton type=\"submit\" variant=\"primary\" size=\"md\"\r\n [disabled]=\"loading() || entityForm.invalid\" [loading]=\"loading()\">\r\n <cide-ele-icon>{{ isEditMode() ? 'save' : 'add' }}</cide-ele-icon>\r\n {{ isEditMode() ? 'Update Entity' : 'Create Entity' }}\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </form>\r\n </div>\r\n </div>\r\n</cide-lyt-shared-wrapper>", styles: [""], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: CideLytSharedWrapperComponent, selector: "cide-lyt-shared-wrapper", inputs: ["shared_wrapper_setup_param", "breadcrumb_data"] }, { kind: "component", type: CideInputComponent, selector: "cide-ele-input", inputs: ["fill", "label", "labelHide", "disabled", "clearInput", "labelPlacement", "labelDir", "placeholder", "leadingIcon", "trailingIcon", "helperText", "helperTextCollapse", "hideHelperAndErrorText", "errorText", "maxlength", "minlength", "required", "autocapitalize", "autocomplete", "type", "width", "id", "ngModel", "option", "min", "max", "step", "size"], outputs: ["ngModelChange"] }, { kind: "component", type: CideSelectComponent, selector: "cide-ele-select", inputs: ["label", "labelHide", "placeholder", "helperText", "errorText", "required", "disabled", "id", "ngModel", "size", "fill", "labelPlacement", "labelDir", "leadingIcon", "trailingIcon", "clearInput", "options", "multiple", "searchable", "showSearchInput", "loading", "valueKey", "labelKey", "treeView"], outputs: ["ngModelChange", "change", "searchChange"] }, { kind: "component", type: CideTextareaComponent, selector: "cide-ele-textarea", inputs: ["label", "labelHide", "placeholder", "helperText", "errorText", "required", "disabled", "minlength", "maxlength", "rows", "id", "ngModel", "size", "fill", "labelPlacement", "labelDir", "leadingIcon", "trailingIcon", "clearInput"], outputs: ["ngModelChange"] }, { kind: "component", type: CideEleFileInputComponent, selector: "cide-ele-file-input", inputs: ["label", "accept", "multiple", "disabled", "required", "helperText", "errorText", "showPreview", "previewWidth", "previewHeight", "previewBoxMode", "showFileName", "placeholderText", "placeholderIcon", "autoUpload", "uploadData", "showFloatingUploader", "floatingUploaderGroupId"], outputs: ["fileChange", "uploadSuccess", "uploadError", "uploadProgressChange"] }, { kind: "component", type: CideEleTabComponent, selector: "cide-ele-tab", inputs: ["tabs", "activeTabId", "size", "variant", "fullWidth", "disabled"], outputs: ["tabChange"] }, { kind: "component", type: CideEleButtonComponent, selector: "button[cideEleButton], a[cideEleButton], cide-ele-button", inputs: ["label", "variant", "size", "type", "shape", "elevation", "disabled", "id", "loading", "fullWidth", "leftIcon", "rightIcon", "customClass", "tooltip", "ariaLabel", "testId", "routerLink", "routerExtras", "preventDoubleClick", "animated"], outputs: ["btnClick", "doubleClick"] }, { kind: "component", type: CideIconComponent, selector: "cide-ele-icon", inputs: ["size", "type", "toolTip"] }, { kind: "component", type: CideFormFieldErrorComponent, selector: "cide-form-field-error", inputs: ["control", "formGroup", "fieldName", "customMessages"] }, { kind: "component", type: CideEleDataGridComponent, selector: "cide-ele-data-grid", inputs: ["config", "templateRenderers", "customFormatters", "actionHandlers", "serverSidePagination", "totalServerItems", "currentServerPage", "currentServerPageSize", "dragDropEnabled"], outputs: ["gridEvent"] }] });
|
|
11158
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreEntityCreateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
11159
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: CideCoreEntityCreateComponent, isStandalone: true, selector: "cide-core-entity-create", viewQueries: [{ propertyName: "userCellRendererTemplate", first: true, predicate: ["userCell"], descendants: true, isSignal: true }, { propertyName: "actionsCellRendererTemplate", first: true, predicate: ["actionsCell"], descendants: true, isSignal: true }], ngImport: i0, template: "<cide-lyt-shared-wrapper [shared_wrapper_setup_param]=\"{ sypg_page_code: 'core_entity_form' }\"\r\n [breadcrumb_data]=\"breadcrumbData()\">\r\n <!-- Modern Entity Create Form -->\r\n <div class=\"tw-min-h-screen\">\r\n <div class=\"tw-mx-auto\">\r\n\r\n <form [formGroup]=\"entityForm\" [class.tw-opacity-60]=\"loading()\" [class.tw-pointer-events-none]=\"loading()\"\r\n (ngSubmit)=\"onSubmit()\">\r\n\r\n <!-- Breadcrumb is now rendered by shared wrapper; inline breadcrumb removed -->\r\n\r\n <!-- Basic Information Section -->\r\n <div class=\"tw-p-2 tw-pb-0\">\r\n <div class=\"tw-space-y-6\">\r\n <!-- Top Section: Image on Right, Form Fields on Left -->\r\n <div class=\"tw-grid tw-grid-cols-1 lg:tw-grid-cols-[1fr_200px] tw-gap-4\">\r\n <!-- Left Side: Form Fields -->\r\n <div class=\"tw-space-y-6\">\r\n <!-- Institution Name, Entity Type & Active Status -->\r\n <div\r\n class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-[1fr_250px_120px] tw-gap-4 tw-items-end\">\r\n <cide-ele-input id=\"syen_name\" type=\"text\" label=\"Institution Name\" formControlName=\"syen_name\"\r\n placeholder=\"Enter institution name\" size=\"sm\">\r\n </cide-ele-input>\r\n\r\n <cide-ele-select label=\"Entity Type\" labelPlacement=\"floating\" [options]=\"entityTypes()\"\r\n formControlName=\"syen_entity_type_sygms\" placeholder=\"Select institution type\" size=\"sm\">\r\n </cide-ele-select>\r\n\r\n <div class=\"tw-flex tw-items-center tw-justify-center tw-gap-1 tw-h-full\">\r\n <cide-ele-input type=\"checkbox\" formControlName=\"syen_isactive\" size=\"sm\" label=\"Is Active\">\r\n </cide-ele-input>\r\n </div>\r\n </div>\r\n\r\n <!-- UDISE, Affiliation & Institution Code -->\r\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-3 tw-gap-4\">\r\n <cide-ele-input label=\"UDISE Number\" formControlName=\"syen_udise_no\" placeholder=\"Enter UDISE number\"\r\n size=\"sm\">\r\n </cide-ele-input>\r\n\r\n <cide-ele-input label=\"Affiliation Number\" formControlName=\"syen_affiliation_no\"\r\n placeholder=\"Enter affiliation number\" size=\"sm\">\r\n </cide-ele-input>\r\n\r\n <cide-ele-input label=\"Institution Code\" formControlName=\"syen_entity_code\"\r\n placeholder=\"Enter unique code\" size=\"sm\">\r\n </cide-ele-input>\r\n </div>\r\n </div>\r\n\r\n <!-- Right Side: Entity Image Upload -->\r\n <div class=\"tw-flex tw-items-start tw-justify-center tw-pt-0\">\r\n <cide-ele-file-input id=\"entity_image_upload\" formControlName=\"syen_photo_id_cyfm\" accept=\"image/*\"\r\n [showPreview]=\"true\" [previewBoxMode]=\"true\" [showFileName]=\"false\" previewWidth=\"180px\"\r\n previewHeight=\"120px\" [required]=\"true\" placeholderText=\"Upload Logo\" placeholderIcon=\"cloud_upload\"\r\n [autoUpload]=\"true\" [uploadData]=\"getUploadData()\" (uploadSuccess)=\"onImageUploadSuccess($event)\"\r\n (uploadError)=\"onImageUploadError($event)\" (uploadProgressChange)=\"onImageUploadProgress($event)\">\r\n </cide-ele-file-input>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <!-- Tab Navigation -->\r\n <div class=\"tw-px-4 !tw-mt-0\">\r\n <cide-ele-tab [tabs]=\"entityTabs()\" [activeTabId]=\"activeTab()\" size=\"sm\" variant=\"default\"\r\n (tabChange)=\"onTabChange($event)\">\r\n </cide-ele-tab>\r\n </div>\r\n\r\n <!-- Tab Content -->\r\n <div class=\"tw-transition-all tw-duration-300 tw-ease-in-out !tw-mt-2\" [class.tw-opacity-60]=\"loading()\"\r\n [class.tw-pointer-events-none]=\"loading()\">\r\n @switch (activeTab()) {\r\n\r\n @case ('corporate') {\r\n <div class=\"tw-p-4\">\r\n <div class=\"tw-space-y-6\">\r\n <!-- Corporate Address - Full Width -->\r\n <div class=\"tw-w-full\">\r\n <cide-ele-textarea label=\"Corporate Address\" formControlName=\"syen_corporate_address\"\r\n placeholder=\"Enter complete corporate address\" [rows]=\"4\">\r\n </cide-ele-textarea>\r\n </div>\r\n\r\n <!-- Postal Code, City, State & Country - Four Columns -->\r\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-[220px_0.8fr_0.7fr_240px] tw-gap-6\">\r\n <cide-ele-select label=\"Postal Code\" [options]=\"postalCodes()\"\r\n formControlName=\"syen_corporate_pin_sypin\" placeholder=\"Select postal code\" [searchable]=\"true\"\r\n [loading]=\"postalCodesLoading()\" (searchChange)=\"onPostalCodeSearch($event)\" size=\"sm\">\r\n </cide-ele-select>\r\n\r\n <cide-ele-input label=\"City\" formControlName=\"syen_corporate_city_sypin\" placeholder=\"Enter city name\">\r\n </cide-ele-input>\r\n\r\n <cide-ele-input label=\"State\" formControlName=\"syen_corporate_state_sypin\"\r\n placeholder=\"Enter state name\">\r\n </cide-ele-input>\r\n\r\n <cide-ele-select label=\"Country\" [options]=\"corporateCountries()\"\r\n formControlName=\"syen_corporate_country_syctr\" placeholder=\"Select country\" [searchable]=\"true\"\r\n (searchChange)=\"onCorporateCountrySearch($event)\" [loading]=\"corporateCountriesLoading()\" size=\"sm\">\r\n </cide-ele-select>\r\n </div>\r\n\r\n <!-- Contact Person, Phone, Email & Fax - Four Columns -->\r\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-[1fr_200px_1fr_150px] tw-gap-6\">\r\n <cide-ele-select label=\"Contact Person\" [options]=\"users()\"\r\n formControlName=\"syen_corporate_contact_person_user\" placeholder=\"Select contact person\"\r\n [searchable]=\"true\" [loading]=\"usersLoading()\" (searchChange)=\"onUserSearch($event)\">\r\n </cide-ele-select>\r\n\r\n <cide-ele-input label=\"Phone\" formControlName=\"syen_corporate_phone\" type=\"tel\"\r\n placeholder=\"Enter phone number\" size=\"sm\">\r\n </cide-ele-input>\r\n\r\n <cide-ele-input label=\"Email\" formControlName=\"syen_corporate_email\" type=\"email\"\r\n placeholder=\"Enter email address\">\r\n </cide-ele-input>\r\n\r\n <cide-ele-input label=\"Fax\" formControlName=\"syen_corporate_fax\" placeholder=\"Enter fax number\"\r\n size=\"sm\">\r\n </cide-ele-input>\r\n </div>\r\n </div>\r\n </div>\r\n }\r\n\r\n @case ('contact') {\r\n <div class=\"tw-p-4\">\r\n <div class=\"tw-space-y-6\">\r\n <!-- Currency Selection -->\r\n <div class=\"tw-w-full\">\r\n <cide-ele-select label=\"Currency\" [options]=\"currencies()\" formControlName=\"syen_currency_sycr\"\r\n placeholder=\"Select currency\">\r\n </cide-ele-select>\r\n </div>\r\n\r\n <!-- Alternate Phone & Website - Two Columns -->\r\n <div class=\"tw-grid tw-grid-cols-1 lg:tw-grid-cols-2 tw-gap-6\">\r\n <cide-ele-input label=\"Alternate Phone\" formControlName=\"syen_corporate_phone_alt\" type=\"tel\"\r\n placeholder=\"Enter alternate phone number\">\r\n </cide-ele-input>\r\n\r\n <cide-ele-input label=\"Website URL\" formControlName=\"syen_website\" type=\"url\"\r\n placeholder=\"https://example.com\" autocomplete=\"url\" leadingIcon=\"language\"\r\n helperText=\"Enter a valid website URL starting with http:// or https://\">\r\n </cide-ele-input>\r\n </div>\r\n\r\n <!-- Alternate Email - Full Width -->\r\n <div class=\"tw-w-full\">\r\n <cide-ele-input label=\"Alternate Email\" formControlName=\"syen_corporate_email_alt\" type=\"email\"\r\n placeholder=\"Enter alternate email address\">\r\n </cide-ele-input>\r\n </div>\r\n </div>\r\n </div>\r\n }\r\n\r\n @case ('registered') {\r\n <div class=\"tw-p-4\">\r\n <div class=\"tw-space-y-6\">\r\n <!-- Registered Address - Full Width -->\r\n <div class=\"tw-w-full\">\r\n <cide-ele-textarea label=\"Registered Address\" formControlName=\"syen_registered_address\"\r\n placeholder=\"Enter complete registered address\" [rows]=\"4\">\r\n </cide-ele-textarea>\r\n </div>\r\n\r\n <!-- Postal Code, City, State & Country - Four Columns -->\r\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-[220px_0.8fr_0.7fr_240px] tw-gap-6\">\r\n <cide-ele-select label=\"Postal Code\" [options]=\"postalCodes()\"\r\n formControlName=\"syen_registered_pin_sypin\" placeholder=\"Select postal code\" [searchable]=\"true\"\r\n [loading]=\"postalCodesLoading()\" (searchChange)=\"onPostalCodeSearch($event)\" size=\"sm\">\r\n </cide-ele-select>\r\n\r\n <cide-ele-input label=\"City\" formControlName=\"syen_registered_city_sypin\" placeholder=\"Enter city name\">\r\n </cide-ele-input>\r\n\r\n <cide-ele-input label=\"State\" formControlName=\"syen_registered_state_sypin\"\r\n placeholder=\"Enter state name\">\r\n </cide-ele-input>\r\n\r\n <cide-ele-select label=\"Country\" [options]=\"registeredCountries()\"\r\n formControlName=\"syen_registered_country_syctr\" placeholder=\"Select country\" [searchable]=\"true\"\r\n (searchChange)=\"onRegisteredCountrySearch($event)\" [loading]=\"registeredCountriesLoading()\" size=\"sm\">\r\n </cide-ele-select>\r\n </div>\r\n\r\n <!-- Contact Person, Phone, Email & Fax - Four Columns -->\r\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-[1fr_200px_1fr_150px] tw-gap-6\">\r\n <cide-ele-select label=\"Contact Person\" [options]=\"users()\"\r\n formControlName=\"syen_registered_contact_person_user\" placeholder=\"Select contact person\"\r\n [searchable]=\"true\" [loading]=\"usersLoading()\" (searchChange)=\"onUserSearch($event)\">\r\n </cide-ele-select>\r\n\r\n <cide-ele-input label=\"Phone\" formControlName=\"syen_registered_phone\" type=\"tel\"\r\n placeholder=\"Enter phone number\" size=\"sm\">\r\n </cide-ele-input>\r\n\r\n <cide-ele-input label=\"Email\" formControlName=\"syen_registered_email\" type=\"email\"\r\n placeholder=\"Enter email address\">\r\n </cide-ele-input>\r\n\r\n <cide-ele-input label=\"Fax\" formControlName=\"syen_registered_fax\" placeholder=\"Enter fax number\"\r\n size=\"sm\">\r\n </cide-ele-input>\r\n </div>\r\n </div>\r\n </div>\r\n }\r\n\r\n @case ('user-mapping') {\r\n <div class=\"tw-p-2\">\r\n <div class=\"tw-space-y-4\">\r\n <!-- Add User Mapping Form -->\r\n <div class=\"tw-bg-white tw-p-4 tw-rounded-lg tw-border tw-shadow-sm\">\r\n <div class=\"tw-flex tw-items-center tw-gap-2 tw-mb-3\">\r\n <cide-ele-icon class=\"tw-text-blue-600 tw-text-sm\">person_add</cide-ele-icon>\r\n <h3 class=\"tw-text-sm tw-font-semibold tw-text-gray-800\">Add User to Entity</h3>\r\n </div>\r\n\r\n <form [formGroup]=\"userMappingForm\" (ngSubmit)=\"addUserMapping()\">\r\n <div class=\"tw-flex tw-items-end tw-gap-3\">\r\n <div class=\"tw-flex-1\">\r\n <cide-ele-select label=\"Select User\" [options]=\"availableUsers()\" formControlName=\"syenm_id_user\"\r\n placeholder=\"Choose user to add to entity\" [searchable]=\"true\"\r\n [loading]=\"availableUsersLoading()\" size=\"md\">\r\n </cide-ele-select>\r\n </div>\r\n\r\n <!-- Add Button -->\r\n <div class=\"tw-flex tw-items-end\">\r\n <button cideEleButton type=\"submit\" variant=\"primary\" size=\"sm\"\r\n [disabled]=\"userMappingForm.invalid || availableUsersLoading()\"\r\n class=\"tw-shadow-sm tw-h-8 tw-px-3\">\r\n <cide-ele-icon class=\"tw-mr-1 tw-text-xs\">add</cide-ele-icon>\r\n <span class=\"tw-text-xs\">Add</span>\r\n </button>\r\n </div>\r\n </div>\r\n </form>\r\n </div>\r\n\r\n <!-- User Mappings Grid -->\r\n <div class=\"tw-bg-white tw-rounded-md tw-border tw-overflow-hidden tw-shadow-sm\">\r\n @if (userEntityMappingsLoading()) {\r\n <div class=\"tw-p-4 tw-text-center\">\r\n <div class=\"tw-inline-flex tw-items-center tw-gap-2 tw-text-gray-500\">\r\n <div class=\"tw-animate-spin tw-rounded-full tw-h-3 tw-w-3 tw-border-b-2 tw-border-gray-500\"></div>\r\n <span class=\"tw-text-xs\">Loading...</span>\r\n </div>\r\n </div>\r\n } @else if (userEntityMappings().length === 0) {\r\n <div class=\"tw-p-4 tw-text-center tw-text-gray-500\">\r\n <cide-ele-icon class=\"tw-text-2xl tw-mb-1 tw-text-gray-300\">people_outline</cide-ele-icon>\r\n <p class=\"tw-text-sm tw-font-medium tw-mb-1\">No users mapped yet</p>\r\n <p class=\"tw-text-xs tw-text-gray-400\">Add users above to grant them access to this entity</p>\r\n </div>\r\n } @else {\r\n <cide-ele-data-grid [config]=\"userMappingsGridConfig\" [templateRenderers]=\"getUserMappingsTemplateRenderers()\">\r\n\r\n <!-- Custom user cell template -->\r\n <ng-template #userCell let-row=\"row\">\r\n <div class=\"tw-flex tw-items-center tw-gap-2\">\r\n <div\r\n class=\"tw-w-6 tw-h-6 tw-bg-gradient-to-br tw-from-blue-100 tw-to-indigo-100 tw-rounded-full tw-flex tw-items-center tw-justify-center tw-shadow-sm\">\r\n <cide-ele-icon class=\"tw-text-blue-600 tw-text-xs\">person</cide-ele-icon>\r\n </div>\r\n <div class=\"tw-flex tw-flex-col\">\r\n <span class=\"tw-font-medium tw-text-gray-900 tw-text-xs\">\r\n {{ row?._displayUserName }}\r\n </span>\r\n </div>\r\n </div>\r\n </ng-template>\r\n\r\n <!-- Custom actions cell template -->\r\n <ng-template #actionsCell let-row=\"row\">\r\n <div class=\"tw-flex tw-items-center tw-gap-1 tw-justify-center\">\r\n <button\r\n (click)=\"updateUserMapping(row._id!, { syenm_isactive: !row.syenm_isactive })\"\r\n class=\"tw-w-8 tw-h-8 tw-flex tw-items-center tw-justify-center tw-rounded-md tw-transition-colors tw-border tw-border-transparent hover:tw-border-gray-300\"\r\n [class.tw-bg-green-100]=\"row.syenm_isactive\"\r\n [class.tw-text-green-700]=\"row.syenm_isactive\"\r\n [class.tw-bg-gray-100]=\"!row.syenm_isactive\"\r\n [class.tw-text-gray-600]=\"!row.syenm_isactive\"\r\n [title]=\"row.syenm_isactive ? 'Deactivate' : 'Activate'\">\r\n <cide-ele-icon class=\"tw-text-sm\">\r\n {{ row.syenm_isactive ? 'pause' : 'play_arrow' }}\r\n </cide-ele-icon>\r\n </button>\r\n\r\n <button (click)=\"removeUserMapping(row._id!)\"\r\n class=\"tw-w-8 tw-h-8 tw-flex tw-items-center tw-justify-center tw-rounded-md tw-bg-red-100 tw-text-red-600 hover:tw-bg-red-200 tw-transition-colors tw-border tw-border-transparent hover:tw-border-red-300\"\r\n title=\"Remove User\">\r\n <cide-ele-icon class=\"tw-text-sm\">delete</cide-ele-icon>\r\n </button>\r\n </div>\r\n </ng-template>\r\n </cide-ele-data-grid>\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n }\r\n\r\n }\r\n\r\n <!-- Form Actions -->\r\n <div class=\"tw-p-4\">\r\n <div class=\"tw-flex tw-items-center tw-justify-between tw-gap-3\">\r\n <!-- Error Message (Left Side) -->\r\n <cide-form-field-error [formGroup]=\"entityForm\"></cide-form-field-error>\r\n\r\n <!-- Action Buttons (Right Side) -->\r\n <div class=\"tw-flex tw-gap-3\">\r\n <button cideEleButton type=\"button\" variant=\"outline\" size=\"md\" (click)=\"onBack()\"\r\n [disabled]=\"loading()\">\r\n <cide-ele-icon>arrow_back</cide-ele-icon>\r\n Back\r\n </button>\r\n\r\n <button cideEleButton type=\"button\" variant=\"secondary\" size=\"md\" (click)=\"onReset()\"\r\n [disabled]=\"loading()\">\r\n <cide-ele-icon>refresh</cide-ele-icon>\r\n Reset Form\r\n </button>\r\n\r\n <button cideEleButton type=\"submit\" variant=\"primary\" size=\"md\"\r\n [disabled]=\"loading() || entityForm.invalid\" [loading]=\"loading()\">\r\n <cide-ele-icon>{{ isEditMode() ? 'save' : 'add' }}</cide-ele-icon>\r\n {{ isEditMode() ? 'Update Entity' : 'Create Entity' }}\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </form>\r\n </div>\r\n </div>\r\n</cide-lyt-shared-wrapper>", styles: [""], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: CideLytSharedWrapperComponent, selector: "cide-lyt-shared-wrapper", inputs: ["shared_wrapper_setup_param", "breadcrumb_data"] }, { kind: "component", type: CideInputComponent, selector: "cide-ele-input", inputs: ["fill", "label", "labelHide", "disabled", "clearInput", "labelPlacement", "labelDir", "placeholder", "leadingIcon", "trailingIcon", "helperText", "helperTextCollapse", "hideHelperAndErrorText", "errorText", "maxlength", "minlength", "required", "autocapitalize", "autocomplete", "type", "width", "id", "ngModel", "option", "min", "max", "step", "size"], outputs: ["ngModelChange"] }, { kind: "component", type: CideSelectComponent, selector: "cide-ele-select", inputs: ["label", "labelHide", "placeholder", "helperText", "errorText", "required", "disabled", "id", "ngModel", "size", "fill", "labelPlacement", "labelDir", "leadingIcon", "trailingIcon", "clearInput", "options", "multiple", "searchable", "showSearchInput", "loading", "valueKey", "labelKey", "treeView"], outputs: ["ngModelChange", "change", "searchChange"] }, { kind: "component", type: CideTextareaComponent, selector: "cide-ele-textarea", inputs: ["label", "labelHide", "placeholder", "helperText", "errorText", "required", "disabled", "minlength", "maxlength", "rows", "id", "ngModel", "size", "fill", "labelPlacement", "labelDir", "leadingIcon", "trailingIcon", "clearInput"], outputs: ["ngModelChange"] }, { kind: "component", type: CideEleFileInputComponent, selector: "cide-ele-file-input", inputs: ["label", "accept", "multiple", "disabled", "required", "helperText", "errorText", "showPreview", "previewWidth", "previewHeight", "previewBoxMode", "showFileName", "placeholderText", "placeholderIcon", "autoUpload", "uploadData", "showFloatingUploader", "floatingUploaderGroupId"], outputs: ["fileChange", "uploadSuccess", "uploadError", "uploadProgressChange"] }, { kind: "component", type: CideEleTabComponent, selector: "cide-ele-tab", inputs: ["tabs", "activeTabId", "size", "variant", "fullWidth", "disabled"], outputs: ["tabChange"] }, { kind: "component", type: CideEleButtonComponent, selector: "button[cideEleButton], a[cideEleButton], cide-ele-button", inputs: ["label", "variant", "size", "type", "shape", "elevation", "disabled", "id", "loading", "fullWidth", "leftIcon", "rightIcon", "customClass", "tooltip", "ariaLabel", "testId", "routerLink", "routerExtras", "preventDoubleClick", "animated"], outputs: ["btnClick", "doubleClick"] }, { kind: "component", type: CideIconComponent, selector: "cide-ele-icon", inputs: ["size", "type", "toolTip"] }, { kind: "component", type: CideFormFieldErrorComponent, selector: "cide-form-field-error", inputs: ["control", "formGroup", "fieldName", "customMessages"] }, { kind: "component", type: CideEleDataGridComponent, selector: "cide-ele-data-grid", inputs: ["config", "templateRenderers", "customFormatters", "actionHandlers", "serverSidePagination", "totalServerItems", "currentServerPage", "currentServerPageSize", "dragDropEnabled"], outputs: ["gridEvent"] }] });
|
|
11149
11160
|
}
|
|
11150
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
11161
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreEntityCreateComponent, decorators: [{
|
|
11151
11162
|
type: Component,
|
|
11152
11163
|
args: [{ selector: 'cide-core-entity-create', imports: [
|
|
11153
11164
|
ReactiveFormsModule,
|
|
@@ -11162,7 +11173,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImpor
|
|
|
11162
11173
|
CideFormFieldErrorComponent,
|
|
11163
11174
|
CideEleDataGridComponent,
|
|
11164
11175
|
], template: "<cide-lyt-shared-wrapper [shared_wrapper_setup_param]=\"{ sypg_page_code: 'core_entity_form' }\"\r\n [breadcrumb_data]=\"breadcrumbData()\">\r\n <!-- Modern Entity Create Form -->\r\n <div class=\"tw-min-h-screen\">\r\n <div class=\"tw-mx-auto\">\r\n\r\n <form [formGroup]=\"entityForm\" [class.tw-opacity-60]=\"loading()\" [class.tw-pointer-events-none]=\"loading()\"\r\n (ngSubmit)=\"onSubmit()\">\r\n\r\n <!-- Breadcrumb is now rendered by shared wrapper; inline breadcrumb removed -->\r\n\r\n <!-- Basic Information Section -->\r\n <div class=\"tw-p-2 tw-pb-0\">\r\n <div class=\"tw-space-y-6\">\r\n <!-- Top Section: Image on Right, Form Fields on Left -->\r\n <div class=\"tw-grid tw-grid-cols-1 lg:tw-grid-cols-[1fr_200px] tw-gap-4\">\r\n <!-- Left Side: Form Fields -->\r\n <div class=\"tw-space-y-6\">\r\n <!-- Institution Name, Entity Type & Active Status -->\r\n <div\r\n class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-[1fr_250px_120px] tw-gap-4 tw-items-end\">\r\n <cide-ele-input id=\"syen_name\" type=\"text\" label=\"Institution Name\" formControlName=\"syen_name\"\r\n placeholder=\"Enter institution name\" size=\"sm\">\r\n </cide-ele-input>\r\n\r\n <cide-ele-select label=\"Entity Type\" labelPlacement=\"floating\" [options]=\"entityTypes()\"\r\n formControlName=\"syen_entity_type_sygms\" placeholder=\"Select institution type\" size=\"sm\">\r\n </cide-ele-select>\r\n\r\n <div class=\"tw-flex tw-items-center tw-justify-center tw-gap-1 tw-h-full\">\r\n <cide-ele-input type=\"checkbox\" formControlName=\"syen_isactive\" size=\"sm\" label=\"Is Active\">\r\n </cide-ele-input>\r\n </div>\r\n </div>\r\n\r\n <!-- UDISE, Affiliation & Institution Code -->\r\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-3 tw-gap-4\">\r\n <cide-ele-input label=\"UDISE Number\" formControlName=\"syen_udise_no\" placeholder=\"Enter UDISE number\"\r\n size=\"sm\">\r\n </cide-ele-input>\r\n\r\n <cide-ele-input label=\"Affiliation Number\" formControlName=\"syen_affiliation_no\"\r\n placeholder=\"Enter affiliation number\" size=\"sm\">\r\n </cide-ele-input>\r\n\r\n <cide-ele-input label=\"Institution Code\" formControlName=\"syen_entity_code\"\r\n placeholder=\"Enter unique code\" size=\"sm\">\r\n </cide-ele-input>\r\n </div>\r\n </div>\r\n\r\n <!-- Right Side: Entity Image Upload -->\r\n <div class=\"tw-flex tw-items-start tw-justify-center tw-pt-0\">\r\n <cide-ele-file-input id=\"entity_image_upload\" formControlName=\"syen_photo_id_cyfm\" accept=\"image/*\"\r\n [showPreview]=\"true\" [previewBoxMode]=\"true\" [showFileName]=\"false\" previewWidth=\"180px\"\r\n previewHeight=\"120px\" [required]=\"true\" placeholderText=\"Upload Logo\" placeholderIcon=\"cloud_upload\"\r\n [autoUpload]=\"true\" [uploadData]=\"getUploadData()\" (uploadSuccess)=\"onImageUploadSuccess($event)\"\r\n (uploadError)=\"onImageUploadError($event)\" (uploadProgressChange)=\"onImageUploadProgress($event)\">\r\n </cide-ele-file-input>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <!-- Tab Navigation -->\r\n <div class=\"tw-px-4 !tw-mt-0\">\r\n <cide-ele-tab [tabs]=\"entityTabs()\" [activeTabId]=\"activeTab()\" size=\"sm\" variant=\"default\"\r\n (tabChange)=\"onTabChange($event)\">\r\n </cide-ele-tab>\r\n </div>\r\n\r\n <!-- Tab Content -->\r\n <div class=\"tw-transition-all tw-duration-300 tw-ease-in-out !tw-mt-2\" [class.tw-opacity-60]=\"loading()\"\r\n [class.tw-pointer-events-none]=\"loading()\">\r\n @switch (activeTab()) {\r\n\r\n @case ('corporate') {\r\n <div class=\"tw-p-4\">\r\n <div class=\"tw-space-y-6\">\r\n <!-- Corporate Address - Full Width -->\r\n <div class=\"tw-w-full\">\r\n <cide-ele-textarea label=\"Corporate Address\" formControlName=\"syen_corporate_address\"\r\n placeholder=\"Enter complete corporate address\" [rows]=\"4\">\r\n </cide-ele-textarea>\r\n </div>\r\n\r\n <!-- Postal Code, City, State & Country - Four Columns -->\r\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-[220px_0.8fr_0.7fr_240px] tw-gap-6\">\r\n <cide-ele-select label=\"Postal Code\" [options]=\"postalCodes()\"\r\n formControlName=\"syen_corporate_pin_sypin\" placeholder=\"Select postal code\" [searchable]=\"true\"\r\n [loading]=\"postalCodesLoading()\" (searchChange)=\"onPostalCodeSearch($event)\" size=\"sm\">\r\n </cide-ele-select>\r\n\r\n <cide-ele-input label=\"City\" formControlName=\"syen_corporate_city_sypin\" placeholder=\"Enter city name\">\r\n </cide-ele-input>\r\n\r\n <cide-ele-input label=\"State\" formControlName=\"syen_corporate_state_sypin\"\r\n placeholder=\"Enter state name\">\r\n </cide-ele-input>\r\n\r\n <cide-ele-select label=\"Country\" [options]=\"corporateCountries()\"\r\n formControlName=\"syen_corporate_country_syctr\" placeholder=\"Select country\" [searchable]=\"true\"\r\n (searchChange)=\"onCorporateCountrySearch($event)\" [loading]=\"corporateCountriesLoading()\" size=\"sm\">\r\n </cide-ele-select>\r\n </div>\r\n\r\n <!-- Contact Person, Phone, Email & Fax - Four Columns -->\r\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-[1fr_200px_1fr_150px] tw-gap-6\">\r\n <cide-ele-select label=\"Contact Person\" [options]=\"users()\"\r\n formControlName=\"syen_corporate_contact_person_user\" placeholder=\"Select contact person\"\r\n [searchable]=\"true\" [loading]=\"usersLoading()\" (searchChange)=\"onUserSearch($event)\">\r\n </cide-ele-select>\r\n\r\n <cide-ele-input label=\"Phone\" formControlName=\"syen_corporate_phone\" type=\"tel\"\r\n placeholder=\"Enter phone number\" size=\"sm\">\r\n </cide-ele-input>\r\n\r\n <cide-ele-input label=\"Email\" formControlName=\"syen_corporate_email\" type=\"email\"\r\n placeholder=\"Enter email address\">\r\n </cide-ele-input>\r\n\r\n <cide-ele-input label=\"Fax\" formControlName=\"syen_corporate_fax\" placeholder=\"Enter fax number\"\r\n size=\"sm\">\r\n </cide-ele-input>\r\n </div>\r\n </div>\r\n </div>\r\n }\r\n\r\n @case ('contact') {\r\n <div class=\"tw-p-4\">\r\n <div class=\"tw-space-y-6\">\r\n <!-- Currency Selection -->\r\n <div class=\"tw-w-full\">\r\n <cide-ele-select label=\"Currency\" [options]=\"currencies()\" formControlName=\"syen_currency_sycr\"\r\n placeholder=\"Select currency\">\r\n </cide-ele-select>\r\n </div>\r\n\r\n <!-- Alternate Phone & Website - Two Columns -->\r\n <div class=\"tw-grid tw-grid-cols-1 lg:tw-grid-cols-2 tw-gap-6\">\r\n <cide-ele-input label=\"Alternate Phone\" formControlName=\"syen_corporate_phone_alt\" type=\"tel\"\r\n placeholder=\"Enter alternate phone number\">\r\n </cide-ele-input>\r\n\r\n <cide-ele-input label=\"Website URL\" formControlName=\"syen_website\" type=\"url\"\r\n placeholder=\"https://example.com\" autocomplete=\"url\" leadingIcon=\"language\"\r\n helperText=\"Enter a valid website URL starting with http:// or https://\">\r\n </cide-ele-input>\r\n </div>\r\n\r\n <!-- Alternate Email - Full Width -->\r\n <div class=\"tw-w-full\">\r\n <cide-ele-input label=\"Alternate Email\" formControlName=\"syen_corporate_email_alt\" type=\"email\"\r\n placeholder=\"Enter alternate email address\">\r\n </cide-ele-input>\r\n </div>\r\n </div>\r\n </div>\r\n }\r\n\r\n @case ('registered') {\r\n <div class=\"tw-p-4\">\r\n <div class=\"tw-space-y-6\">\r\n <!-- Registered Address - Full Width -->\r\n <div class=\"tw-w-full\">\r\n <cide-ele-textarea label=\"Registered Address\" formControlName=\"syen_registered_address\"\r\n placeholder=\"Enter complete registered address\" [rows]=\"4\">\r\n </cide-ele-textarea>\r\n </div>\r\n\r\n <!-- Postal Code, City, State & Country - Four Columns -->\r\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-[220px_0.8fr_0.7fr_240px] tw-gap-6\">\r\n <cide-ele-select label=\"Postal Code\" [options]=\"postalCodes()\"\r\n formControlName=\"syen_registered_pin_sypin\" placeholder=\"Select postal code\" [searchable]=\"true\"\r\n [loading]=\"postalCodesLoading()\" (searchChange)=\"onPostalCodeSearch($event)\" size=\"sm\">\r\n </cide-ele-select>\r\n\r\n <cide-ele-input label=\"City\" formControlName=\"syen_registered_city_sypin\" placeholder=\"Enter city name\">\r\n </cide-ele-input>\r\n\r\n <cide-ele-input label=\"State\" formControlName=\"syen_registered_state_sypin\"\r\n placeholder=\"Enter state name\">\r\n </cide-ele-input>\r\n\r\n <cide-ele-select label=\"Country\" [options]=\"registeredCountries()\"\r\n formControlName=\"syen_registered_country_syctr\" placeholder=\"Select country\" [searchable]=\"true\"\r\n (searchChange)=\"onRegisteredCountrySearch($event)\" [loading]=\"registeredCountriesLoading()\" size=\"sm\">\r\n </cide-ele-select>\r\n </div>\r\n\r\n <!-- Contact Person, Phone, Email & Fax - Four Columns -->\r\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-[1fr_200px_1fr_150px] tw-gap-6\">\r\n <cide-ele-select label=\"Contact Person\" [options]=\"users()\"\r\n formControlName=\"syen_registered_contact_person_user\" placeholder=\"Select contact person\"\r\n [searchable]=\"true\" [loading]=\"usersLoading()\" (searchChange)=\"onUserSearch($event)\">\r\n </cide-ele-select>\r\n\r\n <cide-ele-input label=\"Phone\" formControlName=\"syen_registered_phone\" type=\"tel\"\r\n placeholder=\"Enter phone number\" size=\"sm\">\r\n </cide-ele-input>\r\n\r\n <cide-ele-input label=\"Email\" formControlName=\"syen_registered_email\" type=\"email\"\r\n placeholder=\"Enter email address\">\r\n </cide-ele-input>\r\n\r\n <cide-ele-input label=\"Fax\" formControlName=\"syen_registered_fax\" placeholder=\"Enter fax number\"\r\n size=\"sm\">\r\n </cide-ele-input>\r\n </div>\r\n </div>\r\n </div>\r\n }\r\n\r\n @case ('user-mapping') {\r\n <div class=\"tw-p-2\">\r\n <div class=\"tw-space-y-4\">\r\n <!-- Add User Mapping Form -->\r\n <div class=\"tw-bg-white tw-p-4 tw-rounded-lg tw-border tw-shadow-sm\">\r\n <div class=\"tw-flex tw-items-center tw-gap-2 tw-mb-3\">\r\n <cide-ele-icon class=\"tw-text-blue-600 tw-text-sm\">person_add</cide-ele-icon>\r\n <h3 class=\"tw-text-sm tw-font-semibold tw-text-gray-800\">Add User to Entity</h3>\r\n </div>\r\n\r\n <form [formGroup]=\"userMappingForm\" (ngSubmit)=\"addUserMapping()\">\r\n <div class=\"tw-flex tw-items-end tw-gap-3\">\r\n <div class=\"tw-flex-1\">\r\n <cide-ele-select label=\"Select User\" [options]=\"availableUsers()\" formControlName=\"syenm_id_user\"\r\n placeholder=\"Choose user to add to entity\" [searchable]=\"true\"\r\n [loading]=\"availableUsersLoading()\" size=\"md\">\r\n </cide-ele-select>\r\n </div>\r\n\r\n <!-- Add Button -->\r\n <div class=\"tw-flex tw-items-end\">\r\n <button cideEleButton type=\"submit\" variant=\"primary\" size=\"sm\"\r\n [disabled]=\"userMappingForm.invalid || availableUsersLoading()\"\r\n class=\"tw-shadow-sm tw-h-8 tw-px-3\">\r\n <cide-ele-icon class=\"tw-mr-1 tw-text-xs\">add</cide-ele-icon>\r\n <span class=\"tw-text-xs\">Add</span>\r\n </button>\r\n </div>\r\n </div>\r\n </form>\r\n </div>\r\n\r\n <!-- User Mappings Grid -->\r\n <div class=\"tw-bg-white tw-rounded-md tw-border tw-overflow-hidden tw-shadow-sm\">\r\n @if (userEntityMappingsLoading()) {\r\n <div class=\"tw-p-4 tw-text-center\">\r\n <div class=\"tw-inline-flex tw-items-center tw-gap-2 tw-text-gray-500\">\r\n <div class=\"tw-animate-spin tw-rounded-full tw-h-3 tw-w-3 tw-border-b-2 tw-border-gray-500\"></div>\r\n <span class=\"tw-text-xs\">Loading...</span>\r\n </div>\r\n </div>\r\n } @else if (userEntityMappings().length === 0) {\r\n <div class=\"tw-p-4 tw-text-center tw-text-gray-500\">\r\n <cide-ele-icon class=\"tw-text-2xl tw-mb-1 tw-text-gray-300\">people_outline</cide-ele-icon>\r\n <p class=\"tw-text-sm tw-font-medium tw-mb-1\">No users mapped yet</p>\r\n <p class=\"tw-text-xs tw-text-gray-400\">Add users above to grant them access to this entity</p>\r\n </div>\r\n } @else {\r\n <cide-ele-data-grid [config]=\"userMappingsGridConfig\" [templateRenderers]=\"getUserMappingsTemplateRenderers()\">\r\n\r\n <!-- Custom user cell template -->\r\n <ng-template #userCell let-row=\"row\">\r\n <div class=\"tw-flex tw-items-center tw-gap-2\">\r\n <div\r\n class=\"tw-w-6 tw-h-6 tw-bg-gradient-to-br tw-from-blue-100 tw-to-indigo-100 tw-rounded-full tw-flex tw-items-center tw-justify-center tw-shadow-sm\">\r\n <cide-ele-icon class=\"tw-text-blue-600 tw-text-xs\">person</cide-ele-icon>\r\n </div>\r\n <div class=\"tw-flex tw-flex-col\">\r\n <span class=\"tw-font-medium tw-text-gray-900 tw-text-xs\">\r\n {{ row?._displayUserName }}\r\n </span>\r\n </div>\r\n </div>\r\n </ng-template>\r\n\r\n <!-- Custom actions cell template -->\r\n <ng-template #actionsCell let-row=\"row\">\r\n <div class=\"tw-flex tw-items-center tw-gap-1 tw-justify-center\">\r\n <button\r\n (click)=\"updateUserMapping(row._id!, { syenm_isactive: !row.syenm_isactive })\"\r\n class=\"tw-w-8 tw-h-8 tw-flex tw-items-center tw-justify-center tw-rounded-md tw-transition-colors tw-border tw-border-transparent hover:tw-border-gray-300\"\r\n [class.tw-bg-green-100]=\"row.syenm_isactive\"\r\n [class.tw-text-green-700]=\"row.syenm_isactive\"\r\n [class.tw-bg-gray-100]=\"!row.syenm_isactive\"\r\n [class.tw-text-gray-600]=\"!row.syenm_isactive\"\r\n [title]=\"row.syenm_isactive ? 'Deactivate' : 'Activate'\">\r\n <cide-ele-icon class=\"tw-text-sm\">\r\n {{ row.syenm_isactive ? 'pause' : 'play_arrow' }}\r\n </cide-ele-icon>\r\n </button>\r\n\r\n <button (click)=\"removeUserMapping(row._id!)\"\r\n class=\"tw-w-8 tw-h-8 tw-flex tw-items-center tw-justify-center tw-rounded-md tw-bg-red-100 tw-text-red-600 hover:tw-bg-red-200 tw-transition-colors tw-border tw-border-transparent hover:tw-border-red-300\"\r\n title=\"Remove User\">\r\n <cide-ele-icon class=\"tw-text-sm\">delete</cide-ele-icon>\r\n </button>\r\n </div>\r\n </ng-template>\r\n </cide-ele-data-grid>\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n }\r\n\r\n }\r\n\r\n <!-- Form Actions -->\r\n <div class=\"tw-p-4\">\r\n <div class=\"tw-flex tw-items-center tw-justify-between tw-gap-3\">\r\n <!-- Error Message (Left Side) -->\r\n <cide-form-field-error [formGroup]=\"entityForm\"></cide-form-field-error>\r\n\r\n <!-- Action Buttons (Right Side) -->\r\n <div class=\"tw-flex tw-gap-3\">\r\n <button cideEleButton type=\"button\" variant=\"outline\" size=\"md\" (click)=\"onBack()\"\r\n [disabled]=\"loading()\">\r\n <cide-ele-icon>arrow_back</cide-ele-icon>\r\n Back\r\n </button>\r\n\r\n <button cideEleButton type=\"button\" variant=\"secondary\" size=\"md\" (click)=\"onReset()\"\r\n [disabled]=\"loading()\">\r\n <cide-ele-icon>refresh</cide-ele-icon>\r\n Reset Form\r\n </button>\r\n\r\n <button cideEleButton type=\"submit\" variant=\"primary\" size=\"md\"\r\n [disabled]=\"loading() || entityForm.invalid\" [loading]=\"loading()\">\r\n <cide-ele-icon>{{ isEditMode() ? 'save' : 'add' }}</cide-ele-icon>\r\n {{ isEditMode() ? 'Update Entity' : 'Create Entity' }}\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </form>\r\n </div>\r\n </div>\r\n</cide-lyt-shared-wrapper>" }]
|
|
11165
|
-
}], ctorParameters: () => [] });
|
|
11176
|
+
}], ctorParameters: () => [], propDecorators: { userCellRendererTemplate: [{ type: i0.ViewChild, args: ['userCell', { isSignal: true }] }], actionsCellRendererTemplate: [{ type: i0.ViewChild, args: ['actionsCell', { isSignal: true }] }] } });
|
|
11166
11177
|
|
|
11167
11178
|
var entityCreate_component = /*#__PURE__*/Object.freeze({
|
|
11168
11179
|
__proto__: null,
|
|
@@ -11303,7 +11314,7 @@ class CideCoreEntityListComponent {
|
|
|
11303
11314
|
tree: {
|
|
11304
11315
|
enabled: true,
|
|
11305
11316
|
primaryKey: '_id',
|
|
11306
|
-
foreignKey: '
|
|
11317
|
+
foreignKey: 'syen_id_syen',
|
|
11307
11318
|
childrenKey: 'children',
|
|
11308
11319
|
levelKey: 'level',
|
|
11309
11320
|
expandedKey: 'isExpanded',
|
|
@@ -11843,10 +11854,10 @@ class CideCoreEntityListComponent {
|
|
|
11843
11854
|
onOrgStructure() {
|
|
11844
11855
|
this.router.navigate(['/control-panel/org-structure']);
|
|
11845
11856
|
}
|
|
11846
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
11847
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.
|
|
11857
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreEntityListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
11858
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: CideCoreEntityListComponent, isStandalone: true, selector: "cide-core-entity-list", viewQueries: [{ propertyName: "gridComponent", first: true, predicate: CideEleDataGridComponent, descendants: true, isSignal: true }, { propertyName: "entityDetailsRenderer", first: true, predicate: ["entityDetailsRenderer"], descendants: true, isSignal: true }, { propertyName: "entityTypeRenderer", first: true, predicate: ["entityTypeRenderer"], descendants: true, isSignal: true }, { propertyName: "actionsDropdownRenderer", first: true, predicate: ["actionsDropdownRenderer"], descendants: true, isSignal: true }], ngImport: i0, template: "<!-- Entity List with Shared Wrapper -->\n<cide-lyt-shared-wrapper [shared_wrapper_setup_param]=\"{ sypg_page_code: 'core_entity_list' }\">\n<div class=\"entity-list-container tw-bg-white tw-shadow-lg tw-rounded-lg tw-overflow-hidden\">\n \n <!-- Header Section with Filters -->\n <div class=\"tw-px-6 tw-py-4 tw-border-b tw-border-gray-200 tw-bg-gray-50\">\n <div class=\"tw-flex tw-flex-col sm:tw-flex-row tw-justify-between tw-items-start sm:tw-items-center tw-space-y-4 sm:tw-space-y-0\">\n \n <!-- Title -->\n <div class=\"tw-flex tw-items-center tw-space-x-3\">\n <cide-ele-icon class=\"tw-text-blue-600\">apartment</cide-ele-icon>\n <div>\n <h5 class=\"tw-text-sm tw-font-semibold tw-text-gray-900\">Entity Management</h5>\n </div>\n </div>\n\n <!-- Actions -->\n <div class=\"tw-flex tw-items-center tw-space-x-3\">\n <!-- Entity Type Filter -->\n <div class=\"tw-flex tw-items-center tw-space-x-2\">\n <label for=\"entityTypeFilter\" class=\"tw-text-sm tw-font-medium tw-text-gray-700\">Type:</label>\n <cide-ele-select\n id=\"entityTypeFilter\"\n [options]=\"entityTypeOptions()\"\n [ngModel]=\"selectedEntityTypeValue\"\n (ngModelChange)=\"onEntityTypeChange($event)\"\n class=\"tw-min-w-40\">\n </cide-ele-select>\n </div>\n\n <!-- Org Structure Button -->\n <button\n cideEleButton\n variant=\"secondary\"\n size=\"sm\"\n (click)=\"onOrgStructure()\"\n class=\"tw-whitespace-nowrap tw-flex tw-items-center tw-gap-2\">\n <cide-ele-icon size=\"xs\" class=\"tw-w-6 tw-h-5\">account_tree</cide-ele-icon>\n Org Structure\n </button>\n\n <!-- Add Entity Button -->\n @if (canCreate()) {\n <button\n cideEleButton\n variant=\"primary\"\n size=\"sm\"\n (click)=\"router.navigate(['control-panel', 'entity-create'])\"\n class=\"tw-whitespace-nowrap tw-flex tw-items-center tw-gap-2\">\n <cide-ele-icon size=\"xs\" class=\"tw-w-6 tw-h-5\">add</cide-ele-icon>\n Add Entity\n </button>\n }\n </div>\n </div>\n\n <!-- Error Message -->\n @if (error()) {\n <div class=\"tw-mt-4 tw-p-4 tw-bg-red-50 tw-border tw-border-red-200 tw-rounded-md\">\n <div class=\"tw-flex\">\n <cide-ele-icon name=\"exclamation-triangle\" class=\"tw-text-red-400\"></cide-ele-icon>\n <div class=\"tw-ml-3\">\n <h3 class=\"tw-text-sm tw-font-medium tw-text-red-800\">Error</h3>\n <p class=\"tw-text-sm tw-text-red-700 tw-mt-1\">{{ error() }}</p>\n </div>\n </div>\n </div>\n }\n </div>\n\n <!-- Data Grid Component -->\n <cide-ele-data-grid\n [config]=\"gridConfig()\"\n [templateRenderers]=\"templateRenderers()\"\n [actionHandlers]=\"actionHandlers\"\n (gridEvent)=\"onGridEvent($event)\">\n </cide-ele-data-grid>\n\n</div>\n\n<!-- Custom Renderer Templates -->\n\n<!-- Entity Details Renderer Template -->\n<!-- Context: { $implicit: unknown, row: entityResponseData, value: unknown, column: GridColumn } -->\n<ng-template #entityDetailsRenderer let-value=\"value\" let-entity=\"row\">\n <div class=\"tw-flex tw-items-center tw-space-x-3\">\n <div class=\"tw-flex-shrink-0 tw-w-10 tw-h-10 tw-bg-blue-100 tw-rounded-full tw-flex tw-items-center tw-justify-center\">\n <span class=\"tw-text-blue-600 tw-font-semibold tw-text-sm\">\n {{ (entity.syen_entity_code || 'NA').substring(0, 2).toUpperCase() }}\n </span>\n </div>\n <div class=\"tw-flex-1 tw-min-w-0\">\n <p class=\"tw-text-sm tw-font-medium tw-text-gray-900 tw-truncate\" [title]=\"entity.syen_name || 'Unknown Entity'\">\n {{ entity.syen_name || 'Unknown Entity' }}\n </p>\n <p class=\"tw-text-sm tw-text-gray-500 tw-truncate\" [title]=\"entity.syen_entity_code || 'N/A'\">\n Code: {{ entity.syen_entity_code || 'N/A' }}\n </p>\n </div>\n </div>\n</ng-template>\n\n\n<!-- Entity Type Renderer Template -->\n<!-- Context: { $implicit: unknown, row: entityResponseData, value: unknown, column: GridColumn } -->\n<ng-template #entityTypeRenderer let-value=\"value\" let-entity=\"row\">\n <div class=\"tw-flex tw-flex-col tw-items-center tw-space-y-1\">\n <span class=\"tw-text-sm tw-font-medium tw-text-gray-900 tw-truncate\" [title]=\"getEntityTypeName(entity)\">\n {{ getEntityTypeName(entity) }}\n </span>\n </div>\n</ng-template>\n\n<!-- Actions Dropdown Renderer Template -->\n<!-- Context: { $implicit: unknown, row: entityResponseData, value: unknown, column: GridColumn } -->\n<ng-template #actionsDropdownRenderer let-value=\"value\" let-entity=\"row\">\n <cide-ele-dropdown \n [items]=\"getDropdownItems(entity)\"\n [config]=\"getDropdownConfig()\"\n (itemClick)=\"onDropdownItemClick($event, entity)\">\n </cide-ele-dropdown>\n</ng-template>\n</cide-lyt-shared-wrapper>\n", styles: ["", ":host{height:100%;display:flex;flex-direction:column}.entity-list-container{height:100%;display:flex;flex-direction:column;overflow:hidden}.tw-overflow-auto{flex:1;min-height:0}cide-ele-data-grid{flex:1;min-height:0;display:flex;flex-direction:column}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: CideIconComponent, selector: "cide-ele-icon", inputs: ["size", "type", "toolTip"] }, { kind: "component", type: CideEleButtonComponent, selector: "button[cideEleButton], a[cideEleButton], cide-ele-button", inputs: ["label", "variant", "size", "type", "shape", "elevation", "disabled", "id", "loading", "fullWidth", "leftIcon", "rightIcon", "customClass", "tooltip", "ariaLabel", "testId", "routerLink", "routerExtras", "preventDoubleClick", "animated"], outputs: ["btnClick", "doubleClick"] }, { kind: "component", type: CideSelectComponent, selector: "cide-ele-select", inputs: ["label", "labelHide", "placeholder", "helperText", "errorText", "required", "disabled", "id", "ngModel", "size", "fill", "labelPlacement", "labelDir", "leadingIcon", "trailingIcon", "clearInput", "options", "multiple", "searchable", "showSearchInput", "loading", "valueKey", "labelKey", "treeView"], outputs: ["ngModelChange", "change", "searchChange"] }, { kind: "component", type: CideEleDataGridComponent, selector: "cide-ele-data-grid", inputs: ["config", "templateRenderers", "customFormatters", "actionHandlers", "serverSidePagination", "totalServerItems", "currentServerPage", "currentServerPageSize", "dragDropEnabled"], outputs: ["gridEvent"] }, { kind: "component", type: CideEleDropdownComponent, selector: "cide-ele-dropdown", inputs: ["items", "config", "triggerTemplate", "menuTemplate"], outputs: ["itemClick", "dropdownToggle"] }, { kind: "component", type: CideLytSharedWrapperComponent, selector: "cide-lyt-shared-wrapper", inputs: ["shared_wrapper_setup_param", "breadcrumb_data"] }] });
|
|
11848
11859
|
}
|
|
11849
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
11860
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreEntityListComponent, decorators: [{
|
|
11850
11861
|
type: Component,
|
|
11851
11862
|
args: [{ selector: 'cide-core-entity-list', imports: [
|
|
11852
11863
|
CommonModule,
|
|
@@ -11858,7 +11869,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImpor
|
|
|
11858
11869
|
CideEleDropdownComponent,
|
|
11859
11870
|
CideLytSharedWrapperComponent
|
|
11860
11871
|
], template: "<!-- Entity List with Shared Wrapper -->\n<cide-lyt-shared-wrapper [shared_wrapper_setup_param]=\"{ sypg_page_code: 'core_entity_list' }\">\n<div class=\"entity-list-container tw-bg-white tw-shadow-lg tw-rounded-lg tw-overflow-hidden\">\n \n <!-- Header Section with Filters -->\n <div class=\"tw-px-6 tw-py-4 tw-border-b tw-border-gray-200 tw-bg-gray-50\">\n <div class=\"tw-flex tw-flex-col sm:tw-flex-row tw-justify-between tw-items-start sm:tw-items-center tw-space-y-4 sm:tw-space-y-0\">\n \n <!-- Title -->\n <div class=\"tw-flex tw-items-center tw-space-x-3\">\n <cide-ele-icon class=\"tw-text-blue-600\">apartment</cide-ele-icon>\n <div>\n <h5 class=\"tw-text-sm tw-font-semibold tw-text-gray-900\">Entity Management</h5>\n </div>\n </div>\n\n <!-- Actions -->\n <div class=\"tw-flex tw-items-center tw-space-x-3\">\n <!-- Entity Type Filter -->\n <div class=\"tw-flex tw-items-center tw-space-x-2\">\n <label for=\"entityTypeFilter\" class=\"tw-text-sm tw-font-medium tw-text-gray-700\">Type:</label>\n <cide-ele-select\n id=\"entityTypeFilter\"\n [options]=\"entityTypeOptions()\"\n [ngModel]=\"selectedEntityTypeValue\"\n (ngModelChange)=\"onEntityTypeChange($event)\"\n class=\"tw-min-w-40\">\n </cide-ele-select>\n </div>\n\n <!-- Org Structure Button -->\n <button\n cideEleButton\n variant=\"secondary\"\n size=\"sm\"\n (click)=\"onOrgStructure()\"\n class=\"tw-whitespace-nowrap tw-flex tw-items-center tw-gap-2\">\n <cide-ele-icon size=\"xs\" class=\"tw-w-6 tw-h-5\">account_tree</cide-ele-icon>\n Org Structure\n </button>\n\n <!-- Add Entity Button -->\n @if (canCreate()) {\n <button\n cideEleButton\n variant=\"primary\"\n size=\"sm\"\n (click)=\"router.navigate(['control-panel', 'entity-create'])\"\n class=\"tw-whitespace-nowrap tw-flex tw-items-center tw-gap-2\">\n <cide-ele-icon size=\"xs\" class=\"tw-w-6 tw-h-5\">add</cide-ele-icon>\n Add Entity\n </button>\n }\n </div>\n </div>\n\n <!-- Error Message -->\n @if (error()) {\n <div class=\"tw-mt-4 tw-p-4 tw-bg-red-50 tw-border tw-border-red-200 tw-rounded-md\">\n <div class=\"tw-flex\">\n <cide-ele-icon name=\"exclamation-triangle\" class=\"tw-text-red-400\"></cide-ele-icon>\n <div class=\"tw-ml-3\">\n <h3 class=\"tw-text-sm tw-font-medium tw-text-red-800\">Error</h3>\n <p class=\"tw-text-sm tw-text-red-700 tw-mt-1\">{{ error() }}</p>\n </div>\n </div>\n </div>\n }\n </div>\n\n <!-- Data Grid Component -->\n <cide-ele-data-grid\n [config]=\"gridConfig()\"\n [templateRenderers]=\"templateRenderers()\"\n [actionHandlers]=\"actionHandlers\"\n (gridEvent)=\"onGridEvent($event)\">\n </cide-ele-data-grid>\n\n</div>\n\n<!-- Custom Renderer Templates -->\n\n<!-- Entity Details Renderer Template -->\n<!-- Context: { $implicit: unknown, row: entityResponseData, value: unknown, column: GridColumn } -->\n<ng-template #entityDetailsRenderer let-value=\"value\" let-entity=\"row\">\n <div class=\"tw-flex tw-items-center tw-space-x-3\">\n <div class=\"tw-flex-shrink-0 tw-w-10 tw-h-10 tw-bg-blue-100 tw-rounded-full tw-flex tw-items-center tw-justify-center\">\n <span class=\"tw-text-blue-600 tw-font-semibold tw-text-sm\">\n {{ (entity.syen_entity_code || 'NA').substring(0, 2).toUpperCase() }}\n </span>\n </div>\n <div class=\"tw-flex-1 tw-min-w-0\">\n <p class=\"tw-text-sm tw-font-medium tw-text-gray-900 tw-truncate\" [title]=\"entity.syen_name || 'Unknown Entity'\">\n {{ entity.syen_name || 'Unknown Entity' }}\n </p>\n <p class=\"tw-text-sm tw-text-gray-500 tw-truncate\" [title]=\"entity.syen_entity_code || 'N/A'\">\n Code: {{ entity.syen_entity_code || 'N/A' }}\n </p>\n </div>\n </div>\n</ng-template>\n\n\n<!-- Entity Type Renderer Template -->\n<!-- Context: { $implicit: unknown, row: entityResponseData, value: unknown, column: GridColumn } -->\n<ng-template #entityTypeRenderer let-value=\"value\" let-entity=\"row\">\n <div class=\"tw-flex tw-flex-col tw-items-center tw-space-y-1\">\n <span class=\"tw-text-sm tw-font-medium tw-text-gray-900 tw-truncate\" [title]=\"getEntityTypeName(entity)\">\n {{ getEntityTypeName(entity) }}\n </span>\n </div>\n</ng-template>\n\n<!-- Actions Dropdown Renderer Template -->\n<!-- Context: { $implicit: unknown, row: entityResponseData, value: unknown, column: GridColumn } -->\n<ng-template #actionsDropdownRenderer let-value=\"value\" let-entity=\"row\">\n <cide-ele-dropdown \n [items]=\"getDropdownItems(entity)\"\n [config]=\"getDropdownConfig()\"\n (itemClick)=\"onDropdownItemClick($event, entity)\">\n </cide-ele-dropdown>\n</ng-template>\n</cide-lyt-shared-wrapper>\n", styles: [":host{height:100%;display:flex;flex-direction:column}.entity-list-container{height:100%;display:flex;flex-direction:column;overflow:hidden}.tw-overflow-auto{flex:1;min-height:0}cide-ele-data-grid{flex:1;min-height:0;display:flex;flex-direction:column}\n"] }]
|
|
11861
|
-
}] });
|
|
11872
|
+
}], propDecorators: { gridComponent: [{ type: i0.ViewChild, args: [i0.forwardRef(() => CideEleDataGridComponent), { isSignal: true }] }], entityDetailsRenderer: [{ type: i0.ViewChild, args: ['entityDetailsRenderer', { isSignal: true }] }], entityTypeRenderer: [{ type: i0.ViewChild, args: ['entityTypeRenderer', { isSignal: true }] }], actionsDropdownRenderer: [{ type: i0.ViewChild, args: ['actionsDropdownRenderer', { isSignal: true }] }] } });
|
|
11862
11873
|
|
|
11863
11874
|
var entityList_component = /*#__PURE__*/Object.freeze({
|
|
11864
11875
|
__proto__: null,
|
|
@@ -11903,8 +11914,8 @@ class CideCoreOrgStructureComponent {
|
|
|
11903
11914
|
onEntityView(entity) {
|
|
11904
11915
|
this.entityView.emit(entity);
|
|
11905
11916
|
}
|
|
11906
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
11907
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.
|
|
11917
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreOrgStructureComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
11918
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.15", type: CideCoreOrgStructureComponent, isStandalone: true, selector: "cide-core-org-structure", inputs: { allowSwitching: { classPropertyName: "allowSwitching", publicName: "allowSwitching", isSignal: true, isRequired: false, transformFunction: null }, showActions: { classPropertyName: "showActions", publicName: "showActions", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { entityClick: "entityClick", entitySelect: "entitySelect", entityView: "entityView" }, ngImport: i0, template: `
|
|
11908
11919
|
<cide-lyt-shared-wrapper [shared_wrapper_setup_param]="{ sypg_page_code: 'org_structure' }">
|
|
11909
11920
|
|
|
11910
11921
|
<!-- Back Button using standard content projection -->
|
|
@@ -11932,7 +11943,7 @@ class CideCoreOrgStructureComponent {
|
|
|
11932
11943
|
</cide-lyt-shared-wrapper>
|
|
11933
11944
|
`, isInline: true, styles: [":host{height:100%;display:flex;flex-direction:column}.tw-overflow-y-auto::-webkit-scrollbar{width:6px}.tw-overflow-y-auto::-webkit-scrollbar-track{background:#f1f5f9;border-radius:3px}.tw-overflow-y-auto::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:3px}.tw-overflow-y-auto::-webkit-scrollbar-thumb:hover{background:#94a3b8}.tw-transition-shadow{transition:box-shadow .2s ease-in-out}.tw-shadow-lg:hover{box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a;transform:translateY(-2px);transition:all .2s ease-in-out}.tw-bg-purple-300,.tw-bg-purple-400{transition:all .3s ease-in-out}.connection-line-compact{display:block;overflow:visible}.connection-line-compact path,.connection-line-compact line{stroke-linecap:round;stroke-linejoin:round;transition:stroke-width .2s ease}.connection-line-compact:hover path,.connection-line-compact:hover line{stroke-width:3}.connection-line-compact circle{transition:all .2s ease}.connection-line-compact circle:hover{filter:drop-shadow(0 2px 4px rgba(147,51,234,.4))}.level-0{border-color:#fb923c!important}.level-1{border-color:#60a5fa!important}.level-2{border-color:#a78bfa!important}.level-3{border-color:#4ade80!important}.level-4{border-color:#818cf8!important}.level-5{border-color:#f472b6!important}@media (max-width: 1200px){.tw-max-w-7xl{max-width:100%}.tw-gap-6{gap:1rem}.tw-min-w-64{min-width:14rem}.tw-max-w-72{max-width:16rem}}@media (max-width: 768px){.tw-min-w-64{min-width:12rem}.tw-max-w-72{max-width:14rem}.tw-max-w-7xl{max-width:100%}.tw-gap-6{gap:.75rem}.tw-p-4{padding:.75rem}.tw-mb-4{margin-bottom:.75rem}.tw-space-x-3{gap:.5rem}.tw-space-x-2{gap:.375rem}.tw-w-12{width:2.5rem}.tw-h-12{height:2.5rem}}@media (max-width: 480px){.tw-min-w-72{min-width:12rem}.tw-max-w-80{max-width:14rem}.tw-p-4{padding:.5rem}.tw-space-x-3{gap:.375rem}.tw-space-x-2{gap:.25rem}.tw-mb-3{margin-bottom:.5rem}.tw-w-12{width:2rem}.tw-h-12{height:2rem}.tw-w-8{width:1.5rem}.tw-h-8{height:1.5rem}}@media print{.tw-bg-gray-50{background:#fff!important}.tw-shadow-lg{box-shadow:none!important;border:1px solid #e5e7eb!important}.tw-bg-purple-300{background:#6b7280!important}.tw-border-purple-300{border-color:#6b7280!important}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: CideSharedOrgStructureComponent, selector: "cide-shared-org-structure", inputs: ["allowSwitching", "showActions", "mode"], outputs: ["entityClick", "entitySelect", "entityView"] }, { kind: "component", type: CideIconComponent, selector: "cide-ele-icon", inputs: ["size", "type", "toolTip"] }, { kind: "component", type: CideLytSharedWrapperComponent, selector: "cide-lyt-shared-wrapper", inputs: ["shared_wrapper_setup_param", "breadcrumb_data"] }] });
|
|
11934
11945
|
}
|
|
11935
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
11946
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreOrgStructureComponent, decorators: [{
|
|
11936
11947
|
type: Component,
|
|
11937
11948
|
args: [{ selector: 'cide-core-org-structure', imports: [
|
|
11938
11949
|
CommonModule,
|
|
@@ -11966,7 +11977,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImpor
|
|
|
11966
11977
|
</cide-shared-org-structure>
|
|
11967
11978
|
</cide-lyt-shared-wrapper>
|
|
11968
11979
|
`, styles: [":host{height:100%;display:flex;flex-direction:column}.tw-overflow-y-auto::-webkit-scrollbar{width:6px}.tw-overflow-y-auto::-webkit-scrollbar-track{background:#f1f5f9;border-radius:3px}.tw-overflow-y-auto::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:3px}.tw-overflow-y-auto::-webkit-scrollbar-thumb:hover{background:#94a3b8}.tw-transition-shadow{transition:box-shadow .2s ease-in-out}.tw-shadow-lg:hover{box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a;transform:translateY(-2px);transition:all .2s ease-in-out}.tw-bg-purple-300,.tw-bg-purple-400{transition:all .3s ease-in-out}.connection-line-compact{display:block;overflow:visible}.connection-line-compact path,.connection-line-compact line{stroke-linecap:round;stroke-linejoin:round;transition:stroke-width .2s ease}.connection-line-compact:hover path,.connection-line-compact:hover line{stroke-width:3}.connection-line-compact circle{transition:all .2s ease}.connection-line-compact circle:hover{filter:drop-shadow(0 2px 4px rgba(147,51,234,.4))}.level-0{border-color:#fb923c!important}.level-1{border-color:#60a5fa!important}.level-2{border-color:#a78bfa!important}.level-3{border-color:#4ade80!important}.level-4{border-color:#818cf8!important}.level-5{border-color:#f472b6!important}@media (max-width: 1200px){.tw-max-w-7xl{max-width:100%}.tw-gap-6{gap:1rem}.tw-min-w-64{min-width:14rem}.tw-max-w-72{max-width:16rem}}@media (max-width: 768px){.tw-min-w-64{min-width:12rem}.tw-max-w-72{max-width:14rem}.tw-max-w-7xl{max-width:100%}.tw-gap-6{gap:.75rem}.tw-p-4{padding:.75rem}.tw-mb-4{margin-bottom:.75rem}.tw-space-x-3{gap:.5rem}.tw-space-x-2{gap:.375rem}.tw-w-12{width:2.5rem}.tw-h-12{height:2.5rem}}@media (max-width: 480px){.tw-min-w-72{min-width:12rem}.tw-max-w-80{max-width:14rem}.tw-p-4{padding:.5rem}.tw-space-x-3{gap:.375rem}.tw-space-x-2{gap:.25rem}.tw-mb-3{margin-bottom:.5rem}.tw-w-12{width:2rem}.tw-h-12{height:2rem}.tw-w-8{width:1.5rem}.tw-h-8{height:1.5rem}}@media print{.tw-bg-gray-50{background:#fff!important}.tw-shadow-lg{box-shadow:none!important;border:1px solid #e5e7eb!important}.tw-bg-purple-300{background:#6b7280!important}.tw-border-purple-300{border-color:#6b7280!important}}\n"] }]
|
|
11969
|
-
}] });
|
|
11980
|
+
}], propDecorators: { allowSwitching: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowSwitching", required: false }] }], showActions: [{ type: i0.Input, args: [{ isSignal: true, alias: "showActions", required: false }] }], mode: [{ type: i0.Input, args: [{ isSignal: true, alias: "mode", required: false }] }], entityClick: [{ type: i0.Output, args: ["entityClick"] }], entitySelect: [{ type: i0.Output, args: ["entitySelect"] }], entityView: [{ type: i0.Output, args: ["entityView"] }] } });
|
|
11970
11981
|
|
|
11971
11982
|
var orgStructure_component = /*#__PURE__*/Object.freeze({
|
|
11972
11983
|
__proto__: null,
|
|
@@ -11990,8 +12001,8 @@ class EntitySelectionDrawerComponent {
|
|
|
11990
12001
|
// Close the floating container on cancel
|
|
11991
12002
|
this.floatingContainerService.hide('entity-selection-for-mapping');
|
|
11992
12003
|
}
|
|
11993
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
11994
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.
|
|
12004
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: EntitySelectionDrawerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
12005
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: EntitySelectionDrawerComponent, isStandalone: true, selector: "cide-entity-selection-drawer", inputs: { entities: { classPropertyName: "entities", publicName: "entities", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { entitySelect: "entitySelect", cancel: "cancel" }, ngImport: i0, template: `
|
|
11995
12006
|
<div class="tw-flex tw-flex-col tw-h-full">
|
|
11996
12007
|
<!-- Content -->
|
|
11997
12008
|
<div class="tw-flex-1 tw-overflow-y-auto tw-p-3">
|
|
@@ -12037,7 +12048,7 @@ class EntitySelectionDrawerComponent {
|
|
|
12037
12048
|
</div>
|
|
12038
12049
|
`, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: CideEleButtonComponent, selector: "button[cideEleButton], a[cideEleButton], cide-ele-button", inputs: ["label", "variant", "size", "type", "shape", "elevation", "disabled", "id", "loading", "fullWidth", "leftIcon", "rightIcon", "customClass", "tooltip", "ariaLabel", "testId", "routerLink", "routerExtras", "preventDoubleClick", "animated"], outputs: ["btnClick", "doubleClick"] }, { kind: "component", type: CideIconComponent, selector: "cide-ele-icon", inputs: ["size", "type", "toolTip"] }] });
|
|
12039
12050
|
}
|
|
12040
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
12051
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: EntitySelectionDrawerComponent, decorators: [{
|
|
12041
12052
|
type: Component,
|
|
12042
12053
|
args: [{ selector: 'cide-entity-selection-drawer', standalone: true, imports: [CommonModule, CideEleButtonComponent, CideIconComponent], template: `
|
|
12043
12054
|
<div class="tw-flex tw-flex-col tw-h-full">
|
|
@@ -12084,7 +12095,158 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImpor
|
|
|
12084
12095
|
</div>
|
|
12085
12096
|
</div>
|
|
12086
12097
|
` }]
|
|
12087
|
-
}] });
|
|
12098
|
+
}], propDecorators: { entities: [{ type: i0.Input, args: [{ isSignal: true, alias: "entities", required: true }] }], entitySelect: [{ type: i0.Output, args: ["entitySelect"] }], cancel: [{ type: i0.Output, args: ["cancel"] }] } });
|
|
12099
|
+
|
|
12100
|
+
class CopyRoleFromEntityDrawerComponent {
|
|
12101
|
+
entityMappings = input.required(...(ngDevMode ? [{ debugName: "entityMappings" }] : []));
|
|
12102
|
+
mappingSelect = output();
|
|
12103
|
+
cancel = output();
|
|
12104
|
+
floatingContainerService = inject(CideEleFloatingContainerService);
|
|
12105
|
+
onMappingSelect(entityId) {
|
|
12106
|
+
this.mappingSelect.emit(entityId);
|
|
12107
|
+
// Close the floating container after selection
|
|
12108
|
+
this.floatingContainerService.hide('copy-role-from-entity');
|
|
12109
|
+
}
|
|
12110
|
+
onCancel() {
|
|
12111
|
+
this.cancel.emit();
|
|
12112
|
+
// Close the floating container on cancel
|
|
12113
|
+
this.floatingContainerService.hide('copy-role-from-entity');
|
|
12114
|
+
}
|
|
12115
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CopyRoleFromEntityDrawerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
12116
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: CopyRoleFromEntityDrawerComponent, isStandalone: true, selector: "cide-copy-role-from-entity-drawer", inputs: { entityMappings: { classPropertyName: "entityMappings", publicName: "entityMappings", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { mappingSelect: "mappingSelect", cancel: "cancel" }, ngImport: i0, template: `
|
|
12117
|
+
<div class="tw-flex tw-flex-col tw-h-full">
|
|
12118
|
+
<!-- Header Description -->
|
|
12119
|
+
<div class="tw-px-3 tw-py-2 tw-bg-blue-50 dark:tw-bg-blue-900/20 tw-border-b tw-border-blue-200 dark:tw-border-blue-700">
|
|
12120
|
+
<p class="tw-text-xs tw-text-blue-700 dark:tw-text-blue-300 tw-m-0">
|
|
12121
|
+
Select an entity mapping to copy role, department, designation, and menu rights from.
|
|
12122
|
+
</p>
|
|
12123
|
+
</div>
|
|
12124
|
+
|
|
12125
|
+
<!-- Content -->
|
|
12126
|
+
<div class="tw-flex-1 tw-overflow-y-auto tw-p-3">
|
|
12127
|
+
<!-- Entity Mappings List -->
|
|
12128
|
+
<div class="tw-space-y-2">
|
|
12129
|
+
@for (mapping of entityMappings(); track mapping.entityId) {
|
|
12130
|
+
@if (mapping.entityId) {
|
|
12131
|
+
<button
|
|
12132
|
+
type="button"
|
|
12133
|
+
(click)="onMappingSelect(mapping.entityId)"
|
|
12134
|
+
class="tw-w-full tw-text-left tw-px-3 tw-py-3 tw-border tw-border-gray-200 dark:tw-border-gray-700 tw-rounded-md tw-transition-all hover:tw-border-blue-400 dark:hover:tw-border-blue-500 hover:tw-bg-blue-50 dark:hover:tw-bg-blue-900/20 tw-bg-white dark:tw-bg-gray-800 tw-cursor-pointer">
|
|
12135
|
+
<div class="tw-flex tw-items-start tw-justify-between tw-gap-2">
|
|
12136
|
+
<div class="tw-flex-1 tw-min-w-0">
|
|
12137
|
+
<div class="tw-font-semibold tw-text-gray-900 dark:tw-text-gray-100 tw-mb-1">
|
|
12138
|
+
{{ mapping.entityName }}
|
|
12139
|
+
</div>
|
|
12140
|
+
@if (mapping.entityCode) {
|
|
12141
|
+
<div class="tw-text-xs tw-text-gray-500 dark:tw-text-gray-400 tw-mb-1">
|
|
12142
|
+
{{ mapping.entityCode }}
|
|
12143
|
+
</div>
|
|
12144
|
+
}
|
|
12145
|
+
@if (mapping.roleName) {
|
|
12146
|
+
<div class="tw-flex tw-items-center tw-gap-1 tw-mt-2">
|
|
12147
|
+
<cide-ele-icon variant="blue" size="xs">admin_panel_settings</cide-ele-icon>
|
|
12148
|
+
<span class="tw-text-xs tw-text-blue-600 dark:tw-text-blue-400 tw-font-medium">
|
|
12149
|
+
Role: {{ mapping.roleName }}
|
|
12150
|
+
</span>
|
|
12151
|
+
</div>
|
|
12152
|
+
}
|
|
12153
|
+
</div>
|
|
12154
|
+
<cide-ele-icon variant="blue" size="sm" class="tw-flex-shrink-0">content_copy</cide-ele-icon>
|
|
12155
|
+
</div>
|
|
12156
|
+
</button>
|
|
12157
|
+
}
|
|
12158
|
+
} @empty {
|
|
12159
|
+
<div class="tw-text-center tw-py-8 tw-text-gray-500 dark:tw-text-gray-400">
|
|
12160
|
+
<cide-ele-icon variant="gray" size="lg" class="tw-mb-2">info</cide-ele-icon>
|
|
12161
|
+
<p class="tw-text-sm tw-font-medium tw-mb-1">No Entity Mappings Available</p>
|
|
12162
|
+
<p class="tw-text-xs">You need at least one entity mapping to copy from.</p>
|
|
12163
|
+
</div>
|
|
12164
|
+
}
|
|
12165
|
+
</div>
|
|
12166
|
+
</div>
|
|
12167
|
+
|
|
12168
|
+
<!-- Footer -->
|
|
12169
|
+
<div class="tw-border-t tw-border-gray-200 dark:tw-border-gray-700 tw-px-3 tw-py-2 tw-flex tw-justify-end tw-flex-shrink-0 tw-bg-white dark:tw-bg-gray-800">
|
|
12170
|
+
<button
|
|
12171
|
+
cideEleButton
|
|
12172
|
+
variant="secondary"
|
|
12173
|
+
size="xs"
|
|
12174
|
+
type="button"
|
|
12175
|
+
(click)="onCancel()">
|
|
12176
|
+
Cancel
|
|
12177
|
+
</button>
|
|
12178
|
+
</div>
|
|
12179
|
+
</div>
|
|
12180
|
+
`, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: CideEleButtonComponent, selector: "button[cideEleButton], a[cideEleButton], cide-ele-button", inputs: ["label", "variant", "size", "type", "shape", "elevation", "disabled", "id", "loading", "fullWidth", "leftIcon", "rightIcon", "customClass", "tooltip", "ariaLabel", "testId", "routerLink", "routerExtras", "preventDoubleClick", "animated"], outputs: ["btnClick", "doubleClick"] }, { kind: "component", type: CideIconComponent, selector: "cide-ele-icon", inputs: ["size", "type", "toolTip"] }] });
|
|
12181
|
+
}
|
|
12182
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CopyRoleFromEntityDrawerComponent, decorators: [{
|
|
12183
|
+
type: Component,
|
|
12184
|
+
args: [{ selector: 'cide-copy-role-from-entity-drawer', standalone: true, imports: [CommonModule, CideEleButtonComponent, CideIconComponent], template: `
|
|
12185
|
+
<div class="tw-flex tw-flex-col tw-h-full">
|
|
12186
|
+
<!-- Header Description -->
|
|
12187
|
+
<div class="tw-px-3 tw-py-2 tw-bg-blue-50 dark:tw-bg-blue-900/20 tw-border-b tw-border-blue-200 dark:tw-border-blue-700">
|
|
12188
|
+
<p class="tw-text-xs tw-text-blue-700 dark:tw-text-blue-300 tw-m-0">
|
|
12189
|
+
Select an entity mapping to copy role, department, designation, and menu rights from.
|
|
12190
|
+
</p>
|
|
12191
|
+
</div>
|
|
12192
|
+
|
|
12193
|
+
<!-- Content -->
|
|
12194
|
+
<div class="tw-flex-1 tw-overflow-y-auto tw-p-3">
|
|
12195
|
+
<!-- Entity Mappings List -->
|
|
12196
|
+
<div class="tw-space-y-2">
|
|
12197
|
+
@for (mapping of entityMappings(); track mapping.entityId) {
|
|
12198
|
+
@if (mapping.entityId) {
|
|
12199
|
+
<button
|
|
12200
|
+
type="button"
|
|
12201
|
+
(click)="onMappingSelect(mapping.entityId)"
|
|
12202
|
+
class="tw-w-full tw-text-left tw-px-3 tw-py-3 tw-border tw-border-gray-200 dark:tw-border-gray-700 tw-rounded-md tw-transition-all hover:tw-border-blue-400 dark:hover:tw-border-blue-500 hover:tw-bg-blue-50 dark:hover:tw-bg-blue-900/20 tw-bg-white dark:tw-bg-gray-800 tw-cursor-pointer">
|
|
12203
|
+
<div class="tw-flex tw-items-start tw-justify-between tw-gap-2">
|
|
12204
|
+
<div class="tw-flex-1 tw-min-w-0">
|
|
12205
|
+
<div class="tw-font-semibold tw-text-gray-900 dark:tw-text-gray-100 tw-mb-1">
|
|
12206
|
+
{{ mapping.entityName }}
|
|
12207
|
+
</div>
|
|
12208
|
+
@if (mapping.entityCode) {
|
|
12209
|
+
<div class="tw-text-xs tw-text-gray-500 dark:tw-text-gray-400 tw-mb-1">
|
|
12210
|
+
{{ mapping.entityCode }}
|
|
12211
|
+
</div>
|
|
12212
|
+
}
|
|
12213
|
+
@if (mapping.roleName) {
|
|
12214
|
+
<div class="tw-flex tw-items-center tw-gap-1 tw-mt-2">
|
|
12215
|
+
<cide-ele-icon variant="blue" size="xs">admin_panel_settings</cide-ele-icon>
|
|
12216
|
+
<span class="tw-text-xs tw-text-blue-600 dark:tw-text-blue-400 tw-font-medium">
|
|
12217
|
+
Role: {{ mapping.roleName }}
|
|
12218
|
+
</span>
|
|
12219
|
+
</div>
|
|
12220
|
+
}
|
|
12221
|
+
</div>
|
|
12222
|
+
<cide-ele-icon variant="blue" size="sm" class="tw-flex-shrink-0">content_copy</cide-ele-icon>
|
|
12223
|
+
</div>
|
|
12224
|
+
</button>
|
|
12225
|
+
}
|
|
12226
|
+
} @empty {
|
|
12227
|
+
<div class="tw-text-center tw-py-8 tw-text-gray-500 dark:tw-text-gray-400">
|
|
12228
|
+
<cide-ele-icon variant="gray" size="lg" class="tw-mb-2">info</cide-ele-icon>
|
|
12229
|
+
<p class="tw-text-sm tw-font-medium tw-mb-1">No Entity Mappings Available</p>
|
|
12230
|
+
<p class="tw-text-xs">You need at least one entity mapping to copy from.</p>
|
|
12231
|
+
</div>
|
|
12232
|
+
}
|
|
12233
|
+
</div>
|
|
12234
|
+
</div>
|
|
12235
|
+
|
|
12236
|
+
<!-- Footer -->
|
|
12237
|
+
<div class="tw-border-t tw-border-gray-200 dark:tw-border-gray-700 tw-px-3 tw-py-2 tw-flex tw-justify-end tw-flex-shrink-0 tw-bg-white dark:tw-bg-gray-800">
|
|
12238
|
+
<button
|
|
12239
|
+
cideEleButton
|
|
12240
|
+
variant="secondary"
|
|
12241
|
+
size="xs"
|
|
12242
|
+
type="button"
|
|
12243
|
+
(click)="onCancel()">
|
|
12244
|
+
Cancel
|
|
12245
|
+
</button>
|
|
12246
|
+
</div>
|
|
12247
|
+
</div>
|
|
12248
|
+
` }]
|
|
12249
|
+
}], propDecorators: { entityMappings: [{ type: i0.Input, args: [{ isSignal: true, alias: "entityMappings", required: true }] }], mappingSelect: [{ type: i0.Output, args: ["mappingSelect"] }], cancel: [{ type: i0.Output, args: ["cancel"] }] } });
|
|
12088
12250
|
|
|
12089
12251
|
class CideCoreUserCreateComponent {
|
|
12090
12252
|
// Dependency injection
|
|
@@ -12118,6 +12280,12 @@ class CideCoreUserCreateComponent {
|
|
|
12118
12280
|
userId = signal('', ...(ngDevMode ? [{ debugName: "userId" }] : []));
|
|
12119
12281
|
isEditMode = signal(false, ...(ngDevMode ? [{ debugName: "isEditMode" }] : []));
|
|
12120
12282
|
showPasswordFields = signal(false, ...(ngDevMode ? [{ debugName: "showPasswordFields" }] : [])); // Controls password fields visibility in edit mode
|
|
12283
|
+
// Check if viewing own profile (for disabling entity mapping modifications)
|
|
12284
|
+
isViewingOwnProfile = computed(() => {
|
|
12285
|
+
const routeUserId = this.userId();
|
|
12286
|
+
const currentUserId = this.appState.currentUser()?._id;
|
|
12287
|
+
return routeUserId && currentUserId && routeUserId === currentUserId;
|
|
12288
|
+
}, ...(ngDevMode ? [{ debugName: "isViewingOwnProfile" }] : []));
|
|
12121
12289
|
// User type information from route data (TEACHER, STUDENT, USER, etc.)
|
|
12122
12290
|
userType = signal(null, ...(ngDevMode ? [{ debugName: "userType" }] : []));
|
|
12123
12291
|
typeSpecificId = signal(null, ...(ngDevMode ? [{ debugName: "typeSpecificId" }] : []));
|
|
@@ -12169,6 +12337,8 @@ class CideCoreUserCreateComponent {
|
|
|
12169
12337
|
entityMappings = signal([], ...(ngDevMode ? [{ debugName: "entityMappings" }] : []));
|
|
12170
12338
|
menuRightsMap = signal({}, ...(ngDevMode ? [{ debugName: "menuRightsMap" }] : []));
|
|
12171
12339
|
allUserTypeMappings = signal([], ...(ngDevMode ? [{ debugName: "allUserTypeMappings" }] : [])); // All user type mappings across all entities
|
|
12340
|
+
// Track target mapping index for copying role from another entity
|
|
12341
|
+
targetMappingIndexForCopy = signal(null, ...(ngDevMode ? [{ debugName: "targetMappingIndexForCopy" }] : []));
|
|
12172
12342
|
// Cache for role permissions to avoid redundant API calls
|
|
12173
12343
|
rolePermissionsCache = signal({}, ...(ngDevMode ? [{ debugName: "rolePermissionsCache" }] : []));
|
|
12174
12344
|
// Track which mappings have already loaded their data (to avoid redundant loads)
|
|
@@ -13616,6 +13786,211 @@ class CideCoreUserCreateComponent {
|
|
|
13616
13786
|
this.loadRolesForEntity(newIndex, entityId);
|
|
13617
13787
|
});
|
|
13618
13788
|
}
|
|
13789
|
+
/**
|
|
13790
|
+
* Show copy role from entity drawer
|
|
13791
|
+
* @param targetMappingIndex Index of the mapping to copy TO
|
|
13792
|
+
*/
|
|
13793
|
+
showCopyRoleFromEntityDrawer(targetMappingIndex) {
|
|
13794
|
+
const availableMappings = this.getAvailableMappingsForCopy(targetMappingIndex);
|
|
13795
|
+
if (availableMappings.length === 0) {
|
|
13796
|
+
this.notificationService.warning('No other entity mappings available to copy from.');
|
|
13797
|
+
return;
|
|
13798
|
+
}
|
|
13799
|
+
// Store target mapping index
|
|
13800
|
+
this.targetMappingIndexForCopy.set(targetMappingIndex);
|
|
13801
|
+
// Register the copy role drawer component if not already registered
|
|
13802
|
+
if (!this.floatingContainerService.isComponentRegistered('copy-role-from-entity')) {
|
|
13803
|
+
this.floatingContainerService.registerComponent('copy-role-from-entity', CopyRoleFromEntityDrawerComponent);
|
|
13804
|
+
}
|
|
13805
|
+
// Create signal for entity mappings input
|
|
13806
|
+
const mappingsSignal = signal(availableMappings, ...(ngDevMode ? [{ debugName: "mappingsSignal" }] : []));
|
|
13807
|
+
const config = {
|
|
13808
|
+
id: 'copy-role-from-entity',
|
|
13809
|
+
title: 'Copy Role from Entity',
|
|
13810
|
+
icon: 'content_copy',
|
|
13811
|
+
width: '500px',
|
|
13812
|
+
height: '600px',
|
|
13813
|
+
minWidth: '450px',
|
|
13814
|
+
minHeight: '400px',
|
|
13815
|
+
resizable: true,
|
|
13816
|
+
draggable: true,
|
|
13817
|
+
closable: true,
|
|
13818
|
+
minimizable: true,
|
|
13819
|
+
maximizable: true,
|
|
13820
|
+
componentId: 'copy-role-from-entity',
|
|
13821
|
+
componentConfig: {
|
|
13822
|
+
inputs: {
|
|
13823
|
+
entityMappings: mappingsSignal
|
|
13824
|
+
},
|
|
13825
|
+
outputs: {
|
|
13826
|
+
mappingSelect: (event) => {
|
|
13827
|
+
const entityId = typeof event === 'string' ? event : (event?.value || event);
|
|
13828
|
+
if (typeof entityId === 'string') {
|
|
13829
|
+
this.copyRoleFromEntityMapping(entityId);
|
|
13830
|
+
}
|
|
13831
|
+
},
|
|
13832
|
+
cancel: (event) => {
|
|
13833
|
+
this.closeCopyRoleFromEntityDrawer();
|
|
13834
|
+
}
|
|
13835
|
+
}
|
|
13836
|
+
}
|
|
13837
|
+
};
|
|
13838
|
+
this.floatingContainerService.show(config);
|
|
13839
|
+
}
|
|
13840
|
+
/**
|
|
13841
|
+
* Get available entity mappings for copying (excluding the target mapping)
|
|
13842
|
+
* @param excludeIndex Index of mapping to exclude
|
|
13843
|
+
*/
|
|
13844
|
+
getAvailableMappingsForCopy(excludeIndex) {
|
|
13845
|
+
const mappings = this.entityMappings();
|
|
13846
|
+
const availableMappings = [];
|
|
13847
|
+
mappings.forEach((mapping, index) => {
|
|
13848
|
+
// Skip the target mapping
|
|
13849
|
+
if (index === excludeIndex) {
|
|
13850
|
+
return;
|
|
13851
|
+
}
|
|
13852
|
+
// Get entity ID and name
|
|
13853
|
+
const entityId = this.getEntityIdFromMapping(index);
|
|
13854
|
+
if (!entityId) {
|
|
13855
|
+
return;
|
|
13856
|
+
}
|
|
13857
|
+
const entity = this.entityOptions().find(e => e._id === entityId);
|
|
13858
|
+
if (!entity) {
|
|
13859
|
+
return;
|
|
13860
|
+
}
|
|
13861
|
+
// Get role name
|
|
13862
|
+
const roleId = this.getRoleIdFromMapping(index);
|
|
13863
|
+
const roleName = roleId
|
|
13864
|
+
? this.roleOptions()[entityId]?.find(r => r._id === roleId)?.syusrol_role_name
|
|
13865
|
+
: undefined;
|
|
13866
|
+
availableMappings.push({
|
|
13867
|
+
entityId: entityId,
|
|
13868
|
+
entityName: entity.syen_name || 'Unknown Entity',
|
|
13869
|
+
entityCode: entity.syen_entity_code,
|
|
13870
|
+
roleId: roleId,
|
|
13871
|
+
roleName: roleName
|
|
13872
|
+
});
|
|
13873
|
+
});
|
|
13874
|
+
return availableMappings;
|
|
13875
|
+
}
|
|
13876
|
+
/**
|
|
13877
|
+
* Copy role, department, designation, and menu rights from one entity mapping to another
|
|
13878
|
+
* @param sourceEntityId Entity ID of the source mapping to copy FROM
|
|
13879
|
+
*/
|
|
13880
|
+
copyRoleFromEntityMapping(sourceEntityId) {
|
|
13881
|
+
const targetIndex = this.targetMappingIndexForCopy();
|
|
13882
|
+
if (targetIndex === null || targetIndex < 0 || targetIndex >= this.entityMappings().length) {
|
|
13883
|
+
this.notificationService.error('Invalid target mapping index.');
|
|
13884
|
+
this.closeCopyRoleFromEntityDrawer();
|
|
13885
|
+
return;
|
|
13886
|
+
}
|
|
13887
|
+
// Find source mapping index
|
|
13888
|
+
const sourceIndex = this.entityMappings().findIndex((mapping, index) => {
|
|
13889
|
+
if (index === targetIndex)
|
|
13890
|
+
return false; // Skip target
|
|
13891
|
+
const entityId = this.getEntityIdFromMapping(index);
|
|
13892
|
+
return entityId === sourceEntityId;
|
|
13893
|
+
});
|
|
13894
|
+
if (sourceIndex === -1) {
|
|
13895
|
+
this.notificationService.error('Source entity mapping not found.');
|
|
13896
|
+
this.closeCopyRoleFromEntityDrawer();
|
|
13897
|
+
return;
|
|
13898
|
+
}
|
|
13899
|
+
try {
|
|
13900
|
+
// Get source mapping form group
|
|
13901
|
+
const sourceMappingFormGroup = this.entityMappingsFormArray.at(sourceIndex);
|
|
13902
|
+
const targetMappingFormGroup = this.entityMappingsFormArray.at(targetIndex);
|
|
13903
|
+
if (!sourceMappingFormGroup || !targetMappingFormGroup) {
|
|
13904
|
+
this.notificationService.error('Failed to access mapping data.');
|
|
13905
|
+
this.closeCopyRoleFromEntityDrawer();
|
|
13906
|
+
return;
|
|
13907
|
+
}
|
|
13908
|
+
// Get source values and extract IDs (handling both string and object formats)
|
|
13909
|
+
const sourceRoleValue = sourceMappingFormGroup.get('syenm_role_id_syusrol')?.value;
|
|
13910
|
+
const sourceRoleId = sourceRoleValue
|
|
13911
|
+
? (typeof sourceRoleValue === 'string' ? sourceRoleValue : (sourceRoleValue._id || sourceRoleValue))
|
|
13912
|
+
: undefined;
|
|
13913
|
+
const sourceDepartmentValue = sourceMappingFormGroup.get('syenm_department_id_sydept')?.value;
|
|
13914
|
+
const sourceDepartmentId = sourceDepartmentValue
|
|
13915
|
+
? (typeof sourceDepartmentValue === 'string' ? sourceDepartmentValue : (sourceDepartmentValue._id || sourceDepartmentValue))
|
|
13916
|
+
: undefined;
|
|
13917
|
+
const sourceDesignationValue = sourceMappingFormGroup.get('syenm_designation_id_sydsg')?.value;
|
|
13918
|
+
const sourceDesignationId = sourceDesignationValue
|
|
13919
|
+
? (typeof sourceDesignationValue === 'string' ? sourceDesignationValue : (sourceDesignationValue._id || sourceDesignationValue))
|
|
13920
|
+
: undefined;
|
|
13921
|
+
const sourceActiveFrom = sourceMappingFormGroup.get('syenm_activefrom')?.value;
|
|
13922
|
+
const sourceActiveUpto = sourceMappingFormGroup.get('syenm_activeupto')?.value;
|
|
13923
|
+
const sourceIsActive = sourceMappingFormGroup.get('syenm_isactive')?.value;
|
|
13924
|
+
// Get target entity ID
|
|
13925
|
+
const targetEntityId = this.getEntityIdFromMapping(targetIndex);
|
|
13926
|
+
if (!targetEntityId) {
|
|
13927
|
+
this.notificationService.error('Target entity not found.');
|
|
13928
|
+
this.closeCopyRoleFromEntityDrawer();
|
|
13929
|
+
return;
|
|
13930
|
+
}
|
|
13931
|
+
// Copy role if available and valid for target entity
|
|
13932
|
+
if (sourceRoleId) {
|
|
13933
|
+
// Check if role exists for target entity
|
|
13934
|
+
const rolesForTarget = this.roleOptions()[targetEntityId] || [];
|
|
13935
|
+
const roleToCopy = rolesForTarget.find(r => r._id === sourceRoleId);
|
|
13936
|
+
if (roleToCopy) {
|
|
13937
|
+
targetMappingFormGroup.get('syenm_role_id_syusrol')?.setValue(sourceRoleId);
|
|
13938
|
+
// Trigger role change to load menu rights
|
|
13939
|
+
this.onRoleChange(targetIndex, roleToCopy);
|
|
13940
|
+
}
|
|
13941
|
+
else {
|
|
13942
|
+
this.notificationService.warning(`Role is not available for target entity. Other settings copied.`);
|
|
13943
|
+
}
|
|
13944
|
+
}
|
|
13945
|
+
// Copy department if available
|
|
13946
|
+
if (sourceDepartmentId) {
|
|
13947
|
+
const departmentsForTarget = this.getDepartmentOptionsForEntity(targetIndex);
|
|
13948
|
+
const departmentToCopy = departmentsForTarget.find(d => d._id === sourceDepartmentId);
|
|
13949
|
+
if (departmentToCopy) {
|
|
13950
|
+
targetMappingFormGroup.get('syenm_department_id_sydept')?.setValue(sourceDepartmentId);
|
|
13951
|
+
this.onDepartmentChange(departmentToCopy);
|
|
13952
|
+
}
|
|
13953
|
+
}
|
|
13954
|
+
// Copy designation if available
|
|
13955
|
+
if (sourceDesignationId) {
|
|
13956
|
+
const designationsForTarget = this.getDesignationOptionsForEntity(targetIndex);
|
|
13957
|
+
const desigExists = designationsForTarget.some(d => d._id === sourceDesignationId);
|
|
13958
|
+
if (desigExists) {
|
|
13959
|
+
targetMappingFormGroup.get('syenm_designation_id_sydsg')?.setValue(sourceDesignationId);
|
|
13960
|
+
}
|
|
13961
|
+
}
|
|
13962
|
+
// Copy active dates
|
|
13963
|
+
if (sourceActiveFrom) {
|
|
13964
|
+
targetMappingFormGroup.get('syenm_activefrom')?.setValue(sourceActiveFrom);
|
|
13965
|
+
}
|
|
13966
|
+
if (sourceActiveUpto) {
|
|
13967
|
+
targetMappingFormGroup.get('syenm_activeupto')?.setValue(sourceActiveUpto);
|
|
13968
|
+
}
|
|
13969
|
+
// Copy active status
|
|
13970
|
+
if (sourceIsActive !== undefined) {
|
|
13971
|
+
targetMappingFormGroup.get('syenm_isactive')?.setValue(sourceIsActive);
|
|
13972
|
+
}
|
|
13973
|
+
// Note: Menu rights will be automatically loaded when role is set via onRoleChange()
|
|
13974
|
+
// Custom menu right modifications are role-specific and will be reset to default for the copied role
|
|
13975
|
+
this.notificationService.success('Role and settings copied successfully.');
|
|
13976
|
+
this.closeCopyRoleFromEntityDrawer();
|
|
13977
|
+
// Mark form as dirty
|
|
13978
|
+
this.userMasterForm.markAsDirty();
|
|
13979
|
+
this.userMasterForm.markAsTouched();
|
|
13980
|
+
}
|
|
13981
|
+
catch (error) {
|
|
13982
|
+
console.error('Error copying role from entity mapping:', error);
|
|
13983
|
+
this.notificationService.error('Failed to copy role from entity mapping.');
|
|
13984
|
+
this.closeCopyRoleFromEntityDrawer();
|
|
13985
|
+
}
|
|
13986
|
+
}
|
|
13987
|
+
/**
|
|
13988
|
+
* Close copy role from entity drawer
|
|
13989
|
+
*/
|
|
13990
|
+
closeCopyRoleFromEntityDrawer() {
|
|
13991
|
+
this.floatingContainerService.hide('copy-role-from-entity');
|
|
13992
|
+
this.targetMappingIndexForCopy.set(null);
|
|
13993
|
+
}
|
|
13619
13994
|
/**
|
|
13620
13995
|
* Handle entity mapping card state change (expand/collapse)
|
|
13621
13996
|
* Load data lazily when card is expanded
|
|
@@ -15319,6 +15694,41 @@ class CideCoreUserCreateComponent {
|
|
|
15319
15694
|
* @param mappingIndex - Index of the entity mapping
|
|
15320
15695
|
* @returns Entity ID string or undefined
|
|
15321
15696
|
*/
|
|
15697
|
+
/**
|
|
15698
|
+
* Get role ID from mapping by index
|
|
15699
|
+
*/
|
|
15700
|
+
getRoleIdFromMapping(mappingIndex) {
|
|
15701
|
+
// First try to get from form control
|
|
15702
|
+
const mappingFormGroup = this.entityMappingsFormArray.at(mappingIndex);
|
|
15703
|
+
if (mappingFormGroup) {
|
|
15704
|
+
const roleIdValue = mappingFormGroup.get('syenm_role_id_syusrol')?.value;
|
|
15705
|
+
if (roleIdValue) {
|
|
15706
|
+
// Handle both string and object formats
|
|
15707
|
+
const roleId = typeof roleIdValue === 'string'
|
|
15708
|
+
? roleIdValue
|
|
15709
|
+
: (roleIdValue._id || roleIdValue.toString?.() || undefined);
|
|
15710
|
+
if (roleId) {
|
|
15711
|
+
return roleId.toString();
|
|
15712
|
+
}
|
|
15713
|
+
}
|
|
15714
|
+
}
|
|
15715
|
+
// Fallback: try to get from entity mappings signal
|
|
15716
|
+
const entityMappings = this.entityMappings();
|
|
15717
|
+
if (entityMappings && entityMappings[mappingIndex]) {
|
|
15718
|
+
const mapping = entityMappings[mappingIndex];
|
|
15719
|
+
const roleIdFromSignal = mapping.syenm_role_id_syusrol;
|
|
15720
|
+
if (roleIdFromSignal) {
|
|
15721
|
+
// Handle both string and object formats
|
|
15722
|
+
const roleId = typeof roleIdFromSignal === 'string'
|
|
15723
|
+
? roleIdFromSignal
|
|
15724
|
+
: (roleIdFromSignal._id || roleIdFromSignal.toString?.() || undefined);
|
|
15725
|
+
if (roleId) {
|
|
15726
|
+
return roleId.toString();
|
|
15727
|
+
}
|
|
15728
|
+
}
|
|
15729
|
+
}
|
|
15730
|
+
return undefined;
|
|
15731
|
+
}
|
|
15322
15732
|
getEntityIdFromMapping(mappingIndex) {
|
|
15323
15733
|
// First try to get from form control
|
|
15324
15734
|
const mappingFormGroup = this.entityMappingsFormArray.at(mappingIndex);
|
|
@@ -15902,9 +16312,58 @@ class CideCoreUserCreateComponent {
|
|
|
15902
16312
|
const { core_entity_mapping, core_user_contact_addresses, core_user_documents, core_user_family_details, syutm_user_type, syutm_type_specific_id, ...auth_user_mst } = this.userMasterForm.value;
|
|
15903
16313
|
// Process role exceptions using the new permission tracking system
|
|
15904
16314
|
const core_user_role_exceptions = this.processRoleExceptions();
|
|
16315
|
+
// Get entity mappings with raw values (to include disabled controls) and ensure entity IDs are properly extracted
|
|
16316
|
+
const rawEntityMappings = this.entityMappingsFormArray.getRawValue();
|
|
16317
|
+
const processedEntityMappings = rawEntityMappings.map((mapping) => {
|
|
16318
|
+
const processedMapping = { ...mapping };
|
|
16319
|
+
// Extract entity ID - handle both object and string formats
|
|
16320
|
+
if (mapping.syenm_entity_id_syen) {
|
|
16321
|
+
const entityValue = mapping.syenm_entity_id_syen;
|
|
16322
|
+
if (typeof entityValue === 'object' && entityValue !== null && '_id' in entityValue) {
|
|
16323
|
+
// Extract _id from object
|
|
16324
|
+
processedMapping.syenm_entity_id_syen = entityValue._id;
|
|
16325
|
+
}
|
|
16326
|
+
else if (typeof entityValue === 'string' && entityValue.trim() !== '') {
|
|
16327
|
+
// Already a string, use as-is
|
|
16328
|
+
processedMapping.syenm_entity_id_syen = entityValue;
|
|
16329
|
+
}
|
|
16330
|
+
}
|
|
16331
|
+
// Extract role ID if it's an object
|
|
16332
|
+
if (mapping.syenm_role_id_syusrol) {
|
|
16333
|
+
const roleValue = mapping.syenm_role_id_syusrol;
|
|
16334
|
+
if (typeof roleValue === 'object' && roleValue !== null && '_id' in roleValue) {
|
|
16335
|
+
processedMapping.syenm_role_id_syusrol = roleValue._id;
|
|
16336
|
+
}
|
|
16337
|
+
}
|
|
16338
|
+
// Extract designation ID if it's an object
|
|
16339
|
+
if (mapping.syenm_designation_id_sydsg) {
|
|
16340
|
+
const designationValue = mapping.syenm_designation_id_sydsg;
|
|
16341
|
+
if (typeof designationValue === 'object' && designationValue !== null && '_id' in designationValue) {
|
|
16342
|
+
processedMapping.syenm_designation_id_sydsg = designationValue._id;
|
|
16343
|
+
}
|
|
16344
|
+
}
|
|
16345
|
+
// Extract department ID if it's an object
|
|
16346
|
+
if (mapping.syenm_department_id_sydept) {
|
|
16347
|
+
const departmentValue = mapping.syenm_department_id_sydept;
|
|
16348
|
+
if (typeof departmentValue === 'object' && departmentValue !== null && '_id' in departmentValue) {
|
|
16349
|
+
processedMapping.syenm_department_id_sydept = departmentValue._id;
|
|
16350
|
+
}
|
|
16351
|
+
}
|
|
16352
|
+
// Remove empty _id for new mappings (let backend generate it)
|
|
16353
|
+
if (processedMapping._id === '' || processedMapping._id === null || processedMapping._id === undefined) {
|
|
16354
|
+
delete processedMapping._id;
|
|
16355
|
+
}
|
|
16356
|
+
// Remove exceptions array if empty (it's handled separately)
|
|
16357
|
+
// Cast to extended type to safely access exceptions property
|
|
16358
|
+
const mappingWithExceptions = processedMapping;
|
|
16359
|
+
if ('exceptions' in mappingWithExceptions && Array.isArray(mappingWithExceptions.exceptions) && mappingWithExceptions.exceptions.length === 0) {
|
|
16360
|
+
delete mappingWithExceptions.exceptions;
|
|
16361
|
+
}
|
|
16362
|
+
return processedMapping;
|
|
16363
|
+
});
|
|
15905
16364
|
const formData = {
|
|
15906
16365
|
auth_user_mst: auth_user_mst,
|
|
15907
|
-
core_entity_mapping:
|
|
16366
|
+
core_entity_mapping: processedEntityMappings,
|
|
15908
16367
|
core_user_role_exceptions: core_user_role_exceptions,
|
|
15909
16368
|
core_user_contact_addresses: core_user_contact_addresses || [],
|
|
15910
16369
|
core_user_documents: core_user_documents || [],
|
|
@@ -16705,10 +17164,10 @@ class CideCoreUserCreateComponent {
|
|
|
16705
17164
|
throw error;
|
|
16706
17165
|
}
|
|
16707
17166
|
}
|
|
16708
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
16709
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.7", type: CideCoreUserCreateComponent, isStandalone: true, selector: "cide-core-user-create", viewQueries: [{ propertyName: "menuDetailsRendererTemplate", first: true, predicate: ["menuDetailsRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "permissionsCheckboxRendererTemplate", first: true, predicate: ["permissionsCheckboxRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "menuTypeRendererTemplate", first: true, predicate: ["menuTypeRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "menuRightsPermissionsRendererTemplate", first: true, predicate: ["menuRightsPermissionsRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "permissionsRendererTemplate", first: true, predicate: ["permissionsRendererTemplate"], descendants: true, isSignal: true }], ngImport: i0, template: "<!-- \n ENTERPRISE USER MASTER FORM\n \n Enterprise-Level Styling with Tailwind CSS\n Features: Responsive grids, proper typography, enhanced user experience\n-->\n\n<cide-lyt-shared-wrapper [shared_wrapper_setup_param]=\"{ sypg_page_code: pageCode() }\" [breadcrumb_data]=\"breadcrumbData()\">\n <div class=\"tw-w-full tw-h-full tw-p-1 tw-pt-2\">\n <!-- Toast Notifications -->\n <cide-ele-toast-notification></cide-ele-toast-notification>\n \n <form class=\"tw-max-w-7xl tw-mx-auto tw-bg-transparent\" [formGroup]=\"userMasterForm\" [class.tw-opacity-60]=\"loading()\"\n (ngSubmit)=\"onSubmit()\">\n\n\n <!-- User Context Header -->\n <div\n class=\"tw-bg-gradient-to-r tw-from-blue-50 tw-to-indigo-50 tw-border tw-border-blue-200 tw-rounded-md tw-p-1 tw-mb-2 tw-shadow-sm\">\n <div class=\"tw-flex tw-items-center tw-justify-between tw-flex-wrap tw-gap-2\">\n <!-- User Basic Info Display -->\n <div class=\"tw-flex tw-items-center tw-gap-3 tw-flex-wrap\">\n <!-- Profile Photo Preview -->\n <div class=\"tw-flex tw-items-center tw-gap-2\">\n <div\n class=\"tw-w-8 tw-h-8 tw-rounded-full tw-bg-blue-100 tw-border tw-border-blue-200 tw-flex tw-items-center tw-justify-center tw-overflow-hidden\">\n @if (userMasterForm.get('user_photo_id_cyfm')?.value) {\n <img cideEleFileImage [fileId]=\"userMasterForm.get('user_photo_id_cyfm')?.value\"\n [altText]=\"'Profile Photo'\" class=\"tw-w-full tw-h-full tw-object-cover\">\n } @else {\n <cide-ele-icon name=\"person\" class=\"tw-w-5 tw-h-5 tw-text-blue-600\">\n </cide-ele-icon>\n }\n </div>\n <div class=\"tw-flex tw-flex-col\">\n <span class=\"tw-text-xs tw-font-medium tw-text-blue-900\">\n {{ getUserFullName() || 'New User' }}\n </span>\n <span class=\"tw-text-xs tw-text-blue-600\">\n {{ getUserUsername() || 'Username not set' }}\n </span>\n </div>\n </div>\n\n <!-- Contact Info -->\n <div class=\"tw-flex tw-items-center tw-gap-3\">\n <div class=\"tw-flex tw-items-center tw-gap-1 tw-text-xs tw-text-gray-700\">\n <cide-ele-icon variant=\"gray\" size=\"xs\">email</cide-ele-icon>\n <span>{{ getUserEmail() || 'Email not set' }}</span>\n </div>\n <div class=\"tw-flex tw-items-center tw-gap-1 tw-text-xs tw-text-gray-700\">\n <cide-ele-icon variant=\"gray\" size=\"xs\">phone</cide-ele-icon>\n <span>{{ getUserMobile() || 'Mobile not set' }}</span>\n </div>\n </div>\n\n <!-- Active Status -->\n <div class=\"tw-flex tw-items-center tw-gap-1\">\n @if (getUserActiveStatus()) {\n <span\n class=\"tw-inline-flex tw-items-center tw-px-2 tw-py-1 tw-rounded tw-text-xs tw-font-medium tw-bg-green-100 tw-text-green-700\">\n <cide-ele-icon variant=\"green\" size=\"xs\" class=\"tw-mr-1\">check_circle</cide-ele-icon>\n Active\n </span>\n } @else {\n <span\n class=\"tw-inline-flex tw-items-center tw-px-2 tw-py-1 tw-rounded tw-text-xs tw-font-medium tw-bg-red-100 tw-text-red-700\">\n <cide-ele-icon variant=\"red\" size=\"xs\" class=\"tw-mr-1\">cancel</cide-ele-icon>\n Inactive\n </span>\n }\n </div>\n </div>\n\n <!-- Entity Info -->\n <div class=\"tw-flex tw-items-center tw-gap-2\">\n @if (hasDefaultEntity()) {\n <div class=\"tw-flex tw-items-center tw-gap-1 tw-text-xs tw-text-blue-700\">\n <cide-ele-icon variant=\"blue\" size=\"xs\">business</cide-ele-icon>\n <span class=\"tw-font-medium\">{{ getDefaultEntityName() }}</span>\n </div>\n } @else {\n <div class=\"tw-flex tw-items-center tw-gap-1 tw-text-xs tw-text-gray-500\">\n <cide-ele-icon variant=\"gray\" size=\"xs\">business</cide-ele-icon>\n <span class=\"tw-italic\">No entity</span>\n </div>\n }\n\n <span class=\"tw-text-xs tw-text-gray-600 tw-px-2 tw-py-1 tw-bg-gray-100 tw-rounded\">\n {{ getEntityMappingCount() }} mapping(s)\n </span>\n </div>\n </div>\n </div>\n\n <!-- Tab Navigation -->\n <div class=\"tw-p-0 tw-mb-2 tw-border-b tw-border-gray-200\">\n <cide-ele-tab [tabs]=\"userTabs()\" [activeTabId]=\"activeTab()\" size=\"md\" variant=\"default\"\n (tabChange)=\"onTabChange($event)\">\n </cide-ele-tab>\n </div>\n\n <!-- Tab Content -->\n <div class=\"tw-transition-opacity tw-duration-300\" [class.tw-opacity-60]=\"loading()\">\n @switch (activeTab()) {\n\n @case ('basic') {\n <!-- User Basic Information Section -->\n <div class=\"tw-py-1 tw-border-b-0 tw-mb-1\">\n\n <!-- Top Section: Form Fields on Left, Profile Photo on Right -->\n <div class=\"tw-grid tw-grid-cols-1 lg:tw-grid-cols-[1fr_200px] tw-gap-4 tw-mb-4\">\n <!-- Left Side: Form Fields -->\n <div class=\"tw-space-y-4\">\n <!-- Name Fields - All in One Row -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-4 tw-gap-4\">\n <cide-ele-input id=\"user_firstname\" label=\"First Name\" formControlName=\"user_firstname\"\n placeholder=\"Enter first name\" [maxlength]=\"20\" size=\"md\" (ngModelChange)=\"onNameFieldChange()\">\n </cide-ele-input>\n\n <cide-ele-input id=\"user_middlename\" label=\"Middle Name\" formControlName=\"user_middlename\"\n placeholder=\"Enter middle name\" [maxlength]=\"20\" size=\"md\" (ngModelChange)=\"onNameFieldChange()\">\n </cide-ele-input>\n\n <cide-ele-input id=\"user_lastname\" label=\"Last Name\" formControlName=\"user_lastname\"\n placeholder=\"Enter last name\" [maxlength]=\"20\" size=\"md\" (ngModelChange)=\"onNameFieldChange()\">\n </cide-ele-input>\n\n <cide-ele-input id=\"user_fullname\" label=\"Full Name (Auto-generated)\" formControlName=\"user_fullname\"\n placeholder=\"Auto-generated from name fields or enter manually\" [maxlength]=\"62\" size=\"md\">\n </cide-ele-input>\n </div>\n\n <!-- Contact Information - All in One Row -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-3 tw-gap-4\">\n <cide-ele-input id=\"user_username\" label=\"Username\" formControlName=\"user_username\"\n placeholder=\"Enter unique username\" [maxlength]=\"20\" size=\"md\">\n </cide-ele-input>\n\n <cide-ele-input id=\"user_emailid\" label=\"Email ID\" formControlName=\"user_emailid\" type=\"email\"\n placeholder=\"Enter valid email address\" [maxlength]=\"320\" size=\"md\">\n </cide-ele-input>\n\n <cide-ele-input id=\"user_mobileno\" label=\"Mobile Number\" formControlName=\"user_mobileno\" type=\"tel\"\n placeholder=\"Enter mobile number\" [maxlength]=\"15\" size=\"md\">\n </cide-ele-input>\n </div>\n\n <!-- User Type Mapping -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 tw-gap-4\">\n <cide-ele-select\n id=\"syutm_user_type\"\n label=\"User Type\"\n placeholder=\"Select user type\"\n [options]=\"userTypeOptions\"\n valueKey=\"value\"\n labelKey=\"label\"\n formControlName=\"syutm_user_type\"\n size=\"md\">\n </cide-ele-select>\n\n <cide-ele-input\n id=\"syutm_type_specific_id\"\n label=\"Type-Specific ID\"\n placeholder=\"Enter type-specific ID (e.g., STU001, TCH001)\"\n formControlName=\"syutm_type_specific_id\"\n [maxlength]=\"50\"\n size=\"md\">\n </cide-ele-input>\n </div>\n </div>\n\n <!-- Right Side: Profile Photo Upload -->\n <div class=\"tw-flex tw-items-start tw-justify-center tw-p-0\">\n <cide-ele-file-input id=\"user_photo_id_cyfm\" formControlName=\"user_photo_id_cyfm\" accept=\"image/*\"\n [showPreview]=\"true\" [previewBoxMode]=\"true\" [showFileName]=\"false\" previewWidth=\"180px\"\n previewHeight=\"120px\" placeholderText=\"Upload Photo\" placeholderIcon=\"cloud_upload\" [autoUpload]=\"true\"\n [uploadData]=\"getProfilePhotoUploadData()\" (uploadSuccess)=\"onProfilePhotoUploadSuccess($event)\"\n (uploadError)=\"onProfilePhotoUploadError($event)\"\n (uploadProgressChange)=\"onProfilePhotoUploadProgress($event)\">\n </cide-ele-file-input>\n </div>\n </div>\n\n\n\n <!-- Status Control -->\n <div class=\"tw-grid tw-grid-cols-1 tw-mb-2\">\n <div class=\"tw-p-2 tw-bg-blue-50 tw-border tw-border-blue-100 tw-rounded-lg\">\n <label\n class=\"tw-flex tw-flex-col tw-cursor-pointer tw-py-2 tw-bg-transparent tw-border-none tw-rounded-none tw-transition-all tw-duration-200 hover:tw-bg-blue-75\">\n <cide-ele-input type=\"checkbox\" label=\"Active User Status\" formControlName=\"user_isactive\"\n class=\"tw-h-5 tw-accent-blue-500 tw-rounded tw-mb-1\" />\n <span class=\"tw-font-semibold tw-text-gray-700 tw-text-base\"></span>\n <span class=\"tw-text-sm tw-text-gray-600 tw-mt-1 tw-leading-relaxed\">Enable this user account for system\n access and operations</span>\n </label>\n </div>\n </div>\n </div>\n }\n\n @case ('auth') {\n <!-- Authentication Section -->\n <div class=\"tw-py-1 tw-border-b-0 tw-mb-1\">\n <!-- Password Fields -->\n @if (shouldShowPasswordFields()) {\n <div class=\"tw-mb-4\">\n <!-- Password Fields Header for Edit Mode -->\n @if (isEditMode()) {\n <div class=\"tw-flex tw-items-center tw-justify-between tw-mb-3\">\n <h6 class=\"tw-text-sm tw-font-semibold tw-text-gray-800\">Update Password</h6>\n <button type=\"button\"\n class=\"tw-px-3 tw-py-1 tw-bg-gray-100 tw-text-gray-600 tw-border tw-border-gray-300 tw-rounded-md tw-text-xs tw-font-medium hover:tw-bg-gray-200 tw-transition-colors\"\n (click)=\"cancelPasswordUpdate()\">\n Cancel Password Update\n </button>\n </div>\n }\n\n <div class=\"tw-grid tw-grid-cols-1 lg:tw-grid-cols-2 md:tw-grid-cols-1 tw-gap-6\">\n <cide-ele-input id=\"user_password\" [label]=\"getPasswordFieldLabel()\" formControlName=\"user_password\"\n type=\"password\" placeholder=\"Enter secure password (min 8 characters)\" size=\"md\">\n </cide-ele-input>\n\n <cide-ele-input id=\"user_confirm_password\" [label]=\"getPasswordConfirmLabel()\"\n formControlName=\"user_confirm_password\" type=\"password\" placeholder=\"Confirm your password\" size=\"md\">\n </cide-ele-input>\n </div>\n </div>\n }\n\n <!-- Password Update Option for Edit Mode -->\n @if (isEditMode() && !shouldShowPasswordFields()) {\n <div class=\"tw-mb-4\">\n <div class=\"tw-p-2 tw-bg-blue-50 tw-border tw-border-blue-200 tw-rounded-lg\">\n <h6 class=\"tw-text-sm tw-font-semibold tw-text-blue-800 tw-mb-2\">Password Update</h6>\n <p class=\"tw-text-sm tw-text-blue-600 tw-mb-3\">Current password will be kept. Click below to change\n password.</p>\n\n @if (hasPasswordInput()) {\n <div\n class=\"tw-mb-3 tw-p-2 tw-bg-yellow-50 tw-border tw-border-yellow-200 tw-rounded tw-text-sm tw-text-yellow-700\">\n <cide-ele-icon variant=\"yellow\" size=\"xs\" class=\"tw-mr-1\">warning</cide-ele-icon>\n Password fields contain text. Click \"Change Password\" to manage existing input.\n </div>\n }\n\n <button type=\"button\"\n class=\"tw-px-4 tw-py-2 tw-bg-blue-100 tw-text-blue-700 tw-border tw-border-blue-300 tw-rounded-md tw-text-sm tw-font-medium hover:tw-bg-blue-200 tw-transition-colors\"\n (click)=\"triggerPasswordUpdate()\">\n @if (hasPasswordInput()) {\n Manage Password Fields\n } @else {\n Change Password\n }\n </button>\n </div>\n </div>\n }\n\n <!-- Password Options -->\n <div class=\"tw-grid tw-grid-cols-1 tw-gap-4 tw-mb-4\">\n <div class=\"tw-p-2 tw-bg-yellow-50 tw-border tw-border-yellow-100 tw-rounded-lg\">\n <label\n class=\"tw-flex tw-flex-col tw-gap-2 tw-cursor-pointer tw-py-2 tw-bg-transparent tw-border-none tw-rounded-none tw-transition-all tw-duration-200\">\n <cide-ele-input type=\"checkbox\" label=\"Force Password Change on Login\"\n formControlName=\"user_passwordchangeonlogin\" class=\"tw-h-5 tw-accent-yellow-500 tw-rounded tw-mb-1\" />\n <span class=\"tw-text-sm tw-text-gray-600 tw-mt-1 tw-leading-relaxed\">User will be required to change\n password on next login</span>\n </label>\n </div>\n </div>\n\n </div>\n }\n\n @case ('roles') {\n <!-- Entity, Roles & Permissions Mapping Section -->\n <div class=\"tw-py-1 tw-border-b-0 tw-mb-1\">\n\n\n\n <!-- Important Note -->\n <div class=\"tw-bg-amber-50 tw-border tw-border-amber-200 tw-rounded-lg tw-p-2 tw-mb-4\">\n <div class=\"tw-flex tw-items-start tw-gap-3\">\n <cide-ele-icon variant=\"amber\" size=\"lg\">info</cide-ele-icon>\n <div class=\"tw-flex-1\">\n <h4 class=\"tw-text-sm tw-font-semibold tw-text-amber-800 tw-mb-1\">Entity-Role Based Access</h4>\n <p class=\"tw-text-sm tw-text-amber-700 tw-mb-2\">User access is completely managed through entity-role\n mappings below. At least one entity mapping is required for user access.</p>\n @if (hasDefaultEntity()) {\n <div class=\"tw-flex tw-items-center tw-gap-2 tw-mt-2 tw-p-2 tw-bg-amber-100 tw-rounded\">\n <cide-ele-icon variant=\"amber\" size=\"sm\">star</cide-ele-icon>\n <span class=\"tw-text-sm tw-text-amber-800\">\n <strong>Default Entity:</strong> {{ getDefaultEntityName() }}\n </span>\n </div>\n } @else {\n <div class=\"tw-text-sm tw-text-amber-600 tw-mt-2 tw-italic\">\n \u26A0\uFE0F No default entity selected. Please set one entity as default.\n </div>\n }\n </div>\n </div>\n </div>\n\n <!-- Entity-Role Mapping Section -->\n <div class=\"tw-flex tw-text-center tw-justify-between tw-items-center tw-mb-4\">\n <div>\n <h4 class=\"tw-text-sm tw-text-left tw-font-semibold tw-text-blue-900 tw-mb-1\">Entity-Role Mapping</h4>\n <p class=\"tw-text-sm tw-text-blue-700\">Map user to entities with specific roles and permissions</p>\n </div>\n <div class=\"tw-flex tw-flex-col tw-items-end\">\n <button cideEleButton variant=\"primary\" size=\"md\" type=\"button\" (click)=\"addEntityMapping()\"\n leftIcon=\"add\" [disabled]=\"isAllEntitiesMapped()\">\n Add Entity Mapping\n </button>\n\n @if (isAllEntitiesMapped()) {\n <div class=\"tw-mt-2 tw-p-2 tw-bg-blue-50 tw-border tw-border-blue-200 tw-rounded-md tw-max-w-xs\">\n <p class=\"tw-text-xs tw-text-blue-700\">\n <cide-ele-icon variant=\"info\" size=\"xs\" class=\"tw-mr-1\">info</cide-ele-icon>\n All available entities are already mapped.\n </p>\n </div>\n }\n </div>\n </div>\n\n <div formArrayName=\"core_entity_mapping\">\n @for (mapping of entityMappings(); track mapping.syenm_entity_id_syen?._id || mapping.syenm_entity_id_syen || $index; let i = $index) {\n <cide-ele-card\n [title]=\"getEntityNameFromMapping(i) || 'Entity Mapping ' + (i + 1)\"\n [subtitle]=\"mapping.syenm_isdefault ? 'Primary Entity' : ''\"\n [cardConfig]=\"{\n collapsible: true,\n minimizable: false,\n maximizable: false,\n removable: !mapping?._id,\n defaultState: 'collapsed',\n showHeader: true,\n showFooter: false,\n variant: 'default',\n size: 'sm',\n shadow: true,\n rounded: true,\n bordered: true\n }\"\n (stateChange)=\"onEntityMappingCardStateChange($event, i)\"\n (removed)=\"removeEntityMapping(i)\"\n class=\"tw-mb-2 entity-mapping-card tw-block\">\n \n <div [formGroupName]=\"i\">\n \n <!-- Card Actions (User Type Mappings only) -->\n <div card-actions class=\"tw-flex tw-items-center tw-gap-1.5 tw-flex-wrap tw-max-w-full\">\n @if (getEntityIdFromMapping(i)) {\n @if (getUserTypeMappingsForEntity(getEntityIdFromMapping(i)).length > 0) {\n @for (typeMapping of getUserTypeMappingsForEntity(getEntityIdFromMapping(i)); track typeMapping._id || typeMapping.syutm_type_specific_id) {\n <span class=\"tw-inline-flex tw-items-center tw-px-2 tw-py-1 tw-rounded tw-text-[10px] tw-font-medium tw-bg-purple-50 dark:tw-bg-purple-900/20 tw-text-purple-700 dark:tw-text-purple-300 tw-border tw-border-purple-200 dark:tw-border-purple-800\">\n <cide-ele-icon variant=\"purple\" size=\"xs\" class=\"tw-mr-1\">person</cide-ele-icon>\n {{ typeMapping.syutm_user_type }}\n @if (typeMapping.syutm_isactive) {\n <span class=\"tw-ml-1 tw-w-1.5 tw-h-1.5 tw-rounded-full tw-bg-green-500\"></span>\n }\n </span>\n }\n }\n }\n </div>\n\n <!-- Card Content -->\n <div class=\"tw-space-y-3\">\n <!-- Hidden form control to maintain form structure for entity -->\n <input type=\"hidden\" [formControlName]=\"'syenm_entity_id_syen'\" />\n \n <!-- Role, Default, and Active in One Row -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-3 tw-gap-3\">\n <!-- Role Selection -->\n <cide-ele-select label=\"Role for this Entity\" [options]=\"getRoleOptionsForEntity(i)\"\n formControlName=\"syenm_role_id_syusrol\" valueKey=\"_id\" labelKey=\"syusrol_role_name\"\n placeholder=\"Select role for this entity\" size=\"md\" (change)=\"onRoleChange(i, $event)\">\n </cide-ele-select>\n \n <!-- Primary Entity Checkbox -->\n <div class=\"tw-flex tw-flex-col\">\n <label class=\"tw-block tw-text-sm tw-font-medium tw-text-gray-700 dark:tw-text-gray-300 tw-mb-1.5\">Default</label>\n <div class=\"tw-flex tw-items-center tw-gap-2 tw-px-3 tw-py-2 tw-rounded-md tw-border tw-border-green-200 tw-bg-green-50 dark:tw-bg-green-900/20 dark:tw-border-green-800\" (click)=\"$event.stopPropagation()\">\n <input \n type=\"checkbox\" \n [checked]=\"mapping.syenm_isdefault\"\n (change)=\"onDefaultEntityChange(i, $event)\" \n class=\"tw-h-4 tw-w-4 tw-accent-green-600 tw-cursor-pointer\" />\n <label class=\"tw-inline-flex tw-items-center tw-gap-1 tw-text-xs tw-font-semibold tw-text-green-700 dark:tw-text-green-300 tw-cursor-pointer\">\n <cide-ele-icon variant=\"green\" size=\"xs\">star</cide-ele-icon>\n DEFAULT\n </label>\n </div>\n </div>\n \n <!-- Active Mapping Checkbox -->\n <div class=\"tw-flex tw-flex-col\">\n <label class=\"tw-block tw-text-sm tw-font-medium tw-text-gray-700 dark:tw-text-gray-300 tw-mb-1.5\">Status</label>\n <div class=\"tw-flex tw-items-center tw-gap-2 tw-px-3 tw-py-2 tw-rounded-md tw-border tw-border-blue-200 tw-bg-blue-50 dark:tw-bg-blue-900/20 dark:tw-border-blue-800\" (click)=\"$event.stopPropagation()\">\n <input \n type=\"checkbox\" \n [checked]=\"mapping.syenm_isactive\"\n (change)=\"onActiveMappingChange(i, $event)\" \n class=\"tw-h-4 tw-w-4 tw-accent-blue-600 tw-cursor-pointer\" />\n <label class=\"tw-inline-flex tw-items-center tw-gap-1 tw-text-xs tw-font-semibold tw-text-blue-700 dark:tw-text-blue-300 tw-cursor-pointer\">\n <cide-ele-icon variant=\"blue\" size=\"xs\">check_circle</cide-ele-icon>\n Active\n </label>\n </div>\n </div>\n </div>\n\n\n <!-- Entity-Specific Details and Active Period - All in One Row -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-4 tw-gap-3\">\n <cide-ele-select label=\"Department for this Entity\" [options]=\"getDepartmentOptionsForEntity(i)\"\n formControlName=\"syenm_department_id_sydept\" (change)=\"onDepartmentChange($event)\" valueKey=\"_id\"\n labelKey=\"sydept_name\" placeholder=\"Select department\" size=\"md\">\n </cide-ele-select>\n\n <cide-ele-select label=\"Designation for this Entity\" [options]=\"getDesignationOptionsForEntity(i)\"\n valueKey=\"_id\" labelKey=\"sydsg_name\" formControlName=\"syenm_designation_id_sydsg\"\n placeholder=\"Select designation\" size=\"md\">\n </cide-ele-select>\n\n <cide-ele-input label=\"Active From\" [id]=\"'syenm_activefrom['+i+']'\"\n formControlName=\"syenm_activefrom\" type=\"date\" size=\"md\">\n </cide-ele-input>\n\n <cide-ele-input label=\"Active Until\" [id]=\"'syenm_activeupto['+i+']'\"\n formControlName=\"syenm_activeupto\" type=\"date\" size=\"md\">\n </cide-ele-input>\n </div>\n\n <!-- Menu Rights Grid for this Entity-Role -->\n <div class=\"tw-border-t tw-border-gray-200\">\n\n @if (getMenuRightsForMapping(i).length > 0) {\n <!-- Menu Rights Tree Grid -->\n\n <cide-ele-data-grid [config]=\"getMenuRightsGridConfig(i)\"\n [templateRenderers]=\"getMenuRightsTemplateRenderers(i)\"\n (gridEvent)=\"onMenuRightsGridEvent($event, i)\" class=\"tw-h-96 tw-w-full\">\n </cide-ele-data-grid>\n\n } @else {\n <div class=\"tw-text-center tw-py-8 tw-bg-gray-50 tw-border tw-border-gray-200 tw-rounded-lg\">\n <div class=\"tw-text-gray-400 tw-mb-3\">\n <cide-ele-icon variant=\"gray\" size=\"lg\">menu</cide-ele-icon>\n </div>\n <h6 class=\"tw-text-sm tw-font-medium tw-text-gray-600 tw-mb-2\">No Menu Rights Available</h6>\n <p class=\"tw-text-xs tw-text-gray-500 tw-mb-3 tw-text-center\">Select both entity and role to\n automatically load\n menu rights for this mapping.</p>\n </div>\n }\n </div>\n </div>\n </div>\n </cide-ele-card>\n }\n </div>\n\n @if (entityMappings().length === 0) {\n <div class=\"tw-text-center tw-py-8 tw-bg-white tw-border tw-border-blue-200 tw-rounded-lg\">\n <div class=\"tw-text-blue-400 tw-mb-3\">\n <cide-ele-icon variant=\"blue\" size=\"lg\">business</cide-ele-icon>\n </div>\n <h4 class=\"tw-text-sm tw-font-medium tw-text-blue-800 tw-mb-2\">No Entity Mappings</h4>\n <p class=\"tw-text-blue-600 tw-mb-4 tw-text-center\">Add entity mappings to assign specific roles and\n permissions for different entities.</p>\n <button class=\"tw-mx-auto\" cideEleButton variant=\"primary\" size=\"md\" type=\"button\"\n (click)=\"addEntityMapping()\" leftIcon=\"add\">\n Add First Entity Mapping\n </button>\n </div>\n }\n </div>\n }\n\n @case ('addresses') {\n <!-- Contact Addresses Section -->\n <div class=\"tw-py-1 tw-border-b-0 tw-mb-1\">\n <div class=\"tw-flex tw-justify-end\">\n <div class=\"tw-flex tw-justify-between tw-items-end tw-mb-2 tw-gap-4\">\n <button cideEleButton variant=\"primary\" size=\"md\" type=\"button\" (click)=\"addContactAddress()\"\n leftIcon=\"add\" [disabled]=\"!hasAddContactAddressRights()\">\n Add New Address\n </button>\n </div>\n </div>\n\n <div formArrayName=\"core_user_contact_addresses\">\n @for (address of contactAddresses(); track $index; let i = $index) {\n <div [formGroupName]=\"i\"\n class=\"tw-bg-white tw-border tw-border-gray-200 tw-rounded-xl tw-mb-8 tw-overflow-hidden tw-transition-all tw-duration-300 hover:tw-shadow-lg tw-shadow-sm\">\n <div\n class=\"tw-bg-gradient-to-r tw-from-gray-50 tw-to-gray-100 tw-px-4 tw-py-2 tw-flex tw-justify-between tw-items-center tw-border-b tw-border-gray-200\">\n <!-- Use address type as header instead of generic \"Address X\" -->\n <h4 class=\"tw-m-0 tw-text-gray-700 tw-text-sm tw-font-semibold tw-tracking-tight\">\n {{ getAddressTypeLabel(i) || ('Address ' + (i + 1)) }}\n </h4>\n <div class=\"tw-flex tw-items-center tw-gap-2\">\n @if (isAddressOwner(i)) {\n <button cideEleButton variant=\"secondary\" size=\"xs\" type=\"button\" (click)=\"shareAddress(i)\"\n leftIcon=\"share\" class=\"tw-text-blue-600 hover:tw-text-blue-700\">\n Share\n </button>\n }\n @if (!address?._id) {\n <button cideEleButton variant=\"danger\" size=\"sm\" type=\"button\" (click)=\"removeContactAddress(i)\"\n leftIcon=\"delete\">\n Remove\n </button>\n }\n </div>\n </div>\n <div class=\"tw-p-4\">\n <!-- Main Layout: Inputs on Left, Address Textarea on Right -->\n <div class=\"tw-grid tw-grid-cols-1 lg:tw-grid-cols-4 tw-gap-3 tw-mb-3\">\n \n <!-- Left Side: Input Fields (3/4 width) -->\n <div class=\"lg:tw-col-span-3\">\n <!-- Row 1: Address Type, Contact Person -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 tw-gap-3 tw-mb-3\">\n <cide-ele-select label=\"Address Type\" [options]=\"addressTypeOptions()\" id=\"sycad_address_type_id_sygms\"\n formControlName=\"sycad_address_type_id_sygms\" placeholder=\"Select type\" size=\"sm\"\n valueKey=\"_id\" labelKey=\"sygms_title\" (change)=\"onAddressTypeChange(i)\">\n </cide-ele-select>\n\n <cide-ele-input label=\"Contact Person\" formControlName=\"sycad_contact_person_name\"\n placeholder=\"Enter contact person\" size=\"sm\">\n </cide-ele-input>\n </div>\n\n <!-- Row 2: Postal Code, City, State, Country -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-4 tw-gap-3\">\n <cide-ele-select label=\"Postal Code\" [options]=\"addressPostalCodes()[i] || []\"\n formControlName=\"sycad_contact_pin_sypin\" placeholder=\"Select postal code\" [searchable]=\"true\"\n [loading]=\"addressPostalCodesLoading()[i] || false\" (searchChange)=\"onPostalCodeSearch($event, i)\"\n (change)=\"onPostalCodeSelection($event, i)\" size=\"sm\">\n </cide-ele-select>\n\n <cide-ele-input label=\"City\" formControlName=\"sycad_contact_city_sypin\" placeholder=\"Enter city\"\n size=\"sm\">\n </cide-ele-input>\n\n <cide-ele-input label=\"State\" formControlName=\"sycad_contact_state_sypin\" placeholder=\"Enter state\"\n size=\"sm\">\n </cide-ele-input>\n\n <cide-ele-select label=\"Country\" [options]=\"addressCountries()[i] || []\"\n formControlName=\"sycad_contact_country_syctr\" placeholder=\"Select country\" valueKey=\"_id\"\n labelKey=\"syctr_country_iso_name\" [searchable]=\"true\" (searchChange)=\"onCountrySearch($event, i)\"\n [loading]=\"addressCountriesLoading()[i] || false\" size=\"sm\">\n </cide-ele-select>\n </div>\n </div>\n\n <!-- Right Side: Address Textarea (1/4 width, spans 2 rows) -->\n <div class=\"lg:tw-col-span-1 lg:tw-row-span-2 tw-flex tw-flex-col\">\n <cide-ele-textarea label=\"Complete Address\" formControlName=\"sycad_contact_address\"\n placeholder=\"Enter complete address with area, city, and landmarks\" [rows]=\"4\" size=\"sm\"\n class=\"tw-h-full\">\n </cide-ele-textarea>\n </div>\n </div>\n\n <!-- Contact Details: Primary Phone, Alt Phone, Fax, Primary Email in 4 columns -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-4 tw-gap-3 tw-mb-3\">\n <cide-ele-input label=\"Primary Phone\" formControlName=\"sycad_contact_phone\" type=\"tel\"\n placeholder=\"Primary phone\" size=\"sm\">\n </cide-ele-input>\n\n <cide-ele-input label=\"Alternate Phone\" formControlName=\"sycad_contact_phone_alt\" type=\"tel\"\n placeholder=\"Alternate phone\" size=\"sm\">\n </cide-ele-input>\n\n <cide-ele-input label=\"Fax Number\" formControlName=\"sycad_contact_fax\" placeholder=\"Fax number\"\n size=\"sm\">\n </cide-ele-input>\n\n <cide-ele-input label=\"Primary Email\" formControlName=\"sycad_contact_email\" type=\"email\"\n placeholder=\"Primary email\" size=\"sm\">\n </cide-ele-input>\n </div>\n\n <!-- Alternate Email in single row -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 tw-gap-3\">\n <cide-ele-input label=\"Alternate Email\" formControlName=\"sycad_contact_email_alt\" type=\"email\"\n placeholder=\"Alternate email address\" size=\"sm\">\n </cide-ele-input>\n </div>\n </div>\n </div>\n }\n </div>\n </div>\n }\n\n @case ('documents') {\n <!-- Documents Section -->\n <div class=\"tw-py-1 tw-border-b-0 tw-mb-1\">\n <div class=\"tw-flex tw-justify-end tw-items-end tw-mb-2 tw-gap-4\">\n <button cideEleButton variant=\"primary\" size=\"md\" type=\"button\" (click)=\"addDocument()\" leftIcon=\"add\" [disabled]=\"!hasAddDocumentRights()\">\n Add Document\n </button>\n </div>\n <div formArrayName=\"core_user_documents\">\n @for (doc of documents(); track $index; let i = $index) {\n <div [formGroupName]=\"i\"\n class=\"tw-bg-white tw-border tw-border-gray-200 tw-rounded-xl tw-mb-8 tw-overflow-hidden tw-transition-all tw-duration-300 hover:tw-shadow-lg tw-shadow-sm\">\n <div\n class=\"tw-bg-gradient-to-r tw-from-gray-50 tw-to-gray-100 tw-px-4 tw-py-2 tw-flex tw-justify-between tw-items-center tw-border-b tw-border-gray-200\">\n <h4 class=\"tw-m-0 tw-text-gray-700 tw-text-sm tw-font-semibold tw-tracking-tight\">\n {{ getDocumentTypeLabel(i) || ('Document ' + (i + 1)) }}\n </h4>\n <div class=\"tw-flex tw-gap-2\">\n @if (doc?._id) {\n <button cideEleButton variant=\"secondary\" size=\"sm\" type=\"button\" (click)=\"shareDocumentRights(i)\"\n leftIcon=\"share\">\n Share\n </button>\n }\n </div>\n </div>\n <div class=\"tw-p-4\">\n <!-- Main Layout: Inputs on Left, File Upload on Right -->\n <div class=\"tw-grid tw-grid-cols-1 lg:tw-grid-cols-3 tw-gap-4\">\n \n <!-- Left Side: Document Information (2/3 width) -->\n <div class=\"lg:tw-col-span-2\">\n <!-- Row 1: Document Type, Document Number, Name as per Document -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-3 tw-gap-3 tw-mb-3\">\n <cide-ele-select label=\"Document Type\" [options]=\"documentTypeOptions()\"\n formControlName=\"syusd_document_type_id_sygms\" placeholder=\"Select type\" size=\"sm\"\n valueKey=\"_id\" labelKey=\"sygms_title\" (change)=\"onDocumentTypeChange(i)\">\n </cide-ele-select>\n\n <cide-ele-input label=\"Document Number\" formControlName=\"syusd_doc_number\"\n placeholder=\"Document number\" size=\"sm\">\n </cide-ele-input>\n\n <cide-ele-input label=\"Name as per Document\" formControlName=\"syusd_doc_name_as_per_doc\"\n placeholder=\"Name on document\" size=\"sm\">\n </cide-ele-input>\n </div>\n\n <!-- Row 2: Issue Date, Expiry Date, Photo Group -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-3 tw-gap-3 tw-mb-3\">\n <cide-ele-input label=\"Issue Date\" formControlName=\"syusd_doc_issue_date\"\n [id]=\"'syusd_doc_issue_date['+i+']'\" type=\"date\" size=\"sm\">\n </cide-ele-input>\n\n <cide-ele-input label=\"Expiry Date\" formControlName=\"syusd_doc_expiry_date\"\n [id]=\"'syusd_doc_expiry_date['+i+']'\" type=\"date\" size=\"sm\">\n </cide-ele-input>\n </div>\n\n <!-- Row 3: Verification Status, KYC Status -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 tw-gap-3\">\n <cide-ele-select label=\"Verification Status\" [options]=\"documentVerificationStatusOptions()\"\n formControlName=\"syusd_doc_verification_status_id_sygms\" placeholder=\"Select status\"\n size=\"sm\" valueKey=\"_id\" labelKey=\"sygms_title\">\n </cide-ele-select>\n\n <cide-ele-select label=\"KYC Status\" [options]=\"documentKycStatusOptions()\"\n formControlName=\"syusd_doc_kyc_status_id_sygms\" placeholder=\"Select KYC status\" size=\"sm\"\n valueKey=\"_id\" labelKey=\"sygms_title\">\n </cide-ele-select>\n </div>\n </div>\n\n <!-- Right Side: File Upload (1/3 width) -->\n <div class=\"lg:tw-col-span-1\">\n <div class=\"tw-bg-gray-50 tw-border tw-border-gray-200 tw-rounded-lg tw-p-3 tw-h-full\">\n \n <!-- File Upload Input -->\n <cide-ele-file-input\n [id]=\"'document-files-' + i\"\n [multiple]=\"true\"\n formControlName=\"syusd_photo_group_id_cyfm\"\n [accept]=\"'.pdf,.jpg,.jpeg,.png,.doc,.docx'\"\n [autoUpload]=\"true\"\n [uploadData]=\"getDocumentUploadData(i)\"\n (change)=\"onDocumentFilesSelected($event, i)\"\n (uploadSuccess)=\"onDocumentUploadSuccess($event, i)\"\n (uploadError)=\"onDocumentUploadError($event, i)\"\n (uploadProgressChange)=\"onDocumentUploadProgress($event, i)\"\n class=\"tw-mb-3\"\n size=\"sm\">\n </cide-ele-file-input>\n\n <!-- Upload Status -->\n <!-- Upload status is now handled by the file input component itself -->\n </div>\n </div>\n </div>\n </div>\n </div>\n }\n </div>\n </div>\n }\n\n @case ('family') {\n <!-- Family Details Section - Compact Design -->\n <div class=\"tw-py-1 tw-border-b-0 tw-mb-1\">\n <div class=\"tw-flex tw-justify-end tw-items-end tw-mb-3 tw-gap-4\">\n <button cideEleButton variant=\"primary\" size=\"sm\" type=\"button\" (click)=\"addFamilyDetail()\" leftIcon=\"add\" [disabled]=\"!hasAddFamilyDetailRights()\">\n Add Family Member\n </button>\n </div>\n\n <div formArrayName=\"core_user_family_details\">\n @for (family of familyDetails(); track $index; let i = $index) {\n <div [formGroupName]=\"i\"\n class=\"tw-bg-white tw-border tw-border-gray-200 tw-rounded-lg tw-mb-4 tw-overflow-hidden tw-transition-all tw-duration-200 hover:tw-shadow-md tw-shadow-sm\">\n \n <!-- Compact Header -->\n <div class=\"tw-bg-gray-50 tw-px-4 tw-py-2 tw-flex tw-justify-between tw-items-center tw-border-b tw-border-gray-200\">\n <h4 class=\"tw-m-0 tw-text-gray-700 tw-text-sm tw-font-medium\">Family Member {{ i + 1 }}</h4>\n <div class=\"tw-flex tw-gap-2\">\n @if (family?._id) {\n <button cideEleButton variant=\"secondary\" size=\"xs\" type=\"button\" (click)=\"shareFamilyDetailRights(i)\"\n leftIcon=\"share\">\n Share\n </button>\n }\n @if (!family?._id) {\n <button cideEleButton variant=\"danger\" size=\"xs\" type=\"button\" (click)=\"removeFamilyDetail(i)\" leftIcon=\"delete\">\n Remove\n </button>\n }\n </div>\n </div>\n \n <!-- Compact Form Content - 3 inputs per row -->\n <div class=\"tw-p-4\">\n <!-- Row 1: Name, User, and Combined Relationship/Active Status (33.33% each) -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-3 tw-gap-3 tw-mb-3\">\n <cide-ele-input label=\"Family Member Name\" formControlName=\"syfdl_family_member_name\"\n placeholder=\"Enter family member full name\" size=\"sm\">\n </cide-ele-input>\n\n <cide-ele-select label=\"Family Member User\" [options]=\"userOptions(i)\"\n formControlName=\"syfdl_family_member_id_user\" placeholder=\"Select family member user\" size=\"sm\"\n valueKey=\"_id\" labelKey=\"user_fullname\" [searchable]=\"true\"\n [loading]=\"userSearchLoading()[i] || false\" (searchChange)=\"onUserSearchChange($event, i)\"\n (change)=\"onUserSelectionChange($event, i)\">\n </cide-ele-select>\n\n <!-- Combined Relationship and Active Status (33.33%) -->\n <div class=\"tw-flex tw-flex-row tw-gap-2 tw-items-end\">\n <div class=\"tw-flex-1\">\n <cide-ele-select label=\"Relationship\" [options]=\"relationshipOptions()\"\n formControlName=\"syfdl_relationship_id_sygms\" placeholder=\"Select relationship\" size=\"sm\"\n valueKey=\"_id\" labelKey=\"sygms_title\">\n </cide-ele-select>\n </div>\n\n <div class=\"tw-flex tw-items-center tw-pt-1 tw-flex-shrink-0\">\n <cide-ele-input formControlName=\"syfdl_isactive\" type=\"checkbox\" label=\"Active\" size=\"sm\">\n </cide-ele-input>\n </div>\n </div>\n </div>\n\n <!-- Row 2: Blood Group, DOB, and Phone -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 xl:tw-grid-cols-3 tw-gap-3 tw-mb-3\">\n <cide-ele-select label=\"Blood Group\" [options]=\"bloodGroupOptions()\"\n formControlName=\"syfdl_blood_group_sygms\" placeholder=\"Select blood group\" size=\"sm\" valueKey=\"_id\"\n labelKey=\"sygms_title\">\n </cide-ele-select>\n\n <cide-ele-input label=\"Date of Birth\" formControlName=\"syfdl_family_member_dob\" type=\"date\" size=\"sm\"\n [id]=\"'syfdl_family_member_dob['+i+']'\">\n </cide-ele-input>\n\n <cide-ele-input label=\"Contact Phone\" formControlName=\"syfdl_contact_phone\" type=\"tel\"\n placeholder=\"Enter contact phone\" size=\"sm\">\n </cide-ele-input>\n </div>\n\n <!-- Row 3: Email, Email ID, and Contact Number -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 xl:tw-grid-cols-3 tw-gap-3 tw-mb-3\">\n <cide-ele-input label=\"Contact Email\" formControlName=\"syfdl_contact_email\" type=\"email\"\n placeholder=\"Enter contact email\" size=\"sm\">\n </cide-ele-input>\n\n <cide-ele-input label=\"Contact Email ID\" formControlName=\"syfdl_contact_email_id\" type=\"email\"\n placeholder=\"Enter contact email ID\" size=\"sm\">\n </cide-ele-input>\n\n <cide-ele-input label=\"Contact Number\" formControlName=\"syfdl_contact_number\" type=\"tel\"\n placeholder=\"Enter contact number\" size=\"sm\">\n </cide-ele-input>\n </div>\n\n </div>\n </div>\n }\n </div>\n </div>\n }\n }\n </div>\n\n <!-- Form Actions -->\n <div\n class=\"tw-flex tw-justify-between tw-items-center tw-gap-4 tw-py-2 tw-bg-white tw-border-t tw-border-gray-200 tw-sticky tw-bottom-0 tw-z-10\">\n <!-- Error Display Component -->\n <div class=\"tw-flex-1\">\n <cide-form-field-error [formGroup]=\"userMasterForm\"></cide-form-field-error>\n </div>\n\n <!-- Action Buttons -->\n <div class=\"tw-flex tw-gap-4\">\n <button cideEleButton type=\"button\" variant=\"secondary\" (click)=\"resetForm()\" leftIcon=\"refresh\"\n [disabled]=\"loading()\">\n Reset Form\n </button>\n\n <button cideEleButton type=\"submit\" variant=\"primary\" [disabled]=\"loading() || userMasterForm.invalid\"\n [loading]=\"loading()\" leftIcon=\"save\">\n Save User Master\n </button>\n </div>\n </div>\n </form>\n</div>\n</cide-lyt-shared-wrapper>\n\n<!-- Template Renderers for Role Permissions Grid -->\n<ng-template #menuDetailsRendererTemplate let-row=\"row\">\n <div class=\"tw-flex tw-items-center tw-space-x-3 tw-min-w-0\">\n <!-- Menu Icon -->\n <div class=\"tw-flex-shrink-0\">\n @if (row.syme_type === 'module') {\n <cide-ele-icon class=\"tw-text-blue-600 tw-w-4 tw-h-4\">folder</cide-ele-icon>\n } @else if (row.syme_type === 'section') {\n <cide-ele-icon class=\"tw-text-green-600 tw-w-4 tw-h-4\">folder_open</cide-ele-icon>\n } @else if (row.syme_type === 'menu') {\n <cide-ele-icon class=\"tw-text-purple-600 tw-w-4 tw-h-4\">menu</cide-ele-icon>\n } @else {\n <cide-ele-icon class=\"tw-text-gray-600 tw-w-4 tw-h-4\">description</cide-ele-icon>\n }\n </div>\n\n <!-- Menu Details -->\n <div class=\"tw-ml-3 tw-min-w-0 tw-flex-1\">\n <div class=\"tw-flex tw-items-center tw-gap-2\">\n <div class=\"tw-text-xs tw-font-medium tw-text-gray-900 tw-truncate\" [title]=\"row.syme_title\">\n {{ row.syme_title || row.menu?.syme_title || row.menu?.syme_menu_name || 'Untitled' }}\n </div>\n <!-- Green pill indicator for parent menus with child permissions -->\n @if (row.syme_type === 'module' || row.syme_type === 'section') {\n @if (hasChildMenusWithPermissions(row._id)) {\n <span\n class=\"tw-inline-flex tw-items-center tw-px-2 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium tw-bg-green-100 tw-text-green-800 tw-whitespace-nowrap\">\n Assigned\n </span>\n }\n }\n </div>\n @if (row.permission?.sygms_name) {\n <div class=\"tw-text-xs tw-text-blue-500 tw-truncate\" [title]=\"row.permission?.sygms_name\">\n {{ row.permission?.sygms_name }}\n </div>\n }\n </div>\n </div>\n</ng-template>\n\n<!-- Menu Type Renderer Template -->\n<ng-template #menuTypeRendererTemplate let-row=\"row\" let-value=\"value\">\n <div class=\"tw-flex tw-items-center tw-justify-center\">\n @if (row.syme_type === 'module') {\n <span\n class=\"tw-inline-flex tw-items-center tw-px-2 tw-py-1 tw-rounded-full tw-text-xs tw-font-medium tw-bg-blue-100 tw-text-blue-800\">\n Module\n </span>\n } @else if (row.syme_type === 'section') {\n <span\n class=\"tw-inline-flex tw-items-center tw-px-2 tw-py-1 tw-rounded-full tw-text-xs tw-font-medium tw-bg-green-100 tw-text-green-800\">\n Section\n </span>\n } @else if (row.syme_type === 'menu') {\n <span\n class=\"tw-inline-flex tw-items-center tw-px-2 tw-py-1 tw-rounded-full tw-text-xs tw-font-medium tw-bg-purple-100 tw-text-purple-800\">\n Menu\n </span>\n } @else {\n <span\n class=\"tw-inline-flex tw-items-center tw-px-2 tw-py-1 tw-rounded-full tw-text-xs tw-font-medium tw-bg-gray-100 tw-text-gray-800\">\n {{ row.syme_type || 'Unknown' }}\n </span>\n }\n </div>\n</ng-template>\n\n<!-- Permissions Checkbox Renderer Template -->\n<ng-template #permissionsCheckboxRendererTemplate let-row=\"row\" let-value=\"value\">\n <div class=\"tw-flex tw-flex-wrap tw-gap-2 tw-max-w-full\">\n @if (row.syme_type === 'menu' && row?.syme_permissions_id_sygms && row?.syme_permissions_id_sygms.length > 0) {\n @for (permissionId of row?.syme_permissions_id_sygms || []; track permissionId) {\n <div class=\"tw-flex tw-items-center tw-space-x-1\">\n <div class=\"tw-flex tw-items-center tw-space-x-1\">\n <input type=\"checkbox\" [checked]=\"isPermissionSelected(row._id, permissionId)\" [disabled]=\"true\"\n class=\"tw-h-4 tw-w-4 tw-text-blue-600 tw-bg-gray-100 tw-border-gray-300 tw-rounded focus:tw-ring-blue-500\">\n <label class=\"tw-text-xs tw-text-gray-700\">\n {{ getPermissionById(permissionId)?.sygms_title || 'Unknown' }}\n </label>\n </div>\n </div>\n }\n } @else {\n <!-- Show green checkmark for parent menus with child permissions -->\n @if (row.syme_type === 'module' || row.syme_type === 'section' || row.syme_type === 'title') {\n @if (hasChildMenusWithPermissions(row._id)) {\n <div class=\"tw-flex tw-items-center tw-justify-center tw-w-6 tw-h-6 tw-bg-green-100 tw-rounded-full\">\n <cide-ele-icon class=\"tw-text-green-600\" size=\"xs\">\n check\n </cide-ele-icon>\n </div>\n } @else {\n <span class=\"tw-text-xs tw-text-gray-400\">N/A</span>\n }\n } @else {\n <span class=\"tw-text-xs tw-text-gray-400\">N/A</span>\n }\n }\n </div>\n</ng-template>\n\n<!-- Menu Rights Permissions Renderer Template -->\n<ng-template #menuRightsPermissionsRendererTemplate let-row=\"row\" let-value=\"value\">\n <div class=\"tw-flex tw-flex-wrap tw-gap-2 tw-max-w-full\">\n <!-- Role Rights Display -->\n @if (row.role_rights && row.role_rights.length > 0) {\n <div class=\"tw-mb-2\">\n <div class=\"tw-text-xs tw-text-gray-500 tw-mb-1\">Role Rights:</div>\n <div class=\"tw-flex tw-flex-wrap tw-gap-1\">\n @for (right of row.role_rights; track $index) {\n <span class=\"tw-inline-block tw-px-2 tw-py-1 tw-text-xs tw-bg-blue-100 tw-text-blue-800 tw-rounded\">\n {{ right }}\n </span>\n }\n </div>\n </div>\n }\n\n\n <!-- Exception Indicator -->\n @if (row.hasException) {\n <div class=\"tw-mt-2\">\n <span class=\"tw-inline-block tw-px-2 tw-py-1 tw-text-xs tw-bg-yellow-100 tw-text-yellow-800 tw-rounded\">\n Override\n </span>\n </div>\n } @else {\n <div class=\"tw-mt-2\">\n <span class=\"tw-text-xs tw-text-gray-400\">Default</span>\n </div>\n }\n </div>\n</ng-template>\n\n<!-- Permissions Renderer Template -->\n<ng-template #permissionsRendererTemplate let-row=\"row\" let-value=\"value\">\n <div class=\"tw-flex tw-flex-wrap tw-gap-2 tw-max-w-full\">\n @if (row._permissionValues && Object.keys(row._permissionValues).length > 0) {\n @for (permissionId of Object.keys(row._permissionValues); track permissionId) {\n <div class=\"tw-flex tw-items-center tw-space-x-2\">\n <cide-ele-input type=\"checkbox\" [ngModel]=\"row._permissionValues[permissionId].checked\"\n (ngModelChange)=\"onPermissionChangeSafe($event, row, permissionId)\"\n [id]=\"'permission-' + row._id + '-' + permissionId\" class=\"tw-h-4 tw-w-4\">\n </cide-ele-input>\n <label [for]=\"'permission-' + row._id + '-' + permissionId\" \n class=\"tw-text-xs tw-cursor-pointer\"\n [ngClass]=\"{\n 'tw-text-gray-700': row._permissionValues[permissionId].modified === row._permissionValues[permissionId].actual,\n 'tw-text-blue-600 tw-font-semibold': row._permissionValues[permissionId].modified !== row._permissionValues[permissionId].actual\n }\">\n {{ row._permissionValues[permissionId].permission?.sygms_title }}\n @if (row._permissionValues[permissionId].modified !== row._permissionValues[permissionId].actual) {\n <span class=\"tw-text-xs tw-text-orange-500 tw-ml-1\" title=\"Modified from role permission\">\n ({{ row._permissionValues[permissionId].actual ? '\u2713' : '\u2717' }})\n </span>\n }\n </label>\n </div>\n }\n } @else {\n <!-- No permissions to display - show N/A (permissions are already loaded, just empty) -->\n <span class=\"tw-text-xs tw-text-gray-400\">N/A</span>\n }\n </div>\n</ng-template>", styles: [":host ::ng-deep .entity-mapping-card{transition:all .2s ease}:host ::ng-deep .entity-mapping-card:hover{transform:translateY(-2px)}:host ::ng-deep .entity-mapping-card .cide-card-header{background:linear-gradient(135deg,#3b82f60d,#9333ea0d);border-bottom:1px solid rgba(59,130,246,.1)}:host ::ng-deep .dark .entity-mapping-card .cide-card-header{background:linear-gradient(135deg,#3b82f61a,#9333ea1a);border-bottom:1px solid rgba(59,130,246,.2)}:host ::ng-deep .entity-mapping-card .cide-card-header-content{font-weight:600}:host ::ng-deep .entity-mapping-card .cide-card-body{background:linear-gradient(180deg,#f9fafb80,#ffffff80)}:host ::ng-deep .dark .entity-mapping-card .cide-card-body{background:linear-gradient(180deg,#11182780,#1f293780)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$2.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i1$2.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: CideInputComponent, selector: "cide-ele-input", inputs: ["fill", "label", "labelHide", "disabled", "clearInput", "labelPlacement", "labelDir", "placeholder", "leadingIcon", "trailingIcon", "helperText", "helperTextCollapse", "hideHelperAndErrorText", "errorText", "maxlength", "minlength", "required", "autocapitalize", "autocomplete", "type", "width", "id", "ngModel", "option", "min", "max", "step", "size"], outputs: ["ngModelChange"] }, { kind: "component", type: CideSelectComponent, selector: "cide-ele-select", inputs: ["label", "labelHide", "placeholder", "helperText", "errorText", "required", "disabled", "id", "ngModel", "size", "fill", "labelPlacement", "labelDir", "leadingIcon", "trailingIcon", "clearInput", "options", "multiple", "searchable", "showSearchInput", "loading", "valueKey", "labelKey", "treeView"], outputs: ["ngModelChange", "change", "searchChange"] }, { kind: "component", type: CideTextareaComponent, selector: "cide-ele-textarea", inputs: ["label", "labelHide", "placeholder", "helperText", "errorText", "required", "disabled", "minlength", "maxlength", "rows", "id", "ngModel", "size", "fill", "labelPlacement", "labelDir", "leadingIcon", "trailingIcon", "clearInput"], outputs: ["ngModelChange"] }, { kind: "component", type: CideEleButtonComponent, selector: "button[cideEleButton], a[cideEleButton], cide-ele-button", inputs: ["label", "variant", "size", "type", "shape", "elevation", "disabled", "id", "loading", "fullWidth", "leftIcon", "rightIcon", "customClass", "tooltip", "ariaLabel", "testId", "routerLink", "routerExtras", "preventDoubleClick", "animated"], outputs: ["btnClick", "doubleClick"] }, { kind: "component", type: CideEleTabComponent, selector: "cide-ele-tab", inputs: ["tabs", "activeTabId", "size", "variant", "fullWidth", "disabled"], outputs: ["tabChange"] }, { kind: "component", type: CideEleFileInputComponent, selector: "cide-ele-file-input", inputs: ["label", "accept", "multiple", "disabled", "required", "helperText", "errorText", "showPreview", "previewWidth", "previewHeight", "previewBoxMode", "showFileName", "placeholderText", "placeholderIcon", "autoUpload", "uploadData", "showFloatingUploader", "floatingUploaderGroupId"], outputs: ["fileChange", "uploadSuccess", "uploadError", "uploadProgressChange"] }, { kind: "directive", type: CideEleFileImageDirective, selector: "[cideEleFileImage]", inputs: ["fileId", "altText"] }, { kind: "component", type: CideIconComponent, selector: "cide-ele-icon", inputs: ["size", "type", "toolTip"] }, { kind: "component", type: CideEleDataGridComponent, selector: "cide-ele-data-grid", inputs: ["config", "templateRenderers", "customFormatters", "actionHandlers", "serverSidePagination", "totalServerItems", "currentServerPage", "currentServerPageSize", "dragDropEnabled"], outputs: ["gridEvent"] }, { kind: "component", type: CideEleToastNotificationComponent, selector: "cide-ele-toast-notification" }, { kind: "component", type: CideFormFieldErrorComponent, selector: "cide-form-field-error", inputs: ["control", "formGroup", "fieldName", "customMessages"] }, { kind: "component", type: CideLytSharedWrapperComponent, selector: "cide-lyt-shared-wrapper", inputs: ["shared_wrapper_setup_param", "breadcrumb_data"] }, { kind: "component", type: CideEleCardComponent, selector: "cide-ele-card", inputs: ["title", "subtitle", "cardConfig"], outputs: ["stateChange", "collapsed", "minimized", "maximized", "removed", "headerClick"] }] });
|
|
17167
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreUserCreateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
17168
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: CideCoreUserCreateComponent, isStandalone: true, selector: "cide-core-user-create", viewQueries: [{ propertyName: "menuDetailsRendererTemplate", first: true, predicate: ["menuDetailsRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "permissionsCheckboxRendererTemplate", first: true, predicate: ["permissionsCheckboxRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "menuTypeRendererTemplate", first: true, predicate: ["menuTypeRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "menuRightsPermissionsRendererTemplate", first: true, predicate: ["menuRightsPermissionsRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "permissionsRendererTemplate", first: true, predicate: ["permissionsRendererTemplate"], descendants: true, isSignal: true }], ngImport: i0, template: "<!-- \n ENTERPRISE USER MASTER FORM\n \n Enterprise-Level Styling with Tailwind CSS\n Features: Responsive grids, proper typography, enhanced user experience\n-->\n\n<cide-lyt-shared-wrapper [shared_wrapper_setup_param]=\"{ sypg_page_code: pageCode() }\" [breadcrumb_data]=\"breadcrumbData()\">\n <div class=\"tw-w-full tw-h-full tw-p-1 tw-pt-2\">\n <!-- Toast Notifications -->\n <cide-ele-toast-notification></cide-ele-toast-notification>\n \n <form class=\"tw-max-w-7xl tw-mx-auto tw-bg-transparent\" [formGroup]=\"userMasterForm\" [class.tw-opacity-60]=\"loading()\"\n (ngSubmit)=\"onSubmit()\">\n\n\n <!-- User Context Header -->\n <div\n class=\"tw-bg-gradient-to-r tw-from-blue-50 tw-to-indigo-50 tw-border tw-border-blue-200 tw-rounded-md tw-p-1 tw-mb-2 tw-shadow-sm\">\n <div class=\"tw-flex tw-items-center tw-justify-between tw-flex-wrap tw-gap-2\">\n <!-- User Basic Info Display -->\n <div class=\"tw-flex tw-items-center tw-gap-3 tw-flex-wrap\">\n <!-- Profile Photo Preview -->\n <div class=\"tw-flex tw-items-center tw-gap-2\">\n <div\n class=\"tw-w-8 tw-h-8 tw-rounded-full tw-bg-blue-100 tw-border tw-border-blue-200 tw-flex tw-items-center tw-justify-center tw-overflow-hidden\">\n @if (userMasterForm.get('user_photo_id_cyfm')?.value) {\n <img cideEleFileImage [fileId]=\"userMasterForm.get('user_photo_id_cyfm')?.value\"\n [altText]=\"'Profile Photo'\" class=\"tw-w-full tw-h-full tw-object-cover\">\n } @else {\n <cide-ele-icon name=\"person\" class=\"tw-w-5 tw-h-5 tw-text-blue-600\">\n </cide-ele-icon>\n }\n </div>\n <div class=\"tw-flex tw-flex-col\">\n <span class=\"tw-text-xs tw-font-medium tw-text-blue-900\">\n {{ getUserFullName() || 'New User' }}\n </span>\n <span class=\"tw-text-xs tw-text-blue-600\">\n {{ getUserUsername() || 'Username not set' }}\n </span>\n </div>\n </div>\n\n <!-- Contact Info -->\n <div class=\"tw-flex tw-items-center tw-gap-3\">\n <div class=\"tw-flex tw-items-center tw-gap-1 tw-text-xs tw-text-gray-700\">\n <cide-ele-icon variant=\"gray\" size=\"xs\">email</cide-ele-icon>\n <span>{{ getUserEmail() || 'Email not set' }}</span>\n </div>\n <div class=\"tw-flex tw-items-center tw-gap-1 tw-text-xs tw-text-gray-700\">\n <cide-ele-icon variant=\"gray\" size=\"xs\">phone</cide-ele-icon>\n <span>{{ getUserMobile() || 'Mobile not set' }}</span>\n </div>\n </div>\n\n <!-- Active Status -->\n <div class=\"tw-flex tw-items-center tw-gap-1\">\n @if (getUserActiveStatus()) {\n <span\n class=\"tw-inline-flex tw-items-center tw-px-2 tw-py-1 tw-rounded tw-text-xs tw-font-medium tw-bg-green-100 tw-text-green-700\">\n <cide-ele-icon variant=\"green\" size=\"xs\" class=\"tw-mr-1\">check_circle</cide-ele-icon>\n Active\n </span>\n } @else {\n <span\n class=\"tw-inline-flex tw-items-center tw-px-2 tw-py-1 tw-rounded tw-text-xs tw-font-medium tw-bg-red-100 tw-text-red-700\">\n <cide-ele-icon variant=\"red\" size=\"xs\" class=\"tw-mr-1\">cancel</cide-ele-icon>\n Inactive\n </span>\n }\n </div>\n </div>\n\n <!-- Entity Info -->\n <div class=\"tw-flex tw-items-center tw-gap-2\">\n @if (hasDefaultEntity()) {\n <div class=\"tw-flex tw-items-center tw-gap-1 tw-text-xs tw-text-blue-700\">\n <cide-ele-icon variant=\"blue\" size=\"xs\">business</cide-ele-icon>\n <span class=\"tw-font-medium\">{{ getDefaultEntityName() }}</span>\n </div>\n } @else {\n <div class=\"tw-flex tw-items-center tw-gap-1 tw-text-xs tw-text-gray-500\">\n <cide-ele-icon variant=\"gray\" size=\"xs\">business</cide-ele-icon>\n <span class=\"tw-italic\">No entity</span>\n </div>\n }\n\n <span class=\"tw-text-xs tw-text-gray-600 tw-px-2 tw-py-1 tw-bg-gray-100 tw-rounded\">\n {{ getEntityMappingCount() }} mapping(s)\n </span>\n </div>\n </div>\n </div>\n\n <!-- Tab Navigation -->\n <div class=\"tw-p-0 tw-mb-2 tw-border-b tw-border-gray-200\">\n <cide-ele-tab [tabs]=\"userTabs()\" [activeTabId]=\"activeTab()\" size=\"md\" variant=\"default\"\n (tabChange)=\"onTabChange($event)\">\n </cide-ele-tab>\n </div>\n\n <!-- Tab Content -->\n <div class=\"tw-transition-opacity tw-duration-300\" [class.tw-opacity-60]=\"loading()\">\n @switch (activeTab()) {\n\n @case ('basic') {\n <!-- User Basic Information Section -->\n <div class=\"tw-py-1 tw-border-b-0 tw-mb-1\">\n\n <!-- Top Section: Form Fields on Left, Profile Photo on Right -->\n <div class=\"tw-grid tw-grid-cols-1 lg:tw-grid-cols-[1fr_200px] tw-gap-4 tw-mb-4\">\n <!-- Left Side: Form Fields -->\n <div class=\"tw-space-y-4\">\n <!-- Name Fields - All in One Row -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-4 tw-gap-4\">\n <cide-ele-input id=\"user_firstname\" label=\"First Name\" formControlName=\"user_firstname\"\n placeholder=\"Enter first name\" [maxlength]=\"20\" size=\"md\" (ngModelChange)=\"onNameFieldChange()\">\n </cide-ele-input>\n\n <cide-ele-input id=\"user_middlename\" label=\"Middle Name\" formControlName=\"user_middlename\"\n placeholder=\"Enter middle name\" [maxlength]=\"20\" size=\"md\" (ngModelChange)=\"onNameFieldChange()\">\n </cide-ele-input>\n\n <cide-ele-input id=\"user_lastname\" label=\"Last Name\" formControlName=\"user_lastname\"\n placeholder=\"Enter last name\" [maxlength]=\"20\" size=\"md\" (ngModelChange)=\"onNameFieldChange()\">\n </cide-ele-input>\n\n <cide-ele-input id=\"user_fullname\" label=\"Full Name (Auto-generated)\" formControlName=\"user_fullname\"\n placeholder=\"Auto-generated from name fields or enter manually\" [maxlength]=\"62\" size=\"md\">\n </cide-ele-input>\n </div>\n\n <!-- Contact Information - All in One Row -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-3 tw-gap-4\">\n <cide-ele-input id=\"user_username\" label=\"Username\" formControlName=\"user_username\"\n placeholder=\"Enter unique username\" [maxlength]=\"20\" size=\"md\">\n </cide-ele-input>\n\n <cide-ele-input id=\"user_emailid\" label=\"Email ID\" formControlName=\"user_emailid\" type=\"email\"\n placeholder=\"Enter valid email address\" [maxlength]=\"320\" size=\"md\">\n </cide-ele-input>\n\n <cide-ele-input id=\"user_mobileno\" label=\"Mobile Number\" formControlName=\"user_mobileno\" type=\"tel\"\n placeholder=\"Enter mobile number\" [maxlength]=\"15\" size=\"md\">\n </cide-ele-input>\n </div>\n\n <!-- User Type Mapping -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 tw-gap-4\">\n <cide-ele-select\n id=\"syutm_user_type\"\n label=\"User Type\"\n placeholder=\"Select user type\"\n [options]=\"userTypeOptions\"\n valueKey=\"value\"\n labelKey=\"label\"\n formControlName=\"syutm_user_type\"\n size=\"md\">\n </cide-ele-select>\n\n <cide-ele-input\n id=\"syutm_type_specific_id\"\n label=\"Type-Specific ID\"\n placeholder=\"Enter type-specific ID (e.g., STU001, TCH001)\"\n formControlName=\"syutm_type_specific_id\"\n [maxlength]=\"50\"\n size=\"md\">\n </cide-ele-input>\n </div>\n </div>\n\n <!-- Right Side: Profile Photo Upload -->\n <div class=\"tw-flex tw-items-start tw-justify-center tw-p-0\">\n <cide-ele-file-input id=\"user_photo_id_cyfm\" formControlName=\"user_photo_id_cyfm\" accept=\"image/*\"\n [showPreview]=\"true\" [previewBoxMode]=\"true\" [showFileName]=\"false\" previewWidth=\"180px\"\n previewHeight=\"120px\" placeholderText=\"Upload Photo\" placeholderIcon=\"cloud_upload\" [autoUpload]=\"true\"\n [uploadData]=\"getProfilePhotoUploadData()\" (uploadSuccess)=\"onProfilePhotoUploadSuccess($event)\"\n (uploadError)=\"onProfilePhotoUploadError($event)\"\n (uploadProgressChange)=\"onProfilePhotoUploadProgress($event)\">\n </cide-ele-file-input>\n </div>\n </div>\n\n\n\n <!-- Status Control -->\n <div class=\"tw-grid tw-grid-cols-1 tw-mb-2\">\n <div class=\"tw-p-2 tw-bg-blue-50 tw-border tw-border-blue-100 tw-rounded-lg\">\n <label\n class=\"tw-flex tw-flex-col tw-cursor-pointer tw-py-2 tw-bg-transparent tw-border-none tw-rounded-none tw-transition-all tw-duration-200 hover:tw-bg-blue-75\">\n <cide-ele-input type=\"checkbox\" label=\"Active User Status\" formControlName=\"user_isactive\"\n class=\"tw-h-5 tw-accent-blue-500 tw-rounded tw-mb-1\" />\n <span class=\"tw-font-semibold tw-text-gray-700 tw-text-base\"></span>\n <span class=\"tw-text-sm tw-text-gray-600 tw-mt-1 tw-leading-relaxed\">Enable this user account for system\n access and operations</span>\n </label>\n </div>\n </div>\n </div>\n }\n\n @case ('auth') {\n <!-- Authentication Section -->\n <div class=\"tw-py-1 tw-border-b-0 tw-mb-1\">\n <!-- Password Fields -->\n @if (shouldShowPasswordFields()) {\n <div class=\"tw-mb-4\">\n <!-- Password Fields Header for Edit Mode -->\n @if (isEditMode()) {\n <div class=\"tw-flex tw-items-center tw-justify-between tw-mb-3\">\n <h6 class=\"tw-text-sm tw-font-semibold tw-text-gray-800\">Update Password</h6>\n <button type=\"button\"\n class=\"tw-px-3 tw-py-1 tw-bg-gray-100 tw-text-gray-600 tw-border tw-border-gray-300 tw-rounded-md tw-text-xs tw-font-medium hover:tw-bg-gray-200 tw-transition-colors\"\n (click)=\"cancelPasswordUpdate()\">\n Cancel Password Update\n </button>\n </div>\n }\n\n <div class=\"tw-grid tw-grid-cols-1 lg:tw-grid-cols-2 md:tw-grid-cols-1 tw-gap-6\">\n <cide-ele-input id=\"user_password\" [label]=\"getPasswordFieldLabel()\" formControlName=\"user_password\"\n type=\"password\" placeholder=\"Enter secure password (min 8 characters)\" size=\"md\">\n </cide-ele-input>\n\n <cide-ele-input id=\"user_confirm_password\" [label]=\"getPasswordConfirmLabel()\"\n formControlName=\"user_confirm_password\" type=\"password\" placeholder=\"Confirm your password\" size=\"md\">\n </cide-ele-input>\n </div>\n </div>\n }\n\n <!-- Password Update Option for Edit Mode -->\n @if (isEditMode() && !shouldShowPasswordFields()) {\n <div class=\"tw-mb-4\">\n <div class=\"tw-p-2 tw-bg-blue-50 tw-border tw-border-blue-200 tw-rounded-lg\">\n <h6 class=\"tw-text-sm tw-font-semibold tw-text-blue-800 tw-mb-2\">Password Update</h6>\n <p class=\"tw-text-sm tw-text-blue-600 tw-mb-3\">Current password will be kept. Click below to change\n password.</p>\n\n @if (hasPasswordInput()) {\n <div\n class=\"tw-mb-3 tw-p-2 tw-bg-yellow-50 tw-border tw-border-yellow-200 tw-rounded tw-text-sm tw-text-yellow-700\">\n <cide-ele-icon variant=\"yellow\" size=\"xs\" class=\"tw-mr-1\">warning</cide-ele-icon>\n Password fields contain text. Click \"Change Password\" to manage existing input.\n </div>\n }\n\n <button type=\"button\"\n class=\"tw-px-4 tw-py-2 tw-bg-blue-100 tw-text-blue-700 tw-border tw-border-blue-300 tw-rounded-md tw-text-sm tw-font-medium hover:tw-bg-blue-200 tw-transition-colors\"\n (click)=\"triggerPasswordUpdate()\">\n @if (hasPasswordInput()) {\n Manage Password Fields\n } @else {\n Change Password\n }\n </button>\n </div>\n </div>\n }\n\n <!-- Password Options -->\n <div class=\"tw-grid tw-grid-cols-1 tw-gap-4 tw-mb-4\">\n <div class=\"tw-p-2 tw-bg-yellow-50 tw-border tw-border-yellow-100 tw-rounded-lg\">\n <label\n class=\"tw-flex tw-flex-col tw-gap-2 tw-cursor-pointer tw-py-2 tw-bg-transparent tw-border-none tw-rounded-none tw-transition-all tw-duration-200\">\n <cide-ele-input type=\"checkbox\" label=\"Force Password Change on Login\"\n formControlName=\"user_passwordchangeonlogin\" class=\"tw-h-5 tw-accent-yellow-500 tw-rounded tw-mb-1\" />\n <span class=\"tw-text-sm tw-text-gray-600 tw-mt-1 tw-leading-relaxed\">User will be required to change\n password on next login</span>\n </label>\n </div>\n </div>\n\n </div>\n }\n\n @case ('roles') {\n <!-- Entity, Roles & Permissions Mapping Section -->\n <div class=\"tw-py-1 tw-border-b-0 tw-mb-1\">\n\n\n\n <!-- Important Note -->\n <div class=\"tw-bg-amber-50 tw-border tw-border-amber-200 tw-rounded-lg tw-p-2 tw-mb-4\">\n <div class=\"tw-flex tw-items-start tw-gap-3\">\n <cide-ele-icon variant=\"amber\" size=\"lg\">info</cide-ele-icon>\n <div class=\"tw-flex-1\">\n <h4 class=\"tw-text-sm tw-font-semibold tw-text-amber-800 tw-mb-1\">Entity-Role Based Access</h4>\n <p class=\"tw-text-sm tw-text-amber-700 tw-mb-2\">User access is completely managed through entity-role\n mappings below. At least one entity mapping is required for user access.</p>\n @if (hasDefaultEntity()) {\n <div class=\"tw-flex tw-items-center tw-gap-2 tw-mt-2 tw-p-2 tw-bg-amber-100 tw-rounded\">\n <cide-ele-icon variant=\"amber\" size=\"sm\">star</cide-ele-icon>\n <span class=\"tw-text-sm tw-text-amber-800\">\n <strong>Default Entity:</strong> {{ getDefaultEntityName() }}\n </span>\n </div>\n } @else {\n <div class=\"tw-text-sm tw-text-amber-600 tw-mt-2 tw-italic\">\n \u26A0\uFE0F No default entity selected. Please set one entity as default.\n </div>\n }\n </div>\n </div>\n </div>\n\n <!-- Entity-Role Mapping Section -->\n <div class=\"tw-flex tw-text-center tw-justify-between tw-items-center tw-mb-4\">\n <div>\n <h4 class=\"tw-text-sm tw-text-left tw-font-semibold tw-text-blue-900 tw-mb-1\">Entity-Role Mapping</h4>\n <p class=\"tw-text-sm tw-text-blue-700\">Map user to entities with specific roles and permissions</p>\n </div>\n <div class=\"tw-flex tw-flex-col tw-items-end\">\n <button cideEleButton variant=\"primary\" size=\"md\" type=\"button\" (click)=\"addEntityMapping()\"\n leftIcon=\"add\" [disabled]=\"isViewingOwnProfile() || isAllEntitiesMapped()\"\n [title]=\"isViewingOwnProfile() ? 'You cannot modify your own entity mappings' : (isAllEntitiesMapped() ? 'All entities are mapped' : 'Add Entity Mapping')\">\n Add Entity Mapping\n </button>\n\n @if (isViewingOwnProfile()) {\n <div class=\"tw-mt-2 tw-p-2 tw-bg-amber-50 tw-border tw-border-amber-200 tw-rounded-md tw-max-w-xs\">\n <p class=\"tw-text-xs tw-text-amber-700\">\n <cide-ele-icon variant=\"warning\" size=\"xs\" class=\"tw-mr-1\">lock</cide-ele-icon>\n You cannot modify your own entity mappings.\n </p>\n </div>\n } @else if (isAllEntitiesMapped()) {\n <div class=\"tw-mt-2 tw-p-2 tw-bg-blue-50 tw-border tw-border-blue-200 tw-rounded-md tw-max-w-xs\">\n <p class=\"tw-text-xs tw-text-blue-700\">\n <cide-ele-icon variant=\"info\" size=\"xs\" class=\"tw-mr-1\">info</cide-ele-icon>\n All available entities are already mapped.\n </p>\n </div>\n }\n </div>\n </div>\n\n <div formArrayName=\"core_entity_mapping\">\n @for (mapping of entityMappings(); track mapping.syenm_entity_id_syen?._id || mapping.syenm_entity_id_syen || $index; let i = $index) {\n <cide-ele-card\n [title]=\"getEntityNameFromMapping(i) || 'Entity Mapping ' + (i + 1)\"\n [subtitle]=\"mapping.syenm_isdefault ? 'Primary Entity' : ''\"\n [cardConfig]=\"{\n collapsible: true,\n minimizable: false,\n maximizable: false,\n removable: !mapping?._id && !isViewingOwnProfile(),\n defaultState: 'collapsed',\n showHeader: true,\n showFooter: false,\n variant: 'default',\n size: 'sm',\n shadow: true,\n rounded: true,\n bordered: true\n }\"\n (stateChange)=\"onEntityMappingCardStateChange($event, i)\"\n (removed)=\"removeEntityMapping(i)\"\n class=\"tw-mb-2 entity-mapping-card tw-block\">\n \n <div [formGroupName]=\"i\">\n \n <!-- Card Content -->\n <div class=\"tw-space-y-3\">\n <!-- Hidden form control to maintain form structure for entity -->\n <input type=\"hidden\" [formControlName]=\"'syenm_entity_id_syen'\" />\n \n <!-- Role, Default, Active, and User Type in One Row -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-4 tw-gap-3\">\n <!-- Role Selection with Copy Button -->\n <div class=\"tw-flex tw-flex-col\">\n <cide-ele-select label=\"Role for this Entity\" [options]=\"getRoleOptionsForEntity(i)\"\n formControlName=\"syenm_role_id_syusrol\" valueKey=\"_id\" labelKey=\"syusrol_role_name\"\n placeholder=\"Select role for this entity\" size=\"md\" (change)=\"onRoleChange(i, $event)\">\n </cide-ele-select>\n @if (!isViewingOwnProfile() && entityMappings().length > 1) {\n <button \n type=\"button\"\n (click)=\"showCopyRoleFromEntityDrawer(i)\"\n class=\"tw-mt-1 tw-text-xs tw-text-blue-600 hover:tw-text-blue-800 tw-flex tw-items-center tw-gap-1 tw-w-fit tw-transition-colors\"\n title=\"Copy role and settings from another entity mapping\">\n <cide-ele-icon variant=\"blue\" size=\"xs\">content_copy</cide-ele-icon>\n <span>Copy from Entity</span>\n </button>\n }\n </div>\n \n <!-- Primary Entity Checkbox -->\n <div class=\"tw-flex tw-flex-col tw-justify-end\">\n <div class=\"tw-flex tw-items-center tw-gap-2 tw-px-3 tw-py-2 tw-rounded-md tw-border tw-border-green-300 tw-bg-green-50 dark:tw-bg-green-900/30 dark:tw-border-green-700\" (click)=\"$event.stopPropagation()\">\n <input \n type=\"checkbox\" \n [checked]=\"mapping.syenm_isdefault\"\n (change)=\"onDefaultEntityChange(i, $event)\" \n class=\"tw-h-4 tw-w-4 tw-accent-green-600 tw-cursor-pointer\" />\n <label class=\"tw-inline-flex tw-items-center tw-gap-1 tw-text-xs tw-font-semibold tw-text-green-700 dark:tw-text-green-300 tw-cursor-pointer\">\n <cide-ele-icon variant=\"green\" size=\"xs\" class=\"!tw-text-green-600 dark:!tw-text-green-400\">star</cide-ele-icon>\n DEFAULT\n </label>\n </div>\n </div>\n \n <!-- Active Mapping Checkbox -->\n <div class=\"tw-flex tw-flex-col tw-justify-end\">\n <div class=\"tw-flex tw-items-center tw-gap-2 tw-px-3 tw-py-2 tw-rounded-md tw-border tw-border-blue-300 tw-bg-blue-50 dark:tw-bg-blue-900/30 dark:tw-border-blue-700\" (click)=\"$event.stopPropagation()\">\n <input \n type=\"checkbox\" \n [checked]=\"mapping.syenm_isactive\"\n (change)=\"onActiveMappingChange(i, $event)\" \n class=\"tw-h-4 tw-w-4 tw-accent-blue-600 tw-cursor-pointer\" />\n <label class=\"tw-inline-flex tw-items-center tw-gap-1 tw-text-xs tw-font-semibold tw-text-blue-700 dark:tw-text-blue-300 tw-cursor-pointer\">\n <cide-ele-icon variant=\"blue\" size=\"xs\" class=\"!tw-text-blue-600 dark:!tw-text-blue-400\">check_circle</cide-ele-icon>\n Active\n </label>\n </div>\n </div>\n \n <!-- User Type Mappings -->\n <div class=\"tw-flex tw-flex-col tw-justify-end\">\n <div class=\"tw-flex tw-items-center tw-gap-1.5 tw-flex-wrap\">\n @if (getEntityIdFromMapping(i)) {\n @if (getUserTypeMappingsForEntity(getEntityIdFromMapping(i)).length > 0) {\n @for (typeMapping of getUserTypeMappingsForEntity(getEntityIdFromMapping(i)); track typeMapping._id || typeMapping.syutm_type_specific_id) {\n <span class=\"tw-inline-flex tw-items-center tw-px-2 tw-py-1 tw-rounded tw-text-[10px] tw-font-medium tw-bg-purple-50 dark:tw-bg-purple-900/30 tw-text-gray-900 dark:tw-text-gray-100 tw-border tw-border-purple-300 dark:tw-border-purple-700\">\n <cide-ele-icon variant=\"purple\" size=\"xs\" class=\"tw-mr-1 !tw-text-purple-600 dark:!tw-text-purple-400\">person</cide-ele-icon>\n {{ typeMapping.syutm_user_type }}\n @if (typeMapping.syutm_isactive) {\n <span class=\"tw-ml-1 tw-w-1.5 tw-h-1.5 tw-rounded-full tw-bg-green-600\"></span>\n }\n </span>\n }\n }\n }\n </div>\n </div>\n </div>\n\n\n <!-- Entity-Specific Details and Active Period - All in One Row -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-4 tw-gap-3\">\n <cide-ele-select label=\"Department for this Entity\" [options]=\"getDepartmentOptionsForEntity(i)\"\n formControlName=\"syenm_department_id_sydept\" (change)=\"onDepartmentChange($event)\" valueKey=\"_id\"\n labelKey=\"sydept_name\" placeholder=\"Select department\" size=\"md\">\n </cide-ele-select>\n\n <cide-ele-select label=\"Designation for this Entity\" [options]=\"getDesignationOptionsForEntity(i)\"\n valueKey=\"_id\" labelKey=\"sydsg_name\" formControlName=\"syenm_designation_id_sydsg\"\n placeholder=\"Select designation\" size=\"md\">\n </cide-ele-select>\n\n <cide-ele-input label=\"Active From\" [id]=\"'syenm_activefrom['+i+']'\"\n formControlName=\"syenm_activefrom\" type=\"date\" size=\"md\">\n </cide-ele-input>\n\n <cide-ele-input label=\"Active Until\" [id]=\"'syenm_activeupto['+i+']'\"\n formControlName=\"syenm_activeupto\" type=\"date\" size=\"md\">\n </cide-ele-input>\n </div>\n\n <!-- Menu Rights Grid for this Entity-Role -->\n <div class=\"tw-border-t tw-border-gray-200\">\n\n @if (getMenuRightsForMapping(i).length > 0) {\n <!-- Menu Rights Tree Grid -->\n\n <cide-ele-data-grid [config]=\"getMenuRightsGridConfig(i)\"\n [templateRenderers]=\"getMenuRightsTemplateRenderers(i)\"\n (gridEvent)=\"onMenuRightsGridEvent($event, i)\" class=\"tw-h-96 tw-w-full\">\n </cide-ele-data-grid>\n\n } @else {\n <div class=\"tw-text-center tw-py-8 tw-bg-gray-50 tw-border tw-border-gray-200 tw-rounded-lg\">\n <div class=\"tw-text-gray-400 tw-mb-3\">\n <cide-ele-icon variant=\"gray\" size=\"lg\">menu</cide-ele-icon>\n </div>\n <h6 class=\"tw-text-sm tw-font-medium tw-text-gray-600 tw-mb-2\">No Menu Rights Available</h6>\n <p class=\"tw-text-xs tw-text-gray-500 tw-mb-3 tw-text-center\">Select both entity and role to\n automatically load\n menu rights for this mapping.</p>\n </div>\n }\n </div>\n </div>\n </div>\n </cide-ele-card>\n }\n </div>\n\n @if (entityMappings().length === 0) {\n <div class=\"tw-text-center tw-py-8 tw-bg-white tw-border tw-border-blue-200 tw-rounded-lg\">\n <div class=\"tw-text-blue-400 tw-mb-3\">\n <cide-ele-icon variant=\"blue\" size=\"lg\">business</cide-ele-icon>\n </div>\n <h4 class=\"tw-text-sm tw-font-medium tw-text-blue-800 tw-mb-2\">No Entity Mappings</h4>\n <p class=\"tw-text-blue-600 tw-mb-4 tw-text-center\">Add entity mappings to assign specific roles and\n permissions for different entities.</p>\n @if (!isViewingOwnProfile()) {\n <button class=\"tw-mx-auto\" cideEleButton variant=\"primary\" size=\"md\" type=\"button\"\n (click)=\"addEntityMapping()\" leftIcon=\"add\">\n Add First Entity Mapping\n </button>\n } @else {\n <p class=\"tw-text-amber-600 tw-text-sm tw-font-medium\">\n <cide-ele-icon variant=\"warning\" size=\"xs\" class=\"tw-mr-1\">lock</cide-ele-icon>\n You cannot modify your own entity mappings.\n </p>\n }\n </div>\n }\n </div>\n }\n\n @case ('addresses') {\n <!-- Contact Addresses Section -->\n <div class=\"tw-py-1 tw-border-b-0 tw-mb-1\">\n <div class=\"tw-flex tw-justify-end\">\n <div class=\"tw-flex tw-justify-between tw-items-end tw-mb-2 tw-gap-4\">\n <button cideEleButton variant=\"primary\" size=\"md\" type=\"button\" (click)=\"addContactAddress()\"\n leftIcon=\"add\" [disabled]=\"!hasAddContactAddressRights()\">\n Add New Address\n </button>\n </div>\n </div>\n\n <div formArrayName=\"core_user_contact_addresses\">\n @for (address of contactAddresses(); track $index; let i = $index) {\n <div [formGroupName]=\"i\"\n class=\"tw-bg-white tw-border tw-border-gray-200 tw-rounded-xl tw-mb-8 tw-overflow-hidden tw-transition-all tw-duration-300 hover:tw-shadow-lg tw-shadow-sm\">\n <div\n class=\"tw-bg-gradient-to-r tw-from-gray-50 tw-to-gray-100 tw-px-4 tw-py-2 tw-flex tw-justify-between tw-items-center tw-border-b tw-border-gray-200\">\n <!-- Use address type as header instead of generic \"Address X\" -->\n <h4 class=\"tw-m-0 tw-text-gray-700 tw-text-sm tw-font-semibold tw-tracking-tight\">\n {{ getAddressTypeLabel(i) || ('Address ' + (i + 1)) }}\n </h4>\n <div class=\"tw-flex tw-items-center tw-gap-2\">\n @if (isAddressOwner(i)) {\n <button cideEleButton variant=\"secondary\" size=\"xs\" type=\"button\" (click)=\"shareAddress(i)\"\n leftIcon=\"share\" class=\"tw-text-blue-600 hover:tw-text-blue-700\">\n Share\n </button>\n }\n @if (!address?._id) {\n <button cideEleButton variant=\"danger\" size=\"sm\" type=\"button\" (click)=\"removeContactAddress(i)\"\n leftIcon=\"delete\">\n Remove\n </button>\n }\n </div>\n </div>\n <div class=\"tw-p-4\">\n <!-- Main Layout: Inputs on Left, Address Textarea on Right -->\n <div class=\"tw-grid tw-grid-cols-1 lg:tw-grid-cols-4 tw-gap-3 tw-mb-3\">\n \n <!-- Left Side: Input Fields (3/4 width) -->\n <div class=\"lg:tw-col-span-3\">\n <!-- Row 1: Address Type, Contact Person -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 tw-gap-3 tw-mb-3\">\n <cide-ele-select label=\"Address Type\" [options]=\"addressTypeOptions()\" id=\"sycad_address_type_id_sygms\"\n formControlName=\"sycad_address_type_id_sygms\" placeholder=\"Select type\" size=\"sm\"\n valueKey=\"_id\" labelKey=\"sygms_title\" (change)=\"onAddressTypeChange(i)\">\n </cide-ele-select>\n\n <cide-ele-input label=\"Contact Person\" formControlName=\"sycad_contact_person_name\"\n placeholder=\"Enter contact person\" size=\"sm\">\n </cide-ele-input>\n </div>\n\n <!-- Row 2: Postal Code, City, State, Country -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-4 tw-gap-3\">\n <cide-ele-select label=\"Postal Code\" [options]=\"addressPostalCodes()[i] || []\"\n formControlName=\"sycad_contact_pin_sypin\" placeholder=\"Select postal code\" [searchable]=\"true\"\n [loading]=\"addressPostalCodesLoading()[i] || false\" (searchChange)=\"onPostalCodeSearch($event, i)\"\n (change)=\"onPostalCodeSelection($event, i)\" size=\"sm\">\n </cide-ele-select>\n\n <cide-ele-input label=\"City\" formControlName=\"sycad_contact_city_sypin\" placeholder=\"Enter city\"\n size=\"sm\">\n </cide-ele-input>\n\n <cide-ele-input label=\"State\" formControlName=\"sycad_contact_state_sypin\" placeholder=\"Enter state\"\n size=\"sm\">\n </cide-ele-input>\n\n <cide-ele-select label=\"Country\" [options]=\"addressCountries()[i] || []\"\n formControlName=\"sycad_contact_country_syctr\" placeholder=\"Select country\" valueKey=\"_id\"\n labelKey=\"syctr_country_iso_name\" [searchable]=\"true\" (searchChange)=\"onCountrySearch($event, i)\"\n [loading]=\"addressCountriesLoading()[i] || false\" size=\"sm\">\n </cide-ele-select>\n </div>\n </div>\n\n <!-- Right Side: Address Textarea (1/4 width, spans 2 rows) -->\n <div class=\"lg:tw-col-span-1 lg:tw-row-span-2 tw-flex tw-flex-col\">\n <cide-ele-textarea label=\"Complete Address\" formControlName=\"sycad_contact_address\"\n placeholder=\"Enter complete address with area, city, and landmarks\" [rows]=\"4\" size=\"sm\"\n class=\"tw-h-full\">\n </cide-ele-textarea>\n </div>\n </div>\n\n <!-- Contact Details: Primary Phone, Alt Phone, Fax, Primary Email in 4 columns -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-4 tw-gap-3 tw-mb-3\">\n <cide-ele-input label=\"Primary Phone\" formControlName=\"sycad_contact_phone\" type=\"tel\"\n placeholder=\"Primary phone\" size=\"sm\">\n </cide-ele-input>\n\n <cide-ele-input label=\"Alternate Phone\" formControlName=\"sycad_contact_phone_alt\" type=\"tel\"\n placeholder=\"Alternate phone\" size=\"sm\">\n </cide-ele-input>\n\n <cide-ele-input label=\"Fax Number\" formControlName=\"sycad_contact_fax\" placeholder=\"Fax number\"\n size=\"sm\">\n </cide-ele-input>\n\n <cide-ele-input label=\"Primary Email\" formControlName=\"sycad_contact_email\" type=\"email\"\n placeholder=\"Primary email\" size=\"sm\">\n </cide-ele-input>\n </div>\n\n <!-- Alternate Email in single row -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 tw-gap-3\">\n <cide-ele-input label=\"Alternate Email\" formControlName=\"sycad_contact_email_alt\" type=\"email\"\n placeholder=\"Alternate email address\" size=\"sm\">\n </cide-ele-input>\n </div>\n </div>\n </div>\n }\n </div>\n </div>\n }\n\n @case ('documents') {\n <!-- Documents Section -->\n <div class=\"tw-py-1 tw-border-b-0 tw-mb-1\">\n <div class=\"tw-flex tw-justify-end tw-items-end tw-mb-2 tw-gap-4\">\n <button cideEleButton variant=\"primary\" size=\"md\" type=\"button\" (click)=\"addDocument()\" leftIcon=\"add\" [disabled]=\"!hasAddDocumentRights()\">\n Add Document\n </button>\n </div>\n <div formArrayName=\"core_user_documents\">\n @for (doc of documents(); track $index; let i = $index) {\n <div [formGroupName]=\"i\"\n class=\"tw-bg-white tw-border tw-border-gray-200 tw-rounded-xl tw-mb-8 tw-overflow-hidden tw-transition-all tw-duration-300 hover:tw-shadow-lg tw-shadow-sm\">\n <div\n class=\"tw-bg-gradient-to-r tw-from-gray-50 tw-to-gray-100 tw-px-4 tw-py-2 tw-flex tw-justify-between tw-items-center tw-border-b tw-border-gray-200\">\n <h4 class=\"tw-m-0 tw-text-gray-700 tw-text-sm tw-font-semibold tw-tracking-tight\">\n {{ getDocumentTypeLabel(i) || ('Document ' + (i + 1)) }}\n </h4>\n <div class=\"tw-flex tw-gap-2\">\n @if (doc?._id) {\n <button cideEleButton variant=\"secondary\" size=\"sm\" type=\"button\" (click)=\"shareDocumentRights(i)\"\n leftIcon=\"share\">\n Share\n </button>\n }\n </div>\n </div>\n <div class=\"tw-p-4\">\n <!-- Main Layout: Inputs on Left, File Upload on Right -->\n <div class=\"tw-grid tw-grid-cols-1 lg:tw-grid-cols-3 tw-gap-4\">\n \n <!-- Left Side: Document Information (2/3 width) -->\n <div class=\"lg:tw-col-span-2\">\n <!-- Row 1: Document Type, Document Number, Name as per Document -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-3 tw-gap-3 tw-mb-3\">\n <cide-ele-select label=\"Document Type\" [options]=\"documentTypeOptions()\"\n formControlName=\"syusd_document_type_id_sygms\" placeholder=\"Select type\" size=\"sm\"\n valueKey=\"_id\" labelKey=\"sygms_title\" (change)=\"onDocumentTypeChange(i)\">\n </cide-ele-select>\n\n <cide-ele-input label=\"Document Number\" formControlName=\"syusd_doc_number\"\n placeholder=\"Document number\" size=\"sm\">\n </cide-ele-input>\n\n <cide-ele-input label=\"Name as per Document\" formControlName=\"syusd_doc_name_as_per_doc\"\n placeholder=\"Name on document\" size=\"sm\">\n </cide-ele-input>\n </div>\n\n <!-- Row 2: Issue Date, Expiry Date, Photo Group -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-3 tw-gap-3 tw-mb-3\">\n <cide-ele-input label=\"Issue Date\" formControlName=\"syusd_doc_issue_date\"\n [id]=\"'syusd_doc_issue_date['+i+']'\" type=\"date\" size=\"sm\">\n </cide-ele-input>\n\n <cide-ele-input label=\"Expiry Date\" formControlName=\"syusd_doc_expiry_date\"\n [id]=\"'syusd_doc_expiry_date['+i+']'\" type=\"date\" size=\"sm\">\n </cide-ele-input>\n </div>\n\n <!-- Row 3: Verification Status, KYC Status -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 tw-gap-3\">\n <cide-ele-select label=\"Verification Status\" [options]=\"documentVerificationStatusOptions()\"\n formControlName=\"syusd_doc_verification_status_id_sygms\" placeholder=\"Select status\"\n size=\"sm\" valueKey=\"_id\" labelKey=\"sygms_title\">\n </cide-ele-select>\n\n <cide-ele-select label=\"KYC Status\" [options]=\"documentKycStatusOptions()\"\n formControlName=\"syusd_doc_kyc_status_id_sygms\" placeholder=\"Select KYC status\" size=\"sm\"\n valueKey=\"_id\" labelKey=\"sygms_title\">\n </cide-ele-select>\n </div>\n </div>\n\n <!-- Right Side: File Upload (1/3 width) -->\n <div class=\"lg:tw-col-span-1\">\n <div class=\"tw-bg-gray-50 tw-border tw-border-gray-200 tw-rounded-lg tw-p-3 tw-h-full\">\n \n <!-- File Upload Input -->\n <cide-ele-file-input\n [id]=\"'document-files-' + i\"\n [multiple]=\"true\"\n formControlName=\"syusd_photo_group_id_cyfm\"\n [accept]=\"'.pdf,.jpg,.jpeg,.png,.doc,.docx'\"\n [autoUpload]=\"true\"\n [uploadData]=\"getDocumentUploadData(i)\"\n (change)=\"onDocumentFilesSelected($event, i)\"\n (uploadSuccess)=\"onDocumentUploadSuccess($event, i)\"\n (uploadError)=\"onDocumentUploadError($event, i)\"\n (uploadProgressChange)=\"onDocumentUploadProgress($event, i)\"\n class=\"tw-mb-3\"\n size=\"sm\">\n </cide-ele-file-input>\n\n <!-- Upload Status -->\n <!-- Upload status is now handled by the file input component itself -->\n </div>\n </div>\n </div>\n </div>\n </div>\n }\n </div>\n </div>\n }\n\n @case ('family') {\n <!-- Family Details Section - Compact Design -->\n <div class=\"tw-py-1 tw-border-b-0 tw-mb-1\">\n <div class=\"tw-flex tw-justify-end tw-items-end tw-mb-3 tw-gap-4\">\n <button cideEleButton variant=\"primary\" size=\"sm\" type=\"button\" (click)=\"addFamilyDetail()\" leftIcon=\"add\" [disabled]=\"!hasAddFamilyDetailRights()\">\n Add Family Member\n </button>\n </div>\n\n <div formArrayName=\"core_user_family_details\">\n @for (family of familyDetails(); track $index; let i = $index) {\n <div [formGroupName]=\"i\"\n class=\"tw-bg-white tw-border tw-border-gray-200 tw-rounded-lg tw-mb-4 tw-overflow-hidden tw-transition-all tw-duration-200 hover:tw-shadow-md tw-shadow-sm\">\n \n <!-- Compact Header -->\n <div class=\"tw-bg-gray-50 tw-px-4 tw-py-2 tw-flex tw-justify-between tw-items-center tw-border-b tw-border-gray-200\">\n <h4 class=\"tw-m-0 tw-text-gray-700 tw-text-sm tw-font-medium\">Family Member {{ i + 1 }}</h4>\n <div class=\"tw-flex tw-gap-2\">\n @if (family?._id) {\n <button cideEleButton variant=\"secondary\" size=\"xs\" type=\"button\" (click)=\"shareFamilyDetailRights(i)\"\n leftIcon=\"share\">\n Share\n </button>\n }\n @if (!family?._id) {\n <button cideEleButton variant=\"danger\" size=\"xs\" type=\"button\" (click)=\"removeFamilyDetail(i)\" leftIcon=\"delete\">\n Remove\n </button>\n }\n </div>\n </div>\n \n <!-- Compact Form Content - 3 inputs per row -->\n <div class=\"tw-p-4\">\n <!-- Row 1: Name, User, and Combined Relationship/Active Status (33.33% each) -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-3 tw-gap-3 tw-mb-3\">\n <cide-ele-input label=\"Family Member Name\" formControlName=\"syfdl_family_member_name\"\n placeholder=\"Enter family member full name\" size=\"sm\">\n </cide-ele-input>\n\n <cide-ele-select label=\"Family Member User\" [options]=\"userOptions(i)\"\n formControlName=\"syfdl_family_member_id_user\" placeholder=\"Select family member user\" size=\"sm\"\n valueKey=\"_id\" labelKey=\"user_fullname\" [searchable]=\"true\"\n [loading]=\"userSearchLoading()[i] || false\" (searchChange)=\"onUserSearchChange($event, i)\"\n (change)=\"onUserSelectionChange($event, i)\">\n </cide-ele-select>\n\n <!-- Combined Relationship and Active Status (33.33%) -->\n <div class=\"tw-flex tw-flex-row tw-gap-2 tw-items-end\">\n <div class=\"tw-flex-1\">\n <cide-ele-select label=\"Relationship\" [options]=\"relationshipOptions()\"\n formControlName=\"syfdl_relationship_id_sygms\" placeholder=\"Select relationship\" size=\"sm\"\n valueKey=\"_id\" labelKey=\"sygms_title\">\n </cide-ele-select>\n </div>\n\n <div class=\"tw-flex tw-items-center tw-pt-1 tw-flex-shrink-0\">\n <cide-ele-input formControlName=\"syfdl_isactive\" type=\"checkbox\" label=\"Active\" size=\"sm\">\n </cide-ele-input>\n </div>\n </div>\n </div>\n\n <!-- Row 2: Blood Group, DOB, and Phone -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 xl:tw-grid-cols-3 tw-gap-3 tw-mb-3\">\n <cide-ele-select label=\"Blood Group\" [options]=\"bloodGroupOptions()\"\n formControlName=\"syfdl_blood_group_sygms\" placeholder=\"Select blood group\" size=\"sm\" valueKey=\"_id\"\n labelKey=\"sygms_title\">\n </cide-ele-select>\n\n <cide-ele-input label=\"Date of Birth\" formControlName=\"syfdl_family_member_dob\" type=\"date\" size=\"sm\"\n [id]=\"'syfdl_family_member_dob['+i+']'\">\n </cide-ele-input>\n\n <cide-ele-input label=\"Contact Phone\" formControlName=\"syfdl_contact_phone\" type=\"tel\"\n placeholder=\"Enter contact phone\" size=\"sm\">\n </cide-ele-input>\n </div>\n\n <!-- Row 3: Email, Email ID, and Contact Number -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 xl:tw-grid-cols-3 tw-gap-3 tw-mb-3\">\n <cide-ele-input label=\"Contact Email\" formControlName=\"syfdl_contact_email\" type=\"email\"\n placeholder=\"Enter contact email\" size=\"sm\">\n </cide-ele-input>\n\n <cide-ele-input label=\"Contact Email ID\" formControlName=\"syfdl_contact_email_id\" type=\"email\"\n placeholder=\"Enter contact email ID\" size=\"sm\">\n </cide-ele-input>\n\n <cide-ele-input label=\"Contact Number\" formControlName=\"syfdl_contact_number\" type=\"tel\"\n placeholder=\"Enter contact number\" size=\"sm\">\n </cide-ele-input>\n </div>\n\n </div>\n </div>\n }\n </div>\n </div>\n }\n }\n </div>\n\n <!-- Form Actions -->\n <div\n class=\"tw-flex tw-justify-between tw-items-center tw-gap-4 tw-py-2 tw-bg-white tw-border-t tw-border-gray-200 tw-sticky tw-bottom-0 tw-z-10\">\n <!-- Error Display Component -->\n <div class=\"tw-flex-1\">\n <cide-form-field-error [formGroup]=\"userMasterForm\"></cide-form-field-error>\n </div>\n\n <!-- Action Buttons -->\n <div class=\"tw-flex tw-gap-4\">\n <button cideEleButton type=\"button\" variant=\"secondary\" (click)=\"resetForm()\" leftIcon=\"refresh\"\n [disabled]=\"loading()\">\n Reset Form\n </button>\n\n <button cideEleButton type=\"submit\" variant=\"primary\" [disabled]=\"loading() || userMasterForm.invalid\"\n [loading]=\"loading()\" leftIcon=\"save\">\n Save User Master\n </button>\n </div>\n </div>\n </form>\n</div>\n</cide-lyt-shared-wrapper>\n\n<!-- Template Renderers for Role Permissions Grid -->\n<ng-template #menuDetailsRendererTemplate let-row=\"row\">\n <div class=\"tw-flex tw-items-center tw-space-x-3 tw-min-w-0\">\n <!-- Menu Icon -->\n <div class=\"tw-flex-shrink-0\">\n @if (row.syme_type === 'module') {\n <cide-ele-icon class=\"tw-text-blue-600 tw-w-4 tw-h-4\">folder</cide-ele-icon>\n } @else if (row.syme_type === 'section') {\n <cide-ele-icon class=\"tw-text-green-600 tw-w-4 tw-h-4\">folder_open</cide-ele-icon>\n } @else if (row.syme_type === 'menu') {\n <cide-ele-icon class=\"tw-text-purple-600 tw-w-4 tw-h-4\">menu</cide-ele-icon>\n } @else {\n <cide-ele-icon class=\"tw-text-gray-600 tw-w-4 tw-h-4\">description</cide-ele-icon>\n }\n </div>\n\n <!-- Menu Details -->\n <div class=\"tw-ml-3 tw-min-w-0 tw-flex-1\">\n <div class=\"tw-flex tw-items-center tw-gap-2\">\n <div class=\"tw-text-xs tw-font-medium tw-text-gray-900 tw-truncate\" [title]=\"row.syme_title\">\n {{ row.syme_title || row.menu?.syme_title || row.menu?.syme_menu_name || 'Untitled' }}\n </div>\n <!-- Green pill indicator for parent menus with child permissions -->\n @if (row.syme_type === 'module' || row.syme_type === 'section') {\n @if (hasChildMenusWithPermissions(row._id)) {\n <span\n class=\"tw-inline-flex tw-items-center tw-px-2 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium tw-bg-green-100 tw-text-green-800 tw-whitespace-nowrap\">\n Assigned\n </span>\n }\n }\n </div>\n @if (row.permission?.sygms_name) {\n <div class=\"tw-text-xs tw-text-blue-500 tw-truncate\" [title]=\"row.permission?.sygms_name\">\n {{ row.permission?.sygms_name }}\n </div>\n }\n </div>\n </div>\n</ng-template>\n\n<!-- Menu Type Renderer Template -->\n<ng-template #menuTypeRendererTemplate let-row=\"row\" let-value=\"value\">\n <div class=\"tw-flex tw-items-center tw-justify-center\">\n @if (row.syme_type === 'module') {\n <span\n class=\"tw-inline-flex tw-items-center tw-px-2 tw-py-1 tw-rounded-full tw-text-xs tw-font-medium tw-bg-blue-100 tw-text-blue-800\">\n Module\n </span>\n } @else if (row.syme_type === 'section') {\n <span\n class=\"tw-inline-flex tw-items-center tw-px-2 tw-py-1 tw-rounded-full tw-text-xs tw-font-medium tw-bg-green-100 tw-text-green-800\">\n Section\n </span>\n } @else if (row.syme_type === 'menu') {\n <span\n class=\"tw-inline-flex tw-items-center tw-px-2 tw-py-1 tw-rounded-full tw-text-xs tw-font-medium tw-bg-purple-100 tw-text-purple-800\">\n Menu\n </span>\n } @else {\n <span\n class=\"tw-inline-flex tw-items-center tw-px-2 tw-py-1 tw-rounded-full tw-text-xs tw-font-medium tw-bg-gray-100 tw-text-gray-800\">\n {{ row.syme_type || 'Unknown' }}\n </span>\n }\n </div>\n</ng-template>\n\n<!-- Permissions Checkbox Renderer Template -->\n<ng-template #permissionsCheckboxRendererTemplate let-row=\"row\" let-value=\"value\">\n <div class=\"tw-flex tw-flex-wrap tw-gap-2 tw-max-w-full\">\n @if (row.syme_type === 'menu' && row?.syme_permissions_id_sygms && row?.syme_permissions_id_sygms.length > 0) {\n @for (permissionId of row?.syme_permissions_id_sygms || []; track permissionId) {\n <div class=\"tw-flex tw-items-center tw-space-x-1\">\n <div class=\"tw-flex tw-items-center tw-space-x-1\">\n <input type=\"checkbox\" [checked]=\"isPermissionSelected(row._id, permissionId)\" [disabled]=\"true\"\n class=\"tw-h-4 tw-w-4 tw-text-blue-600 tw-bg-gray-100 tw-border-gray-300 tw-rounded focus:tw-ring-blue-500\">\n <label class=\"tw-text-xs tw-text-gray-700\">\n {{ getPermissionById(permissionId)?.sygms_title || 'Unknown' }}\n </label>\n </div>\n </div>\n }\n } @else {\n <!-- Show green checkmark for parent menus with child permissions -->\n @if (row.syme_type === 'module' || row.syme_type === 'section' || row.syme_type === 'title') {\n @if (hasChildMenusWithPermissions(row._id)) {\n <div class=\"tw-flex tw-items-center tw-justify-center tw-w-6 tw-h-6 tw-bg-green-100 tw-rounded-full\">\n <cide-ele-icon class=\"tw-text-green-600\" size=\"xs\">\n check\n </cide-ele-icon>\n </div>\n } @else {\n <span class=\"tw-text-xs tw-text-gray-400\">N/A</span>\n }\n } @else {\n <span class=\"tw-text-xs tw-text-gray-400\">N/A</span>\n }\n }\n </div>\n</ng-template>\n\n<!-- Menu Rights Permissions Renderer Template -->\n<ng-template #menuRightsPermissionsRendererTemplate let-row=\"row\" let-value=\"value\">\n <div class=\"tw-flex tw-flex-wrap tw-gap-2 tw-max-w-full\">\n <!-- Role Rights Display -->\n @if (row.role_rights && row.role_rights.length > 0) {\n <div class=\"tw-mb-2\">\n <div class=\"tw-text-xs tw-text-gray-500 tw-mb-1\">Role Rights:</div>\n <div class=\"tw-flex tw-flex-wrap tw-gap-1\">\n @for (right of row.role_rights; track $index) {\n <span class=\"tw-inline-block tw-px-2 tw-py-1 tw-text-xs tw-bg-blue-100 tw-text-blue-800 tw-rounded\">\n {{ right }}\n </span>\n }\n </div>\n </div>\n }\n\n\n <!-- Exception Indicator -->\n @if (row.hasException) {\n <div class=\"tw-mt-2\">\n <span class=\"tw-inline-block tw-px-2 tw-py-1 tw-text-xs tw-bg-yellow-100 tw-text-yellow-800 tw-rounded\">\n Override\n </span>\n </div>\n } @else {\n <div class=\"tw-mt-2\">\n <span class=\"tw-text-xs tw-text-gray-400\">Default</span>\n </div>\n }\n </div>\n</ng-template>\n\n<!-- Permissions Renderer Template -->\n<ng-template #permissionsRendererTemplate let-row=\"row\" let-value=\"value\">\n <div class=\"tw-flex tw-flex-wrap tw-gap-2 tw-max-w-full\">\n @if (row._permissionValues && Object.keys(row._permissionValues).length > 0) {\n @for (permissionId of Object.keys(row._permissionValues); track permissionId) {\n <div class=\"tw-flex tw-items-center tw-space-x-2\">\n <cide-ele-input type=\"checkbox\" [ngModel]=\"row._permissionValues[permissionId].checked\"\n (ngModelChange)=\"onPermissionChangeSafe($event, row, permissionId)\"\n [id]=\"'permission-' + row._id + '-' + permissionId\" class=\"tw-h-4 tw-w-4\">\n </cide-ele-input>\n <label [for]=\"'permission-' + row._id + '-' + permissionId\" \n class=\"tw-text-xs tw-cursor-pointer\"\n [ngClass]=\"{\n 'tw-text-gray-700': row._permissionValues[permissionId].modified === row._permissionValues[permissionId].actual,\n 'tw-text-blue-600 tw-font-semibold': row._permissionValues[permissionId].modified !== row._permissionValues[permissionId].actual\n }\">\n {{ row._permissionValues[permissionId].permission?.sygms_title }}\n @if (row._permissionValues[permissionId].modified !== row._permissionValues[permissionId].actual) {\n <span class=\"tw-text-xs tw-text-orange-500 tw-ml-1\" title=\"Modified from role permission\">\n ({{ row._permissionValues[permissionId].actual ? '\u2713' : '\u2717' }})\n </span>\n }\n </label>\n </div>\n }\n } @else {\n <!-- No permissions to display - show N/A (permissions are already loaded, just empty) -->\n <span class=\"tw-text-xs tw-text-gray-400\">N/A</span>\n }\n </div>\n</ng-template>", styles: [":host ::ng-deep .entity-mapping-card{transition:all .2s ease}:host ::ng-deep .entity-mapping-card:hover{transform:translateY(-2px)}:host ::ng-deep .entity-mapping-card .cide-card-header{background:linear-gradient(135deg,#3b82f60d,#9333ea0d);border-bottom:1px solid rgba(59,130,246,.1)}:host ::ng-deep .dark .entity-mapping-card .cide-card-header{background:linear-gradient(135deg,#3b82f61a,#9333ea1a);border-bottom:1px solid rgba(59,130,246,.2)}:host ::ng-deep .entity-mapping-card .cide-card-header-content{font-weight:600}:host ::ng-deep .entity-mapping-card .cide-card-body{background:linear-gradient(180deg,#f9fafb80,#ffffff80)}:host ::ng-deep .dark .entity-mapping-card .cide-card-body{background:linear-gradient(180deg,#11182780,#1f293780)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$2.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i1$2.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: CideInputComponent, selector: "cide-ele-input", inputs: ["fill", "label", "labelHide", "disabled", "clearInput", "labelPlacement", "labelDir", "placeholder", "leadingIcon", "trailingIcon", "helperText", "helperTextCollapse", "hideHelperAndErrorText", "errorText", "maxlength", "minlength", "required", "autocapitalize", "autocomplete", "type", "width", "id", "ngModel", "option", "min", "max", "step", "size"], outputs: ["ngModelChange"] }, { kind: "component", type: CideSelectComponent, selector: "cide-ele-select", inputs: ["label", "labelHide", "placeholder", "helperText", "errorText", "required", "disabled", "id", "ngModel", "size", "fill", "labelPlacement", "labelDir", "leadingIcon", "trailingIcon", "clearInput", "options", "multiple", "searchable", "showSearchInput", "loading", "valueKey", "labelKey", "treeView"], outputs: ["ngModelChange", "change", "searchChange"] }, { kind: "component", type: CideTextareaComponent, selector: "cide-ele-textarea", inputs: ["label", "labelHide", "placeholder", "helperText", "errorText", "required", "disabled", "minlength", "maxlength", "rows", "id", "ngModel", "size", "fill", "labelPlacement", "labelDir", "leadingIcon", "trailingIcon", "clearInput"], outputs: ["ngModelChange"] }, { kind: "component", type: CideEleButtonComponent, selector: "button[cideEleButton], a[cideEleButton], cide-ele-button", inputs: ["label", "variant", "size", "type", "shape", "elevation", "disabled", "id", "loading", "fullWidth", "leftIcon", "rightIcon", "customClass", "tooltip", "ariaLabel", "testId", "routerLink", "routerExtras", "preventDoubleClick", "animated"], outputs: ["btnClick", "doubleClick"] }, { kind: "component", type: CideEleTabComponent, selector: "cide-ele-tab", inputs: ["tabs", "activeTabId", "size", "variant", "fullWidth", "disabled"], outputs: ["tabChange"] }, { kind: "component", type: CideEleFileInputComponent, selector: "cide-ele-file-input", inputs: ["label", "accept", "multiple", "disabled", "required", "helperText", "errorText", "showPreview", "previewWidth", "previewHeight", "previewBoxMode", "showFileName", "placeholderText", "placeholderIcon", "autoUpload", "uploadData", "showFloatingUploader", "floatingUploaderGroupId"], outputs: ["fileChange", "uploadSuccess", "uploadError", "uploadProgressChange"] }, { kind: "directive", type: CideEleFileImageDirective, selector: "[cideEleFileImage]", inputs: ["fileId", "altText"] }, { kind: "component", type: CideIconComponent, selector: "cide-ele-icon", inputs: ["size", "type", "toolTip"] }, { kind: "component", type: CideEleDataGridComponent, selector: "cide-ele-data-grid", inputs: ["config", "templateRenderers", "customFormatters", "actionHandlers", "serverSidePagination", "totalServerItems", "currentServerPage", "currentServerPageSize", "dragDropEnabled"], outputs: ["gridEvent"] }, { kind: "component", type: CideEleToastNotificationComponent, selector: "cide-ele-toast-notification" }, { kind: "component", type: CideFormFieldErrorComponent, selector: "cide-form-field-error", inputs: ["control", "formGroup", "fieldName", "customMessages"] }, { kind: "component", type: CideLytSharedWrapperComponent, selector: "cide-lyt-shared-wrapper", inputs: ["shared_wrapper_setup_param", "breadcrumb_data"] }, { kind: "component", type: CideEleCardComponent, selector: "cide-ele-card", inputs: ["title", "subtitle", "cardConfig"], outputs: ["stateChange", "collapsed", "minimized", "maximized", "removed", "headerClick"] }] });
|
|
16710
17169
|
}
|
|
16711
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
17170
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreUserCreateComponent, decorators: [{
|
|
16712
17171
|
type: Component,
|
|
16713
17172
|
args: [{ selector: 'cide-core-user-create', standalone: true, imports: [
|
|
16714
17173
|
CommonModule,
|
|
@@ -16727,8 +17186,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImpor
|
|
|
16727
17186
|
CideFormFieldErrorComponent,
|
|
16728
17187
|
CideLytSharedWrapperComponent,
|
|
16729
17188
|
CideEleCardComponent
|
|
16730
|
-
], template: "<!-- \n ENTERPRISE USER MASTER FORM\n \n Enterprise-Level Styling with Tailwind CSS\n Features: Responsive grids, proper typography, enhanced user experience\n-->\n\n<cide-lyt-shared-wrapper [shared_wrapper_setup_param]=\"{ sypg_page_code: pageCode() }\" [breadcrumb_data]=\"breadcrumbData()\">\n <div class=\"tw-w-full tw-h-full tw-p-1 tw-pt-2\">\n <!-- Toast Notifications -->\n <cide-ele-toast-notification></cide-ele-toast-notification>\n \n <form class=\"tw-max-w-7xl tw-mx-auto tw-bg-transparent\" [formGroup]=\"userMasterForm\" [class.tw-opacity-60]=\"loading()\"\n (ngSubmit)=\"onSubmit()\">\n\n\n <!-- User Context Header -->\n <div\n class=\"tw-bg-gradient-to-r tw-from-blue-50 tw-to-indigo-50 tw-border tw-border-blue-200 tw-rounded-md tw-p-1 tw-mb-2 tw-shadow-sm\">\n <div class=\"tw-flex tw-items-center tw-justify-between tw-flex-wrap tw-gap-2\">\n <!-- User Basic Info Display -->\n <div class=\"tw-flex tw-items-center tw-gap-3 tw-flex-wrap\">\n <!-- Profile Photo Preview -->\n <div class=\"tw-flex tw-items-center tw-gap-2\">\n <div\n class=\"tw-w-8 tw-h-8 tw-rounded-full tw-bg-blue-100 tw-border tw-border-blue-200 tw-flex tw-items-center tw-justify-center tw-overflow-hidden\">\n @if (userMasterForm.get('user_photo_id_cyfm')?.value) {\n <img cideEleFileImage [fileId]=\"userMasterForm.get('user_photo_id_cyfm')?.value\"\n [altText]=\"'Profile Photo'\" class=\"tw-w-full tw-h-full tw-object-cover\">\n } @else {\n <cide-ele-icon name=\"person\" class=\"tw-w-5 tw-h-5 tw-text-blue-600\">\n </cide-ele-icon>\n }\n </div>\n <div class=\"tw-flex tw-flex-col\">\n <span class=\"tw-text-xs tw-font-medium tw-text-blue-900\">\n {{ getUserFullName() || 'New User' }}\n </span>\n <span class=\"tw-text-xs tw-text-blue-600\">\n {{ getUserUsername() || 'Username not set' }}\n </span>\n </div>\n </div>\n\n <!-- Contact Info -->\n <div class=\"tw-flex tw-items-center tw-gap-3\">\n <div class=\"tw-flex tw-items-center tw-gap-1 tw-text-xs tw-text-gray-700\">\n <cide-ele-icon variant=\"gray\" size=\"xs\">email</cide-ele-icon>\n <span>{{ getUserEmail() || 'Email not set' }}</span>\n </div>\n <div class=\"tw-flex tw-items-center tw-gap-1 tw-text-xs tw-text-gray-700\">\n <cide-ele-icon variant=\"gray\" size=\"xs\">phone</cide-ele-icon>\n <span>{{ getUserMobile() || 'Mobile not set' }}</span>\n </div>\n </div>\n\n <!-- Active Status -->\n <div class=\"tw-flex tw-items-center tw-gap-1\">\n @if (getUserActiveStatus()) {\n <span\n class=\"tw-inline-flex tw-items-center tw-px-2 tw-py-1 tw-rounded tw-text-xs tw-font-medium tw-bg-green-100 tw-text-green-700\">\n <cide-ele-icon variant=\"green\" size=\"xs\" class=\"tw-mr-1\">check_circle</cide-ele-icon>\n Active\n </span>\n } @else {\n <span\n class=\"tw-inline-flex tw-items-center tw-px-2 tw-py-1 tw-rounded tw-text-xs tw-font-medium tw-bg-red-100 tw-text-red-700\">\n <cide-ele-icon variant=\"red\" size=\"xs\" class=\"tw-mr-1\">cancel</cide-ele-icon>\n Inactive\n </span>\n }\n </div>\n </div>\n\n <!-- Entity Info -->\n <div class=\"tw-flex tw-items-center tw-gap-2\">\n @if (hasDefaultEntity()) {\n <div class=\"tw-flex tw-items-center tw-gap-1 tw-text-xs tw-text-blue-700\">\n <cide-ele-icon variant=\"blue\" size=\"xs\">business</cide-ele-icon>\n <span class=\"tw-font-medium\">{{ getDefaultEntityName() }}</span>\n </div>\n } @else {\n <div class=\"tw-flex tw-items-center tw-gap-1 tw-text-xs tw-text-gray-500\">\n <cide-ele-icon variant=\"gray\" size=\"xs\">business</cide-ele-icon>\n <span class=\"tw-italic\">No entity</span>\n </div>\n }\n\n <span class=\"tw-text-xs tw-text-gray-600 tw-px-2 tw-py-1 tw-bg-gray-100 tw-rounded\">\n {{ getEntityMappingCount() }} mapping(s)\n </span>\n </div>\n </div>\n </div>\n\n <!-- Tab Navigation -->\n <div class=\"tw-p-0 tw-mb-2 tw-border-b tw-border-gray-200\">\n <cide-ele-tab [tabs]=\"userTabs()\" [activeTabId]=\"activeTab()\" size=\"md\" variant=\"default\"\n (tabChange)=\"onTabChange($event)\">\n </cide-ele-tab>\n </div>\n\n <!-- Tab Content -->\n <div class=\"tw-transition-opacity tw-duration-300\" [class.tw-opacity-60]=\"loading()\">\n @switch (activeTab()) {\n\n @case ('basic') {\n <!-- User Basic Information Section -->\n <div class=\"tw-py-1 tw-border-b-0 tw-mb-1\">\n\n <!-- Top Section: Form Fields on Left, Profile Photo on Right -->\n <div class=\"tw-grid tw-grid-cols-1 lg:tw-grid-cols-[1fr_200px] tw-gap-4 tw-mb-4\">\n <!-- Left Side: Form Fields -->\n <div class=\"tw-space-y-4\">\n <!-- Name Fields - All in One Row -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-4 tw-gap-4\">\n <cide-ele-input id=\"user_firstname\" label=\"First Name\" formControlName=\"user_firstname\"\n placeholder=\"Enter first name\" [maxlength]=\"20\" size=\"md\" (ngModelChange)=\"onNameFieldChange()\">\n </cide-ele-input>\n\n <cide-ele-input id=\"user_middlename\" label=\"Middle Name\" formControlName=\"user_middlename\"\n placeholder=\"Enter middle name\" [maxlength]=\"20\" size=\"md\" (ngModelChange)=\"onNameFieldChange()\">\n </cide-ele-input>\n\n <cide-ele-input id=\"user_lastname\" label=\"Last Name\" formControlName=\"user_lastname\"\n placeholder=\"Enter last name\" [maxlength]=\"20\" size=\"md\" (ngModelChange)=\"onNameFieldChange()\">\n </cide-ele-input>\n\n <cide-ele-input id=\"user_fullname\" label=\"Full Name (Auto-generated)\" formControlName=\"user_fullname\"\n placeholder=\"Auto-generated from name fields or enter manually\" [maxlength]=\"62\" size=\"md\">\n </cide-ele-input>\n </div>\n\n <!-- Contact Information - All in One Row -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-3 tw-gap-4\">\n <cide-ele-input id=\"user_username\" label=\"Username\" formControlName=\"user_username\"\n placeholder=\"Enter unique username\" [maxlength]=\"20\" size=\"md\">\n </cide-ele-input>\n\n <cide-ele-input id=\"user_emailid\" label=\"Email ID\" formControlName=\"user_emailid\" type=\"email\"\n placeholder=\"Enter valid email address\" [maxlength]=\"320\" size=\"md\">\n </cide-ele-input>\n\n <cide-ele-input id=\"user_mobileno\" label=\"Mobile Number\" formControlName=\"user_mobileno\" type=\"tel\"\n placeholder=\"Enter mobile number\" [maxlength]=\"15\" size=\"md\">\n </cide-ele-input>\n </div>\n\n <!-- User Type Mapping -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 tw-gap-4\">\n <cide-ele-select\n id=\"syutm_user_type\"\n label=\"User Type\"\n placeholder=\"Select user type\"\n [options]=\"userTypeOptions\"\n valueKey=\"value\"\n labelKey=\"label\"\n formControlName=\"syutm_user_type\"\n size=\"md\">\n </cide-ele-select>\n\n <cide-ele-input\n id=\"syutm_type_specific_id\"\n label=\"Type-Specific ID\"\n placeholder=\"Enter type-specific ID (e.g., STU001, TCH001)\"\n formControlName=\"syutm_type_specific_id\"\n [maxlength]=\"50\"\n size=\"md\">\n </cide-ele-input>\n </div>\n </div>\n\n <!-- Right Side: Profile Photo Upload -->\n <div class=\"tw-flex tw-items-start tw-justify-center tw-p-0\">\n <cide-ele-file-input id=\"user_photo_id_cyfm\" formControlName=\"user_photo_id_cyfm\" accept=\"image/*\"\n [showPreview]=\"true\" [previewBoxMode]=\"true\" [showFileName]=\"false\" previewWidth=\"180px\"\n previewHeight=\"120px\" placeholderText=\"Upload Photo\" placeholderIcon=\"cloud_upload\" [autoUpload]=\"true\"\n [uploadData]=\"getProfilePhotoUploadData()\" (uploadSuccess)=\"onProfilePhotoUploadSuccess($event)\"\n (uploadError)=\"onProfilePhotoUploadError($event)\"\n (uploadProgressChange)=\"onProfilePhotoUploadProgress($event)\">\n </cide-ele-file-input>\n </div>\n </div>\n\n\n\n <!-- Status Control -->\n <div class=\"tw-grid tw-grid-cols-1 tw-mb-2\">\n <div class=\"tw-p-2 tw-bg-blue-50 tw-border tw-border-blue-100 tw-rounded-lg\">\n <label\n class=\"tw-flex tw-flex-col tw-cursor-pointer tw-py-2 tw-bg-transparent tw-border-none tw-rounded-none tw-transition-all tw-duration-200 hover:tw-bg-blue-75\">\n <cide-ele-input type=\"checkbox\" label=\"Active User Status\" formControlName=\"user_isactive\"\n class=\"tw-h-5 tw-accent-blue-500 tw-rounded tw-mb-1\" />\n <span class=\"tw-font-semibold tw-text-gray-700 tw-text-base\"></span>\n <span class=\"tw-text-sm tw-text-gray-600 tw-mt-1 tw-leading-relaxed\">Enable this user account for system\n access and operations</span>\n </label>\n </div>\n </div>\n </div>\n }\n\n @case ('auth') {\n <!-- Authentication Section -->\n <div class=\"tw-py-1 tw-border-b-0 tw-mb-1\">\n <!-- Password Fields -->\n @if (shouldShowPasswordFields()) {\n <div class=\"tw-mb-4\">\n <!-- Password Fields Header for Edit Mode -->\n @if (isEditMode()) {\n <div class=\"tw-flex tw-items-center tw-justify-between tw-mb-3\">\n <h6 class=\"tw-text-sm tw-font-semibold tw-text-gray-800\">Update Password</h6>\n <button type=\"button\"\n class=\"tw-px-3 tw-py-1 tw-bg-gray-100 tw-text-gray-600 tw-border tw-border-gray-300 tw-rounded-md tw-text-xs tw-font-medium hover:tw-bg-gray-200 tw-transition-colors\"\n (click)=\"cancelPasswordUpdate()\">\n Cancel Password Update\n </button>\n </div>\n }\n\n <div class=\"tw-grid tw-grid-cols-1 lg:tw-grid-cols-2 md:tw-grid-cols-1 tw-gap-6\">\n <cide-ele-input id=\"user_password\" [label]=\"getPasswordFieldLabel()\" formControlName=\"user_password\"\n type=\"password\" placeholder=\"Enter secure password (min 8 characters)\" size=\"md\">\n </cide-ele-input>\n\n <cide-ele-input id=\"user_confirm_password\" [label]=\"getPasswordConfirmLabel()\"\n formControlName=\"user_confirm_password\" type=\"password\" placeholder=\"Confirm your password\" size=\"md\">\n </cide-ele-input>\n </div>\n </div>\n }\n\n <!-- Password Update Option for Edit Mode -->\n @if (isEditMode() && !shouldShowPasswordFields()) {\n <div class=\"tw-mb-4\">\n <div class=\"tw-p-2 tw-bg-blue-50 tw-border tw-border-blue-200 tw-rounded-lg\">\n <h6 class=\"tw-text-sm tw-font-semibold tw-text-blue-800 tw-mb-2\">Password Update</h6>\n <p class=\"tw-text-sm tw-text-blue-600 tw-mb-3\">Current password will be kept. Click below to change\n password.</p>\n\n @if (hasPasswordInput()) {\n <div\n class=\"tw-mb-3 tw-p-2 tw-bg-yellow-50 tw-border tw-border-yellow-200 tw-rounded tw-text-sm tw-text-yellow-700\">\n <cide-ele-icon variant=\"yellow\" size=\"xs\" class=\"tw-mr-1\">warning</cide-ele-icon>\n Password fields contain text. Click \"Change Password\" to manage existing input.\n </div>\n }\n\n <button type=\"button\"\n class=\"tw-px-4 tw-py-2 tw-bg-blue-100 tw-text-blue-700 tw-border tw-border-blue-300 tw-rounded-md tw-text-sm tw-font-medium hover:tw-bg-blue-200 tw-transition-colors\"\n (click)=\"triggerPasswordUpdate()\">\n @if (hasPasswordInput()) {\n Manage Password Fields\n } @else {\n Change Password\n }\n </button>\n </div>\n </div>\n }\n\n <!-- Password Options -->\n <div class=\"tw-grid tw-grid-cols-1 tw-gap-4 tw-mb-4\">\n <div class=\"tw-p-2 tw-bg-yellow-50 tw-border tw-border-yellow-100 tw-rounded-lg\">\n <label\n class=\"tw-flex tw-flex-col tw-gap-2 tw-cursor-pointer tw-py-2 tw-bg-transparent tw-border-none tw-rounded-none tw-transition-all tw-duration-200\">\n <cide-ele-input type=\"checkbox\" label=\"Force Password Change on Login\"\n formControlName=\"user_passwordchangeonlogin\" class=\"tw-h-5 tw-accent-yellow-500 tw-rounded tw-mb-1\" />\n <span class=\"tw-text-sm tw-text-gray-600 tw-mt-1 tw-leading-relaxed\">User will be required to change\n password on next login</span>\n </label>\n </div>\n </div>\n\n </div>\n }\n\n @case ('roles') {\n <!-- Entity, Roles & Permissions Mapping Section -->\n <div class=\"tw-py-1 tw-border-b-0 tw-mb-1\">\n\n\n\n <!-- Important Note -->\n <div class=\"tw-bg-amber-50 tw-border tw-border-amber-200 tw-rounded-lg tw-p-2 tw-mb-4\">\n <div class=\"tw-flex tw-items-start tw-gap-3\">\n <cide-ele-icon variant=\"amber\" size=\"lg\">info</cide-ele-icon>\n <div class=\"tw-flex-1\">\n <h4 class=\"tw-text-sm tw-font-semibold tw-text-amber-800 tw-mb-1\">Entity-Role Based Access</h4>\n <p class=\"tw-text-sm tw-text-amber-700 tw-mb-2\">User access is completely managed through entity-role\n mappings below. At least one entity mapping is required for user access.</p>\n @if (hasDefaultEntity()) {\n <div class=\"tw-flex tw-items-center tw-gap-2 tw-mt-2 tw-p-2 tw-bg-amber-100 tw-rounded\">\n <cide-ele-icon variant=\"amber\" size=\"sm\">star</cide-ele-icon>\n <span class=\"tw-text-sm tw-text-amber-800\">\n <strong>Default Entity:</strong> {{ getDefaultEntityName() }}\n </span>\n </div>\n } @else {\n <div class=\"tw-text-sm tw-text-amber-600 tw-mt-2 tw-italic\">\n \u26A0\uFE0F No default entity selected. Please set one entity as default.\n </div>\n }\n </div>\n </div>\n </div>\n\n <!-- Entity-Role Mapping Section -->\n <div class=\"tw-flex tw-text-center tw-justify-between tw-items-center tw-mb-4\">\n <div>\n <h4 class=\"tw-text-sm tw-text-left tw-font-semibold tw-text-blue-900 tw-mb-1\">Entity-Role Mapping</h4>\n <p class=\"tw-text-sm tw-text-blue-700\">Map user to entities with specific roles and permissions</p>\n </div>\n <div class=\"tw-flex tw-flex-col tw-items-end\">\n <button cideEleButton variant=\"primary\" size=\"md\" type=\"button\" (click)=\"addEntityMapping()\"\n leftIcon=\"add\" [disabled]=\"isAllEntitiesMapped()\">\n Add Entity Mapping\n </button>\n\n @if (isAllEntitiesMapped()) {\n <div class=\"tw-mt-2 tw-p-2 tw-bg-blue-50 tw-border tw-border-blue-200 tw-rounded-md tw-max-w-xs\">\n <p class=\"tw-text-xs tw-text-blue-700\">\n <cide-ele-icon variant=\"info\" size=\"xs\" class=\"tw-mr-1\">info</cide-ele-icon>\n All available entities are already mapped.\n </p>\n </div>\n }\n </div>\n </div>\n\n <div formArrayName=\"core_entity_mapping\">\n @for (mapping of entityMappings(); track mapping.syenm_entity_id_syen?._id || mapping.syenm_entity_id_syen || $index; let i = $index) {\n <cide-ele-card\n [title]=\"getEntityNameFromMapping(i) || 'Entity Mapping ' + (i + 1)\"\n [subtitle]=\"mapping.syenm_isdefault ? 'Primary Entity' : ''\"\n [cardConfig]=\"{\n collapsible: true,\n minimizable: false,\n maximizable: false,\n removable: !mapping?._id,\n defaultState: 'collapsed',\n showHeader: true,\n showFooter: false,\n variant: 'default',\n size: 'sm',\n shadow: true,\n rounded: true,\n bordered: true\n }\"\n (stateChange)=\"onEntityMappingCardStateChange($event, i)\"\n (removed)=\"removeEntityMapping(i)\"\n class=\"tw-mb-2 entity-mapping-card tw-block\">\n \n <div [formGroupName]=\"i\">\n \n <!-- Card Actions (User Type Mappings only) -->\n <div card-actions class=\"tw-flex tw-items-center tw-gap-1.5 tw-flex-wrap tw-max-w-full\">\n @if (getEntityIdFromMapping(i)) {\n @if (getUserTypeMappingsForEntity(getEntityIdFromMapping(i)).length > 0) {\n @for (typeMapping of getUserTypeMappingsForEntity(getEntityIdFromMapping(i)); track typeMapping._id || typeMapping.syutm_type_specific_id) {\n <span class=\"tw-inline-flex tw-items-center tw-px-2 tw-py-1 tw-rounded tw-text-[10px] tw-font-medium tw-bg-purple-50 dark:tw-bg-purple-900/20 tw-text-purple-700 dark:tw-text-purple-300 tw-border tw-border-purple-200 dark:tw-border-purple-800\">\n <cide-ele-icon variant=\"purple\" size=\"xs\" class=\"tw-mr-1\">person</cide-ele-icon>\n {{ typeMapping.syutm_user_type }}\n @if (typeMapping.syutm_isactive) {\n <span class=\"tw-ml-1 tw-w-1.5 tw-h-1.5 tw-rounded-full tw-bg-green-500\"></span>\n }\n </span>\n }\n }\n }\n </div>\n\n <!-- Card Content -->\n <div class=\"tw-space-y-3\">\n <!-- Hidden form control to maintain form structure for entity -->\n <input type=\"hidden\" [formControlName]=\"'syenm_entity_id_syen'\" />\n \n <!-- Role, Default, and Active in One Row -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-3 tw-gap-3\">\n <!-- Role Selection -->\n <cide-ele-select label=\"Role for this Entity\" [options]=\"getRoleOptionsForEntity(i)\"\n formControlName=\"syenm_role_id_syusrol\" valueKey=\"_id\" labelKey=\"syusrol_role_name\"\n placeholder=\"Select role for this entity\" size=\"md\" (change)=\"onRoleChange(i, $event)\">\n </cide-ele-select>\n \n <!-- Primary Entity Checkbox -->\n <div class=\"tw-flex tw-flex-col\">\n <label class=\"tw-block tw-text-sm tw-font-medium tw-text-gray-700 dark:tw-text-gray-300 tw-mb-1.5\">Default</label>\n <div class=\"tw-flex tw-items-center tw-gap-2 tw-px-3 tw-py-2 tw-rounded-md tw-border tw-border-green-200 tw-bg-green-50 dark:tw-bg-green-900/20 dark:tw-border-green-800\" (click)=\"$event.stopPropagation()\">\n <input \n type=\"checkbox\" \n [checked]=\"mapping.syenm_isdefault\"\n (change)=\"onDefaultEntityChange(i, $event)\" \n class=\"tw-h-4 tw-w-4 tw-accent-green-600 tw-cursor-pointer\" />\n <label class=\"tw-inline-flex tw-items-center tw-gap-1 tw-text-xs tw-font-semibold tw-text-green-700 dark:tw-text-green-300 tw-cursor-pointer\">\n <cide-ele-icon variant=\"green\" size=\"xs\">star</cide-ele-icon>\n DEFAULT\n </label>\n </div>\n </div>\n \n <!-- Active Mapping Checkbox -->\n <div class=\"tw-flex tw-flex-col\">\n <label class=\"tw-block tw-text-sm tw-font-medium tw-text-gray-700 dark:tw-text-gray-300 tw-mb-1.5\">Status</label>\n <div class=\"tw-flex tw-items-center tw-gap-2 tw-px-3 tw-py-2 tw-rounded-md tw-border tw-border-blue-200 tw-bg-blue-50 dark:tw-bg-blue-900/20 dark:tw-border-blue-800\" (click)=\"$event.stopPropagation()\">\n <input \n type=\"checkbox\" \n [checked]=\"mapping.syenm_isactive\"\n (change)=\"onActiveMappingChange(i, $event)\" \n class=\"tw-h-4 tw-w-4 tw-accent-blue-600 tw-cursor-pointer\" />\n <label class=\"tw-inline-flex tw-items-center tw-gap-1 tw-text-xs tw-font-semibold tw-text-blue-700 dark:tw-text-blue-300 tw-cursor-pointer\">\n <cide-ele-icon variant=\"blue\" size=\"xs\">check_circle</cide-ele-icon>\n Active\n </label>\n </div>\n </div>\n </div>\n\n\n <!-- Entity-Specific Details and Active Period - All in One Row -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-4 tw-gap-3\">\n <cide-ele-select label=\"Department for this Entity\" [options]=\"getDepartmentOptionsForEntity(i)\"\n formControlName=\"syenm_department_id_sydept\" (change)=\"onDepartmentChange($event)\" valueKey=\"_id\"\n labelKey=\"sydept_name\" placeholder=\"Select department\" size=\"md\">\n </cide-ele-select>\n\n <cide-ele-select label=\"Designation for this Entity\" [options]=\"getDesignationOptionsForEntity(i)\"\n valueKey=\"_id\" labelKey=\"sydsg_name\" formControlName=\"syenm_designation_id_sydsg\"\n placeholder=\"Select designation\" size=\"md\">\n </cide-ele-select>\n\n <cide-ele-input label=\"Active From\" [id]=\"'syenm_activefrom['+i+']'\"\n formControlName=\"syenm_activefrom\" type=\"date\" size=\"md\">\n </cide-ele-input>\n\n <cide-ele-input label=\"Active Until\" [id]=\"'syenm_activeupto['+i+']'\"\n formControlName=\"syenm_activeupto\" type=\"date\" size=\"md\">\n </cide-ele-input>\n </div>\n\n <!-- Menu Rights Grid for this Entity-Role -->\n <div class=\"tw-border-t tw-border-gray-200\">\n\n @if (getMenuRightsForMapping(i).length > 0) {\n <!-- Menu Rights Tree Grid -->\n\n <cide-ele-data-grid [config]=\"getMenuRightsGridConfig(i)\"\n [templateRenderers]=\"getMenuRightsTemplateRenderers(i)\"\n (gridEvent)=\"onMenuRightsGridEvent($event, i)\" class=\"tw-h-96 tw-w-full\">\n </cide-ele-data-grid>\n\n } @else {\n <div class=\"tw-text-center tw-py-8 tw-bg-gray-50 tw-border tw-border-gray-200 tw-rounded-lg\">\n <div class=\"tw-text-gray-400 tw-mb-3\">\n <cide-ele-icon variant=\"gray\" size=\"lg\">menu</cide-ele-icon>\n </div>\n <h6 class=\"tw-text-sm tw-font-medium tw-text-gray-600 tw-mb-2\">No Menu Rights Available</h6>\n <p class=\"tw-text-xs tw-text-gray-500 tw-mb-3 tw-text-center\">Select both entity and role to\n automatically load\n menu rights for this mapping.</p>\n </div>\n }\n </div>\n </div>\n </div>\n </cide-ele-card>\n }\n </div>\n\n @if (entityMappings().length === 0) {\n <div class=\"tw-text-center tw-py-8 tw-bg-white tw-border tw-border-blue-200 tw-rounded-lg\">\n <div class=\"tw-text-blue-400 tw-mb-3\">\n <cide-ele-icon variant=\"blue\" size=\"lg\">business</cide-ele-icon>\n </div>\n <h4 class=\"tw-text-sm tw-font-medium tw-text-blue-800 tw-mb-2\">No Entity Mappings</h4>\n <p class=\"tw-text-blue-600 tw-mb-4 tw-text-center\">Add entity mappings to assign specific roles and\n permissions for different entities.</p>\n <button class=\"tw-mx-auto\" cideEleButton variant=\"primary\" size=\"md\" type=\"button\"\n (click)=\"addEntityMapping()\" leftIcon=\"add\">\n Add First Entity Mapping\n </button>\n </div>\n }\n </div>\n }\n\n @case ('addresses') {\n <!-- Contact Addresses Section -->\n <div class=\"tw-py-1 tw-border-b-0 tw-mb-1\">\n <div class=\"tw-flex tw-justify-end\">\n <div class=\"tw-flex tw-justify-between tw-items-end tw-mb-2 tw-gap-4\">\n <button cideEleButton variant=\"primary\" size=\"md\" type=\"button\" (click)=\"addContactAddress()\"\n leftIcon=\"add\" [disabled]=\"!hasAddContactAddressRights()\">\n Add New Address\n </button>\n </div>\n </div>\n\n <div formArrayName=\"core_user_contact_addresses\">\n @for (address of contactAddresses(); track $index; let i = $index) {\n <div [formGroupName]=\"i\"\n class=\"tw-bg-white tw-border tw-border-gray-200 tw-rounded-xl tw-mb-8 tw-overflow-hidden tw-transition-all tw-duration-300 hover:tw-shadow-lg tw-shadow-sm\">\n <div\n class=\"tw-bg-gradient-to-r tw-from-gray-50 tw-to-gray-100 tw-px-4 tw-py-2 tw-flex tw-justify-between tw-items-center tw-border-b tw-border-gray-200\">\n <!-- Use address type as header instead of generic \"Address X\" -->\n <h4 class=\"tw-m-0 tw-text-gray-700 tw-text-sm tw-font-semibold tw-tracking-tight\">\n {{ getAddressTypeLabel(i) || ('Address ' + (i + 1)) }}\n </h4>\n <div class=\"tw-flex tw-items-center tw-gap-2\">\n @if (isAddressOwner(i)) {\n <button cideEleButton variant=\"secondary\" size=\"xs\" type=\"button\" (click)=\"shareAddress(i)\"\n leftIcon=\"share\" class=\"tw-text-blue-600 hover:tw-text-blue-700\">\n Share\n </button>\n }\n @if (!address?._id) {\n <button cideEleButton variant=\"danger\" size=\"sm\" type=\"button\" (click)=\"removeContactAddress(i)\"\n leftIcon=\"delete\">\n Remove\n </button>\n }\n </div>\n </div>\n <div class=\"tw-p-4\">\n <!-- Main Layout: Inputs on Left, Address Textarea on Right -->\n <div class=\"tw-grid tw-grid-cols-1 lg:tw-grid-cols-4 tw-gap-3 tw-mb-3\">\n \n <!-- Left Side: Input Fields (3/4 width) -->\n <div class=\"lg:tw-col-span-3\">\n <!-- Row 1: Address Type, Contact Person -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 tw-gap-3 tw-mb-3\">\n <cide-ele-select label=\"Address Type\" [options]=\"addressTypeOptions()\" id=\"sycad_address_type_id_sygms\"\n formControlName=\"sycad_address_type_id_sygms\" placeholder=\"Select type\" size=\"sm\"\n valueKey=\"_id\" labelKey=\"sygms_title\" (change)=\"onAddressTypeChange(i)\">\n </cide-ele-select>\n\n <cide-ele-input label=\"Contact Person\" formControlName=\"sycad_contact_person_name\"\n placeholder=\"Enter contact person\" size=\"sm\">\n </cide-ele-input>\n </div>\n\n <!-- Row 2: Postal Code, City, State, Country -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-4 tw-gap-3\">\n <cide-ele-select label=\"Postal Code\" [options]=\"addressPostalCodes()[i] || []\"\n formControlName=\"sycad_contact_pin_sypin\" placeholder=\"Select postal code\" [searchable]=\"true\"\n [loading]=\"addressPostalCodesLoading()[i] || false\" (searchChange)=\"onPostalCodeSearch($event, i)\"\n (change)=\"onPostalCodeSelection($event, i)\" size=\"sm\">\n </cide-ele-select>\n\n <cide-ele-input label=\"City\" formControlName=\"sycad_contact_city_sypin\" placeholder=\"Enter city\"\n size=\"sm\">\n </cide-ele-input>\n\n <cide-ele-input label=\"State\" formControlName=\"sycad_contact_state_sypin\" placeholder=\"Enter state\"\n size=\"sm\">\n </cide-ele-input>\n\n <cide-ele-select label=\"Country\" [options]=\"addressCountries()[i] || []\"\n formControlName=\"sycad_contact_country_syctr\" placeholder=\"Select country\" valueKey=\"_id\"\n labelKey=\"syctr_country_iso_name\" [searchable]=\"true\" (searchChange)=\"onCountrySearch($event, i)\"\n [loading]=\"addressCountriesLoading()[i] || false\" size=\"sm\">\n </cide-ele-select>\n </div>\n </div>\n\n <!-- Right Side: Address Textarea (1/4 width, spans 2 rows) -->\n <div class=\"lg:tw-col-span-1 lg:tw-row-span-2 tw-flex tw-flex-col\">\n <cide-ele-textarea label=\"Complete Address\" formControlName=\"sycad_contact_address\"\n placeholder=\"Enter complete address with area, city, and landmarks\" [rows]=\"4\" size=\"sm\"\n class=\"tw-h-full\">\n </cide-ele-textarea>\n </div>\n </div>\n\n <!-- Contact Details: Primary Phone, Alt Phone, Fax, Primary Email in 4 columns -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-4 tw-gap-3 tw-mb-3\">\n <cide-ele-input label=\"Primary Phone\" formControlName=\"sycad_contact_phone\" type=\"tel\"\n placeholder=\"Primary phone\" size=\"sm\">\n </cide-ele-input>\n\n <cide-ele-input label=\"Alternate Phone\" formControlName=\"sycad_contact_phone_alt\" type=\"tel\"\n placeholder=\"Alternate phone\" size=\"sm\">\n </cide-ele-input>\n\n <cide-ele-input label=\"Fax Number\" formControlName=\"sycad_contact_fax\" placeholder=\"Fax number\"\n size=\"sm\">\n </cide-ele-input>\n\n <cide-ele-input label=\"Primary Email\" formControlName=\"sycad_contact_email\" type=\"email\"\n placeholder=\"Primary email\" size=\"sm\">\n </cide-ele-input>\n </div>\n\n <!-- Alternate Email in single row -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 tw-gap-3\">\n <cide-ele-input label=\"Alternate Email\" formControlName=\"sycad_contact_email_alt\" type=\"email\"\n placeholder=\"Alternate email address\" size=\"sm\">\n </cide-ele-input>\n </div>\n </div>\n </div>\n }\n </div>\n </div>\n }\n\n @case ('documents') {\n <!-- Documents Section -->\n <div class=\"tw-py-1 tw-border-b-0 tw-mb-1\">\n <div class=\"tw-flex tw-justify-end tw-items-end tw-mb-2 tw-gap-4\">\n <button cideEleButton variant=\"primary\" size=\"md\" type=\"button\" (click)=\"addDocument()\" leftIcon=\"add\" [disabled]=\"!hasAddDocumentRights()\">\n Add Document\n </button>\n </div>\n <div formArrayName=\"core_user_documents\">\n @for (doc of documents(); track $index; let i = $index) {\n <div [formGroupName]=\"i\"\n class=\"tw-bg-white tw-border tw-border-gray-200 tw-rounded-xl tw-mb-8 tw-overflow-hidden tw-transition-all tw-duration-300 hover:tw-shadow-lg tw-shadow-sm\">\n <div\n class=\"tw-bg-gradient-to-r tw-from-gray-50 tw-to-gray-100 tw-px-4 tw-py-2 tw-flex tw-justify-between tw-items-center tw-border-b tw-border-gray-200\">\n <h4 class=\"tw-m-0 tw-text-gray-700 tw-text-sm tw-font-semibold tw-tracking-tight\">\n {{ getDocumentTypeLabel(i) || ('Document ' + (i + 1)) }}\n </h4>\n <div class=\"tw-flex tw-gap-2\">\n @if (doc?._id) {\n <button cideEleButton variant=\"secondary\" size=\"sm\" type=\"button\" (click)=\"shareDocumentRights(i)\"\n leftIcon=\"share\">\n Share\n </button>\n }\n </div>\n </div>\n <div class=\"tw-p-4\">\n <!-- Main Layout: Inputs on Left, File Upload on Right -->\n <div class=\"tw-grid tw-grid-cols-1 lg:tw-grid-cols-3 tw-gap-4\">\n \n <!-- Left Side: Document Information (2/3 width) -->\n <div class=\"lg:tw-col-span-2\">\n <!-- Row 1: Document Type, Document Number, Name as per Document -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-3 tw-gap-3 tw-mb-3\">\n <cide-ele-select label=\"Document Type\" [options]=\"documentTypeOptions()\"\n formControlName=\"syusd_document_type_id_sygms\" placeholder=\"Select type\" size=\"sm\"\n valueKey=\"_id\" labelKey=\"sygms_title\" (change)=\"onDocumentTypeChange(i)\">\n </cide-ele-select>\n\n <cide-ele-input label=\"Document Number\" formControlName=\"syusd_doc_number\"\n placeholder=\"Document number\" size=\"sm\">\n </cide-ele-input>\n\n <cide-ele-input label=\"Name as per Document\" formControlName=\"syusd_doc_name_as_per_doc\"\n placeholder=\"Name on document\" size=\"sm\">\n </cide-ele-input>\n </div>\n\n <!-- Row 2: Issue Date, Expiry Date, Photo Group -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-3 tw-gap-3 tw-mb-3\">\n <cide-ele-input label=\"Issue Date\" formControlName=\"syusd_doc_issue_date\"\n [id]=\"'syusd_doc_issue_date['+i+']'\" type=\"date\" size=\"sm\">\n </cide-ele-input>\n\n <cide-ele-input label=\"Expiry Date\" formControlName=\"syusd_doc_expiry_date\"\n [id]=\"'syusd_doc_expiry_date['+i+']'\" type=\"date\" size=\"sm\">\n </cide-ele-input>\n </div>\n\n <!-- Row 3: Verification Status, KYC Status -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 tw-gap-3\">\n <cide-ele-select label=\"Verification Status\" [options]=\"documentVerificationStatusOptions()\"\n formControlName=\"syusd_doc_verification_status_id_sygms\" placeholder=\"Select status\"\n size=\"sm\" valueKey=\"_id\" labelKey=\"sygms_title\">\n </cide-ele-select>\n\n <cide-ele-select label=\"KYC Status\" [options]=\"documentKycStatusOptions()\"\n formControlName=\"syusd_doc_kyc_status_id_sygms\" placeholder=\"Select KYC status\" size=\"sm\"\n valueKey=\"_id\" labelKey=\"sygms_title\">\n </cide-ele-select>\n </div>\n </div>\n\n <!-- Right Side: File Upload (1/3 width) -->\n <div class=\"lg:tw-col-span-1\">\n <div class=\"tw-bg-gray-50 tw-border tw-border-gray-200 tw-rounded-lg tw-p-3 tw-h-full\">\n \n <!-- File Upload Input -->\n <cide-ele-file-input\n [id]=\"'document-files-' + i\"\n [multiple]=\"true\"\n formControlName=\"syusd_photo_group_id_cyfm\"\n [accept]=\"'.pdf,.jpg,.jpeg,.png,.doc,.docx'\"\n [autoUpload]=\"true\"\n [uploadData]=\"getDocumentUploadData(i)\"\n (change)=\"onDocumentFilesSelected($event, i)\"\n (uploadSuccess)=\"onDocumentUploadSuccess($event, i)\"\n (uploadError)=\"onDocumentUploadError($event, i)\"\n (uploadProgressChange)=\"onDocumentUploadProgress($event, i)\"\n class=\"tw-mb-3\"\n size=\"sm\">\n </cide-ele-file-input>\n\n <!-- Upload Status -->\n <!-- Upload status is now handled by the file input component itself -->\n </div>\n </div>\n </div>\n </div>\n </div>\n }\n </div>\n </div>\n }\n\n @case ('family') {\n <!-- Family Details Section - Compact Design -->\n <div class=\"tw-py-1 tw-border-b-0 tw-mb-1\">\n <div class=\"tw-flex tw-justify-end tw-items-end tw-mb-3 tw-gap-4\">\n <button cideEleButton variant=\"primary\" size=\"sm\" type=\"button\" (click)=\"addFamilyDetail()\" leftIcon=\"add\" [disabled]=\"!hasAddFamilyDetailRights()\">\n Add Family Member\n </button>\n </div>\n\n <div formArrayName=\"core_user_family_details\">\n @for (family of familyDetails(); track $index; let i = $index) {\n <div [formGroupName]=\"i\"\n class=\"tw-bg-white tw-border tw-border-gray-200 tw-rounded-lg tw-mb-4 tw-overflow-hidden tw-transition-all tw-duration-200 hover:tw-shadow-md tw-shadow-sm\">\n \n <!-- Compact Header -->\n <div class=\"tw-bg-gray-50 tw-px-4 tw-py-2 tw-flex tw-justify-between tw-items-center tw-border-b tw-border-gray-200\">\n <h4 class=\"tw-m-0 tw-text-gray-700 tw-text-sm tw-font-medium\">Family Member {{ i + 1 }}</h4>\n <div class=\"tw-flex tw-gap-2\">\n @if (family?._id) {\n <button cideEleButton variant=\"secondary\" size=\"xs\" type=\"button\" (click)=\"shareFamilyDetailRights(i)\"\n leftIcon=\"share\">\n Share\n </button>\n }\n @if (!family?._id) {\n <button cideEleButton variant=\"danger\" size=\"xs\" type=\"button\" (click)=\"removeFamilyDetail(i)\" leftIcon=\"delete\">\n Remove\n </button>\n }\n </div>\n </div>\n \n <!-- Compact Form Content - 3 inputs per row -->\n <div class=\"tw-p-4\">\n <!-- Row 1: Name, User, and Combined Relationship/Active Status (33.33% each) -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-3 tw-gap-3 tw-mb-3\">\n <cide-ele-input label=\"Family Member Name\" formControlName=\"syfdl_family_member_name\"\n placeholder=\"Enter family member full name\" size=\"sm\">\n </cide-ele-input>\n\n <cide-ele-select label=\"Family Member User\" [options]=\"userOptions(i)\"\n formControlName=\"syfdl_family_member_id_user\" placeholder=\"Select family member user\" size=\"sm\"\n valueKey=\"_id\" labelKey=\"user_fullname\" [searchable]=\"true\"\n [loading]=\"userSearchLoading()[i] || false\" (searchChange)=\"onUserSearchChange($event, i)\"\n (change)=\"onUserSelectionChange($event, i)\">\n </cide-ele-select>\n\n <!-- Combined Relationship and Active Status (33.33%) -->\n <div class=\"tw-flex tw-flex-row tw-gap-2 tw-items-end\">\n <div class=\"tw-flex-1\">\n <cide-ele-select label=\"Relationship\" [options]=\"relationshipOptions()\"\n formControlName=\"syfdl_relationship_id_sygms\" placeholder=\"Select relationship\" size=\"sm\"\n valueKey=\"_id\" labelKey=\"sygms_title\">\n </cide-ele-select>\n </div>\n\n <div class=\"tw-flex tw-items-center tw-pt-1 tw-flex-shrink-0\">\n <cide-ele-input formControlName=\"syfdl_isactive\" type=\"checkbox\" label=\"Active\" size=\"sm\">\n </cide-ele-input>\n </div>\n </div>\n </div>\n\n <!-- Row 2: Blood Group, DOB, and Phone -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 xl:tw-grid-cols-3 tw-gap-3 tw-mb-3\">\n <cide-ele-select label=\"Blood Group\" [options]=\"bloodGroupOptions()\"\n formControlName=\"syfdl_blood_group_sygms\" placeholder=\"Select blood group\" size=\"sm\" valueKey=\"_id\"\n labelKey=\"sygms_title\">\n </cide-ele-select>\n\n <cide-ele-input label=\"Date of Birth\" formControlName=\"syfdl_family_member_dob\" type=\"date\" size=\"sm\"\n [id]=\"'syfdl_family_member_dob['+i+']'\">\n </cide-ele-input>\n\n <cide-ele-input label=\"Contact Phone\" formControlName=\"syfdl_contact_phone\" type=\"tel\"\n placeholder=\"Enter contact phone\" size=\"sm\">\n </cide-ele-input>\n </div>\n\n <!-- Row 3: Email, Email ID, and Contact Number -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 xl:tw-grid-cols-3 tw-gap-3 tw-mb-3\">\n <cide-ele-input label=\"Contact Email\" formControlName=\"syfdl_contact_email\" type=\"email\"\n placeholder=\"Enter contact email\" size=\"sm\">\n </cide-ele-input>\n\n <cide-ele-input label=\"Contact Email ID\" formControlName=\"syfdl_contact_email_id\" type=\"email\"\n placeholder=\"Enter contact email ID\" size=\"sm\">\n </cide-ele-input>\n\n <cide-ele-input label=\"Contact Number\" formControlName=\"syfdl_contact_number\" type=\"tel\"\n placeholder=\"Enter contact number\" size=\"sm\">\n </cide-ele-input>\n </div>\n\n </div>\n </div>\n }\n </div>\n </div>\n }\n }\n </div>\n\n <!-- Form Actions -->\n <div\n class=\"tw-flex tw-justify-between tw-items-center tw-gap-4 tw-py-2 tw-bg-white tw-border-t tw-border-gray-200 tw-sticky tw-bottom-0 tw-z-10\">\n <!-- Error Display Component -->\n <div class=\"tw-flex-1\">\n <cide-form-field-error [formGroup]=\"userMasterForm\"></cide-form-field-error>\n </div>\n\n <!-- Action Buttons -->\n <div class=\"tw-flex tw-gap-4\">\n <button cideEleButton type=\"button\" variant=\"secondary\" (click)=\"resetForm()\" leftIcon=\"refresh\"\n [disabled]=\"loading()\">\n Reset Form\n </button>\n\n <button cideEleButton type=\"submit\" variant=\"primary\" [disabled]=\"loading() || userMasterForm.invalid\"\n [loading]=\"loading()\" leftIcon=\"save\">\n Save User Master\n </button>\n </div>\n </div>\n </form>\n</div>\n</cide-lyt-shared-wrapper>\n\n<!-- Template Renderers for Role Permissions Grid -->\n<ng-template #menuDetailsRendererTemplate let-row=\"row\">\n <div class=\"tw-flex tw-items-center tw-space-x-3 tw-min-w-0\">\n <!-- Menu Icon -->\n <div class=\"tw-flex-shrink-0\">\n @if (row.syme_type === 'module') {\n <cide-ele-icon class=\"tw-text-blue-600 tw-w-4 tw-h-4\">folder</cide-ele-icon>\n } @else if (row.syme_type === 'section') {\n <cide-ele-icon class=\"tw-text-green-600 tw-w-4 tw-h-4\">folder_open</cide-ele-icon>\n } @else if (row.syme_type === 'menu') {\n <cide-ele-icon class=\"tw-text-purple-600 tw-w-4 tw-h-4\">menu</cide-ele-icon>\n } @else {\n <cide-ele-icon class=\"tw-text-gray-600 tw-w-4 tw-h-4\">description</cide-ele-icon>\n }\n </div>\n\n <!-- Menu Details -->\n <div class=\"tw-ml-3 tw-min-w-0 tw-flex-1\">\n <div class=\"tw-flex tw-items-center tw-gap-2\">\n <div class=\"tw-text-xs tw-font-medium tw-text-gray-900 tw-truncate\" [title]=\"row.syme_title\">\n {{ row.syme_title || row.menu?.syme_title || row.menu?.syme_menu_name || 'Untitled' }}\n </div>\n <!-- Green pill indicator for parent menus with child permissions -->\n @if (row.syme_type === 'module' || row.syme_type === 'section') {\n @if (hasChildMenusWithPermissions(row._id)) {\n <span\n class=\"tw-inline-flex tw-items-center tw-px-2 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium tw-bg-green-100 tw-text-green-800 tw-whitespace-nowrap\">\n Assigned\n </span>\n }\n }\n </div>\n @if (row.permission?.sygms_name) {\n <div class=\"tw-text-xs tw-text-blue-500 tw-truncate\" [title]=\"row.permission?.sygms_name\">\n {{ row.permission?.sygms_name }}\n </div>\n }\n </div>\n </div>\n</ng-template>\n\n<!-- Menu Type Renderer Template -->\n<ng-template #menuTypeRendererTemplate let-row=\"row\" let-value=\"value\">\n <div class=\"tw-flex tw-items-center tw-justify-center\">\n @if (row.syme_type === 'module') {\n <span\n class=\"tw-inline-flex tw-items-center tw-px-2 tw-py-1 tw-rounded-full tw-text-xs tw-font-medium tw-bg-blue-100 tw-text-blue-800\">\n Module\n </span>\n } @else if (row.syme_type === 'section') {\n <span\n class=\"tw-inline-flex tw-items-center tw-px-2 tw-py-1 tw-rounded-full tw-text-xs tw-font-medium tw-bg-green-100 tw-text-green-800\">\n Section\n </span>\n } @else if (row.syme_type === 'menu') {\n <span\n class=\"tw-inline-flex tw-items-center tw-px-2 tw-py-1 tw-rounded-full tw-text-xs tw-font-medium tw-bg-purple-100 tw-text-purple-800\">\n Menu\n </span>\n } @else {\n <span\n class=\"tw-inline-flex tw-items-center tw-px-2 tw-py-1 tw-rounded-full tw-text-xs tw-font-medium tw-bg-gray-100 tw-text-gray-800\">\n {{ row.syme_type || 'Unknown' }}\n </span>\n }\n </div>\n</ng-template>\n\n<!-- Permissions Checkbox Renderer Template -->\n<ng-template #permissionsCheckboxRendererTemplate let-row=\"row\" let-value=\"value\">\n <div class=\"tw-flex tw-flex-wrap tw-gap-2 tw-max-w-full\">\n @if (row.syme_type === 'menu' && row?.syme_permissions_id_sygms && row?.syme_permissions_id_sygms.length > 0) {\n @for (permissionId of row?.syme_permissions_id_sygms || []; track permissionId) {\n <div class=\"tw-flex tw-items-center tw-space-x-1\">\n <div class=\"tw-flex tw-items-center tw-space-x-1\">\n <input type=\"checkbox\" [checked]=\"isPermissionSelected(row._id, permissionId)\" [disabled]=\"true\"\n class=\"tw-h-4 tw-w-4 tw-text-blue-600 tw-bg-gray-100 tw-border-gray-300 tw-rounded focus:tw-ring-blue-500\">\n <label class=\"tw-text-xs tw-text-gray-700\">\n {{ getPermissionById(permissionId)?.sygms_title || 'Unknown' }}\n </label>\n </div>\n </div>\n }\n } @else {\n <!-- Show green checkmark for parent menus with child permissions -->\n @if (row.syme_type === 'module' || row.syme_type === 'section' || row.syme_type === 'title') {\n @if (hasChildMenusWithPermissions(row._id)) {\n <div class=\"tw-flex tw-items-center tw-justify-center tw-w-6 tw-h-6 tw-bg-green-100 tw-rounded-full\">\n <cide-ele-icon class=\"tw-text-green-600\" size=\"xs\">\n check\n </cide-ele-icon>\n </div>\n } @else {\n <span class=\"tw-text-xs tw-text-gray-400\">N/A</span>\n }\n } @else {\n <span class=\"tw-text-xs tw-text-gray-400\">N/A</span>\n }\n }\n </div>\n</ng-template>\n\n<!-- Menu Rights Permissions Renderer Template -->\n<ng-template #menuRightsPermissionsRendererTemplate let-row=\"row\" let-value=\"value\">\n <div class=\"tw-flex tw-flex-wrap tw-gap-2 tw-max-w-full\">\n <!-- Role Rights Display -->\n @if (row.role_rights && row.role_rights.length > 0) {\n <div class=\"tw-mb-2\">\n <div class=\"tw-text-xs tw-text-gray-500 tw-mb-1\">Role Rights:</div>\n <div class=\"tw-flex tw-flex-wrap tw-gap-1\">\n @for (right of row.role_rights; track $index) {\n <span class=\"tw-inline-block tw-px-2 tw-py-1 tw-text-xs tw-bg-blue-100 tw-text-blue-800 tw-rounded\">\n {{ right }}\n </span>\n }\n </div>\n </div>\n }\n\n\n <!-- Exception Indicator -->\n @if (row.hasException) {\n <div class=\"tw-mt-2\">\n <span class=\"tw-inline-block tw-px-2 tw-py-1 tw-text-xs tw-bg-yellow-100 tw-text-yellow-800 tw-rounded\">\n Override\n </span>\n </div>\n } @else {\n <div class=\"tw-mt-2\">\n <span class=\"tw-text-xs tw-text-gray-400\">Default</span>\n </div>\n }\n </div>\n</ng-template>\n\n<!-- Permissions Renderer Template -->\n<ng-template #permissionsRendererTemplate let-row=\"row\" let-value=\"value\">\n <div class=\"tw-flex tw-flex-wrap tw-gap-2 tw-max-w-full\">\n @if (row._permissionValues && Object.keys(row._permissionValues).length > 0) {\n @for (permissionId of Object.keys(row._permissionValues); track permissionId) {\n <div class=\"tw-flex tw-items-center tw-space-x-2\">\n <cide-ele-input type=\"checkbox\" [ngModel]=\"row._permissionValues[permissionId].checked\"\n (ngModelChange)=\"onPermissionChangeSafe($event, row, permissionId)\"\n [id]=\"'permission-' + row._id + '-' + permissionId\" class=\"tw-h-4 tw-w-4\">\n </cide-ele-input>\n <label [for]=\"'permission-' + row._id + '-' + permissionId\" \n class=\"tw-text-xs tw-cursor-pointer\"\n [ngClass]=\"{\n 'tw-text-gray-700': row._permissionValues[permissionId].modified === row._permissionValues[permissionId].actual,\n 'tw-text-blue-600 tw-font-semibold': row._permissionValues[permissionId].modified !== row._permissionValues[permissionId].actual\n }\">\n {{ row._permissionValues[permissionId].permission?.sygms_title }}\n @if (row._permissionValues[permissionId].modified !== row._permissionValues[permissionId].actual) {\n <span class=\"tw-text-xs tw-text-orange-500 tw-ml-1\" title=\"Modified from role permission\">\n ({{ row._permissionValues[permissionId].actual ? '\u2713' : '\u2717' }})\n </span>\n }\n </label>\n </div>\n }\n } @else {\n <!-- No permissions to display - show N/A (permissions are already loaded, just empty) -->\n <span class=\"tw-text-xs tw-text-gray-400\">N/A</span>\n }\n </div>\n</ng-template>", styles: [":host ::ng-deep .entity-mapping-card{transition:all .2s ease}:host ::ng-deep .entity-mapping-card:hover{transform:translateY(-2px)}:host ::ng-deep .entity-mapping-card .cide-card-header{background:linear-gradient(135deg,#3b82f60d,#9333ea0d);border-bottom:1px solid rgba(59,130,246,.1)}:host ::ng-deep .dark .entity-mapping-card .cide-card-header{background:linear-gradient(135deg,#3b82f61a,#9333ea1a);border-bottom:1px solid rgba(59,130,246,.2)}:host ::ng-deep .entity-mapping-card .cide-card-header-content{font-weight:600}:host ::ng-deep .entity-mapping-card .cide-card-body{background:linear-gradient(180deg,#f9fafb80,#ffffff80)}:host ::ng-deep .dark .entity-mapping-card .cide-card-body{background:linear-gradient(180deg,#11182780,#1f293780)}\n"] }]
|
|
16731
|
-
}], ctorParameters: () => [] });
|
|
17189
|
+
], template: "<!-- \n ENTERPRISE USER MASTER FORM\n \n Enterprise-Level Styling with Tailwind CSS\n Features: Responsive grids, proper typography, enhanced user experience\n-->\n\n<cide-lyt-shared-wrapper [shared_wrapper_setup_param]=\"{ sypg_page_code: pageCode() }\" [breadcrumb_data]=\"breadcrumbData()\">\n <div class=\"tw-w-full tw-h-full tw-p-1 tw-pt-2\">\n <!-- Toast Notifications -->\n <cide-ele-toast-notification></cide-ele-toast-notification>\n \n <form class=\"tw-max-w-7xl tw-mx-auto tw-bg-transparent\" [formGroup]=\"userMasterForm\" [class.tw-opacity-60]=\"loading()\"\n (ngSubmit)=\"onSubmit()\">\n\n\n <!-- User Context Header -->\n <div\n class=\"tw-bg-gradient-to-r tw-from-blue-50 tw-to-indigo-50 tw-border tw-border-blue-200 tw-rounded-md tw-p-1 tw-mb-2 tw-shadow-sm\">\n <div class=\"tw-flex tw-items-center tw-justify-between tw-flex-wrap tw-gap-2\">\n <!-- User Basic Info Display -->\n <div class=\"tw-flex tw-items-center tw-gap-3 tw-flex-wrap\">\n <!-- Profile Photo Preview -->\n <div class=\"tw-flex tw-items-center tw-gap-2\">\n <div\n class=\"tw-w-8 tw-h-8 tw-rounded-full tw-bg-blue-100 tw-border tw-border-blue-200 tw-flex tw-items-center tw-justify-center tw-overflow-hidden\">\n @if (userMasterForm.get('user_photo_id_cyfm')?.value) {\n <img cideEleFileImage [fileId]=\"userMasterForm.get('user_photo_id_cyfm')?.value\"\n [altText]=\"'Profile Photo'\" class=\"tw-w-full tw-h-full tw-object-cover\">\n } @else {\n <cide-ele-icon name=\"person\" class=\"tw-w-5 tw-h-5 tw-text-blue-600\">\n </cide-ele-icon>\n }\n </div>\n <div class=\"tw-flex tw-flex-col\">\n <span class=\"tw-text-xs tw-font-medium tw-text-blue-900\">\n {{ getUserFullName() || 'New User' }}\n </span>\n <span class=\"tw-text-xs tw-text-blue-600\">\n {{ getUserUsername() || 'Username not set' }}\n </span>\n </div>\n </div>\n\n <!-- Contact Info -->\n <div class=\"tw-flex tw-items-center tw-gap-3\">\n <div class=\"tw-flex tw-items-center tw-gap-1 tw-text-xs tw-text-gray-700\">\n <cide-ele-icon variant=\"gray\" size=\"xs\">email</cide-ele-icon>\n <span>{{ getUserEmail() || 'Email not set' }}</span>\n </div>\n <div class=\"tw-flex tw-items-center tw-gap-1 tw-text-xs tw-text-gray-700\">\n <cide-ele-icon variant=\"gray\" size=\"xs\">phone</cide-ele-icon>\n <span>{{ getUserMobile() || 'Mobile not set' }}</span>\n </div>\n </div>\n\n <!-- Active Status -->\n <div class=\"tw-flex tw-items-center tw-gap-1\">\n @if (getUserActiveStatus()) {\n <span\n class=\"tw-inline-flex tw-items-center tw-px-2 tw-py-1 tw-rounded tw-text-xs tw-font-medium tw-bg-green-100 tw-text-green-700\">\n <cide-ele-icon variant=\"green\" size=\"xs\" class=\"tw-mr-1\">check_circle</cide-ele-icon>\n Active\n </span>\n } @else {\n <span\n class=\"tw-inline-flex tw-items-center tw-px-2 tw-py-1 tw-rounded tw-text-xs tw-font-medium tw-bg-red-100 tw-text-red-700\">\n <cide-ele-icon variant=\"red\" size=\"xs\" class=\"tw-mr-1\">cancel</cide-ele-icon>\n Inactive\n </span>\n }\n </div>\n </div>\n\n <!-- Entity Info -->\n <div class=\"tw-flex tw-items-center tw-gap-2\">\n @if (hasDefaultEntity()) {\n <div class=\"tw-flex tw-items-center tw-gap-1 tw-text-xs tw-text-blue-700\">\n <cide-ele-icon variant=\"blue\" size=\"xs\">business</cide-ele-icon>\n <span class=\"tw-font-medium\">{{ getDefaultEntityName() }}</span>\n </div>\n } @else {\n <div class=\"tw-flex tw-items-center tw-gap-1 tw-text-xs tw-text-gray-500\">\n <cide-ele-icon variant=\"gray\" size=\"xs\">business</cide-ele-icon>\n <span class=\"tw-italic\">No entity</span>\n </div>\n }\n\n <span class=\"tw-text-xs tw-text-gray-600 tw-px-2 tw-py-1 tw-bg-gray-100 tw-rounded\">\n {{ getEntityMappingCount() }} mapping(s)\n </span>\n </div>\n </div>\n </div>\n\n <!-- Tab Navigation -->\n <div class=\"tw-p-0 tw-mb-2 tw-border-b tw-border-gray-200\">\n <cide-ele-tab [tabs]=\"userTabs()\" [activeTabId]=\"activeTab()\" size=\"md\" variant=\"default\"\n (tabChange)=\"onTabChange($event)\">\n </cide-ele-tab>\n </div>\n\n <!-- Tab Content -->\n <div class=\"tw-transition-opacity tw-duration-300\" [class.tw-opacity-60]=\"loading()\">\n @switch (activeTab()) {\n\n @case ('basic') {\n <!-- User Basic Information Section -->\n <div class=\"tw-py-1 tw-border-b-0 tw-mb-1\">\n\n <!-- Top Section: Form Fields on Left, Profile Photo on Right -->\n <div class=\"tw-grid tw-grid-cols-1 lg:tw-grid-cols-[1fr_200px] tw-gap-4 tw-mb-4\">\n <!-- Left Side: Form Fields -->\n <div class=\"tw-space-y-4\">\n <!-- Name Fields - All in One Row -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-4 tw-gap-4\">\n <cide-ele-input id=\"user_firstname\" label=\"First Name\" formControlName=\"user_firstname\"\n placeholder=\"Enter first name\" [maxlength]=\"20\" size=\"md\" (ngModelChange)=\"onNameFieldChange()\">\n </cide-ele-input>\n\n <cide-ele-input id=\"user_middlename\" label=\"Middle Name\" formControlName=\"user_middlename\"\n placeholder=\"Enter middle name\" [maxlength]=\"20\" size=\"md\" (ngModelChange)=\"onNameFieldChange()\">\n </cide-ele-input>\n\n <cide-ele-input id=\"user_lastname\" label=\"Last Name\" formControlName=\"user_lastname\"\n placeholder=\"Enter last name\" [maxlength]=\"20\" size=\"md\" (ngModelChange)=\"onNameFieldChange()\">\n </cide-ele-input>\n\n <cide-ele-input id=\"user_fullname\" label=\"Full Name (Auto-generated)\" formControlName=\"user_fullname\"\n placeholder=\"Auto-generated from name fields or enter manually\" [maxlength]=\"62\" size=\"md\">\n </cide-ele-input>\n </div>\n\n <!-- Contact Information - All in One Row -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-3 tw-gap-4\">\n <cide-ele-input id=\"user_username\" label=\"Username\" formControlName=\"user_username\"\n placeholder=\"Enter unique username\" [maxlength]=\"20\" size=\"md\">\n </cide-ele-input>\n\n <cide-ele-input id=\"user_emailid\" label=\"Email ID\" formControlName=\"user_emailid\" type=\"email\"\n placeholder=\"Enter valid email address\" [maxlength]=\"320\" size=\"md\">\n </cide-ele-input>\n\n <cide-ele-input id=\"user_mobileno\" label=\"Mobile Number\" formControlName=\"user_mobileno\" type=\"tel\"\n placeholder=\"Enter mobile number\" [maxlength]=\"15\" size=\"md\">\n </cide-ele-input>\n </div>\n\n <!-- User Type Mapping -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 tw-gap-4\">\n <cide-ele-select\n id=\"syutm_user_type\"\n label=\"User Type\"\n placeholder=\"Select user type\"\n [options]=\"userTypeOptions\"\n valueKey=\"value\"\n labelKey=\"label\"\n formControlName=\"syutm_user_type\"\n size=\"md\">\n </cide-ele-select>\n\n <cide-ele-input\n id=\"syutm_type_specific_id\"\n label=\"Type-Specific ID\"\n placeholder=\"Enter type-specific ID (e.g., STU001, TCH001)\"\n formControlName=\"syutm_type_specific_id\"\n [maxlength]=\"50\"\n size=\"md\">\n </cide-ele-input>\n </div>\n </div>\n\n <!-- Right Side: Profile Photo Upload -->\n <div class=\"tw-flex tw-items-start tw-justify-center tw-p-0\">\n <cide-ele-file-input id=\"user_photo_id_cyfm\" formControlName=\"user_photo_id_cyfm\" accept=\"image/*\"\n [showPreview]=\"true\" [previewBoxMode]=\"true\" [showFileName]=\"false\" previewWidth=\"180px\"\n previewHeight=\"120px\" placeholderText=\"Upload Photo\" placeholderIcon=\"cloud_upload\" [autoUpload]=\"true\"\n [uploadData]=\"getProfilePhotoUploadData()\" (uploadSuccess)=\"onProfilePhotoUploadSuccess($event)\"\n (uploadError)=\"onProfilePhotoUploadError($event)\"\n (uploadProgressChange)=\"onProfilePhotoUploadProgress($event)\">\n </cide-ele-file-input>\n </div>\n </div>\n\n\n\n <!-- Status Control -->\n <div class=\"tw-grid tw-grid-cols-1 tw-mb-2\">\n <div class=\"tw-p-2 tw-bg-blue-50 tw-border tw-border-blue-100 tw-rounded-lg\">\n <label\n class=\"tw-flex tw-flex-col tw-cursor-pointer tw-py-2 tw-bg-transparent tw-border-none tw-rounded-none tw-transition-all tw-duration-200 hover:tw-bg-blue-75\">\n <cide-ele-input type=\"checkbox\" label=\"Active User Status\" formControlName=\"user_isactive\"\n class=\"tw-h-5 tw-accent-blue-500 tw-rounded tw-mb-1\" />\n <span class=\"tw-font-semibold tw-text-gray-700 tw-text-base\"></span>\n <span class=\"tw-text-sm tw-text-gray-600 tw-mt-1 tw-leading-relaxed\">Enable this user account for system\n access and operations</span>\n </label>\n </div>\n </div>\n </div>\n }\n\n @case ('auth') {\n <!-- Authentication Section -->\n <div class=\"tw-py-1 tw-border-b-0 tw-mb-1\">\n <!-- Password Fields -->\n @if (shouldShowPasswordFields()) {\n <div class=\"tw-mb-4\">\n <!-- Password Fields Header for Edit Mode -->\n @if (isEditMode()) {\n <div class=\"tw-flex tw-items-center tw-justify-between tw-mb-3\">\n <h6 class=\"tw-text-sm tw-font-semibold tw-text-gray-800\">Update Password</h6>\n <button type=\"button\"\n class=\"tw-px-3 tw-py-1 tw-bg-gray-100 tw-text-gray-600 tw-border tw-border-gray-300 tw-rounded-md tw-text-xs tw-font-medium hover:tw-bg-gray-200 tw-transition-colors\"\n (click)=\"cancelPasswordUpdate()\">\n Cancel Password Update\n </button>\n </div>\n }\n\n <div class=\"tw-grid tw-grid-cols-1 lg:tw-grid-cols-2 md:tw-grid-cols-1 tw-gap-6\">\n <cide-ele-input id=\"user_password\" [label]=\"getPasswordFieldLabel()\" formControlName=\"user_password\"\n type=\"password\" placeholder=\"Enter secure password (min 8 characters)\" size=\"md\">\n </cide-ele-input>\n\n <cide-ele-input id=\"user_confirm_password\" [label]=\"getPasswordConfirmLabel()\"\n formControlName=\"user_confirm_password\" type=\"password\" placeholder=\"Confirm your password\" size=\"md\">\n </cide-ele-input>\n </div>\n </div>\n }\n\n <!-- Password Update Option for Edit Mode -->\n @if (isEditMode() && !shouldShowPasswordFields()) {\n <div class=\"tw-mb-4\">\n <div class=\"tw-p-2 tw-bg-blue-50 tw-border tw-border-blue-200 tw-rounded-lg\">\n <h6 class=\"tw-text-sm tw-font-semibold tw-text-blue-800 tw-mb-2\">Password Update</h6>\n <p class=\"tw-text-sm tw-text-blue-600 tw-mb-3\">Current password will be kept. Click below to change\n password.</p>\n\n @if (hasPasswordInput()) {\n <div\n class=\"tw-mb-3 tw-p-2 tw-bg-yellow-50 tw-border tw-border-yellow-200 tw-rounded tw-text-sm tw-text-yellow-700\">\n <cide-ele-icon variant=\"yellow\" size=\"xs\" class=\"tw-mr-1\">warning</cide-ele-icon>\n Password fields contain text. Click \"Change Password\" to manage existing input.\n </div>\n }\n\n <button type=\"button\"\n class=\"tw-px-4 tw-py-2 tw-bg-blue-100 tw-text-blue-700 tw-border tw-border-blue-300 tw-rounded-md tw-text-sm tw-font-medium hover:tw-bg-blue-200 tw-transition-colors\"\n (click)=\"triggerPasswordUpdate()\">\n @if (hasPasswordInput()) {\n Manage Password Fields\n } @else {\n Change Password\n }\n </button>\n </div>\n </div>\n }\n\n <!-- Password Options -->\n <div class=\"tw-grid tw-grid-cols-1 tw-gap-4 tw-mb-4\">\n <div class=\"tw-p-2 tw-bg-yellow-50 tw-border tw-border-yellow-100 tw-rounded-lg\">\n <label\n class=\"tw-flex tw-flex-col tw-gap-2 tw-cursor-pointer tw-py-2 tw-bg-transparent tw-border-none tw-rounded-none tw-transition-all tw-duration-200\">\n <cide-ele-input type=\"checkbox\" label=\"Force Password Change on Login\"\n formControlName=\"user_passwordchangeonlogin\" class=\"tw-h-5 tw-accent-yellow-500 tw-rounded tw-mb-1\" />\n <span class=\"tw-text-sm tw-text-gray-600 tw-mt-1 tw-leading-relaxed\">User will be required to change\n password on next login</span>\n </label>\n </div>\n </div>\n\n </div>\n }\n\n @case ('roles') {\n <!-- Entity, Roles & Permissions Mapping Section -->\n <div class=\"tw-py-1 tw-border-b-0 tw-mb-1\">\n\n\n\n <!-- Important Note -->\n <div class=\"tw-bg-amber-50 tw-border tw-border-amber-200 tw-rounded-lg tw-p-2 tw-mb-4\">\n <div class=\"tw-flex tw-items-start tw-gap-3\">\n <cide-ele-icon variant=\"amber\" size=\"lg\">info</cide-ele-icon>\n <div class=\"tw-flex-1\">\n <h4 class=\"tw-text-sm tw-font-semibold tw-text-amber-800 tw-mb-1\">Entity-Role Based Access</h4>\n <p class=\"tw-text-sm tw-text-amber-700 tw-mb-2\">User access is completely managed through entity-role\n mappings below. At least one entity mapping is required for user access.</p>\n @if (hasDefaultEntity()) {\n <div class=\"tw-flex tw-items-center tw-gap-2 tw-mt-2 tw-p-2 tw-bg-amber-100 tw-rounded\">\n <cide-ele-icon variant=\"amber\" size=\"sm\">star</cide-ele-icon>\n <span class=\"tw-text-sm tw-text-amber-800\">\n <strong>Default Entity:</strong> {{ getDefaultEntityName() }}\n </span>\n </div>\n } @else {\n <div class=\"tw-text-sm tw-text-amber-600 tw-mt-2 tw-italic\">\n \u26A0\uFE0F No default entity selected. Please set one entity as default.\n </div>\n }\n </div>\n </div>\n </div>\n\n <!-- Entity-Role Mapping Section -->\n <div class=\"tw-flex tw-text-center tw-justify-between tw-items-center tw-mb-4\">\n <div>\n <h4 class=\"tw-text-sm tw-text-left tw-font-semibold tw-text-blue-900 tw-mb-1\">Entity-Role Mapping</h4>\n <p class=\"tw-text-sm tw-text-blue-700\">Map user to entities with specific roles and permissions</p>\n </div>\n <div class=\"tw-flex tw-flex-col tw-items-end\">\n <button cideEleButton variant=\"primary\" size=\"md\" type=\"button\" (click)=\"addEntityMapping()\"\n leftIcon=\"add\" [disabled]=\"isViewingOwnProfile() || isAllEntitiesMapped()\"\n [title]=\"isViewingOwnProfile() ? 'You cannot modify your own entity mappings' : (isAllEntitiesMapped() ? 'All entities are mapped' : 'Add Entity Mapping')\">\n Add Entity Mapping\n </button>\n\n @if (isViewingOwnProfile()) {\n <div class=\"tw-mt-2 tw-p-2 tw-bg-amber-50 tw-border tw-border-amber-200 tw-rounded-md tw-max-w-xs\">\n <p class=\"tw-text-xs tw-text-amber-700\">\n <cide-ele-icon variant=\"warning\" size=\"xs\" class=\"tw-mr-1\">lock</cide-ele-icon>\n You cannot modify your own entity mappings.\n </p>\n </div>\n } @else if (isAllEntitiesMapped()) {\n <div class=\"tw-mt-2 tw-p-2 tw-bg-blue-50 tw-border tw-border-blue-200 tw-rounded-md tw-max-w-xs\">\n <p class=\"tw-text-xs tw-text-blue-700\">\n <cide-ele-icon variant=\"info\" size=\"xs\" class=\"tw-mr-1\">info</cide-ele-icon>\n All available entities are already mapped.\n </p>\n </div>\n }\n </div>\n </div>\n\n <div formArrayName=\"core_entity_mapping\">\n @for (mapping of entityMappings(); track mapping.syenm_entity_id_syen?._id || mapping.syenm_entity_id_syen || $index; let i = $index) {\n <cide-ele-card\n [title]=\"getEntityNameFromMapping(i) || 'Entity Mapping ' + (i + 1)\"\n [subtitle]=\"mapping.syenm_isdefault ? 'Primary Entity' : ''\"\n [cardConfig]=\"{\n collapsible: true,\n minimizable: false,\n maximizable: false,\n removable: !mapping?._id && !isViewingOwnProfile(),\n defaultState: 'collapsed',\n showHeader: true,\n showFooter: false,\n variant: 'default',\n size: 'sm',\n shadow: true,\n rounded: true,\n bordered: true\n }\"\n (stateChange)=\"onEntityMappingCardStateChange($event, i)\"\n (removed)=\"removeEntityMapping(i)\"\n class=\"tw-mb-2 entity-mapping-card tw-block\">\n \n <div [formGroupName]=\"i\">\n \n <!-- Card Content -->\n <div class=\"tw-space-y-3\">\n <!-- Hidden form control to maintain form structure for entity -->\n <input type=\"hidden\" [formControlName]=\"'syenm_entity_id_syen'\" />\n \n <!-- Role, Default, Active, and User Type in One Row -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-4 tw-gap-3\">\n <!-- Role Selection with Copy Button -->\n <div class=\"tw-flex tw-flex-col\">\n <cide-ele-select label=\"Role for this Entity\" [options]=\"getRoleOptionsForEntity(i)\"\n formControlName=\"syenm_role_id_syusrol\" valueKey=\"_id\" labelKey=\"syusrol_role_name\"\n placeholder=\"Select role for this entity\" size=\"md\" (change)=\"onRoleChange(i, $event)\">\n </cide-ele-select>\n @if (!isViewingOwnProfile() && entityMappings().length > 1) {\n <button \n type=\"button\"\n (click)=\"showCopyRoleFromEntityDrawer(i)\"\n class=\"tw-mt-1 tw-text-xs tw-text-blue-600 hover:tw-text-blue-800 tw-flex tw-items-center tw-gap-1 tw-w-fit tw-transition-colors\"\n title=\"Copy role and settings from another entity mapping\">\n <cide-ele-icon variant=\"blue\" size=\"xs\">content_copy</cide-ele-icon>\n <span>Copy from Entity</span>\n </button>\n }\n </div>\n \n <!-- Primary Entity Checkbox -->\n <div class=\"tw-flex tw-flex-col tw-justify-end\">\n <div class=\"tw-flex tw-items-center tw-gap-2 tw-px-3 tw-py-2 tw-rounded-md tw-border tw-border-green-300 tw-bg-green-50 dark:tw-bg-green-900/30 dark:tw-border-green-700\" (click)=\"$event.stopPropagation()\">\n <input \n type=\"checkbox\" \n [checked]=\"mapping.syenm_isdefault\"\n (change)=\"onDefaultEntityChange(i, $event)\" \n class=\"tw-h-4 tw-w-4 tw-accent-green-600 tw-cursor-pointer\" />\n <label class=\"tw-inline-flex tw-items-center tw-gap-1 tw-text-xs tw-font-semibold tw-text-green-700 dark:tw-text-green-300 tw-cursor-pointer\">\n <cide-ele-icon variant=\"green\" size=\"xs\" class=\"!tw-text-green-600 dark:!tw-text-green-400\">star</cide-ele-icon>\n DEFAULT\n </label>\n </div>\n </div>\n \n <!-- Active Mapping Checkbox -->\n <div class=\"tw-flex tw-flex-col tw-justify-end\">\n <div class=\"tw-flex tw-items-center tw-gap-2 tw-px-3 tw-py-2 tw-rounded-md tw-border tw-border-blue-300 tw-bg-blue-50 dark:tw-bg-blue-900/30 dark:tw-border-blue-700\" (click)=\"$event.stopPropagation()\">\n <input \n type=\"checkbox\" \n [checked]=\"mapping.syenm_isactive\"\n (change)=\"onActiveMappingChange(i, $event)\" \n class=\"tw-h-4 tw-w-4 tw-accent-blue-600 tw-cursor-pointer\" />\n <label class=\"tw-inline-flex tw-items-center tw-gap-1 tw-text-xs tw-font-semibold tw-text-blue-700 dark:tw-text-blue-300 tw-cursor-pointer\">\n <cide-ele-icon variant=\"blue\" size=\"xs\" class=\"!tw-text-blue-600 dark:!tw-text-blue-400\">check_circle</cide-ele-icon>\n Active\n </label>\n </div>\n </div>\n \n <!-- User Type Mappings -->\n <div class=\"tw-flex tw-flex-col tw-justify-end\">\n <div class=\"tw-flex tw-items-center tw-gap-1.5 tw-flex-wrap\">\n @if (getEntityIdFromMapping(i)) {\n @if (getUserTypeMappingsForEntity(getEntityIdFromMapping(i)).length > 0) {\n @for (typeMapping of getUserTypeMappingsForEntity(getEntityIdFromMapping(i)); track typeMapping._id || typeMapping.syutm_type_specific_id) {\n <span class=\"tw-inline-flex tw-items-center tw-px-2 tw-py-1 tw-rounded tw-text-[10px] tw-font-medium tw-bg-purple-50 dark:tw-bg-purple-900/30 tw-text-gray-900 dark:tw-text-gray-100 tw-border tw-border-purple-300 dark:tw-border-purple-700\">\n <cide-ele-icon variant=\"purple\" size=\"xs\" class=\"tw-mr-1 !tw-text-purple-600 dark:!tw-text-purple-400\">person</cide-ele-icon>\n {{ typeMapping.syutm_user_type }}\n @if (typeMapping.syutm_isactive) {\n <span class=\"tw-ml-1 tw-w-1.5 tw-h-1.5 tw-rounded-full tw-bg-green-600\"></span>\n }\n </span>\n }\n }\n }\n </div>\n </div>\n </div>\n\n\n <!-- Entity-Specific Details and Active Period - All in One Row -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 lg:tw-grid-cols-4 tw-gap-3\">\n <cide-ele-select label=\"Department for this Entity\" [options]=\"getDepartmentOptionsForEntity(i)\"\n formControlName=\"syenm_department_id_sydept\" (change)=\"onDepartmentChange($event)\" valueKey=\"_id\"\n labelKey=\"sydept_name\" placeholder=\"Select department\" size=\"md\">\n </cide-ele-select>\n\n <cide-ele-select label=\"Designation for this Entity\" [options]=\"getDesignationOptionsForEntity(i)\"\n valueKey=\"_id\" labelKey=\"sydsg_name\" formControlName=\"syenm_designation_id_sydsg\"\n placeholder=\"Select designation\" size=\"md\">\n </cide-ele-select>\n\n <cide-ele-input label=\"Active From\" [id]=\"'syenm_activefrom['+i+']'\"\n formControlName=\"syenm_activefrom\" type=\"date\" size=\"md\">\n </cide-ele-input>\n\n <cide-ele-input label=\"Active Until\" [id]=\"'syenm_activeupto['+i+']'\"\n formControlName=\"syenm_activeupto\" type=\"date\" size=\"md\">\n </cide-ele-input>\n </div>\n\n <!-- Menu Rights Grid for this Entity-Role -->\n <div class=\"tw-border-t tw-border-gray-200\">\n\n @if (getMenuRightsForMapping(i).length > 0) {\n <!-- Menu Rights Tree Grid -->\n\n <cide-ele-data-grid [config]=\"getMenuRightsGridConfig(i)\"\n [templateRenderers]=\"getMenuRightsTemplateRenderers(i)\"\n (gridEvent)=\"onMenuRightsGridEvent($event, i)\" class=\"tw-h-96 tw-w-full\">\n </cide-ele-data-grid>\n\n } @else {\n <div class=\"tw-text-center tw-py-8 tw-bg-gray-50 tw-border tw-border-gray-200 tw-rounded-lg\">\n <div class=\"tw-text-gray-400 tw-mb-3\">\n <cide-ele-icon variant=\"gray\" size=\"lg\">menu</cide-ele-icon>\n </div>\n <h6 class=\"tw-text-sm tw-font-medium tw-text-gray-600 tw-mb-2\">No Menu Rights Available</h6>\n <p class=\"tw-text-xs tw-text-gray-500 tw-mb-3 tw-text-center\">Select both entity and role to\n automatically load\n menu rights for this mapping.</p>\n </div>\n }\n </div>\n </div>\n </div>\n </cide-ele-card>\n }\n </div>\n\n @if (entityMappings().length === 0) {\n <div class=\"tw-text-center tw-py-8 tw-bg-white tw-border tw-border-blue-200 tw-rounded-lg\">\n <div class=\"tw-text-blue-400 tw-mb-3\">\n <cide-ele-icon variant=\"blue\" size=\"lg\">business</cide-ele-icon>\n </div>\n <h4 class=\"tw-text-sm tw-font-medium tw-text-blue-800 tw-mb-2\">No Entity Mappings</h4>\n <p class=\"tw-text-blue-600 tw-mb-4 tw-text-center\">Add entity mappings to assign specific roles and\n permissions for different entities.</p>\n @if (!isViewingOwnProfile()) {\n <button class=\"tw-mx-auto\" cideEleButton variant=\"primary\" size=\"md\" type=\"button\"\n (click)=\"addEntityMapping()\" leftIcon=\"add\">\n Add First Entity Mapping\n </button>\n } @else {\n <p class=\"tw-text-amber-600 tw-text-sm tw-font-medium\">\n <cide-ele-icon variant=\"warning\" size=\"xs\" class=\"tw-mr-1\">lock</cide-ele-icon>\n You cannot modify your own entity mappings.\n </p>\n }\n </div>\n }\n </div>\n }\n\n @case ('addresses') {\n <!-- Contact Addresses Section -->\n <div class=\"tw-py-1 tw-border-b-0 tw-mb-1\">\n <div class=\"tw-flex tw-justify-end\">\n <div class=\"tw-flex tw-justify-between tw-items-end tw-mb-2 tw-gap-4\">\n <button cideEleButton variant=\"primary\" size=\"md\" type=\"button\" (click)=\"addContactAddress()\"\n leftIcon=\"add\" [disabled]=\"!hasAddContactAddressRights()\">\n Add New Address\n </button>\n </div>\n </div>\n\n <div formArrayName=\"core_user_contact_addresses\">\n @for (address of contactAddresses(); track $index; let i = $index) {\n <div [formGroupName]=\"i\"\n class=\"tw-bg-white tw-border tw-border-gray-200 tw-rounded-xl tw-mb-8 tw-overflow-hidden tw-transition-all tw-duration-300 hover:tw-shadow-lg tw-shadow-sm\">\n <div\n class=\"tw-bg-gradient-to-r tw-from-gray-50 tw-to-gray-100 tw-px-4 tw-py-2 tw-flex tw-justify-between tw-items-center tw-border-b tw-border-gray-200\">\n <!-- Use address type as header instead of generic \"Address X\" -->\n <h4 class=\"tw-m-0 tw-text-gray-700 tw-text-sm tw-font-semibold tw-tracking-tight\">\n {{ getAddressTypeLabel(i) || ('Address ' + (i + 1)) }}\n </h4>\n <div class=\"tw-flex tw-items-center tw-gap-2\">\n @if (isAddressOwner(i)) {\n <button cideEleButton variant=\"secondary\" size=\"xs\" type=\"button\" (click)=\"shareAddress(i)\"\n leftIcon=\"share\" class=\"tw-text-blue-600 hover:tw-text-blue-700\">\n Share\n </button>\n }\n @if (!address?._id) {\n <button cideEleButton variant=\"danger\" size=\"sm\" type=\"button\" (click)=\"removeContactAddress(i)\"\n leftIcon=\"delete\">\n Remove\n </button>\n }\n </div>\n </div>\n <div class=\"tw-p-4\">\n <!-- Main Layout: Inputs on Left, Address Textarea on Right -->\n <div class=\"tw-grid tw-grid-cols-1 lg:tw-grid-cols-4 tw-gap-3 tw-mb-3\">\n \n <!-- Left Side: Input Fields (3/4 width) -->\n <div class=\"lg:tw-col-span-3\">\n <!-- Row 1: Address Type, Contact Person -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 tw-gap-3 tw-mb-3\">\n <cide-ele-select label=\"Address Type\" [options]=\"addressTypeOptions()\" id=\"sycad_address_type_id_sygms\"\n formControlName=\"sycad_address_type_id_sygms\" placeholder=\"Select type\" size=\"sm\"\n valueKey=\"_id\" labelKey=\"sygms_title\" (change)=\"onAddressTypeChange(i)\">\n </cide-ele-select>\n\n <cide-ele-input label=\"Contact Person\" formControlName=\"sycad_contact_person_name\"\n placeholder=\"Enter contact person\" size=\"sm\">\n </cide-ele-input>\n </div>\n\n <!-- Row 2: Postal Code, City, State, Country -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-4 tw-gap-3\">\n <cide-ele-select label=\"Postal Code\" [options]=\"addressPostalCodes()[i] || []\"\n formControlName=\"sycad_contact_pin_sypin\" placeholder=\"Select postal code\" [searchable]=\"true\"\n [loading]=\"addressPostalCodesLoading()[i] || false\" (searchChange)=\"onPostalCodeSearch($event, i)\"\n (change)=\"onPostalCodeSelection($event, i)\" size=\"sm\">\n </cide-ele-select>\n\n <cide-ele-input label=\"City\" formControlName=\"sycad_contact_city_sypin\" placeholder=\"Enter city\"\n size=\"sm\">\n </cide-ele-input>\n\n <cide-ele-input label=\"State\" formControlName=\"sycad_contact_state_sypin\" placeholder=\"Enter state\"\n size=\"sm\">\n </cide-ele-input>\n\n <cide-ele-select label=\"Country\" [options]=\"addressCountries()[i] || []\"\n formControlName=\"sycad_contact_country_syctr\" placeholder=\"Select country\" valueKey=\"_id\"\n labelKey=\"syctr_country_iso_name\" [searchable]=\"true\" (searchChange)=\"onCountrySearch($event, i)\"\n [loading]=\"addressCountriesLoading()[i] || false\" size=\"sm\">\n </cide-ele-select>\n </div>\n </div>\n\n <!-- Right Side: Address Textarea (1/4 width, spans 2 rows) -->\n <div class=\"lg:tw-col-span-1 lg:tw-row-span-2 tw-flex tw-flex-col\">\n <cide-ele-textarea label=\"Complete Address\" formControlName=\"sycad_contact_address\"\n placeholder=\"Enter complete address with area, city, and landmarks\" [rows]=\"4\" size=\"sm\"\n class=\"tw-h-full\">\n </cide-ele-textarea>\n </div>\n </div>\n\n <!-- Contact Details: Primary Phone, Alt Phone, Fax, Primary Email in 4 columns -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-4 tw-gap-3 tw-mb-3\">\n <cide-ele-input label=\"Primary Phone\" formControlName=\"sycad_contact_phone\" type=\"tel\"\n placeholder=\"Primary phone\" size=\"sm\">\n </cide-ele-input>\n\n <cide-ele-input label=\"Alternate Phone\" formControlName=\"sycad_contact_phone_alt\" type=\"tel\"\n placeholder=\"Alternate phone\" size=\"sm\">\n </cide-ele-input>\n\n <cide-ele-input label=\"Fax Number\" formControlName=\"sycad_contact_fax\" placeholder=\"Fax number\"\n size=\"sm\">\n </cide-ele-input>\n\n <cide-ele-input label=\"Primary Email\" formControlName=\"sycad_contact_email\" type=\"email\"\n placeholder=\"Primary email\" size=\"sm\">\n </cide-ele-input>\n </div>\n\n <!-- Alternate Email in single row -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 tw-gap-3\">\n <cide-ele-input label=\"Alternate Email\" formControlName=\"sycad_contact_email_alt\" type=\"email\"\n placeholder=\"Alternate email address\" size=\"sm\">\n </cide-ele-input>\n </div>\n </div>\n </div>\n }\n </div>\n </div>\n }\n\n @case ('documents') {\n <!-- Documents Section -->\n <div class=\"tw-py-1 tw-border-b-0 tw-mb-1\">\n <div class=\"tw-flex tw-justify-end tw-items-end tw-mb-2 tw-gap-4\">\n <button cideEleButton variant=\"primary\" size=\"md\" type=\"button\" (click)=\"addDocument()\" leftIcon=\"add\" [disabled]=\"!hasAddDocumentRights()\">\n Add Document\n </button>\n </div>\n <div formArrayName=\"core_user_documents\">\n @for (doc of documents(); track $index; let i = $index) {\n <div [formGroupName]=\"i\"\n class=\"tw-bg-white tw-border tw-border-gray-200 tw-rounded-xl tw-mb-8 tw-overflow-hidden tw-transition-all tw-duration-300 hover:tw-shadow-lg tw-shadow-sm\">\n <div\n class=\"tw-bg-gradient-to-r tw-from-gray-50 tw-to-gray-100 tw-px-4 tw-py-2 tw-flex tw-justify-between tw-items-center tw-border-b tw-border-gray-200\">\n <h4 class=\"tw-m-0 tw-text-gray-700 tw-text-sm tw-font-semibold tw-tracking-tight\">\n {{ getDocumentTypeLabel(i) || ('Document ' + (i + 1)) }}\n </h4>\n <div class=\"tw-flex tw-gap-2\">\n @if (doc?._id) {\n <button cideEleButton variant=\"secondary\" size=\"sm\" type=\"button\" (click)=\"shareDocumentRights(i)\"\n leftIcon=\"share\">\n Share\n </button>\n }\n </div>\n </div>\n <div class=\"tw-p-4\">\n <!-- Main Layout: Inputs on Left, File Upload on Right -->\n <div class=\"tw-grid tw-grid-cols-1 lg:tw-grid-cols-3 tw-gap-4\">\n \n <!-- Left Side: Document Information (2/3 width) -->\n <div class=\"lg:tw-col-span-2\">\n <!-- Row 1: Document Type, Document Number, Name as per Document -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-3 tw-gap-3 tw-mb-3\">\n <cide-ele-select label=\"Document Type\" [options]=\"documentTypeOptions()\"\n formControlName=\"syusd_document_type_id_sygms\" placeholder=\"Select type\" size=\"sm\"\n valueKey=\"_id\" labelKey=\"sygms_title\" (change)=\"onDocumentTypeChange(i)\">\n </cide-ele-select>\n\n <cide-ele-input label=\"Document Number\" formControlName=\"syusd_doc_number\"\n placeholder=\"Document number\" size=\"sm\">\n </cide-ele-input>\n\n <cide-ele-input label=\"Name as per Document\" formControlName=\"syusd_doc_name_as_per_doc\"\n placeholder=\"Name on document\" size=\"sm\">\n </cide-ele-input>\n </div>\n\n <!-- Row 2: Issue Date, Expiry Date, Photo Group -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-3 tw-gap-3 tw-mb-3\">\n <cide-ele-input label=\"Issue Date\" formControlName=\"syusd_doc_issue_date\"\n [id]=\"'syusd_doc_issue_date['+i+']'\" type=\"date\" size=\"sm\">\n </cide-ele-input>\n\n <cide-ele-input label=\"Expiry Date\" formControlName=\"syusd_doc_expiry_date\"\n [id]=\"'syusd_doc_expiry_date['+i+']'\" type=\"date\" size=\"sm\">\n </cide-ele-input>\n </div>\n\n <!-- Row 3: Verification Status, KYC Status -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 tw-gap-3\">\n <cide-ele-select label=\"Verification Status\" [options]=\"documentVerificationStatusOptions()\"\n formControlName=\"syusd_doc_verification_status_id_sygms\" placeholder=\"Select status\"\n size=\"sm\" valueKey=\"_id\" labelKey=\"sygms_title\">\n </cide-ele-select>\n\n <cide-ele-select label=\"KYC Status\" [options]=\"documentKycStatusOptions()\"\n formControlName=\"syusd_doc_kyc_status_id_sygms\" placeholder=\"Select KYC status\" size=\"sm\"\n valueKey=\"_id\" labelKey=\"sygms_title\">\n </cide-ele-select>\n </div>\n </div>\n\n <!-- Right Side: File Upload (1/3 width) -->\n <div class=\"lg:tw-col-span-1\">\n <div class=\"tw-bg-gray-50 tw-border tw-border-gray-200 tw-rounded-lg tw-p-3 tw-h-full\">\n \n <!-- File Upload Input -->\n <cide-ele-file-input\n [id]=\"'document-files-' + i\"\n [multiple]=\"true\"\n formControlName=\"syusd_photo_group_id_cyfm\"\n [accept]=\"'.pdf,.jpg,.jpeg,.png,.doc,.docx'\"\n [autoUpload]=\"true\"\n [uploadData]=\"getDocumentUploadData(i)\"\n (change)=\"onDocumentFilesSelected($event, i)\"\n (uploadSuccess)=\"onDocumentUploadSuccess($event, i)\"\n (uploadError)=\"onDocumentUploadError($event, i)\"\n (uploadProgressChange)=\"onDocumentUploadProgress($event, i)\"\n class=\"tw-mb-3\"\n size=\"sm\">\n </cide-ele-file-input>\n\n <!-- Upload Status -->\n <!-- Upload status is now handled by the file input component itself -->\n </div>\n </div>\n </div>\n </div>\n </div>\n }\n </div>\n </div>\n }\n\n @case ('family') {\n <!-- Family Details Section - Compact Design -->\n <div class=\"tw-py-1 tw-border-b-0 tw-mb-1\">\n <div class=\"tw-flex tw-justify-end tw-items-end tw-mb-3 tw-gap-4\">\n <button cideEleButton variant=\"primary\" size=\"sm\" type=\"button\" (click)=\"addFamilyDetail()\" leftIcon=\"add\" [disabled]=\"!hasAddFamilyDetailRights()\">\n Add Family Member\n </button>\n </div>\n\n <div formArrayName=\"core_user_family_details\">\n @for (family of familyDetails(); track $index; let i = $index) {\n <div [formGroupName]=\"i\"\n class=\"tw-bg-white tw-border tw-border-gray-200 tw-rounded-lg tw-mb-4 tw-overflow-hidden tw-transition-all tw-duration-200 hover:tw-shadow-md tw-shadow-sm\">\n \n <!-- Compact Header -->\n <div class=\"tw-bg-gray-50 tw-px-4 tw-py-2 tw-flex tw-justify-between tw-items-center tw-border-b tw-border-gray-200\">\n <h4 class=\"tw-m-0 tw-text-gray-700 tw-text-sm tw-font-medium\">Family Member {{ i + 1 }}</h4>\n <div class=\"tw-flex tw-gap-2\">\n @if (family?._id) {\n <button cideEleButton variant=\"secondary\" size=\"xs\" type=\"button\" (click)=\"shareFamilyDetailRights(i)\"\n leftIcon=\"share\">\n Share\n </button>\n }\n @if (!family?._id) {\n <button cideEleButton variant=\"danger\" size=\"xs\" type=\"button\" (click)=\"removeFamilyDetail(i)\" leftIcon=\"delete\">\n Remove\n </button>\n }\n </div>\n </div>\n \n <!-- Compact Form Content - 3 inputs per row -->\n <div class=\"tw-p-4\">\n <!-- Row 1: Name, User, and Combined Relationship/Active Status (33.33% each) -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-3 tw-gap-3 tw-mb-3\">\n <cide-ele-input label=\"Family Member Name\" formControlName=\"syfdl_family_member_name\"\n placeholder=\"Enter family member full name\" size=\"sm\">\n </cide-ele-input>\n\n <cide-ele-select label=\"Family Member User\" [options]=\"userOptions(i)\"\n formControlName=\"syfdl_family_member_id_user\" placeholder=\"Select family member user\" size=\"sm\"\n valueKey=\"_id\" labelKey=\"user_fullname\" [searchable]=\"true\"\n [loading]=\"userSearchLoading()[i] || false\" (searchChange)=\"onUserSearchChange($event, i)\"\n (change)=\"onUserSelectionChange($event, i)\">\n </cide-ele-select>\n\n <!-- Combined Relationship and Active Status (33.33%) -->\n <div class=\"tw-flex tw-flex-row tw-gap-2 tw-items-end\">\n <div class=\"tw-flex-1\">\n <cide-ele-select label=\"Relationship\" [options]=\"relationshipOptions()\"\n formControlName=\"syfdl_relationship_id_sygms\" placeholder=\"Select relationship\" size=\"sm\"\n valueKey=\"_id\" labelKey=\"sygms_title\">\n </cide-ele-select>\n </div>\n\n <div class=\"tw-flex tw-items-center tw-pt-1 tw-flex-shrink-0\">\n <cide-ele-input formControlName=\"syfdl_isactive\" type=\"checkbox\" label=\"Active\" size=\"sm\">\n </cide-ele-input>\n </div>\n </div>\n </div>\n\n <!-- Row 2: Blood Group, DOB, and Phone -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 xl:tw-grid-cols-3 tw-gap-3 tw-mb-3\">\n <cide-ele-select label=\"Blood Group\" [options]=\"bloodGroupOptions()\"\n formControlName=\"syfdl_blood_group_sygms\" placeholder=\"Select blood group\" size=\"sm\" valueKey=\"_id\"\n labelKey=\"sygms_title\">\n </cide-ele-select>\n\n <cide-ele-input label=\"Date of Birth\" formControlName=\"syfdl_family_member_dob\" type=\"date\" size=\"sm\"\n [id]=\"'syfdl_family_member_dob['+i+']'\">\n </cide-ele-input>\n\n <cide-ele-input label=\"Contact Phone\" formControlName=\"syfdl_contact_phone\" type=\"tel\"\n placeholder=\"Enter contact phone\" size=\"sm\">\n </cide-ele-input>\n </div>\n\n <!-- Row 3: Email, Email ID, and Contact Number -->\n <div class=\"tw-grid tw-grid-cols-1 md:tw-grid-cols-2 xl:tw-grid-cols-3 tw-gap-3 tw-mb-3\">\n <cide-ele-input label=\"Contact Email\" formControlName=\"syfdl_contact_email\" type=\"email\"\n placeholder=\"Enter contact email\" size=\"sm\">\n </cide-ele-input>\n\n <cide-ele-input label=\"Contact Email ID\" formControlName=\"syfdl_contact_email_id\" type=\"email\"\n placeholder=\"Enter contact email ID\" size=\"sm\">\n </cide-ele-input>\n\n <cide-ele-input label=\"Contact Number\" formControlName=\"syfdl_contact_number\" type=\"tel\"\n placeholder=\"Enter contact number\" size=\"sm\">\n </cide-ele-input>\n </div>\n\n </div>\n </div>\n }\n </div>\n </div>\n }\n }\n </div>\n\n <!-- Form Actions -->\n <div\n class=\"tw-flex tw-justify-between tw-items-center tw-gap-4 tw-py-2 tw-bg-white tw-border-t tw-border-gray-200 tw-sticky tw-bottom-0 tw-z-10\">\n <!-- Error Display Component -->\n <div class=\"tw-flex-1\">\n <cide-form-field-error [formGroup]=\"userMasterForm\"></cide-form-field-error>\n </div>\n\n <!-- Action Buttons -->\n <div class=\"tw-flex tw-gap-4\">\n <button cideEleButton type=\"button\" variant=\"secondary\" (click)=\"resetForm()\" leftIcon=\"refresh\"\n [disabled]=\"loading()\">\n Reset Form\n </button>\n\n <button cideEleButton type=\"submit\" variant=\"primary\" [disabled]=\"loading() || userMasterForm.invalid\"\n [loading]=\"loading()\" leftIcon=\"save\">\n Save User Master\n </button>\n </div>\n </div>\n </form>\n</div>\n</cide-lyt-shared-wrapper>\n\n<!-- Template Renderers for Role Permissions Grid -->\n<ng-template #menuDetailsRendererTemplate let-row=\"row\">\n <div class=\"tw-flex tw-items-center tw-space-x-3 tw-min-w-0\">\n <!-- Menu Icon -->\n <div class=\"tw-flex-shrink-0\">\n @if (row.syme_type === 'module') {\n <cide-ele-icon class=\"tw-text-blue-600 tw-w-4 tw-h-4\">folder</cide-ele-icon>\n } @else if (row.syme_type === 'section') {\n <cide-ele-icon class=\"tw-text-green-600 tw-w-4 tw-h-4\">folder_open</cide-ele-icon>\n } @else if (row.syme_type === 'menu') {\n <cide-ele-icon class=\"tw-text-purple-600 tw-w-4 tw-h-4\">menu</cide-ele-icon>\n } @else {\n <cide-ele-icon class=\"tw-text-gray-600 tw-w-4 tw-h-4\">description</cide-ele-icon>\n }\n </div>\n\n <!-- Menu Details -->\n <div class=\"tw-ml-3 tw-min-w-0 tw-flex-1\">\n <div class=\"tw-flex tw-items-center tw-gap-2\">\n <div class=\"tw-text-xs tw-font-medium tw-text-gray-900 tw-truncate\" [title]=\"row.syme_title\">\n {{ row.syme_title || row.menu?.syme_title || row.menu?.syme_menu_name || 'Untitled' }}\n </div>\n <!-- Green pill indicator for parent menus with child permissions -->\n @if (row.syme_type === 'module' || row.syme_type === 'section') {\n @if (hasChildMenusWithPermissions(row._id)) {\n <span\n class=\"tw-inline-flex tw-items-center tw-px-2 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium tw-bg-green-100 tw-text-green-800 tw-whitespace-nowrap\">\n Assigned\n </span>\n }\n }\n </div>\n @if (row.permission?.sygms_name) {\n <div class=\"tw-text-xs tw-text-blue-500 tw-truncate\" [title]=\"row.permission?.sygms_name\">\n {{ row.permission?.sygms_name }}\n </div>\n }\n </div>\n </div>\n</ng-template>\n\n<!-- Menu Type Renderer Template -->\n<ng-template #menuTypeRendererTemplate let-row=\"row\" let-value=\"value\">\n <div class=\"tw-flex tw-items-center tw-justify-center\">\n @if (row.syme_type === 'module') {\n <span\n class=\"tw-inline-flex tw-items-center tw-px-2 tw-py-1 tw-rounded-full tw-text-xs tw-font-medium tw-bg-blue-100 tw-text-blue-800\">\n Module\n </span>\n } @else if (row.syme_type === 'section') {\n <span\n class=\"tw-inline-flex tw-items-center tw-px-2 tw-py-1 tw-rounded-full tw-text-xs tw-font-medium tw-bg-green-100 tw-text-green-800\">\n Section\n </span>\n } @else if (row.syme_type === 'menu') {\n <span\n class=\"tw-inline-flex tw-items-center tw-px-2 tw-py-1 tw-rounded-full tw-text-xs tw-font-medium tw-bg-purple-100 tw-text-purple-800\">\n Menu\n </span>\n } @else {\n <span\n class=\"tw-inline-flex tw-items-center tw-px-2 tw-py-1 tw-rounded-full tw-text-xs tw-font-medium tw-bg-gray-100 tw-text-gray-800\">\n {{ row.syme_type || 'Unknown' }}\n </span>\n }\n </div>\n</ng-template>\n\n<!-- Permissions Checkbox Renderer Template -->\n<ng-template #permissionsCheckboxRendererTemplate let-row=\"row\" let-value=\"value\">\n <div class=\"tw-flex tw-flex-wrap tw-gap-2 tw-max-w-full\">\n @if (row.syme_type === 'menu' && row?.syme_permissions_id_sygms && row?.syme_permissions_id_sygms.length > 0) {\n @for (permissionId of row?.syme_permissions_id_sygms || []; track permissionId) {\n <div class=\"tw-flex tw-items-center tw-space-x-1\">\n <div class=\"tw-flex tw-items-center tw-space-x-1\">\n <input type=\"checkbox\" [checked]=\"isPermissionSelected(row._id, permissionId)\" [disabled]=\"true\"\n class=\"tw-h-4 tw-w-4 tw-text-blue-600 tw-bg-gray-100 tw-border-gray-300 tw-rounded focus:tw-ring-blue-500\">\n <label class=\"tw-text-xs tw-text-gray-700\">\n {{ getPermissionById(permissionId)?.sygms_title || 'Unknown' }}\n </label>\n </div>\n </div>\n }\n } @else {\n <!-- Show green checkmark for parent menus with child permissions -->\n @if (row.syme_type === 'module' || row.syme_type === 'section' || row.syme_type === 'title') {\n @if (hasChildMenusWithPermissions(row._id)) {\n <div class=\"tw-flex tw-items-center tw-justify-center tw-w-6 tw-h-6 tw-bg-green-100 tw-rounded-full\">\n <cide-ele-icon class=\"tw-text-green-600\" size=\"xs\">\n check\n </cide-ele-icon>\n </div>\n } @else {\n <span class=\"tw-text-xs tw-text-gray-400\">N/A</span>\n }\n } @else {\n <span class=\"tw-text-xs tw-text-gray-400\">N/A</span>\n }\n }\n </div>\n</ng-template>\n\n<!-- Menu Rights Permissions Renderer Template -->\n<ng-template #menuRightsPermissionsRendererTemplate let-row=\"row\" let-value=\"value\">\n <div class=\"tw-flex tw-flex-wrap tw-gap-2 tw-max-w-full\">\n <!-- Role Rights Display -->\n @if (row.role_rights && row.role_rights.length > 0) {\n <div class=\"tw-mb-2\">\n <div class=\"tw-text-xs tw-text-gray-500 tw-mb-1\">Role Rights:</div>\n <div class=\"tw-flex tw-flex-wrap tw-gap-1\">\n @for (right of row.role_rights; track $index) {\n <span class=\"tw-inline-block tw-px-2 tw-py-1 tw-text-xs tw-bg-blue-100 tw-text-blue-800 tw-rounded\">\n {{ right }}\n </span>\n }\n </div>\n </div>\n }\n\n\n <!-- Exception Indicator -->\n @if (row.hasException) {\n <div class=\"tw-mt-2\">\n <span class=\"tw-inline-block tw-px-2 tw-py-1 tw-text-xs tw-bg-yellow-100 tw-text-yellow-800 tw-rounded\">\n Override\n </span>\n </div>\n } @else {\n <div class=\"tw-mt-2\">\n <span class=\"tw-text-xs tw-text-gray-400\">Default</span>\n </div>\n }\n </div>\n</ng-template>\n\n<!-- Permissions Renderer Template -->\n<ng-template #permissionsRendererTemplate let-row=\"row\" let-value=\"value\">\n <div class=\"tw-flex tw-flex-wrap tw-gap-2 tw-max-w-full\">\n @if (row._permissionValues && Object.keys(row._permissionValues).length > 0) {\n @for (permissionId of Object.keys(row._permissionValues); track permissionId) {\n <div class=\"tw-flex tw-items-center tw-space-x-2\">\n <cide-ele-input type=\"checkbox\" [ngModel]=\"row._permissionValues[permissionId].checked\"\n (ngModelChange)=\"onPermissionChangeSafe($event, row, permissionId)\"\n [id]=\"'permission-' + row._id + '-' + permissionId\" class=\"tw-h-4 tw-w-4\">\n </cide-ele-input>\n <label [for]=\"'permission-' + row._id + '-' + permissionId\" \n class=\"tw-text-xs tw-cursor-pointer\"\n [ngClass]=\"{\n 'tw-text-gray-700': row._permissionValues[permissionId].modified === row._permissionValues[permissionId].actual,\n 'tw-text-blue-600 tw-font-semibold': row._permissionValues[permissionId].modified !== row._permissionValues[permissionId].actual\n }\">\n {{ row._permissionValues[permissionId].permission?.sygms_title }}\n @if (row._permissionValues[permissionId].modified !== row._permissionValues[permissionId].actual) {\n <span class=\"tw-text-xs tw-text-orange-500 tw-ml-1\" title=\"Modified from role permission\">\n ({{ row._permissionValues[permissionId].actual ? '\u2713' : '\u2717' }})\n </span>\n }\n </label>\n </div>\n }\n } @else {\n <!-- No permissions to display - show N/A (permissions are already loaded, just empty) -->\n <span class=\"tw-text-xs tw-text-gray-400\">N/A</span>\n }\n </div>\n</ng-template>", styles: [":host ::ng-deep .entity-mapping-card{transition:all .2s ease}:host ::ng-deep .entity-mapping-card:hover{transform:translateY(-2px)}:host ::ng-deep .entity-mapping-card .cide-card-header{background:linear-gradient(135deg,#3b82f60d,#9333ea0d);border-bottom:1px solid rgba(59,130,246,.1)}:host ::ng-deep .dark .entity-mapping-card .cide-card-header{background:linear-gradient(135deg,#3b82f61a,#9333ea1a);border-bottom:1px solid rgba(59,130,246,.2)}:host ::ng-deep .entity-mapping-card .cide-card-header-content{font-weight:600}:host ::ng-deep .entity-mapping-card .cide-card-body{background:linear-gradient(180deg,#f9fafb80,#ffffff80)}:host ::ng-deep .dark .entity-mapping-card .cide-card-body{background:linear-gradient(180deg,#11182780,#1f293780)}\n"] }]
|
|
17190
|
+
}], ctorParameters: () => [], propDecorators: { menuDetailsRendererTemplate: [{ type: i0.ViewChild, args: ['menuDetailsRendererTemplate', { isSignal: true }] }], permissionsCheckboxRendererTemplate: [{ type: i0.ViewChild, args: ['permissionsCheckboxRendererTemplate', { isSignal: true }] }], menuTypeRendererTemplate: [{ type: i0.ViewChild, args: ['menuTypeRendererTemplate', { isSignal: true }] }], menuRightsPermissionsRendererTemplate: [{ type: i0.ViewChild, args: ['menuRightsPermissionsRendererTemplate', { isSignal: true }] }], permissionsRendererTemplate: [{ type: i0.ViewChild, args: ['permissionsRendererTemplate', { isSignal: true }] }] } });
|
|
16732
17191
|
|
|
16733
17192
|
var userCreate_component = /*#__PURE__*/Object.freeze({
|
|
16734
17193
|
__proto__: null,
|
|
@@ -16899,13 +17358,40 @@ class CideCoreUserListComponent {
|
|
|
16899
17358
|
console.log('🔧 USER MASTER LIST: Component initializing');
|
|
16900
17359
|
// Initialize rights for user management
|
|
16901
17360
|
this.rightsService.initializeRights(this.pageCode());
|
|
17361
|
+
// Check query params for filtering by user type (from faculty/student list)
|
|
17362
|
+
this.route.queryParams.pipe(takeUntilDestroyed(this.destroyRef)).subscribe(params => {
|
|
17363
|
+
const userTypeParam = params['userType'] || params['filterType'];
|
|
17364
|
+
if (userTypeParam) {
|
|
17365
|
+
const resolvedType = userTypeParam.toString().trim().toUpperCase();
|
|
17366
|
+
// Map common variations
|
|
17367
|
+
if (resolvedType === 'FACULTY' || resolvedType === 'TEACHER') {
|
|
17368
|
+
this.userType.set('TEACHER');
|
|
17369
|
+
}
|
|
17370
|
+
else if (resolvedType === 'STUDENT') {
|
|
17371
|
+
this.userType.set('STUDENT');
|
|
17372
|
+
}
|
|
17373
|
+
else {
|
|
17374
|
+
this.userType.set(resolvedType);
|
|
17375
|
+
}
|
|
17376
|
+
console.log('👤 User type filter set from query params:', this.userType());
|
|
17377
|
+
}
|
|
17378
|
+
});
|
|
16902
17379
|
// Pick up user type and page config from route data/cache (shared wrapper already loaded page API)
|
|
16903
17380
|
this.route.data.pipe(takeUntilDestroyed(this.destroyRef)).subscribe(data => {
|
|
16904
17381
|
const routeUserType = data['userType'] || this.route.snapshot.queryParamMap.get('userType');
|
|
16905
17382
|
const resolvedType = (routeUserType || '').toString().trim().toUpperCase();
|
|
16906
|
-
if (resolvedType) {
|
|
16907
|
-
|
|
16908
|
-
|
|
17383
|
+
if (resolvedType && !this.userType()) {
|
|
17384
|
+
// Only set if not already set from query params
|
|
17385
|
+
if (resolvedType === 'FACULTY' || resolvedType === 'TEACHER') {
|
|
17386
|
+
this.userType.set('TEACHER');
|
|
17387
|
+
}
|
|
17388
|
+
else if (resolvedType === 'STUDENT') {
|
|
17389
|
+
this.userType.set('STUDENT');
|
|
17390
|
+
}
|
|
17391
|
+
else {
|
|
17392
|
+
this.userType.set(resolvedType);
|
|
17393
|
+
}
|
|
17394
|
+
console.log('👤 User type set from route data:', this.userType());
|
|
16909
17395
|
}
|
|
16910
17396
|
const codeFromRoute = data['page']?.sypg_page_code || data['sypg_page_code'];
|
|
16911
17397
|
const codeFromQuery = this.route.snapshot.queryParamMap.get('sypg_page_code');
|
|
@@ -17362,10 +17848,10 @@ class CideCoreUserListComponent {
|
|
|
17362
17848
|
break;
|
|
17363
17849
|
}
|
|
17364
17850
|
}
|
|
17365
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
17366
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.
|
|
17851
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreUserListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
17852
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: CideCoreUserListComponent, isStandalone: true, selector: "cide-core-user-list", viewQueries: [{ propertyName: "gridComponent", first: true, predicate: CideEleDataGridComponent, descendants: true }, { propertyName: "actionsTemplate", first: true, predicate: ["actionsTemplate"], descendants: true, static: true }, { propertyName: "userDetailsTemplate", first: true, predicate: ["userDetailsTemplate"], descendants: true, static: true }, { propertyName: "contactInfoTemplate", first: true, predicate: ["contactInfoTemplate"], descendants: true, static: true }, { propertyName: "organizationTemplate", first: true, predicate: ["organizationTemplate"], descendants: true, static: true }, { propertyName: "validityTemplate", first: true, predicate: ["validityTemplate"], descendants: true, static: true }, { propertyName: "statusTemplate", first: true, predicate: ["statusTemplate"], descendants: true, static: true }], ngImport: i0, template: "<!-- User List with Shared Wrapper -->\n<cide-lyt-shared-wrapper [shared_wrapper_setup_param]=\"{ sypg_page_code: 'auth_user_mst' }\">\n <!-- Breadcrumb Actions -->\n <div breadcrumb-actions>\n @if (canCreate()) {\n <button cideEleButton variant=\"primary\" size=\"sm\" (click)=\"onAddUser()\" leftIcon=\"add\">\n Add User\n </button>\n }\n </div>\n\n<div class=\"user-master-listing-container tw-bg-white tw-shadow-lg tw-rounded-lg tw-table tw-h-full\">\n\n <!-- Error Message -->\n @if (error()) {\n <div class=\"tw-mt-4 tw-p-4 tw-bg-red-50 tw-border tw-border-red-200 tw-rounded-md\">\n <div class=\"tw-flex\">\n <cide-ele-icon name=\"exclamation-triangle\" class=\"tw-text-red-400\"></cide-ele-icon>\n <div class=\"tw-ml-3\">\n <h3 class=\"tw-text-sm tw-font-medium tw-text-red-800\">Error</h3>\n <p class=\"tw-text-sm tw-text-red-700 tw-mt-1\">{{ error() }}</p>\n </div>\n </div>\n </div>\n }\n <div class=\"tw-table-row\">\n <div class=\"tw-table-cell tw-h-full tw-relative\">\n <div class=\"tw-h-full tw-overflow-auto\">\n <!-- Data Grid Component -->\n <cide-ele-data-grid [config]=\"gridConfig()\" [templateRenderers]=\"templateRenderers\"\n [serverSidePagination]=\"true\" [totalServerItems]=\"totalItems()\" [currentServerPage]=\"currentPage()\"\n [currentServerPageSize]=\"pageSize()\" (gridEvent)=\"onGridEvent($event)\">\n </cide-ele-data-grid>\n </div>\n </div>\n </div>\n\n</div>\n\n<!-- Template Definitions for Grid Renderers -->\n\n<!-- User Details Template -->\n<ng-template #userDetailsTemplate let-value let-row=\"row\" let-column=\"column\">\n <div class=\"tw-flex tw-items-center tw-space-x-3\">\n <div\n class=\"tw-flex-shrink-0 tw-w-12 tw-h-12 tw-bg-blue-100 tw-rounded-full tw-flex tw-items-center tw-justify-center\">\n <span class=\"tw-text-blue-600 tw-font-semibold tw-text-sm\">\n {{ getUserInitials(row.user_firstname, row.user_lastname) }}\n </span>\n </div>\n <div class=\"tw-flex-1 tw-min-w-0\">\n <p class=\"tw-text-sm tw-font-semibold tw-text-gray-900 tw-truncate\" [title]=\"row.user_fullname\">\n {{ row.user_fullname || 'Unknown User' }}\n </p>\n <p class=\"tw-text-xs tw-text-blue-600 tw-truncate tw-font-medium\" [title]=\"'Username: ' + row.user_username\">\n @{{ row.user_username || 'No username' }}\n </p>\n <p class=\"tw-text-xs tw-text-gray-400 tw-truncate\" [title]=\"'ID: ' + row._id\">\n ID: {{ row._id?.substring(0, 8) }}...\n </p>\n </div>\n </div>\n</ng-template>\n\n<!-- Contact Info Template -->\n<ng-template #contactInfoTemplate let-value let-row=\"row\" let-column=\"column\">\n <div class=\"tw-space-y-1\">\n <p class=\"tw-text-xs tw-text-gray-900 tw-flex tw-items-center\" [title]=\"'Email: ' + row.user_emailid\">\n <svg class=\"tw-flex-shrink-0 tw-w-3 tw-h-3 tw-text-gray-400 tw-mr-2\" fill=\"currentColor\" viewBox=\"0 0 20 20\">\n <path d=\"M2.003 5.884L10 9.882l7.997-3.998A2 2 0 0016 4H4a2 2 0 00-1.997 1.884z\" />\n <path d=\"M18 8.118l-8 4-8-4V14a2 2 0 002 2h12a2 2 0 002-2V8.118z\" />\n </svg>\n <span class=\"tw-truncate\">{{ row.user_emailid || 'No email' }}</span>\n </p>\n <p class=\"tw-text-xs tw-text-gray-600 tw-flex tw-items-center\" [title]=\"'Mobile: ' + row.user_mobileno\">\n <svg class=\"tw-flex-shrink-0 tw-w-3 tw-h-3 tw-text-gray-400 tw-mr-2\" fill=\"currentColor\" viewBox=\"0 0 20 20\">\n <path\n d=\"M2 3a1 1 0 011-1h2.153a1 1 0 01.986.836l.74 4.435a1 1 0 01-.54 1.06l-1.548.773a11.037 11.037 0 006.105 6.105l.774-1.548a1 1 0 011.059-.54l4.435.74a1 1 0 01.836.986V17a1 1 0 01-1 1h-2C7.82 18 2 12.18 2 5V3z\" />\n </svg>\n <span class=\"tw-truncate\">{{ row.user_mobileno || 'No mobile' }}</span>\n </p>\n <p class=\"tw-text-xs tw-text-gray-500 tw-flex tw-items-center\"\n [title]=\"'Password Change: ' + getPasswordChangeText(row.user_passwordchangeonlogin)\">\n <svg class=\"tw-flex-shrink-0 tw-w-3 tw-h-3 tw-text-gray-400 tw-mr-2\" fill=\"currentColor\" viewBox=\"0 0 20 20\">\n <path fill-rule=\"evenodd\"\n d=\"M5 9V7a5 5 0 0110 0v2a2 2 0 012 2v5a2 2 0 01-2 2H5a2 2 0 01-2-2v-5a2 2 0 012-2zm8-2v2H7V7a3 3 0 016 0z\"\n clip-rule=\"evenodd\" />\n </svg>\n <span class=\"tw-truncate\">{{ getPasswordChangeText(row.user_passwordchangeonlogin) }}</span>\n </p>\n </div>\n</ng-template>\n\n\n\n<!-- Validity Template -->\n<ng-template #validityTemplate let-value let-row=\"row\" let-column=\"column\">\n <div class=\"tw-text-center tw-space-y-1\">\n <p class=\"tw-text-xs tw-text-gray-900 tw-font-medium\">\n Validity managed per entity\n </p>\n <p class=\"tw-text-xs tw-text-gray-600\">\n Check entity mappings for details\n </p>\n </div>\n</ng-template>\n\n<!-- Status Template -->\n<ng-template #statusTemplate let-value let-row=\"row\" let-column=\"column\">\n <div class=\"tw-flex tw-justify-center\">\n @if (row.user_isactive) {\n <span\n class=\"tw-inline-flex tw-items-center tw-px-2.5 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium tw-bg-green-100 tw-text-green-800\">\n <svg class=\"tw-w-1.5 tw-h-1.5 tw-mr-1\" fill=\"currentColor\" viewBox=\"0 0 8 8\">\n <circle cx=\"4\" cy=\"4\" r=\"3\" />\n </svg>\n Active\n </span>\n } @else {\n <span\n class=\"tw-inline-flex tw-items-center tw-px-2.5 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium tw-bg-red-100 tw-text-red-800\">\n <svg class=\"tw-w-1.5 tw-h-1.5 tw-mr-1\" fill=\"currentColor\" viewBox=\"0 0 8 8\">\n <circle cx=\"4\" cy=\"4\" r=\"3\" />\n </svg>\n Inactive\n </span>\n }\n </div>\n</ng-template>\n\n<!-- Actions Template using cide-ele-dropdown -->\n<ng-template #actionsTemplate let-value let-row=\"row\" let-column=\"column\">\n <cide-ele-dropdown [items]=\"getDropdownItems(row)\" [config]=\"{ triggerIcon: 'more_vert', triggerSize: 'sm', usePortal: true, minWidth: 200 }\" (itemClick)=\"onDropdownItemClick($event, row)\">\n </cide-ele-dropdown>\n</ng-template>\n</cide-lyt-shared-wrapper>", styles: [".user-master-listing-container{@apply tw-w-full tw-h-full;}:host{@apply tw-w-full tw-h-full tw-flex tw-flex-col;}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "component", type: CideIconComponent, selector: "cide-ele-icon", inputs: ["size", "type", "toolTip"] }, { kind: "component", type: CideEleButtonComponent, selector: "button[cideEleButton], a[cideEleButton], cide-ele-button", inputs: ["label", "variant", "size", "type", "shape", "elevation", "disabled", "id", "loading", "fullWidth", "leftIcon", "rightIcon", "customClass", "tooltip", "ariaLabel", "testId", "routerLink", "routerExtras", "preventDoubleClick", "animated"], outputs: ["btnClick", "doubleClick"] }, { kind: "component", type: CideEleDataGridComponent, selector: "cide-ele-data-grid", inputs: ["config", "templateRenderers", "customFormatters", "actionHandlers", "serverSidePagination", "totalServerItems", "currentServerPage", "currentServerPageSize", "dragDropEnabled"], outputs: ["gridEvent"] }, { kind: "component", type: CideEleDropdownComponent, selector: "cide-ele-dropdown", inputs: ["items", "config", "triggerTemplate", "menuTemplate"], outputs: ["itemClick", "dropdownToggle"] }, { kind: "component", type: CideLytSharedWrapperComponent, selector: "cide-lyt-shared-wrapper", inputs: ["shared_wrapper_setup_param", "breadcrumb_data"] }] });
|
|
17367
17853
|
}
|
|
17368
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
17854
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreUserListComponent, decorators: [{
|
|
17369
17855
|
type: Component,
|
|
17370
17856
|
args: [{ selector: 'cide-core-user-list', standalone: true, imports: [
|
|
17371
17857
|
CommonModule,
|
|
@@ -17375,7 +17861,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImpor
|
|
|
17375
17861
|
CideEleDataGridComponent,
|
|
17376
17862
|
CideEleDropdownComponent,
|
|
17377
17863
|
CideLytSharedWrapperComponent
|
|
17378
|
-
], template: "<!-- User List with Shared Wrapper -->\n<cide-lyt-shared-wrapper [shared_wrapper_setup_param]=\"{ sypg_page_code: 'auth_user_mst' }\">\n
|
|
17864
|
+
], template: "<!-- User List with Shared Wrapper -->\n<cide-lyt-shared-wrapper [shared_wrapper_setup_param]=\"{ sypg_page_code: 'auth_user_mst' }\">\n <!-- Breadcrumb Actions -->\n <div breadcrumb-actions>\n @if (canCreate()) {\n <button cideEleButton variant=\"primary\" size=\"sm\" (click)=\"onAddUser()\" leftIcon=\"add\">\n Add User\n </button>\n }\n </div>\n\n<div class=\"user-master-listing-container tw-bg-white tw-shadow-lg tw-rounded-lg tw-table tw-h-full\">\n\n <!-- Error Message -->\n @if (error()) {\n <div class=\"tw-mt-4 tw-p-4 tw-bg-red-50 tw-border tw-border-red-200 tw-rounded-md\">\n <div class=\"tw-flex\">\n <cide-ele-icon name=\"exclamation-triangle\" class=\"tw-text-red-400\"></cide-ele-icon>\n <div class=\"tw-ml-3\">\n <h3 class=\"tw-text-sm tw-font-medium tw-text-red-800\">Error</h3>\n <p class=\"tw-text-sm tw-text-red-700 tw-mt-1\">{{ error() }}</p>\n </div>\n </div>\n </div>\n }\n <div class=\"tw-table-row\">\n <div class=\"tw-table-cell tw-h-full tw-relative\">\n <div class=\"tw-h-full tw-overflow-auto\">\n <!-- Data Grid Component -->\n <cide-ele-data-grid [config]=\"gridConfig()\" [templateRenderers]=\"templateRenderers\"\n [serverSidePagination]=\"true\" [totalServerItems]=\"totalItems()\" [currentServerPage]=\"currentPage()\"\n [currentServerPageSize]=\"pageSize()\" (gridEvent)=\"onGridEvent($event)\">\n </cide-ele-data-grid>\n </div>\n </div>\n </div>\n\n</div>\n\n<!-- Template Definitions for Grid Renderers -->\n\n<!-- User Details Template -->\n<ng-template #userDetailsTemplate let-value let-row=\"row\" let-column=\"column\">\n <div class=\"tw-flex tw-items-center tw-space-x-3\">\n <div\n class=\"tw-flex-shrink-0 tw-w-12 tw-h-12 tw-bg-blue-100 tw-rounded-full tw-flex tw-items-center tw-justify-center\">\n <span class=\"tw-text-blue-600 tw-font-semibold tw-text-sm\">\n {{ getUserInitials(row.user_firstname, row.user_lastname) }}\n </span>\n </div>\n <div class=\"tw-flex-1 tw-min-w-0\">\n <p class=\"tw-text-sm tw-font-semibold tw-text-gray-900 tw-truncate\" [title]=\"row.user_fullname\">\n {{ row.user_fullname || 'Unknown User' }}\n </p>\n <p class=\"tw-text-xs tw-text-blue-600 tw-truncate tw-font-medium\" [title]=\"'Username: ' + row.user_username\">\n @{{ row.user_username || 'No username' }}\n </p>\n <p class=\"tw-text-xs tw-text-gray-400 tw-truncate\" [title]=\"'ID: ' + row._id\">\n ID: {{ row._id?.substring(0, 8) }}...\n </p>\n </div>\n </div>\n</ng-template>\n\n<!-- Contact Info Template -->\n<ng-template #contactInfoTemplate let-value let-row=\"row\" let-column=\"column\">\n <div class=\"tw-space-y-1\">\n <p class=\"tw-text-xs tw-text-gray-900 tw-flex tw-items-center\" [title]=\"'Email: ' + row.user_emailid\">\n <svg class=\"tw-flex-shrink-0 tw-w-3 tw-h-3 tw-text-gray-400 tw-mr-2\" fill=\"currentColor\" viewBox=\"0 0 20 20\">\n <path d=\"M2.003 5.884L10 9.882l7.997-3.998A2 2 0 0016 4H4a2 2 0 00-1.997 1.884z\" />\n <path d=\"M18 8.118l-8 4-8-4V14a2 2 0 002 2h12a2 2 0 002-2V8.118z\" />\n </svg>\n <span class=\"tw-truncate\">{{ row.user_emailid || 'No email' }}</span>\n </p>\n <p class=\"tw-text-xs tw-text-gray-600 tw-flex tw-items-center\" [title]=\"'Mobile: ' + row.user_mobileno\">\n <svg class=\"tw-flex-shrink-0 tw-w-3 tw-h-3 tw-text-gray-400 tw-mr-2\" fill=\"currentColor\" viewBox=\"0 0 20 20\">\n <path\n d=\"M2 3a1 1 0 011-1h2.153a1 1 0 01.986.836l.74 4.435a1 1 0 01-.54 1.06l-1.548.773a11.037 11.037 0 006.105 6.105l.774-1.548a1 1 0 011.059-.54l4.435.74a1 1 0 01.836.986V17a1 1 0 01-1 1h-2C7.82 18 2 12.18 2 5V3z\" />\n </svg>\n <span class=\"tw-truncate\">{{ row.user_mobileno || 'No mobile' }}</span>\n </p>\n <p class=\"tw-text-xs tw-text-gray-500 tw-flex tw-items-center\"\n [title]=\"'Password Change: ' + getPasswordChangeText(row.user_passwordchangeonlogin)\">\n <svg class=\"tw-flex-shrink-0 tw-w-3 tw-h-3 tw-text-gray-400 tw-mr-2\" fill=\"currentColor\" viewBox=\"0 0 20 20\">\n <path fill-rule=\"evenodd\"\n d=\"M5 9V7a5 5 0 0110 0v2a2 2 0 012 2v5a2 2 0 01-2 2H5a2 2 0 01-2-2v-5a2 2 0 012-2zm8-2v2H7V7a3 3 0 016 0z\"\n clip-rule=\"evenodd\" />\n </svg>\n <span class=\"tw-truncate\">{{ getPasswordChangeText(row.user_passwordchangeonlogin) }}</span>\n </p>\n </div>\n</ng-template>\n\n\n\n<!-- Validity Template -->\n<ng-template #validityTemplate let-value let-row=\"row\" let-column=\"column\">\n <div class=\"tw-text-center tw-space-y-1\">\n <p class=\"tw-text-xs tw-text-gray-900 tw-font-medium\">\n Validity managed per entity\n </p>\n <p class=\"tw-text-xs tw-text-gray-600\">\n Check entity mappings for details\n </p>\n </div>\n</ng-template>\n\n<!-- Status Template -->\n<ng-template #statusTemplate let-value let-row=\"row\" let-column=\"column\">\n <div class=\"tw-flex tw-justify-center\">\n @if (row.user_isactive) {\n <span\n class=\"tw-inline-flex tw-items-center tw-px-2.5 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium tw-bg-green-100 tw-text-green-800\">\n <svg class=\"tw-w-1.5 tw-h-1.5 tw-mr-1\" fill=\"currentColor\" viewBox=\"0 0 8 8\">\n <circle cx=\"4\" cy=\"4\" r=\"3\" />\n </svg>\n Active\n </span>\n } @else {\n <span\n class=\"tw-inline-flex tw-items-center tw-px-2.5 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium tw-bg-red-100 tw-text-red-800\">\n <svg class=\"tw-w-1.5 tw-h-1.5 tw-mr-1\" fill=\"currentColor\" viewBox=\"0 0 8 8\">\n <circle cx=\"4\" cy=\"4\" r=\"3\" />\n </svg>\n Inactive\n </span>\n }\n </div>\n</ng-template>\n\n<!-- Actions Template using cide-ele-dropdown -->\n<ng-template #actionsTemplate let-value let-row=\"row\" let-column=\"column\">\n <cide-ele-dropdown [items]=\"getDropdownItems(row)\" [config]=\"{ triggerIcon: 'more_vert', triggerSize: 'sm', usePortal: true, minWidth: 200 }\" (itemClick)=\"onDropdownItemClick($event, row)\">\n </cide-ele-dropdown>\n</ng-template>\n</cide-lyt-shared-wrapper>", styles: [".user-master-listing-container{@apply tw-w-full tw-h-full;}:host{@apply tw-w-full tw-h-full tw-flex tw-flex-col;}\n"] }]
|
|
17379
17865
|
}], ctorParameters: () => [], propDecorators: { gridComponent: [{
|
|
17380
17866
|
type: ViewChild,
|
|
17381
17867
|
args: [CideEleDataGridComponent]
|
|
@@ -17461,8 +17947,8 @@ class CideCoreUserAttributesComponent {
|
|
|
17461
17947
|
goBack() {
|
|
17462
17948
|
this.router.navigate(['/admin/user-master']);
|
|
17463
17949
|
}
|
|
17464
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
17465
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.
|
|
17950
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreUserAttributesComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
17951
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: CideCoreUserAttributesComponent, isStandalone: true, selector: "cide-core-user-attributes", ngImport: i0, template: `
|
|
17466
17952
|
<div class="p-5">
|
|
17467
17953
|
<div class="bg-white rounded-lg shadow-md mb-5">
|
|
17468
17954
|
<div class="p-5 border-b border-gray-200 flex justify-between items-center">
|
|
@@ -17596,7 +18082,7 @@ class CideCoreUserAttributesComponent {
|
|
|
17596
18082
|
</div>
|
|
17597
18083
|
`, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: CideFormFieldErrorComponent, selector: "cide-form-field-error", inputs: ["control", "formGroup", "fieldName", "customMessages"] }] });
|
|
17598
18084
|
}
|
|
17599
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
18085
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreUserAttributesComponent, decorators: [{
|
|
17600
18086
|
type: Component,
|
|
17601
18087
|
args: [{
|
|
17602
18088
|
selector: 'cide-core-user-attributes',
|
|
@@ -17803,8 +18289,8 @@ class CideCoreUserContactAddressesComponent {
|
|
|
17803
18289
|
goBack() {
|
|
17804
18290
|
this.router.navigate(['/admin/user-master']);
|
|
17805
18291
|
}
|
|
17806
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
17807
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.
|
|
18292
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreUserContactAddressesComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
18293
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: CideCoreUserContactAddressesComponent, isStandalone: true, selector: "cide-core-user-contact-addresses", ngImport: i0, template: `
|
|
17808
18294
|
<div class="p-5">
|
|
17809
18295
|
<div class="bg-white rounded-lg shadow-md mb-5">
|
|
17810
18296
|
<div class="p-5 border-b border-gray-200 flex justify-between items-center">
|
|
@@ -18057,7 +18543,7 @@ class CideCoreUserContactAddressesComponent {
|
|
|
18057
18543
|
</div>
|
|
18058
18544
|
`, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: CideFormFieldErrorComponent, selector: "cide-form-field-error", inputs: ["control", "formGroup", "fieldName", "customMessages"] }] });
|
|
18059
18545
|
}
|
|
18060
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
18546
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreUserContactAddressesComponent, decorators: [{
|
|
18061
18547
|
type: Component,
|
|
18062
18548
|
args: [{
|
|
18063
18549
|
selector: 'cide-core-user-contact-addresses',
|
|
@@ -18379,8 +18865,8 @@ class CideCoreUserDocumentsComponent {
|
|
|
18379
18865
|
goBack() {
|
|
18380
18866
|
this.router.navigate(['/admin/user-master']);
|
|
18381
18867
|
}
|
|
18382
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
18383
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.
|
|
18868
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreUserDocumentsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
18869
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: CideCoreUserDocumentsComponent, isStandalone: true, selector: "cide-core-user-documents", ngImport: i0, template: `
|
|
18384
18870
|
<div class="p-5">
|
|
18385
18871
|
<div class="bg-white rounded-lg shadow-md mb-5">
|
|
18386
18872
|
<div class="p-5 border-b border-gray-200 flex justify-between items-center">
|
|
@@ -18570,7 +19056,7 @@ class CideCoreUserDocumentsComponent {
|
|
|
18570
19056
|
</div>
|
|
18571
19057
|
`, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$2.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i1$2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: CideFormFieldErrorComponent, selector: "cide-form-field-error", inputs: ["control", "formGroup", "fieldName", "customMessages"] }] });
|
|
18572
19058
|
}
|
|
18573
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
19059
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreUserDocumentsComponent, decorators: [{
|
|
18574
19060
|
type: Component,
|
|
18575
19061
|
args: [{
|
|
18576
19062
|
selector: 'cide-core-user-documents',
|
|
@@ -18838,8 +19324,8 @@ class CideCoreUserEntityAccessComponent {
|
|
|
18838
19324
|
goBack() {
|
|
18839
19325
|
this.router.navigate(['/admin/user-master']);
|
|
18840
19326
|
}
|
|
18841
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
18842
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.
|
|
19327
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreUserEntityAccessComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
19328
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: CideCoreUserEntityAccessComponent, isStandalone: true, selector: "cide-core-user-entity-access", ngImport: i0, template: `
|
|
18843
19329
|
<div class="p-5">
|
|
18844
19330
|
<div class="bg-white rounded-lg shadow-md mb-5">
|
|
18845
19331
|
<div class="p-5 border-b border-gray-200 flex justify-between items-center">
|
|
@@ -19004,7 +19490,7 @@ class CideCoreUserEntityAccessComponent {
|
|
|
19004
19490
|
</div>
|
|
19005
19491
|
`, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$2.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i1$2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }] });
|
|
19006
19492
|
}
|
|
19007
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
19493
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreUserEntityAccessComponent, decorators: [{
|
|
19008
19494
|
type: Component,
|
|
19009
19495
|
args: [{
|
|
19010
19496
|
selector: 'cide-core-user-entity-access',
|
|
@@ -19236,8 +19722,8 @@ class CideCoreUserFamilyDetailsComponent {
|
|
|
19236
19722
|
goBack() {
|
|
19237
19723
|
this.router.navigate(['/admin/user-master']);
|
|
19238
19724
|
}
|
|
19239
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
19240
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.
|
|
19725
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreUserFamilyDetailsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
19726
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.15", type: CideCoreUserFamilyDetailsComponent, isStandalone: true, selector: "cide-core-user-family-details", ngImport: i0, template: `
|
|
19241
19727
|
<div class="p-5">
|
|
19242
19728
|
<div class="bg-white rounded-lg shadow-md mb-5">
|
|
19243
19729
|
<div class="p-5 border-b border-gray-200 flex justify-between items-center">
|
|
@@ -19402,7 +19888,7 @@ class CideCoreUserFamilyDetailsComponent {
|
|
|
19402
19888
|
</div>
|
|
19403
19889
|
`, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: CideFormFieldErrorComponent, selector: "cide-form-field-error", inputs: ["control", "formGroup", "fieldName", "customMessages"] }] });
|
|
19404
19890
|
}
|
|
19405
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
19891
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreUserFamilyDetailsComponent, decorators: [{
|
|
19406
19892
|
type: Component,
|
|
19407
19893
|
args: [{
|
|
19408
19894
|
selector: 'cide-core-user-family-details',
|
|
@@ -19589,7 +20075,6 @@ class CideCoreUserRoleListComponent {
|
|
|
19589
20075
|
rightsService = inject(RightsService);
|
|
19590
20076
|
// Modern ViewChild signals for template renderers (Angular 20 approach)
|
|
19591
20077
|
userRoleDetailsRendererTemplate = viewChild.required('userRoleDetailsRendererTemplate');
|
|
19592
|
-
entityRendererTemplate = viewChild.required('entityRendererTemplate');
|
|
19593
20078
|
statusRendererTemplate = viewChild.required('statusRendererTemplate');
|
|
19594
20079
|
actionsDropdownRendererTemplate = viewChild.required('actionsDropdownRendererTemplate');
|
|
19595
20080
|
// State management using Angular Signals for server-side operations
|
|
@@ -19635,15 +20120,6 @@ class CideCoreUserRoleListComponent {
|
|
|
19635
20120
|
align: 'left',
|
|
19636
20121
|
renderer: 'userRoleDetailsRenderer'
|
|
19637
20122
|
},
|
|
19638
|
-
{
|
|
19639
|
-
key: 'entity',
|
|
19640
|
-
header: 'Entity',
|
|
19641
|
-
type: 'custom',
|
|
19642
|
-
width: '150px',
|
|
19643
|
-
truncate: true,
|
|
19644
|
-
align: 'left',
|
|
19645
|
-
renderer: 'entityRenderer'
|
|
19646
|
-
},
|
|
19647
20123
|
{
|
|
19648
20124
|
key: 'syusrol_isactive',
|
|
19649
20125
|
header: 'Status',
|
|
@@ -19772,7 +20248,6 @@ class CideCoreUserRoleListComponent {
|
|
|
19772
20248
|
// Computed template renderers for grid
|
|
19773
20249
|
templateRenderers = computed(() => ({
|
|
19774
20250
|
userRoleDetailsRenderer: this.userRoleDetailsRendererTemplate(),
|
|
19775
|
-
entityRenderer: this.entityRendererTemplate(),
|
|
19776
20251
|
statusRenderer: this.statusRendererTemplate(),
|
|
19777
20252
|
actionsDropdownRenderer: this.actionsDropdownRendererTemplate()
|
|
19778
20253
|
}), ...(ngDevMode ? [{ debugName: "templateRenderers" }] : []));
|
|
@@ -20039,10 +20514,10 @@ class CideCoreUserRoleListComponent {
|
|
|
20039
20514
|
}
|
|
20040
20515
|
return entity || 'N/A';
|
|
20041
20516
|
}
|
|
20042
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
20043
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.
|
|
20517
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreUserRoleListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
20518
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: CideCoreUserRoleListComponent, isStandalone: true, selector: "cide-core-user-role-list", viewQueries: [{ propertyName: "userRoleDetailsRendererTemplate", first: true, predicate: ["userRoleDetailsRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "statusRendererTemplate", first: true, predicate: ["statusRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "actionsDropdownRendererTemplate", first: true, predicate: ["actionsDropdownRendererTemplate"], descendants: true, isSignal: true }], ngImport: i0, template: "<!-- User Role List with Shared Wrapper -->\n<cide-lyt-shared-wrapper [shared_wrapper_setup_param]=\"{ sypg_page_code: 'core_user_role' }\">\n <div class=\"tw-table tw-w-full tw-h-full\">\n\n <!-- Header Section with Filters -->\n <div class=\"tw-table-row tw-h-0\">\n <div class=\"tw-table-cell tw-px-6 tw-py-3 tw-border-b tw-border-gray-200 tw-bg-gray-50\">\n <div\n class=\"tw-flex tw-flex-col sm:tw-flex-row tw-justify-between tw-items-start sm:tw-items-center tw-space-y-3 sm:tw-space-y-0\">\n\n <!-- Title -->\n <div class=\"tw-flex tw-items-center tw-space-x-2\">\n <cide-ele-icon class=\"tw-text-blue-600 tw-w-5 tw-h-5\">admin_panel_settings</cide-ele-icon>\n <h5 class=\"tw-text-base tw-font-medium tw-text-gray-900 tw-m-0\">User Role Management</h5>\n </div>\n\n <!-- Actions -->\n <div\n class=\"tw-flex tw-flex-col sm:tw-flex-row tw-items-start sm:tw-items-center tw-space-y-3 sm:tw-space-y-0 sm:tw-space-x-3\">\n <button cideEleButton variant=\"primary\" size=\"md\" leftIcon=\"add\" (click)=\"createUserRole()\">\n Create User Role\n </button>\n </div>\n </div>\n\n <!-- Error Message -->\n @if (error()) {\n <div class=\"tw-mt-4 tw-p-4 tw-bg-red-50 tw-border tw-border-red-200 tw-rounded-md\">\n <div class=\"tw-flex tw-items-start\">\n <cide-ele-icon name=\"error\"\n class=\"tw-text-red-400 tw-w-5 tw-h-5 tw-mt-0.5 tw-flex-shrink-0\"></cide-ele-icon>\n <div class=\"tw-ml-3\">\n <h3 class=\"tw-text-sm tw-font-medium tw-text-red-800 tw-m-0\">Error</h3>\n <p class=\"tw-text-sm tw-text-red-700 tw-mt-1 tw-m-0\">{{ error() }}</p>\n </div>\n </div>\n </div>\n }\n </div>\n </div>\n\n <!-- Main Content Area -->\n <div class=\"tw-table-row\">\n <div class=\"tw-table-cell tw-h-full tw-relative\">\n\n <!-- Data Grid Component -->\n <div class=\"tw-h-full tw-overflow-auto\">\n <cide-ele-data-grid [config]=\"gridConfig()\" [templateRenderers]=\"templateRenderers()\"\n (gridEvent)=\"onGridEvent($event)\">\n </cide-ele-data-grid>\n </div>\n\n </div>\n </div>\n\n </div>\n\n <!-- Template Renderers -->\n <ng-template #userRoleDetailsRendererTemplate let-row=\"row\">\n <div class=\"tw-flex tw-flex-col tw-w-full\">\n <div class=\"tw-font-medium tw-text-gray-900\">{{ row.syusrol_role_name || 'N/A' }}</div>\n <div class=\"tw-text-sm tw-text-gray-500 tw-truncate\">{{ row.syusrol_role_description || 'No description' }}</div>\n </div>\n </ng-template>\n\n <ng-template #statusRendererTemplate let-row=\"row\">\n <div class=\"tw-flex tw-items-center tw-justify-center\">\n <!-- Active/Inactive Status Badge -->\n <span\n class=\"tw-inline-flex tw-items-center tw-justify-center tw-px-2.5 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium tw-text-center\"\n [ngClass]=\"getStatusBadgeClass(row)\">\n <cide-ele-icon size=\"2xs\" class=\"tw-mr-1\">\n {{ row.syusrol_isactive ? 'check_circle' : 'cancel' }}\n </cide-ele-icon>\n {{ getStatusText(row) }}\n </span>\n </div>\n </ng-template>\n\n <ng-template #actionsDropdownRendererTemplate let-row=\"row\">\n <cide-ele-dropdown [items]=\"getActionDropdownItems(row)\" [config]=\"{ triggerIcon: 'more_vert', triggerSize: 'sm' }\"\n (itemClick)=\"onDropdownItemClick($event, row)\">\n </cide-ele-dropdown>\n </ng-template>\n</cide-lyt-shared-wrapper>", styles: [".user-role-listing-container{@apply tw-w-full tw-h-full;}:host{@apply tw-w-full tw-h-full tw-flex tw-flex-col;}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "component", type: CideIconComponent, selector: "cide-ele-icon", inputs: ["size", "type", "toolTip"] }, { kind: "component", type: CideEleButtonComponent, selector: "button[cideEleButton], a[cideEleButton], cide-ele-button", inputs: ["label", "variant", "size", "type", "shape", "elevation", "disabled", "id", "loading", "fullWidth", "leftIcon", "rightIcon", "customClass", "tooltip", "ariaLabel", "testId", "routerLink", "routerExtras", "preventDoubleClick", "animated"], outputs: ["btnClick", "doubleClick"] }, { kind: "component", type: CideEleDataGridComponent, selector: "cide-ele-data-grid", inputs: ["config", "templateRenderers", "customFormatters", "actionHandlers", "serverSidePagination", "totalServerItems", "currentServerPage", "currentServerPageSize", "dragDropEnabled"], outputs: ["gridEvent"] }, { kind: "component", type: CideEleDropdownComponent, selector: "cide-ele-dropdown", inputs: ["items", "config", "triggerTemplate", "menuTemplate"], outputs: ["itemClick", "dropdownToggle"] }, { kind: "component", type: CideLytSharedWrapperComponent, selector: "cide-lyt-shared-wrapper", inputs: ["shared_wrapper_setup_param", "breadcrumb_data"] }] });
|
|
20044
20519
|
}
|
|
20045
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
20520
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreUserRoleListComponent, decorators: [{
|
|
20046
20521
|
type: Component,
|
|
20047
20522
|
args: [{ selector: 'cide-core-user-role-list', standalone: true, imports: [
|
|
20048
20523
|
CommonModule,
|
|
@@ -20052,14 +20527,444 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImpor
|
|
|
20052
20527
|
CideEleDataGridComponent,
|
|
20053
20528
|
CideEleDropdownComponent,
|
|
20054
20529
|
CideLytSharedWrapperComponent
|
|
20055
|
-
], template: "<!-- User Role List with Shared Wrapper -->\
|
|
20056
|
-
}] });
|
|
20530
|
+
], template: "<!-- User Role List with Shared Wrapper -->\n<cide-lyt-shared-wrapper [shared_wrapper_setup_param]=\"{ sypg_page_code: 'core_user_role' }\">\n <div class=\"tw-table tw-w-full tw-h-full\">\n\n <!-- Header Section with Filters -->\n <div class=\"tw-table-row tw-h-0\">\n <div class=\"tw-table-cell tw-px-6 tw-py-3 tw-border-b tw-border-gray-200 tw-bg-gray-50\">\n <div\n class=\"tw-flex tw-flex-col sm:tw-flex-row tw-justify-between tw-items-start sm:tw-items-center tw-space-y-3 sm:tw-space-y-0\">\n\n <!-- Title -->\n <div class=\"tw-flex tw-items-center tw-space-x-2\">\n <cide-ele-icon class=\"tw-text-blue-600 tw-w-5 tw-h-5\">admin_panel_settings</cide-ele-icon>\n <h5 class=\"tw-text-base tw-font-medium tw-text-gray-900 tw-m-0\">User Role Management</h5>\n </div>\n\n <!-- Actions -->\n <div\n class=\"tw-flex tw-flex-col sm:tw-flex-row tw-items-start sm:tw-items-center tw-space-y-3 sm:tw-space-y-0 sm:tw-space-x-3\">\n <button cideEleButton variant=\"primary\" size=\"md\" leftIcon=\"add\" (click)=\"createUserRole()\">\n Create User Role\n </button>\n </div>\n </div>\n\n <!-- Error Message -->\n @if (error()) {\n <div class=\"tw-mt-4 tw-p-4 tw-bg-red-50 tw-border tw-border-red-200 tw-rounded-md\">\n <div class=\"tw-flex tw-items-start\">\n <cide-ele-icon name=\"error\"\n class=\"tw-text-red-400 tw-w-5 tw-h-5 tw-mt-0.5 tw-flex-shrink-0\"></cide-ele-icon>\n <div class=\"tw-ml-3\">\n <h3 class=\"tw-text-sm tw-font-medium tw-text-red-800 tw-m-0\">Error</h3>\n <p class=\"tw-text-sm tw-text-red-700 tw-mt-1 tw-m-0\">{{ error() }}</p>\n </div>\n </div>\n </div>\n }\n </div>\n </div>\n\n <!-- Main Content Area -->\n <div class=\"tw-table-row\">\n <div class=\"tw-table-cell tw-h-full tw-relative\">\n\n <!-- Data Grid Component -->\n <div class=\"tw-h-full tw-overflow-auto\">\n <cide-ele-data-grid [config]=\"gridConfig()\" [templateRenderers]=\"templateRenderers()\"\n (gridEvent)=\"onGridEvent($event)\">\n </cide-ele-data-grid>\n </div>\n\n </div>\n </div>\n\n </div>\n\n <!-- Template Renderers -->\n <ng-template #userRoleDetailsRendererTemplate let-row=\"row\">\n <div class=\"tw-flex tw-flex-col tw-w-full\">\n <div class=\"tw-font-medium tw-text-gray-900\">{{ row.syusrol_role_name || 'N/A' }}</div>\n <div class=\"tw-text-sm tw-text-gray-500 tw-truncate\">{{ row.syusrol_role_description || 'No description' }}</div>\n </div>\n </ng-template>\n\n <ng-template #statusRendererTemplate let-row=\"row\">\n <div class=\"tw-flex tw-items-center tw-justify-center\">\n <!-- Active/Inactive Status Badge -->\n <span\n class=\"tw-inline-flex tw-items-center tw-justify-center tw-px-2.5 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium tw-text-center\"\n [ngClass]=\"getStatusBadgeClass(row)\">\n <cide-ele-icon size=\"2xs\" class=\"tw-mr-1\">\n {{ row.syusrol_isactive ? 'check_circle' : 'cancel' }}\n </cide-ele-icon>\n {{ getStatusText(row) }}\n </span>\n </div>\n </ng-template>\n\n <ng-template #actionsDropdownRendererTemplate let-row=\"row\">\n <cide-ele-dropdown [items]=\"getActionDropdownItems(row)\" [config]=\"{ triggerIcon: 'more_vert', triggerSize: 'sm' }\"\n (itemClick)=\"onDropdownItemClick($event, row)\">\n </cide-ele-dropdown>\n </ng-template>\n</cide-lyt-shared-wrapper>", styles: [".user-role-listing-container{@apply tw-w-full tw-h-full;}:host{@apply tw-w-full tw-h-full tw-flex tw-flex-col;}\n"] }]
|
|
20531
|
+
}], propDecorators: { userRoleDetailsRendererTemplate: [{ type: i0.ViewChild, args: ['userRoleDetailsRendererTemplate', { isSignal: true }] }], statusRendererTemplate: [{ type: i0.ViewChild, args: ['statusRendererTemplate', { isSignal: true }] }], actionsDropdownRendererTemplate: [{ type: i0.ViewChild, args: ['actionsDropdownRendererTemplate', { isSignal: true }] }] } });
|
|
20057
20532
|
|
|
20058
20533
|
var userRoleList_component = /*#__PURE__*/Object.freeze({
|
|
20059
20534
|
__proto__: null,
|
|
20060
20535
|
CideCoreUserRoleListComponent: CideCoreUserRoleListComponent
|
|
20061
20536
|
});
|
|
20062
20537
|
|
|
20538
|
+
class CopyRoleDrawerComponent {
|
|
20539
|
+
floatingContainerService = inject(CideEleFloatingContainerService);
|
|
20540
|
+
userRoleService = inject(CideCoreUserRoleService);
|
|
20541
|
+
entityService = inject(ENTITY_SERVICE_TOKEN);
|
|
20542
|
+
destroyRef = takeUntilDestroyed();
|
|
20543
|
+
// Outputs
|
|
20544
|
+
roleSelect = output();
|
|
20545
|
+
cancel = output();
|
|
20546
|
+
// Signals
|
|
20547
|
+
flattenedEntities = signal([], ...(ngDevMode ? [{ debugName: "flattenedEntities" }] : []));
|
|
20548
|
+
selectedEntityId = signal('', ...(ngDevMode ? [{ debugName: "selectedEntityId" }] : []));
|
|
20549
|
+
selectedRoleId = signal('', ...(ngDevMode ? [{ debugName: "selectedRoleId" }] : []));
|
|
20550
|
+
availableRoles = signal([], ...(ngDevMode ? [{ debugName: "availableRoles" }] : []));
|
|
20551
|
+
rolePreview = signal(null, ...(ngDevMode ? [{ debugName: "rolePreview" }] : []));
|
|
20552
|
+
loading = signal(false, ...(ngDevMode ? [{ debugName: "loading" }] : []));
|
|
20553
|
+
entitiesLoadAttempted = signal(false, ...(ngDevMode ? [{ debugName: "entitiesLoadAttempted" }] : []));
|
|
20554
|
+
constructor() {
|
|
20555
|
+
console.log('🏗️ [CopyRoleDrawer] Constructor called');
|
|
20556
|
+
console.log('🏗️ [CopyRoleDrawer] EntityService available:', !!this.entityService);
|
|
20557
|
+
}
|
|
20558
|
+
ngOnInit() {
|
|
20559
|
+
console.log('🔄 [CopyRoleDrawer] ngOnInit called, loading entities...');
|
|
20560
|
+
// Defer loading to avoid ExpressionChangedAfterItHasBeenCheckedError
|
|
20561
|
+
setTimeout(() => this.loadEntitiesIfNeeded(), 0);
|
|
20562
|
+
}
|
|
20563
|
+
ngAfterViewInit() {
|
|
20564
|
+
console.log('🔄 [CopyRoleDrawer] ngAfterViewInit called');
|
|
20565
|
+
// Try loading again if it wasn't loaded in ngOnInit
|
|
20566
|
+
setTimeout(() => this.loadEntitiesIfNeeded(), 0);
|
|
20567
|
+
}
|
|
20568
|
+
loadEntitiesIfNeeded() {
|
|
20569
|
+
if (!this.entitiesLoadAttempted()) {
|
|
20570
|
+
this.entitiesLoadAttempted.set(true);
|
|
20571
|
+
this.loadEntities();
|
|
20572
|
+
}
|
|
20573
|
+
}
|
|
20574
|
+
loadEntities() {
|
|
20575
|
+
console.log('📞 [CopyRoleDrawer] Calling entityService.getEntityList()...');
|
|
20576
|
+
this.loading.set(true);
|
|
20577
|
+
if (!this.entityService) {
|
|
20578
|
+
console.error('❌ [CopyRoleDrawer] EntityService is not available!');
|
|
20579
|
+
this.loading.set(false);
|
|
20580
|
+
return;
|
|
20581
|
+
}
|
|
20582
|
+
this.entityService.getEntityList({})
|
|
20583
|
+
.pipe(this.destroyRef)
|
|
20584
|
+
.subscribe({
|
|
20585
|
+
next: (response) => {
|
|
20586
|
+
console.log('✅ [CopyRoleDrawer] Entity list response received:', response);
|
|
20587
|
+
const typedResponse = response;
|
|
20588
|
+
if (typedResponse?.success && typedResponse?.data) {
|
|
20589
|
+
console.log(`✅ [CopyRoleDrawer] Processing ${typedResponse.data.length} entities`);
|
|
20590
|
+
const hierarchical = this.buildEntityHierarchy(typedResponse.data);
|
|
20591
|
+
console.log('✅ [CopyRoleDrawer] Hierarchical entities:', hierarchical);
|
|
20592
|
+
const flattened = this.flattenEntitiesForDropdown(hierarchical);
|
|
20593
|
+
console.log(`✅ [CopyRoleDrawer] Flattened ${flattened.length} entities for dropdown:`, flattened);
|
|
20594
|
+
this.flattenedEntities.set(flattened);
|
|
20595
|
+
console.log('✅ [CopyRoleDrawer] Signal updated. Current value:', this.flattenedEntities());
|
|
20596
|
+
}
|
|
20597
|
+
else {
|
|
20598
|
+
console.warn('⚠️ [CopyRoleDrawer] Invalid response structure:', typedResponse);
|
|
20599
|
+
}
|
|
20600
|
+
this.loading.set(false);
|
|
20601
|
+
},
|
|
20602
|
+
error: (error) => {
|
|
20603
|
+
console.error('❌ [CopyRoleDrawer] Error loading entities:', error);
|
|
20604
|
+
this.loading.set(false);
|
|
20605
|
+
}
|
|
20606
|
+
});
|
|
20607
|
+
}
|
|
20608
|
+
buildEntityHierarchy(entities) {
|
|
20609
|
+
const nodeMap = new Map();
|
|
20610
|
+
const rootNodes = [];
|
|
20611
|
+
entities.forEach(entity => {
|
|
20612
|
+
const node = { ...entity, children: [] };
|
|
20613
|
+
nodeMap.set(entity._id || '', node);
|
|
20614
|
+
});
|
|
20615
|
+
entities.forEach(entity => {
|
|
20616
|
+
const node = nodeMap.get(entity._id || '');
|
|
20617
|
+
if (node) {
|
|
20618
|
+
const parentId = entity.syen_id_syen;
|
|
20619
|
+
if (parentId && parentId !== "" && nodeMap.has(parentId)) {
|
|
20620
|
+
const parent = nodeMap.get(parentId);
|
|
20621
|
+
parent.children = parent.children || [];
|
|
20622
|
+
parent.children.push(node);
|
|
20623
|
+
}
|
|
20624
|
+
else {
|
|
20625
|
+
rootNodes.push(node);
|
|
20626
|
+
}
|
|
20627
|
+
}
|
|
20628
|
+
});
|
|
20629
|
+
return rootNodes;
|
|
20630
|
+
}
|
|
20631
|
+
flattenEntitiesForDropdown(entities, level = 0) {
|
|
20632
|
+
const result = [];
|
|
20633
|
+
entities.forEach(entity => {
|
|
20634
|
+
const indent = '\u00A0\u00A0\u00A0'.repeat(level);
|
|
20635
|
+
const prefix = level > 0 ? '└─ ' : '';
|
|
20636
|
+
const displayName = `${indent}${prefix}${entity.syen_name || 'Unnamed Entity'}`;
|
|
20637
|
+
result.push({ _id: entity._id || '', displayName, entity });
|
|
20638
|
+
if (entity.children && entity.children.length > 0) {
|
|
20639
|
+
const childrenFlattened = this.flattenEntitiesForDropdown(entity.children, level + 1);
|
|
20640
|
+
result.push(...childrenFlattened);
|
|
20641
|
+
}
|
|
20642
|
+
});
|
|
20643
|
+
return result;
|
|
20644
|
+
}
|
|
20645
|
+
onEntityChange(entityIdValue) {
|
|
20646
|
+
// Convert entityId to string
|
|
20647
|
+
const entityId = String(entityIdValue);
|
|
20648
|
+
this.selectedRoleId.set('');
|
|
20649
|
+
this.rolePreview.set(null);
|
|
20650
|
+
this.availableRoles.set([]);
|
|
20651
|
+
if (entityId) {
|
|
20652
|
+
this.loadRolesForEntity(entityId);
|
|
20653
|
+
}
|
|
20654
|
+
}
|
|
20655
|
+
loadRolesForEntity(entityId) {
|
|
20656
|
+
console.log('📞 [CopyRoleDrawer] Loading roles for entity:', entityId);
|
|
20657
|
+
this.loading.set(true);
|
|
20658
|
+
this.userRoleService.getRolesByEntity(entityId)
|
|
20659
|
+
.pipe(this.destroyRef)
|
|
20660
|
+
.subscribe({
|
|
20661
|
+
next: (response) => {
|
|
20662
|
+
console.log('✅ [CopyRoleDrawer] Roles response received:', response);
|
|
20663
|
+
const typedResponse = response;
|
|
20664
|
+
if (typedResponse?.success && typedResponse.data) {
|
|
20665
|
+
console.log(`✅ [CopyRoleDrawer] Loaded ${typedResponse.data.length} roles`);
|
|
20666
|
+
this.availableRoles.set(typedResponse.data);
|
|
20667
|
+
}
|
|
20668
|
+
else {
|
|
20669
|
+
console.warn('⚠️ [CopyRoleDrawer] Invalid roles response:', typedResponse);
|
|
20670
|
+
}
|
|
20671
|
+
this.loading.set(false);
|
|
20672
|
+
},
|
|
20673
|
+
error: (error) => {
|
|
20674
|
+
console.error('❌ [CopyRoleDrawer] Error loading roles:', error);
|
|
20675
|
+
this.loading.set(false);
|
|
20676
|
+
}
|
|
20677
|
+
});
|
|
20678
|
+
}
|
|
20679
|
+
onRoleChange(roleIdValue) {
|
|
20680
|
+
// Convert roleId to string
|
|
20681
|
+
const roleId = String(roleIdValue);
|
|
20682
|
+
this.rolePreview.set(null);
|
|
20683
|
+
if (roleId) {
|
|
20684
|
+
this.loadRolePreview(roleId);
|
|
20685
|
+
}
|
|
20686
|
+
}
|
|
20687
|
+
loadRolePreview(roleId) {
|
|
20688
|
+
console.log('📞 [CopyRoleDrawer] Loading role preview for:', roleId);
|
|
20689
|
+
this.loading.set(true);
|
|
20690
|
+
this.userRoleService.getUserRoleById({ syusrol_id: roleId })
|
|
20691
|
+
.pipe(this.destroyRef)
|
|
20692
|
+
.subscribe({
|
|
20693
|
+
next: (response) => {
|
|
20694
|
+
console.log('✅ [CopyRoleDrawer] Role preview response received:', response);
|
|
20695
|
+
const typedResponse = response;
|
|
20696
|
+
if (typedResponse?.success && typedResponse.data) {
|
|
20697
|
+
console.log('✅ [CopyRoleDrawer] Role preview loaded');
|
|
20698
|
+
this.rolePreview.set(typedResponse.data);
|
|
20699
|
+
}
|
|
20700
|
+
else {
|
|
20701
|
+
console.warn('⚠️ [CopyRoleDrawer] Invalid role preview response:', typedResponse);
|
|
20702
|
+
}
|
|
20703
|
+
this.loading.set(false);
|
|
20704
|
+
},
|
|
20705
|
+
error: (error) => {
|
|
20706
|
+
console.error('❌ [CopyRoleDrawer] Error loading role preview:', error);
|
|
20707
|
+
this.loading.set(false);
|
|
20708
|
+
}
|
|
20709
|
+
});
|
|
20710
|
+
}
|
|
20711
|
+
onApply() {
|
|
20712
|
+
const preview = this.rolePreview();
|
|
20713
|
+
if (preview) {
|
|
20714
|
+
this.roleSelect.emit(preview);
|
|
20715
|
+
this.floatingContainerService.hide('copy-role-drawer');
|
|
20716
|
+
}
|
|
20717
|
+
}
|
|
20718
|
+
onCancel() {
|
|
20719
|
+
this.cancel.emit();
|
|
20720
|
+
this.floatingContainerService.hide('copy-role-drawer');
|
|
20721
|
+
}
|
|
20722
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CopyRoleDrawerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
20723
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: CopyRoleDrawerComponent, isStandalone: true, selector: "cide-copy-role-drawer", outputs: { roleSelect: "roleSelect", cancel: "cancel" }, ngImport: i0, template: `
|
|
20724
|
+
<div class="tw-flex tw-flex-col tw-h-full">
|
|
20725
|
+
<!-- Header Description -->
|
|
20726
|
+
<div class="tw-px-3 tw-py-2 tw-bg-blue-50 dark:tw-bg-blue-900/20 tw-border-b tw-border-blue-200 dark:tw-border-blue-700">
|
|
20727
|
+
<p class="tw-text-xs tw-text-blue-700 dark:tw-text-blue-300 tw-m-0">
|
|
20728
|
+
Select an entity and role to copy all permissions to the current role.
|
|
20729
|
+
</p>
|
|
20730
|
+
</div>
|
|
20731
|
+
|
|
20732
|
+
<!-- Content -->
|
|
20733
|
+
<div class="tw-flex-1 tw-overflow-y-auto tw-p-3 tw-space-y-4">
|
|
20734
|
+
<!-- Entity Selection -->
|
|
20735
|
+
<div>
|
|
20736
|
+
<label class="tw-block tw-text-sm tw-font-medium tw-text-gray-700 dark:tw-text-gray-300 tw-mb-2">
|
|
20737
|
+
Select Entity
|
|
20738
|
+
</label>
|
|
20739
|
+
<cide-ele-select
|
|
20740
|
+
id="copy_entity_select"
|
|
20741
|
+
[ngModel]="selectedEntityId()"
|
|
20742
|
+
(ngModelChange)="onEntityChange($event)"
|
|
20743
|
+
size="md">
|
|
20744
|
+
<option value="">Select an entity...</option>
|
|
20745
|
+
@for (entity of flattenedEntities(); track entity._id) {
|
|
20746
|
+
<option [value]="entity._id">{{ entity.displayName }}</option>
|
|
20747
|
+
}
|
|
20748
|
+
</cide-ele-select>
|
|
20749
|
+
<!-- Debug info -->
|
|
20750
|
+
<div class="tw-text-xs tw-text-gray-500 tw-mt-1">
|
|
20751
|
+
Debug: {{ flattenedEntities().length }} entities loaded
|
|
20752
|
+
</div>
|
|
20753
|
+
</div>
|
|
20754
|
+
|
|
20755
|
+
<!-- Role Selection -->
|
|
20756
|
+
@if (selectedEntityId() && availableRoles().length > 0) {
|
|
20757
|
+
<div>
|
|
20758
|
+
<label class="tw-block tw-text-sm tw-font-medium tw-text-gray-700 dark:tw-text-gray-300 tw-mb-2">
|
|
20759
|
+
Select Role to Copy
|
|
20760
|
+
</label>
|
|
20761
|
+
<cide-ele-select
|
|
20762
|
+
id="copy_role_select"
|
|
20763
|
+
[ngModel]="selectedRoleId()"
|
|
20764
|
+
(ngModelChange)="onRoleChange($event)"
|
|
20765
|
+
size="md">
|
|
20766
|
+
<option value="">Select a role...</option>
|
|
20767
|
+
@for (role of availableRoles(); track role._id) {
|
|
20768
|
+
<option [value]="role._id">{{ role.syusrol_role_name }}</option>
|
|
20769
|
+
}
|
|
20770
|
+
</cide-ele-select>
|
|
20771
|
+
</div>
|
|
20772
|
+
}
|
|
20773
|
+
|
|
20774
|
+
<!-- Role Preview -->
|
|
20775
|
+
@if (rolePreview()) {
|
|
20776
|
+
<div class="tw-bg-blue-50 dark:tw-bg-blue-900/20 tw-border tw-border-blue-200 dark:tw-border-blue-700 tw-rounded-md tw-p-3">
|
|
20777
|
+
<div class="tw-flex tw-items-start tw-gap-2 tw-mb-2">
|
|
20778
|
+
<cide-ele-icon variant="blue" size="sm" class="tw-flex-shrink-0 tw-mt-0.5">info</cide-ele-icon>
|
|
20779
|
+
<div class="tw-flex-1 tw-min-w-0">
|
|
20780
|
+
<div class="tw-font-semibold tw-text-gray-900 dark:tw-text-gray-100 tw-text-sm tw-mb-1">
|
|
20781
|
+
{{ rolePreview()?.core_user_role?.syusrol_role_name }}
|
|
20782
|
+
</div>
|
|
20783
|
+
<div class="tw-text-xs tw-text-gray-600 dark:tw-text-gray-400 tw-mb-2">
|
|
20784
|
+
{{ rolePreview()?.core_user_role?.syusrol_role_description }}
|
|
20785
|
+
</div>
|
|
20786
|
+
<div class="tw-flex tw-items-center tw-gap-2 tw-flex-wrap">
|
|
20787
|
+
<span class="tw-inline-flex tw-items-center tw-px-2 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium tw-bg-blue-100 dark:tw-bg-blue-800 tw-text-blue-800 dark:tw-text-blue-200">
|
|
20788
|
+
{{ rolePreview()?.core_user_role_rights?.length || 0 }} permissions
|
|
20789
|
+
</span>
|
|
20790
|
+
<span class="tw-inline-flex tw-items-center tw-px-2 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium"
|
|
20791
|
+
[class]="rolePreview()?.core_user_role?.syusrol_isactive
|
|
20792
|
+
? 'tw-bg-green-100 dark:tw-bg-green-800 tw-text-green-800 dark:tw-text-green-200'
|
|
20793
|
+
: 'tw-bg-red-100 dark:tw-bg-red-800 tw-text-red-800 dark:tw-text-red-200'">
|
|
20794
|
+
{{ rolePreview()?.core_user_role?.syusrol_isactive ? 'Active' : 'Inactive' }}
|
|
20795
|
+
</span>
|
|
20796
|
+
</div>
|
|
20797
|
+
</div>
|
|
20798
|
+
</div>
|
|
20799
|
+
</div>
|
|
20800
|
+
}
|
|
20801
|
+
|
|
20802
|
+
<!-- Loading State -->
|
|
20803
|
+
@if (loading()) {
|
|
20804
|
+
<div class="tw-text-center tw-py-4">
|
|
20805
|
+
<div class="tw-inline-block tw-animate-spin tw-w-6 tw-h-6 tw-border-2 tw-border-blue-600 tw-border-t-transparent tw-rounded-full"></div>
|
|
20806
|
+
<p class="tw-text-sm tw-text-gray-600 dark:tw-text-gray-400 tw-mt-2">Loading...</p>
|
|
20807
|
+
</div>
|
|
20808
|
+
}
|
|
20809
|
+
|
|
20810
|
+
<!-- No Roles Message -->
|
|
20811
|
+
@if (selectedEntityId() && !loading() && availableRoles().length === 0) {
|
|
20812
|
+
<div class="tw-text-center tw-py-6 tw-text-gray-500 dark:tw-text-gray-400">
|
|
20813
|
+
<cide-ele-icon variant="gray" size="lg" class="tw-mb-2">info</cide-ele-icon>
|
|
20814
|
+
<p class="tw-text-sm tw-font-medium tw-mb-1">No Roles Available</p>
|
|
20815
|
+
<p class="tw-text-xs">This entity has no roles to copy from.</p>
|
|
20816
|
+
</div>
|
|
20817
|
+
}
|
|
20818
|
+
</div>
|
|
20819
|
+
|
|
20820
|
+
<!-- Footer -->
|
|
20821
|
+
<div class="tw-border-t tw-border-gray-200 dark:tw-border-gray-700 tw-px-3 tw-py-2 tw-flex tw-justify-end tw-gap-2 tw-flex-shrink-0 tw-bg-white dark:tw-bg-gray-800">
|
|
20822
|
+
<button
|
|
20823
|
+
cideEleButton
|
|
20824
|
+
variant="secondary"
|
|
20825
|
+
size="xs"
|
|
20826
|
+
type="button"
|
|
20827
|
+
(click)="onCancel()">
|
|
20828
|
+
Cancel
|
|
20829
|
+
</button>
|
|
20830
|
+
<button
|
|
20831
|
+
cideEleButton
|
|
20832
|
+
variant="primary"
|
|
20833
|
+
size="xs"
|
|
20834
|
+
type="button"
|
|
20835
|
+
leftIcon="content_copy"
|
|
20836
|
+
[disabled]="!rolePreview()"
|
|
20837
|
+
(click)="onApply()">
|
|
20838
|
+
Apply Copy
|
|
20839
|
+
</button>
|
|
20840
|
+
</div>
|
|
20841
|
+
</div>
|
|
20842
|
+
`, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: CideEleButtonComponent, selector: "button[cideEleButton], a[cideEleButton], cide-ele-button", inputs: ["label", "variant", "size", "type", "shape", "elevation", "disabled", "id", "loading", "fullWidth", "leftIcon", "rightIcon", "customClass", "tooltip", "ariaLabel", "testId", "routerLink", "routerExtras", "preventDoubleClick", "animated"], outputs: ["btnClick", "doubleClick"] }, { kind: "component", type: CideIconComponent, selector: "cide-ele-icon", inputs: ["size", "type", "toolTip"] }, { kind: "component", type: CideSelectComponent, selector: "cide-ele-select", inputs: ["label", "labelHide", "placeholder", "helperText", "errorText", "required", "disabled", "id", "ngModel", "size", "fill", "labelPlacement", "labelDir", "leadingIcon", "trailingIcon", "clearInput", "options", "multiple", "searchable", "showSearchInput", "loading", "valueKey", "labelKey", "treeView"], outputs: ["ngModelChange", "change", "searchChange"] }] });
|
|
20843
|
+
}
|
|
20844
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CopyRoleDrawerComponent, decorators: [{
|
|
20845
|
+
type: Component,
|
|
20846
|
+
args: [{ selector: 'cide-copy-role-drawer', standalone: true, imports: [CommonModule, FormsModule, CideEleButtonComponent, CideIconComponent, CideSelectComponent], template: `
|
|
20847
|
+
<div class="tw-flex tw-flex-col tw-h-full">
|
|
20848
|
+
<!-- Header Description -->
|
|
20849
|
+
<div class="tw-px-3 tw-py-2 tw-bg-blue-50 dark:tw-bg-blue-900/20 tw-border-b tw-border-blue-200 dark:tw-border-blue-700">
|
|
20850
|
+
<p class="tw-text-xs tw-text-blue-700 dark:tw-text-blue-300 tw-m-0">
|
|
20851
|
+
Select an entity and role to copy all permissions to the current role.
|
|
20852
|
+
</p>
|
|
20853
|
+
</div>
|
|
20854
|
+
|
|
20855
|
+
<!-- Content -->
|
|
20856
|
+
<div class="tw-flex-1 tw-overflow-y-auto tw-p-3 tw-space-y-4">
|
|
20857
|
+
<!-- Entity Selection -->
|
|
20858
|
+
<div>
|
|
20859
|
+
<label class="tw-block tw-text-sm tw-font-medium tw-text-gray-700 dark:tw-text-gray-300 tw-mb-2">
|
|
20860
|
+
Select Entity
|
|
20861
|
+
</label>
|
|
20862
|
+
<cide-ele-select
|
|
20863
|
+
id="copy_entity_select"
|
|
20864
|
+
[ngModel]="selectedEntityId()"
|
|
20865
|
+
(ngModelChange)="onEntityChange($event)"
|
|
20866
|
+
size="md">
|
|
20867
|
+
<option value="">Select an entity...</option>
|
|
20868
|
+
@for (entity of flattenedEntities(); track entity._id) {
|
|
20869
|
+
<option [value]="entity._id">{{ entity.displayName }}</option>
|
|
20870
|
+
}
|
|
20871
|
+
</cide-ele-select>
|
|
20872
|
+
<!-- Debug info -->
|
|
20873
|
+
<div class="tw-text-xs tw-text-gray-500 tw-mt-1">
|
|
20874
|
+
Debug: {{ flattenedEntities().length }} entities loaded
|
|
20875
|
+
</div>
|
|
20876
|
+
</div>
|
|
20877
|
+
|
|
20878
|
+
<!-- Role Selection -->
|
|
20879
|
+
@if (selectedEntityId() && availableRoles().length > 0) {
|
|
20880
|
+
<div>
|
|
20881
|
+
<label class="tw-block tw-text-sm tw-font-medium tw-text-gray-700 dark:tw-text-gray-300 tw-mb-2">
|
|
20882
|
+
Select Role to Copy
|
|
20883
|
+
</label>
|
|
20884
|
+
<cide-ele-select
|
|
20885
|
+
id="copy_role_select"
|
|
20886
|
+
[ngModel]="selectedRoleId()"
|
|
20887
|
+
(ngModelChange)="onRoleChange($event)"
|
|
20888
|
+
size="md">
|
|
20889
|
+
<option value="">Select a role...</option>
|
|
20890
|
+
@for (role of availableRoles(); track role._id) {
|
|
20891
|
+
<option [value]="role._id">{{ role.syusrol_role_name }}</option>
|
|
20892
|
+
}
|
|
20893
|
+
</cide-ele-select>
|
|
20894
|
+
</div>
|
|
20895
|
+
}
|
|
20896
|
+
|
|
20897
|
+
<!-- Role Preview -->
|
|
20898
|
+
@if (rolePreview()) {
|
|
20899
|
+
<div class="tw-bg-blue-50 dark:tw-bg-blue-900/20 tw-border tw-border-blue-200 dark:tw-border-blue-700 tw-rounded-md tw-p-3">
|
|
20900
|
+
<div class="tw-flex tw-items-start tw-gap-2 tw-mb-2">
|
|
20901
|
+
<cide-ele-icon variant="blue" size="sm" class="tw-flex-shrink-0 tw-mt-0.5">info</cide-ele-icon>
|
|
20902
|
+
<div class="tw-flex-1 tw-min-w-0">
|
|
20903
|
+
<div class="tw-font-semibold tw-text-gray-900 dark:tw-text-gray-100 tw-text-sm tw-mb-1">
|
|
20904
|
+
{{ rolePreview()?.core_user_role?.syusrol_role_name }}
|
|
20905
|
+
</div>
|
|
20906
|
+
<div class="tw-text-xs tw-text-gray-600 dark:tw-text-gray-400 tw-mb-2">
|
|
20907
|
+
{{ rolePreview()?.core_user_role?.syusrol_role_description }}
|
|
20908
|
+
</div>
|
|
20909
|
+
<div class="tw-flex tw-items-center tw-gap-2 tw-flex-wrap">
|
|
20910
|
+
<span class="tw-inline-flex tw-items-center tw-px-2 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium tw-bg-blue-100 dark:tw-bg-blue-800 tw-text-blue-800 dark:tw-text-blue-200">
|
|
20911
|
+
{{ rolePreview()?.core_user_role_rights?.length || 0 }} permissions
|
|
20912
|
+
</span>
|
|
20913
|
+
<span class="tw-inline-flex tw-items-center tw-px-2 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium"
|
|
20914
|
+
[class]="rolePreview()?.core_user_role?.syusrol_isactive
|
|
20915
|
+
? 'tw-bg-green-100 dark:tw-bg-green-800 tw-text-green-800 dark:tw-text-green-200'
|
|
20916
|
+
: 'tw-bg-red-100 dark:tw-bg-red-800 tw-text-red-800 dark:tw-text-red-200'">
|
|
20917
|
+
{{ rolePreview()?.core_user_role?.syusrol_isactive ? 'Active' : 'Inactive' }}
|
|
20918
|
+
</span>
|
|
20919
|
+
</div>
|
|
20920
|
+
</div>
|
|
20921
|
+
</div>
|
|
20922
|
+
</div>
|
|
20923
|
+
}
|
|
20924
|
+
|
|
20925
|
+
<!-- Loading State -->
|
|
20926
|
+
@if (loading()) {
|
|
20927
|
+
<div class="tw-text-center tw-py-4">
|
|
20928
|
+
<div class="tw-inline-block tw-animate-spin tw-w-6 tw-h-6 tw-border-2 tw-border-blue-600 tw-border-t-transparent tw-rounded-full"></div>
|
|
20929
|
+
<p class="tw-text-sm tw-text-gray-600 dark:tw-text-gray-400 tw-mt-2">Loading...</p>
|
|
20930
|
+
</div>
|
|
20931
|
+
}
|
|
20932
|
+
|
|
20933
|
+
<!-- No Roles Message -->
|
|
20934
|
+
@if (selectedEntityId() && !loading() && availableRoles().length === 0) {
|
|
20935
|
+
<div class="tw-text-center tw-py-6 tw-text-gray-500 dark:tw-text-gray-400">
|
|
20936
|
+
<cide-ele-icon variant="gray" size="lg" class="tw-mb-2">info</cide-ele-icon>
|
|
20937
|
+
<p class="tw-text-sm tw-font-medium tw-mb-1">No Roles Available</p>
|
|
20938
|
+
<p class="tw-text-xs">This entity has no roles to copy from.</p>
|
|
20939
|
+
</div>
|
|
20940
|
+
}
|
|
20941
|
+
</div>
|
|
20942
|
+
|
|
20943
|
+
<!-- Footer -->
|
|
20944
|
+
<div class="tw-border-t tw-border-gray-200 dark:tw-border-gray-700 tw-px-3 tw-py-2 tw-flex tw-justify-end tw-gap-2 tw-flex-shrink-0 tw-bg-white dark:tw-bg-gray-800">
|
|
20945
|
+
<button
|
|
20946
|
+
cideEleButton
|
|
20947
|
+
variant="secondary"
|
|
20948
|
+
size="xs"
|
|
20949
|
+
type="button"
|
|
20950
|
+
(click)="onCancel()">
|
|
20951
|
+
Cancel
|
|
20952
|
+
</button>
|
|
20953
|
+
<button
|
|
20954
|
+
cideEleButton
|
|
20955
|
+
variant="primary"
|
|
20956
|
+
size="xs"
|
|
20957
|
+
type="button"
|
|
20958
|
+
leftIcon="content_copy"
|
|
20959
|
+
[disabled]="!rolePreview()"
|
|
20960
|
+
(click)="onApply()">
|
|
20961
|
+
Apply Copy
|
|
20962
|
+
</button>
|
|
20963
|
+
</div>
|
|
20964
|
+
</div>
|
|
20965
|
+
` }]
|
|
20966
|
+
}], ctorParameters: () => [], propDecorators: { roleSelect: [{ type: i0.Output, args: ["roleSelect"] }], cancel: [{ type: i0.Output, args: ["cancel"] }] } });
|
|
20967
|
+
|
|
20063
20968
|
class CideCoreUserRoleFormComponent {
|
|
20064
20969
|
// Dependency injection
|
|
20065
20970
|
destroyRef = inject(DestroyRef);
|
|
@@ -20067,6 +20972,7 @@ class CideCoreUserRoleFormComponent {
|
|
|
20067
20972
|
menuService = inject(MenuManagementService);
|
|
20068
20973
|
generalMasterService = inject(CideCoreGeneralMasterService);
|
|
20069
20974
|
generalMasterTypeService = inject(CideCoreGeneralMasterTypeService);
|
|
20975
|
+
floatingContainerService = inject(CideEleFloatingContainerService);
|
|
20070
20976
|
router = inject(Router);
|
|
20071
20977
|
route = inject(ActivatedRoute);
|
|
20072
20978
|
appState = inject(AppStateHelperService);
|
|
@@ -20951,10 +21857,116 @@ class CideCoreUserRoleFormComponent {
|
|
|
20951
21857
|
console.log('🔍 Change detection triggered after auto-checking parent view rights');
|
|
20952
21858
|
}, 100);
|
|
20953
21859
|
}
|
|
20954
|
-
|
|
20955
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.7", type: CideCoreUserRoleFormComponent, isStandalone: true, selector: "cide-core-user-role-form", viewQueries: [{ propertyName: "menuDetailsRendererTemplate", first: true, predicate: ["menuDetailsRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "permissionsCheckboxRendererTemplate", first: true, predicate: ["permissionsCheckboxRendererTemplate"], descendants: true, isSignal: true }], ngImport: i0, template: "<!-- User Role Form Container -->\n<div class=\"tw-w-full tw-h-full\">\n <form class=\"tw-max-w-7xl tw-mx-auto tw-bg-transparent tw-h-full tw-flex tw-flex-col\" [formGroup]=\"userRoleForm\" [class.tw-opacity-60]=\"loading()\" (ngSubmit)=\"onSubmit()\">\n\n <!-- Error Message -->\n @if (error()) {\n <div class=\"tw-mb-6 tw-p-4 tw-bg-red-50 tw-border tw-border-red-200 tw-rounded-md\">\n <div class=\"tw-flex tw-items-start\">\n <cide-ele-icon name=\"error\" class=\"tw-text-red-400 tw-w-5 tw-h-5 tw-mt-0.5 tw-flex-shrink-0\"></cide-ele-icon>\n <div class=\"tw-ml-3\">\n <h3 class=\"tw-text-sm tw-font-medium tw-text-red-800 tw-m-0\">Error</h3>\n <p class=\"tw-text-sm tw-text-red-700 tw-mt-1 tw-m-0\">{{ error() }}</p>\n </div>\n </div>\n </div>\n }\n <!-- User Role Basic Information Section -->\n <div class=\"tw-py-2 tw-border-b-0 tw-mb-0 tw-p-3\">\n\n <!-- Basic Fields -->\n <div class=\"tw-grid tw-grid-cols-1 xl:tw-grid-cols-2 lg:tw-grid-cols-2 md:tw-grid-cols-1 tw-gap-6 tw-mb-0\">\n <!-- Left Column: Role Name -->\n <div>\n <cide-ele-input \n id=\"syusrol_role_name\" \n label=\"Role Name\" \n formControlName=\"syusrol_role_name\"\n placeholder=\"Enter role name\" \n [maxlength]=\"50\" \n size=\"md\"\n [disabled]=\"isViewMode()\">\n </cide-ele-input>\n </div>\n\n <!-- Right Column: Description -->\n <div>\n <cide-ele-textarea \n id=\"syusrol_role_description\" \n label=\"Description\" \n formControlName=\"syusrol_role_description\"\n placeholder=\"Enter role description\" \n rows=\"3\"\n [maxlength]=\"200\"\n [disabled]=\"isViewMode()\">\n </cide-ele-textarea>\n </div>\n </div>\n\n <!-- Active Status Row -->\n <div class=\"tw-mb-0\">\n <cide-ele-input \n id=\"syusrol_isactive\" \n label=\"Active Status\" \n formControlName=\"syusrol_isactive\"\n type=\"checkbox\" \n size=\"md\"\n [disabled]=\"isViewMode()\">\n </cide-ele-input>\n </div>\n </div>\n\n <!-- Role Rights Section -->\n <div class=\"tw-pt-2 tw-border-b-0 tw-mb-0 tw-flex-1 tw-flex tw-flex-col tw-min-h-0\">\n\n <!-- Role Rights Grid -->\n <div class=\"tw-flex-1 tw-min-h-0 tw-w-full\" style=\"height: 400px; max-height: 900px;\">\n <cide-ele-data-grid \n [config]=\"roleRightsGridConfig()\" \n [templateRenderers]=\"templateRenderers()\"\n (gridEvent)=\"onRoleRightsGridEvent($event)\"\n class=\"tw-h-full tw-w-full\">\n </cide-ele-data-grid>\n </div>\n\n <!-- Role Rights Form (Hidden but functional) -->\n <div [formGroup]=\"roleRightsForm\" class=\"tw-hidden\">\n <div formArrayName=\"roleRights\">\n @for (right of roleRightsArray.controls; track $index; let i = $index) {\n <div [formGroupName]=\"i\">\n <cide-ele-select formControlName=\"syusrgt_menu_id_syme\">\n <option value=\"\">Select Menu</option>\n @for (menu of menus(); track menu._id) {\n <option [value]=\"menu._id\">{{ menu.syme_title }}</option>\n }\n </cide-ele-select>\n <cide-ele-select formControlName=\"syusrgt_role_permissions_id_sygms\">\n <option value=\"\">Select Permission</option>\n @for (permission of permissions(); track permission._id) {\n <option [value]=\"permission._id\">{{ permission.sygms_name }}</option>\n }\n </cide-ele-select>\n <cide-ele-input formControlName=\"syusrgt_isactive\" type=\"checkbox\"></cide-ele-input>\n </div>\n }\n </div>\n </div>\n </div>\n\n <!-- Form Actions -->\n <div class=\"tw-flex tw-justify-between tw-items-center tw-p-3 tw-gap-4 tw-py-2 tw-bg-white tw-border-t tw-border-gray-200 tw-sticky tw-bottom-0 tw-z-10\">\n <!-- Error Message (Left Side) -->\n <cide-form-field-error [formGroup]=\"userRoleForm\"></cide-form-field-error>\n \n <!-- Action Buttons (Right Side) -->\n <div class=\"tw-flex tw-gap-4\">\n <button cideEleButton type=\"button\" variant=\"secondary\" (click)=\"onCancel()\" leftIcon=\"arrow_back\"\n [disabled]=\"loading()\">\n {{ isViewMode() ? 'Close' : 'Cancel' }}\n </button>\n\n @if (!isViewMode()) {\n <button cideEleButton type=\"submit\" variant=\"primary\" [disabled]=\"loading() || !isFormReadyToSave\"\n [loading]=\"loading()\" leftIcon=\"save\">\n {{ submitButtonText }}\n </button>\n }\n </div>\n </div>\n </form>\n</div>\n\n<!-- Template Renderers for Role Rights Grid -->\n<ng-template #menuDetailsRendererTemplate let-row=\"row\" let-value=\"value\">\n <div class=\"tw-flex tw-items-center tw-min-w-0\">\n <!-- Menu Icon -->\n <div class=\"tw-flex-shrink-0\">\n <cide-ele-icon \n class=\"tw-text-gray-400\" \n size=\"xs\">\n {{ row.syme_icon || 'folder_open' }}\n </cide-ele-icon>\n </div>\n \n <!-- Menu Details -->\n <div class=\"tw-ml-3 tw-min-w-0 tw-flex-1\">\n <div class=\"tw-flex tw-items-center tw-gap-2\">\n <div class=\"tw-text-xs tw-font-medium tw-text-gray-900 tw-truncate\" \n [title]=\"row.syme_title\">\n {{ row.syme_title || row.menu?.syme_title || row.menu?.syme_menu_name || 'Untitled' }}\n </div>\n <!-- Green pill indicator for parent menus with child permissions -->\n @if (row.syme_type === 'module' || row.syme_type === 'section') {\n @if (hasChildMenusWithPermissions(row._id)) {\n <span class=\"tw-inline-flex tw-items-center tw-px-2 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium tw-bg-green-100 tw-text-green-800 tw-whitespace-nowrap\">\n Assigned\n </span>\n }\n }\n </div>\n @if (row.permission?.sygms_name) {\n <div class=\"tw-text-xs tw-text-blue-500 tw-truncate\" \n [title]=\"row.permission?.sygms_name\">\n {{ row.permission?.sygms_name }}\n </div>\n }\n </div>\n </div>\n</ng-template>\n\n\n<!-- Permissions Checkbox Renderer Template -->\n<ng-template #permissionsCheckboxRendererTemplate let-row=\"row\" let-value=\"value\">\n <div class=\"tw-flex tw-flex-wrap tw-gap-2 tw-max-w-full\">\n @if (row.syme_type === 'menu' && row?.syme_permissions_id_sygms && row?.syme_permissions_id_sygms.length > 0) {\n @for (permissionId of row?.syme_permissions_id_sygms || []; track permissionId) {\n <div class=\"tw-flex tw-items-center tw-space-x-1\">\n <cide-ele-input \n type=\"checkbox\"\n [label]=\"getPermissionById(permissionId)?.sygms_name || 'Unknown'\"\n [ngModel]=\"isPermissionSelected(row._id, permissionId)\"\n (ngModelChange)=\"onPermissionCheckboxChange(row._id, permissionId, $event)\"\n size=\"xs\"\n [disabled]=\"isViewMode()\">\n </cide-ele-input>\n </div>\n }\n } @else {\n <!-- Show green checkmark for parent menus with child permissions -->\n @if (row.syme_type === 'module' || row.syme_type === 'section' || row.syme_type === 'title') {\n @if (hasChildMenusWithPermissions(row._id)) {\n <div class=\"tw-flex tw-items-center tw-justify-center tw-w-6 tw-h-6 tw-bg-green-100 tw-rounded-full\" \n [title]=\"hasParentViewRight(row._id) ? 'View right automatically enabled' : 'Child permissions assigned'\">\n <cide-ele-icon \n class=\"tw-text-green-600\" \n size=\"xs\">\n check\n </cide-ele-icon>\n </div>\n } @else if (hasParentViewRight(row._id)) {\n <!-- Show green checkmark for parent with view right -->\n <cide-ele-icon \n class=\"tw-text-green-600\" \n size=\"xs\"\n title=\"View right automatically enabled\">\n check\n </cide-ele-icon>\n } @else {\n <span class=\"tw-text-xs tw-text-gray-400\">N/A</span>\n }\n } @else {\n <span class=\"tw-text-xs tw-text-gray-400\">N/A</span>\n }\n }\n </div>\n</ng-template>", styles: [":host{@apply tw-w-full tw-h-full tw-flex tw-flex-col;}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$2.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i1$2.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: CideEleButtonComponent, selector: "button[cideEleButton], a[cideEleButton], cide-ele-button", inputs: ["label", "variant", "size", "type", "shape", "elevation", "disabled", "id", "loading", "fullWidth", "leftIcon", "rightIcon", "customClass", "tooltip", "ariaLabel", "testId", "routerLink", "routerExtras", "preventDoubleClick", "animated"], outputs: ["btnClick", "doubleClick"] }, { kind: "component", type: CideIconComponent, selector: "cide-ele-icon", inputs: ["size", "type", "toolTip"] }, { kind: "component", type: CideInputComponent, selector: "cide-ele-input", inputs: ["fill", "label", "labelHide", "disabled", "clearInput", "labelPlacement", "labelDir", "placeholder", "leadingIcon", "trailingIcon", "helperText", "helperTextCollapse", "hideHelperAndErrorText", "errorText", "maxlength", "minlength", "required", "autocapitalize", "autocomplete", "type", "width", "id", "ngModel", "option", "min", "max", "step", "size"], outputs: ["ngModelChange"] }, { kind: "component", type: CideSelectComponent, selector: "cide-ele-select", inputs: ["label", "labelHide", "placeholder", "helperText", "errorText", "required", "disabled", "id", "ngModel", "size", "fill", "labelPlacement", "labelDir", "leadingIcon", "trailingIcon", "clearInput", "options", "multiple", "searchable", "showSearchInput", "loading", "valueKey", "labelKey", "treeView"], outputs: ["ngModelChange", "change", "searchChange"] }, { kind: "component", type: CideTextareaComponent, selector: "cide-ele-textarea", inputs: ["label", "labelHide", "placeholder", "helperText", "errorText", "required", "disabled", "minlength", "maxlength", "rows", "id", "ngModel", "size", "fill", "labelPlacement", "labelDir", "leadingIcon", "trailingIcon", "clearInput"], outputs: ["ngModelChange"] }, { kind: "component", type: CideEleDataGridComponent, selector: "cide-ele-data-grid", inputs: ["config", "templateRenderers", "customFormatters", "actionHandlers", "serverSidePagination", "totalServerItems", "currentServerPage", "currentServerPageSize", "dragDropEnabled"], outputs: ["gridEvent"] }, { kind: "component", type: CideFormFieldErrorComponent, selector: "cide-form-field-error", inputs: ["control", "formGroup", "fieldName", "customMessages"] }] });
|
|
21860
|
+
// ============================================
|
|
21861
|
+
// Copy Role Feature Methods
|
|
21862
|
+
// ============================================
|
|
21863
|
+
/**
|
|
21864
|
+
* Open copy role drawer using floating container service
|
|
21865
|
+
*/
|
|
21866
|
+
openCopyRoleDialog() {
|
|
21867
|
+
console.log('📋 Opening copy role drawer');
|
|
21868
|
+
// Register the copy role drawer component if not already registered
|
|
21869
|
+
if (!this.floatingContainerService.isComponentRegistered('copy-role-drawer')) {
|
|
21870
|
+
this.floatingContainerService.registerComponent('copy-role-drawer', CopyRoleDrawerComponent);
|
|
21871
|
+
}
|
|
21872
|
+
// Show the floating container with the drawer component
|
|
21873
|
+
const containerId = this.floatingContainerService.show({
|
|
21874
|
+
id: 'copy-role-drawer',
|
|
21875
|
+
title: 'Copy Role from Entity',
|
|
21876
|
+
componentId: 'copy-role-drawer',
|
|
21877
|
+
width: '500px',
|
|
21878
|
+
height: 'auto',
|
|
21879
|
+
maxHeight: '80vh',
|
|
21880
|
+
resizable: false,
|
|
21881
|
+
draggable: true,
|
|
21882
|
+
closable: true,
|
|
21883
|
+
componentConfig: {
|
|
21884
|
+
inputs: {},
|
|
21885
|
+
outputs: {
|
|
21886
|
+
roleSelect: (event) => {
|
|
21887
|
+
// Extract role data from event (handles both direct value and event object)
|
|
21888
|
+
const roleData = typeof event === 'object' && event !== null
|
|
21889
|
+
? (event.value || event)
|
|
21890
|
+
: event;
|
|
21891
|
+
this.onRoleSelected(roleData);
|
|
21892
|
+
},
|
|
21893
|
+
cancel: (event) => {
|
|
21894
|
+
this.floatingContainerService.hide('copy-role-drawer');
|
|
21895
|
+
}
|
|
21896
|
+
}
|
|
21897
|
+
}
|
|
21898
|
+
});
|
|
21899
|
+
console.log('✅ Copy role drawer shown with ID:', containerId);
|
|
21900
|
+
}
|
|
21901
|
+
/**
|
|
21902
|
+
* Handle role selection from drawer
|
|
21903
|
+
*/
|
|
21904
|
+
onRoleSelected(roleData) {
|
|
21905
|
+
console.log('📋 Role selected for copy:', roleData);
|
|
21906
|
+
// Check if form has unsaved changes
|
|
21907
|
+
if (this.userRoleForm.dirty) {
|
|
21908
|
+
this.confirmationService.ask({
|
|
21909
|
+
title: 'Overwrite Current Data',
|
|
21910
|
+
message: 'This will overwrite any unsaved changes in the current form. Are you sure you want to continue?',
|
|
21911
|
+
confirmText: 'Continue',
|
|
21912
|
+
cancelText: 'Cancel',
|
|
21913
|
+
type: 'warning'
|
|
21914
|
+
}).then((confirmed) => {
|
|
21915
|
+
if (confirmed) {
|
|
21916
|
+
this.performRoleCopy(roleData);
|
|
21917
|
+
}
|
|
21918
|
+
});
|
|
21919
|
+
}
|
|
21920
|
+
else {
|
|
21921
|
+
this.performRoleCopy(roleData);
|
|
21922
|
+
}
|
|
21923
|
+
}
|
|
21924
|
+
/**
|
|
21925
|
+
* Perform the actual role copy operation
|
|
21926
|
+
*/
|
|
21927
|
+
performRoleCopy(previewData) {
|
|
21928
|
+
console.log('📋 Applying role copy:', previewData);
|
|
21929
|
+
const roleData = previewData.core_user_role;
|
|
21930
|
+
const currentEntityId = this.appState.activeEntity()?._id;
|
|
21931
|
+
// Populate main form with copied data (append " - Copy" to name)
|
|
21932
|
+
this.userRoleForm.patchValue({
|
|
21933
|
+
syusrol_role_name: `${roleData.syusrol_role_name} - Copy`,
|
|
21934
|
+
syusrol_role_description: roleData.syusrol_role_description,
|
|
21935
|
+
syusrol_role_entity_id_syen: currentEntityId, // Keep current entity
|
|
21936
|
+
syusrol_isactive: roleData.syusrol_isactive
|
|
21937
|
+
});
|
|
21938
|
+
// Clear existing rights
|
|
21939
|
+
const rightsArray = this.roleRightsForm.get('roleRights');
|
|
21940
|
+
rightsArray.clear();
|
|
21941
|
+
// Copy role rights
|
|
21942
|
+
if (previewData.core_user_role_rights && previewData.core_user_role_rights.length > 0) {
|
|
21943
|
+
const copiedRights = previewData.core_user_role_rights.map(right => ({
|
|
21944
|
+
syusrgt_menu_id_syme: typeof right.syusrgt_menu_id_syme === 'object'
|
|
21945
|
+
? right.syusrgt_menu_id_syme?._id
|
|
21946
|
+
: right.syusrgt_menu_id_syme,
|
|
21947
|
+
syusrgt_role_permissions_id_sygms: typeof right.syusrgt_role_permissions_id_sygms === 'object'
|
|
21948
|
+
? right.syusrgt_role_permissions_id_sygms?._id
|
|
21949
|
+
: right.syusrgt_role_permissions_id_sygms,
|
|
21950
|
+
syusrgt_isactive: right.syusrgt_isactive
|
|
21951
|
+
}));
|
|
21952
|
+
// Add each copied right to the form
|
|
21953
|
+
copiedRights.forEach(right => {
|
|
21954
|
+
rightsArray.push(this.createRoleRightFormGroup(right));
|
|
21955
|
+
});
|
|
21956
|
+
console.log('✅ Copied', copiedRights.length, 'role rights');
|
|
21957
|
+
}
|
|
21958
|
+
// Mark form as dirty to enable save
|
|
21959
|
+
this.userRoleForm.markAsDirty();
|
|
21960
|
+
this.roleRightsForm.markAsDirty();
|
|
21961
|
+
// Show success notification
|
|
21962
|
+
this.notificationService.success(`Role "${roleData.syusrol_role_name}" copied successfully. You can now modify and save.`);
|
|
21963
|
+
// Trigger change detection
|
|
21964
|
+
this.cdr.detectChanges();
|
|
21965
|
+
}
|
|
21966
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreUserRoleFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
21967
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: CideCoreUserRoleFormComponent, isStandalone: true, selector: "cide-core-user-role-form", viewQueries: [{ propertyName: "menuDetailsRendererTemplate", first: true, predicate: ["menuDetailsRendererTemplate"], descendants: true, isSignal: true }, { propertyName: "permissionsCheckboxRendererTemplate", first: true, predicate: ["permissionsCheckboxRendererTemplate"], descendants: true, isSignal: true }], ngImport: i0, template: "<!-- User Role Form Container -->\n<div class=\"tw-w-full tw-h-full\">\n <form class=\"tw-max-w-7xl tw-mx-auto tw-bg-transparent tw-h-full tw-flex tw-flex-col\" [formGroup]=\"userRoleForm\" [class.tw-opacity-60]=\"loading()\" (ngSubmit)=\"onSubmit()\">\n\n <!-- Error Message -->\n @if (error()) {\n <div class=\"tw-mb-6 tw-p-4 tw-bg-red-50 tw-border tw-border-red-200 tw-rounded-md\">\n <div class=\"tw-flex tw-items-start\">\n <cide-ele-icon name=\"error\" class=\"tw-text-red-400 tw-w-5 tw-h-5 tw-mt-0.5 tw-flex-shrink-0\"></cide-ele-icon>\n <div class=\"tw-ml-3\">\n <h3 class=\"tw-text-sm tw-font-medium tw-text-red-800 tw-m-0\">Error</h3>\n <p class=\"tw-text-sm tw-text-red-700 tw-mt-1 tw-m-0\">{{ error() }}</p>\n </div>\n </div>\n </div>\n }\n <!-- User Role Basic Information Section -->\n <div class=\"tw-py-2 tw-border-b-0 tw-mb-0 tw-p-3\">\n\n <!-- Copy Role Button (only in create mode) -->\n @if (!isEditMode() && !isViewMode()) {\n <div class=\"tw-mb-4\">\n <button \n cideEleButton \n type=\"button\"\n variant=\"secondary\" \n leftIcon=\"content_copy\"\n (click)=\"openCopyRoleDialog()\">\n Copy from Existing Role\n </button>\n </div>\n }\n\n <!-- Basic Fields -->\n <div class=\"tw-grid tw-grid-cols-1 xl:tw-grid-cols-2 lg:tw-grid-cols-2 md:tw-grid-cols-1 tw-gap-6 tw-mb-0\">\n <!-- Left Column: Role Name -->\n <div>\n <cide-ele-input \n id=\"syusrol_role_name\" \n label=\"Role Name\" \n formControlName=\"syusrol_role_name\"\n placeholder=\"Enter role name\" \n [maxlength]=\"50\" \n size=\"md\"\n [disabled]=\"isViewMode()\">\n </cide-ele-input>\n </div>\n\n <!-- Right Column: Description -->\n <div>\n <cide-ele-textarea \n id=\"syusrol_role_description\" \n label=\"Description\" \n formControlName=\"syusrol_role_description\"\n placeholder=\"Enter role description\" \n rows=\"3\"\n [maxlength]=\"200\"\n [disabled]=\"isViewMode()\">\n </cide-ele-textarea>\n </div>\n </div>\n\n <!-- Active Status Row -->\n <div class=\"tw-mb-0\">\n <cide-ele-input \n id=\"syusrol_isactive\" \n label=\"Active Status\" \n formControlName=\"syusrol_isactive\"\n type=\"checkbox\" \n size=\"md\"\n [disabled]=\"isViewMode()\">\n </cide-ele-input>\n </div>\n </div>\n\n <!-- Role Rights Section -->\n <div class=\"tw-pt-2 tw-border-b-0 tw-mb-0 tw-flex-1 tw-flex tw-flex-col tw-min-h-0\">\n\n <!-- Role Rights Grid -->\n <div class=\"tw-flex-1 tw-min-h-0 tw-w-full\" style=\"height: 400px; max-height: 900px;\">\n <cide-ele-data-grid \n [config]=\"roleRightsGridConfig()\" \n [templateRenderers]=\"templateRenderers()\"\n (gridEvent)=\"onRoleRightsGridEvent($event)\"\n class=\"tw-h-full tw-w-full\">\n </cide-ele-data-grid>\n </div>\n\n <!-- Role Rights Form (Hidden but functional) -->\n <div [formGroup]=\"roleRightsForm\" class=\"tw-hidden\">\n <div formArrayName=\"roleRights\">\n @for (right of roleRightsArray.controls; track $index; let i = $index) {\n <div [formGroupName]=\"i\">\n <cide-ele-select formControlName=\"syusrgt_menu_id_syme\">\n <option value=\"\">Select Menu</option>\n @for (menu of menus(); track menu._id) {\n <option [value]=\"menu._id\">{{ menu.syme_title }}</option>\n }\n </cide-ele-select>\n <cide-ele-select formControlName=\"syusrgt_role_permissions_id_sygms\">\n <option value=\"\">Select Permission</option>\n @for (permission of permissions(); track permission._id) {\n <option [value]=\"permission._id\">{{ permission.sygms_name }}</option>\n }\n </cide-ele-select>\n <cide-ele-input formControlName=\"syusrgt_isactive\" type=\"checkbox\"></cide-ele-input>\n </div>\n }\n </div>\n </div>\n </div>\n\n <!-- Form Actions -->\n <div class=\"tw-flex tw-justify-between tw-items-center tw-p-3 tw-gap-4 tw-py-2 tw-bg-white tw-border-t tw-border-gray-200 tw-sticky tw-bottom-0 tw-z-10\">\n <!-- Error Message (Left Side) -->\n <cide-form-field-error [formGroup]=\"userRoleForm\"></cide-form-field-error>\n \n <!-- Action Buttons (Right Side) -->\n <div class=\"tw-flex tw-gap-4\">\n <button cideEleButton type=\"button\" variant=\"secondary\" (click)=\"onCancel()\" leftIcon=\"arrow_back\"\n [disabled]=\"loading()\">\n {{ isViewMode() ? 'Close' : 'Cancel' }}\n </button>\n\n @if (!isViewMode()) {\n <button cideEleButton type=\"submit\" variant=\"primary\" [disabled]=\"loading() || !isFormReadyToSave\"\n [loading]=\"loading()\" leftIcon=\"save\">\n {{ submitButtonText }}\n </button>\n }\n </div>\n </div>\n </form>\n</div>\n\n<!-- Template Renderers for Role Rights Grid -->\n<ng-template #menuDetailsRendererTemplate let-row=\"row\" let-value=\"value\">\n <div class=\"tw-flex tw-items-center tw-min-w-0\">\n <!-- Menu Icon -->\n <div class=\"tw-flex-shrink-0\">\n <cide-ele-icon \n class=\"tw-text-gray-400\" \n size=\"xs\">\n {{ row.syme_icon || 'folder_open' }}\n </cide-ele-icon>\n </div>\n \n <!-- Menu Details -->\n <div class=\"tw-ml-3 tw-min-w-0 tw-flex-1\">\n <div class=\"tw-flex tw-items-center tw-gap-2\">\n <div class=\"tw-text-xs tw-font-medium tw-text-gray-900 tw-truncate\" \n [title]=\"row.syme_title\">\n {{ row.syme_title || row.menu?.syme_title || row.menu?.syme_menu_name || 'Untitled' }}\n </div>\n <!-- Green pill indicator for parent menus with child permissions -->\n @if (row.syme_type === 'module' || row.syme_type === 'section') {\n @if (hasChildMenusWithPermissions(row._id)) {\n <span class=\"tw-inline-flex tw-items-center tw-px-2 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium tw-bg-green-100 tw-text-green-800 tw-whitespace-nowrap\">\n Assigned\n </span>\n }\n }\n </div>\n @if (row.permission?.sygms_name) {\n <div class=\"tw-text-xs tw-text-blue-500 tw-truncate\" \n [title]=\"row.permission?.sygms_name\">\n {{ row.permission?.sygms_name }}\n </div>\n }\n </div>\n </div>\n</ng-template>\n\n\n<!-- Permissions Checkbox Renderer Template -->\n<ng-template #permissionsCheckboxRendererTemplate let-row=\"row\" let-value=\"value\">\n <div class=\"tw-flex tw-flex-wrap tw-gap-2 tw-max-w-full\">\n @if (row.syme_type === 'menu' && row?.syme_permissions_id_sygms && row?.syme_permissions_id_sygms.length > 0) {\n @for (permissionId of row?.syme_permissions_id_sygms || []; track permissionId) {\n <div class=\"tw-flex tw-items-center tw-space-x-1\">\n <cide-ele-input \n type=\"checkbox\"\n [label]=\"getPermissionById(permissionId)?.sygms_name || 'Unknown'\"\n [ngModel]=\"isPermissionSelected(row._id, permissionId)\"\n (ngModelChange)=\"onPermissionCheckboxChange(row._id, permissionId, $event)\"\n size=\"xs\"\n [disabled]=\"isViewMode()\">\n </cide-ele-input>\n </div>\n }\n } @else {\n <!-- Show green checkmark for parent menus with child permissions -->\n @if (row.syme_type === 'module' || row.syme_type === 'section' || row.syme_type === 'title') {\n @if (hasChildMenusWithPermissions(row._id)) {\n <div class=\"tw-flex tw-items-center tw-justify-center tw-w-6 tw-h-6 tw-bg-green-100 tw-rounded-full\" \n [title]=\"hasParentViewRight(row._id) ? 'View right automatically enabled' : 'Child permissions assigned'\">\n <cide-ele-icon \n class=\"tw-text-green-600\" \n size=\"xs\">\n check\n </cide-ele-icon>\n </div>\n } @else if (hasParentViewRight(row._id)) {\n <!-- Show green checkmark for parent with view right -->\n <cide-ele-icon \n class=\"tw-text-green-600\" \n size=\"xs\"\n title=\"View right automatically enabled\">\n check\n </cide-ele-icon>\n } @else {\n <span class=\"tw-text-xs tw-text-gray-400\">N/A</span>\n }\n } @else {\n <span class=\"tw-text-xs tw-text-gray-400\">N/A</span>\n }\n }\n </div>\n</ng-template>", styles: [":host{@apply tw-w-full tw-h-full tw-flex tw-flex-col;}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$2.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i1$2.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: CideEleButtonComponent, selector: "button[cideEleButton], a[cideEleButton], cide-ele-button", inputs: ["label", "variant", "size", "type", "shape", "elevation", "disabled", "id", "loading", "fullWidth", "leftIcon", "rightIcon", "customClass", "tooltip", "ariaLabel", "testId", "routerLink", "routerExtras", "preventDoubleClick", "animated"], outputs: ["btnClick", "doubleClick"] }, { kind: "component", type: CideIconComponent, selector: "cide-ele-icon", inputs: ["size", "type", "toolTip"] }, { kind: "component", type: CideInputComponent, selector: "cide-ele-input", inputs: ["fill", "label", "labelHide", "disabled", "clearInput", "labelPlacement", "labelDir", "placeholder", "leadingIcon", "trailingIcon", "helperText", "helperTextCollapse", "hideHelperAndErrorText", "errorText", "maxlength", "minlength", "required", "autocapitalize", "autocomplete", "type", "width", "id", "ngModel", "option", "min", "max", "step", "size"], outputs: ["ngModelChange"] }, { kind: "component", type: CideSelectComponent, selector: "cide-ele-select", inputs: ["label", "labelHide", "placeholder", "helperText", "errorText", "required", "disabled", "id", "ngModel", "size", "fill", "labelPlacement", "labelDir", "leadingIcon", "trailingIcon", "clearInput", "options", "multiple", "searchable", "showSearchInput", "loading", "valueKey", "labelKey", "treeView"], outputs: ["ngModelChange", "change", "searchChange"] }, { kind: "component", type: CideTextareaComponent, selector: "cide-ele-textarea", inputs: ["label", "labelHide", "placeholder", "helperText", "errorText", "required", "disabled", "minlength", "maxlength", "rows", "id", "ngModel", "size", "fill", "labelPlacement", "labelDir", "leadingIcon", "trailingIcon", "clearInput"], outputs: ["ngModelChange"] }, { kind: "component", type: CideEleDataGridComponent, selector: "cide-ele-data-grid", inputs: ["config", "templateRenderers", "customFormatters", "actionHandlers", "serverSidePagination", "totalServerItems", "currentServerPage", "currentServerPageSize", "dragDropEnabled"], outputs: ["gridEvent"] }, { kind: "component", type: CideFormFieldErrorComponent, selector: "cide-form-field-error", inputs: ["control", "formGroup", "fieldName", "customMessages"] }] });
|
|
20956
21968
|
}
|
|
20957
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
21969
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreUserRoleFormComponent, decorators: [{
|
|
20958
21970
|
type: Component,
|
|
20959
21971
|
args: [{ selector: 'cide-core-user-role-form', standalone: true, imports: [
|
|
20960
21972
|
CommonModule,
|
|
@@ -20967,8 +21979,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImpor
|
|
|
20967
21979
|
CideTextareaComponent,
|
|
20968
21980
|
CideEleDataGridComponent,
|
|
20969
21981
|
CideFormFieldErrorComponent
|
|
20970
|
-
], template: "<!-- User Role Form Container -->\n<div class=\"tw-w-full tw-h-full\">\n <form class=\"tw-max-w-7xl tw-mx-auto tw-bg-transparent tw-h-full tw-flex tw-flex-col\" [formGroup]=\"userRoleForm\" [class.tw-opacity-60]=\"loading()\" (ngSubmit)=\"onSubmit()\">\n\n <!-- Error Message -->\n @if (error()) {\n <div class=\"tw-mb-6 tw-p-4 tw-bg-red-50 tw-border tw-border-red-200 tw-rounded-md\">\n <div class=\"tw-flex tw-items-start\">\n <cide-ele-icon name=\"error\" class=\"tw-text-red-400 tw-w-5 tw-h-5 tw-mt-0.5 tw-flex-shrink-0\"></cide-ele-icon>\n <div class=\"tw-ml-3\">\n <h3 class=\"tw-text-sm tw-font-medium tw-text-red-800 tw-m-0\">Error</h3>\n <p class=\"tw-text-sm tw-text-red-700 tw-mt-1 tw-m-0\">{{ error() }}</p>\n </div>\n </div>\n </div>\n }\n <!-- User Role Basic Information Section -->\n <div class=\"tw-py-2 tw-border-b-0 tw-mb-0 tw-p-3\">\n\n <!-- Basic Fields -->\n <div class=\"tw-grid tw-grid-cols-1 xl:tw-grid-cols-2 lg:tw-grid-cols-2 md:tw-grid-cols-1 tw-gap-6 tw-mb-0\">\n <!-- Left Column: Role Name -->\n <div>\n <cide-ele-input \n id=\"syusrol_role_name\" \n label=\"Role Name\" \n formControlName=\"syusrol_role_name\"\n placeholder=\"Enter role name\" \n [maxlength]=\"50\" \n size=\"md\"\n [disabled]=\"isViewMode()\">\n </cide-ele-input>\n </div>\n\n <!-- Right Column: Description -->\n <div>\n <cide-ele-textarea \n id=\"syusrol_role_description\" \n label=\"Description\" \n formControlName=\"syusrol_role_description\"\n placeholder=\"Enter role description\" \n rows=\"3\"\n [maxlength]=\"200\"\n [disabled]=\"isViewMode()\">\n </cide-ele-textarea>\n </div>\n </div>\n\n <!-- Active Status Row -->\n <div class=\"tw-mb-0\">\n <cide-ele-input \n id=\"syusrol_isactive\" \n label=\"Active Status\" \n formControlName=\"syusrol_isactive\"\n type=\"checkbox\" \n size=\"md\"\n [disabled]=\"isViewMode()\">\n </cide-ele-input>\n </div>\n </div>\n\n <!-- Role Rights Section -->\n <div class=\"tw-pt-2 tw-border-b-0 tw-mb-0 tw-flex-1 tw-flex tw-flex-col tw-min-h-0\">\n\n <!-- Role Rights Grid -->\n <div class=\"tw-flex-1 tw-min-h-0 tw-w-full\" style=\"height: 400px; max-height: 900px;\">\n <cide-ele-data-grid \n [config]=\"roleRightsGridConfig()\" \n [templateRenderers]=\"templateRenderers()\"\n (gridEvent)=\"onRoleRightsGridEvent($event)\"\n class=\"tw-h-full tw-w-full\">\n </cide-ele-data-grid>\n </div>\n\n <!-- Role Rights Form (Hidden but functional) -->\n <div [formGroup]=\"roleRightsForm\" class=\"tw-hidden\">\n <div formArrayName=\"roleRights\">\n @for (right of roleRightsArray.controls; track $index; let i = $index) {\n <div [formGroupName]=\"i\">\n <cide-ele-select formControlName=\"syusrgt_menu_id_syme\">\n <option value=\"\">Select Menu</option>\n @for (menu of menus(); track menu._id) {\n <option [value]=\"menu._id\">{{ menu.syme_title }}</option>\n }\n </cide-ele-select>\n <cide-ele-select formControlName=\"syusrgt_role_permissions_id_sygms\">\n <option value=\"\">Select Permission</option>\n @for (permission of permissions(); track permission._id) {\n <option [value]=\"permission._id\">{{ permission.sygms_name }}</option>\n }\n </cide-ele-select>\n <cide-ele-input formControlName=\"syusrgt_isactive\" type=\"checkbox\"></cide-ele-input>\n </div>\n }\n </div>\n </div>\n </div>\n\n <!-- Form Actions -->\n <div class=\"tw-flex tw-justify-between tw-items-center tw-p-3 tw-gap-4 tw-py-2 tw-bg-white tw-border-t tw-border-gray-200 tw-sticky tw-bottom-0 tw-z-10\">\n <!-- Error Message (Left Side) -->\n <cide-form-field-error [formGroup]=\"userRoleForm\"></cide-form-field-error>\n \n <!-- Action Buttons (Right Side) -->\n <div class=\"tw-flex tw-gap-4\">\n <button cideEleButton type=\"button\" variant=\"secondary\" (click)=\"onCancel()\" leftIcon=\"arrow_back\"\n [disabled]=\"loading()\">\n {{ isViewMode() ? 'Close' : 'Cancel' }}\n </button>\n\n @if (!isViewMode()) {\n <button cideEleButton type=\"submit\" variant=\"primary\" [disabled]=\"loading() || !isFormReadyToSave\"\n [loading]=\"loading()\" leftIcon=\"save\">\n {{ submitButtonText }}\n </button>\n }\n </div>\n </div>\n </form>\n</div>\n\n<!-- Template Renderers for Role Rights Grid -->\n<ng-template #menuDetailsRendererTemplate let-row=\"row\" let-value=\"value\">\n <div class=\"tw-flex tw-items-center tw-min-w-0\">\n <!-- Menu Icon -->\n <div class=\"tw-flex-shrink-0\">\n <cide-ele-icon \n class=\"tw-text-gray-400\" \n size=\"xs\">\n {{ row.syme_icon || 'folder_open' }}\n </cide-ele-icon>\n </div>\n \n <!-- Menu Details -->\n <div class=\"tw-ml-3 tw-min-w-0 tw-flex-1\">\n <div class=\"tw-flex tw-items-center tw-gap-2\">\n <div class=\"tw-text-xs tw-font-medium tw-text-gray-900 tw-truncate\" \n [title]=\"row.syme_title\">\n {{ row.syme_title || row.menu?.syme_title || row.menu?.syme_menu_name || 'Untitled' }}\n </div>\n <!-- Green pill indicator for parent menus with child permissions -->\n @if (row.syme_type === 'module' || row.syme_type === 'section') {\n @if (hasChildMenusWithPermissions(row._id)) {\n <span class=\"tw-inline-flex tw-items-center tw-px-2 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium tw-bg-green-100 tw-text-green-800 tw-whitespace-nowrap\">\n Assigned\n </span>\n }\n }\n </div>\n @if (row.permission?.sygms_name) {\n <div class=\"tw-text-xs tw-text-blue-500 tw-truncate\" \n [title]=\"row.permission?.sygms_name\">\n {{ row.permission?.sygms_name }}\n </div>\n }\n </div>\n </div>\n</ng-template>\n\n\n<!-- Permissions Checkbox Renderer Template -->\n<ng-template #permissionsCheckboxRendererTemplate let-row=\"row\" let-value=\"value\">\n <div class=\"tw-flex tw-flex-wrap tw-gap-2 tw-max-w-full\">\n @if (row.syme_type === 'menu' && row?.syme_permissions_id_sygms && row?.syme_permissions_id_sygms.length > 0) {\n @for (permissionId of row?.syme_permissions_id_sygms || []; track permissionId) {\n <div class=\"tw-flex tw-items-center tw-space-x-1\">\n <cide-ele-input \n type=\"checkbox\"\n [label]=\"getPermissionById(permissionId)?.sygms_name || 'Unknown'\"\n [ngModel]=\"isPermissionSelected(row._id, permissionId)\"\n (ngModelChange)=\"onPermissionCheckboxChange(row._id, permissionId, $event)\"\n size=\"xs\"\n [disabled]=\"isViewMode()\">\n </cide-ele-input>\n </div>\n }\n } @else {\n <!-- Show green checkmark for parent menus with child permissions -->\n @if (row.syme_type === 'module' || row.syme_type === 'section' || row.syme_type === 'title') {\n @if (hasChildMenusWithPermissions(row._id)) {\n <div class=\"tw-flex tw-items-center tw-justify-center tw-w-6 tw-h-6 tw-bg-green-100 tw-rounded-full\" \n [title]=\"hasParentViewRight(row._id) ? 'View right automatically enabled' : 'Child permissions assigned'\">\n <cide-ele-icon \n class=\"tw-text-green-600\" \n size=\"xs\">\n check\n </cide-ele-icon>\n </div>\n } @else if (hasParentViewRight(row._id)) {\n <!-- Show green checkmark for parent with view right -->\n <cide-ele-icon \n class=\"tw-text-green-600\" \n size=\"xs\"\n title=\"View right automatically enabled\">\n check\n </cide-ele-icon>\n } @else {\n <span class=\"tw-text-xs tw-text-gray-400\">N/A</span>\n }\n } @else {\n <span class=\"tw-text-xs tw-text-gray-400\">N/A</span>\n }\n }\n </div>\n</ng-template>", styles: [":host{@apply tw-w-full tw-h-full tw-flex tw-flex-col;}\n"] }]
|
|
20971
|
-
}] });
|
|
21982
|
+
], template: "<!-- User Role Form Container -->\n<div class=\"tw-w-full tw-h-full\">\n <form class=\"tw-max-w-7xl tw-mx-auto tw-bg-transparent tw-h-full tw-flex tw-flex-col\" [formGroup]=\"userRoleForm\" [class.tw-opacity-60]=\"loading()\" (ngSubmit)=\"onSubmit()\">\n\n <!-- Error Message -->\n @if (error()) {\n <div class=\"tw-mb-6 tw-p-4 tw-bg-red-50 tw-border tw-border-red-200 tw-rounded-md\">\n <div class=\"tw-flex tw-items-start\">\n <cide-ele-icon name=\"error\" class=\"tw-text-red-400 tw-w-5 tw-h-5 tw-mt-0.5 tw-flex-shrink-0\"></cide-ele-icon>\n <div class=\"tw-ml-3\">\n <h3 class=\"tw-text-sm tw-font-medium tw-text-red-800 tw-m-0\">Error</h3>\n <p class=\"tw-text-sm tw-text-red-700 tw-mt-1 tw-m-0\">{{ error() }}</p>\n </div>\n </div>\n </div>\n }\n <!-- User Role Basic Information Section -->\n <div class=\"tw-py-2 tw-border-b-0 tw-mb-0 tw-p-3\">\n\n <!-- Copy Role Button (only in create mode) -->\n @if (!isEditMode() && !isViewMode()) {\n <div class=\"tw-mb-4\">\n <button \n cideEleButton \n type=\"button\"\n variant=\"secondary\" \n leftIcon=\"content_copy\"\n (click)=\"openCopyRoleDialog()\">\n Copy from Existing Role\n </button>\n </div>\n }\n\n <!-- Basic Fields -->\n <div class=\"tw-grid tw-grid-cols-1 xl:tw-grid-cols-2 lg:tw-grid-cols-2 md:tw-grid-cols-1 tw-gap-6 tw-mb-0\">\n <!-- Left Column: Role Name -->\n <div>\n <cide-ele-input \n id=\"syusrol_role_name\" \n label=\"Role Name\" \n formControlName=\"syusrol_role_name\"\n placeholder=\"Enter role name\" \n [maxlength]=\"50\" \n size=\"md\"\n [disabled]=\"isViewMode()\">\n </cide-ele-input>\n </div>\n\n <!-- Right Column: Description -->\n <div>\n <cide-ele-textarea \n id=\"syusrol_role_description\" \n label=\"Description\" \n formControlName=\"syusrol_role_description\"\n placeholder=\"Enter role description\" \n rows=\"3\"\n [maxlength]=\"200\"\n [disabled]=\"isViewMode()\">\n </cide-ele-textarea>\n </div>\n </div>\n\n <!-- Active Status Row -->\n <div class=\"tw-mb-0\">\n <cide-ele-input \n id=\"syusrol_isactive\" \n label=\"Active Status\" \n formControlName=\"syusrol_isactive\"\n type=\"checkbox\" \n size=\"md\"\n [disabled]=\"isViewMode()\">\n </cide-ele-input>\n </div>\n </div>\n\n <!-- Role Rights Section -->\n <div class=\"tw-pt-2 tw-border-b-0 tw-mb-0 tw-flex-1 tw-flex tw-flex-col tw-min-h-0\">\n\n <!-- Role Rights Grid -->\n <div class=\"tw-flex-1 tw-min-h-0 tw-w-full\" style=\"height: 400px; max-height: 900px;\">\n <cide-ele-data-grid \n [config]=\"roleRightsGridConfig()\" \n [templateRenderers]=\"templateRenderers()\"\n (gridEvent)=\"onRoleRightsGridEvent($event)\"\n class=\"tw-h-full tw-w-full\">\n </cide-ele-data-grid>\n </div>\n\n <!-- Role Rights Form (Hidden but functional) -->\n <div [formGroup]=\"roleRightsForm\" class=\"tw-hidden\">\n <div formArrayName=\"roleRights\">\n @for (right of roleRightsArray.controls; track $index; let i = $index) {\n <div [formGroupName]=\"i\">\n <cide-ele-select formControlName=\"syusrgt_menu_id_syme\">\n <option value=\"\">Select Menu</option>\n @for (menu of menus(); track menu._id) {\n <option [value]=\"menu._id\">{{ menu.syme_title }}</option>\n }\n </cide-ele-select>\n <cide-ele-select formControlName=\"syusrgt_role_permissions_id_sygms\">\n <option value=\"\">Select Permission</option>\n @for (permission of permissions(); track permission._id) {\n <option [value]=\"permission._id\">{{ permission.sygms_name }}</option>\n }\n </cide-ele-select>\n <cide-ele-input formControlName=\"syusrgt_isactive\" type=\"checkbox\"></cide-ele-input>\n </div>\n }\n </div>\n </div>\n </div>\n\n <!-- Form Actions -->\n <div class=\"tw-flex tw-justify-between tw-items-center tw-p-3 tw-gap-4 tw-py-2 tw-bg-white tw-border-t tw-border-gray-200 tw-sticky tw-bottom-0 tw-z-10\">\n <!-- Error Message (Left Side) -->\n <cide-form-field-error [formGroup]=\"userRoleForm\"></cide-form-field-error>\n \n <!-- Action Buttons (Right Side) -->\n <div class=\"tw-flex tw-gap-4\">\n <button cideEleButton type=\"button\" variant=\"secondary\" (click)=\"onCancel()\" leftIcon=\"arrow_back\"\n [disabled]=\"loading()\">\n {{ isViewMode() ? 'Close' : 'Cancel' }}\n </button>\n\n @if (!isViewMode()) {\n <button cideEleButton type=\"submit\" variant=\"primary\" [disabled]=\"loading() || !isFormReadyToSave\"\n [loading]=\"loading()\" leftIcon=\"save\">\n {{ submitButtonText }}\n </button>\n }\n </div>\n </div>\n </form>\n</div>\n\n<!-- Template Renderers for Role Rights Grid -->\n<ng-template #menuDetailsRendererTemplate let-row=\"row\" let-value=\"value\">\n <div class=\"tw-flex tw-items-center tw-min-w-0\">\n <!-- Menu Icon -->\n <div class=\"tw-flex-shrink-0\">\n <cide-ele-icon \n class=\"tw-text-gray-400\" \n size=\"xs\">\n {{ row.syme_icon || 'folder_open' }}\n </cide-ele-icon>\n </div>\n \n <!-- Menu Details -->\n <div class=\"tw-ml-3 tw-min-w-0 tw-flex-1\">\n <div class=\"tw-flex tw-items-center tw-gap-2\">\n <div class=\"tw-text-xs tw-font-medium tw-text-gray-900 tw-truncate\" \n [title]=\"row.syme_title\">\n {{ row.syme_title || row.menu?.syme_title || row.menu?.syme_menu_name || 'Untitled' }}\n </div>\n <!-- Green pill indicator for parent menus with child permissions -->\n @if (row.syme_type === 'module' || row.syme_type === 'section') {\n @if (hasChildMenusWithPermissions(row._id)) {\n <span class=\"tw-inline-flex tw-items-center tw-px-2 tw-py-0.5 tw-rounded-full tw-text-xs tw-font-medium tw-bg-green-100 tw-text-green-800 tw-whitespace-nowrap\">\n Assigned\n </span>\n }\n }\n </div>\n @if (row.permission?.sygms_name) {\n <div class=\"tw-text-xs tw-text-blue-500 tw-truncate\" \n [title]=\"row.permission?.sygms_name\">\n {{ row.permission?.sygms_name }}\n </div>\n }\n </div>\n </div>\n</ng-template>\n\n\n<!-- Permissions Checkbox Renderer Template -->\n<ng-template #permissionsCheckboxRendererTemplate let-row=\"row\" let-value=\"value\">\n <div class=\"tw-flex tw-flex-wrap tw-gap-2 tw-max-w-full\">\n @if (row.syme_type === 'menu' && row?.syme_permissions_id_sygms && row?.syme_permissions_id_sygms.length > 0) {\n @for (permissionId of row?.syme_permissions_id_sygms || []; track permissionId) {\n <div class=\"tw-flex tw-items-center tw-space-x-1\">\n <cide-ele-input \n type=\"checkbox\"\n [label]=\"getPermissionById(permissionId)?.sygms_name || 'Unknown'\"\n [ngModel]=\"isPermissionSelected(row._id, permissionId)\"\n (ngModelChange)=\"onPermissionCheckboxChange(row._id, permissionId, $event)\"\n size=\"xs\"\n [disabled]=\"isViewMode()\">\n </cide-ele-input>\n </div>\n }\n } @else {\n <!-- Show green checkmark for parent menus with child permissions -->\n @if (row.syme_type === 'module' || row.syme_type === 'section' || row.syme_type === 'title') {\n @if (hasChildMenusWithPermissions(row._id)) {\n <div class=\"tw-flex tw-items-center tw-justify-center tw-w-6 tw-h-6 tw-bg-green-100 tw-rounded-full\" \n [title]=\"hasParentViewRight(row._id) ? 'View right automatically enabled' : 'Child permissions assigned'\">\n <cide-ele-icon \n class=\"tw-text-green-600\" \n size=\"xs\">\n check\n </cide-ele-icon>\n </div>\n } @else if (hasParentViewRight(row._id)) {\n <!-- Show green checkmark for parent with view right -->\n <cide-ele-icon \n class=\"tw-text-green-600\" \n size=\"xs\"\n title=\"View right automatically enabled\">\n check\n </cide-ele-icon>\n } @else {\n <span class=\"tw-text-xs tw-text-gray-400\">N/A</span>\n }\n } @else {\n <span class=\"tw-text-xs tw-text-gray-400\">N/A</span>\n }\n }\n </div>\n</ng-template>", styles: [":host{@apply tw-w-full tw-h-full tw-flex tw-flex-col;}\n"] }]
|
|
21983
|
+
}], propDecorators: { menuDetailsRendererTemplate: [{ type: i0.ViewChild, args: ['menuDetailsRendererTemplate', { isSignal: true }] }], permissionsCheckboxRendererTemplate: [{ type: i0.ViewChild, args: ['permissionsCheckboxRendererTemplate', { isSignal: true }] }] } });
|
|
20972
21984
|
|
|
20973
21985
|
var userRoleForm_component = /*#__PURE__*/Object.freeze({
|
|
20974
21986
|
__proto__: null,
|
|
@@ -21032,10 +22044,10 @@ class CideCoreNationalityService {
|
|
|
21032
22044
|
};
|
|
21033
22045
|
return this.getAllNationalities(payload);
|
|
21034
22046
|
}
|
|
21035
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
21036
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.
|
|
22047
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreNationalityService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
22048
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreNationalityService, providedIn: 'root' });
|
|
21037
22049
|
}
|
|
21038
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
22050
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreNationalityService, decorators: [{
|
|
21039
22051
|
type: Injectable,
|
|
21040
22052
|
args: [{
|
|
21041
22053
|
providedIn: 'root'
|
|
@@ -21084,10 +22096,10 @@ class CideCoreClassProgramMasterService {
|
|
|
21084
22096
|
pagination: false
|
|
21085
22097
|
});
|
|
21086
22098
|
}
|
|
21087
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
21088
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.
|
|
22099
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreClassProgramMasterService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
22100
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreClassProgramMasterService, providedIn: 'root' });
|
|
21089
22101
|
}
|
|
21090
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
22102
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: CideCoreClassProgramMasterService, decorators: [{
|
|
21091
22103
|
type: Injectable,
|
|
21092
22104
|
args: [{
|
|
21093
22105
|
providedIn: 'root'
|