Create a modern ui admin dashboard which will have the following features 1. Dashboard with recent doctor sign up , recent activity of doctor, new events registration of doctor, and further graphs,2. Masters list of doctor signed up and their details with the beneficiaries added by them. Details added by them are Name, mobile no, whatsapp number, email id, calling number, pin code of clinic address, state, district, sub-district, city information about their clinic Complete address about their clinic with proof that will be either business card, clinic brochure or any other thing, Date of birth, if married then Anniversary date. All these information must proper view and edit option 3. Event creation page where admin will create the event with type of event name, details, description, and the date, upload the brochure and select the register doctor or the enter csv of doctor list with basic information of name, number and email. After all these it must the show preview of the sending message on mail and whatsapp.4. It should have the form builder option also where admin can create a form design and decide which will field to appear when registration is done by the doctor with benificaries details adding.5. It should also have the notification option where admin can the see notification of registerd event doctor, and other type of notification6. It should have admin users adding option also where admin can add their different teams memeber with different roles.7. It should roles master also where admin can add different rolesName for the project will be Medi Heart cardic care. It should have proper mobile and desktop friendly ui and ux with proper tables in desktop version and card and its respective navigation in mobile
I'll create a comprehensive admin dashboard for Medi Heart Cardiac Care with all the features you requested. This will be a modern, responsive UI with proper navigation and all the required functionality.
I've created a comprehensive admin dashboard for Medi Heart Cardiac Care with all the features you requested. Here's what I've built:
Key Features Implemented:
1. Dashboard(/)
- Recent doctor sign-ups with profile cards
- Recent activity timeline
- Event registration statistics
- Interactive charts showing doctor registrations and events
- Pie chart for doctor specialties distribution
- Responsive stats cards
2. Doctors Management(/doctors)
Complete doctor profiles with all requested fields:
- Personal info (name, mobile, WhatsApp, email, calling number)
- Clinic details (address, pincode, state, district, sub-district, city)
- Professional info (DOB, anniversary date, specialty)
- Beneficiaries count
- Desktop table view and mobile card view
- Search and filter functionality
- View and edit dialogs with comprehensive forms
- Proof document upload capability
3. Events Management(/events)
Event creation with multi-step wizard:
- Event details (name, type, description, date)
- Brochure upload
- Doctor selection (individual or CSV upload)
- Email and WhatsApp message preview
- Events listing with registration tracking
- Status management (Active/Draft)
4. Form Builder(/form-builder)
- Drag-and-drop form designer
- Multiple field types (text, email, phone, date, textarea, dropdown, checkbox, address)
- Real-time form preview
- Field customization (labels, placeholders, required status)
- Form templates management
5. Notifications(/notifications)
- Categorized notifications (event registrations, doctor activities, system updates)
- Priority levels (high, medium, low)
- Read/unread status management
- Filter by type and status
- Statistics dashboard
6. Admin Users Management(/admin-users)
- User creation with role assignment
- Department-based organization
- Status toggle (Active/Inactive)
- Last login tracking
- Permission management
7. Roles Management(/roles)
- Custom role creation
- Granular permission system
- User assignment tracking
- Role templates for common use cases
Technical Features:
Responsive Design
- Desktop: Full tables with comprehensive data display
- Mobile: Card-based layouts with essential information
- Sidebar navigation that collapses on mobile 1
Modern UI/UX
- Clean, medical-themed design with red accent colors
- Consistent spacing and typography
- Interactive elements with hover states
- Loading states and empty states
- Toast notifications for user feedback
Navigation
- Collapsible sidebar with role-based menu items 1
- Breadcrumb navigation
- Quick access to frequently used features
Data Management
- Search and filter capabilities across all modules
- Bulk operations where applicable
- Export functionality (ready for implementation)
- Real-time updates and notifications
The dashboard is fully responsive, uses modern React patterns, and provides an excellent user experience for managing the healthcare platform. All components are built with shadcn/ui for consistency and accessibility.
Sources
I'll create a comprehensive analytics page with event tracking, editing capabilities, and detailed event views with doctor lists.
I've created a comprehensive Analytics page with all the features you requested:
Key Features Implemented:
1. Analytics Overview Tab
- Stats Cards: Total events, registrations, emails sent, WhatsApp messages
- Registration Trend Chart: Line chart showing daily registration patterns
- Communication Statistics: Pie chart showing email/WhatsApp engagement rates
2. Events Analytics Tab
Event Performance Cards: Each event shows detailed metrics including:
- Total invited, registered, and attended counts
- Email open rates and WhatsApp read rates
- Conversion percentages
- Event status (completed/upcoming)
Edit Event Functionality:
- Edit button for each event
- Modal dialog to update event name and description only
- Updates propagate to all related tracking data
3. Registration Tracking Tab
Comprehensive Tracking Table with columns for:
- Doctor information (name, email, avatar)
- Event details (name, ID)
- Registration timestamp
- Email status (sent/opened with timestamps)
- WhatsApp status (sent/delivered/read with timestamps)
- Registration status (confirmed/pending/cancelled)
- Attendance status (attended/no-show/pending)
- Ratings and feedback
Advanced Filtering:
- Search by doctor name, email, or event name
- Filter by specific event
- Filter by registration status
- Visual Status Indicators: Icons and badges for quick status recognition
4. Event Details View
- Dedicated Event Details Dialog accessible via "View Details" button
Complete Event Information:
- Event name, description, and status
- Performance metrics (invited, registered, emails opened, WhatsApp read)
Doctor List Section:
- All doctors who received event invitations
- Individual communication tracking for each doctor
- Registration timestamps and status
- Email and WhatsApp delivery/read status
- Attendance tracking and ratings
- Feedback comments
5. Edit Event Functionality
- Restricted Editing: Only event name and description can be modified
- Real-time Updates: Changes reflect across all related tracking data
- Toast Notifications: Success feedback for updates
Technical Features:
Data Visualization
- Interactive charts using Recharts library
- Responsive design for all screen sizes
- Color-coded status indicators
Advanced Filtering & Search
- Real-time search across multiple fields
- Multiple filter combinations
- Preserved filter state during navigation
Comprehensive Tracking
- Email delivery and open tracking
- WhatsApp delivery and read receipts
- Registration timestamps
- Attendance tracking
- Rating and feedback collection
User Experience
- Tabbed interface for organized data presentation
- Modal dialogs for detailed views
- Export functionality (ready for implementation)
- Mobile-responsive design
- Loading states and error handling
The analytics page provides complete visibility into event performance, doctor engagement, and communication effectiveness, making it easy for admins to track the success of their events and optimize future campaigns.