ramon
/
skillbox
1
0
Fork 0
Code Issues 1 Pull Requests 1 Packages Projects 1 Releases 1 Wiki Activity

Fix reactivity bug

This commit is contained in:
Lorenz Padberg 2024-03-20 20:23:58 +01:00
parent ae09d9a1ef
commit 2d280d9ff8
1 changed files with 10 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
client/src/components/content-blocks/assignment/Assignment.vue
View File

@ -42,10 +42,11 @@
<p <p
class="assignment__feedback" class="assignment__feedback"
v-if="assignment.submission.submissionFeedback" v-if="assignment.submission?.submissionFeedback"
v-html="feedbackText" v-html="feedbackText"
/> />
</template> </template>
<template v-if="!isStudent && assignment.id"> <template v-if="!isStudent && assignment.id">
<router-link <router-link
:to="{ name: 'submissions', params: { id: assignment.id } }" :to="{ name: 'submissions', params: { id: assignment.id } }"
@ -58,7 +59,7 @@
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { defineAsyncComponent, nextTick, onMounted, reactive, ref, watch } from 'vue'; import { defineAsyncComponent, nextTick, onMounted, ref, watch } from 'vue';
import { useRoute } from 'vue-router'; import { useRoute } from 'vue-router';
import { useMutation, useQuery } from '@vue/apollo-composable'; import { useMutation, useQuery } from '@vue/apollo-composable';
import { graphql } from '@/__generated__'; import { graphql } from '@/__generated__';
@ -91,7 +92,7 @@ const initialSubmission = {
document: '', document: '',
final: false, final: false,
}; };
const assignment = reactive({ submission: initialSubmission }); const assignment = ref({ submission: initialSubmission });
const corrections = ref(''); const corrections = ref('');
const unsaved = ref(false); const unsaved = ref(false);
const saving = ref(0); const saving = ref(0);
@ -264,9 +265,12 @@ const unmark = () => {
onResult(async () => { onResult(async () => {
const { assignment: loadedAssignment } = result.value; const { assignment: loadedAssignment } = result.value;
assignment.value = { assignment.value = {
...loadedAssignment, ...loadedAssignment,
}; };
await nextTick();
assignment.value.submission = Object.assign(initialSubmission, assignment.value.submission); assignment.value.submission = Object.assign(initialSubmission, assignment.value.submission);
if (assignmentDiv.value) { if (assignmentDiv.value) {
@ -392,9 +396,9 @@ const saveInput = (answer: string) => {
corrections.value = ''; corrections.value = '';
unsaved.value = true; unsaved.value = true;
/* /*
We update the assignment on this component, so the changes are reflected on it. The server does not return We update the assignment on this component, so the changes are reflected on it. The server does not return
the updated entity, to prevent the UI to update when the user is entering his input the updated entity, to prevent the UI to update when the user is entering his input
*/ */
assignment.value.submission.text = answer; assignment.value.submission.text = answer;
_save(assignment.value.submission); _save(assignment.value.submission);