From 215ef5b446e89080f8ecf8e2e83898e97093a1e3 Mon Sep 17 00:00:00 2001
From: Joyelle Ndagijimana <njoyelle2@gmail.com>
Date: Sun, 4 May 2025 10:56:14 +0200
Subject: [PATCH] fix: leerpad wordt gefetched in taal van originele opdracht

---
 .../views/assignments/TeacherAssignment.vue   | 151 +++++++++---------
 1 file changed, 76 insertions(+), 75 deletions(-)

diff --git a/frontend/src/views/assignments/TeacherAssignment.vue b/frontend/src/views/assignments/TeacherAssignment.vue
index e626a8be..f99f7321 100644
--- a/frontend/src/views/assignments/TeacherAssignment.vue
+++ b/frontend/src/views/assignments/TeacherAssignment.vue
@@ -1,87 +1,87 @@
 <script setup lang="ts">
-    import { computed, type Ref, ref } from "vue";
-    import { useI18n } from "vue-i18n";
-    import { useAssignmentQuery, useDeleteAssignmentMutation } from "@/queries/assignments.ts";
-    import UsingQueryResult from "@/components/UsingQueryResult.vue";
-    import { useGroupsQuery } from "@/queries/groups.ts";
-    import { useGetLearningPathQuery } from "@/queries/learning-paths.ts";
-    import type { Language } from "@/data-objects/language.ts";
-    import type { AssignmentResponse } from "@/controllers/assignments.ts";
-    import type { GroupDTO } from "@dwengo-1/common/interfaces/group";
+import {computed, type Ref, ref} from "vue";
+import {useI18n} from "vue-i18n";
+import {useAssignmentQuery, useDeleteAssignmentMutation} from "@/queries/assignments.ts";
+import UsingQueryResult from "@/components/UsingQueryResult.vue";
+import {useGroupsQuery} from "@/queries/groups.ts";
+import {useGetLearningPathQuery} from "@/queries/learning-paths.ts";
+import type {Language} from "@/data-objects/language.ts";
+import type {AssignmentResponse} from "@/controllers/assignments.ts";
+import type {GroupDTO} from "@dwengo-1/common/interfaces/group";
 
-    const props = defineProps<{
-        classId: string;
-        assignmentId: number;
-        useGroupsWithProgress: (
-            groups: Ref<GroupDTO[]>,
-            hruid: Ref<string>,
-            language: Ref<Language>,
-        ) => { groupProgressMap: Map<number, number> };
-    }>();
+const props = defineProps<{
+    classId: string;
+    assignmentId: number;
+    useGroupsWithProgress: (
+        groups: Ref<GroupDTO[]>,
+        hruid: Ref<string>,
+        language: Ref<Language>,
+    ) => { groupProgressMap: Map<number, number> };
+}>();
 
-    const { t, locale } = useI18n();
-    const language = computed(() => locale.value);
-    const groups = ref();
-    const learningPath = ref();
+const {t, locale} = useI18n();
+const language = computed(() => locale.value);
+const groups = ref();
+const learningPath = ref();
 
-    const assignmentQueryResult = useAssignmentQuery(() => props.classId, props.assignmentId);
-    learningPath.value = assignmentQueryResult.data.value?.assignment?.learningPath;
-    // Get learning path object
-    const lpQueryResult = useGetLearningPathQuery(
-        computed(() => assignmentQueryResult.data.value?.assignment?.learningPath ?? ""),
-        computed(() => language.value as Language),
-    );
+const assignmentQueryResult = useAssignmentQuery(() => props.classId, props.assignmentId);
+learningPath.value = assignmentQueryResult.data.value?.assignment?.learningPath;
+// Get learning path object
+const lpQueryResult = useGetLearningPathQuery(
+    computed(() => assignmentQueryResult.data.value?.assignment?.learningPath ?? ""),
+    computed(() => assignmentQueryResult.data.value?.assignment.language as Language),
+);
 
-    // Get all the groups withing the assignment
-    const groupsQueryResult = useGroupsQuery(props.classId, props.assignmentId, true);
-    groups.value = groupsQueryResult.data.value?.groups;
+// Get all the groups withing the assignment
+const groupsQueryResult = useGroupsQuery(props.classId, props.assignmentId, true);
+groups.value = groupsQueryResult.data.value?.groups;
 
-    /* Crashes right now cause api data has inexistent hruid TODO: uncomment later and use it in progress bar
+/* Crashes right now cause api data has inexistent hruid TODO: uncomment later and use it in progress bar
 Const {groupProgressMap} = props.useGroupsWithProgress(
-    groups,
-    learningPath,
-    language
+groups,
+learningPath,
+language
 );
 */
 
-    const allGroups = computed(() => {
-        const groups = groupsQueryResult.data.value?.groups;
-        if (!groups) return [];
+const allGroups = computed(() => {
+    const groups = groupsQueryResult.data.value?.groups;
+    if (!groups) return [];
 
-        return groups.map((group) => ({
-            name: `${t("group")} ${group.groupNumber}`,
-            progress: 0, //GroupProgressMap[group.groupNumber],
-            members: group.members,
-            submitted: false, //TODO: fetch from submission
-        }));
-    });
+    return groups.map((group) => ({
+        name: `${t("group")} ${group.groupNumber}`,
+        progress: 0, //GroupProgressMap[group.groupNumber],
+        members: group.members,
+        submitted: false, //TODO: fetch from submission
+    }));
+});
 
-    const dialog = ref(false);
-    const selectedGroup = ref({});
+const dialog = ref(false);
+const selectedGroup = ref({});
 
-    function openGroupDetails(group): void {
-        selectedGroup.value = group;
-        dialog.value = true;
-    }
+function openGroupDetails(group): void {
+    selectedGroup.value = group;
+    dialog.value = true;
+}
 
-    const headers = computed(() => [
-        { title: t("group"), align: "start", key: "name" },
-        { title: t("progress"), align: "center", key: "progress" },
-        { title: t("submission"), align: "center", key: "submission" },
-    ]);
+const headers = computed(() => [
+    {title: t("group"), align: "start", key: "name"},
+    {title: t("progress"), align: "center", key: "progress"},
+    {title: t("submission"), align: "center", key: "submission"},
+]);
 
-    const { mutate } = useDeleteAssignmentMutation();
+const {mutate} = useDeleteAssignmentMutation();
 
-    async function deleteAssignment(num: number, clsId: string): Promise<void> {
-        mutate(
-            { cid: clsId, an: num },
-            {
-                onSuccess: () => {
-                    window.location.href = "/user/assignment";
-                },
+async function deleteAssignment(num: number, clsId: string): Promise<void> {
+    mutate(
+        {cid: clsId, an: num},
+        {
+            onSuccess: () => {
+                window.location.href = "/user/assignment";
             },
-        );
-    }
+        },
+    );
+}
 </script>
 
 <template>
@@ -121,7 +121,7 @@ Const {groupProgressMap} = props.useGroupsWithProgress(
                     >
                         <v-btn
                             v-if="lpData"
-                            :to="`/learningPath/${lpData.hruid}/${language}/${lpData.startNode.learningobjectHruid}?assignmentNo=${assignmentId}&classId=${classId}`"
+                            :to="`/learningPath/${lpData.hruid}/${assignmentQueryResult.data.value?.assignment.language}/${lpData.startNode.learningobjectHruid}?assignmentNo=${assignmentId}&classId=${classId}`"
                             variant="tonal"
                             color="primary"
                         >
@@ -193,7 +193,7 @@ Const {groupProgressMap} = props.useGroupsWithProgress(
                                 >
                                     <v-list-item-content>
                                         <v-list-item-title
-                                            >{{ member.firstName + " " + member.lastName }}
+                                        >{{ member.firstName + " " + member.lastName }}
                                         </v-list-item-title>
                                     </v-list-item-content>
                                 </v-list-item>
@@ -203,7 +203,8 @@ Const {groupProgressMap} = props.useGroupsWithProgress(
                             <v-btn
                                 color="primary"
                                 @click="dialog = false"
-                                >Close</v-btn
+                            >Close
+                            </v-btn
                             >
                         </v-card-actions>
                     </v-card>
@@ -225,10 +226,10 @@ Const {groupProgressMap} = props.useGroupsWithProgress(
 </template>
 
 <style scoped>
-    @import "@/assets/assignment.css";
+@import "@/assets/assignment.css";
 
-    .table-scroll {
-        overflow-x: auto;
-        -webkit-overflow-scrolling: touch;
-    }
+.table-scroll {
+    overflow-x: auto;
+    -webkit-overflow-scrolling: touch;
+}
 </style>