Project Manager Dashboard

"šŸ–„ļø Project Manager Dashboard – UI Layout 🌐 1. Main Dashboard (Homepage) Purpose: Provide an at-a-glance summary of all key metrics and actions. Layout: Top Navbar (Fixed): Bramhasmi Logo (Left) Notifications Icon (with badge) Profile Avatar (Dropdown: Profile, Settings, Logout) Hero Section (Stats Overview) Total Earnings (₹) – Card with monthly and total earnings. Active Projects – Number + quick access link. Pending Withdrawals – With "Request Withdrawal" button. Cold Email Stats – Emails sent, Open Rate %, Replies. Quick Actions (3 Buttons): āž• Create New Project šŸ“¤ Upload Client CSV šŸ“Š View Reports Recent Activity Feed Latest project updates, client interactions, and system logs. šŸ“§ 2. Cold Email Automation Page Purpose: Manage client outreach campaigns. Layout: Header: Page Title: "Cold Email Automation" šŸ“‚ Upload CSV Button (Drag & Drop or File Picker). Email Template Selector Dropdown to choose a pre-made email template. Editable preview panel (dynamic fields highlighted). Campaign Metrics Sent Emails – Card with a progress bar. Open Rate – % with a line graph. Reply Rate – % with status breakdown. Email History Table Columns: Campaign Name | Sent Date | Total Sent | Opened | Replied šŸ‘¤ 3. Clients Page Purpose: Manage and track all clients. Layout: Search & Filter Bar šŸ” Search by Name/Email. Filters: Active, Past, Prospect. Client List Table Columns: Client Name | Status | Total Projects | Last Interaction | Actions (View/Edit). Client Details Modal (When clicked): Contact Info (Name, Email, Phone). Project History (List of assigned projects). Payment Summary. šŸ“‚ 4. Project Management Page Purpose: Oversee all project activities. Layout: Search & Filter Bar Filters: Active, Pending, Completed. Date Range Picker. Project Cards (Grid Layout) Each card includes: Project Title. Client & Assigned Devs. Deadline & Status Badge (In Progress, Pending, Completed). Quick Actions: View, Edit, Close. Project Detail Page (On click): Project Timeline (Milestones & Status). Assigned Developers (Profile cards). Document Upload (Contracts, Briefs, Invoices). šŸ’ø 5. Earnings & Withdrawals Page Purpose: Track and manage PM payouts. Layout: Earnings Summary Total Earnings (Lifetime, Monthly). Pending Withdrawal. "Request Withdrawal" Button. Transaction History Table Columns: Date | Amount | Status (Pending, Paid) | Method (UPI, Bank). šŸ”” 6. Notifications Panel Purpose: Provide real-time updates. Layout: Dropdown (From Navbar) Recent Alerts (Task updates, payment alerts). "Mark All as Read" Button. Link to Full Notification History Page. šŸ“„ 7. Profile Page Purpose: Manage PM personal data. Layout: Profile Card Avatar Upload. Name, Email, Contact Info. Performance Metrics Projects Managed. Client Satisfaction Rating (Feedback system). Settings Panel Payment Preferences. Password Change. "

Dependencies:

  1. 1. Run "npm install david-ai" in terminal
  2. 2. Copy the code and paste it in your project.
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Copyright © 2026  Creative AI. Made with 🩶 for better Customer Experience.
Feedback