Webapp Home Page
The main dashboard interface providing users with a comprehensive overview of their daily activities, upcoming schedule, and quick access to key features within the P3M platform.
Overview
The P3M webapp home page serves as the central hub for users after login, providing:
- Personalized welcome experience with time-based greetings
- Real-time overview of today's activities (audits, tasks, records)
- Interactive calendar showing upcoming events and deadlines
- Dual view modes: Dashboard cards and Timetable view
- Role-based content filtering and organization-specific data
- Responsive design optimized for all device types
Main Features
Personalized Greeting
Dynamic greeting based on time of day and user name
- Good Morning/Afternoon/Evening based on current time
- Displays user's full name from profile
- Shows current date in readable format
View Mode Selector
Toggle between Dashboard and Timetable views
- Dashboard view: Card-based activity overview
- Timetable view: Calendar-based schedule display
- Seamless switching with preserved state
Today's Activities
Real-time overview of current day activities
- Today's Audits: Active and scheduled audits
- Today's Tasks: Assigned and pending tasks
- Today's Records: Completed activities and submissions
Upcoming Schedule
Calendar integration showing future events
- Interactive calendar with event indicators
- Upcoming audits and task deadlines
- Monthly view with navigation controls
Dashboard Cards
The dashboard view consists of four main activity cards that provide real-time information:
Today's Audits Card
- List of audits scheduled for today
- Audit status indicators (Pending, In Progress, Completed)
- Quick access to start or continue audits
- Audit type and department information
- Real-time status updates
Today's Tasks Card
- Personal and assigned tasks for today
- Task priority indicators
- Progress tracking with completion percentage
- Due date and time information
- Quick task completion actions
Today's Records Card
- Completed activities and submissions
- Record types and categories
- Submission timestamps
- Quick access to view record details
- Performance metrics overview
Upcoming Calendar Card
- Interactive monthly calendar view
- Event indicators with color coding
- Navigation between months
- Event details on hover/click
- Integration with Google Calendar
View Modes
Dashboard View
Card-based layout showing today's activities and upcoming schedule. Provides quick overview and easy access to key information.
Timetable View
Calendar-focused layout displaying schedule in a traditional timetable format. Ideal for users who prefer chronological organization.
Technical Features
Real-time Data Updates
Live data synchronization across all dashboard components
Responsive Design
Optimized for desktop, tablet, and mobile devices
Performance Optimized
Efficient data loading and caching for fast user experience
Context-Aware
Content adapts based on user role and organization
User Experience
Personalization
The home page adapts to each user's role, organization, and personal preferences. Content is filtered and prioritized based on relevance to the user's responsibilities.
Performance
Optimized data loading ensures fast page loads and real-time updates. Efficient caching prevents duplicate API calls across components.
Accessibility
Responsive design ensures optimal experience across desktop, tablet, and mobile devices. Clear visual hierarchy and intuitive navigation enhance usability.
Related Documentation
On This Page
Table of contents will be populated by individual pages