From 0c9fca814ae7f4218b0603c02959cdb4558c1135 Mon Sep 17 00:00:00 2001 From: Gus Vanpoucke Date: Tue, 5 Mar 2024 10:46:31 +0100 Subject: [PATCH 01/12] begin subjects page student --- frontend/frontend/src/i18n/config.ts | 2 ++ frontend/frontend/src/main.tsx | 2 +- .../SubjectsPage/ArchivedProjectsView.tsx | 7 +++++++ .../src/pages/SubjectsPage/ProjectsView.tsx | 7 +++++++ .../SubjectsPage/SubjectsStudentPage.tsx | 19 +++++++++++++++++++ 5 files changed, 36 insertions(+), 1 deletion(-) create mode 100644 frontend/frontend/src/pages/SubjectsPage/ArchivedProjectsView.tsx create mode 100644 frontend/frontend/src/pages/SubjectsPage/ProjectsView.tsx create mode 100644 frontend/frontend/src/pages/SubjectsPage/SubjectsStudentPage.tsx diff --git a/frontend/frontend/src/i18n/config.ts b/frontend/frontend/src/i18n/config.ts index 9ab92b38..a4e94fbf 100644 --- a/frontend/frontend/src/i18n/config.ts +++ b/frontend/frontend/src/i18n/config.ts @@ -11,6 +11,7 @@ const english = { archived: "Archived", students: "Students: ", no_deadline: "No deadline", + current_projects: "Current projects", }; const dutch = { logo: "./src/assets/logo_UGent_NL_RGB_2400_wit.png", @@ -21,6 +22,7 @@ const dutch = { archived: "Gearchiveerd", students: "Studenten: ", no_deadline: "Geen deadline", + current_projects: "Huidige projecten", }; i18n.use(initReactI18next).use(LanguageDetector).init({ fallbackLng: "en", diff --git a/frontend/frontend/src/main.tsx b/frontend/frontend/src/main.tsx index 4afb80d1..853e72a9 100644 --- a/frontend/frontend/src/main.tsx +++ b/frontend/frontend/src/main.tsx @@ -8,7 +8,7 @@ import ErrorPage from "./pages/ErrorPage.tsx"; import {MainPage} from "./pages/mainPage/MainPage.tsx"; import {Helmet, HelmetProvider} from "react-helmet-async"; -import { SubjectsStudentPage } from "./pages/subjects_page/SubjectsStudentPage.tsx"; +import { SubjectsStudentPage } from "./pages/subjectsPage/SubjectsStudentPage.tsx"; const router = createBrowserRouter([ diff --git a/frontend/frontend/src/pages/SubjectsPage/ArchivedProjectsView.tsx b/frontend/frontend/src/pages/SubjectsPage/ArchivedProjectsView.tsx new file mode 100644 index 00000000..0f4cded8 --- /dev/null +++ b/frontend/frontend/src/pages/SubjectsPage/ArchivedProjectsView.tsx @@ -0,0 +1,7 @@ +export function ArchivedProjectsView() { + return ( + <> + + + ); +} \ No newline at end of file diff --git a/frontend/frontend/src/pages/SubjectsPage/ProjectsView.tsx b/frontend/frontend/src/pages/SubjectsPage/ProjectsView.tsx new file mode 100644 index 00000000..7ec914a5 --- /dev/null +++ b/frontend/frontend/src/pages/SubjectsPage/ProjectsView.tsx @@ -0,0 +1,7 @@ +export function ProjectsView() { + return ( + <> + + + ); +} \ No newline at end of file diff --git a/frontend/frontend/src/pages/SubjectsPage/SubjectsStudentPage.tsx b/frontend/frontend/src/pages/SubjectsPage/SubjectsStudentPage.tsx new file mode 100644 index 00000000..9f9fe193 --- /dev/null +++ b/frontend/frontend/src/pages/SubjectsPage/SubjectsStudentPage.tsx @@ -0,0 +1,19 @@ +import { Header } from "../../components/Header"; +import { Box, Stack } from "@mui/material"; +import TabSwitcher from "../../components/TabSwitcher.tsx"; +import {ArchivedProjectsView} from "./ArchivedProjectsView.tsx"; +import {ProjectsView} from "./ProjectsView.tsx"; + +export function SubjectsStudentPage() { + return ( + <> + +
+ + ,]}/> + + + + ); +} \ No newline at end of file From 944d068af3a34272845272b2ca02453853e65aeb Mon Sep 17 00:00:00 2001 From: Gus Vanpoucke Date: Tue, 5 Mar 2024 14:55:23 +0100 Subject: [PATCH 02/12] continuation subjects student page --- .../AssignmentListItemSubjectsPage.tsx | 54 ++++++++++++ .../src/pages/SubjectsPage/ProjectsView.tsx | 87 ++++++++++++++++++- 2 files changed, 139 insertions(+), 2 deletions(-) create mode 100644 frontend/frontend/src/components/AssignmentListItemSubjectsPage.tsx diff --git a/frontend/frontend/src/components/AssignmentListItemSubjectsPage.tsx b/frontend/frontend/src/components/AssignmentListItemSubjectsPage.tsx new file mode 100644 index 00000000..146000a8 --- /dev/null +++ b/frontend/frontend/src/components/AssignmentListItemSubjectsPage.tsx @@ -0,0 +1,54 @@ +import {ListItem, ListItemButton, ListItemIcon, ListItemText, Divider} from "@mui/material"; +import CheckCircleOutlineIcon from '@mui/icons-material/CheckCircleOutline'; +import HighlightOffIcon from '@mui/icons-material/HighlightOff'; +import {useNavigate} from "react-router-dom"; +import {t} from "i18next"; +interface AssignmentListItemSubjectsPageProps { + key: string; + projectName: string; + dueDate?: Date; + submissions: number; + score: number; + isStudent:boolean; +} + +/* +* This component is used to display a single assignment in the list of assignments +* @param key: string - the key of the assignment +* @param projectName: string - the name of the project +* @param dueDate: Date - the due date of the project +* @param submissions: number - number of submissions for the project +* @param score: number - assigned score on the project +* @param isStudent: boolean - if the user is a student or a teacher +*/ + +export function AssignmentListItemSubjectsPage({key,projectName, dueDate, submissions, score, isStudent}:AssignmentListItemSubjectsPageProps) { + const navigate = useNavigate(); + const handleProjectClick = () => { + console.log("Project clicked"); + navigate(`/${key}`) + } + + return ( + <> + + + + + + + + + + + ); +} \ No newline at end of file diff --git a/frontend/frontend/src/pages/SubjectsPage/ProjectsView.tsx b/frontend/frontend/src/pages/SubjectsPage/ProjectsView.tsx index 7ec914a5..0576fa9b 100644 --- a/frontend/frontend/src/pages/SubjectsPage/ProjectsView.tsx +++ b/frontend/frontend/src/pages/SubjectsPage/ProjectsView.tsx @@ -1,7 +1,90 @@ -export function ProjectsView() { +import {Box, Typography} from "@mui/material"; +import List from '@mui/material/List'; +import {AssignmentListItemSubjectsPage} from "../../components/AssignmentListItemSubjectsPage.tsx"; + +interface ProjectViewProps { + courseId: string; +} + +interface Course { + id: string; + name: string; + teacher: string; + students: string[]; + //list of assignment ids + assignments: string[]; + archived: boolean; +} + +interface Assignment { + id: string; + name: string; + deadline?: Date; + submissions: number; + score: number; +} + +export function ProjectsView({courseId}: ProjectViewProps) { + const course = getCourse(courseId) + const assignments = course.assignments.map((assignmentId) => getAssignment(assignmentId)) + return ( <> - + + Project + Deadline + Submissions + Score + + + + + + {assignments.map((assignment) => ( + + ))} + + + + ); +} + +//TODO: use api to get data, for now use mock data +function getCourse(courseId: string): Course { + return { + id: courseId, + name: "courseName", + teacher: "teacher", + students: ["student1", "student2"], + archived: false, + assignments: ["assignment1", "assignment2", "assignment3", "assignment4", "assignment5", "assignment6", "assignment7", "assignment8", "assignment9"] + } +} + +function getAssignment(assignmentId: string): Assignment { + return { + id: assignmentId, + name: "assignmentName", + deadline: new Date(2022, 11, 17), + submissions: 2, + score: 10 + } } \ No newline at end of file From 7c5e2cc604bff3989331191439cb09f8a8b08c05 Mon Sep 17 00:00:00 2001 From: Gus Vanpoucke Date: Tue, 5 Mar 2024 15:38:39 +0100 Subject: [PATCH 03/12] v1 subjects student page and start of subjects teacher page --- .../AssignmentListItemSubjectsPage.tsx | 20 +++++++--- frontend/frontend/src/main.tsx | 5 +++ .../src/pages/SubjectsPage/ProjectsView.tsx | 25 +++++++++---- .../SubjectsPage/SubjectsStudentPage.tsx | 8 +++- .../SubjectsPage/SubjectsTeacherPage.tsx | 23 ++++++++++++ .../subjects_page/SubjectsStudentPage.tsx | 37 ------------------- 6 files changed, 67 insertions(+), 51 deletions(-) create mode 100644 frontend/frontend/src/pages/SubjectsPage/SubjectsTeacherPage.tsx delete mode 100644 frontend/frontend/src/pages/subjects_page/SubjectsStudentPage.tsx diff --git a/frontend/frontend/src/components/AssignmentListItemSubjectsPage.tsx b/frontend/frontend/src/components/AssignmentListItemSubjectsPage.tsx index 146000a8..0e594119 100644 --- a/frontend/frontend/src/components/AssignmentListItemSubjectsPage.tsx +++ b/frontend/frontend/src/components/AssignmentListItemSubjectsPage.tsx @@ -9,7 +9,7 @@ interface AssignmentListItemSubjectsPageProps { dueDate?: Date; submissions: number; score: number; - isStudent:boolean; + isStudent: boolean; } /* @@ -42,10 +42,20 @@ export function AssignmentListItemSubjectsPage({key,projectName, dueDate, submis paddingY: 3, borderRadius:2, }}> - - - - + {isStudent? + <> + + + + + + : + <> + + + + + } diff --git a/frontend/frontend/src/main.tsx b/frontend/frontend/src/main.tsx index 853e72a9..bc9ee3cc 100644 --- a/frontend/frontend/src/main.tsx +++ b/frontend/frontend/src/main.tsx @@ -9,6 +9,7 @@ import ErrorPage from "./pages/ErrorPage.tsx"; import {MainPage} from "./pages/mainPage/MainPage.tsx"; import {Helmet, HelmetProvider} from "react-helmet-async"; import { SubjectsStudentPage } from "./pages/subjectsPage/SubjectsStudentPage.tsx"; +import { SubjectsTeacherPage } from "./pages/subjectsPage/SubjectsTeacherPage.tsx"; const router = createBrowserRouter([ @@ -21,6 +22,10 @@ const router = createBrowserRouter([ path: "/subjects_student", element: , }, + { + path: "/subjects_teacher", + element: , + }, ]); ReactDOM.createRoot(document.getElementById("root")!).render( diff --git a/frontend/frontend/src/pages/SubjectsPage/ProjectsView.tsx b/frontend/frontend/src/pages/SubjectsPage/ProjectsView.tsx index 0576fa9b..b06d9534 100644 --- a/frontend/frontend/src/pages/SubjectsPage/ProjectsView.tsx +++ b/frontend/frontend/src/pages/SubjectsPage/ProjectsView.tsx @@ -2,8 +2,9 @@ import {Box, Typography} from "@mui/material"; import List from '@mui/material/List'; import {AssignmentListItemSubjectsPage} from "../../components/AssignmentListItemSubjectsPage.tsx"; -interface ProjectViewProps { +interface ProjectsViewProps { courseId: string; + isStudent: boolean; } interface Course { @@ -24,7 +25,7 @@ interface Assignment { score: number; } -export function ProjectsView({courseId}: ProjectViewProps) { +export function ProjectsView({courseId, isStudent}: ProjectsViewProps) { const course = getCourse(courseId) const assignments = course.assignments.map((assignmentId) => getAssignment(assignmentId)) @@ -39,10 +40,20 @@ export function ProjectsView({courseId}: ProjectViewProps) { justifyContent: "space-between", padding:3, }}> - Project - Deadline - Submissions - Score + {isStudent? + <> + Project + Deadline + Submissions + Score + + : + <> + Project + Deadline + Edit + + } {assignments.map((assignment) => ( - + ))} diff --git a/frontend/frontend/src/pages/SubjectsPage/SubjectsStudentPage.tsx b/frontend/frontend/src/pages/SubjectsPage/SubjectsStudentPage.tsx index 9f9fe193..023e7f0f 100644 --- a/frontend/frontend/src/pages/SubjectsPage/SubjectsStudentPage.tsx +++ b/frontend/frontend/src/pages/SubjectsPage/SubjectsStudentPage.tsx @@ -4,14 +4,18 @@ import TabSwitcher from "../../components/TabSwitcher.tsx"; import {ArchivedProjectsView} from "./ArchivedProjectsView.tsx"; import {ProjectsView} from "./ProjectsView.tsx"; -export function SubjectsStudentPage() { +interface SubjectsStudentProps { + courseId: string; +} + +export function SubjectsStudentPage({courseId}: SubjectsStudentProps) { return ( <>
,]}/> + nodes={[,]}/> diff --git a/frontend/frontend/src/pages/SubjectsPage/SubjectsTeacherPage.tsx b/frontend/frontend/src/pages/SubjectsPage/SubjectsTeacherPage.tsx new file mode 100644 index 00000000..744b81a6 --- /dev/null +++ b/frontend/frontend/src/pages/SubjectsPage/SubjectsTeacherPage.tsx @@ -0,0 +1,23 @@ +import { Header } from "../../components/Header"; +import { Box, Stack } from "@mui/material"; +import TabSwitcher from "../../components/TabSwitcher.tsx"; +import {ArchivedProjectsView} from "./ArchivedProjectsView.tsx"; +import {ProjectsView} from "./ProjectsView.tsx"; + +interface SubjectsTeacherProps { + courseId: string; +} + +export function SubjectsTeacherPage({courseId}: SubjectsTeacherProps) { + return ( + <> + +
+ + ,]}/> + + + + ); +} \ No newline at end of file diff --git a/frontend/frontend/src/pages/subjects_page/SubjectsStudentPage.tsx b/frontend/frontend/src/pages/subjects_page/SubjectsStudentPage.tsx deleted file mode 100644 index 6397c620..00000000 --- a/frontend/frontend/src/pages/subjects_page/SubjectsStudentPage.tsx +++ /dev/null @@ -1,37 +0,0 @@ -import { Header } from "../../components/Header"; -import { ItemList } from "../../components/ItemList"; -import { Box } from "@mui/material"; - -const items = [ - { opdracht: 'Task 1', deadline: '2024-03-15', status: 'In progress', score: '80%' }, - { opdracht: 'Task 2', deadline: '2024-03-20', status: 'Completed', score: '100%' }, - { opdracht: 'Task 3', deadline: '2024-03-25', status: 'Not started', score: 'N/A' }, - { opdracht: 'Task 1', deadline: '2024-03-15', status: 'In progress', score: '80%' }, - { opdracht: 'Task 2', deadline: '2024-03-20', status: 'Completed', score: '100%' }, - { opdracht: 'Task 3', deadline: '2024-03-25', status: 'Not started', score: 'N/A' }, - { opdracht: 'Task 1', deadline: '2024-03-15', status: 'In progress', score: '80%' }, - { opdracht: 'Task 2', deadline: '2024-03-20', status: 'Completed', score: '100%' }, - { opdracht: 'Task 3', deadline: '2024-03-25', status: 'Not started', score: 'N/A' }, - { opdracht: 'Task 1', deadline: '2024-03-15', status: 'In progress', score: '80%' }, - { opdracht: 'Task 2', deadline: '2024-03-20', status: 'Completed', score: '100%' }, - { opdracht: 'Task 3', deadline: '2024-03-25', status: 'Not started', score: 'N/A' }, - { opdracht: 'Task 1', deadline: '2024-03-15', status: 'In progress', score: '80%' }, - { opdracht: 'Task 2', deadline: '2024-03-20', status: 'Completed', score: '100%' }, - { opdracht: 'Task 3', deadline: '2024-03-25', status: 'Not started', score: 'N/A' }, - { opdracht: 'Task 1', deadline: '2024-03-15', status: 'In progress', score: '80%' }, - { opdracht: 'Task 2', deadline: '2024-03-20', status: 'Completed', score: '100%' }, - { opdracht: 'Task 3', deadline: '2024-03-25', status: 'Not started', score: 'N/A' }, -]; - -export function SubjectsStudentPage() { - return ( - <> -
- - - - - - - ); -} From 3dd692ddf045c811b788ea632ab19636ac0d841f Mon Sep 17 00:00:00 2001 From: Gus Vanpoucke Date: Fri, 8 Mar 2024 16:52:15 +0100 Subject: [PATCH 04/12] v1 subjects pages done --- .../src/components/AssignmentListItemSubjectsPage.tsx | 6 ++---- frontend/frontend/src/main.tsx | 4 ++-- .../src/pages/SubjectsPage/SubjectsStudentPage.tsx | 9 ++++----- .../src/pages/SubjectsPage/SubjectsTeacherPage.tsx | 9 ++++----- 4 files changed, 12 insertions(+), 16 deletions(-) diff --git a/frontend/frontend/src/components/AssignmentListItemSubjectsPage.tsx b/frontend/frontend/src/components/AssignmentListItemSubjectsPage.tsx index 0e594119..6ad833a0 100644 --- a/frontend/frontend/src/components/AssignmentListItemSubjectsPage.tsx +++ b/frontend/frontend/src/components/AssignmentListItemSubjectsPage.tsx @@ -1,6 +1,4 @@ -import {ListItem, ListItemButton, ListItemIcon, ListItemText, Divider} from "@mui/material"; -import CheckCircleOutlineIcon from '@mui/icons-material/CheckCircleOutline'; -import HighlightOffIcon from '@mui/icons-material/HighlightOff'; +import {ListItem, ListItemButton, ListItemText, Divider} from "@mui/material"; import {useNavigate} from "react-router-dom"; import {t} from "i18next"; interface AssignmentListItemSubjectsPageProps { @@ -53,7 +51,7 @@ export function AssignmentListItemSubjectsPage({key,projectName, dueDate, submis <> - + } diff --git a/frontend/frontend/src/main.tsx b/frontend/frontend/src/main.tsx index bc9ee3cc..5ea67cdf 100644 --- a/frontend/frontend/src/main.tsx +++ b/frontend/frontend/src/main.tsx @@ -19,11 +19,11 @@ const router = createBrowserRouter([ errorElement: , }, { - path: "/subjects_student", + path: "/subjects_student/:courseId", element: , }, { - path: "/subjects_teacher", + path: "/subjects_teacher/:courseId", element: , }, ]); diff --git a/frontend/frontend/src/pages/SubjectsPage/SubjectsStudentPage.tsx b/frontend/frontend/src/pages/SubjectsPage/SubjectsStudentPage.tsx index 023e7f0f..512c33a7 100644 --- a/frontend/frontend/src/pages/SubjectsPage/SubjectsStudentPage.tsx +++ b/frontend/frontend/src/pages/SubjectsPage/SubjectsStudentPage.tsx @@ -3,12 +3,11 @@ import { Box, Stack } from "@mui/material"; import TabSwitcher from "../../components/TabSwitcher.tsx"; import {ArchivedProjectsView} from "./ArchivedProjectsView.tsx"; import {ProjectsView} from "./ProjectsView.tsx"; +import { useParams } from "react-router-dom"; -interface SubjectsStudentProps { - courseId: string; -} - -export function SubjectsStudentPage({courseId}: SubjectsStudentProps) { +export function SubjectsStudentPage() { + let { courseId } = useParams(); + courseId = String(courseId); return ( <> diff --git a/frontend/frontend/src/pages/SubjectsPage/SubjectsTeacherPage.tsx b/frontend/frontend/src/pages/SubjectsPage/SubjectsTeacherPage.tsx index 744b81a6..1858afe4 100644 --- a/frontend/frontend/src/pages/SubjectsPage/SubjectsTeacherPage.tsx +++ b/frontend/frontend/src/pages/SubjectsPage/SubjectsTeacherPage.tsx @@ -3,12 +3,11 @@ import { Box, Stack } from "@mui/material"; import TabSwitcher from "../../components/TabSwitcher.tsx"; import {ArchivedProjectsView} from "./ArchivedProjectsView.tsx"; import {ProjectsView} from "./ProjectsView.tsx"; +import { useParams } from "react-router-dom"; -interface SubjectsTeacherProps { - courseId: string; -} - -export function SubjectsTeacherPage({courseId}: SubjectsTeacherProps) { +export function SubjectsTeacherPage() { + let { courseId } = useParams(); + courseId = String(courseId); return ( <> From 0b78b066b120625920cd14feb743aaca6450a2be Mon Sep 17 00:00:00 2001 From: Gus Vanpoucke Date: Fri, 8 Mar 2024 18:32:53 +0100 Subject: [PATCH 05/12] quick fix --- frontend/frontend/src/pages/SubjectsPage/ProjectsView.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/frontend/frontend/src/pages/SubjectsPage/ProjectsView.tsx b/frontend/frontend/src/pages/SubjectsPage/ProjectsView.tsx index b06d9534..70266f32 100644 --- a/frontend/frontend/src/pages/SubjectsPage/ProjectsView.tsx +++ b/frontend/frontend/src/pages/SubjectsPage/ProjectsView.tsx @@ -26,8 +26,8 @@ interface Assignment { } export function ProjectsView({courseId, isStudent}: ProjectsViewProps) { - const course = getCourse(courseId) - const assignments = course.assignments.map((assignmentId) => getAssignment(assignmentId)) + const course = getCourse(courseId); + const assignments = course.assignments.map((assignmentId) => getAssignment(assignmentId)); return ( <> From 74eeeefaedd946f45237ab7af15155dd8ebebada Mon Sep 17 00:00:00 2001 From: Gus Vanpoucke Date: Fri, 8 Mar 2024 18:34:04 +0100 Subject: [PATCH 06/12] start scores page --- .../src/components/StudentScoreListItem.tsx | 49 ++++++++ frontend/frontend/src/main.tsx | 5 + .../pages/scoresPage/ProjectScoresPage.tsx | 19 +++ .../src/pages/scoresPage/StudentsView.tsx | 109 ++++++++++++++++++ 4 files changed, 182 insertions(+) create mode 100644 frontend/frontend/src/components/StudentScoreListItem.tsx create mode 100644 frontend/frontend/src/pages/scoresPage/ProjectScoresPage.tsx create mode 100644 frontend/frontend/src/pages/scoresPage/StudentsView.tsx diff --git a/frontend/frontend/src/components/StudentScoreListItem.tsx b/frontend/frontend/src/components/StudentScoreListItem.tsx new file mode 100644 index 00000000..e39d46ef --- /dev/null +++ b/frontend/frontend/src/components/StudentScoreListItem.tsx @@ -0,0 +1,49 @@ +import {ListItem, ListItemButton, ListItemText, Divider} from "@mui/material"; +import {useNavigate} from "react-router-dom"; +import {t} from "i18next"; + +interface StudentScoreListItemProps { + key: string; + studentName: string; + submissionFiles: string[]; +} + +/* +* This component is used to display a single assignment in the list of assignments +* @param key: string - the key of the studentOnProject +* @param studentName: string - the name of the student +* @param submissionFiles: string[] - a list of all files submitted by this student +*/ + +export function StudentScoreListItem({key, studentName, submissionFiles}:StudentScoreListItemProps) { + const navigate = useNavigate(); + const handleProjectClick = () => { + console.log("Project clicked"); + navigate(`/${key}`) + } + + return ( + <> + + + <> + + + + + + + + + + ); +} \ No newline at end of file diff --git a/frontend/frontend/src/main.tsx b/frontend/frontend/src/main.tsx index 5ea67cdf..3c622b03 100644 --- a/frontend/frontend/src/main.tsx +++ b/frontend/frontend/src/main.tsx @@ -10,6 +10,7 @@ import {MainPage} from "./pages/mainPage/MainPage.tsx"; import {Helmet, HelmetProvider} from "react-helmet-async"; import { SubjectsStudentPage } from "./pages/subjectsPage/SubjectsStudentPage.tsx"; import { SubjectsTeacherPage } from "./pages/subjectsPage/SubjectsTeacherPage.tsx"; +import { ProjectScoresPage } from "./pages/scoresPage/ProjectScoresPage.tsx"; const router = createBrowserRouter([ @@ -26,6 +27,10 @@ const router = createBrowserRouter([ path: "/subjects_teacher/:courseId", element: , }, + { + path: "/scores", + element: , + }, ]); ReactDOM.createRoot(document.getElementById("root")!).render( diff --git a/frontend/frontend/src/pages/scoresPage/ProjectScoresPage.tsx b/frontend/frontend/src/pages/scoresPage/ProjectScoresPage.tsx new file mode 100644 index 00000000..1b3eacb5 --- /dev/null +++ b/frontend/frontend/src/pages/scoresPage/ProjectScoresPage.tsx @@ -0,0 +1,19 @@ +import { Header } from "../../components/Header"; +import { Box, Stack } from "@mui/material"; +import { useParams } from "react-router-dom"; +import { StudentsView } from "./StudentsView.tsx"; + +export function ProjectScoresPage() { + let { projectId } = useParams(); + projectId = String(projectId); + return ( + <> + +
+ + + + + + ); +} \ No newline at end of file diff --git a/frontend/frontend/src/pages/scoresPage/StudentsView.tsx b/frontend/frontend/src/pages/scoresPage/StudentsView.tsx new file mode 100644 index 00000000..d1c08aa4 --- /dev/null +++ b/frontend/frontend/src/pages/scoresPage/StudentsView.tsx @@ -0,0 +1,109 @@ +import {Box, Typography, Divider} from "@mui/material"; +import List from '@mui/material/List'; +import { StudentScoreListItem } from "../../components/StudentScoreListItem.tsx"; + +interface StudentsViewProps { + projectId: string; +} + +interface Assignment { + id: string; + name: string; + teacher: string; + //list of student ids + students: string[]; +} + +interface Student { + id: string; + name: string; +} + +interface StudentProject { + id: string; + studentId: string; + submissions: string[]; +} + +interface Submission { + id: string; + file: string; +} + +export function StudentsView({projectId}: StudentsViewProps) { + const project = getProject(projectId); + const students = project.students.map((studentProjectId) => getStudentOnProject(studentProjectId)); + + return ( + <> + + <> + Student + Time + Score + Download + + + + + + + + {students.map((studentOnProject) => ( + getSubmission(submissionId).file)}/> + ))} + + + + + + ); +} + +//TODO: use api to get data, for now use mock data +function getProject(projectId: string): Assignment { + return { + id: projectId, + name: "courseName", + teacher: "teacher", + students: ["student1", "student2", "student3"], + } +} + +function getStudentOnProject(studentProjectId: string): StudentProject { + return { + id: studentProjectId, + studentId: "student", + submissions: ["submission1", "submission2"], + } +} + +function getStudent(studentId: string): Student { + return { + id: studentId, + name: "studentName", + } +} + +function getSubmission(submissionId: string): Submission { + return { + id: submissionId, + file: "file", + } +} \ No newline at end of file From 882133c625b72995b822180b7e586eb693803150 Mon Sep 17 00:00:00 2001 From: Ben De Meurichy Date: Sat, 9 Mar 2024 22:00:37 +0100 Subject: [PATCH 07/12] begin indienings pagina --- frontend/frontend/src/i18n/config.ts | 14 ++++--- .../pages/submissionPage/SubmissionPage.tsx | 38 +++++++++++++++++++ 2 files changed, 47 insertions(+), 5 deletions(-) create mode 100644 frontend/frontend/src/pages/submissionPage/SubmissionPage.tsx diff --git a/frontend/frontend/src/i18n/config.ts b/frontend/frontend/src/i18n/config.ts index 9ab92b38..b2a0a887 100644 --- a/frontend/frontend/src/i18n/config.ts +++ b/frontend/frontend/src/i18n/config.ts @@ -6,25 +6,29 @@ const english = { logo: "./src/assets/logo_UGent_EN_RGB_2400_white.png", logo_blue: "./src/assets/logo_UGent_EN_RGB_2400_color.png", login: "Log in with your UGent account", - back : "Back", + back: "Back", current_courses: "Current courses", archived: "Archived", students: "Students: ", no_deadline: "No deadline", + submission: "Submission", }; const dutch = { logo: "./src/assets/logo_UGent_NL_RGB_2400_wit.png", logo_blue: "./src/assets/logo_UGent_NL_RGB_2400_kleur.png", login: "Log in met je UGent account", - back : "Terug", + back: "Terug", current_courses: "Huidige vakken", archived: "Gearchiveerd", students: "Studenten: ", no_deadline: "Geen deadline", + submission: "Indiening", }; -i18n.use(initReactI18next).use(LanguageDetector).init({ fallbackLng: "en", - debug:true, interpolation: {escapeValue: false}, - resources: {en: {translation: english}, nl: {translation: dutch}}}); +i18n.use(initReactI18next).use(LanguageDetector).init({ + fallbackLng: "en", + debug: true, interpolation: {escapeValue: false}, + resources: {en: {translation: english}, nl: {translation: dutch}} +}); export default i18n; \ No newline at end of file diff --git a/frontend/frontend/src/pages/submissionPage/SubmissionPage.tsx b/frontend/frontend/src/pages/submissionPage/SubmissionPage.tsx new file mode 100644 index 00000000..32e8417f --- /dev/null +++ b/frontend/frontend/src/pages/submissionPage/SubmissionPage.tsx @@ -0,0 +1,38 @@ +import Grid2 from "@mui/material/Unstable_Grid2"; +import {Header} from "../../components/Header.tsx"; +import {useParams} from "react-router-dom"; +import {t} from "i18next"; +import {useEffect, useState} from "react"; +import {Paper} from "@mui/material"; +import {Dayjs} from "dayjs"; + +interface Submission { + //Dayjs is present in pull request for mainpage + deadline: Dayjs; + projectName: string; + assignment: string; + filename: string; + + +} + +export function SubmissionPage() { + const {project} = useParams(); + const [submission, setSubmission] = useState({} as Submission); + + useEffect(() => { + fetch(`/api/submissions/${project}`) + .then(res => res.json()) + .then(data => setSubmission(data)); + }, [project]); + + + return ( + <> + +
+ + + + ); +} \ No newline at end of file From 1fc581c2e8ab4549738346f2a28f5a3f309e44e6 Mon Sep 17 00:00:00 2001 From: Gus Vanpoucke Date: Sun, 10 Mar 2024 18:48:30 +0100 Subject: [PATCH 08/12] scores page v1 --- .../src/components/StudentScoreListItem.tsx | 25 ++++++++++--------- .../pages/scoresPage/ProjectScoresPage.tsx | 15 +++++++++-- .../src/pages/scoresPage/StudentsView.tsx | 4 +-- 3 files changed, 28 insertions(+), 16 deletions(-) diff --git a/frontend/frontend/src/components/StudentScoreListItem.tsx b/frontend/frontend/src/components/StudentScoreListItem.tsx index e39d46ef..74d6bccd 100644 --- a/frontend/frontend/src/components/StudentScoreListItem.tsx +++ b/frontend/frontend/src/components/StudentScoreListItem.tsx @@ -1,5 +1,5 @@ -import {ListItem, ListItemButton, ListItemText, Divider} from "@mui/material"; -import {useNavigate} from "react-router-dom"; +import {ListItem, ListItemText, Divider, TextField, IconButton} from "@mui/material"; +import DownloadIcon from '@mui/icons-material/Download'; import {t} from "i18next"; interface StudentScoreListItemProps { @@ -16,16 +16,10 @@ interface StudentScoreListItemProps { */ export function StudentScoreListItem({key, studentName, submissionFiles}:StudentScoreListItemProps) { - const navigate = useNavigate(); - const handleProjectClick = () => { - console.log("Project clicked"); - navigate(`/${key}`) - } - return ( <> - - - + + + + + + + + + - + diff --git a/frontend/frontend/src/pages/scoresPage/ProjectScoresPage.tsx b/frontend/frontend/src/pages/scoresPage/ProjectScoresPage.tsx index 1b3eacb5..d8ba97fe 100644 --- a/frontend/frontend/src/pages/scoresPage/ProjectScoresPage.tsx +++ b/frontend/frontend/src/pages/scoresPage/ProjectScoresPage.tsx @@ -1,7 +1,9 @@ import { Header } from "../../components/Header"; -import { Box, Stack } from "@mui/material"; +import { Box, Button, Stack } from "@mui/material"; import { useParams } from "react-router-dom"; import { StudentsView } from "./StudentsView.tsx"; +import SaveIcon from '@mui/icons-material/Save'; +import CloseIcon from '@mui/icons-material/Close'; export function ProjectScoresPage() { let { projectId } = useParams(); @@ -10,9 +12,18 @@ export function ProjectScoresPage() { <>
- + + + + + + + - - - - - ); + + + + + + Naam Platform + + + + + + + + + ); } diff --git a/frontend/frontend/src/pages/submissionPage/SubmissionPage.tsx b/frontend/frontend/src/pages/submissionPage/SubmissionPage.tsx index 32e8417f..160b44ed 100644 --- a/frontend/frontend/src/pages/submissionPage/SubmissionPage.tsx +++ b/frontend/frontend/src/pages/submissionPage/SubmissionPage.tsx @@ -3,8 +3,8 @@ import {Header} from "../../components/Header.tsx"; import {useParams} from "react-router-dom"; import {t} from "i18next"; import {useEffect, useState} from "react"; -import {Paper} from "@mui/material"; -import {Dayjs} from "dayjs"; +import {Box, Card, Paper, Typography} from "@mui/material"; +import dayjs, {Dayjs} from "dayjs"; interface Submission { //Dayjs is present in pull request for mainpage @@ -18,20 +18,61 @@ interface Submission { export function SubmissionPage() { const {project} = useParams(); - const [submission, setSubmission] = useState({} as Submission); + const [submission, setSubmission] = useState({ + deadline: dayjs(), + projectName: "", + assignment: "", + filename: "" + } as Submission); + //TODO: fetch submission data from backend useEffect(() => { - fetch(`/api/submissions/${project}`) - .then(res => res.json()) - .then(data => setSubmission(data)); + // fetch(`/api/submissions/${project}`) + // .then(res => res.json()) + // .then(data => setSubmission(data)); + setSubmission({ + deadline: dayjs(), + projectName: "project", + assignment: "assignment", + filename: "filename" + }); }, [project]); return ( <> -
- +
+ + + Deadline: + {submission.deadline.format("DD/MM/YYYY")} + + + + {t("assignment")} + + + + + + + + ); From 2831d96713fcd35b50162ffc6341cee1a8781412 Mon Sep 17 00:00:00 2001 From: Ben De Meurichy Date: Tue, 12 Mar 2024 20:08:39 +0100 Subject: [PATCH 10/12] indiening student is klaar: alles wat relevant kan zijn voor de indieningen van een student is zichtbaar en bevat gemakkelijke uitbreidbaarheid voor echte api, enkel nog downloadfunctionaliteit nodig --- frontend/frontend/src/i18n/config.ts | 4 + .../pages/submissionPage/SubmissionPage.tsx | 130 ++++++++++++++++-- 2 files changed, 122 insertions(+), 12 deletions(-) diff --git a/frontend/frontend/src/i18n/config.ts b/frontend/frontend/src/i18n/config.ts index b6413984..1cc06635 100644 --- a/frontend/frontend/src/i18n/config.ts +++ b/frontend/frontend/src/i18n/config.ts @@ -14,6 +14,8 @@ const english = { submission: "Submission", error: "Something went wrong.", assignment: "Assignment:", + filename: "Submitted file:", + restrictions: "Restrictions:", }; const dutch = { logo: "/assets/logo_UGent_NL_RGB_2400_wit.png", @@ -27,6 +29,8 @@ const dutch = { submission: "Indiening", error: "Er is iets misgegaan.", assignment: "Opgave:", + filename: "Ingediend bestand:", + restrictions: "Restricties:", }; i18n.use(initReactI18next).use(LanguageDetector).init({ diff --git a/frontend/frontend/src/pages/submissionPage/SubmissionPage.tsx b/frontend/frontend/src/pages/submissionPage/SubmissionPage.tsx index 160b44ed..f69c7c01 100644 --- a/frontend/frontend/src/pages/submissionPage/SubmissionPage.tsx +++ b/frontend/frontend/src/pages/submissionPage/SubmissionPage.tsx @@ -3,8 +3,10 @@ import {Header} from "../../components/Header.tsx"; import {useParams} from "react-router-dom"; import {t} from "i18next"; import {useEffect, useState} from "react"; -import {Box, Card, Paper, Typography} from "@mui/material"; +import {Box, Button, Card, Divider, ListItem, Paper, Typography} from "@mui/material"; import dayjs, {Dayjs} from "dayjs"; +import DownloadIcon from '@mui/icons-material/Download'; +import List from "@mui/material/List"; interface Submission { //Dayjs is present in pull request for mainpage @@ -12,19 +14,34 @@ interface Submission { projectName: string; assignment: string; filename: string; - - + restrictions: { name: string, value: string, artifact?: string }[]; } + export function SubmissionPage() { const {project} = useParams(); const [submission, setSubmission] = useState({ deadline: dayjs(), projectName: "", assignment: "", - filename: "" + filename: "", + restrictions: [] } as Submission); + const downloadArtifact = (artifact: string) => { + fetch(`/api/submissions/${project}/${artifact}`) + .then(res => res.blob()) + .then(blob => { + const url = window.URL.createObjectURL(blob); + const a = document.createElement('a'); + a.href = url; + a.download = artifact; + document.body.appendChild(a); + a.click(); + a.remove(); + }); + } + //TODO: fetch submission data from backend useEffect(() => { // fetch(`/api/submissions/${project}`) @@ -33,8 +50,39 @@ export function SubmissionPage() { setSubmission({ deadline: dayjs(), projectName: "project", - assignment: "assignment", - filename: "filename" + assignment: "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Nullam vehicula ipsum a arcu cursus vitae congue mauris rhoncus. Pretium lectus quam id leo in vitae. A scelerisque purus semper eget. Porttitor leo a diam sollicitudin. Ornare massa eget egestas purus viverra accumsan in nisl nisi. Nunc lobortis mattis aliquam faucibus purus in. Orci dapibus ultrices in iaculis nunc sed. Morbi enim nunc faucibus a pellentesque sit amet. Quam quisque id diam vel quam elementum pulvinar. Quis commodo odio aenean sed adipiscing diam donec adipiscing tristique. Egestas maecenas pharetra convallis posuere morbi leo urna. At varius vel pharetra vel turpis nunc eget lorem. Eleifend donec pretium vulputate sapien. Sit amet cursus sit amet. Lectus quam id leo in. Neque vitae tempus quam pellentesque nec nam. Metus aliquam eleifend mi in nulla. Faucibus turpis in eu mi. Sed vulputate odio ut enim blandit volutpat.\n" + + "\n" + + "Quis varius quam quisque id diam vel quam elementum pulvinar. Viverra vitae congue eu consequat. Amet aliquam id diam maecenas ultricies mi eget mauris. Mi proin sed libero enim sed. Etiam tempor orci eu lobortis elementum nibh tellus molestie nunc. Orci a scelerisque purus semper eget. Magna fermentum iaculis eu non diam phasellus vestibulum lorem. Eu nisl nunc mi ipsum. Augue eget arcu dictum varius duis at consectetur lorem. Aenean vel elit scelerisque mauris pellentesque. Elit duis tristique sollicitudin nibh.\n" + + "\n" + + "Amet consectetur adipiscing elit ut aliquam. Amet aliquam id diam maecenas ultricies. Tellus in metus vulputate eu scelerisque felis imperdiet proin fermentum. Cursus euismod quis viverra nibh cras pulvinar mattis nunc sed. Bibendum est ultricies integer quis auctor elit sed vulputate mi. Quam elementum pulvinar etiam non quam lacus. At imperdiet dui accumsan sit amet nulla facilisi morbi. Accumsan sit amet nulla facilisi. Enim praesent elementum facilisis leo vel fringilla. Quisque id diam vel quam elementum. Tristique sollicitudin nibh sit amet commodo nulla facilisi nullam vehicula. Volutpat est velit egestas dui id ornare arcu odio ut. Tellus in metus vulputate eu scelerisque felis imperdiet proin fermentum. Velit ut tortor pretium viverra suspendisse.\n" + + "\n" + + "Purus viverra accumsan in nisl nisi scelerisque eu ultrices vitae. Volutpat commodo sed egestas egestas fringilla phasellus faucibus. Lorem sed risus ultricies tristique nulla aliquet enim. Donec ultrices tincidunt arcu non sodales neque sodales ut. Volutpat est velit egestas dui id. Egestas erat imperdiet sed euismod. Egestas pretium aenean pharetra magna. Nunc consequat interdum varius sit amet. Imperdiet dui accumsan sit amet nulla facilisi morbi tempus iaculis. Viverra mauris in aliquam sem fringilla ut morbi tincidunt. Vitae congue eu consequat ac felis donec et odio pellentesque. Volutpat odio facilisis mauris sit amet massa vitae. Tellus mauris a diam maecenas. Eget gravida cum sociis natoque penatibus et magnis dis parturient. Diam quis enim lobortis scelerisque. Ut venenatis tellus in metus vulputate. Et malesuada fames ac turpis. A cras semper auctor neque vitae tempus quam. Sed viverra tellus in hac. Mattis enim ut tellus elementum sagittis vitae et.\n" + + "\n" + + "Nunc lobortis mattis aliquam faucibus purus in massa tempor nec. Gravida dictum fusce ut placerat orci nulla pellentesque. Vel facilisis volutpat est velit egestas dui id ornare arcu. Et ligula ullamcorper malesuada proin libero nunc consequat. A arcu cursus vitae congue. Feugiat scelerisque varius morbi enim nunc faucibus a. Velit dignissim sodales ut eu sem. Vestibulum mattis ullamcorper velit sed. Volutpat commodo sed egestas egestas fringilla phasellus. Libero justo laoreet sit amet cursus sit amet. In est ante in nibh mauris cursus mattis molestie a. Euismod elementum nisi quis eleifend quam adipiscing vitae proin. Cursus in hac habitasse platea dictumst quisque sagittis purus.Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Parturient montes nascetur ridiculus mus mauris vitae. Ornare aenean euismod elementum nisi quis eleifend quam adipiscing vitae. Enim praesent elementum facilisis leo vel fringilla est. Euismod quis viverra nibh cras. Enim ut tellus elementum sagittis. Nisl nisi scelerisque eu ultrices. A erat nam at lectus urna duis convallis. Viverra nam libero justo laoreet sit amet cursus sit. Id aliquet risus feugiat in ante. Amet commodo nulla facilisi nullam. Accumsan lacus vel facilisis volutpat est velit egestas. Nibh nisl condimentum id venenatis. Sagittis eu volutpat odio facilisis mauris. Et magnis dis parturient montes nascetur ridiculus mus mauris vitae. Aliquam nulla facilisi cras fermentum odio eu feugiat. Quis enim lobortis scelerisque fermentum dui faucibus in. At ultrices mi tempus imperdiet.\n" + + "\n" + + "Felis imperdiet proin fermentum leo vel. Luctus accumsan tortor posuere ac ut. Tellus cras adipiscing enim eu. Habitasse platea dictumst quisque sagittis purus sit amet volutpat consequat. Vulputate odio ut enim blandit volutpat maecenas volutpat blandit. Enim nec dui nunc mattis enim. Felis eget nunc lobortis mattis aliquam faucibus. Eget velit aliquet sagittis id consectetur purus ut faucibus. Eget egestas purus viverra accumsan in. Vel elit scelerisque mauris pellentesque pulvinar pellentesque habitant morbi tristique. Sit amet facilisis magna etiam. Consectetur libero id faucibus nisl tincidunt eget nullam non nisi. Aliquet eget sit amet tellus cras adipiscing. Justo eget magna fermentum iaculis. Volutpat maecenas volutpat blandit aliquam. Scelerisque purus semper eget duis at tellus. Morbi tempus iaculis urna id volutpat. Nec ultrices dui sapien eget mi proin sed. Nibh tellus molestie nunc non blandit massa enim nec dui.\n" + + "\n" + + "Dolor sed viverra ipsum nunc aliquet bibendum. Egestas sed tempus urna et pharetra pharetra massa massa ultricies. Ut sem nulla pharetra diam sit amet nisl suscipit. Magna eget est lorem ipsum dolor sit. Consequat interdum varius sit amet mattis. Senectus et netus et malesuada fames ac turpis. Justo eget magna fermentum iaculis eu non diam. Vel elit scelerisque mauris pellentesque pulvinar pellentesque habitant morbi. Venenatis lectus magna fringilla urna porttitor rhoncus dolor purus. Tempus imperdiet nulla malesuada pellentesque. Ornare quam viverra orci sagittis eu. Pellentesque nec nam aliquam sem. Semper viverra nam libero justo laoreet sit amet. A diam sollicitudin tempor id. Sed velit dignissim sodales ut eu sem integer vitae. Fermentum odio eu feugiat pretium nibh ipsum. Morbi tincidunt augue interdum velit euismod in pellentesque massa. Purus ut faucibus pulvinar elementum integer enim. Parturient montes nascetur ridiculus mus mauris vitae ultricies. Eu ultrices vitae auctor eu augue.\n" + + "\n" + + "Netus et malesuada fames ac turpis egestas sed tempus urna. Eget nunc scelerisque viverra mauris in aliquam. Feugiat nibh sed pulvinar proin gravida hendrerit lectus a. Sollicitudin aliquam ultrices sagittis orci. Eleifend mi in nulla posuere sollicitudin aliquam. Non diam phasellus vestibulum lorem sed. Quis auctor elit sed vulputate mi sit amet. Id nibh tortor id aliquet lectus. Et netus et malesuada fames ac turpis egestas. Viverra orci sagittis eu volutpat odio facilisis mauris. Neque viverra justo nec ultrices dui sapien eget. Ut tristique et egestas quis ipsum suspendisse ultrices gravida dictum. Consectetur a erat nam at lectus urna duis. Condimentum mattis pellentesque id nibh tortor id aliquet. Egestas fringilla phasellus faucibus scelerisque eleifend donec pretium vulputate. Nunc sed id semper risus. Vitae auctor eu augue ut lectus. Sociis natoque penatibus et magnis. Odio pellentesque diam volutpat commodo sed egestas egestas. Sit amet nulla facilisi morbi tempus iaculis urna id volutpat.\n" + + "\n" + + "Nunc lobortis mattis aliquam faucibus purus. Quis vel eros donec ac odio tempor orci. Tempus egestas sed sed risus pretium quam vulputate. In hac habitasse platea dictumst vestibulum rhoncus. Aliquam ultrices sagittis orci a scelerisque purus semper eget duis. Diam phasellus vestibulum lorem sed risus ultricies tristique. Tincidunt eget nullam non nisi est sit. Habitant morbi tristique senectus et netus et malesuada. Lorem dolor sed viverra ipsum nunc aliquet bibendum. Magna ac placerat vestibulum lectus mauris. Aliquet eget sit amet tellus cras adipiscing enim. A erat nam at lectus urna duis. Aenean vel elit scelerisque mauris pellentesque pulvinar pellentesque habitant. A diam maecenas sed enim ut sem viverra aliquet. Nunc mi ipsum faucibus vitae aliquet.\n" + + "\n" + + "Leo urna molestie at elementum eu. Arcu cursus vitae congue mauris rhoncus aenean vel. Amet massa vitae tortor condimentum lacinia. Ut tristique et egestas quis. Neque gravida in fermentum et sollicitudin ac. Molestie ac feugiat sed lectus vestibulum mattis ullamcorper. Non curabitur gravida arcu ac tortor dignissim convallis aenean. Aenean et tortor at risus viverra adipiscing. Amet commodo nulla facilisi nullam. Duis convallis convallis tellus id interdum velit laoreet id donec. Fames ac turpis egestas sed tempus urna et pharetra. Ac tincidunt vitae semper quis lectus nulla. Accumsan tortor posuere ac ut consequat semper viverra. Pretium fusce id velit ut tortor pretium viverra suspendisse potenti. Ultricies mi eget mauris pharetra et ultrices neque ornare aenean. Fames ac turpis egestas sed tempus urna.\n" + + "\n" + + "Elit ut aliquam purus sit amet. Placerat duis ultricies lacus sed turpis tincidunt id aliquet. Et malesuada fames ac turpis egestas integer. Ultrices dui sapien eget mi proin sed libero enim sed. Tristique nulla aliquet enim tortor at auctor urna. Scelerisque fermentum dui faucibus in ornare quam viverra orci sagittis. Ornare quam viverra orci sagittis. Diam in arcu cursus euismod quis. Amet mauris commodo quis imperdiet massa. Malesuada fames ac turpis egestas. At ultrices mi tempus imperdiet nulla malesuada pellentesque elit eget. Viverra orci sagittis eu volutpat odio facilisis mauris sit amet. Molestie at elementum eu facilisis sed odio. Turpis cursus in hac habitasse. Sodales ut etiam sit amet nisl purus in.\n" + + "\n" + + "Commodo odio aenean sed adipiscing diam donec adipiscing tristique risus. Nec sagittis aliquam malesuada bibendum arcu vitae elementum curabitur. Cras tincidunt lobortis feugiat vivamus at augue eget. Interdum posuere lorem ipsum dolor sit amet. Sit amet consectetur adipiscing elit pellentesque habitant morbi. Elementum eu facilisis sed odio morbi quis. Vestibulum mattis ullamcorper velit sed ullamcorper morbi tincidunt ornare. Suscipit tellus mauris a diam maecenas. Aliquam ut porttitor leo a diam sollicitudin tempor id eu. Proin fermentum leo vel orci porta non pulvinar neque laoreet.\n" + + "\n" + + "Risus nec feugiat in fermentum posuere urna nec. Quis lectus nulla at volutpat diam ut venenatis. Sed cras ornare arcu dui. Quis commodo odio aenean sed adipiscing diam donec adipiscing. Fermentum dui faucibus in ornare quam viverra orci sagittis. Pellentesque dignissim enim sit amet venenatis urna cursus eget nunc. Massa eget egestas purus viverra. Imperdiet proin fermentum leo vel. Habitant morbi tristique senectus et netus et malesuada fames ac. Amet cursus sit amet dictum sit amet justo. Viverra justo nec ultrices dui sapien eget mi. A arcu cursus vitae congue mauris rhoncus.\n" + + "\n" + + "Ipsum dolor sit amet consectetur adipiscing. Augue neque gravida in fermentum et sollicitudin ac orci. Urna duis convallis convallis tellus. Nunc sed blandit libero volutpat. Massa tincidunt nunc pulvinar sapien et ligula ullamcorper malesuada proin. Nunc id cursus metus aliquam eleifend mi in. Odio pellentesque diam volutpat commodo sed egestas egestas. Vitae congue mauris rhoncus aenean vel elit scelerisque mauris. Enim nulla aliquet porttitor lacus. Nibh nisl condimentum id venenatis. Neque convallis a cras semper auctor neque vitae tempus. Dictum sit amet justo donec. At varius vel pharetra vel. Nisl pretium fusce id velit ut tortor pretium viverra. Tincidunt lobortis feugiat vivamus at augue eget arcu. Cras semper auctor neque vitae. Maecenas accumsan lacus vel facilisis volutpat est. Vulputate odio ut enim blandit. Sed turpis tincidunt id aliquet risus. Egestas purus viverra accumsan in nisl nisi.", + filename: "filename", + restrictions: [{name: "filetype", value: ".pdf, .zip",}, { + name: "docker tests", + value: "filename", + artifact: "filename" + }] }); }, [project]); @@ -43,7 +91,16 @@ export function SubmissionPage() { <>
- + {submission.deadline.format("DD/MM/YYYY")} + sx={{ + width: "99 %", + backgroundColor: "background.default", + padding: 1, + paddingBottom: 3 + }}> {t("assignment")} - - - - + + {submission.assignment} + + + + + {t("filename")} + + + + + {t("restrictions")} + + + { + submission.restrictions.map((restriction, index) => { + return ( + <> + + {restriction.name} + {restriction.artifact && + } + {restriction.value} + + + + ); + }) + } + From 76ccf9122f7281cfb370f3a820fc49132bbe4c52 Mon Sep 17 00:00:00 2001 From: Ben De Meurichy Date: Tue, 12 Mar 2024 21:03:46 +0100 Subject: [PATCH 11/12] indieningPagina klaar --- .../pages/submissionPage/SubmissionPage.tsx | 21 ++++++++++++++++--- 1 file changed, 18 insertions(+), 3 deletions(-) diff --git a/frontend/frontend/src/pages/submissionPage/SubmissionPage.tsx b/frontend/frontend/src/pages/submissionPage/SubmissionPage.tsx index f69c7c01..5275735a 100644 --- a/frontend/frontend/src/pages/submissionPage/SubmissionPage.tsx +++ b/frontend/frontend/src/pages/submissionPage/SubmissionPage.tsx @@ -42,6 +42,20 @@ export function SubmissionPage() { }); } + const downloadSubmission = () => { + fetch(`/api/submissions/${project}`) + .then(res => res.blob()) + .then(blob => { + const url = window.URL.createObjectURL(blob); + const a = document.createElement('a'); + a.href = url; + a.download = project + "_submission.zip"; + document.body.appendChild(a); + a.click(); + a.remove(); + }); + } + //TODO: fetch submission data from backend useEffect(() => { // fetch(`/api/submissions/${project}`) @@ -144,7 +158,7 @@ export function SubmissionPage() { {t("filename")} - @@ -166,8 +180,9 @@ export function SubmissionPage() { {restriction.name} {restriction.artifact && - } + } {restriction.value} From 81218a6fa46ab8d6bf4c5874b8695495f90bff4e Mon Sep 17 00:00:00 2001 From: Ben De Meurichy Date: Tue, 12 Mar 2024 21:13:38 +0100 Subject: [PATCH 12/12] restricties deel is nu scrollbaar, alle restricties zijn zichtbaar --- .../frontend/src/pages/submissionPage/SubmissionPage.tsx | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/frontend/frontend/src/pages/submissionPage/SubmissionPage.tsx b/frontend/frontend/src/pages/submissionPage/SubmissionPage.tsx index 5275735a..4863a2e0 100644 --- a/frontend/frontend/src/pages/submissionPage/SubmissionPage.tsx +++ b/frontend/frontend/src/pages/submissionPage/SubmissionPage.tsx @@ -96,7 +96,7 @@ export function SubmissionPage() { name: "docker tests", value: "filename", artifact: "filename" - }] + }, {name: "max file size", value: "10MB"}, {name: "min file size", value: "1MB"}] }); }, [project]); @@ -170,8 +170,8 @@ export function SubmissionPage() { height: "20vh", }}> {t("restrictions")} - - + + { submission.restrictions.map((restriction, index) => { return (