fix: leerpad wordt gefetched in taal van originele opdracht
This commit is contained in:
		
							parent
							
								
									509dd6bfab
								
							
						
					
					
						commit
						215ef5b446
					
				
					 1 changed files with 76 additions and 75 deletions
				
			
		|  | @ -1,15 +1,15 @@ | ||||||
| <script setup lang="ts"> | <script setup lang="ts"> | ||||||
|     import { computed, type Ref, ref } from "vue"; | import {computed, type Ref, ref} from "vue"; | ||||||
|     import { useI18n } from "vue-i18n"; | import {useI18n} from "vue-i18n"; | ||||||
|     import { useAssignmentQuery, useDeleteAssignmentMutation } from "@/queries/assignments.ts"; | import {useAssignmentQuery, useDeleteAssignmentMutation} from "@/queries/assignments.ts"; | ||||||
|     import UsingQueryResult from "@/components/UsingQueryResult.vue"; | import UsingQueryResult from "@/components/UsingQueryResult.vue"; | ||||||
|     import { useGroupsQuery } from "@/queries/groups.ts"; | import {useGroupsQuery} from "@/queries/groups.ts"; | ||||||
|     import { useGetLearningPathQuery } from "@/queries/learning-paths.ts"; | import {useGetLearningPathQuery} from "@/queries/learning-paths.ts"; | ||||||
|     import type { Language } from "@/data-objects/language.ts"; | import type {Language} from "@/data-objects/language.ts"; | ||||||
|     import type { AssignmentResponse } from "@/controllers/assignments.ts"; | import type {AssignmentResponse} from "@/controllers/assignments.ts"; | ||||||
|     import type { GroupDTO } from "@dwengo-1/common/interfaces/group"; | import type {GroupDTO} from "@dwengo-1/common/interfaces/group"; | ||||||
| 
 | 
 | ||||||
|     const props = defineProps<{ | const props = defineProps<{ | ||||||
|     classId: string; |     classId: string; | ||||||
|     assignmentId: number; |     assignmentId: number; | ||||||
|     useGroupsWithProgress: ( |     useGroupsWithProgress: ( | ||||||
|  | @ -17,34 +17,34 @@ | ||||||
|         hruid: Ref<string>, |         hruid: Ref<string>, | ||||||
|         language: Ref<Language>, |         language: Ref<Language>, | ||||||
|     ) => { groupProgressMap: Map<number, number> }; |     ) => { groupProgressMap: Map<number, number> }; | ||||||
|     }>(); | }>(); | ||||||
| 
 | 
 | ||||||
|     const { t, locale } = useI18n(); | const {t, locale} = useI18n(); | ||||||
|     const language = computed(() => locale.value); | const language = computed(() => locale.value); | ||||||
|     const groups = ref(); | const groups = ref(); | ||||||
|     const learningPath = ref(); | const learningPath = ref(); | ||||||
| 
 | 
 | ||||||
|     const assignmentQueryResult = useAssignmentQuery(() => props.classId, props.assignmentId); | const assignmentQueryResult = useAssignmentQuery(() => props.classId, props.assignmentId); | ||||||
|     learningPath.value = assignmentQueryResult.data.value?.assignment?.learningPath; | learningPath.value = assignmentQueryResult.data.value?.assignment?.learningPath; | ||||||
|     // Get learning path object | // Get learning path object | ||||||
|     const lpQueryResult = useGetLearningPathQuery( | const lpQueryResult = useGetLearningPathQuery( | ||||||
|     computed(() => assignmentQueryResult.data.value?.assignment?.learningPath ?? ""), |     computed(() => assignmentQueryResult.data.value?.assignment?.learningPath ?? ""), | ||||||
|         computed(() => language.value as Language), |     computed(() => assignmentQueryResult.data.value?.assignment.language as Language), | ||||||
|     ); | ); | ||||||
| 
 | 
 | ||||||
|     // Get all the groups withing the assignment | // Get all the groups withing the assignment | ||||||
|     const groupsQueryResult = useGroupsQuery(props.classId, props.assignmentId, true); | const groupsQueryResult = useGroupsQuery(props.classId, props.assignmentId, true); | ||||||
|     groups.value = groupsQueryResult.data.value?.groups; | 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( | Const {groupProgressMap} = props.useGroupsWithProgress( | ||||||
|     groups, | groups, | ||||||
|     learningPath, | learningPath, | ||||||
|     language | language | ||||||
| ); | ); | ||||||
| */ | */ | ||||||
| 
 | 
 | ||||||
|     const allGroups = computed(() => { | const allGroups = computed(() => { | ||||||
|     const groups = groupsQueryResult.data.value?.groups; |     const groups = groupsQueryResult.data.value?.groups; | ||||||
|     if (!groups) return []; |     if (!groups) return []; | ||||||
| 
 | 
 | ||||||
|  | @ -54,34 +54,34 @@ Const {groupProgressMap} = props.useGroupsWithProgress( | ||||||
|         members: group.members, |         members: group.members, | ||||||
|         submitted: false, //TODO: fetch from submission |         submitted: false, //TODO: fetch from submission | ||||||
|     })); |     })); | ||||||
|     }); | }); | ||||||
| 
 | 
 | ||||||
|     const dialog = ref(false); | const dialog = ref(false); | ||||||
|     const selectedGroup = ref({}); | const selectedGroup = ref({}); | ||||||
| 
 | 
 | ||||||
|     function openGroupDetails(group): void { | function openGroupDetails(group): void { | ||||||
|     selectedGroup.value = group; |     selectedGroup.value = group; | ||||||
|     dialog.value = true; |     dialog.value = true; | ||||||
|     } | } | ||||||
| 
 | 
 | ||||||
|     const headers = computed(() => [ | const headers = computed(() => [ | ||||||
|         { title: t("group"), align: "start", key: "name" }, |     {title: t("group"), align: "start", key: "name"}, | ||||||
|         { title: t("progress"), align: "center", key: "progress" }, |     {title: t("progress"), align: "center", key: "progress"}, | ||||||
|         { title: t("submission"), align: "center", key: "submission" }, |     {title: t("submission"), align: "center", key: "submission"}, | ||||||
|     ]); | ]); | ||||||
| 
 | 
 | ||||||
|     const { mutate } = useDeleteAssignmentMutation(); | const {mutate} = useDeleteAssignmentMutation(); | ||||||
| 
 | 
 | ||||||
|     async function deleteAssignment(num: number, clsId: string): Promise<void> { | async function deleteAssignment(num: number, clsId: string): Promise<void> { | ||||||
|     mutate( |     mutate( | ||||||
|             { cid: clsId, an: num }, |         {cid: clsId, an: num}, | ||||||
|         { |         { | ||||||
|             onSuccess: () => { |             onSuccess: () => { | ||||||
|                 window.location.href = "/user/assignment"; |                 window.location.href = "/user/assignment"; | ||||||
|             }, |             }, | ||||||
|         }, |         }, | ||||||
|     ); |     ); | ||||||
|     } | } | ||||||
| </script> | </script> | ||||||
| 
 | 
 | ||||||
| <template> | <template> | ||||||
|  | @ -121,7 +121,7 @@ Const {groupProgressMap} = props.useGroupsWithProgress( | ||||||
|                     > |                     > | ||||||
|                         <v-btn |                         <v-btn | ||||||
|                             v-if="lpData" |                             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" |                             variant="tonal" | ||||||
|                             color="primary" |                             color="primary" | ||||||
|                         > |                         > | ||||||
|  | @ -203,7 +203,8 @@ Const {groupProgressMap} = props.useGroupsWithProgress( | ||||||
|                             <v-btn |                             <v-btn | ||||||
|                                 color="primary" |                                 color="primary" | ||||||
|                                 @click="dialog = false" |                                 @click="dialog = false" | ||||||
|                                 >Close</v-btn |                             >Close | ||||||
|  |                             </v-btn | ||||||
|                             > |                             > | ||||||
|                         </v-card-actions> |                         </v-card-actions> | ||||||
|                     </v-card> |                     </v-card> | ||||||
|  | @ -225,10 +226,10 @@ Const {groupProgressMap} = props.useGroupsWithProgress( | ||||||
| </template> | </template> | ||||||
| 
 | 
 | ||||||
| <style scoped> | <style scoped> | ||||||
|     @import "@/assets/assignment.css"; | @import "@/assets/assignment.css"; | ||||||
| 
 | 
 | ||||||
|     .table-scroll { | .table-scroll { | ||||||
|     overflow-x: auto; |     overflow-x: auto; | ||||||
|     -webkit-overflow-scrolling: touch; |     -webkit-overflow-scrolling: touch; | ||||||
|     } | } | ||||||
| </style> | </style> | ||||||
|  |  | ||||||
		Reference in a new issue
	
	 Joyelle Ndagijimana
						Joyelle Ndagijimana