Field Officer

Overview

The Field Officer in Worksphere provides administrators with a comprehensive interface to assign and manage field officers for operational units. This module enables mapping field officers to units, managing their assignments, and tracking their responsibilities across different units.

Purpose

The Field Officer enables:

• Assign Field Officers - Map field officers to specific units
• View Assignments - Display all field officer to unit mappings
• Edit Assignments - Modify field officer unit assignments
• Delete Assignments - Remove field officer mappings
• Search & Filter - Quickly locate field officers and their assignments
• Track Designations - Manage field officer roles and titles

Module Features

• Field officer to unit mapping
• Unit-based filtering and search
• Field officer availability tracking
• Assignment date tracking (From Date, To Date)
• Designation management
• Bulk assignment capability
• Search and filter functionality

Module Navigation

Accessing the Field Officer Management Module

Application: Worksphere
URL: http://localhost:3000
Path: Unit → Field Officer or Direct Access: /unit/field-officer

Access Points

• From Unit Creation: After completing Unit Information tab, navigate to Field Officer tab
• Direct Access: Via sidebar navigation or main menu
• From Unit List: Click on unit to manage its field officers

User Access

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

Page 1: Field Officer List Page

URL: /unit/field-officer

Overview

The Field Officer List page displays all field officer to unit mappings in the Worksphere system. It provides search, filtering, and assignment management capabilities, allowing administrators to efficiently manage field officer assignments.

Page Description

The Field Officer List page contains:

1. Page Header

   • Title: "Field Officer Mapping"
   • Breadcrumb: Dashboard > Unit > Field Officer
   • User info and logout in top right

2. Filter & Search Section

   • Unit dropdown (Select or create a unit)
   • Branch field (auto-filled, read-only)
   • Field Officer search/select dropdown
   • Designation text input
   • Submit button → Assigns field officer to unit
   • Search button → Filters the list
   • Reset button → Clears all filters

3. Field Officers Table

   • Displays all field officer mappings with columns

Filter & Search Fields

Unit (Required for Search)

• Type: Dropdown/Select
• Required: Yes for searching
• Placeholder: "Select unit"
• Options: List of all active units
• Behavior: Auto-populates Branch field when selected
• Search: Searchable dropdown

Branch (Auto-filled)

• Type: Text Input
• Read-only: Yes
• Auto-populated: Based on selected unit
• Placeholder: "Branch will auto-fill"
• Editable: No

Field Officer (Optional)

• Type: Dropdown/Search
• Required: No
• Placeholder: "Search or select field officer"
• Options: List of all field officers
• Search: Searchable dropdown with real-time filter
• Behavior: Filters based on unit selection if applicable

Designation (Optional)

• Type: Text Input
• Required: No
• Max Length: 50
• Placeholder: "Enter designation"
• Search: Text-based search

Buttons

Table Columns & Fields

Fields in Detail

S No

• Serial number starting from 1
• Automatically incremented
• Resets on pagination
• Non-editable

Field Officer Name

• Full name of the field officer
• Text format
• Primary identifier
• Clickable to view details
• Truncated if too long (with ellipsis "...")

Unit

• Assigned unit name
• Text format
• Shows which unit the FO is assigned to
• Clickable to view unit details
• Truncated if too long

From Date

• Assignment start date
• Date format (YYYY-MM-DD)
• Shows when assignment began
• Non-editable in list

To Date

• Assignment end date
• Date format (YYYY-MM-DD)
• Shows when assignment ends/ended
• Optional field
• Shows "Ongoing" if empty/null

Actions Column

• Edit Icon (Pencil icon, Blue) - Click to edit assignment
• Delete Icon (Trash icon, Red) - Click to delete assignment

Buttons & Actions

Search Functionality

1. Select a unit from Unit dropdown (optional but recommended)
2. Optional: Select specific field officer
3. Optional: Enter designation
4. Click "Search" button
5. System filters results based on selected criteria
6. Displays matching field officer mappings
7. Shows "No field officers assigned" if no matches
8. Click "Reset" to clear all filters

User Flow - Field Officer List Page

┌──────────────────────────────────┐
│   Field Officer List Page        │
│                                  │
│  Filter Section:                 │
│  Unit ──────────────────────────  │
│  Branch (auto-fill) ─────────────  │
│  Field Officer ──────────────────  │
│  Designation ────────────────────  │
│                                  │
│  [Submit] [Search] [Reset]       │
│                                  │
├──────────────────────────────────┤
│                                  │
│  S No | FO Name | Unit | From  │  │
│        |         |      | Date | │ Date │ Actions
│  ──────────────────────────────  │
│   1   | John    | Unit | 01-  │  │ 01-   │ ✎ 🗑
│   2   | Sarah   | Unit | 15-  │  │ 31-   │ ✎ 🗑
│   3   | Mike    | Unit | 10-  │  │ On    │ ✎ 🗑
│                                  │
│  [Previous] [Next] (Pagination)  │
│                                  │
└──────────────────────────────────┘

Pagination

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

Validations & Notes

• Empty State: If no field officers assigned, show "No field officers assigned. Click 'Submit' to add one."
• Permissions: Only admin/superadmin can manage field officer assignments
• Unit Required: Unit must be selected to search/assign
• Auto-fill: Branch field auto-populates when unit is selected
• Date Format: From Date and To Date in YYYY-MM-DD format
• Ongoing Status: Assignments without To Date are marked as "Ongoing"

Page 2: Add Field Officer Mapping

Overview

The Add Field Officer Mapping page is triggered when clicking the "Submit" button on the Field Officer List page. It assigns a field officer to a selected unit.

Form Description

The Add Field Officer Mapping form contains:

1. Form Header

   • Title: "Assign Field Officer to Unit"
   • Shows selected unit name

2. Form Fields

   • Unit (pre-filled from list selection, editable)
   • Field Officer (mandatory)
   • Designation (optional)

3. Action Buttons

   • Save / Submit button
   • Cancel button

Form Fields

Fields in Detail

Unit (Required)

• Type: Dropdown/Select
• Required: Yes
• Pre-filled: From list selection if available
• Editable: Yes (can change)
• Placeholder: "Select unit"
• Options: List of all active units
• Validation: Cannot be empty
• Error Message: "Unit is required"

Field Officer (Required)

• Type: Dropdown with Search
• Required: Yes
• Placeholder: "Search or select field officer"
• Options: List of all available employees
• Searchable: Yes (real-time search)
• Validation Rules:
  • Cannot be empty
  • Must be valid employee
• Error Message: "Field officer is required"

Designation (Optional)

• Type: Text Input
• Required: No
• Max Length: 50
• Placeholder: "Enter designation (e.g., Field Supervisor)"
• Validation Rules:
  • Optional field
  • Letters and spaces only
  • No special characters
• Error Message: "Invalid designation format"

Buttons & Actions

Form Behavior

• Pre-fill: Unit field pre-filled if selected from list
• Error Display: Validation errors appear below respective fields in red
• Field Focus: First invalid field gets focus on submission attempt
• Success Message: Green banner at top: "Field officer assigned successfully!"
• Loading State: Submit button shows loading spinner during submission
• Unsaved Changes: Warning if user tries to leave with unsaved data

Validations & Notes

Required Fields:

• Unit
• Field Officer

Optional Fields:

• Designation

Unit Validation:

• Must select from existing units
• Cannot be empty
• Only active units available

Field Officer Validation:

• Must be valid employee
• Cannot be empty
• Search filters available employees in real-time

Designation Validation:

• Optional field
• If provided, letters and spaces only
• Max 50 characters
• Examples: "Field Supervisor", "Site Coordinator", "Unit Manager"

Page 3: Edit Field Officer Page

URL: /unit/field-officer/details/:id

Overview

The Edit Field Officer page allows administrators to modify an existing field officer assignment. The form is pre-populated with current assignment data.

Page Description

The Edit Field Officer page contains:

1. Page Header

   • Title: "Edit Field Officer Assignment"
   • Breadcrumb: Dashboard > Unit > Field Officer > Edit
   • Displays current field officer and unit names

2. Field Officer Form

   • Pre-filled with existing assignment data
   • Same fields as Add Field Officer Mapping page
   • Form validation on submission

3. Action Buttons

   • Update/Save button (replaces Submit)
   • Cancel button
   • Delete button (optional)

Form Fields

The Edit Field Officer page contains all the same fields as the Add Field Officer Mapping page:

Fields in Detail

All fields maintain the same validation rules as Add Field Officer Mapping page:

Unit (Required)

• Pre-filled with current unit
• Fully editable
• Can change unit assignment
• Validation applies

Field Officer (Required)

• Pre-filled with current field officer
• Fully editable
• Can change assigned officer
• Validation applies

Designation (Optional)

• Pre-filled with current designation
• Fully editable
• Can be updated or cleared
• Optional field

Buttons & Actions

Form Behavior

• Pre-fill: On page load, all fields populated with current data
• Change Detection: Form indicates unsaved changes
• Error Display: Validation errors appear below respective fields
• Success Message: "Field officer assignment updated successfully!"
• Loading State: Update button shows loading spinner during submission
• Unsaved Changes Warning: Prompt if user tries to leave with unsaved changes

Validations & Notes

All validations follow the same rules as Add Field Officer Mapping page

Page 4: Delete Field Officer Confirmation Alert

Overview

The Delete Field Officer Confirmation is a modal dialog that appears when an administrator clicks the delete action on a field officer assignment. It confirms the user's intention to delete the assignment.

Modal Dialog

Dialog Header

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

Dialog Content

Message:

You are about to delete this field officer assignment.

Additional Information:

• Displays field officer name
• Shows unit name
• Shows assignment dates
• Shows warning: "This action cannot be easily reversed"
• Example: "Deleting 'John Doe' from 'North Delhi Unit' (01-Jan-2024 to Ongoing)"

Dialog Body Fields

Buttons & Actions

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 on modal appearance

User Flow - Delete Field Officer Confirmation

┌────────────────────────────────┐
│   Field Officer List Page      │
│   Click Delete Icon (Trash)    │
├────────────────────────────────┤
│                                │
│  ┌─ Delete Modal appears       │
│  │  Shows:                     │
│  │  "Are you sure?"            │
│  │  "You are about to delete   │
│  │   this FO assignment"       │
│  │                             │
│  │  FO: "John Doe"             │
│  │  Unit: "North Delhi Unit"   │
│  │  Dates: 01-Jan to Ongoing   │
│  │                             │
│  │  [Yes, delete it!]          │
│  │  [Cancel]                   │
│  │                             │
│  ├─ Click "Yes, delete it!"    │
│  │  ↓                          │
│  │  Delete assignment          │
│  │  Close modal                │
│  │  Show success: "Assignment  │
│  │  deleted successfully!"     │
│  │  Refresh Field Officer List │
│  │  Remove from display        │
│  │                             │
│  ├─ Click "Cancel"             │
│  │  ↓                          │
│  │  Close modal                │
│  │  Return to FO List          │
│  │  No changes made            │
│  │                             │
│  └─ Click X (close button)     │
│     ↓                          │
│     Close modal                │
│     Return to FO List          │
│                                │
└────────────────────────────────┘

Validations & Notes

• Required Confirmation: User must explicitly click "Yes, delete it!"
• Destructive Action: Message clearly indicates this is deletion
• Soft Delete: Assignment is marked as deleted (data preserved)
• Audit Trail: Deletion is logged with user info
• Reassignment: Field officer can be reassigned to unit later if needed

Search Using Unit Selection

Search Flow

1. Select Unit:

   • Open Unit dropdown on Field Officer List page
   • Select desired unit
   • Branch field auto-populates

2. Optional Filters:

   • Select specific Field Officer (optional)
   • Enter Designation (optional)

3. Execute Search:

   • Click "Search" button
   • System filters and displays results

Result Display

• Displays: Only field officers assigned to selected unit
• Empty State: If no officers assigned, shows "No field officers assigned to this unit"
• Sorted By: Assignment date (latest first)
• Columns: S No, FO Name, Unit, From Date, To Date, Actions

Filter Combinations

Field Officer Management Flow

START (Unit Creation Complete)
  │
  ├─→ Click Next on Unit Tab 2
  │     │
  │     ▼
  │  ┌──────────────────────────────┐
  │  │ Field Officer Mapping Page   │
  │  │                              │
  │  │ Filter Section:              │
  │  │ - Unit (dropdown)            │
  │  │ - Branch (auto-fill)         │
  │  │ - Field Officer (search)     │
  │  │ - Designation (text)         │
  │  │                              │
  │  │ [Submit] [Search] [Reset]    │
  │  │                              │
  │  │ ─────────────────────────────│
  │  │ S No | FO | Unit | From | To │ Actions
  │  │ ─────────────────────────────│
  │  │ ...list of assignments...    │
  │  │                              │
  │  │ ┌─ Click "Submit"            │
  │  │ │  ↓                         │
  │  │ │ ┌──────────────────────┐  │
  │  │ │ │ Add FO Mapping Form  │  │
  │  │ │ │ Unit (required)      │  │
  │  │ │ │ Field Officer (req)  │  │
  │  │ │ │ Designation (opt)    │  │
  │  │ │ │ [Save] [Cancel]      │  │
  │  │ │ └──────────────────────┘  │
  │  │ │      │         │          │
  │  │ │   Save      Cancel        │
  │  │ │      │         │          │
  │  │ │      ▼         │          │
  │  │ │   Success      │          │
  │  │ │      │         │          │
  │  │ │      └────┬────┘          │
  │  │ │           ▼               │
  │  │ │  Return to FO List        │
  │  │ │                           │
  │  │ ├─ Click "Search"           │
  │  │ │  ↓                        │
  │  │ │  Filter results           │
  │  │ │  ↓                        │
  │  │ │  Display filtered list    │
  │  │ │                           │
  │  │ ├─ Click Edit (Pencil)      │
  │  │ │  ↓                        │
  │  │ │ ┌──────────────────────┐  │
  │  │ │ │ Edit FO Mapping      │  │
  │  │ │ │ (pre-filled)         │  │
  │  │ │ │ [Update] [Cancel]    │  │
  │  │ │ │ [Delete]             │  │
  │  │ │ └──────────────────────┘  │
  │  │ │      │         │    │     │
  │  │ │   Update   Cancel Delete  │
  │  │ │      │         │    │     │
  │  │ │      ▼         │    ▼     │
  │  │ │   Success      │  Delete  │
  │  │ │      │         │  Modal   │
  │  │ │      └────┬────┘    │     │
  │  │ │           │         │     │
  │  │ │      Return to List ├────┐│
  │  │ │                     │    ││
  │  │ │                  Confirm ││
  │  │ │                     │    ││
  │  │ │                     ▼    ││
  │  │ │                  Success ││
  │  │ │                     │    ││
  │  │ │                     └────┘│
  │  │ │                          │
  │  │ └─────────────────────────┘
  │  │
  │  └─────────────────────────────────
  │     Continue to next unit tab
  │
  └──────────────────────────────────
     End of Unit Creation Flow

Field Officer Management Best Practices

For Administrators

1. Assigning Field Officers

   • Assign qualified and experienced officers
   • Consider unit workload and complexity
   • Document assignment reasons in notes
   • Maintain coverage across all units
   • Plan for absences and leaves

2. Managing Assignments

   • Regularly review assignments
   • Update when officers change roles
   • Set end dates for temporary assignments
   • Maintain audit trail of changes
   • Track assignment history

3. Search & Navigation

   • Use unit filter for quick lookup
   • Filter by designation for role-based search
   • Use FO search for specific officer
   • Combine filters for refined results
   • Check assignment duration regularly

Success Messages

End of Documentation