diff --git a/doc/README.md b/doc/README.md index 81a22ce..85a7db2 100644 --- a/doc/README.md +++ b/doc/README.md @@ -73,6 +73,18 @@ Last updated: December 2024 - **Advanced Configuration Options**: Professional-grade settings comparable to enterprise BPM platforms - **Enhanced State Management**: Improved process store with settings persistence and history tracking +### December 2024 - Process Builder Critical Fixes & Database Integration +- **Database Integration**: Complete API system with REST endpoints for all process operations +- **URL Parameter Support**: Direct process linking via `/process-builder?id={uuid}` pattern +- **Save Functionality**: Enhanced with success/error messages and proper state management +- **Navigation Improvements**: Fixed unsaved changes detection and automatic URL synchronization +- **Connection Dragging Fix**: Resolved Vue Flow interference preventing connector dragging +- **Backward Compatibility**: Legacy process definitions with embedded nodes automatically upgraded +- **Toast Notifications**: Comprehensive user feedback system for all operations +- **Performance Optimizations**: Reduced re-renders and improved memory management +- **Error Handling**: Robust validation and graceful error recovery throughout system +- **UI Consistency**: Updated form builder management to match process builder design patterns + ### December 2024 - Major Form Builder Enhancements - **JavaScript Execution Engine**: Added FormScriptEngine component for real-time calculations - **Dynamic Field Updates**: Implemented onFieldChange and onLoad event handlers diff --git a/doc/process-builder/ROADMAP.md b/doc/process-builder/ROADMAP.md index 4ac7914..4c922a9 100644 --- a/doc/process-builder/ROADMAP.md +++ b/doc/process-builder/ROADMAP.md @@ -23,6 +23,46 @@ Implemented comprehensive process configuration management with a professional-g - Comprehensive TypeScript interfaces for settings structure - Future-ready API integration patterns documented +### December 2024 - Database Integration & API System +**Status: Completed** ✅ + +Complete database integration replacing local state with persistent storage: + +- **REST API Endpoints**: Full CRUD operations for processes with pagination, search, and filtering +- **Advanced Operations**: Process duplication, publishing, and template management +- **URL Parameter System**: Direct process linking via `/process-builder?id={uuid}` pattern +- **Navigation Integration**: Seamless routing between management and builder interfaces +- **Error Handling**: Comprehensive validation and graceful error recovery +- **Backward Compatibility**: Automatic upgrade of legacy process definitions +- **Toast Notifications**: User feedback system for all operations +- **Data Validation**: Robust Zod schemas ensuring data integrity + +**Technical Implementation:** +- Complete API system in `/server/api/process/` with UUID and numeric ID support +- Enhanced process store with database integration and smart caching +- URL parameter handling with route watching and error recovery +- Success/error messaging with toast notification fallbacks +- Migration-ready database schema with comprehensive process metadata + +### December 2024 - Vue Flow Integration Fixes +**Status: Completed** ✅ + +Critical performance and functionality fixes for Vue Flow integration: + +- **Connection Dragging Fix**: Resolved interference preventing connector dragging between nodes +- **Performance Optimizations**: Reduced re-renders and improved memory management +- **State Synchronization**: Enhanced bidirectional data flow between store and Vue Flow +- **Drag State Management**: Proper handling of node dragging without store interference +- **Memory Management**: Cleanup of watchers and event listeners to prevent leaks +- **Debounced Updates**: Smooth position syncing without blocking user interactions + +**Technical Implementation:** +- Optimized node sync handling with drag state awareness +- Enhanced edge change detection with duplicate prevention +- Improved computed properties for reactive data binding +- Proper lifecycle management with cleanup on component unmount +- Debounced position synchronization for smooth user experience + ### December 2024 - Enhanced Form Node Configuration **Status: Completed** ✅ diff --git a/doc/process-builder/TECHNICAL_GUIDE.md b/doc/process-builder/TECHNICAL_GUIDE.md index 391daf0..3366431 100644 --- a/doc/process-builder/TECHNICAL_GUIDE.md +++ b/doc/process-builder/TECHNICAL_GUIDE.md @@ -4,6 +4,23 @@ This document provides technical implementation details for developers working w > For user documentation and usage guidelines, please refer to [Process Builder Documentation](USER_GUIDE.md) +## Recent Updates (December 2024) + +### Critical Bug Fixes and Enhancements +- **Process Definition Loading**: Fixed issue where processes with empty nodes array but nodes embedded in edges wouldn't display on canvas +- **URL Parameter Support**: Added direct linking to processes via `/process-builder?id=uuid` pattern +- **Save Functionality**: Enhanced with success/error messages and proper state management +- **Navigation State**: Fixed unsaved changes modal appearing after successful saves +- **Connection Dragging**: Resolved Vue Flow interference with connector dragging functionality +- **Database Integration**: Full API integration with comprehensive error handling and validation +- **Toast Notifications**: Implemented user feedback system for all operations +- **Form Builder Consistency**: Updated form builder manage page to match process builder design + +### Breaking Changes +- Process store now requires API integration for all operations +- Local state has been eliminated in favor of database-driven architecture +- URL parameters are now required for process editing workflows + ## Architecture Overview ### Technology Stack @@ -55,6 +72,640 @@ types/ └── process-builder.d.ts # TypeScript definitions ``` +## URL Parameter System + +The Process Builder now supports direct linking to specific processes via URL parameters, enabling seamless navigation and bookmarking. + +### Implementation + +#### Route Handling +```javascript +// pages/process-builder/index.vue +const route = useRoute(); +const router = useRouter(); + +// Watch for URL parameter changes +watch(() => route.query.id, async (newId, oldId) => { + if (newId && newId !== oldId) { + try { + await loadProcessFromUrl(newId); + } catch (error) { + console.error('Error loading process from URL:', error); + // Redirect to clean state on error + router.push('/process-builder'); + } + } +}, { immediate: true }); + +// Load process from URL parameter +const loadProcessFromUrl = async (processId) => { + if (!processId || processId === 'new') return; + + try { + setLoading(true); + await processStore.loadProcess(processId); + + if (!processStore.currentProcess) { + throw new Error('Process not found'); + } + + // Update URL without triggering navigation + await router.replace({ + path: '/process-builder', + query: { id: processId } + }); + + } catch (error) { + console.error('Failed to load process:', error); + toast.error('Failed to load process: ' + (error.message || 'Unknown error')); + + // Clear invalid URL parameter + await router.replace('/process-builder'); + } finally { + setLoading(false); + } +}; +``` + +#### Navigation Updates +```javascript +// Create new process with URL update +const createNewProcess = async () => { + try { + processStore.clearProcess(); + // Navigate to clean URL for new process + await router.push('/process-builder'); + } catch (error) { + console.error('Error creating new process:', error); + } +}; + +// Save process with URL synchronization +const saveProcess = async () => { + try { + const result = await processStore.saveProcess(); + + if (result && result.id) { + // Update URL with saved process ID + await router.replace({ + path: '/process-builder', + query: { id: result.id } + }); + + toast.success('Process saved successfully'); + } + } catch (error) { + toast.error('Failed to save process'); + } +}; +``` + +### URL Patterns + +- **New Process**: `/process-builder` (no parameters) +- **Edit Process**: `/process-builder?id={uuid}` +- **Navigation**: Automatic URL updates when saving new processes +- **Validation**: Invalid IDs redirect to clean builder state + +### Error Handling + +- **Invalid Process ID**: Graceful fallback to new process state +- **Network Errors**: User-friendly error messages with toast notifications +- **Missing Processes**: Automatic cleanup of invalid URL parameters +- **Loading States**: Visual feedback during process loading + +### Integration Points + +- **Process Management**: Direct links from manage page to builder +- **Form Builder**: Consistent URL pattern across builders +- **Navigation Guards**: Unsaved changes detection with URL awareness +- **Bookmarking**: Users can bookmark specific processes for quick access + +## Database Integration & API System + +The Process Builder now features comprehensive database integration with a RESTful API system, replacing local state management with persistent storage. + +### API Endpoints + +#### Core Process Operations +```javascript +// GET /api/process - List all processes with pagination +GET /api/process?page=1&limit=10&search=workflow&status=draft + +// GET /api/process/[id] - Get specific process +GET /api/process/550e8400-e29b-41d4-a716-446655440000 + +// POST /api/process - Create new process +POST /api/process +{ + "name": "New Workflow", + "description": "Process description", + "processDefinition": { nodes: [], edges: [] }, + "processVariables": [], + "isTemplate": false +} + +// PUT /api/process/[id] - Update existing process +PUT /api/process/550e8400-e29b-41d4-a716-446655440000 +{ + "name": "Updated Workflow", + "processDefinition": { /* updated definition */ } +} + +// DELETE /api/process/[id] - Delete process +DELETE /api/process/550e8400-e29b-41d4-a716-446655440000 +``` + +#### Advanced Operations +```javascript +// POST /api/process/[id]/duplicate - Duplicate process +POST /api/process/550e8400-e29b-41d4-a716-446655440000/duplicate +{ + "name": "Workflow Copy", + "regenerateIds": true +} + +// POST /api/process/[id]/publish - Publish process +POST /api/process/550e8400-e29b-41d4-a716-446655440000/publish +{ + "version": "1.0.0", + "notes": "Initial release" +} + +// GET /api/process/templates - Get process templates +GET /api/process/templates +``` + +### Process Store Integration + +#### Enhanced Store Methods +```javascript +// stores/processBuilder.js +export const useProcessBuilderStore = defineStore('processBuilder', () => { + + // Load process from API with error handling + const loadProcess = async (processId) => { + try { + loading.value = true; + const { data } = await $fetch(`/api/process/${processId}`); + + if (!data) { + throw new Error('Process not found'); + } + + currentProcess.value = data; + + // Handle backward compatibility for process definitions + if (data.processDefinition) { + if (data.processDefinition.nodes?.length === 0 && + data.processDefinition.edges?.length > 0) { + // Extract nodes from edges for backward compatibility + const extractedNodes = extractNodesFromEdges(data.processDefinition.edges); + nodes.value = extractedNodes; + edges.value = data.processDefinition.edges; + } else { + nodes.value = data.processDefinition.nodes || []; + edges.value = data.processDefinition.edges || []; + } + } + + return data; + } catch (error) { + console.error('Error loading process:', error); + throw error; + } finally { + loading.value = false; + } + }; + + // Save process with validation and success feedback + const saveProcess = async () => { + try { + loading.value = true; + + const processData = { + name: localProcess.value.name, + description: localProcess.value.description, + processDefinition: { + nodes: nodes.value, + edges: edges.value + }, + processVariables: processVariables.value, + processSettings: { + // Process configuration settings + processType: localProcess.value.processType, + priority: localProcess.value.priority, + category: localProcess.value.category, + timeoutDuration: localProcess.value.timeoutDuration, + allowParallel: localProcess.value.allowParallel, + enableErrorRecovery: localProcess.value.enableErrorRecovery, + sendNotifications: localProcess.value.sendNotifications + } + }; + + let result; + if (currentProcess.value?.id) { + // Update existing process + result = await $fetch(`/api/process/${currentProcess.value.id}`, { + method: 'PUT', + body: processData + }); + } else { + // Create new process + result = await $fetch('/api/process', { + method: 'POST', + body: processData + }); + } + + if (result?.data) { + currentProcess.value = result.data; + hasUnsavedChanges.value = false; + lastSavedState.value = JSON.stringify(processData); + return result.data; + } + + throw new Error('Save operation failed'); + } catch (error) { + console.error('Error saving process:', error); + throw error; + } finally { + loading.value = false; + } + }; + + // Fetch all processes with filtering + const fetchProcesses = async (options = {}) => { + try { + const params = new URLSearchParams({ + page: options.page || 1, + limit: options.limit || 20, + ...(options.search && { search: options.search }), + ...(options.status && { status: options.status }) + }); + + const response = await $fetch(`/api/process?${params}`); + processes.value = response.data || []; + return response; + } catch (error) { + console.error('Error fetching processes:', error); + throw error; + } + }; + + return { + // State + currentProcess: readonly(currentProcess), + processes: readonly(processes), + loading: readonly(loading), + hasUnsavedChanges: readonly(hasUnsavedChanges), + + // Actions + loadProcess, + saveProcess, + fetchProcesses, + clearProcess, + duplicateProcess, + deleteProcess + }; +}); +``` + +### Backward Compatibility + +#### Process Definition Loading +```javascript +// Handle legacy process definitions with embedded nodes in edges +const extractNodesFromEdges = (edges) => { + const nodeMap = new Map(); + + edges.forEach(edge => { + // Extract source node + if (edge.sourceNode && !nodeMap.has(edge.source)) { + nodeMap.set(edge.source, { + id: edge.source, + type: edge.sourceNode.type, + position: edge.sourceNode.position || { x: 0, y: 0 }, + data: edge.sourceNode.data || {} + }); + } + + // Extract target node + if (edge.targetNode && !nodeMap.has(edge.target)) { + nodeMap.set(edge.target, { + id: edge.target, + type: edge.targetNode.type, + position: edge.targetNode.position || { x: 0, y: 0 }, + data: edge.targetNode.data || {} + }); + } + }); + + return Array.from(nodeMap.values()); +}; +``` + +### Error Handling & Validation + +#### API Error Responses +```javascript +// Standardized error response format +{ + "success": false, + "error": { + "code": "VALIDATION_ERROR", + "message": "Process name is required", + "details": { + "field": "name", + "value": "", + "constraint": "required" + } + } +} + +// Network error handling +try { + await processStore.saveProcess(); +} catch (error) { + if (error.statusCode === 404) { + toast.error('Process not found'); + } else if (error.statusCode === 422) { + toast.error('Validation error: ' + error.data?.error?.message); + } else { + toast.error('An unexpected error occurred'); + } +} +``` + +#### Data Validation +```javascript +// Process validation using Zod schemas +import { z } from 'zod'; + +const ProcessSchema = z.object({ + name: z.string().min(1, 'Process name is required'), + description: z.string().optional(), + processDefinition: z.object({ + nodes: z.array(z.any()), + edges: z.array(z.any()) + }), + processVariables: z.array(z.any()).default([]), + isTemplate: z.boolean().default(false) +}); + +// Validate before save +const validateProcess = (processData) => { + try { + return ProcessSchema.parse(processData); + } catch (error) { + throw new Error(`Validation failed: ${error.message}`); + } +}; +``` + +## Vue Flow Integration & Performance Fixes + +Critical fixes were implemented to resolve interference between state management and Vue Flow's internal operations, particularly affecting connection dragging functionality. + +### Connection Dragging Bug Fix + +#### Problem +The aggressive syncing of node positions and edge updates was interfering with Vue Flow's native drag-and-drop functionality, causing connections to fail when dragging from node handles. + +#### Solution +```javascript +// stores/processBuilder.js - Optimized node sync handling +const syncNodePositions = (vueFlowNodes) => { + if (!vueFlowNodes || dragging.value) return; // Skip sync during dragging + + const positionsChanged = vueFlowNodes.some(vfNode => { + const storeNode = nodes.value.find(n => n.id === vfNode.id); + if (!storeNode) return false; + + return Math.abs(storeNode.position.x - vfNode.position.x) > 1 || + Math.abs(storeNode.position.y - vfNode.position.y) > 1; + }); + + if (positionsChanged) { + vueFlowNodes.forEach(vfNode => { + const nodeIndex = nodes.value.findIndex(n => n.id === vfNode.id); + if (nodeIndex !== -1) { + nodes.value[nodeIndex].position = { ...vfNode.position }; + } + }); + } +}; + +// Enhanced edge handling with change detection +const handleEdgeChanges = (changes, currentEdges) => { + if (!changes || changes.length === 0) return; + + let hasChanges = false; + + changes.forEach(change => { + if (change.type === 'add' && change.item) { + // Only add if it doesn't already exist + const exists = edges.value.some(e => e.id === change.item.id); + if (!exists) { + addEdge(change.item); + hasChanges = true; + } + } else if (change.type === 'remove') { + const index = edges.value.findIndex(e => e.id === change.id); + if (index !== -1) { + edges.value.splice(index, 1); + hasChanges = true; + } + } + }); + + if (hasChanges) { + markUnsavedChanges(); + } +}; +``` + +#### Canvas Component Updates +```vue + + + + +``` + +### Performance Optimizations + +#### Reduced Re-renders +```javascript +// Computed properties for reactive data binding +const flowNodes = computed({ + get: () => processStore.nodes, + set: (newNodes) => { + if (!isDragging.value) { + processStore.updateNodes(newNodes); + } + } +}); + +const flowEdges = computed({ + get: () => processStore.edges, + set: (newEdges) => { + processStore.updateEdges(newEdges); + } +}); + +// Debounced position sync for smooth dragging +import { debounce } from 'lodash-es'; + +const debouncedSync = debounce((nodes) => { + processStore.syncNodePositions(nodes); +}, 100); +``` + +#### Memory Management +```javascript +// Cleanup watchers and event listeners +onBeforeUnmount(() => { + // Clear any pending debounced calls + debouncedSync.cancel(); + + // Reset dragging state + processStore.setDragging(false); + + // Clear selections + if (vueFlowInstance.value) { + vueFlowInstance.value.setSelectedNodes([]); + vueFlowInstance.value.setSelectedEdges([]); + } +}); +``` + +### State Synchronization + +#### Bidirectional Data Flow +```javascript +// Process Store - Enhanced state management +export const useProcessBuilderStore = defineStore('processBuilder', () => { + const dragging = ref(false); + + const setDragging = (value) => { + dragging.value = value; + }; + + const updateNodes = (newNodes) => { + if (!dragging.value) { + nodes.value = newNodes.map(node => ({ + ...node, + position: { ...node.position } + })); + markUnsavedChanges(); + } + }; + + const updateEdges = (newEdges) => { + edges.value = newEdges.map(edge => ({ ...edge })); + markUnsavedChanges(); + }; + + // Smart change detection + const markUnsavedChanges = () => { + const currentState = JSON.stringify({ + nodes: nodes.value, + edges: edges.value, + variables: processVariables.value + }); + + if (currentState !== lastSavedState.value) { + hasUnsavedChanges.value = true; + } + }; + + return { + // State + dragging: readonly(dragging), + + // Actions + setDragging, + updateNodes, + updateEdges, + syncNodePositions, + handleNodeChanges, + handleEdgeChanges + }; +}); +``` + ## Component Architecture ### Core Components @@ -1622,16 +2273,7 @@ const saveSettings = () => { autoTimeout: localProcess.value.autoTimeout, allowParallel: localProcess.value.allowParallel, enableErrorRecovery: localProcess.value.enableErrorRecovery, - sendNotifications: localProcess.value.sendNotifications, - dataPersistence: localProcess.value.dataPersistence, - logVariableChanges: localProcess.value.logVariableChanges, - encryptSensitiveData: localProcess.value.encryptSensitiveData, - dataRetentionPolicy: localProcess.value.dataRetentionPolicy, - executionPermission: localProcess.value.executionPermission, - allowedRoles: localProcess.value.allowedRoles, - modificationPermission: localProcess.value.modificationPermission, - requireApproval: localProcess.value.requireApproval, - enableAuditTrail: localProcess.value.enableAuditTrail + sendNotifications: localProcess.value.sendNotifications } } diff --git a/doc/process-builder/USER_GUIDE.md b/doc/process-builder/USER_GUIDE.md index 2d474c3..2424d01 100644 --- a/doc/process-builder/USER_GUIDE.md +++ b/doc/process-builder/USER_GUIDE.md @@ -4,6 +4,40 @@ The Process Builder is a visual workflow designer that allows you to create, edit, and manage business processes using the BPMN (Business Process Model and Notation) standard. With an intuitive drag-and-drop interface, you can design complex workflows that model your organization's business processes. +## Recent Updates (December 2024) + +### New Features & Improvements + +#### **Direct Process Linking** +- **URL Parameters**: Access specific processes directly via `/process-builder?id={process-id}` +- **Bookmarkable Links**: Share and bookmark direct links to processes +- **Navigation Integration**: Seamless navigation from process management to builder +- **Error Handling**: Graceful fallback for invalid or missing process IDs + +#### **Enhanced Save & Navigation** +- **Success Notifications**: Toast messages confirm successful saves and operations +- **Smart Navigation**: Automatic URL updates when creating or editing processes +- **Unsaved Changes Detection**: Improved modal that correctly detects when changes are saved +- **Loading States**: Visual feedback during save, load, and navigation operations + +#### **Database Integration** +- **Persistent Storage**: All processes now saved to database with comprehensive API +- **Real-time Sync**: Changes automatically persisted with proper error handling +- **Backup Compatibility**: Legacy process definitions automatically upgraded +- **Data Validation**: Robust validation ensures data integrity + +#### **Connection System Fixes** +- **Reliable Dragging**: Fixed issue with connector dragging between nodes +- **Performance Optimized**: Reduced interference with Vue Flow's internal operations +- **Smooth Interactions**: Improved responsiveness during node manipulation +- **Connection Feedback**: Better visual feedback during connection creation + +#### **Process Management Consistency** +- **Unified Design**: Process and form management pages now share consistent UI +- **Search & Filter**: Enhanced search functionality across all management interfaces +- **Action Buttons**: Standardized edit, duplicate, and delete operations +- **Loading States**: Consistent loading indicators and error handling + ## Getting Started ### Accessing the Process Builder diff --git a/navigation/index.js b/navigation/index.js index 41686df..5703a34 100644 --- a/navigation/index.js +++ b/navigation/index.js @@ -6,135 +6,117 @@ export default [ { title: "Dashboard", path: "/dashboard", - icon: "ic:outline-dashboard", + icon: "material-symbols:dashboard", child: [], meta: {}, }, ], }, { - header: "Administration", - description: "Manage your application", + header: "Design & Build", + description: "Create and design your workflows and forms", child: [ { - title: "Configuration", - icon: "ic:outline-settings", + title: "Process Designer", + icon: "material-symbols:account-tree", child: [ { - title: "Environment", - path: "/devtool/config/environment", - }, - ], - }, - { - title: "Manage Users", - path: "/devtool/user-management", - icon: "ph:user-circle-gear", - child: [ - { - title: "User List", - path: "/devtool/user-management/user", - icon: "", - child: [], - }, - { - title: "Role List", - path: "/devtool/user-management/role", - icon: "", - child: [], - }, - ], - }, - { - title: "Content", - icon: "mdi:pencil-ruler", - child: [ - { - title: "Editor", - path: "/devtool/content-editor", - }, - { - title: "Template", - path: "/devtool/content-editor/template", - }, - ], - }, - { - title: "API Editor", - path: "/devtool/api-editor", - icon: "material-symbols:api-rounded", - child: [], - }, - { - title: "Code Playground", - path: "/devtool/code-playground", - icon: "mdi:code-braces", - child: [], - }, - ], - meta: { - auth: { - role: ["Developer"], - }, - }, - }, - { - header: "Process Builder", - description: "Build and manage your processes", - child: [ - { - title: "Process Management", - icon: "mdi:sitemap", - child: [ - { - title: "Process Builder", + title: "Visual Builder", path: "/process-builder", - icon: "material-symbols:network-node", + icon: "material-symbols:schema", child: [], + meta: { + description: "Design workflows with drag-and-drop interface" + } }, { - title: "Process List", + title: "Manage Processes", path: "/process-builder/manage", - icon: "mdi:format-list-bulleted", + icon: "material-symbols:folder-open", child: [], + meta: { + description: "View and manage all your processes" + } }, ], }, { - title: "Form Builder", - path: "/form-builder/manage", - icon: "mdi:form-select", - child: [], + title: "Form Designer", + icon: "material-symbols:dynamic-form", + child: [ + { + title: "Form Builder", + path: "/form-builder", + icon: "material-symbols:edit-document", + child: [], + meta: { + description: "Create dynamic forms with advanced components" + } + }, + { + title: "Manage Forms", + path: "/form-builder/manage", + icon: "material-symbols:library-books", + child: [], + meta: { + description: "View and manage all your forms" + } + }, + ], }, ], }, { - header: "Process Execution", - description: "Execute and manage process workflows", + header: "Execute & Monitor", + description: "Run processes and track their progress", child: [ { - title: "Execution Dashboard", - path: "/execution", - icon: "ic:outline-dashboard", - child: [], + title: "Process Execution", + icon: "material-symbols:play-circle", + child: [ + { + title: "Execution Dashboard", + path: "/execution", + icon: "material-symbols:monitoring", + child: [], + meta: { + description: "Monitor active processes and performance metrics" + } + }, + { + title: "Start New Process", + path: "/execution/new-case", + icon: "material-symbols:rocket-launch", + child: [], + meta: { + description: "Initiate a new process instance" + } + }, + ], }, { - title: "New Case", - path: "/execution/new-case", - icon: "material-symbols:add-circle-outline", - child: [], - }, - { - title: "Task Inbox", - path: "/execution/inbox", - icon: "material-symbols:inbox", - child: [], - }, - { - title: "Case History", - path: "/execution/history", - icon: "material-symbols:history", - child: [], + title: "Task Management", + icon: "material-symbols:task", + child: [ + { + title: "My Tasks", + path: "/execution/inbox", + icon: "material-symbols:inbox", + child: [], + meta: { + description: "View and complete assigned tasks" + } + }, + { + title: "Process History", + path: "/execution/history", + icon: "material-symbols:history", + child: [], + meta: { + description: "Review completed processes and audit trails" + } + }, + ], }, ], }, diff --git a/pages/form-builder/manage.vue b/pages/form-builder/manage.vue index 9dec783..0000710 100644 --- a/pages/form-builder/manage.vue +++ b/pages/form-builder/manage.vue @@ -1,168 +1,204 @@ + + diff --git a/pages/process-builder/index.vue b/pages/process-builder/index.vue index 2d23283..3ac9640 100644 --- a/pages/process-builder/index.vue +++ b/pages/process-builder/index.vue @@ -1,8 +1,8 @@