feat: beschrijving van assignment editen werkt

This commit is contained in:
Joyelle Ndagijimana 2025-05-17 00:58:50 +02:00
parent 862e72ef4a
commit 92e7bccf5f
2 changed files with 39 additions and 46 deletions

View file

@ -49,6 +49,8 @@
const { valid } = await form.value.validate(); const { valid } = await form.value.validate();
if (!valid) return; if (!valid) return;
console.log(selectedLearningPath.value);
let lp = selectedLearningPath.value; let lp = selectedLearningPath.value;
if (!lpIsSelected) { if (!lpIsSelected) {
lp = selectedLearningPath.value?.hruid; lp = selectedLearningPath.value?.hruid;
@ -81,7 +83,7 @@
@submit.prevent="submitFormHandler" @submit.prevent="submitFormHandler"
> >
<v-container class="step-container pa-0"> <v-container class="step-container pa-0">
<!-- Titel veld --> <!-- Title field -->
<v-text-field <v-text-field
v-model="assignmentTitle" v-model="assignmentTitle"
:label="t('title')" :label="t('title')"

View file

@ -8,12 +8,11 @@ import {
} from "@/queries/assignments.ts"; } 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 {useGetAllLearningPaths, 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, GroupDTOId} from "@dwengo-1/common/interfaces/group"; import type {GroupDTO, GroupDTOId} from "@dwengo-1/common/interfaces/group";
import type {LearningPath} from "@/data-objects/learning-paths/learning-path"; import {descriptionRules} from "@/utils/assignment-rules.ts";
import {descriptionRules, learningPathRules} from "@/utils/assignment-rules.ts";
import GroupSubmissionStatus from "@/components/GroupSubmissionStatus.vue"; import GroupSubmissionStatus from "@/components/GroupSubmissionStatus.vue";
import GroupProgressRow from "@/components/GroupProgressRow.vue"; import GroupProgressRow from "@/components/GroupProgressRow.vue";
import type {AssignmentDTO} from "@dwengo-1/common/dist/interfaces/assignment.ts"; import type {AssignmentDTO} from "@dwengo-1/common/dist/interfaces/assignment.ts";
@ -53,8 +52,15 @@ const groupsQueryResult = useGroupsQuery(props.classId, props.assignmentId, true
groups.value = groupsQueryResult.data.value?.groups ?? []; groups.value = groupsQueryResult.data.value?.groups ?? [];
watchEffect(() => { watchEffect(() => {
learningPath.value = assignmentQueryResult.data.value?.assignment?.learningPath; const assignment = assignmentQueryResult.data.value?.assignment;
lang.value = assignmentQueryResult.data.value?.assignment?.language as Language; if (assignment) {
learningPath.value = assignment.learningPath;
lang.value = assignment.language as Language;
if (lpQueryResult.data.value) {
editingLearningPath.value = lpQueryResult.data.value;
}
}
}); });
const allGroups = computed(() => { const allGroups = computed(() => {
@ -77,11 +83,12 @@ const allGroups = computed(() => {
const dialog = ref(false); const dialog = ref(false);
const selectedGroup = ref({}); const selectedGroup = ref({});
function openGroupDetails(group): void { function openGroupDetails(group: object): void {
selectedGroup.value = group; selectedGroup.value = group;
dialog.value = true; dialog.value = true;
} }
async function deleteAssignment(num: number, clsId: string): Promise<void> { async function deleteAssignment(num: number, clsId: string): Promise<void> {
const {mutate} = useDeleteAssignmentMutation(); const {mutate} = useDeleteAssignmentMutation();
mutate( mutate(
@ -110,13 +117,11 @@ function goToGroupSubmissionLink(groupNo: number): string | undefined {
return `/learningPath/${lp.hruid}/${lp.language}/${lp.startNode.learningobjectHruid}?forGroup=${groupNo}&assignmentNo=${props.assignmentId}&classId=${props.classId}`; return `/learningPath/${lp.hruid}/${lp.language}/${lp.startNode.learningobjectHruid}?forGroup=${groupNo}&assignmentNo=${props.assignmentId}&classId=${props.classId}`;
} }
const learningPathsQueryResults = useGetAllLearningPaths(lang);
const {mutate, data, isSuccess} = useUpdateAssignmentMutation(); const {mutate, data, isSuccess} = useUpdateAssignmentMutation();
watch([isSuccess, data], ([success, newData]) => { watch([isSuccess, data], async ([success, newData]) => {
if (success && newData?.assignment) { if (success && newData?.assignment) {
window.location.reload(); await assignmentQueryResult.refetch();
} }
}); });
@ -126,13 +131,9 @@ async function saveChanges(): Promise<void> {
isEditing.value = false; isEditing.value = false;
const lp = learningPath.value;
const assignmentDTO: AssignmentDTO = { const assignmentDTO: AssignmentDTO = {
id: assignmentQueryResult.data.value?.assignment.id,
description: description.value, description: description.value,
learningPath: lp || "", //deadline: new Date(),TODO: deadline aanpassen
deadline: new Date(),
}; };
mutate({ mutate({
@ -141,6 +142,18 @@ async function saveChanges(): Promise<void> {
data: assignmentDTO, data: assignmentDTO,
}); });
} }
async function handleGroupsUpdated(updatedGroups: string[][]): Promise<void> {
const assignmentDTO: AssignmentDTO = {
groups: updatedGroups,
};
mutate({
cid: assignmentQueryResult.data.value?.assignment.within,
an: assignmentQueryResult.data.value?.assignment.id,
data: assignmentDTO,
});
}
</script> </script>
<template> <template>
@ -240,10 +253,7 @@ async function saveChanges(): Promise<void> {
<v-card-title class="text-h4 assignmentTopTitle" <v-card-title class="text-h4 assignmentTopTitle"
>{{ assignmentResponse.data.assignment.title }} >{{ assignmentResponse.data.assignment.title }}
</v-card-title> </v-card-title>
<v-card-subtitle <v-card-subtitle class="subtitle-section">
v-if="!isEditing"
class="subtitle-section"
>
<using-query-result <using-query-result
:query-result="lpQueryResult" :query-result="lpQueryResult"
v-slot="{ data: lpData }" v-slot="{ data: lpData }"
@ -256,34 +266,14 @@ async function saveChanges(): Promise<void> {
> >
{{ t("learning-path") }} {{ t("learning-path") }}
</v-btn> </v-btn>
<v-alert
v-else
type="info"
>
{{ t("no-learning-path-selected") }}
</v-alert>
</using-query-result> </using-query-result>
</v-card-subtitle> </v-card-subtitle>
<using-query-result
v-else
:query-result="learningPathsQueryResults"
v-slot="{ data }: { data: LearningPath[] }"
>
<v-card-text>
<v-combobox
v-model="editingLearningPath"
:items="data"
:label="t('choose-lp')"
:rules="learningPathRules"
variant="outlined"
clearable
hide-details
density="compact"
append-inner-icon="mdi-magnify"
item-title="title"
item-value="hruid"
required
:filter="
(item, query: string) =>
item.title.toLowerCase().includes(query.toLowerCase())
"
></v-combobox>
</v-card-text>
</using-query-result>
<v-card-text <v-card-text
v-if="!isEditing" v-if="!isEditing"
@ -422,6 +412,7 @@ async function saveChanges(): Promise<void> {
:groups="allGroups" :groups="allGroups"
:class-id="props.classId" :class-id="props.classId"
:assignment-id="props.assignmentId" :assignment-id="props.assignmentId"
@groupsUpdated="handleGroupsUpdated"
@close="editGroups = false" @close="editGroups = false"
/> />
</v-card-text> </v-card-text>