Frontend
Unit
Deployment

Unit Deployment

Overview

The Unit Deployment in Worksphere provides administrators with a comprehensive interface to manage unit deployments to clients. Deployments represent the assignment of units and field personnel to specific clients for operational tasks with defined terms, billing arrangements, and approval workflows. This module enables creation, management, and tracking of deployment records across the Worksphere system.

Purpose

The Unit Deployment enables:

  • View Deployments - Display all deployment records in a searchable list
  • Add New Deployment - Create new unit deployment entries
  • Manage Deployment Details - Configure deployment parameters and client information
  • Delete Deployments - Remove deployment records

Module Features

  • Comprehensive deployment list with search and filtering
  • Multi-field deployment form with auto-fill capabilities
  • Client and unit-based filtering
  • Deployment date tracking
  • Billing and wage structure configuration
  • GOM approval tracking
  • PO (Purchase Order) status management
  • Client type categorization
  • BD (Business Development) person assignment
  • Agency takeover management
  • Email notifications
  • Role-based access control
  • Comprehensive validation and error handling

Module Navigation

Accessing the Deployment Module

Application: Worksphere
URL: http://localhost:3000
Path: Unit → Deployment or Direct Access: /unit/deployment

Access Points

  • From Unit Management: Tab Four in multi-step unit form
  • From Unit List: Click unit to view deployments
  • Direct Access: Via sidebar navigation
  • From Field Officer Management: Related deployments link

User Access

  • Authorized Roles: Admin, Super Admin
  • Required Permissions: Deployment management access
  • Session: User must be logged in

Deployment Management Pages

Page One: Deployment List Page

URL: /unit/deployment

Overview

The Deployment List page displays all deployment records in the Worksphere system. It provides management capabilities for administrators to view, search, and delete deployment entries.

Page Description

The Deployment List page contains:

  1. Page Header

    • Title: "Deployment Lists"
    • Breadcrumb: Dashboard > Unit > Deployment
    • User info and logout in top right
  2. Search & Filter Section

    • Search bar at top left
    • Search placeholder: "Search deployments..."
    • Filter options (optional)
    • Refresh button
  3. Action Bar

    • "Add Deployment" button (Primary action)
    • Bulk action options (if multiple selected)
  4. Deployment Records Table

    • Displays all deployment records
    • Shows deployment information with columns
    • Supports row selection with checkboxes
    • Pagination controls
  5. Footer

    • Pagination controls
    • Records per page selector

Search & Filter Section

Search Bar

  • Type: Text Input with Search Icon
  • Placeholder: "Search deployments..."
  • Searchable Fields: Unit Name, Client Name, Branch, Email, Unit Code
  • Behavior: Real-time search (updates table within 500ms)
  • Scope: Searches across all displayed columns
  • Clear: X icon to clear search
  • Search Logic: Partial match (case-insensitive)

Deployment Records Table

ColumnDescriptionData TypeWidthNotes
CheckboxRow selectionCheckbox5%Bulk select multiple rows
Unit NameName of deployed unitText20%Primary identifier
BranchBranch locationText18%Branch name
ClientClient nameText18%Client company name
Deployment DateDate of deploymentDate15%MM/DD/YYYY format
EmailContact emailEmail18%Email address
ActionsDelete iconButton6%Quick delete button

Fields in Detail

Checkbox

  • Position: First column
  • Selects individual row
  • Select All checkbox in header (if bulk delete enabled)
  • Maintains selection on pagination
  • Enables bulk delete functionality

Unit Name

  • Name/identifier of the deployed unit
  • Text format
  • Primary identifier and searchable
  • Bold font for emphasis
  • Links to unit details (optional)
  • Example: "North Delhi Unit", "Mumbai Central", "Bangalore Office"

Branch

  • Branch location of the unit
  • Text format
  • Searchable
  • Shows branch office name
  • Example: "Head Office", "Delhi Branch", "Regional Branch"

Client

  • Name of the client/company
  • Text format
  • Searchable
  • Shows assigned client
  • Example: "ABC Corporation", "XYZ Limited", "PQR Solutions"

Deployment Date

  • Date of deployment
  • Date format (MM/DD/YYYY)
  • Shows deployment start date
  • Sortable by date
  • Example: "01/15/2026", "12/20/2025"

Email

Actions

  • Delete Icon (Trash icon, Red)
    • Click to delete deployment
    • Shows deletion confirmation modal
    • Hover shows "Delete Deployment" tooltip

Buttons & Actions

Button/IconLabelActionResult
Add Deployment"+ Add Deployment"Open deployment formOpens Add New Deployment page
SearchSearch iconFilter tableFilters records in real-time
DeleteTrash iconDelete deploymentShows confirmation modal
RefreshRefresh iconReload dataReloads deployment list from server

Table Features

Row Selection

  • Single Select: Click checkbox to select/deselect row
  • Bulk Select: Click header checkbox to select/deselect all
  • Selection State: Highlighted row background (light blue)
  • Selection Count: Shows "X rows selected" below table (if bulk delete enabled)

Sorting

  • Click column header to sort ascending/descending
  • Active sort shows arrow indicator (↑ or ↓)
  • Supported columns: Unit Name, Branch, Client, Deployment Date
  • Default sort: Deployment Date (descending - newest first)

Pagination

  • Rows per page: Default 10, options: 10, 25, 50, 100
  • Navigation: Previous/Next buttons and page numbers
  • Info: Shows "Showing 1 to 10 of 50 entries"
  • Current Page: Highlighted page number

Search Behavior

  • Real-time: Table updates as user types
  • Debounce: 500ms delay to optimize performance
  • Case Insensitive: Search ignores case
  • Partial Match: Finds records containing search term
  • Clear Search: X button resets table to all records
  • Search Scope: All visible columns

Validations & Notes

  • Empty State: If no deployments exist, show "No deployments configured. Click 'Add Deployment' to create one."
  • Permissions: Only admin/superadmin can manage deployments
  • Page Load: Deployments load within 2 seconds
  • Real-time Search: Results update within 500ms
  • Deployment Count Display: Shows total number of deployments at top

User Flow - Deployment List Page

┌──────────────────────────────────────────┐
│   Deployment Lists                       │
│                                          │
│  [Search bar]              [+ Add]       │
│                                          │
├──────────────────────────────────────────┤
│                                          │
│  ☐ Unit Name │ Branch │ Client │ Date   │
│  ────────────────────────────────────── │
│  ☐ North Delhi│ Delhi  │ ABC Corp│ 01/15│ 🗑
│  ☐ Mumbai Cen │ Mumbai │ XYZ Ltd │ 01/10│ 🗑
│  ☐ Bangalore  │ Banga. │ PQR Sol │ 01/05│ 🗑
│                                          │
│  [Previous] [1] [2] [Next]               │
│  Showing 1 to 10 of 50 entries          │
│                                          │
└──────────────────────────────────────────┘

Page Two: Add New Deployment Page

URL: /unit/deployment/add

Overview

The Add New Deployment page allows administrators to create new unit deployment entries with comprehensive configuration options.

Page Description

The Add New Deployment page contains:

  1. Page Header

    • Title: "Deployment Plan"
    • Breadcrumb: Dashboard > Unit > Deployment > Add
    • Description: "Create a new unit deployment plan"
  2. Form Section

    • Multi-section form with organized fieldsets
    • Auto-fill capabilities for dependent fields
    • Real-time validation
    • Visual feedback for filled/required fields
  3. Action Bar

    • Clear button to reset form
    • Submit button to save deployment
    • Back button to return to list

Form Structure

The Add New Deployment form is organized in sections:

Section One: Unit & Client Information (Required)

FieldTypeRequiredMax LengthValidation
Unit CodeSearch SelectYes-Must exist in system
Unit NameSearch SelectYes-Auto-filled from Unit Code
Client NameText (Auto-fill)Yes100Auto-filled from Unit Code
BranchText (Auto-fill)Yes50Auto-filled from Unit Code
Unit Code (Required)
  • Type: Dropdown with Search
  • Required: Yes (marked with *)
  • Placeholder: "Search or select unit code"
  • Options: List of all active units with codes
  • Searchable: Yes (real-time search)
  • Behavior:
    • Loads unit details on selection
    • Triggers auto-fill of Unit Name, Client Name, Branch
    • Shows unit status (Active/Inactive)
  • Validation Rules:
    • Cannot be empty
    • Must be valid unit in system
    • Unit must be active
  • Error Messages:
    • "Unit code is required"
    • "Invalid unit code selected"
    • "Selected unit is inactive"
  • Help Text: "Select the unit to be deployed"
  • Examples: "UNIT-001", "ND-UNIT-02", "MUM-UNIT-03"
Unit Name (Required, Auto-filled)
  • Type: Text Input (Read-only, Auto-filled)
  • Required: Yes
  • Placeholder: Auto-fills from Unit Code selection
  • Searchable: Yes (for manual search if needed)
  • Behavior:
    • Auto-populated when Unit Code is selected
    • Can be manually edited if necessary
    • Updates dependent fields
  • Validation Rules:
    • Cannot be empty
    • Must match selected unit
  • Error Messages:
    • "Unit name is required"
  • Help Text: "Name of the unit being deployed"
  • Examples: "North Delhi Unit", "Mumbai Central", "Bangalore Office"
Client Name (Required, Auto-filled)
  • Type: Text Input (Read-only, Auto-filled)
  • Required: Yes (marked with *)
  • Max Length: 100 characters
  • Placeholder: Auto-fills from Unit Code selection
  • Behavior:
    • Auto-populated from unit's assigned client
    • Read-only field
    • Shows primary client contact
  • Validation Rules:
    • Cannot be empty
    • Must be valid client in system
  • Error Messages:
    • "Client name is required"
  • Help Text: "Client company assigned to this unit"
  • Examples: "ABC Corporation Limited", "XYZ Industries Pvt Ltd"
Branch (Required, Auto-filled)
  • Type: Text Input (Read-only, Auto-filled)
  • Required: Yes (marked with *)
  • Max Length: 50 characters
  • Placeholder: Auto-fills from Unit Code selection
  • Behavior:
    • Auto-populated from unit's branch
    • Read-only field
    • Shows unit's operating branch
  • Validation Rules:
    • Cannot be empty
    • Must be valid branch
  • Error Messages:
    • "Branch is required"
  • Help Text: "Branch location of the unit"
  • Examples: "Delhi Head Office", "Mumbai Regional Branch"

Section Two: Deployment Operation Details (Required)

FieldTypeRequiredMax LengthValidation
Duty HoursNumber InputYes-Integer 1-24
StrengthNumber InputYes-Integer >= 1
Deployment DateDate PickerYes-Future or current date
RemarkText AreaNo500Text only
Duty Hours (Required)
  • Type: Number Input
  • Required: Yes (marked with *)
  • Min: 1
  • Max: 24
  • Placeholder: "e.g., 8"
  • Validation Rules:
    • Cannot be empty
    • Must be positive integer
    • Between 1 and 24 hours
    • No decimals
  • Error Messages:
    • "Duty hours is required"
    • "Must be between 1 and 24 hours"
    • "Invalid number format"
  • Help Text: "Number of duty hours per shift (1-24)"
  • Tooltip: "Duty Hours - Define how many hours of work per shift"
  • Examples: "8", "10", "12"
Strength (Required)
  • Type: Number Input
  • Required: Yes (marked with *)
  • Min: 1
  • Max: 99999
  • Placeholder: "e.g., 50"
  • Validation Rules:
    • Cannot be empty
    • Must be positive integer
    • Minimum 1 personnel
  • Error Messages:
    • "Strength is required"
    • "Must be a positive number"
    • "Strength must be at least 1"
  • Help Text: "Total number of personnel for this deployment"
  • Tooltip: "Strength - Total personnel assigned to deployment"
  • Examples: "25", "50", "100"
Deployment Date (Required)
  • Type: Date Picker
  • Required: Yes (marked with *)
  • Format: MM/DD/YYYY
  • Placeholder: "Select deployment date"
  • Date Range: Today or future dates
  • Calendar: Interactive calendar picker
  • Validation Rules:
    • Cannot be empty
    • Must be current or future date
    • Cannot be in past
  • Error Messages:
    • "Deployment date is required"
    • "Date cannot be in the past"
    • "Invalid date format"
  • Help Text: "Date when deployment begins"
  • Tooltip: "Deployment Date - Select the start date for deployment"
  • Examples: "01/15/2026", "02/01/2026"
Remark (Optional)
  • Type: Text Area
  • Required: No
  • Max Length: 500 characters
  • Placeholder: "Add any additional remarks or notes"
  • Rows: 4 rows visible
  • Character Counter: Shows "X/500" characters
  • Validation Rules:
    • Optional field
    • Max 500 characters
    • No special character restrictions
  • Error Messages:
    • "Remarks exceeds 500 characters"
  • Help Text: "Additional notes about this deployment"
  • Examples: "Special handling required", "VIP client - priority support"

Section Three: Contact & Approval Information (Required)

FieldTypeRequiredMax LengthValidation
EmailEmail InputYes100Valid email format
GOM ApprovalDropdownYes-Yes / No
Email (Required)
  • Type: Email Input
  • Required: Yes (marked with *)
  • Max Length: 100 characters
  • Placeholder: "user@company.com"
  • Validation Rules:
    • Cannot be empty
    • Must be valid email format
    • Must contain @ and domain
  • Error Messages:
    • "Email is required"
    • "Invalid email format"
    • "Email exceeds 100 characters"
  • Help Text: "Contact email for this deployment"
  • Tooltip: "Email - Contact email address for deployment notifications"
  • Examples: "contact@company.com", "deploy@client.com"
GOM Approval (Required)
  • Type: Dropdown
  • Required: Yes (marked with *)
  • Options:
    • Yes
    • No
  • Placeholder: "Select GOM approval status"
  • Default: None (user must select)
  • Validation Rules:
    • Cannot be empty
    • Must select valid option
  • Error Messages:
    • "GOM approval status is required"
  • Help Text: "Has General Order Management approved this deployment?"
  • Tooltip: "GOM Approval - General Order Management approval status"

Section Four: Wage & Billing Configuration (Required)

FieldTypeRequiredOptionsValidation
Wages StructuralDropdownYes[Options from system]Must select
Rate ApprovedDropdownYesYes / NoBoolean
Billing TypeDropdownYes[Options from system]Must select
PO StatusDropdownYesYes / NoBoolean
Wages Structural (Required)
  • Type: Dropdown
  • Required: Yes (marked with *)
  • Options: Dynamic list from system (e.g., "Fixed", "Variable", "Piece Rate", "Hourly")
  • Placeholder: "Select wage structure"
  • Validation Rules:
    • Cannot be empty
    • Must select valid option
  • Error Messages:
    • "Wages structural is required"
    • "Invalid wage structure selected"
  • Help Text: "Select the wage payment structure for this deployment"
  • Tooltip: "Wages Structural - Payment structure (Fixed/Variable/Hourly)"
Rate Approved (Required)
  • Type: Dropdown
  • Required: Yes (marked with *)
  • Options:
    • Yes
    • No
  • Placeholder: "Select rate approval status"
  • Validation Rules:
    • Cannot be empty
    • Must select valid option
  • Error Messages:
    • "Rate approval status is required"
  • Help Text: "Has the deployment rate been approved?"
  • Tooltip: "Rate Approved - Confirmation of rate approval"
Billing Type (Required)
  • Type: Dropdown
  • Required: Yes (marked with *)
  • Options: Dynamic list from system (e.g., "Monthly", "Weekly", "Per Project", "On Demand", "Retainer")
  • Placeholder: "Select billing type"
  • Validation Rules:
    • Cannot be empty
    • Must select valid option
  • Error Messages:
    • "Billing type is required"
    • "Invalid billing type selected"
  • Help Text: "Select how the client will be billed for this deployment"
  • Tooltip: "Billing Type - Billing arrangement (Monthly/Weekly/Project)"
PO Status (Required)
  • Type: Dropdown
  • Required: Yes (marked with *)
  • Options:
    • Yes
    • No
  • Placeholder: "Select PO status"
  • Validation Rules:
    • Cannot be empty
    • Must select valid option
  • Error Messages:
    • "PO status is required"
  • Help Text: "Has a Purchase Order been issued for this deployment?"
  • Tooltip: "PO Status - Purchase Order status confirmation"

Section Five: Client & Resource Details (Required)

FieldTypeRequiredOptionsValidation
Client TypeDropdownYes[Options from system]Must select
Lead CLO ByDropdownYes[Options from system]Must select
Lead Gen ByDropdownYes[Options from system]Must select
Deployment DaysDropdownYes[Options from system]Must select
Client Type (Required)
  • Type: Dropdown
  • Required: Yes (marked with *)
  • Options: Dynamic list from system (e.g., "Corporate", "Government", "NGO", "Educational", "Healthcare", "Retail")
  • Placeholder: "Select client type"
  • Validation Rules:
    • Cannot be empty
    • Must select valid option
  • Error Messages:
    • "Client type is required"
    • "Invalid client type selected"
  • Help Text: "Category of the client organization"
  • Tooltip: "Client Type - Classification of client organization"
Lead CLO By (Required)
  • Type: Dropdown
  • Required: Yes (marked with *)
  • Options: Dynamic list from system (List of CLO personnel)
  • Placeholder: "Select CLO person"
  • Searchable: Yes (for large lists)
  • Validation Rules:
    • Cannot be empty
    • Must select valid option
    • Person must have CLO role
  • Error Messages:
    • "Lead CLO person is required"
    • "Invalid CLO person selected"
  • Help Text: "Client Liaison Officer leading this deployment"
  • Tooltip: "Lead CLO By - Assigned Client Liaison Officer"
Lead Gen By (Required)
  • Type: Dropdown
  • Required: Yes (marked with *)
  • Options: Dynamic list from system (List of Gen personnel)
  • Placeholder: "Select Gen person"
  • Searchable: Yes (for large lists)
  • Validation Rules:
    • Cannot be empty
    • Must select valid option
    • Person must have Gen role
  • Error Messages:
    • "Lead Gen person is required"
    • "Invalid Gen person selected"
  • Help Text: "General/Manager overseeing this deployment"
  • Tooltip: "Lead Gen By - Assigned General/Manager"
Deployment Days (Required)
  • Type: Dropdown
  • Required: Yes (marked with *)
  • Options: Dynamic list from system (e.g., "Mon-Fri", "Mon-Sat", "Mon-Sun", "Custom")
  • Placeholder: "Select deployment days"
  • Validation Rules:
    • Cannot be empty
    • Must select valid option
  • Error Messages:
    • "Deployment days is required"
    • "Invalid deployment days selected"
  • Help Text: "Days on which deployment will operate"
  • Tooltip: "Deployment Days - Working days pattern"

Section Six: BD & Agency Details (Optional)

FieldTypeRequiredMax LengthValidation
BD PersonSearch SelectNo-Valid BD person
Agency TakeoverText InputNo100Text only
BD Person (Optional)
  • Type: Dropdown with Search
  • Required: No
  • Placeholder: "Search or select BD person"
  • Options: List of all business development personnel
  • Searchable: Yes (real-time search)
  • Behavior:
    • Search by name, ID, or designation
    • Shows BD person details on hover
  • Validation Rules:
    • Optional field
    • If selected, must be valid BD person
  • Help Text: "Business Development person assigned (optional)"
  • Tooltip: "BD Person - Business Development contact"
  • Examples: "John Smith (BD-001)", "Sarah Johnson (BD-002)"
Agency Takeover (Optional)
  • Type: Text Input
  • Required: No
  • Max Length: 100 characters
  • Placeholder: "e.g., ABC Agency, XYZ Services"
  • Validation Rules:
    • Optional field
    • Max 100 characters
    • Text format only
  • Help Text: "Name of agency taking over (if applicable)"
  • Tooltip: "Agency Takeover - Agency handling deployment"
  • Examples: "ABC Staffing Agency", "XYZ Manpower Solutions"

Form Behavior

  • Auto-fill: Unit Name, Client Name, and Branch auto-fill when Unit Code is selected
  • Dependent Fields: Some fields depend on selections in other fields
  • Validation: Real-time field validation as you fill
  • Error Display: Red error messages appear below respective fields
  • Required Fields: Marked with red asterisk (*)
  • Field Focus: First invalid field gets focus on submission attempt
  • Loading State: Submit button shows loading spinner during submission
  • Unsaved Changes: Warning if user tries to leave with unsaved data
  • Success Message: Green banner: "Deployment created successfully!"
  • Form Reset: Clear button resets all fields to empty state

Form Sections Summary

SectionFieldsStatusNotes
Unit & Client4 fieldsRequiredAuto-fill enabled
Operation Details4 fieldsRequiredDuty hours & strength
Contact & Approval2 fieldsRequiredEmail & GOM approval
Wage & Billing4 fieldsRequiredPayment & PO details
Client & Resources4 fieldsRequiredClient type & personnel
BD & Agency2 fieldsOptionalBusiness development

Buttons & Actions

ButtonTypeActionResult
ClearSecondary ButtonReset formClears all fields to empty state
SubmitPrimary Button (Blue)Save deploymentValidates, saves deployment, returns to list
BackTertiary ButtonReturnGoes back to deployment list

Clear Button Behavior

  • Label: "Clear"
  • Type: Secondary button
  • Action: Resets all form fields to initial empty state
  • Confirmation: None (direct clear)
  • Result: All fields cleared, ready for new entry
  • Tooltip: "Clear all fields and start over"

Submit Button Behavior

  • Label: "Submit"
  • Type: Primary button (Blue)
  • State: Disabled until all required fields are filled
  • Loading: Shows spinner with "Submitting..." text while saving
  • Validation: Performs final validation before submission
  • Success: Shows "Deployment created successfully!" message
  • Error: Shows specific error message if submission fails
  • Redirect: Returns to deployment list after successful creation

User Flow - Add New Deployment Page

┌──────────────────────────────────────────┐
│   Deployment Plan                        │
│   Create a new unit deployment plan      │
│                                          │
├──────────────────────────────────────────┤
│                                          │
│  UNIT & CLIENT INFORMATION               │
│  Unit Code: [Search/Select ▼]           │
│  Unit Name: [Auto-filled]               │
│  Client Name: [Auto-filled]             │
│  Branch: [Auto-filled]                  │
│                                          │
│  OPERATION DETAILS                       │
│  Duty Hours: [Input] Email: [Input]     │
│  Strength: [Input]     Remark: [Area]   │
│  Deployment Date: [Date Picker]         │
│                                          │
│  CONTACT & APPROVAL                      │
│  Email: [Input]                         │
│  GOM Approval: [Dropdown ▼]             │
│                                          │
│  WAGE & BILLING                          │
│  Wages Structural: [Dropdown ▼]         │
│  Rate Approved: [Dropdown ▼]            │
│  Billing Type: [Dropdown ▼]             │
│  PO Status: [Dropdown ▼]                │
│                                          │
│  CLIENT & RESOURCES                      │
│  Client Type: [Dropdown ▼]              │
│  Lead CLO By: [Dropdown ▼]              │
│  Lead Gen By: [Dropdown ▼]              │
│  Deployment Days: [Dropdown ▼]          │
│                                          │
│  BD & AGENCY (Optional)                  │
│  BD Person: [Search/Select ▼]           │
│  Agency Takeover: [Input]               │
│                                          │
│  [Clear]                     [Submit]    │
│                                          │
└──────────────────────────────────────────┘

Page Three: Delete Deployment Confirmation Modal

Overview

The Delete Deployment confirmation modal appears when an administrator clicks the delete action on a deployment. It confirms the user's intention to permanently delete the deployment record.

Modal Dialog

Dialog Header

  • Title: "Are you sure?"
  • Close Button: X icon in top-right corner
  • Icon: Warning/Alert icon in red

Dialog Content

Primary Message:

Are you sure you want to delete this deployment record?

Additional Information:

  • Shows unit name being deleted
  • Shows client name
  • Shows deployment date
  • Shows warning: "You are about to permanently delete this deployment record."
  • Example: "Deleting deployment for 'North Delhi Unit' assigned to 'ABC Corporation' on 01/15/2026"

Dialog Body

ContentValueNotes
Primary Message"Are you sure?"Confirmation title
Warning IconRed alert iconIndicates destructive action
Warning Message"You are about to permanently delete this deployment record."Emphasizes irreversibility
Unit NameDynamic (unit name)Shows which unit's deployment
Client NameDynamic (client name)Shows associated client
Deployment DateDynamic (date)Shows deployment date
Warning Note"This action cannot be undone."Final warning

Buttons & Actions

ButtonTypePositionActionResult
Yes, delete it!Danger Button (Red)RightConfirms deletionPermanently deletes deployment, closes modal, shows success message, refreshes list
CancelSecondary ButtonLeftCancels deletionCloses modal, returns to deployment list

Modal Behavior

  • Backdrop: Semi-transparent dark overlay behind modal
  • Click Outside: Clicking outside modal closes it (cancels deletion)
  • Keyboard: Pressing ESC closes modal (cancels deletion)
  • Focus: Focus is on "Cancel" button on open (safer default)
  • Animation: Smooth fade-in animation (300ms)
  • Width: 450-550px width, centered on screen
  • Z-index: Above all other elements

Success Message

After confirmation:

Deployment deleted successfully.

Display:

  • Green banner at top of page
  • Auto-dismisses after 5 seconds
  • Shows before list refreshes

Error States

Error ScenarioMessageAction
Network error"Failed to delete deployment. Please try again."Retry button
Permission denied"You don't have permission to delete this deployment."Close modal
Record in use"Cannot delete. This deployment is referenced elsewhere."Contact admin
Server error"An error occurred. Please contact support."Contact admin

Deployment Management User Flow

START (Unit Management OR Deployment)

  ├──→ Deployment List Page (/unit/deployment)
  │     │
  │     ├─ View All Deployments
  │     │  ├─ Unit Name, Branch, Client
  │     │  ├─ Deployment Date, Email
  │     │  └─ Delete button for each
  │     │
  │     ├─ Search Deployments
  │     │  ├─ Type in search bar
  │     │  ├─ Results filter in real-time (500ms)
  │     │  ├─ Search across all columns
  │     │  └─ X icon clears search
  │     │
  │     ├─ Sort & Filter
  │     │  ├─ Click column header to sort
  │     │  ├─ Click pagination to navigate
  │     │  └─ Change rows per page
  │     │
  │     ├─ Click "Add Deployment" button
  │     │  ↓
  │     │  Add New Deployment Page (/unit/deployment/add)
  │     │  │
  │     │  ├─ SECTION ONE: Unit & Client
  │     │  │  ├─ Select Unit Code (Search/dropdown) *
  │     │  │  ├─ Unit Name (Auto-filled)
  │     │  │  ├─ Client Name (Auto-filled)
  │     │  │  └─ Branch (Auto-filled)
  │     │  │
  │     │  ├─ SECTION TWO: Operation Details
  │     │  │  ├─ Enter Duty Hours (1-24) *
  │     │  │  ├─ Enter Strength (>= 1) *
  │     │  │  ├─ Select Deployment Date (picker) *
  │     │  │  └─ Add Remark (optional)
  │     │  │
  │     │  ├─ SECTION THREE: Contact & Approval
  │     │  │  ├─ Enter Email *
  │     │  │  └─ Select GOM Approval (Yes/No) *
  │     │  │
  │     │  ├─ SECTION FOUR: Wage & Billing
  │     │  │  ├─ Select Wages Structural *
  │     │  │  ├─ Select Rate Approved (Yes/No) *
  │     │  │  ├─ Select Billing Type *
  │     │  │  └─ Select PO Status (Yes/No) *
  │     │  │
  │     │  ├─ SECTION FIVE: Client & Resources
  │     │  │  ├─ Select Client Type *
  │     │  │  ├─ Select Lead CLO By *
  │     │  │  ├─ Select Lead Gen By *
  │     │  │  └─ Select Deployment Days *
  │     │  │
  │     │  ├─ SECTION SIX: BD & Agency (Optional)
  │     │  │  ├─ Select BD Person (optional)
  │     │  │  └─ Enter Agency Takeover (optional)
  │     │  │
  │     │  ├─ Validate all required fields *
  │     │  │  │
  │     │  │  ├─ Valid: 
  │     │  │  │  ├─ Click "Submit"
  │     │  │  │  ├─ Show loading spinner
  │     │  │  │  ├─ Save deployment
  │     │  │  │  ├─ Show success: "Deployment created
  │     │  │  │  │  successfully!"
  │     │  │  │  └─ Return to deployment list
  │     │  │  │
  │     │  │  └─ Invalid: Show error messages on fields
  │     │  │           Focus on first error
  │     │  │
  │     │  ├─ Click "Clear"
  │     │  │  ↓
  │     │  │  Reset all form fields
  │     │  │  Clear search selections
  │     │  │  Ready for new entry
  │     │  │
  │     │  └─ Click "Back"
  │     │     ↓
  │     │     Warn if unsaved changes
  │     │     Return to deployment list
  │     │
  │     ├─ Click Delete (Trash) icon for deployment
  │     │  ↓
  │     │  Delete Confirmation Modal
  │     │  │
  │     │  ├─ Show warning:
  │     │  │  "Are you sure?"
  │     │  │  "You are about to permanently delete
  │     │  │   this deployment record."
  │     │  │
  │     │  ├─ Show deployment details:
  │     │  │  - Unit Name
  │     │  │  - Client Name
  │     │  │  - Deployment Date
  │     │  │
  │     │  ├─ Click "Yes, delete it!"
  │     │  │  ↓
  │     │  │  Permanently delete deployment
  │     │  │  Close modal
  │     │  │  Show success: "Deployment deleted
  │     │  │  successfully"
  │     │  │  Refresh deployment list
  │     │  │  Remove from display
  │     │  │
  │     │  └─ Click "Cancel"
  │     │     ↓
  │     │     Close modal
  │     │     Return to list
  │     │     Deployment remains
  │     │
  │     └─ Pagination & Sorting
  │        ├─ Navigate pages
  │        ├─ Change rows per page
  │        └─ Sort by columns

  └──────────────────────────────
     End of Deployment Management

Validation Rules & Error Messages

Unit Code Validation

  • Required: Yes
  • Format: Must be valid unit code in system
  • Logic: Unit must be active
  • Error Messages:
    • "Unit code is required"
    • "Invalid unit code selected"
    • "Selected unit is inactive"

Unit Name Validation

  • Required: Yes
  • Logic: Must match selected unit
  • Auto-fill: Populated from Unit Code
  • Error Messages:
    • "Unit name is required"
    • "Unit name must match selected unit"

Client Name Validation

  • Required: Yes
  • Max Length: 100 characters
  • Logic: Must be valid client
  • Auto-fill: From unit data
  • Error Messages:
    • "Client name is required"
    • "Invalid client"

Branch Validation

  • Required: Yes
  • Logic: Must be valid branch
  • Auto-fill: From unit data
  • Error Messages:
    • "Branch is required"
    • "Invalid branch"

Duty Hours Validation

  • Required: Yes
  • Type: Integer
  • Min: 1
  • Max: 24
  • Error Messages:
    • "Duty hours is required"
    • "Must be between 1 and 24 hours"
    • "Invalid number format"

Strength Validation

  • Required: Yes
  • Type: Integer
  • Min: 1
  • Max: 99999
  • Error Messages:
    • "Strength is required"
    • "Must be a positive number"
    • "Strength must be at least 1"

Deployment Date Validation

  • Required: Yes
  • Format: MM/DD/YYYY
  • Logic: Current or future date only
  • Error Messages:
    • "Deployment date is required"
    • "Date cannot be in the past"
    • "Invalid date format"

Email Validation

  • Required: Yes
  • Format: Valid email format
  • Max Length: 100 characters
  • Logic: Must contain @ and domain
  • Error Messages:
    • "Email is required"
    • "Invalid email format"
    • "Email exceeds 100 characters"

Dropdown Validations

  • GOM Approval: Must select Yes or No
  • Wages Structural: Must select valid option
  • Rate Approved: Must select Yes or No
  • Billing Type: Must select valid option
  • PO Status: Must select Yes or No
  • Client Type: Must select valid option
  • Lead CLO By: Must select valid person
  • Lead Gen By: Must select valid person
  • Deployment Days: Must select valid option

Success & Error Messages

Success Messages

ActionMessageDisplay Time
Create Deployment"Deployment created successfully."3 seconds
Delete Deployment"Deployment deleted successfully."3 seconds
Update Deployment"Deployment updated successfully."3 seconds
Search ResultsShows filtered recordsUntil search cleared

Error Messages

ScenarioMessageAction
Unit code empty"Unit code is required"Focus field
Invalid unit"Invalid unit code selected"Select valid unit
Email invalid"Invalid email format"Correct format
Duty hours invalid"Must be between 1 and 24 hours"Adjust hours
Date in past"Date cannot be in the past"Select future date
Network error"Failed to save deployment. Please try again."Retry button
Server error"An error occurred. Please contact support."Contact admin

Field Dependencies & Auto-fill

Auto-fill Rules

Source FieldTriggersTarget FieldsData
Unit CodeSelectionUnit NameUnit's registered name
Unit CodeSelectionClient NameUnit's assigned client
Unit CodeSelectionBranchUnit's operating branch
Unit CodeSelectionEmailPrimary contact email

Dependent Field Rules

ConditionEffectExample
When Unit Code changesReset Unit Name, Client, BranchNew unit selected
When Client selectedLoad billing historyRecent billing rate
When Date changesUpdate deployment statusDate validation
When Strength changesCalculate total costCost recalculation

End of Documentation