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

fix(frontend): Groepen met meerdere leden

Browse source 
Overzich van medeleerlingen in groep werkt terug
Maakt gebruik van andere query
This commit is contained in:
Tibo De Peuter 2025-05-20 08:52:48 +02:00
parent 8e50bdef21
commit 04f11ae30b
Signed by: tdpeuter
GPG key ID: 38297DE43F75FFE2
1 changed files with 24 additions and 34 deletions
Download patch file Download diff file Expand all files Collapse all files

56
frontend/src/views/assignments/StudentAssignment.vue
View file

@ -1,18 +1,18 @@
<script setup lang="ts"> <script setup lang="ts">
import { ref, computed, watchEffect } from "vue"; import { computed, type ComputedRef, ref, watchEffect } 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 UsingQueryResult from "@/components/UsingQueryResult.vue"; import UsingQueryResult from '@/components/UsingQueryResult.vue';
import { asyncComputed } from "@vueuse/core"; import { asyncComputed } from '@vueuse/core';
import { import { useStudentsByUsernamesQuery } from '@/queries/students.ts';
useStudentAssignmentsQuery, import { useGetLearningPathQuery } from '@/queries/learning-paths.ts';
useStudentGroupsQuery, import type { Language } from '@/data-objects/language.ts';
useStudentsByUsernamesQuery, import { calculateProgress } from '@/utils/assignment-utils.ts';
} from "@/queries/students.ts"; import type { LearningPath } from '@/data-objects/learning-paths/learning-path.ts';
import { useGetLearningPathQuery } from "@/queries/learning-paths.ts"; import type { GroupDTO } from '@dwengo-1/common/interfaces/group';
import type { Language } from "@/data-objects/language.ts"; import { useAssignmentQuery } from '@/queries/assignments.ts';
import { calculateProgress } from "@/utils/assignment-utils.ts"; import type { AssignmentDTO } from '@dwengo-1/common/interfaces/assignment';
import type { LearningPath } from "@/data-objects/learning-paths/learning-path.ts"; import type { StudentDTO } from '@dwengo-1/common/interfaces/student';
const props = defineProps<{ const props = defineProps<{
classId: string; classId: string;
@ -28,32 +28,22 @@
return user?.profile?.preferred_username ?? undefined; return user?.profile?.preferred_username ?? undefined;
}); });
const assignmentsQueryResult = useStudentAssignmentsQuery(username, true); const assignmentQueryResult = useAssignmentQuery(props.classId, props.assignmentId);
const assignment = computed(() => { const assignment: ComputedRef<AssignmentDTO | undefined> = computed(() => assignmentQueryResult.data.value?.assignment);
const assignments = assignmentsQueryResult.data.value?.assignments;
if (!assignments) return undefined;
return assignments.find((a) => a.id === props.assignmentId && a.within === props.classId);
});
learningPath.value = assignment.value?.learningPath; learningPath.value = assignment.value?.learningPath;
const groupsQueryResult = useStudentGroupsQuery(username, true);
const group = computed(() => { const group = computed(() => {
const groups = groupsQueryResult.data.value?.groups as GroupDTO[]; const groups = assignment.value?.groups as GroupDTO[];
if (!groups) return undefined; if (!groups) return undefined;
// Sort by original groupNumber // To "normalize" the group numbers, sort the groups and then renumber them
const sortedGroups = [...groups].sort((a, b) => a.groupNumber - b.groupNumber); const renumbered = [...groups]
.sort((a, b) => a.groupNumber - b.groupNumber)
return sortedGroups .map((group, index) => ({ ...group, groupNo: index + 1}));
.map((group, index) => ({ return renumbered .find((group) => group.members?.some((m) => (m as StudentDTO).username === username.value));
...group,
groupNo: index + 1, // Renumbered index
}))
.find((group) => group.members?.some((m) => m.username === username.value));
}); });
watchEffect(() => { watchEffect(() => {
@ -89,7 +79,7 @@
<template> <template>
<div class="container"> <div class="container">
<using-query-result :query-result="assignmentsQueryResult"> <using-query-result :query-result="assignmentQueryResult">
<v-card <v-card
v-if="assignment" v-if="assignment"
class="assignment-card" class="assignment-card"