diff --git a/client/public/logo_.png b/client/public/logo_.png new file mode 100644 index 0000000..873328a Binary files /dev/null and b/client/public/logo_.png differ diff --git a/client/src/App.js b/client/src/App.js index 3c01ec7..6c8362d 100644 --- a/client/src/App.js +++ b/client/src/App.js @@ -14,6 +14,7 @@ import ConsolidatedTable from "./Pages/ConsolidatedTable"; import CourseConsolidated from "./Pages/courseConsolidated"; import PrivateRoute from "./components/PrivateRoute"; import TokenRefresher from "./components/TokenRefresher"; +import DepartmentConsolidated from "./Pages/DepartmentConsolidated"; function App() { return ( @@ -30,6 +31,7 @@ function App() { } />} /> } />} /> } />} /> + } />} /> ); diff --git a/client/src/Pages/DepartmentConsolidated.jsx b/client/src/Pages/DepartmentConsolidated.jsx new file mode 100644 index 0000000..5780466 --- /dev/null +++ b/client/src/Pages/DepartmentConsolidated.jsx @@ -0,0 +1,287 @@ +import React, { useState, useEffect } from "react"; +import axios from "axios"; +import Navbar from "./Navbar"; + +const DepartmentConsolidated = () => { + const [searchQuery, setSearchQuery] = useState(""); + const [data, setData] = useState([]); + const [loading, setLoading] = useState(true); + const [currentPage, setCurrentPage] = useState(1); + const tablesPerPage = 5; + const [expandedDepartment, setExpandedDepartment] = useState(null); + + useEffect(() => { + const fetchData = async () => { + try { + const response = await axios.get( + "http://localhost:8080/api/table/department-consolidated", + { withCredentials: true } + ); + setData(response.data); + setLoading(false); + } catch (error) { + console.error("Error fetching table data:", error); + setLoading(false); + } + }; + + fetchData(); + }, []); + + if (loading) { + return
Loading...
; + } + + // Filter departments based on search query + const filteredDepartments = data.filter((department) => + department.department.toLowerCase().includes(searchQuery.toLowerCase()) + ); + + const totalPages = Math.ceil(filteredDepartments.length / tablesPerPage); + const indexOfLastTable = currentPage * tablesPerPage; + const indexOfFirstTable = indexOfLastTable - tablesPerPage; + const currentDepartments = filteredDepartments.slice( + indexOfFirstTable, + indexOfLastTable + ); + + const handleNextPage = () => { + if (currentPage < totalPages) setCurrentPage((prevPage) => prevPage + 1); + }; + + const handlePrevPage = () => { + if (currentPage > 1) setCurrentPage((prevPage) => prevPage - 1); + }; + + return ( + <> + +
+

+ Department-wise Course Tables +

+ +
+ setSearchQuery(e.target.value)} + placeholder="Search for a department..." + style={{ + width: "100%", + padding: "10px", + borderRadius: "5px", + border: "1px solid #ccc", + fontSize: "16px", + }} + /> +
+ +
+ {currentDepartments.map((department, index) => ( +
+
+ setExpandedDepartment( + expandedDepartment === department.department + ? null + : department.department + ) + } + > +

{department.department}

+
+ + {expandedDepartment === department.department && ( +
+ {department.courses.map((course, courseIndex) => ( +
+

+ {course.courseName} ({course.courseCode}) +

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SemesterCourse CodeCourse NameExam TypeYearOral/PracticalAssessmentReassessmentPaper SettingModerationPwD Paper Setting
{course.semester}{course.courseCode}{course.courseName}{course.examType}{course.year} + {course.oralPracticalTeachers.length > 0 ? ( +
    + {course.oralPracticalTeachers.map( + (teacher, idx) => ( +
  • {teacher}
  • + ) + )} +
+ ) : ( + "N/A" + )} +
+ {course.assessmentTeachers.length > 0 ? ( +
    + {course.assessmentTeachers.map( + (teacher, idx) => ( +
  • {teacher}
  • + ) + )} +
+ ) : ( + "N/A" + )} +
+ {course.reassessmentTeachers.length > 0 ? ( +
    + {course.reassessmentTeachers.map( + (teacher, idx) => ( +
  • {teacher}
  • + ) + )} +
+ ) : ( + "N/A" + )} +
+ {course.paperSettingTeachers.length > 0 ? ( +
    + {course.paperSettingTeachers.map( + (teacher, idx) => ( +
  • {teacher}
  • + ) + )} +
+ ) : ( + "N/A" + )} +
+ {course.moderationTeachers.length > 0 ? ( +
    + {course.moderationTeachers.map( + (teacher, idx) => ( +
  • {teacher}
  • + ) + )} +
+ ) : ( + "N/A" + )} +
+ {course.pwdPaperSettingTeachers.length > 0 ? ( +
    + {course.pwdPaperSettingTeachers.map( + (teacher, idx) => ( +
  • {teacher}
  • + ) + )} +
+ ) : ( + "N/A" + )} +
+
+ ))} +
+ )} +
+ ))} +
+ + {/* Pagination controls */} +
+ + + Page {currentPage} of {totalPages} + + +
+
+ + ); +}; + +export default DepartmentConsolidated; \ No newline at end of file diff --git a/client/src/Pages/Login.jsx b/client/src/Pages/Login.jsx index c9bf093..5a57da2 100644 --- a/client/src/Pages/Login.jsx +++ b/client/src/Pages/Login.jsx @@ -150,14 +150,14 @@ function TogglerContainer(props) {
-

Welcome to MERN Auth App

+

Welcome to Appointment to Examiner

Already Have an Account?

-

Welcome to MERN Auth App

+

Welcome to Appointment to Examiner

Don't have an account? Create one