fix: speciale url voor leerpaden die opdrachten zijn

This commit is contained in:
Joyelle Ndagijimana 2025-04-21 21:27:28 +02:00
parent bed2caba08
commit d82b0ad743
2 changed files with 60 additions and 60 deletions

View file

@ -1,18 +1,18 @@
<script setup lang="ts"> <script setup lang="ts">
import { ref, computed, type Ref } from "vue"; import {ref, computed, type Ref} from "vue";
import auth from "@/services/auth/auth-service.ts"; import auth from "@/services/auth/auth-service.ts";
import { useI18n } from "vue-i18n"; import {useI18n} from "vue-i18n";
import { useAssignmentQuery } from "@/queries/assignments.ts"; import {useAssignmentQuery} from "@/queries/assignments.ts";
import UsingQueryResult from "@/components/UsingQueryResult.vue"; import UsingQueryResult from "@/components/UsingQueryResult.vue";
import type { AssignmentResponse } from "@/controllers/assignments.ts"; import type {AssignmentResponse} from "@/controllers/assignments.ts";
import { asyncComputed } from "@vueuse/core"; import {asyncComputed} from "@vueuse/core";
import { useStudentsByUsernamesQuery } from "@/queries/students.ts"; import {useStudentsByUsernamesQuery} from "@/queries/students.ts";
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 { 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: (
@ -20,46 +20,46 @@
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 = ref<Language>(locale.value as Language); const language = ref<Language>(locale.value as Language);
const learningPath = ref(); const learningPath = ref();
// Get the user's username/id // Get the user's username/id
const username = asyncComputed(async () => { const username = asyncComputed(async () => {
const user = await auth.loadUser(); const user = await auth.loadUser();
return user?.profile?.preferred_username ?? undefined; return user?.profile?.preferred_username ?? undefined;
}); });
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;
const submitted = ref(false); //TODO: update by fetching submissions and check if group submitted const submitted = ref(false); //TODO: update by fetching submissions and check if group submitted
const lpQueryResult = useGetLearningPathQuery( const lpQueryResult = useGetLearningPathQuery(
computed(() => assignmentQueryResult.data.value?.assignment?.learningPath ?? ""), computed(() => assignmentQueryResult.data.value?.assignment?.learningPath ?? ""),
computed(() => language.value), computed(() => language.value),
); );
const groupsQueryResult = useGroupsQuery(props.classId, props.assignmentId, true); const groupsQueryResult = useGroupsQuery(props.classId, props.assignmentId, true);
const group = computed(() => const group = computed(() =>
groupsQueryResult?.data.value?.groups.find((group) => groupsQueryResult?.data.value?.groups.find((group) =>
group.members?.some((m) => m.username === username.value), group.members?.some((m) => m.username === username.value),
), ),
); );
const _groupArray = computed(() => (group.value ? [group.value] : [])); const _groupArray = computed(() => (group.value ? [group.value] : []));
const progressValue = ref(0); const progressValue = ref(0);
/* 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(
groupArray, groupArray,
learningPath, learningPath,
language language
); );
*/ */
// Assuming group.value.members is a list of usernames TODO: case when it's StudentDTO's // Assuming group.value.members is a list of usernames TODO: case when it's StudentDTO's
const studentQueries = useStudentsByUsernamesQuery(() => group.value?.members as string[]); const studentQueries = useStudentsByUsernamesQuery(() => group.value?.members as string[]);
</script> </script>
<template> <template>
@ -100,7 +100,7 @@ Const {groupProgressMap} = props.useGroupsWithProgress(
> >
<v-btn <v-btn
v-if="lpData" v-if="lpData"
:to="`/learningPath/${lpData.hruid}/${language}/${lpData.startNode.learningobjectHruid}`" :to="`/learningPath/${lpData.hruid}/${language}/${lpData.startNode.learningobjectHruid}?forGroup=${group?.groupNumber}&assignmentNo=${assignmentId}&classId=${classId}`"
variant="tonal" variant="tonal"
color="primary" color="primary"
> >
@ -154,14 +154,14 @@ Const {groupProgressMap} = props.useGroupsWithProgress(
</template> </template>
<style scoped> <style scoped>
@import "@/assets/assignment.css"; @import "@/assets/assignment.css";
.progress-label { .progress-label {
font-weight: bold; font-weight: bold;
margin-right: 5px; margin-right: 5px;
} }
.progress-bar { .progress-bar {
width: 40%; width: 40%;
} }
</style> </style>

View file

@ -123,7 +123,7 @@ Const {groupProgressMap} = props.useGroupsWithProgress(
> >
<v-btn <v-btn
v-if="lpData" v-if="lpData"
:to="`/learningPath/${lpData.hruid}/${language}/${lpData.startNode.learningobjectHruid}`" :to="`/learningPath/${lpData.hruid}/${language}/${lpData.startNode.learningobjectHruid}?assignmentNo=${assignmentId}&classId=${classId}`"
variant="tonal" variant="tonal"
color="primary" color="primary"
> >