Data Monitoring Web App Development (I included images as basis and reference)

Job ID: 39397181

Budget: $30 – $250 USD

Project Overview
This project involves repurposing an existing web template into a robust employer data management system with role-based access, data tracking, printable templates, and geographic categorization. The system is intended to support workflow across different user levels: Manager, Rank-and-File, and Lawyers.

Functional Requirements
1. Employer Data Management (CRUD)
Fields:

Employer Name

Employer ID (formatted as 00-0000000-0-000 with validation)

Status (e.g., For Review, Ongoing, Completed)

Additional fields (to be defined later)

Capabilities:

Create, read, update, and delete employer records

Assign records to specific users

2. Printable Templates
Generate printable outputs per employer record

Templates must dynamically include employer-specific data

Access limited to users with appropriate permissions

3. Data Counts and Charts
Total number of employer records

Breakdown by:

Status

Region and City

Assigned user

Visual representation via charts (e.g., bar, pie, line)

4. Status Monitoring
Dashboard to track record status in real time

Status filters and grouping

Optional: timeline or history log for updates

5. Role-Based Access Control (Hierarchical: Manager → Rank-and-File → Lawyers)
Manager:

Full access to all data

Can assign work to Rank-and-File

Can print and oversee progress

Rank-and-File:

Can view and update only assigned records

Can add additional details and print templates

Lawyers:

Read-only access to finalized records

Option to add comments or approvals

6. User Image Records
Capture and store a photo per user

Useful for user identification and documentation

7. Date and Event Tracking
Track key dates (e.g., hearings, deadlines)

Input-based event logs grouped by employer or status

Filterable by date range

8. Categorization: Regions and Cities
Regional classification system

Example: NCR-North, NCR-South

Sub-category for cities within each region

Example: Quezon City, Caloocan City under NCR-North

9. Login/Logout (different access right as per job title/position)

10. Future Expansion
System architecture must be modular and scalable

Additional features and fields to be added as needed

Technical Recommendations
Frontend: HTML5, Tailwind CSS, JavaScript (Vue or React optional)

Charts: ApexCharts or Chart.js

Backend Options: PHP, Node.js, Firebase, or Python Flask

Database: MySQL, Firestore, or MongoDB

Authentication: Role-based access (JWT or session-based login)
Related categories: JavaScript CSS MySQL HTML5 Node.js