diff --git a/client/package-lock.json b/client/package-lock.json index 7f3445e..63b5ea0 100644 --- a/client/package-lock.json +++ b/client/package-lock.json @@ -17,6 +17,7 @@ "mongoose": "^8.3.1", "react": "^18.2.0", "react-bootstrap": "^2.10.2", + "react-csv": "^2.2.2", "react-dom": "^18.2.0", "react-icons": "^5.4.0", "react-router-dom": "^6.28.0", @@ -15339,6 +15340,11 @@ } } }, + "node_modules/react-csv": { + "version": "2.2.2", + "resolved": "https://registry.npmjs.org/react-csv/-/react-csv-2.2.2.tgz", + "integrity": "sha512-RG5hOcZKZFigIGE8LxIEV/OgS1vigFQT4EkaHeKgyuCbUAu9Nbd/1RYq++bJcJJ9VOqO/n9TZRADsXNDR4VEpw==" + }, "node_modules/react-dev-utils": { "version": "12.0.1", "resolved": "https://registry.npmjs.org/react-dev-utils/-/react-dev-utils-12.0.1.tgz", diff --git a/client/package.json b/client/package.json index 67219c7..f466e56 100644 --- a/client/package.json +++ b/client/package.json @@ -12,6 +12,7 @@ "mongoose": "^8.3.1", "react": "^18.2.0", "react-bootstrap": "^2.10.2", + "react-csv": "^2.2.2", "react-dom": "^18.2.0", "react-icons": "^5.4.0", "react-router-dom": "^6.28.0", diff --git a/client/src/Pages/ConsolidatedTable.jsx b/client/src/Pages/ConsolidatedTable.jsx index 67ab71c..f18505c 100644 --- a/client/src/Pages/ConsolidatedTable.jsx +++ b/client/src/Pages/ConsolidatedTable.jsx @@ -1,5 +1,87 @@ +// import React, { useState, useEffect } from "react"; +// import axios from "axios"; + +// const ConsolidatedTable = () => { +// const [data, setData] = useState([]); +// const [loading, setLoading] = useState(true); + +// useEffect(() => { +// const fetchData = async () => { +// try { +// const response = await axios.get("http://localhost:8080/api/table/consolidated-table"); +// setData(response.data); +// setLoading(false); +// } catch (error) { +// console.error("Error fetching table data:", error); +// setLoading(false); +// } +// }; + +// fetchData(); +// }, []); + +// if (loading) { +// return
Loading...
; +// } + +// return ( +//
+//

Consolidated Table

+// +// +// +// +// +// +// +// +// +// +// +// +// +// +// +// +// +// +// +// +// +// +// {data.map((row, index) => ( +// +// +// +// +// +// +// +// +// +// +// +// +// +// +// +// +// +// +// ))} +// +//
SemesterCourse CodeCourse NameExam TypeYearMarksNameAffiliation/CollegeHighest QualificationCareer ExperienceOral/PracticalAssessmentReassessmentPaper SettingModerationPwD Paper Setting
{row.semester}{row.courseCode}{row.courseName}{row.examType}{row.year}{row.marks}{row.Name}{row.affiliation}{row.qualification}{row.experience}{row.oralPractical}{row.assessment}{row.reassessment}{row.paperSetting}{row.moderation}{row.pwdPaperSetting}
+//
+// ); +// }; + +// export default ConsolidatedTable; + + + import React, { useState, useEffect } from "react"; import axios from "axios"; +import { CSVLink } from "react-csv"; const ConsolidatedTable = () => { const [data, setData] = useState([]); @@ -24,53 +106,81 @@ const ConsolidatedTable = () => { return
Loading...
; } + // Extract unique faculty names + const uniqueTeachers = [...new Set(data.map((row) => row.Name))]; + return (
-

Consolidated Table

- - - - - - - - - - - - - - - - - - - - - - - {data.map((row, index) => ( - - - - - - - - - - - - - - - - - - - ))} - -
SemesterCourse CodeCourse NameExam TypeYearMarksNameAffiliation/CollegeHighest QualificationCareer ExperienceOral/PracticalAssessmentReassessmentPaper SettingModerationPwD Paper Setting
{row.semester}{row.courseCode}{row.courseName}{row.examType}{row.year}{row.marks}{row.Name}{row.affiliation}{row.qualification}{row.experience}{row.oralPractical}{row.assessment}{row.reassessment}{row.paperSetting}{row.moderation}{row.pwdPaperSetting}
+

Faculty Tables with Download Option

+ {uniqueTeachers.map((teacher, index) => { + // Filter rows for the current teacher + const teacherData = data.filter((row) => row.Name === teacher); + + return ( +
+

{teacher}'s Table

+ + + + + + + + + + + + + + + + + + + + + + + {teacherData.map((row, idx) => ( + + + + + + + + + + + + + + + + + + + ))} + +
SemesterCourse CodeCourse NameExam TypeYearMarksNameAffiliation/CollegeHighest QualificationCareer ExperienceOral/PracticalAssessmentReassessmentPaper SettingModerationPwD Paper Setting
{row.semester}{row.courseCode}{row.courseName}{row.examType}{row.year}{row.marks}{row.Name}{row.affiliation}{row.qualification}{row.experience}{row.oralPractical}{row.assessment}{row.reassessment}{row.paperSetting}{row.moderation}{row.pwdPaperSetting}
+ {/* CSV Download Button */} + + Download CSV + +
+ ); + })}
); };