fix(frontend): Groepen met meerdere leden
Overzich van medeleerlingen in groep werkt terug Maakt gebruik van andere query
This commit is contained in:
		
							parent
							
								
									8e50bdef21
								
							
						
					
					
						commit
						04f11ae30b
					
				
					 1 changed files with 24 additions and 34 deletions
				
			
		|  | @ -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" | ||||||
|  |  | ||||||
		Reference in a new issue