tdpeuter/2025SELab2-project-Dwengo
tdpeuter/2025SELab2-project-Dwengo
1
Fork 0
Code Issues Releases 4 Packages 2 Wiki Activity

style: lint + format

Browse source
This commit is contained in:
laurejablonski 2025-04-17 10:42:27 +02:00
parent 464b888e16
commit 569adf6518
3 changed files with 59 additions and 50 deletions
Download patch file Download diff file Expand all files Collapse all files

40
frontend/src/views/classes/SingleClass.vue
View file

@ -3,7 +3,7 @@
import authState from "@/services/auth/auth-service.ts";
import { onMounted, ref } from "vue";
import { useRoute } from "vue-router";
import { type ClassResponse } from "@/controllers/classes";
import type { ClassResponse } from "@/controllers/classes";
import type { JoinRequestsResponse, StudentsResponse } from "@/controllers/students";
import type { StudentDTO } from "@dwengo-1/common/interfaces/student";
import UsingQueryResult from "@/components/UsingQueryResult.vue";
@ -17,40 +17,41 @@
const classId: string = route.params.id as string;
const username = ref<string | undefined>(undefined);
// queries used to access the backend and catch loading or errors
// Queries used to access the backend and catch loading or errors
// gets the class a teacher wants to manage
// Gets the class a teacher wants to manage
const getClass = useClassQuery(classId);
// get all students part of the class
// Get all students part of the class
const getStudents = useClassStudentsQuery(classId);
// get all join requests for this class
// Get all join requests for this class
const joinRequestsQuery = useTeacherJoinRequestsQuery(username, classId);
// handle accepting or rejecting join requests
// Handle accepting or rejecting join requests
const { mutate } = useUpdateJoinRequestMutation();
// handle deletion of a student from the class
// Handle deletion of a student from the class
const { mutate: deleteStudentMutation } = useClassDeleteStudentMutation();
// load current user before rendering the page
// Load current user before rendering the page
onMounted(async () => {
const userObject = await authState.loadUser();
username.value = userObject?.profile?.preferred_username ?? undefined;
});
// used to set the visibility of the dialog
// Used to set the visibility of the dialog
const dialog = ref(false);
// student selected for deletion
// Student selected for deletion
const selectedStudent = ref<StudentDTO | null>(null);
// let the teacher verify deletion of a student
// Let the teacher verify deletion of a student
function showPopup(s: StudentDTO): void {
selectedStudent.value = s;
dialog.value = true;
}
async function removeStudentFromclass(): Promise<void> {
// delete student from class
deleteStudentMutation({id: classId, username: selectedStudent.value!.username}, {
// Delete student from class
deleteStudentMutation(
{ id: classId, username: selectedStudent.value!.username },
{
onSuccess: async () => {
dialog.value = false;
await getStudents.refetch();
@ -60,11 +61,12 @@
dialog.value = false;
showSnackbar(t("failed") + ": " + e.message, "error");
},
},)
},
);
}
function handleJoinRequest(c: ClassJoinRequestDTO, accepted: boolean): void {
// handle acception or rejection of a join request
// Handle acception or rejection of a join request
mutate(
{
teacherUsername: username.value!,
@ -74,7 +76,7 @@
},
{
onSuccess: async () => {
if (accepted){
if (accepted) {
await joinRequestsQuery.refetch();
await getStudents.refetch();
@ -91,14 +93,14 @@
);
}
// default of snackbar values
// Default of snackbar values
const snackbar = ref({
visible: false,
message: "",
color: "success",
});
// function to show snackbar on success or failure
// Function to show snackbar on success or failure
function showSnackbar(message: string, color: string): void {
snackbar.value.message = message;
snackbar.value.color = color;

6
frontend/src/views/classes/StudentClasses.vue
View file

@ -7,7 +7,7 @@
import { useCreateJoinRequestMutation, useStudentClassesQuery } from "@/queries/students";
import type { StudentDTO } from "@dwengo-1/common/interfaces/student";
import type { TeacherDTO } from "@dwengo-1/common/interfaces/teacher";
import { type ClassesResponse } from "@/controllers/classes";
import type { ClassesResponse } from "@/controllers/classes";
import UsingQueryResult from "@/components/UsingQueryResult.vue";
import { useClassStudentsQuery, useClassTeachersQuery } from "@/queries/classes";
import type { StudentsResponse } from "@/controllers/students";
@ -44,7 +44,7 @@
async function openStudentDialog(c: ClassDTO): Promise<void> {
selectedClass.value = c;
// let the component know it should show the students in a class
// Let the component know it should show the students in a class
getStudents.value = true;
await getStudentsQuery.refetch();
dialog.value = true;
@ -53,7 +53,7 @@
async function openTeacherDialog(c: ClassDTO): Promise<void> {
selectedClass.value = c;
// let the component know it should show teachers of a class
// Let the component know it should show teachers of a class
getStudents.value = false;
await getTeachersQuery.refetch();
dialog.value = true;

63
frontend/src/views/classes/TeacherClasses.vue
View file

@ -6,7 +6,7 @@
import type { ClassDTO } from "@dwengo-1/common/interfaces/class";
import type { TeacherInvitationDTO } from "@dwengo-1/common/interfaces/teacher-invitation";
import { useTeacherClassesQuery } from "@/queries/teachers";
import { type ClassesResponse, type ClassResponse } from "@/controllers/classes";
import type { ClassesResponse } from "@/controllers/classes";
import UsingQueryResult from "@/components/UsingQueryResult.vue";
import { useClassesQuery, useClassTeacherInvitationsQuery, useCreateClassMutation } from "@/queries/classes";
import type { TeacherInvitationsResponse } from "@/controllers/teacher-invitations";
@ -252,34 +252,41 @@
:query-result="getInvitationsQuery"
v-slot="invitationsResponse: { data: TeacherInvitationsResponse }"
>
<using-query-result :query-result="allClassesQuery" v-slot="classesResponse: {data: ClassesResponse}">
<tr
v-for="i in invitationsResponse.data.invitations as TeacherInvitationDTO[]"
:key="i.classId"
<using-query-result
:query-result="allClassesQuery"
v-slot="classesResponse: { data: ClassesResponse }"
>
<td>
{{ (classesResponse.data.classes as ClassDTO[]).filter((c) => c.id == i.classId)[0] }}
</td>
<td>{{ (i.sender as TeacherDTO).firstName + " " + (i.sender as TeacherDTO).lastName }}</td>
<td class="text-right">
<div>
<v-btn
color="green"
@click="acceptRequest"
class="mr-2"
>
{{ t("accept") }}
</v-btn>
<v-btn
color="red"
@click="denyRequest"
>
{{ t("deny") }}
</v-btn>
</div>
</td>
</tr>
</using-query-result>
<tr
v-for="i in invitationsResponse.data.invitations as TeacherInvitationDTO[]"
:key="i.classId"
>
<td>
{{
(classesResponse.data.classes as ClassDTO[]).filter((c) => c.id == i.classId)[0]
}}
</td>
<td>
{{ (i.sender as TeacherDTO).firstName + " " + (i.sender as TeacherDTO).lastName }}
</td>
<td class="text-right">
<div>
<v-btn
color="green"
@click="acceptRequest"
class="mr-2"
>
{{ t("accept") }}
</v-btn>
<v-btn
color="red"
@click="denyRequest"
>
{{ t("deny") }}
</v-btn>
</div>
</td>
</tr>
</using-query-result>
</using-query-result>
</tbody>
</v-table>