cat-qw-lib 2.6.31 → 2.6.32

package/fesm2022/cat-qw-lib.mjs

@@ -3945,6 +3945,7 @@ class WidgetAdminFormComponent extends BaseFormComponent {
     badgeDictionaryItemArray = [];
     widgetOptionsArray = [];
     widgetLayoutTypeList = widgetLayoutTypeList;
+    enableDictionaryDebugLogs = true;
     constructor(service, validatorService, widgetStore, query, router, activatedRoute, baseStore, baseQuery) {
         super(service, validatorService, router, activatedRoute);
         this.service = service;
@@ -3965,16 +3966,36 @@ class WidgetAdminFormComponent extends BaseFormComponent {
         super.init();
         this.baseStore.setIsApiValidated(null);
         this.recordChange.asObservable().subscribe((record) => {
-            // Ensure arrays are initialized
-            if (!record.dataItems)
-                record.dataItems = [];
-            if (!record.badges)
-                record.badges = [];
-            this.normalizeLoadedRecordStyles(record);
+            // recordChange can emit readonly store objects; clone before normalization/mutation.
+            const editableRecord = structuredClone((record || {}));
+            const withAliases = this.normalizeIncomingDictionaryAliases(editableRecord);
+            const withStyles = this.normalizeLoadedRecordStyles(withAliases);
+            this.record = withStyles;
+            // Hydrate dependent dictionary-item dropdown arrays immediately on edit load.
+            this.refreshDictionaryItemListsForRecord();
             // Dictionaries are scoped by apiConfigId (not queueID — that field does not exist on widget).
-            this.handleAPIChange(record.apiConfigId);
+            this.handleAPIChange(this.record.apiConfigId);
         });
     }
+    /**
+     * Normalize backend dictionary keys into UI form keys on edit load.
+     * This lets dropdowns preselect values immediately without user re-selection.
+     */
+    normalizeIncomingDictionaryAliases(record) {
+        return {
+            ...record,
+            dataItems: (record.dataItems || []).map((item) => ({
+                ...item,
+                dataDictionaryId: item.dataDictionaryId || item.dictionaryID || '',
+                dictionaryItemId: item.dictionaryItemId || item.dictionaryItemID || '',
+            })),
+            badges: (record.badges || []).map((badge) => ({
+                ...badge,
+                dataDictionaryId: badge.dataDictionaryId || badge.dictionaryID || '',
+                dictionaryItemId: badge.dictionaryItemId || badge.dictionaryItemID || '',
+            })),
+        };
+    }
     handleWidgetItemAddBtnClick() {
         if (!(this.record.name && this.record.apiConfigId))
             return;
@@ -3999,9 +4020,25 @@ class WidgetAdminFormComponent extends BaseFormComponent {
     }
     handleAPIChange(apiConfigId) {
         this.query.getLists().subscribe((allLists) => {
-            const allDictionaryRecords = allLists.find((list) => list.forProperty === 'dataDictionaryId')?.records;
+            const dictionaryListMeta = allLists.find((list) => list.forProperty === 'dataDictionaryId' || list.forProperty === 'dictionaryID');
+            const allDictionaryRecords = dictionaryListMeta?.records;
+            if (this.enableDictionaryDebugLogs) {
+                console.log('[WidgetAdmin] dictionary list resolved', {
+                    expectedForProperty: ['dataDictionaryId', 'dictionaryID'],
+                    actualForProperty: dictionaryListMeta?.forProperty,
+                    dataSource: dictionaryListMeta?.dataSource,
+                    totalRecords: allDictionaryRecords?.length || 0,
+                    selectedApiConfigId: apiConfigId
+                });
+            }
             this.dictionaries =
                 allDictionaryRecords?.filter((item) => String(item.apiConfigId ?? item.apiConfigID ?? '') === String(apiConfigId ?? '')) || [];
+            if (this.enableDictionaryDebugLogs) {
+                console.log('[WidgetAdmin] dictionary records after apiConfigId filter', {
+                    selectedApiConfigId: apiConfigId,
+                    filteredCount: this.dictionaries.length,
+                });
+            }
             this.refreshDictionaryItemListsForRecord();
         });
     }
@@ -4011,7 +4048,16 @@ class WidgetAdminFormComponent extends BaseFormComponent {
      */
     refreshDictionaryItemListsForRecord() {
         this.query.getLists().subscribe((allLists) => {
-            const allDictionaryItemRecords = allLists.find((list) => list.forProperty === 'dictionaryItemId')?.records || [];
+            const dictionaryItemListMeta = allLists.find((list) => list.forProperty === 'dictionaryItemId' || list.forProperty === 'dictionaryItemID');
+            const allDictionaryItemRecords = dictionaryItemListMeta?.records || [];
+            if (this.enableDictionaryDebugLogs) {
+                console.log('[WidgetAdmin] dictionary item list resolved', {
+                    expectedForProperty: ['dictionaryItemId', 'dictionaryItemID'],
+                    actualForProperty: dictionaryItemListMeta?.forProperty,
+                    dataSource: dictionaryItemListMeta?.dataSource,
+                    totalRecords: allDictionaryItemRecords.length,
+                });
+            }
             const itemsForDictionary = (dictionaryId) => this.getDictionaryItemsByDictionaryId(allDictionaryItemRecords, dictionaryId);
             const r = this.record;
             this.headerDictionaryItems = itemsForDictionary(r.headerDictionaryID);
@@ -4024,8 +4070,14 @@ class WidgetAdminFormComponent extends BaseFormComponent {
         if (!dictionaryId) {
             return [];
         }
-        const byLegacyDictionaryId = allDictionaryItemRecords.filter((item) => item.dataDictionaryId === dictionaryId);
+        const byLegacyDictionaryId = allDictionaryItemRecords.filter((item) => item.dataDictionaryId === dictionaryId || item.dictionaryID === dictionaryId);
         if (byLegacyDictionaryId.length > 0) {
+            if (this.enableDictionaryDebugLogs) {
+                console.log('[WidgetAdmin] dictionary items matched by dictionary id relation', {
+                    dictionaryId,
+                    matchedCount: byLegacyDictionaryId.length
+                });
+            }
             return byLegacyDictionaryId;
         }
         const selectedDictionary = this.dictionaries.find((d) => d._id === dictionaryId);
@@ -4034,23 +4086,31 @@ class WidgetAdminFormComponent extends BaseFormComponent {
             return [];
         }
         const dictionaryItemsIdSet = new Set(dictionaryItemsIds.map((id) => String(id)));
-        return allDictionaryItemRecords.filter((item) => dictionaryItemsIdSet.has(String(item._id)));
+        const byDictionaryItemsIds = allDictionaryItemRecords.filter((item) => dictionaryItemsIdSet.has(String(item._id)));
+        if (this.enableDictionaryDebugLogs) {
+            console.log('[WidgetAdmin] dictionary items matched by dictionaryItemsIds fallback', {
+                dictionaryId,
+                dictionaryItemsIdsCount: dictionaryItemsIds.length,
+                matchedCount: byDictionaryItemsIds.length
+            });
+        }
+        return byDictionaryItemsIds;
     }
     handleHeaderDictionarySelect(dictionaryId) {
         this.query.getLists().subscribe((allLists) => {
-            const allDictionaryItemRecords = allLists.find((list) => list.forProperty === 'dictionaryItemId')?.records;
+            const allDictionaryItemRecords = allLists.find((list) => list.forProperty === 'dictionaryItemId' || list.forProperty === 'dictionaryItemID')?.records;
             this.headerDictionaryItems = this.getDictionaryItemsByDictionaryId(allDictionaryItemRecords || [], dictionaryId);
         });
     }
     handleSubHeaderDictionarySelect(dictionaryId) {
         this.query.getLists().subscribe((allLists) => {
-            const allDictionaryItemRecords = allLists.find((list) => list.forProperty === 'dictionaryItemId')?.records;
+            const allDictionaryItemRecords = allLists.find((list) => list.forProperty === 'dictionaryItemId' || list.forProperty === 'dictionaryItemID')?.records;
             this.subHeaderDictionaryItems = this.getDictionaryItemsByDictionaryId(allDictionaryItemRecords || [], dictionaryId);
         });
     }
     handleWidgetItemDictionarySelect(dictionaryId, index) {
         this.query.getLists().subscribe((allLists) => {
-            const allDictionaryItemRecords = allLists.find((list) => list.forProperty === 'dictionaryItemId')?.records;
+            const allDictionaryItemRecords = allLists.find((list) => list.forProperty === 'dictionaryItemId' || list.forProperty === 'dictionaryItemID')?.records;
             this.dictionaryItemArray[index] = this.getDictionaryItemsByDictionaryId(allDictionaryItemRecords || [], dictionaryId);
         });
     }
@@ -4077,7 +4137,7 @@ class WidgetAdminFormComponent extends BaseFormComponent {
     }
     handleBadgeDictionarySelect(dictionaryId, index) {
         this.query.getLists().subscribe((allLists) => {
-            const allDictionaryItemRecords = allLists.find((list) => list.forProperty === 'dictionaryItemId')?.records;
+            const allDictionaryItemRecords = allLists.find((list) => list.forProperty === 'dictionaryItemId' || list.forProperty === 'dictionaryItemID')?.records;
             this.badgeDictionaryItemArray[index] = this.getDictionaryItemsByDictionaryId(allDictionaryItemRecords || [], dictionaryId);
         });
     }
@@ -4103,14 +4163,18 @@ class WidgetAdminFormComponent extends BaseFormComponent {
      * Text-box controls expect stringified JSON; API returns nested objects → "[object Object]" without this.
      */
     normalizeLoadedRecordStyles(record) {
-        // Always normalize top-level style for text-box binding.
-        record.style = this.service.coerceStyleToJsonText(record.style);
-        record.dataItems?.forEach((item) => {
-            item.style = this.service.coerceStyleToJsonText(item.style);
-        });
-        record.badges?.forEach((badge) => {
-            badge.style = this.service.coerceStyleToJsonText(badge.style);
-        });
+        return {
+            ...record,
+            style: this.service.coerceStyleToJsonText(record.style),
+            dataItems: (record.dataItems || []).map((item) => ({
+                ...item,
+                style: this.service.coerceStyleToJsonText(item.style),
+            })),
+            badges: (record.badges || []).map((badge) => ({
+                ...badge,
+                style: this.service.coerceStyleToJsonText(badge.style),
+            })),
+        };
     }
     handleSubmit() {
         this.record.style = this.service.parseStylePayload(this.record.style);