cloud-ide-core 2.0.1 → 2.0.2

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/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "cloud-ide-core",
3
- "version": "2.0.1",
3
+ "version": "2.0.2",
4
4
  "peerDependencies": {
5
5
  "@angular/common": "^20.1.0",
6
6
  "@angular/core": "^20.1.0"
@@ -1,609 +0,0 @@
1
- import * as i0 from '@angular/core';
2
- import { inject, DestroyRef, viewChild, signal, computed, Component } from '@angular/core';
3
- import { CommonModule } from '@angular/common';
4
- import * as i1 from '@angular/forms';
5
- import { NonNullableFormBuilder, ReactiveFormsModule, FormsModule } from '@angular/forms';
6
- import { Router } from '@angular/router';
7
- import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
8
- import { G as GeneralMasterTypeService } from './cloud-ide-core-general-master-type.service-8JWTVijZ.mjs';
9
- import { CideEleDataGridComponent, CideEleButtonComponent, CideInputComponent, CideTextareaComponent, CideIconComponent, CideEleDropdownComponent, CideEleJsonEditorComponent, CideSelectComponent } from 'cloud-ide-element';
10
- import { generateStringFromObject } from 'cloud-ide-lms-model';
11
-
12
- class GeneralMasterTypeComponent {
13
- // Dependency injection
14
- destroyRef = inject(DestroyRef);
15
- typeService = inject(GeneralMasterTypeService);
16
- fb = inject(NonNullableFormBuilder);
17
- router = inject(Router);
18
- // Modern ViewChild signals for template renderers (Angular 20 approach)
19
- typeDetailsRendererTemplate = viewChild.required('typeDetailsRendererTemplate');
20
- typeStatusRendererTemplate = viewChild.required('typeStatusRendererTemplate');
21
- actionsDropdownRendererTemplate = viewChild.required('actionsDropdownRendererTemplate');
22
- // Make Math available in template
23
- Math = Math;
24
- // Signals for reactive state management
25
- types = signal([], ...(ngDevMode ? [{ debugName: "types" }] : []));
26
- loading = signal(false, ...(ngDevMode ? [{ debugName: "loading" }] : []));
27
- error = signal(null, ...(ngDevMode ? [{ debugName: "error" }] : []));
28
- selectedItems = signal([], ...(ngDevMode ? [{ debugName: "selectedItems" }] : []));
29
- searchTerm = signal('', ...(ngDevMode ? [{ debugName: "searchTerm" }] : []));
30
- // Form state
31
- isEditMode = signal(false, ...(ngDevMode ? [{ debugName: "isEditMode" }] : []));
32
- editingTypeId = signal(null, ...(ngDevMode ? [{ debugName: "editingTypeId" }] : []));
33
- retrievedType = signal(null, ...(ngDevMode ? [{ debugName: "retrievedType" }] : []));
34
- // Pagination signals
35
- currentPage = signal(1, ...(ngDevMode ? [{ debugName: "currentPage" }] : []));
36
- pageSize = signal(10, ...(ngDevMode ? [{ debugName: "pageSize" }] : []));
37
- totalItems = signal(0, ...(ngDevMode ? [{ debugName: "totalItems" }] : []));
38
- // Modern reactive forms with signals
39
- typeForm = this.fb.group({
40
- sygmt_code: [''],
41
- sygmt_title: [''],
42
- sygmt_desc: [''],
43
- sygmt_configuration: ['{}'],
44
- sygmt_isactive: [true],
45
- sygmt_id_sygmt: [''] // Parent type ID for child types
46
- });
47
- // Computed values
48
- isFormDirty = computed(() => this.typeForm.dirty, ...(ngDevMode ? [{ debugName: "isFormDirty" }] : []));
49
- // Grid configuration signal
50
- gridConfig = signal({
51
- id: 'type-list-grid',
52
- title: '',
53
- subtitle: '',
54
- columns: [
55
- {
56
- key: 'details',
57
- header: 'Type Details',
58
- type: 'custom',
59
- width: 'auto',
60
- truncate: true,
61
- align: 'left',
62
- renderer: 'typeDetailsRenderer'
63
- },
64
- {
65
- key: 'sygmt_code',
66
- header: 'Type Code',
67
- type: 'text',
68
- width: '150px',
69
- truncate: true,
70
- align: 'left'
71
- },
72
- {
73
- key: 'sygmt_isactive',
74
- header: 'Status',
75
- type: 'custom',
76
- width: '100px',
77
- truncate: false,
78
- align: 'center',
79
- renderer: 'typeStatusRenderer'
80
- },
81
- {
82
- key: 'actions',
83
- header: '',
84
- type: 'custom',
85
- width: '150px',
86
- truncate: false,
87
- align: 'center',
88
- renderer: 'actionsDropdownRenderer'
89
- }
90
- ],
91
- data: [],
92
- trackBy: '_id',
93
- tree: {
94
- enabled: true,
95
- foreignKey: 'sygmt_id_sygmt',
96
- primaryKey: '_id'
97
- },
98
- pagination: {
99
- enabled: true,
100
- pageSize: 10,
101
- pageSizeOptions: [10, 25, 50, 100],
102
- showQuickJump: true,
103
- showPageInfo: true,
104
- showRefresh: true
105
- },
106
- search: {
107
- enabled: true,
108
- placeholder: 'Search types...',
109
- searchableColumns: ['sygmt_title', 'sygmt_desc', 'sygmt_code'],
110
- debounceMs: 300
111
- },
112
- loading: {
113
- useDefer: true,
114
- skeletonRows: 5,
115
- showOverlay: false
116
- },
117
- scroll: {
118
- enabled: true,
119
- maxHeight: '',
120
- minHeight: '',
121
- stickyHeader: true,
122
- virtualScroll: false,
123
- rowHeight: 40
124
- },
125
- responsive: true,
126
- striped: false,
127
- bordered: true,
128
- compact: true,
129
- tableClass: 'tw-table-fixed tw-w-full tw-rounded-none'
130
- }, ...(ngDevMode ? [{ debugName: "gridConfig" }] : []));
131
- // Action handlers for grid
132
- actionHandlers = {
133
- onEdit: (item) => this.editType(item),
134
- onDelete: (item) => this.deleteType(item),
135
- onToggleStatus: (item) => this.toggleTypeStatus(item)
136
- };
137
- ngOnInit() {
138
- this.initializeComponent();
139
- // Add form submission debugging
140
- this.typeForm.valueChanges.subscribe(value => {
141
- console.log('🔵 Form value changed:', value);
142
- });
143
- this.typeForm.statusChanges.subscribe(status => {
144
- console.log('🔵 Form status changed:', status);
145
- });
146
- }
147
- /**
148
- * Initialize component
149
- */
150
- initializeComponent() {
151
- this.loadTypes();
152
- this.setupFormSubscriptions();
153
- }
154
- /**
155
- * Load types from API
156
- */
157
- loadTypes() {
158
- this.loading.set(true);
159
- this.error.set(null);
160
- const request = {};
161
- this.typeService.getTypeList(request)
162
- .pipe(takeUntilDestroyed(this.destroyRef))
163
- .subscribe({
164
- next: (response) => {
165
- if (response.success) {
166
- this.types.set(response.data || []);
167
- this.totalItems.set(response.total || 0);
168
- this.updateGridData();
169
- }
170
- else {
171
- this.error.set(response.message || 'Failed to load types');
172
- }
173
- this.loading.set(false);
174
- },
175
- error: (error) => {
176
- console.error('Error loading types:', error);
177
- this.error.set('Failed to load types. Please try again.');
178
- this.loading.set(false);
179
- }
180
- });
181
- }
182
- /**
183
- * Setup form subscriptions
184
- */
185
- setupFormSubscriptions() {
186
- // Watch for form changes to enable/disable save button
187
- this.typeForm.valueChanges
188
- .pipe(takeUntilDestroyed(this.destroyRef))
189
- .subscribe(() => {
190
- // Form validation is handled by computed signals
191
- });
192
- }
193
- /**
194
- * Update grid data
195
- */
196
- updateGridData() {
197
- this.gridConfig.update(config => ({
198
- ...config,
199
- data: this.types()
200
- }));
201
- }
202
- // Computed template renderers for grid
203
- templateRenderers = computed(() => ({
204
- typeDetailsRenderer: this.typeDetailsRendererTemplate(),
205
- typeStatusRenderer: this.typeStatusRendererTemplate(),
206
- actionsDropdownRenderer: this.actionsDropdownRendererTemplate()
207
- }), ...(ngDevMode ? [{ debugName: "templateRenderers" }] : []));
208
- /**
209
- * Handle grid events
210
- */
211
- onGridEvent(event) {
212
- switch (event.type) {
213
- case 'pageChange':
214
- if (event.data && typeof event.data === 'object' && 'pageIndex' in event.data && 'pageSize' in event.data) {
215
- this.currentPage.set(event.data['pageIndex']);
216
- this.pageSize.set(event.data['pageSize']);
217
- this.loadTypes();
218
- }
219
- break;
220
- case 'search':
221
- if (event.data && typeof event.data === 'string') {
222
- this.searchTerm.set(event.data);
223
- this.currentPage.set(1);
224
- this.loadTypes();
225
- }
226
- break;
227
- case 'refresh':
228
- this.loadTypes();
229
- break;
230
- case 'action':
231
- // Handle action events if needed
232
- console.log('Action event:', event);
233
- break;
234
- case 'rowClick':
235
- // Handle row click events if needed
236
- console.log('Row click event:', event);
237
- break;
238
- case 'sort':
239
- // Handle sort events if needed
240
- console.log('Sort event:', event);
241
- break;
242
- case 'export':
243
- // Handle export events if needed
244
- console.log('Export event:', event);
245
- break;
246
- case 'rowReorder':
247
- // Handle row reorder events if needed
248
- console.log('Row reorder event:', event);
249
- break;
250
- }
251
- }
252
- /**
253
- * Create new type
254
- */
255
- createType() {
256
- if (!this.typeForm.valid) {
257
- this.markFormAsTouched();
258
- return;
259
- }
260
- const formValue = this.typeForm.getRawValue();
261
- const newType = {
262
- _id: '', // Empty _id for create operation
263
- sygmt_code: formValue.sygmt_code,
264
- sygmt_title: formValue.sygmt_title,
265
- sygmt_desc: formValue.sygmt_desc,
266
- sygmt_configuration: JSON.parse(formValue.sygmt_configuration),
267
- sygmt_isactive: formValue.sygmt_isactive
268
- };
269
- this.loading.set(true);
270
- this.typeService.saveType(newType)
271
- .pipe(takeUntilDestroyed(this.destroyRef))
272
- .subscribe({
273
- next: (response) => {
274
- if (response.success) {
275
- this.cancelForm();
276
- this.loadTypes();
277
- console.log('✅ Type created successfully');
278
- }
279
- else {
280
- console.error('❌ Failed to create type:', response.message);
281
- }
282
- this.loading.set(false);
283
- },
284
- error: (error) => {
285
- console.error('Error creating type:', error);
286
- console.error('❌ Failed to create type. Please try again.');
287
- this.loading.set(false);
288
- }
289
- });
290
- }
291
- /**
292
- * Update existing type
293
- */
294
- updateType() {
295
- console.log('🔵 updateType called');
296
- console.log('🔵 form valid:', this.typeForm.valid);
297
- console.log('🔵 editingTypeId:', this.editingTypeId());
298
- if (!this.typeForm.valid || !this.editingTypeId()) {
299
- console.log('🔵 Form validation failed or no editing ID');
300
- this.markFormAsTouched();
301
- return;
302
- }
303
- const formValue = this.typeForm.getRawValue();
304
- const updatedType = {
305
- _id: this.editingTypeId(), // Include _id for update operation
306
- sygmt_code: formValue.sygmt_code,
307
- sygmt_title: formValue.sygmt_title,
308
- sygmt_desc: formValue.sygmt_desc,
309
- sygmt_configuration: JSON.parse(formValue.sygmt_configuration || '{}'),
310
- sygmt_isactive: formValue.sygmt_isactive
311
- };
312
- console.log('🔵 Making API call to update type:', updatedType);
313
- this.loading.set(true);
314
- this.typeService.saveType(updatedType)
315
- .pipe(takeUntilDestroyed(this.destroyRef))
316
- .subscribe({
317
- next: (response) => {
318
- console.log('🔵 API response received:', response);
319
- if (response.success) {
320
- this.cancelForm();
321
- this.loadTypes();
322
- console.log('✅ Type updated successfully');
323
- }
324
- else {
325
- console.error('❌ Failed to update type:', response.message);
326
- }
327
- this.loading.set(false);
328
- },
329
- error: (error) => {
330
- console.error('🔵 API error:', error);
331
- console.error('❌ Failed to update type. Please try again.');
332
- this.loading.set(false);
333
- }
334
- });
335
- }
336
- /**
337
- * Edit type
338
- */
339
- editType(type) {
340
- this.isEditMode.set(true);
341
- this.editingTypeId.set(type._id || "");
342
- this.retrievedType.set(type);
343
- this.typeForm.patchValue({
344
- sygmt_code: type.sygmt_code,
345
- sygmt_title: type.sygmt_title,
346
- sygmt_desc: type.sygmt_desc,
347
- sygmt_configuration: JSON.stringify(type.sygmt_configuration, null, 2),
348
- sygmt_isactive: type.sygmt_isactive
349
- });
350
- this.typeForm.markAsPristine();
351
- }
352
- /**
353
- * Delete type
354
- */
355
- deleteType(type) {
356
- if (confirm(`Are you sure you want to delete the type "${type.sygmt_title}"?`)) {
357
- this.loading.set(true);
358
- this.typeService.deleteType(type._id || "")
359
- .pipe(takeUntilDestroyed(this.destroyRef))
360
- .subscribe({
361
- next: (response) => {
362
- if (response.success) {
363
- this.loadTypes();
364
- console.log('✅ Type deleted successfully');
365
- }
366
- else {
367
- console.error('❌ Failed to delete type:', response.message);
368
- }
369
- this.loading.set(false);
370
- },
371
- error: (error) => {
372
- console.error('Error deleting type:', error);
373
- console.error('❌ Failed to delete type. Please try again.');
374
- this.loading.set(false);
375
- }
376
- });
377
- }
378
- }
379
- /**
380
- * Toggle type status
381
- */
382
- toggleTypeStatus(type) {
383
- this.loading.set(true);
384
- this.typeService.toggleTypeStatus({ sygmt_id: type._id || "" })
385
- .pipe(takeUntilDestroyed(this.destroyRef))
386
- .subscribe({
387
- next: (response) => {
388
- if (response.success) {
389
- this.loadTypes();
390
- console.log(`✅ Type ${type.sygmt_isactive ? 'deactivated' : 'activated'} successfully`);
391
- }
392
- else {
393
- console.error('❌ Failed to toggle type status:', response.message);
394
- }
395
- this.loading.set(false);
396
- },
397
- error: (error) => {
398
- console.error('Error toggling type status:', error);
399
- console.error('❌ Failed to toggle type status. Please try again.');
400
- this.loading.set(false);
401
- }
402
- });
403
- }
404
- /**
405
- * Navigate to general master management for this type
406
- */
407
- navigateToGeneralMaster(type) {
408
- const payload = generateStringFromObject({
409
- sygmt_id: type._id,
410
- sygmt_title: type.sygmt_title
411
- });
412
- this.router.navigate(['control-panel', 'general_master_entry', payload]);
413
- }
414
- /**
415
- * Handle form submission event
416
- */
417
- onSubmit(event) {
418
- event.preventDefault();
419
- console.log('🔵 Form onSubmit event triggered');
420
- this.saveType();
421
- }
422
- /**
423
- * Save type (create or update)
424
- */
425
- saveType() {
426
- console.log('🔵 saveType called');
427
- console.log('🔵 isEditMode:', this.isEditMode());
428
- console.log('🔵 editingTypeId:', this.editingTypeId());
429
- console.log('🔵 form valid:', this.typeForm.valid);
430
- console.log('🔵 form values:', this.typeForm.getRawValue());
431
- console.log('🔵 form dirty:', this.typeForm.dirty);
432
- console.log('🔵 form pristine:', this.typeForm.pristine);
433
- console.log('🔵 form touched:', this.typeForm.touched);
434
- if (this.isEditMode()) {
435
- console.log('🔵 Calling updateType');
436
- this.updateType();
437
- }
438
- else {
439
- console.log('🔵 Calling createType');
440
- this.createType();
441
- }
442
- }
443
- /**
444
- * Cancel form (reset to defaults and exit edit mode)
445
- */
446
- cancelForm() {
447
- this.typeForm.reset({
448
- sygmt_code: '',
449
- sygmt_title: '',
450
- sygmt_desc: '',
451
- sygmt_configuration: '{}',
452
- sygmt_isactive: true,
453
- sygmt_id_sygmt: '' // Clear parent type ID
454
- });
455
- this.isEditMode.set(false);
456
- this.editingTypeId.set(null);
457
- this.retrievedType.set(null);
458
- this.typeForm.markAsPristine();
459
- this.typeForm.markAsUntouched();
460
- }
461
- /**
462
- * Mark form as touched to trigger validation display
463
- */
464
- markFormAsTouched() {
465
- Object.keys(this.typeForm.controls).forEach(key => {
466
- const control = this.typeForm.get(key);
467
- control?.markAsTouched();
468
- });
469
- }
470
- /**
471
- * Clear parent type relationship
472
- */
473
- clearParentType() {
474
- this.typeForm.patchValue({
475
- sygmt_id_sygmt: ''
476
- });
477
- console.log('🔵 Parent type relationship cleared');
478
- }
479
- /**
480
- * Get dropdown items for actions
481
- */
482
- getActionDropdownItems(type) {
483
- return [
484
- {
485
- id: 'edit',
486
- label: 'Edit',
487
- icon: 'edit',
488
- disabled: false
489
- },
490
- {
491
- id: 'addChild',
492
- label: 'Add Child',
493
- icon: 'add',
494
- disabled: false
495
- },
496
- {
497
- id: 'general-master',
498
- label: 'General Master',
499
- icon: 'list',
500
- disabled: false
501
- },
502
- {
503
- id: 'toggle',
504
- label: type.sygmt_isactive ? 'Deactivate' : 'Activate',
505
- icon: type.sygmt_isactive ? 'block' : 'check_circle',
506
- disabled: false
507
- },
508
- {
509
- id: 'delete',
510
- label: 'Delete',
511
- icon: 'delete',
512
- disabled: false
513
- }
514
- ];
515
- }
516
- /**
517
- * Get parent type display name
518
- */
519
- getParentTypeDisplay() {
520
- const parentId = this.typeForm.get('sygmt_id_sygmt')?.value;
521
- if (!parentId)
522
- return '';
523
- const parentType = this.types().find(t => t._id === parentId);
524
- return parentType ? (parentType.sygmt_title || 'Unknown Parent') : 'Unknown Parent';
525
- }
526
- /**
527
- * Handle adding a child type
528
- */
529
- onAddChild(parentType) {
530
- console.log('🔵 onAddChild called with:', parentType);
531
- console.log('🔵 Parent title:', parentType.sygmt_title);
532
- // Clear edit mode and retrieved item when adding a child
533
- this.isEditMode.set(false);
534
- this.editingTypeId.set(null);
535
- this.retrievedType.set(null);
536
- // Reset form and pre-fill with parent context
537
- this.typeForm.patchValue({
538
- sygmt_code: '',
539
- sygmt_title: '',
540
- sygmt_desc: '',
541
- sygmt_configuration: '{}',
542
- sygmt_isactive: true,
543
- sygmt_id_sygmt: parentType._id // Set parent type ID
544
- });
545
- // Store the parent type for reference (you can display this in the UI)
546
- console.log('🔵 Ready to add child type for parent:', parentType.sygmt_title);
547
- }
548
- /**
549
- * Handle dropdown item click
550
- */
551
- onDropdownItemClick(item, row) {
552
- console.log('🔵 onDropdownItemClick called with:', item, row);
553
- switch (item.id) {
554
- case 'edit':
555
- console.log('🔵 Calling editType with:', row);
556
- this.editType(row);
557
- break;
558
- case 'addChild':
559
- console.log('🔵 Calling onAddChild with:', row);
560
- this.onAddChild(row);
561
- break;
562
- case 'general-master':
563
- console.log('🔵 Calling navigateToGeneralMaster with:', row);
564
- this.navigateToGeneralMaster(row);
565
- break;
566
- case 'toggle':
567
- console.log('🔵 Calling toggleTypeStatus with:', row);
568
- this.toggleTypeStatus(row);
569
- break;
570
- case 'delete':
571
- console.log('🔵 Calling deleteType with:', row);
572
- this.deleteType(row);
573
- break;
574
- default:
575
- console.log('🔵 Unknown action:', item.id);
576
- }
577
- // Close all dropdowns after action
578
- this.closeAllDropdowns();
579
- }
580
- /**
581
- * Close all dropdowns
582
- */
583
- closeAllDropdowns() {
584
- // Close all dropdowns by clicking outside
585
- const event = new MouseEvent('click', { bubbles: true });
586
- document.dispatchEvent(event);
587
- }
588
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: GeneralMasterTypeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
589
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.7", type: GeneralMasterTypeComponent, isStandalone: true, selector: "cide-core-app-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' : 'Quick Add Type' }}</h6>\n </div>\n \n <!-- Parent Type Info (shown when adding child) -->\n @if (typeForm.get('sygmt_id_sygmt')?.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 <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\">{{ getParentTypeDisplay() }}</span>\n </div>\n <button \n cideEleButton \n variant=\"ghost\" \n size=\"xs\" \n type=\"button\" \n (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 \n formControlName=\"sygmt_code\" \n label=\"Type Code*\" \n placeholder=\"Enter type code\"\n 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 \n formControlName=\"sygmt_title\" \n label=\"Type Title*\" \n placeholder=\"Enter type title\"\n 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 \n formControlName=\"sygmt_isactive\"\n type=\"checkbox\"\n label=\"Active\"\n 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 \n formControlName=\"sygmt_configuration\" \n label=\"Configuration*\" \n 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 \n formControlName=\"sygmt_desc\" \n label=\"Description\" \n placeholder=\"Enter description\"\n size=\"sm\"\n [maxlength]=\"255\" \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)=\"cancelForm()\"\n [disabled]=\"loading()\"\n class=\"tw-px-4 tw-py-2\">\n Cancel\n </button>\n <button \n cideEleButton \n variant=\"primary\" \n size=\"sm\" \n type=\"submit\"\n [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-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 -->\n <div class=\"tw-flex tw-items-center tw-space-x-2\">\n <cide-ele-icon class=\"tw-text-blue-600 tw-w-4 tw-h-4\">category</cide-ele-icon>\n <h5 class=\"tw-text-sm tw-font-medium tw-text-gray-900 tw-m-0\">General Master Type 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-2 sm:tw-space-y-0 sm:tw-space-x-3\">\n\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-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 \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 #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' }}\">{{ 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\"\n [class.tw-text-green-800]=\"row.sygmt_isactive\"\n [class.tw-bg-red-100]=\"!row.sygmt_isactive\"\n [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\n [items]=\"getActionDropdownItems(row)\"\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.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.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.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "component", type: CideEleDataGridComponent, selector: "cide-ele-data-grid", inputs: ["config", "customRenderers", "templateRenderers", "customFormatters", "actionHandlers", "serverSidePagination", "totalServerItems", "currentServerPage", "currentServerPageSize", "dragDropEnabled"], outputs: ["gridEvent"] }, { kind: "component", type: CideEleButtonComponent, selector: "button[cideEleButton], a[cideEleButton]", 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", "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"] }] });
590
- }
591
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: GeneralMasterTypeComponent, decorators: [{
592
- type: Component,
593
- args: [{ selector: 'cide-core-app-general-master-type', standalone: true, imports: [
594
- CommonModule,
595
- ReactiveFormsModule,
596
- FormsModule,
597
- CideEleDataGridComponent,
598
- CideEleButtonComponent,
599
- CideInputComponent,
600
- CideSelectComponent,
601
- CideTextareaComponent,
602
- CideIconComponent,
603
- CideEleDropdownComponent,
604
- CideEleJsonEditorComponent
605
- ], 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' : 'Quick Add Type' }}</h6>\n </div>\n \n <!-- Parent Type Info (shown when adding child) -->\n @if (typeForm.get('sygmt_id_sygmt')?.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 <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\">{{ getParentTypeDisplay() }}</span>\n </div>\n <button \n cideEleButton \n variant=\"ghost\" \n size=\"xs\" \n type=\"button\" \n (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 \n formControlName=\"sygmt_code\" \n label=\"Type Code*\" \n placeholder=\"Enter type code\"\n 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 \n formControlName=\"sygmt_title\" \n label=\"Type Title*\" \n placeholder=\"Enter type title\"\n 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 \n formControlName=\"sygmt_isactive\"\n type=\"checkbox\"\n label=\"Active\"\n 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 \n formControlName=\"sygmt_configuration\" \n label=\"Configuration*\" \n 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 \n formControlName=\"sygmt_desc\" \n label=\"Description\" \n placeholder=\"Enter description\"\n size=\"sm\"\n [maxlength]=\"255\" \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)=\"cancelForm()\"\n [disabled]=\"loading()\"\n class=\"tw-px-4 tw-py-2\">\n Cancel\n </button>\n <button \n cideEleButton \n variant=\"primary\" \n size=\"sm\" \n type=\"submit\"\n [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-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 -->\n <div class=\"tw-flex tw-items-center tw-space-x-2\">\n <cide-ele-icon class=\"tw-text-blue-600 tw-w-4 tw-h-4\">category</cide-ele-icon>\n <h5 class=\"tw-text-sm tw-font-medium tw-text-gray-900 tw-m-0\">General Master Type 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-2 sm:tw-space-y-0 sm:tw-space-x-3\">\n\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-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 \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 #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' }}\">{{ 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\"\n [class.tw-text-green-800]=\"row.sygmt_isactive\"\n [class.tw-bg-red-100]=\"!row.sygmt_isactive\"\n [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\n [items]=\"getActionDropdownItems(row)\"\n (itemClick)=\"onDropdownItemClick($event, row)\">\n </cide-ele-dropdown>\n</ng-template>" }]
606
- }] });
607
-
608
- export { GeneralMasterTypeComponent };
609
- //# sourceMappingURL=cloud-ide-core-general-master-type.component-OPaXxAXW.mjs.map