UI for consolidated

This commit is contained in:
Harshitha Shetty
2025-01-26 01:12:07 +05:30
parent 3b189d4270
commit 585615cdf0

View File

@@ -9,6 +9,7 @@ const ConsolidatedTable = () => {
const [loading, setLoading] = useState(true);
const [currentPage, setCurrentPage] = useState(1);
const tablesPerPage = 5;
const [expandedTeacher, setExpandedTeacher] = useState(null);
useEffect(() => {
const fetchData = async () => {
@@ -34,7 +35,7 @@ const ConsolidatedTable = () => {
// Extract unique faculty names
const uniqueTeachers = [...new Set(data.map((row) => row.Name))];
//pagination
// Pagination
const indexOfLastTable = currentPage * tablesPerPage;
const indexOfFirstTable = indexOfLastTable - tablesPerPage;
const currentTeachers = uniqueTeachers.slice(indexOfFirstTable, indexOfLastTable);
@@ -150,13 +151,58 @@ const ConsolidatedTable = () => {
const teacherData = data.filter((row) => row.Name === teacher);
return (
<div key={index} style={{ marginBottom: "20px" }}>
<h2 style={{ textAlign: "center" }}>{teacher}'s Table</h2>
<div
style={{
display: "flex",
justifyContent: "space-between",
alignItems: "center",
cursor: "pointer",
backgroundColor: "#ffffff",
color: "white",
padding: "10px",
borderRadius: "5px",
}}
onClick={() => setExpandedTeacher(expandedTeacher === teacher ? null : teacher)}
>
<h2 style={{color:'black', margin: 0 }}>{teacher}'s Table</h2>
<div>
<button
onClick={() => createExcelFile(teacherData, teacher)}
className="btn btn-primary"
style={{
padding: "10px 15px",
backgroundColor: "#007bff",
color: "black",
textDecoration: "none",
borderRadius: "5px",
marginRight: "10px",
}}
>
Download {teacher}'s Table
</button>
<button
onClick={() => handleSendEmail(teacher, teacherData)}
className="btn btn-secondary"
style={{
padding: "10px 15px",
backgroundColor: "#6c757d",
color: "white",
textDecoration: "none",
borderRadius: "5px",
}}
>
Send {teacher}'s CSV via Email
</button>
</div>
</div>
{expandedTeacher === teacher && (
<table
border="1"
style={{
width: "100%",
textAlign: "left",
marginBottom: "10px",
marginTop: "20px",
}}
>
<thead>
@@ -202,41 +248,14 @@ const ConsolidatedTable = () => {
))}
</tbody>
</table>
<button
onClick={() => createExcelFile(teacherData, teacher)}
className="btn btn-primary"
style={{
padding: "10px 15px",
backgroundColor: "#007bff",
color: "white",
textDecoration: "none",
borderRadius: "5px",
}}
>
Download {teacher}'s Table
</button>
{/* Send Email Button */}
<button
onClick={() => handleSendEmail(teacher, teacherData)}
className="btn btn-secondary"
style={{
padding: "10px 15px",
backgroundColor: "#6c757d",
color: "white",
textDecoration: "none",
borderRadius: "5px",
}}
>
Send {teacher}'s CSV via Email
</button>
)}
</div>
);
})}
</div>
{/* pagination controls */}
<div style={{textAlign: "center", marginTop:"20px",}}>
{/* Pagination controls */}
<div style={{ textAlign: "center", marginTop: "20px" }}>
<button
onClick={handlePrevPage}
disabled={currentPage === 1}
@@ -260,8 +279,7 @@ const ConsolidatedTable = () => {
style={{
padding: "10px 15px",
marginLeft: "10px",
backgroundColor:
currentPage === totalPages ? "#ccc" : "#007bff",
backgroundColor: currentPage === totalPages ? "#ccc" : "#007bff",
color: "white",
borderRadius: "5px",
border: "none",