diff --git a/stores/processBuilder.js b/stores/processBuilder.js
index 8f0545e..3b34d89 100644
--- a/stores/processBuilder.js
+++ b/stores/processBuilder.js
@@ -813,6 +813,189 @@ export const useProcessBuilderStore = defineStore('processBuilder', {
}
},
+ /**
+ * Add a child node to a PageWrapper parent
+ */
+ addChildNode(parentId, childNodeConfig) {
+ if (!this.currentProcess) return;
+
+ const parentNode = this.currentProcess.nodes.find(n => n.id === parentId);
+ if (!parentNode || parentNode.type !== 'page-wrapper') {
+ console.warn('Parent node not found or not a PageWrapper:', parentId);
+ return;
+ }
+
+ // Ensure childNodes array exists
+ if (!parentNode.data.childNodes) {
+ parentNode.data.childNodes = [];
+ }
+
+ // Generate unique child node ID if not provided
+ const childNode = {
+ id: childNodeConfig.id || `child-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`,
+ type: childNodeConfig.type || 'form',
+ nodeId: childNodeConfig.nodeId || '',
+ position: childNodeConfig.position || { row: 1, col: 1 },
+ conditionalLogic: {
+ enabled: false,
+ variable: '',
+ operator: '==',
+ value: '',
+ ...childNodeConfig.conditionalLogic
+ },
+ variableMapping: {
+ inputs: [],
+ outputs: [],
+ ...childNodeConfig.variableMapping
+ }
+ };
+
+ parentNode.data.childNodes.push(childNode);
+ this.saveToHistory('Add child node');
+ this.unsavedChanges = true;
+
+ console.log('👶 Store: Added child node', childNode.id, 'to parent', parentId);
+ return childNode;
+ },
+
+ /**
+ * Update a child node within a PageWrapper parent
+ */
+ updateChildNode(parentId, childId, updates) {
+ if (!this.currentProcess) return;
+
+ const parentNode = this.currentProcess.nodes.find(n => n.id === parentId);
+ if (!parentNode || parentNode.type !== 'page-wrapper') {
+ console.warn('Parent node not found or not a PageWrapper:', parentId);
+ return;
+ }
+
+ if (!parentNode.data.childNodes) {
+ return;
+ }
+
+ const childIndex = parentNode.data.childNodes.findIndex(c => c.id === childId);
+ if (childIndex !== -1) {
+ Object.assign(parentNode.data.childNodes[childIndex], updates);
+ this.saveToHistory('Update child node');
+ this.unsavedChanges = true;
+
+ console.log('📝 Store: Updated child node', childId, 'in parent', parentId);
+ }
+ },
+
+ /**
+ * Remove a child node from a PageWrapper parent
+ */
+ removeChildNode(parentId, childId) {
+ if (!this.currentProcess) return;
+
+ const parentNode = this.currentProcess.nodes.find(n => n.id === parentId);
+ if (!parentNode || parentNode.type !== 'page-wrapper') {
+ console.warn('Parent node not found or not a PageWrapper:', parentId);
+ return;
+ }
+
+ if (!parentNode.data.childNodes) {
+ return;
+ }
+
+ const childIndex = parentNode.data.childNodes.findIndex(c => c.id === childId);
+ if (childIndex !== -1) {
+ parentNode.data.childNodes.splice(childIndex, 1);
+ this.saveToHistory('Remove child node');
+ this.unsavedChanges = true;
+
+ console.log('🗑️ Store: Removed child node', childId, 'from parent', parentId);
+ return true;
+ }
+
+ return false;
+ },
+
+ /**
+ * Get all child nodes for a PageWrapper parent
+ */
+ getChildNodes(parentId) {
+ if (!this.currentProcess) return [];
+
+ const parentNode = this.currentProcess.nodes.find(n => n.id === parentId);
+ if (!parentNode || parentNode.type !== 'page-wrapper') {
+ return [];
+ }
+
+ return parentNode.data.childNodes || [];
+ },
+
+ /**
+ * Get a specific child node by ID
+ */
+ getChildNode(parentId, childId) {
+ const childNodes = this.getChildNodes(parentId);
+ return childNodes.find(c => c.id === childId) || null;
+ },
+
+ /**
+ * Check if a node is a child node (has a parent)
+ */
+ isChildNode(nodeId) {
+ if (!this.currentProcess) return false;
+
+ // Find any PageWrapper node that contains this node as a child
+ return this.currentProcess.nodes.some(node => {
+ if (node.type === 'page-wrapper' && node.data.childNodes) {
+ return node.data.childNodes.some(child => child.nodeId === nodeId);
+ }
+ return false;
+ });
+ },
+
+ /**
+ * Get the parent node ID for a child node
+ */
+ getParentNodeId(childNodeId) {
+ if (!this.currentProcess) return null;
+
+ const parentNode = this.currentProcess.nodes.find(node => {
+ if (node.type === 'page-wrapper' && node.data.childNodes) {
+ return node.data.childNodes.some(child => child.nodeId === childNodeId);
+ }
+ return false;
+ });
+
+ return parentNode ? parentNode.id : null;
+ },
+
+ /**
+ * Enhanced delete node that handles PageWrapper child nodes
+ */
+ deleteNodeWithChildren(nodeId) {
+ if (!this.currentProcess) return;
+
+ const node = this.currentProcess.nodes.find(n => n.id === nodeId);
+ if (!node) return false;
+
+ // If it's a PageWrapper, we don't need to do anything special
+ // Child nodes are just configuration data, not separate process nodes
+
+ // If it's a regular node that might be referenced by child nodes,
+ // we should clean up those references
+ if (node.type === 'form' || node.type === 'html' || node.type === 'table') {
+ // Find any PageWrapper nodes that reference this node as a child
+ this.currentProcess.nodes.forEach(parentNode => {
+ if (parentNode.type === 'page-wrapper' && parentNode.data.childNodes) {
+ // Remove any child node configurations that reference this node
+ parentNode.data.childNodes = parentNode.data.childNodes.filter(
+ child => child.nodeId !== nodeId
+ );
+ }
+ });
+ }
+
+ // Now delete the node normally
+ return this.deleteNode(nodeId);
+ },
+
/**
* Add an edge to the current process
*/