cloud-ide-element 1.0.65 → 1.0.67

package/fesm2022/cloud-ide-element.mjs

@@ -4714,8 +4714,14 @@ class CideEleDataGridComponent {
         let processedData = data;
         // Transform to tree structure if tree config is enabled
         if (this.mergedConfig().tree?.enabled) {
+            // Preserve expansion state from current data before transforming
+            const currentData = this.internalData();
+            const expansionState = this.preserveTreeExpansionState(currentData);
             processedData = this.transformToTree(data);
             console.log('processedData', processedData);
+            // Apply preserved expansion state to new tree data
+            processedData = this.applyTreeExpansionState(processedData, expansionState);
+            console.log('processedData with preserved expansion state', processedData);
         }
         this.internalData.set(processedData);
         console.log('processedData', processedData);
@@ -4747,7 +4753,12 @@ class CideEleDataGridComponent {
         let data = this.config?.data || [];
         // Transform to tree structure if tree config is enabled
         if (this.mergedConfig().tree?.enabled) {
+            // Preserve expansion state from current data before transforming
+            const currentData = this.internalData();
+            const expansionState = this.preserveTreeExpansionState(currentData);
             data = this.transformToTree(data);
+            // Apply preserved expansion state to new tree data
+            data = this.applyTreeExpansionState(data, expansionState);
         }
         this.internalData.set(data);
         // Set pagination values based on mode
@@ -4878,6 +4889,59 @@ class CideEleDataGridComponent {
         }
         this.updatePaginationState();
     }
+    /**
+     * Preserve tree expansion state from current data
+     */
+    preserveTreeExpansionState(currentData) {
+        const expansionState = new Map();
+        const treeConfig = this.mergedConfig().tree;
+        if (!treeConfig)
+            return expansionState;
+        const { expandedKey = 'isExpanded', primaryKey } = treeConfig;
+        const extractExpansionState = (items) => {
+            items.forEach(item => {
+                const itemId = String(this.getNestedValue(item, primaryKey) || '');
+                if (itemId) {
+                    const isExpanded = this.getNestedValue(item, expandedKey) || false;
+                    expansionState.set(itemId, isExpanded);
+                }
+                // Check for children recursively
+                const children = this.getNestedValue(item, treeConfig.childrenKey || 'children') || [];
+                if (children.length > 0) {
+                    extractExpansionState(children);
+                }
+            });
+        };
+        extractExpansionState(currentData);
+        console.log('🔍 DataGrid: Preserved expansion state for', expansionState.size, 'items');
+        return expansionState;
+    }
+    /**
+     * Apply preserved tree expansion state to new data
+     */
+    applyTreeExpansionState(data, expansionState) {
+        const treeConfig = this.mergedConfig().tree;
+        if (!treeConfig)
+            return data;
+        const { expandedKey = 'isExpanded', primaryKey, childrenKey = 'children' } = treeConfig;
+        const applyToItems = (items) => {
+            return items.map(item => {
+                const itemId = String(this.getNestedValue(item, primaryKey) || '');
+                const isExpanded = expansionState.get(itemId) || false;
+                const updatedItem = {
+                    ...item,
+                    [expandedKey]: isExpanded
+                };
+                // Apply to children recursively
+                const children = this.getNestedValue(item, childrenKey) || [];
+                if (children.length > 0) {
+                    this.setNestedValue(updatedItem, childrenKey, applyToItems(children));
+                }
+                return updatedItem;
+            });
+        };
+        return applyToItems(data);
+    }
     /**
      * Transform flat data to tree structure based on foreign key relationships
      */
@@ -5567,10 +5631,17 @@ class CideEleDataGridComponent {
                     const baseOrder = Math.min(...this.displayedData.map(item => this.getItemOrder(item)));
                     const newOrderValue = baseOrder + index;
                     currentEntry.newPosition = newOrderValue;
+                    // IMPORTANT: Update the actual sequence value in the item itself
+                    this.setNestedValue(item, dragDropConfig.orderField, newOrderValue);
                 }
                 else {
                     // Fallback to index-based position
-                    currentEntry.newPosition = index + 1;
+                    const newOrderValue = index + 1;
+                    currentEntry.newPosition = newOrderValue;
+                    // Update the actual sequence value in the item itself
+                    if (dragDropConfig?.orderField) {
+                        this.setNestedValue(item, dragDropConfig.orderField, newOrderValue);
+                    }
                 }
                 this.rowOrderMap.set(itemId, currentEntry);
             }
@@ -5658,6 +5729,23 @@ class CideEleDataGridComponent {
             .sort((a, b) => a.newPosition - b.newPosition)
             .map(orderedItem => orderedItem.item);
     }
+    /**
+     * Get only the items that have actually changed order
+     */
+    getChangedOrders() {
+        const changedItems = [];
+        // Get the full dataset from the config
+        const fullData = this.mergedConfig().data || [];
+        // Check each item to see if its position has changed
+        this.rowOrderMap.forEach((orderInfo, itemId) => {
+            const item = fullData.find(dataItem => this.getItemId(dataItem) === itemId);
+            if (item && orderInfo.oldPosition !== orderInfo.newPosition) {
+                changedItems.push(item);
+                console.log('🔍 Item changed order:', itemId, 'from', orderInfo.oldPosition, 'to', orderInfo.newPosition);
+            }
+        });
+        return changedItems;
+    }
     /**
      * Update local data order for visual reordering (LOCAL ONLY)
      */
@@ -5709,25 +5797,32 @@ class CideEleDataGridComponent {
             console.log('🔍 Reset clicked, row order map reset locally, visual display reverted');
         }
         else if (action.key === 'save-order') {
-            this.hasOrderChanged.set(false);
-            // Update the row order map to current positions as new baseline
-            this.updateRowOrderMapBaseline();
-            // Clear local reordered data as it's now the baseline
-            this.localReorderedData = [];
-            console.log('🔍 Save clicked, row order map updated to new baseline, local data cleared');
-            // NOW emit the reorder event to update external components
-            const currentOrder = this.getCurrentOrderFromMap();
-            if (currentOrder.length > 0) {
-                console.log('🔍 Emitting rowReorder event to update external components:', currentOrder);
+            // Check if there are any actual changes before proceeding
+            const hasActualChanges = this.checkIfOrderChanged();
+            if (!hasActualChanges) {
+                console.log('🔍 No actual order changes detected, skipping save');
+                this.hasOrderChanged.set(false);
+                return;
+            }
+            // Get only the changed orders and emit them BEFORE clearing local data
+            const changedOrders = this.getChangedOrders();
+            if (changedOrders.length > 0) {
+                console.log('🔍 Emitting rowReorder event with changed orders only:', changedOrders);
+                console.log('🔍 Number of changed records:', changedOrders.length, 'out of', this.getCurrentOrderFromMap().length, 'total records');
                 // Use the expected GridEvent structure for rowReorder
                 this.emitEvent('rowReorder', {
-                    sourceItem: currentOrder[0], // First item as source
+                    sourceItem: changedOrders[0], // First changed item as source
                     sourceIndex: 0, // First position as source
-                    targetItem: currentOrder[currentOrder.length - 1], // Last item as target
-                    targetIndex: currentOrder.length - 1, // Last position as target
-                    newOrder: currentOrder // The complete new order
+                    targetItem: changedOrders[changedOrders.length - 1], // Last changed item as target
+                    targetIndex: changedOrders.length - 1, // Last position as target
+                    newOrder: changedOrders, // Only the records whose order actually changed
+                    allOrders: this.getCurrentOrderFromMap() // Complete order for reference
                 });
             }
+            // DON'T clear the local data or reset the order map here
+            // Let the parent component handle the data refresh after API call
+            // The local data will be cleared when new data arrives via ngOnChanges
+            console.log('🔍 Save clicked, rowReorder event emitted, preserving local data until API response');
         }
         if (this.actionHandlers[action.onClick]) {
             this.actionHandlers[action.onClick](item, action);
@@ -5753,6 +5848,60 @@ class CideEleDataGridComponent {
             return current && typeof current === 'object' ? current[key] : undefined;
         }, obj);
     }
+    /**
+     * Set a nested value in an object using dot notation
+     * @param obj The object to modify
+     * @param path The dot notation path (e.g., 'contact.email')
+     * @param value The value to set
+     * @example
+     * const obj = { contact: { email: 'old@example.com' } };
+     * setNestedValue(obj, 'contact.email', 'new@example.com');
+     * // obj.contact.email === 'new@example.com'
+     */
+    setNestedValue(obj, path, value) {
+        const keys = path.split('.');
+        const lastKey = keys.pop();
+        const target = keys.reduce((current, key) => {
+            if (current && typeof current === 'object') {
+                if (!current[key]) {
+                    current[key] = {};
+                }
+                return current[key];
+            }
+            return undefined;
+        }, obj);
+        if (target && typeof target === 'object') {
+            target[lastKey] = value;
+        }
+    }
+    /**
+     * Compare two order arrays to check if they are different
+     * This method can be used by parent components to check if order has actually changed
+     * @param currentOrder Current order array
+     * @param originalOrder Original order array
+     * @returns true if orders are different, false if they are the same
+     */
+    compareOrders(currentOrder, originalOrder) {
+        console.log('🔍 DataGrid: Comparing orders - current length:', currentOrder.length, 'original length:', originalOrder.length);
+        // If lengths are different, there are changes
+        if (currentOrder.length !== originalOrder.length) {
+            console.log('🔍 DataGrid: Lengths are different, returning true');
+            return true;
+        }
+        // Compare the order of items by their IDs (not just their sequence values)
+        // This will detect if items have been reordered even if sequence values are the same
+        for (let i = 0; i < currentOrder.length; i++) {
+            const currentItem = currentOrder[i];
+            const originalItem = originalOrder[i];
+            console.log('🔍 DataGrid: Position', i, '- Current ID:', currentItem.id, 'Original ID:', originalItem.id);
+            if (currentItem.id !== originalItem.id) {
+                console.log('🔍 DataGrid: Different item at position', i, 'returning true');
+                return true;
+            }
+        }
+        console.log('🔍 DataGrid: No differences found, returning false');
+        return false;
+    }
     formatValue(value, column) {
         if (column.formatter) {
             if (column.formatter.type === 'custom' && column.formatter.customFunction) {