projectDescription.txt

Project Overview:
The E-OD: Events and OD Management Platform is designed to streamline the on-duty (OD) approval process for students participating in events, address administrative issues, and improve communication between students and faculty. The platform replaces the current cumbersome, paper-based system with an online solution that automates OD requests, tracks approvals, and eliminates the need for WhatsApp group notifications about absences.

Key Problems Addressed:
Cumbersome OD Process: Students currently face a long process of getting physical forms signed by tutors, Academic Coordinators (ACs), and Heads of Departments (HODs).
Cluttered Communication: Students post signed OD forms in WhatsApp groups, leading to unnecessary and frequent messages.
Verification Challenges: There’s no streamlined way to verify and track OD requests, leading to the risk of unauthorized or proxy ODs.
Platform Goals:
Simplify and automate the OD request and approval process.
Provide a unified platform for event registration and OD management.
Allow real-time tracking of OD requests through a multi-step approval process.
Reduce WhatsApp group clutter by handling OD communication through the platform.
Facilitate immediate ODs for urgent or external events.
Offer a robust system for event organizers to manage event participants and OD-related activities.
Target Users:
Students: Request ODs for events, view event details, track OD status.
Tutors, ACs, HODs: Approve or reject OD requests based on their role in the hierarchy.
Teachers (who are not tutors, ACs, or HODs): Manage students' ODs and their attendance without extra notifications.
Event Organizers: Manage event details, participants, and ODs for their events.
Admins: Oversee user management and event organization.
Core Features and Modules:
1. Authentication and User Management:
User Roles: Students, Tutors, ACs, HODs, Teachers, Event Organizers, Admins.
User Credentials:
Students: Name, email, password, roll number, department, and assigned tutor, AC, and HOD.
Teachers: Name, email, staff ID, courses taught.
Authentication: Users log in with email and password. JWT-based authentication is implemented to secure sessions.
Role-Based Access: Middleware checks for access based on user roles (e.g., tutors can only approve requests for students they handle, event organizers can create events).
2. Event Management:
Event Creation:
Students with the isLeader or isOrganizer role can create events using the Event Management System.
Events include details like event name, description, date, location, and maximum participants.
Event Registration: Students can view and register for events.
Event Participation Management: Event organizers can manage participant lists, including viewing registered participants and their OD statuses.
3. OD Request and Approval System:
OD Request Workflow:
Students can request ODs for registered events through the platform.
Students fill in details such as event name, date, and reason for OD.
Hierarchical Approval:
Step 1: Tutor approves or rejects the request.
Step 2: If approved by the tutor, the request moves to the AC.
Step 3: If approved by the AC, it moves to the HOD.
Step 4: Upon HOD approval, the OD is granted.
If rejected at any stage, the request is marked as rejected and not forwarded.
OD Status Notifications:
Students receive notifications for each stage of the approval process (pending, approved, rejected).
Tutors, ACs, and HODs are notified of new requests awaiting their approval.
4. Immediate OD Requests:
Urgent Requests:
Students can submit immediate OD requests for urgent or external events (not pre-registered).
These requests include editable fields like reason, event details, and date.
The request is digitally signed and approved by the HOD.
Immediate OD Form Generation:
After approval, a pre-built OD form is generated, which students can download.
5. Notifications System:
Student Notifications:
Students are alerted when their OD request is approved, rejected, or awaiting action.
Event reminders are also sent for upcoming events.
Teacher Notifications:
Teachers are notified about students' OD statuses in courses they handle, reducing the need for WhatsApp group messages.
6. Teacher Dashboard:
Courses Overview:
Teachers can view all courses they handle and select a course to manage OD-related information.
OD Attendance Management:
For each course, teachers can see which students have been approved for OD, preventing unnecessary attendance issues.
OD records help in marking attendance appropriately without requiring direct communication from students.
7. Student Dashboard:
Event Registration and OD Requests: Students can browse available events, register, and apply for ODs directly from the event page.
Track OD Requests: A separate section shows pending, approved, and rejected ODs, allowing students to track their requests in real-time.
Immediate OD Requests: A button is available for submitting urgent OD requests for unforeseen circumstances.
8. Admin Dashboard:
User and Event Management:
Admins can manage users (students, teachers, tutors, ACs, HODs, event organizers).
Admins can oversee event creation, approve or reject events, and manage participant lists.
9.My Events Section(for Students and Teachers):
- Available only to users with isLeader role (students or teachers)
- Lists all events created by the current user
- Allows creators to manage their events (edit/delete)
- Provides event management interface for organizers
// Add this section under Core Features and Modules
10. OD History Management:
- Automatic tracking of past OD requests
- Shows approved and rejected ODs
- Includes pending ODs whose start date has passed
- Provides historical record of all OD requests
- Separate from active OD requests section

Technical Architecture:
1. Frontend:
Framework: React (or any frontend framework you choose).
Components:
Login/Register Forms.
Event List and Registration Form.
OD Request Forms (Standard and Immediate).
Event Creation/Management Form.
Notifications Panel.
Dashboard views for Students and Teachers.
2. Backend:
Framework: Node.js with Express.
Database: MongoDB for storing users, events, and OD requests.
APIs:
User Authentication (JWT).
Event Management (Create, Update, Delete, Retrieve).
OD Request Management (Create, Approve, Reject, Fetch).
Notifications API for real-time status updates.
Middleware:
Authentication Middleware: Verifies user tokens.
Role-Based Access Control (RBAC): Ensures that only authorized users access certain routes (e.g., only tutors can approve ODs).
Approval Flow Middleware: Manages the hierarchical approval process.
3. Notifications and Alerts:
Email/SMS (Optional): Integrate notifications via email or SMS if required.
___________FILE STRUCTURE_________
E-ODSYSTEM
-backend
--config
 |-->db.js
--controllers
 |-->auth.controller.js
 |-->course.controller.js
 |-->event.controller.js
 |-->notification.controller.js
 |-->od.controller.js
 |-->teacher.controller.js
 |-->userDetails.controller.js
--middleware
 |-->auth.middleware.js
 |-->error.middleware.js
--models
 |-->course.model.js
 |-->courseEnrollment.model.js
 |-->event.model.js
 |-->notification.model.js
 |-->od.model.js
 |-->registration.model.js
 |-->user.model.js
--routes
 |-->auth.routes.js
 |-->course.routes.js
 |-->event.routes.js
 |-->notification.routes.js
 |-->od.routes.js
 |-->userDetails.routes.js
server.js
-frontend 
--Src
---asserts
---components
  |-->CourseDetails.jsx
  |-->coursemanagement.jsx
  |-->EventCard.jsx
  |-->EventSection.jsx
  |-->EventCreation.jsx
  |-->EventDetails.jsx
  |-->ExternalODSection.jsx
  |-->Login.css
  |-->Login.jsx
  |-->MyEvents.jsx
  |-->Navbar.jsx
  |-->ODApprovalSection.jsx
  |-->ODsection.jsx
  |-->PersonalDetails.jsx
  |-->Register.jsx
  |-->PersonalDetails.jsx
  |-->TeacherPersonalDetails.jsx
---pages
  |-->StudentDashboard.jsx
  |-->TeacherDashboard.jsx
---services
  |-->api.js
  |-->eventservice.js
App.jsx
main.jsx
package-lock.json
package.json
projectDescription.txt
____________________________________________
let me describe how my frontend should look like:
FOR STUDENTS DASHBOARD(HOMEPAGE):
 dashboard showing their own details.
 in that dashboard there the is a sidebar(navigation bar) which has 
1. list of events- where all the upcoming events will be listed in card structure and i should also have a button named register and request OD when student click on he can fill the details or the details for od can be automatically fetched from userdetails itself and send OD request.
2.personal details - where the students details will be displayed and the can update their credentials like changing name, changing the course they are taking , tutor ,ac, hod etc..
3.OD section - in this section the student can see all the od he/she been requested and check the status of approval of the od.
for now this is enough now. we can do more later.

FOR TEACHERS DASHBOARD(HOMEPAGE):
1.personal details - where the teacher details will be displayed and the can update their credentials like changing courses the teaches.
2.OD section - where all the of request from their students(students who have put this teacher as their tutor or ac or hod) will be listed in the for of excel sheet like structure with the details of the od request and also have a checkbox to approve and reject od request.
3.course section - where all the course he/she teaches will be listed in card view when the teacher clicks on it all the students who got OD will be listed with details of the od.
for now this is enough now. we can do more later.
--------------------
only use normal css don't use tailwind css.
i can create css later so only give me jsx file.
i completed implementing login and register.
i am not going to add more backend and leave backend. i started working on frontend.
first i want to complete frontend for student side generate code related to student side.