diff --git a/CORRAD_PROCESSMAKER_DOCUMENTATION.md b/CORRAD_PROCESSMAKER_DOCUMENTATION.md deleted file mode 100644 index 979edf2..0000000 --- a/CORRAD_PROCESSMAKER_DOCUMENTATION.md +++ /dev/null @@ -1,1004 +0,0 @@ -# Corrad ProcessMaker User Guide - -## Table of Contents - -1. [Introduction](#introduction) -2. [Getting Started](#getting-started) -3. [Form Builder](#form-builder) - - [3.1 Accessing Form Builder](#31-accessing-form-builder) - - [3.2 Form Builder Interface](#32-form-builder-interface) - - [3.3 Form Components](#33-form-components) - - [3.4 Creating Your First Form](#34-creating-your-first-form) - - [3.5 Form Builder Features](#35-form-builder-features) -4. [Form Management](#form-management) - - [4.1 Accessing Form Management](#41-accessing-form-management) - - [4.2 Managing Forms](#42-managing-forms) - - [4.3 Form Templates](#43-form-templates) - - [4.4 Form History](#44-form-history) -5. [Process Builder](#process-builder) - - [5.1 Accessing Process Builder](#51-accessing-process-builder) - - [5.2 Process Builder Interface](#52-process-builder-interface) - - [5.3 Process Components](#53-process-components) - - [5.4 Creating Your First Process](#54-creating-your-first-process) - - [5.5 Process Builder Features](#55-process-builder-features) -6. [Process Management](#process-management) - - [6.1 Accessing Process Management](#61-accessing-process-management) - - [6.2 Process Dashboard](#62-process-dashboard) - - [6.3 Managing Processes](#63-managing-processes) - - [6.4 Process Analytics](#64-process-analytics) - - [6.5 Case Management](#65-case-management) -7. [FAQ](#faq) - ---- - -## Introduction - -**Corrad ProcessMaker is a Business Process Management (BPM) platform designed for creating, automating, and managing complex business workflows.** This is NOT a low-code application builder - it's a specialized tool for designing and executing business processes with visual workflow design, form integration, and process automation capabilities. - -### What is Business Process Management? - -Business Process Management focuses on: -- **Process Design**: Creating visual workflows that represent business logic -- **Process Automation**: Automating repetitive tasks and decision points -- **Process Monitoring**: Tracking process execution and performance -- **Process Optimization**: Identifying bottlenecks and improving efficiency - -### Key Differences from Low-Code Platforms - -| Business Process Maker | Low-Code Builder | -|----------------------|------------------| -| Focuses on workflow design and process automation | Focuses on application development | -| Uses BPMN (Business Process Model and Notation) standards | Uses application development patterns | -| Emphasizes process flow, decision points, and task assignment | Emphasizes UI components and data management | -| Designed for business analysts and process designers | Designed for developers and citizen developers | -| Optimized for process monitoring and analytics | Optimized for rapid application development | - -### Core Capabilities - -**Process Design & Automation** -- Visual workflow designer with BPMN-compliant components -- Decision points and conditional routing -- Task assignment and user role management -- Process variables and data flow management - -**Form Integration** -- Dynamic form creation for data collection -- Form-to-process integration for task completion -- Conditional form logic and validation -- Multi-step form workflows - -**Process Execution & Monitoring** -- Real-time process execution tracking -- Task queue management and assignment -- Process performance analytics -- Exception handling and error management - -**Business Integration** -- API integration for external system connectivity -- Business rule engine for complex decision logic -- Notification system for process updates -- Audit trail and compliance tracking - -This guide provides step-by-step instructions for using the system's core BPM features to design, implement, and manage business processes effectively. - -## Getting Started - -**No installation is required.** The system is a web-based application accessible through your browser. - -### System Access -1. Open your web browser -2. Navigate to the application URL -3. Enter your username and password -4. Click "Login" to access the system - -### First Steps -- **Dashboard**: Start here to get an overview of your system -- **Form Builder**: Create data collection forms -- **Process Builder**: Design business workflows -- **Execution**: Run and monitor processes - ---- - -## Form Builder - -### 3.1 Accessing Form Builder - -**Step-by-Step Instructions:** -1. From the main menu, click **"Form Builder"** -2. Click **"Create New Form"** button -3. Enter a form name in the header field -4. You're now ready to build your form - -### 3.2 Form Builder Interface - -**Interface Layout:** -- **Left Panel**: Component library with all available form components -- **Center Canvas**: Drag-and-drop area where you build your form -- **Right Panel**: Component settings and configuration panel -- **Top Header**: Form name, save button, and preview toggle - -**Navigation:** -- Use the search bar in the component library to find specific components -- Click components to add them to your form -- Drag components to reposition them on the canvas - -### 3.3 Form Components - -#### Text Inputs Category - -**Text Field** -- **How to Add**: Drag "Text Field" from the Text Inputs category -- **Configuration**: - - Click the component to open settings - - Set label, placeholder, and help text - - Configure validation rules (required, min/max length) -- **Use Case**: Names, titles, short descriptions -- **Zakat Scenario**: - - **When to Use**: Collecting applicant's full name, IC number, or address - - **Example**: "Nama Penuh Pemohon" field for Zakat Asnaf application - - **Configuration**: Set as required field with validation for Malaysian IC format - -**Text Area** -- **How to Add**: Drag "Text Area" from the Text Inputs category -- **Configuration**: - - Set label and placeholder text - - Configure rows and character limits - - Enable rich text formatting if needed -- **Use Case**: Descriptions, comments, long-form content -- **Zakat Scenario**: - - **When to Use**: Collecting detailed reasons for Zakat application - - **Example**: "Sebab Permohonan Zakat" field for explaining financial hardship - - **Configuration**: Set minimum 50 characters, maximum 500 characters - -**Number Field** -- **How to Add**: Drag "Number Field" from the Text Inputs category -- **Configuration**: - - Set minimum and maximum values - - Configure decimal places and step increments - - Add validation rules -- **Use Case**: Quantities, amounts, scores -- **Zakat Scenario**: - - **When to Use**: Collecting monthly income, number of dependents, or property values - - **Example**: "Pendapatan Bulanan (RM)" field for income assessment - - **Configuration**: Set minimum 0, maximum 50,000, 2 decimal places - -**Email Field** -- **How to Add**: Drag "Email Field" from the Text Inputs category -- **Configuration**: - - Set label and placeholder - - Email validation is automatic -- **Use Case**: Contact information, user registration -- **Zakat Scenario**: - - **When to Use**: Collecting applicant's email for notifications - - **Example**: "Emel Pemohon" field for Zakat application updates - - **Configuration**: Set as optional field with email format validation - -**Password Field** -- **How to Add**: Drag "Password Field" from the Text Inputs category -- **Configuration**: - - Set label and placeholder - - Configure password strength requirements -- **Use Case**: User authentication, account creation -- **Zakat Scenario**: - - **When to Use**: Creating secure login for Zakat portal - - **Example**: "Kata Laluan" field for applicant account creation - - **Configuration**: Set minimum 8 characters with strength indicator - -**URL Field** -- **How to Add**: Drag "URL Field" from the Text Inputs category -- **Configuration**: - - Set label and placeholder - - URL validation is automatic -- **Use Case**: Links, references, social media profiles -- **Zakat Scenario**: - - **When to Use**: Collecting social media profiles for verification - - **Example**: "Profil Facebook" field for additional contact verification - - **Configuration**: Set as optional field with URL validation - -**Phone Field** -- **How to Add**: Drag "Phone Field" from the Text Inputs category -- **Configuration**: - - Set label and placeholder - - Configure phone number format -- **Use Case**: Contact information, customer details -- **Zakat Scenario**: - - **When to Use**: Collecting applicant's contact number - - **Example**: "Nombor Telefon" field for Zakat application contact - - **Configuration**: Set Malaysian phone format (01X-XXXXXXX) - -**Masked Input** -- **How to Add**: Drag "Masked Input" from the Text Inputs category -- **Configuration**: - - Set custom mask pattern (e.g., ###-###-####) - - Configure placeholder and help text -- **Use Case**: Credit cards, social security numbers, postal codes -- **Zakat Scenario**: - - **When to Use**: Collecting IC number with proper formatting - - **Example**: "Nombor IC" field with format 000000-00-0000 - - **Configuration**: Set mask pattern ###-###-#### for IC format - -**Hidden Field** -- **How to Add**: Drag "Hidden Field" from the Text Inputs category -- **Configuration**: - - Set default value - - Note: This field is not visible to users -- **Use Case**: Default values, system data, calculations -- **Zakat Scenario**: - - **When to Use**: Storing application date or system-generated values - - **Example**: "Tarikh Permohonan" field automatically set to current date - - **Configuration**: Set default value to current date/time - -#### Selection & Toggle Category - -**Select Dropdown** -- **How to Add**: Drag "Select Dropdown" from the Selection & Toggle category -- **Configuration**: - - Click component to open settings - - Add options in the "Options" section - - Set placeholder text - - Configure validation -- **Use Case**: Categories, status options, country selection -- **Zakat Scenario**: - - **When to Use**: Selecting Zakat category or state of residence - - **Example**: "Kategori Zakat" dropdown with options: Asnaf, Fakir, Miskin, etc. - - **Configuration**: Add options: Asnaf, Fakir, Miskin, Amil, Muallaf, Riqab, Gharimin, Fisabilillah - -**Checkbox Group** -- **How to Add**: Drag "Checkbox Group" from the Selection & Toggle category -- **Configuration**: - - Add multiple options in the settings - - Set label and help text - - Configure minimum/maximum selections -- **Use Case**: Interests, skills, preferences -- **Zakat Scenario**: - - **When to Use**: Selecting multiple sources of income or types of assistance needed - - **Example**: "Sumber Pendapatan" checkbox group - - **Configuration**: Options: Gaji Tetap, Kerja Sampingan, Perniagaan, Sewa, Lain-lain - -**Radio Group** -- **How to Add**: Drag "Radio Group" from the Selection & Toggle category -- **Configuration**: - - Add mutually exclusive options - - Set label and help text - - Configure validation -- **Use Case**: Gender, yes/no questions, priority levels -- **Zakat Scenario**: - - **When to Use**: Selecting marital status or employment status - - **Example**: "Status Perkahwinan" radio group - - **Configuration**: Options: Bujang, Berkahwin, Bercerai, Janda/Duda - -**Switch Toggle** -- **How to Add**: Drag "Switch Toggle" from the Selection & Toggle category -- **Configuration**: - - Set label and help text - - Configure default state (on/off) -- **Use Case**: Settings, feature enablement, consent -- **Zakat Scenario**: - - **When to Use**: Consent for data sharing or agreement to terms - - **Example**: "Persetujuan Terma dan Syarat" toggle - - **Configuration**: Set default to off, required for form submission - -#### Date & Pickers Category - -**Date Picker** -- **How to Add**: Drag "Date Picker" from the Date & Pickers category -- **Configuration**: - - Set label and help text - - Configure date range limits - - Set default date if needed -- **Use Case**: Birth dates, appointment scheduling, deadlines -- **Zakat Scenario**: - - **When to Use**: Collecting birth date or application submission date - - **Example**: "Tarikh Lahir" field for age verification - - **Configuration**: Set maximum date to current date, minimum date to 1900 - -**Time Picker** -- **How to Add**: Drag "Time Picker" from the Date & Pickers category -- **Configuration**: - - Set label and help text - - Choose 12 or 24-hour format - - Set time intervals -- **Use Case**: Meeting times, business hours, schedules -- **Zakat Scenario**: - - **When to Use**: Scheduling Zakat interview appointments - - **Example**: "Masa Temuduga" field for interview scheduling - - **Configuration**: Set 24-hour format, intervals of 30 minutes - -**Date & Time** -- **How to Add**: Drag "Date & Time" from the Date & Pickers category -- **Configuration**: - - Set label and help text - - Configure date and time limits -- **Use Case**: Event scheduling, deadline tracking -- **Zakat Scenario**: - - **When to Use**: Scheduling Zakat verification appointments - - **Example**: "Tarikh dan Masa Temuduga" field for home visits - - **Configuration**: Set minimum date to current date, business hours only - -**Range Slider** -- **How to Add**: Drag "Range Slider" from the Date & Pickers category -- **Configuration**: - - Set minimum and maximum values - - Configure step increments - - Set default value -- **Use Case**: Ratings, preferences, quantity selection -- **Zakat Scenario**: - - **When to Use**: Indicating monthly household income range - - **Example**: "Julat Pendapatan Bulanan (RM)" slider - - **Configuration**: Set range 0-10,000 RM, step 500 RM - -**Color Picker** -- **How to Add**: Drag "Color Picker" from the Date & Pickers category -- **Configuration**: - - Set label and help text - - Configure default color -- **Use Case**: Design preferences, theme selection -- **Zakat Scenario**: - - **When to Use**: Selecting preferred notification colors - - **Example**: "Warna Notifikasi Pilihan" for personalized alerts - - **Configuration**: Set default to blue (#3B82F6) - -#### Advanced & Upload Category - -**File Upload** -- **How to Add**: Drag "File Upload" from the Advanced & Upload category -- **Configuration**: - - Set accepted file types - - Configure file size limits - - Set maximum number of files -- **Use Case**: Documents, images, attachments -- **Zakat Scenario**: - - **When to Use**: Uploading supporting documents for Zakat application - - **Example**: "Dokumen Sokongan" field for IC, payslips, bank statements - - **Configuration**: Accept PDF, JPG, PNG files, max 5MB per file, max 10 files - -**Image Preview** -- **How to Add**: Drag "Image Preview" from the Advanced & Upload category -- **Configuration**: - - Set image URL or upload image - - Configure caption and alt text - - Enable/disable zoom capability -- **Use Case**: Product images, profile pictures, documentation -- **Zakat Scenario**: - - **When to Use**: Displaying Zakat calculation examples or guidelines - - **Example**: "Contoh Pengiraan Zakat" image with calculation breakdown - - **Configuration**: Show zoom capability, add caption explaining calculation - -**Repeating Group** -- **How to Add**: Drag "Repeating Group" from the Advanced & Upload category -- **Configuration**: - - Set group label and help text - - Configure minimum and maximum items - - Add fields within the group -- **Use Case**: Family members, work experience, education history -- **Zakat Scenario**: - - **When to Use**: Collecting information about family members/dependents - - **Example**: "Maklumat Ahli Keluarga" group for dependent details - - **Configuration**: Min 1, max 10 family members, fields: Name, IC, Age, Relationship - -**Dynamic List** -- **How to Add**: Drag "Dynamic List" from the Advanced & Upload category -- **Configuration**: - - Set label and placeholder text - - Configure item type (text, number, etc.) - - Enable search, sorting, and bulk operations -- **Use Case**: Skills, interests, inventory items -- **Zakat Scenario**: - - **When to Use**: Listing monthly expenses or sources of income - - **Example**: "Senarai Perbelanjaan Bulanan" for expense tracking - - **Configuration**: Text items, enable search, allow duplicates, max 20 items - -**Data Table** -- **How to Add**: Drag "Data Table" from the Advanced & Upload category -- **Configuration**: - - Define table columns and their types - - Set validation rules for each column - - Configure edit and delete permissions -- **Use Case**: Employee records, inventory, financial data -- **Zakat Scenario**: - - **When to Use**: Tracking monthly income and expenses in tabular format - - **Example**: "Jadual Pendapatan dan Perbelanjaan" table - - **Configuration**: Columns: Month, Income (RM), Expenses (RM), Balance (RM), Remarks - -**OTP Input** -- **How to Add**: Drag "OTP Input" from the Advanced & Upload category -- **Configuration**: - - Set number of digits (typically 6) - - Configure validation -- **Use Case**: Two-factor authentication, verification codes -- **Zakat Scenario**: - - **When to Use**: SMS verification for Zakat application submission - - **Example**: "Kod Pengesahan SMS" field for application verification - - **Configuration**: 6 digits, auto-focus, required validation - -**File Dropzone** -- **How to Add**: Drag "File Dropzone" from the Advanced & Upload category -- **Configuration**: - - Set accepted file types and size limits - - Configure drag-and-drop text - - Set maximum number of files -- **Use Case**: Bulk file uploads, document management -- **Zakat Scenario**: - - **When to Use**: Bulk upload of multiple supporting documents - - **Example**: "Seret Dokumen ke Sini" dropzone for multiple file uploads - - **Configuration**: Accept PDF, JPG files, max 10MB total, drag-and-drop interface - -**Button** -- **How to Add**: Drag "Button" from the Advanced & Upload category -- **Configuration**: - - Set button text and type (submit, reset, button) - - Choose button style and size - - Configure custom actions if needed -- **Use Case**: Submit, reset, custom actions -- **Zakat Scenario**: - - **When to Use**: Form submission or calculation triggers - - **Example**: "Hantar Permohonan Zakat" submit button - - **Configuration**: Primary style, large size, submit type - -### 3.4 Creating Your First Form - -**Step-by-Step Instructions:** - -1. **Start Form Builder** - - Navigate to Form Builder - - Click "Create New Form" - - Enter a descriptive form name - -2. **Add Basic Components** - - Drag a "Text Field" for the name - - Drag an "Email Field" for contact information - - Drag a "Select Dropdown" for category selection - -3. **Configure Components** - - Click each component to open settings - - Set appropriate labels and placeholders - - Add validation rules where needed - -4. **Add Advanced Components** - - Drag a "File Upload" for attachments - - Drag a "Text Area" for comments - - Add a "Button" for form submission - -5. **Test Your Form** - - Click "Preview" to test the form - - Fill out the form as an end user would - - Verify all functionality works correctly - -6. **Save Your Form** - - Click "Save" button - - Enter a descriptive name - - Add a description for future reference - -### 3.5 Form Builder Features - -**Drag & Drop Interface** -- **How to Use**: Click and drag components from the left panel to the canvas -- **Repositioning**: Drag components on the canvas to move them -- **Resizing**: Use the resize handles to adjust component size - -**Component Configuration** -- **How to Access**: Click any component on the canvas -- **Settings Panel**: Opens on the right side -- **Configuration Options**: Labels, validation, conditional logic, styling - -**Preview Mode** -- **How to Access**: Click "Preview" button in the header -- **Testing**: Fill out the form as an end user -- **Exit Preview**: Click "Edit" to return to builder mode - -**Save & Version Control** -- **Save**: Click "Save" button regularly -- **History**: Access form history to view previous versions -- **Restore**: Click on any previous version to restore it - ---- - -## Form Management - -### 4.1 Accessing Form Management - -**Step-by-Step Instructions:** -1. Navigate to **Form Builder** -2. Click the dropdown menu (three dots) in the header -3. Select **"Manage Forms"** -4. Or use the breadcrumb navigation - -### 4.2 Managing Forms - -**Form List View** -- **View All Forms**: See all your forms in a table format -- **Information Displayed**: Name, description, component count, creation date, last updated -- **Sorting**: Click column headers to sort by different criteria - -**Search & Filter** -- **Search Bar**: Type to search forms by name or description -- **Filters**: Use status and date filters to narrow results -- **Clear Filters**: Click "Clear Filters" to reset search - -**Form Actions** -- **Edit**: Click "Edit" to open form in Form Builder -- **Preview**: Click "Preview" to test form functionality -- **Duplicate**: Click "Duplicate" to create a copy -- **Delete**: Click "Delete" and confirm to remove form -- **Export**: Click "Export" to download form configuration - -### 4.3 Form Templates - -**Accessing Templates** -- **Step 1**: In Form Builder, click the dropdown menu -- **Step 2**: Select "Templates" -- **Step 3**: Browse available templates - -**Using Templates** -- **Step 1**: Select a template that matches your needs -- **Step 2**: Click "Use Template" -- **Step 3**: Customize the form for your specific requirements -- **Step 4**: Save with a new name - -**Creating Templates** -- **Step 1**: Design a form you want to reuse -- **Step 2**: Click "Save as Template" -- **Step 3**: Enter template name and description -- **Step 4**: Template is now available for reuse - -### 4.4 Form History - -**Accessing History** -- **Step 1**: In Form Management, find your form -- **Step 2**: Click "History" button -- **Step 3**: View version history - -**Version Management** -- **View Changes**: Click on any version to see what changed -- **Compare Versions**: Select two versions to compare differences -- **Restore Version**: Click "Restore" to go back to a previous version -- **Change Tracking**: See who made changes and when - ---- - -## Process Builder - -### 5.1 Accessing Process Builder - -**Step-by-Step Instructions:** -1. From the main menu, click **"Process Builder"** -2. Click **"Create New Process"** button -3. Enter a process name and description -4. Click "Create" to start building - -### 5.2 Process Builder Interface - -**Interface Layout:** -- **Left Panel**: Component library with process components -- **Center Canvas**: Visual workflow design area -- **Right Panel**: Component configuration and properties -- **Top Toolbar**: Save, publish, and navigation controls - -**Navigation:** -- **Zoom**: Use mouse wheel or zoom controls -- **Pan**: Click and drag on empty canvas areas -- **Select**: Click components to select and configure them - -### 5.3 Process Components - -#### Core Components - -**Start Point** -- **How to Add**: Drag "Start Point" from the Core Components category -- **Configuration**: - - Set process name and description - - Configure trigger conditions if needed -- **Visual**: Green circle with "Start" label -- **Use Case**: Process entry point, trigger events -- **Zakat Scenario**: - - **When to Use**: Beginning of Zakat application process - - **Example**: "Permohonan Zakat Asnaf" process start - - **Configuration**: Trigger when user submits Zakat application form - -**End Point** -- **How to Add**: Drag "End Point" from the Core Components category -- **Configuration**: - - Set completion conditions - - Configure final actions -- **Visual**: Red circle with "End" label -- **Use Case**: Process completion, final states -- **Zakat Scenario**: - - **When to Use**: Completion of Zakat approval or rejection process - - **Example**: "Permohonan Diluluskan" or "Permohonan Ditolak" end points - - **Configuration**: Send final notification to applicant - -**Form Task** -- **How to Add**: Drag "Form Task" from the Core Components category -- **Configuration**: - - Click component to open settings - - Select a form from the dropdown - - Assign to users or roles - - Set task description and instructions -- **Visual**: Rectangle with form icon -- **Use Case**: Data collection, user input, approvals -- **Zakat Scenario**: - - **When to Use**: Zakat application form submission or verification forms - - **Example**: "Borang Permohonan Zakat Asnaf" form task - - **Configuration**: Assign to Zakat officers, set deadline for completion - -**API Call** -- **How to Add**: Drag "API Call" from the Core Components category -- **Configuration**: - - Set HTTP method (GET, POST, PUT, DELETE) - - Enter API URL - - Configure request headers and body - - Set output variable name - - Configure error handling -- **Visual**: Rectangle with API icon -- **Use Case**: Integrate with external systems, fetch data -- **Zakat Scenario**: - - **When to Use**: Verify applicant's IC with JPN or check bank account details - - **Example**: "Pengesahan IC dengan JPN" API call - - **Configuration**: POST request to JPN API, validate IC number authenticity - -**Decision Point** -- **How to Add**: Drag "Decision Point" from the Core Components category -- **Configuration**: - - Click component to open settings - - Add conditions for different paths - - Set default path for fallback - - Configure condition logic (AND/OR) -- **Visual**: Diamond shape with decision icon -- **Use Case**: Conditional routing, approval workflows -- **Zakat Scenario**: - - **When to Use**: Determine if applicant qualifies for Zakat based on income - - **Example**: "Pendapatan < Had Kifayah?" decision point - - **Configuration**: If monthly income < RM2,208 (Had Kifayah), proceed to approval; else reject - -**Notification** -- **How to Add**: Drag "Notification" from the Core Components category -- **Configuration**: - - Set notification type (info, warning, error) - - Choose recipient type (user, role, email) - - Enter subject and message - - Configure delivery options (in-app, email, SMS) -- **Visual**: Rectangle with notification icon -- **Use Case**: Status updates, reminders, alerts -- **Zakat Scenario**: - - **When to Use**: Notify applicant about application status or request additional documents - - **Example**: "Notifikasi Status Permohonan" notification - - **Configuration**: Send SMS and email to applicant with application status update - -**Business Rule** -- **How to Add**: Drag "Business Rule" from the Core Components category -- **Configuration**: - - Create rule groups with conditions - - Set actions for each rule - - Configure rule priority -- **Visual**: Rectangle with rule icon -- **Use Case**: Data validation, calculations, decision logic -- **Zakat Scenario**: - - **When to Use**: Calculate Zakat eligibility based on multiple criteria - - **Example**: "Pengiraan Kelayakan Zakat" business rule - - **Configuration**: Rule 1: Income < Had Kifayah, Rule 2: No luxury assets, Rule 3: Malaysian citizen - -**Script Task** -- **How to Add**: Drag "Script Task" from the Core Components category -- **Configuration**: - - Enter JavaScript code - - Set input and output variables - - Configure error handling -- **Visual**: Rectangle with code icon -- **Use Case**: Data manipulation, calculations, custom logic -- **Zakat Scenario**: - - **When to Use**: Calculate monthly expenses or determine Zakat amount - - **Example**: "Pengiraan Perbelanjaan Bulanan" script task - - **Configuration**: Sum all monthly expenses, calculate average, determine eligibility - -**HTML Content** -- **How to Add**: Drag "HTML Content" from the Core Components category -- **Configuration**: - - Enter HTML code - - Add CSS styling if needed - - Configure JavaScript for interactivity -- **Visual**: Rectangle with HTML icon -- **Use Case**: Rich content, embedded applications, custom UI -- **Zakat Scenario**: - - **When to Use**: Display Zakat calculation results or guidelines - - **Example**: "Keputusan Pengiraan Zakat" HTML content - - **Configuration**: Display formatted calculation results with charts and explanations - -**Sub Process** -- **How to Add**: Drag "Sub Process" from the Core Components category -- **Configuration**: - - Select another process from the dropdown - - Configure data mapping between processes - - Set sub-process parameters -- **Visual**: Rectangle with sub-process icon -- **Use Case**: Modular process design, reusable workflows -- **Zakat Scenario**: - - **When to Use**: Separate verification process for complex applications - - **Example**: "Proses Pengesahan Dokumen" sub-process - - **Configuration**: Call document verification process with applicant data - -#### Design Elements - -**Horizontal Swimlane** -- **How to Add**: Drag "Horizontal Swimlane" from the Design Elements category -- **Configuration**: - - Set lane name and description - - Assign roles or departments - - Configure visual styling -- **Use Case**: Department separation, role-based organization -- **Zakat Scenario**: - - **When to Use**: Separate different departments in Zakat processing - - **Example**: "Bahagian Permohonan" and "Bahagian Pengesahan" swimlanes - - **Configuration**: Assign application officers and verification officers to respective lanes - -**Vertical Swimlane** -- **How to Add**: Drag "Vertical Swimlane" from the Design Elements category -- **Configuration**: - - Set lane name and description - - Configure time-based organization - - Set visual styling -- **Use Case**: Time-based organization, sequential steps -- **Zakat Scenario**: - - **When to Use**: Organize process by time periods - - **Example**: "Minggu 1", "Minggu 2", "Minggu 3" time-based lanes - - **Configuration**: Track application processing time across weeks - -**Text Annotation** -- **How to Add**: Drag "Text Annotation" from the Design Elements category -- **Configuration**: - - Enter explanatory text - - Position the annotation - - Configure text styling -- **Use Case**: Documentation, instructions, notes -- **Zakat Scenario**: - - **When to Use**: Add explanatory notes to process steps - - **Example**: "Nota: Had Kifayah = RM2,208 (2024)" annotation - - **Configuration**: Position near decision point, use smaller font for notes - -### 5.4 Creating Your First Process - -**Step-by-Step Instructions:** - -1. **Start Process Builder** - - Navigate to Process Builder - - Click "Create New Process" - - Enter process name and description - -2. **Add Start Point** - - Drag "Start Point" to the canvas - - Position it at the top of your workflow - -3. **Add Form Task** - - Drag "Form Task" below the start point - - Click the component to configure - - Select a form from the dropdown - - Assign to appropriate users or roles - -4. **Add Decision Point** - - Drag "Decision Point" after the form task - - Configure conditions (e.g., approval status) - - Set paths for different outcomes - -5. **Add End Points** - - Drag "End Point" for each decision path - - Configure completion actions - -6. **Connect Components** - - Click and drag from component edges to create connections - - Ensure all paths lead to end points - -7. **Test Your Process** - - Click "Preview" to test the workflow - - Verify all connections and conditions - -8. **Save and Publish** - - Click "Save" to save your process - - Click "Publish" to make it available for execution - -### 5.5 Process Builder Features - -**Visual Canvas** -- **How to Use**: Drag components from left panel to canvas -- **Connections**: Click and drag from component edges to create flow -- **Resizing**: Use handles to resize components -- **Repositioning**: Drag components to move them - -**Component Configuration** -- **How to Access**: Click any component on the canvas -- **Settings Panel**: Opens on the right side -- **Configuration Options**: Properties, labels, behavior, connections - -**Variable Management** -- **How to Access**: Click "Variables" tab in the right panel -- **Add Variables**: Click "Add Variable" and configure -- **Variable Types**: Text, number, date, boolean, array -- **Default Values**: Set initial values for variables - -**Conditional Logic** -- **How to Create**: Use Decision Point components -- **Condition Builder**: Click "Add Condition" in decision settings -- **Logic Operators**: Use AND/OR for complex conditions -- **Default Path**: Set fallback path for unmatched conditions - -**Form Integration** -- **How to Connect**: Use Form Task components -- **Form Selection**: Choose from your saved forms -- **User Assignment**: Assign to specific users or roles -- **Data Mapping**: Configure how form data flows through the process - -**API Integration** -- **How to Configure**: Use API Call components -- **HTTP Methods**: GET, POST, PUT, DELETE -- **Request Configuration**: URL, headers, body -- **Response Handling**: Set output variables and error handling - -**Save & Version Control** -- **Save**: Click "Save" button regularly -- **History**: Access process history to view previous versions -- **Publish**: Click "Publish" to make process available for execution - ---- - -## Process Management - -### 6.1 Accessing Process Management - -**Step-by-Step Instructions:** -1. Navigate to **Process Builder** -2. Click **"Manage Processes"** in the header -3. Or use the dashboard overview - -### 6.2 Process Dashboard - -**Overview Metrics** -- **Total Processes**: Number of all processes in the system -- **Published vs Draft**: Count of published and draft processes -- **Active Cases**: Currently running process instances -- **Performance Metrics**: Completion rates and average times - -**Performance Analytics** -- **Completion Rates**: Percentage of successful process completions -- **Average Times**: Time taken to complete processes -- **Success Rates**: Overall process success metrics -- **Bottleneck Analysis**: Identify slow or problematic steps - -**Recent Activity** -- **Latest Changes**: Recent process modifications -- **Recent Executions**: Latest process instances -- **User Activity**: Most active users and their actions - -**Quick Actions** -- **Create New Process**: Start building a new workflow -- **View Active Cases**: Monitor currently running processes -- **Access Analytics**: View detailed performance reports - -### 6.3 Managing Processes - -**Process List View** -- **Search & Filter**: Find processes by name, status, or category -- **Status Tracking**: Draft, published, archived, deleted -- **Category Organization**: HR, Finance, IT, Operations, etc. -- **Sort Options**: By name, creation date, last modified - -**Process Actions** -- **Edit**: Click "Edit" to open process in Process Builder -- **Duplicate**: Click "Duplicate" to create a copy -- **Publish**: Click "Publish" to make process available for execution -- **Archive**: Click "Archive" to move process to archived status -- **Delete**: Click "Delete" and confirm to remove process -- **Export**: Click "Export" to download process definition - -**Process Templates** -- **Template Library**: Browse pre-built process templates -- **Template Categories**: Common business processes -- **Custom Templates**: Save your processes as templates -- **Template Import**: Import templates from other sources - -**Process History** -- **Version Control**: Track all process changes -- **Change Log**: Who made changes and when -- **Version Comparison**: Compare different versions -- **Rollback**: Restore previous versions if needed - -### 6.4 Process Analytics - -**Execution Metrics** -- **Number of Cases**: Total process instances created -- **Completion Rates**: Percentage of completed cases -- **Average Time**: Time taken to complete processes -- **Success Rates**: Percentage of successful completions - -**Performance Data** -- **Bottleneck Analysis**: Identify slow steps in processes -- **User Performance**: Track user task completion rates -- **Process Efficiency**: Measure process optimization opportunities -- **Resource Utilization**: Monitor system and user resources - -**User Activity** -- **Most Active Users**: Users with highest task completion rates -- **Task Completion Rates**: Individual user performance metrics -- **User Workload**: Distribution of tasks across users -- **Performance Trends**: Track user performance over time - -**Trend Analysis** -- **Process Usage**: Track which processes are used most -- **Time Trends**: Analyze process usage over time -- **Seasonal Patterns**: Identify recurring patterns -- **Growth Metrics**: Track system adoption and usage - -### 6.5 Case Management - -**Active Cases** -- **View Running Cases**: See currently active process instances -- **Case Details**: Individual case information and progress -- **Case Status**: Track current status of each case -- **Case Timeline**: View chronological case events - -**Case Actions** -- **Assign Tasks**: Reassign tasks to different users -- **Suspend Cases**: Pause process execution temporarily -- **Resume Cases**: Restart suspended processes -- **Cancel Cases**: Terminate process execution - -**Task Management** -- **Pending Tasks**: View tasks waiting for user action -- **Task Assignment**: Assign tasks to specific users -- **Task Notifications**: Alert users about new or overdue tasks -- **Task History**: Track task completion and performance - -**Case Monitoring** -- **Real-time Updates**: Live status updates for active cases -- **Progress Tracking**: Monitor case progression through steps -- **Exception Handling**: Identify and handle process exceptions -- **Performance Monitoring**: Track case completion times - ---- - -## FAQ - -**Q: How do I implement approval workflows with multiple approvers in a hierarchical structure?** - -A: Use Decision Point components to create approval chains. Configure each decision point with conditions based on approval amounts or roles. For Zakat scenarios, you might have: Level 1 (RM1,000-RM5,000) → Officer approval, Level 2 (RM5,001-RM10,000) → Supervisor approval, Level 3 (RM10,001+) → Manager approval. Use Business Rule components to determine approval levels based on application amounts. - -**Q: How can I pass user-specific data to dynamically generated forms in subsequent process steps?** - -A: Use Process Variables to store user data from initial forms and pass them to subsequent Form Task components. Configure the form to pre-populate fields using the stored variables. For example, in a Zakat application: Store applicant details in variables during initial submission, then use those variables to pre-fill verification forms for officers. - -**Q: How do I implement conditional form fields that appear based on previous user selections?** - -A: Use the Conditional Logic feature in Form Builder. Select any component, go to the Conditional Logic section, and configure conditions. For Zakat applications: If user selects "Berpencen" in employment status, show "Jumlah Pencen" field; if "Bekerja Sendiri", show "Pendapatan Perniagaan" field. - -**Q: How can I integrate external systems (like JPN for IC verification) into my processes?** - -A: Use API Call components in Process Builder. Configure the API endpoint, authentication, request/response handling, and error management. For Zakat scenarios: Create API calls to JPN for IC verification, bank systems for account validation, or government databases for income verification. - -**Q: How do I implement parallel processing where multiple tasks can be completed simultaneously?** - -A: Use multiple Form Task components connected to the same Decision Point. Configure each task to be assigned to different users or roles. For Zakat processing: Simultaneously assign document verification to one officer, income verification to another, and home visit scheduling to a third officer. - -**Q: How can I implement dynamic task assignment based on workload or expertise?** - -A: Use Business Rule components to determine task assignment logic. Configure rules based on user availability, expertise, or current workload. For Zakat scenarios: Assign complex cases to senior officers, simple cases to junior officers, or route based on applicant location. - -**Q: How do I handle process exceptions and create alternative paths when standard procedures fail?** - -A: Use Decision Point components with error handling conditions. Configure API Call components with "Continue on Error" options and create alternative paths. For Zakat applications: If IC verification fails, route to manual verification; if income verification fails, request additional documents. - -**Q: How can I implement time-based escalations for overdue tasks?** - -A: Use Notification components with time-based triggers. Configure escalation rules in Business Rule components. For Zakat processing: If verification task is not completed within 3 days, automatically escalate to supervisor and send reminder notifications. - -**Q: How do I implement data validation across multiple process steps?** - -A: Use Business Rule components at each critical decision point. Configure validation rules that check data consistency across steps. For Zakat applications: Validate that income declared in initial form matches supporting documents in verification step. - -**Q: How can I implement audit trails and compliance tracking for sensitive processes?** - -A: Use the built-in audit logging features. Configure process variables to track all changes and decisions. For Zakat processing: Log all approval decisions, document uploads, verification results, and final outcomes for compliance reporting. - -**Q: How do I implement role-based access control for different process stages?** - -A: Configure user roles and permissions in the system settings. Assign specific roles to Form Task components. For Zakat workflows: Assign application submission to public users, verification to officers, approval to supervisors, and final review to managers. - -**Q: How can I implement process analytics and performance monitoring for continuous improvement?** - -A: Use the Process Analytics dashboard to track key metrics. Monitor completion times, bottleneck identification, and user performance. For Zakat processing: Track average processing time, approval rates, rejection reasons, and officer productivity for process optimization. \ No newline at end of file diff --git a/pages/workflow/[id].vue b/pages/workflow/[id].vue index 717ab66..26fe3a4 100644 --- a/pages/workflow/[id].vue +++ b/pages/workflow/[id].vue @@ -266,16 +266,16 @@ function evaluateCondition(condition, variables) { ); break; case 'contains': - result = String(variableValue).includes(String(compareValue)); + result = String(variableValue).toLowerCase().includes(String(compareValue).toLowerCase()); break; case 'not_contains': - result = !String(variableValue).includes(String(compareValue)); + result = !String(variableValue).toLowerCase().includes(String(compareValue).toLowerCase()); break; case 'starts_with': - result = String(variableValue).startsWith(String(compareValue)); + result = String(variableValue).toLowerCase().startsWith(String(compareValue).toLowerCase()); break; case 'ends_with': - result = String(variableValue).endsWith(String(compareValue)); + result = String(variableValue).toLowerCase().endsWith(String(compareValue).toLowerCase()); break; case 'regex': try {