disable doc updates if assigment not in progress

client/src/pages/learningPath/learningContentPage/assignment/AssignmentTaskView.vue

@@ -157,6 +157,7 @@ const taskFileInfo = computed(() => {
   <AttachmentSection
     v-if="props.task.value.file_submission_required"
     :file-info="taskFileInfo"
+    :read-only="completionStatus !== 'IN_PROGRESS'"
     class="mt-8"
     @file-uploaded="onUpdateFile(props.task.id, $event)"
     @file-deleted="onUpdateFile(props.task.id, null)"

client/src/pages/learningPath/learningContentPage/assignment/AttachmentSection.vue

@@ -1,14 +1,23 @@
 <script setup lang="ts">
-import { ref } from "vue";
+import { ref, watch } from "vue";
 import { presignUpload, uploadFile } from "@/services/files";
 import type { UserDataFileInfo } from "@/types";
 
 const props = defineProps<{
   fileInfo: UserDataFileInfo | null;
+  readOnly: boolean;
 }>();
 const emit = defineEmits(["fileUploaded", "fileDeleted"]);
 
-const selectedFile = ref(props.fileInfo);
+const selectedFile = ref();
+
+watch(
+  () => props.fileInfo,
+  (newVal) => {
+    selectedFile.value = newVal;
+  },
+  { immediate: true }
+);
 
 const loading = ref(false);
 const uploadError = ref(false);
@@ -49,8 +58,12 @@ function handleDelete() {
 
     <template v-else>
       <template v-if="!selectedFile">
-        <div class="relative mb-4 flex cursor-pointer items-center text-blue-800">
+        <div
+          :class="[props.readOnly ? 'text-blue-600' : 'cursor-pointer text-blue-800']"
+          class="relative mb-4 flex items-center"
+        >
           <input
+            v-if="!props.readOnly"
             id="upload"
             type="file"
             class="absolute opacity-0"
@@ -63,12 +76,15 @@ function handleDelete() {
         <p class="text-sm text-gray-900">
           {{ $t("a.Mögliche Formate") }}: .JPG, .PNG, .PDF, .DOC, .MOV, .PPT
         </p>
+        <p class="mb-8 text-sm text-gray-900">
+          {{ $t("a.Maximale Dateigrösse") }}: 20 MB
+        </p>
       </template>
 
       <template v-else>
         <div class="flex items-center gap-x-2">
           <h4 class="mr-4 text-lg font-bold">{{ selectedFile.name }}</h4>
-          <a class="flex cursor-pointer" @click="handleDelete">
+          <a v-if="!props.readOnly" class="flex cursor-pointer" @click="handleDelete">
             <it-icon-delete class="h-8 w-8" />
           </a>
           <a :href="selectedFile.url" class="flex">