Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Completed student #48

Merged
merged 2 commits into from
Oct 7, 2024
Merged

Completed student #48

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
6497165
completed student
TanishqMehrunkarIIPSDAVV Oct 7, 2024
0c8f4e0
updated
TanishqMehrunkarIIPSDAVV Oct 7, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 2 additions & 0 deletions src/App.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,7 @@ import EditQuestion from './edit_question/EditQuestion';
import Profile from './Profile/profile';
import Body from './Body/Body';
import CompletedPaperDashboard from './CompletedPaperDashboard/CompletedPaperDashboard';
import CompletedPaperStudentDashboard from './CompletedPaperStudentDashboard/CompletedPaperStudentDashboard';



Expand Down Expand Up @@ -82,6 +83,7 @@ const App = () => {
<Route path='/profile' element={<Profile/>}/>
<Route path="/preview/:questionId" element={<Body/>}/>
<Route path="/completed_papers" element={<CompletedPaperDashboard />}/>
<Route path='/completed_papers_student/:paperId' element={<CompletedPaperStudentDashboard />}/>
</>
)}

Expand Down
22 changes: 17 additions & 5 deletions src/CompletedPaperDashboard/CompletedPaperDashboard.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,13 +6,20 @@ import axios from "axios";
import Nothing from "../Assets/nothing.svg";
import Navbar from "../Navbar/Navbar";
import Skeleton from "../Skeleton/Skeleton";
import { GoDotFill } from "react-icons/go";
import { useNavigate } from "react-router-dom";
// import AlertModal from "../AlertModal/AlertModal";

const CompletedPaperDashboard = () => {
// const navigate = useNavigate();
const navigate = useNavigate();
const [completedPapers, setCompletedPapers] = useState([]);
// const [hoveredItem, setHoveredItem] = useState(null);
const [loading, setLoading] = useState(true);
const evaluations=[
"Evaluated",
"Not-Evaluated",
"Evaluation-in-Progress",
];

const teacherId = localStorage.getItem("teacherId");
// const [reload, setReload] = useState(false);
Expand Down Expand Up @@ -59,9 +66,10 @@ const getFormattedDateTime = (date, time) => {
fetchCompletedPapers();
}, [teacherId]);

// const handleCardClick = (paperId) => {
// navigate(`/completed_questions/${paperId}`);
// };
const handleCardClick = (paperId) => {
// navigate(`/completed_questions/${paperId}`);
navigate(`/completed_papers_student/${paperId}`);
};

return (
<>
Expand All @@ -84,7 +92,7 @@ const getFormattedDateTime = (date, time) => {
<div
className="papers_table"
key={index}
// onClick={() => handleCardClick(paper._id)}
onClick={() => handleCardClick(paper._id)}
// onMouseEnter={() => setHoveredItem(paper._id)}
// onMouseLeave={() => setHoveredItem(null)}
>
Expand All @@ -93,6 +101,10 @@ const getFormattedDateTime = (date, time) => {
Completed on: {getFormattedDateTime(paper.endTime, paper.time)}
</div>
<div className="table-data">
<div className={`evaluation ${evaluations[0]+"-completed"}`}>
<GoDotFill />
<div>{evaluations[0]}</div>
</div>
<div className="classhead">
{paper.className} {paper.semester}
</div>
Expand Down
121 changes: 121 additions & 0 deletions src/CompletedPaperStudentDashboard/CompletedPaperStudentDashboard.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,121 @@
import React, { useState, useEffect } from "react";
import "../papers/papers.css";
import Nothing from "../Assets/nothing.svg";
import Navbar from "../Navbar/Navbar";
import Skeleton from "../Skeleton/Skeleton";
import axios from "axios";
import { useParams } from "react-router-dom";
import { GoDotFill } from "react-icons/go";
import { FaCheck } from "react-icons/fa";
import { ImCross } from "react-icons/im";
import image from "../Assets/profile_photo.png";

const CompletedPaperStudentDashboard = () => {
const [students, setStudents] = useState([]);
const [loading, setLoading] = useState(true);
const { paperId } = useParams();
const evaluations = ["Evaluated", "Not-Evaluated", "Evaluation-in-Progress"];
const [studentIds, setStudentIds] = useState([]);

useEffect(() => {
axios
.post("http://localhost:5000/student/getStudentByPaperId", {
paperId,
})
.then((res) => {
setStudents(res.data.students);
})
.catch((err) => {
console.log(err);
})
.finally(() => {
setTimeout(() => {
setLoading(false);
}, 1000);
});

axios
.post("http://localhost:5000/paper/getCompletedPaperByPaperId",{
paperId,
})
.then((res) => {
setStudentIds(res.data.students);
})
.catch((err) => {
console.error(err);
});
}, [paperId]);

const getAttemptionStatus = (studentId) => {
return studentIds.indexOf(studentId) === -1 ? "Not-Attempted" : "Attempted";
};

return (
<>
<Navbar />
<div className="exam-list-container">
{loading ? (
<Skeleton exams={students} />
) : students.length > 0 ? (
<>
<div className="header">
<h2>Students:</h2>
</div>
<div className="exam-table">
{students.map((student, index) => {
const attemption = getAttemptionStatus(student._id);
return (
<div className="papers_table" key={index}>
<div className="table-data completed-student">
<div className="evaluation-attemption">
<div className={`evaluation ${evaluations[index%3]}`}>
<GoDotFill />
<div>{evaluations[index%3]}&nbsp; {evaluations[index%3] === "Evaluated" && <>Alloted Marks: 20</>}</div>
</div>
<div className={`attemption ${attemption}`}>
{attemption === "Attempted" ? (
<>
<FaCheck />
<div>Attempted</div>
</>
) : (
<>
<ImCross />
<div>Not Attempted</div>
</>
)}
</div>
</div>
<div className="student-image-name">
<div className="student-image">
<img src={image} alt="Image" />
</div>
<div className="student-name">
<div className="classhead">{student.fullName}</div>
<div className="subname">
Email: &nbsp;{student.email}
</div>
<div className="subname">{student.rollNumber}</div>
<div className="subname">{student.phoneNumber}</div>
</div>
</div>
</div>
</div>
);
})}
</div>
</>
) : (
<div className="no-questions-container">
<center>
<img alt="Nothing" src={Nothing} className="nothing" />
<h2>No Students Found</h2>
</center>
</div>
)}
</div>
</>
);
};

export default CompletedPaperStudentDashboard;
117 changes: 117 additions & 0 deletions src/papers/papers.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -181,4 +181,121 @@

.readyDasboardwarning{
color: red;
}

/*----------------Completed Papers------------ */

.evaluation
{
font-size: 18px;
display: flex;
gap: 5px;
align-items: center;
background-color: #282828;
border-radius: 3px;
}
.Evaluated,.Evaluated-completed
{
color: green;
width: 255px;
}
.Evaluated-completed
{
width: 110px;
}
.Not-Evaluated,.Not-Evaluated-completed
{
color: red;
width: 145px;
}
.Evaluation-in-Progress,.Evaluation-in-Progress-completed
{
color: yellow;
width: 210px;
}
.evaluation-attemption
{
display: flex;
align-items: center;
}
.attemption
{
display: flex;
gap: 5px;
align-items: center;
background-color: #282828;
border-radius: 3px;
height: 30px;
justify-content: center;
position: absolute;
top: 18px;
right: 20px;
}
.Attempted
{
width: 110px;
color: green;
}
.Not-Attempted
{
width: 140px;
color: red;
}
.student-image-name
{
display: flex;
gap: 50px;
align-items: center;
margin-top: 20px;
}
.student-image {
width: 100px;
height: 100px;
}

.student-image img {
width: 100%;
height: 100%;
object-fit: cover;
}
.student-image img
{
width: 100%;
height: 100%;
}
.student-name
{
margin-top: -25px;
}
@media screen and (max-width: 768px) {
.student-image {
width: 80px;
height: 80px;
}
.student-image-name
{
margin-top: 5px;
gap: 10px;
}
.student-name
{
margin-top: 0px;
}
.Evaluated
{
width: 100px;
}
}

/* Media Query for extra small screens */
@media screen and (max-width: 480px) {
.student-image {
width: 60px;
height: 60px;
}
}

.completed-student
{
position: relative;
}
Loading