chore: translations + try at allowing and file upload after 1st upload …

…#356
SELab-2 · May 16, 2024 · 0fe5b31 · 0fe5b31
1 parent 469c6a3
commit 0fe5b31
Show file tree

Hide file tree

Showing 3 changed files with 18 additions and 6 deletions.
diff --git a/frontend/src/assets/lang/app/en.json b/frontend/src/assets/lang/app/en.json
@@ -324,7 +324,8 @@
         },
         "none_found": "No matching data.",
         "loading": "Loading data. Please wait.",
-        "safeGuard": "Are you sure?"
+        "safeGuard": "Are you sure?",
+        "no_file": "No file found."
     },
     "primevue": {
         "startsWith": "Starts with",
@@ -424,6 +425,7 @@
         "emptySelectionMessage": "No selected item",
         "emptySearchMessage": "No results found",
         "emptyMessage": "No available options",
+        "emptyFileSelect": "No file selected",
         "aria": {
           "trueLabel": "True",
           "falseLabel": "False",

diff --git a/frontend/src/assets/lang/app/nl.json b/frontend/src/assets/lang/app/nl.json
@@ -372,6 +372,7 @@
         "emptyMessage": "Geen resultaten gevonden",
         "emptySearchMessage": "Geen resultaten gevonden",
         "emptySelectionMessage": "Geen optie geselecteerd",
+        "emptyFileSelect": "Geen bestand geselecteerd",
         "endsWith": "Eindigt met",
         "equals": "Is gelijk aan",
         "fileSizeTypes": [

diff --git a/frontend/src/views/admin/DockerImagesView.vue b/frontend/src/views/admin/DockerImagesView.vue
@@ -41,7 +41,7 @@ const editItem = ref<DockerImage>(DockerImage.blankDockerImage());
 const addItem = ref<DockerImage>(DockerImage.blankDockerImage());
 
 const selectOptions = ref(['admin.list', 'admin.add']);
-const selectedOption = ref<string>(t(selectOptions.value[0]));
+const selectedOption = ref<string>(selectOptions.value[0]);
 
 const multiRemove = ref<boolean>(false);
 const selectedItems = ref<any[] | null>(null);
@@ -54,6 +54,8 @@ const columns = ref([
 const showSafetyGuard = ref<boolean>(false);
 const safetyGuardFunction = ref<() => Promise<void>>(async () => {});
 
+const fileUpload = ref();
+
 /**
  * Hides safety guard, executes function that safety guard guards against and fetches data again
  */
@@ -101,6 +103,7 @@ const upload = async (event: FileUploadUploaderEvent): Promise<void> => {
     const files: File[] = event.files as File[];
     await createDockerImage(addItem.value, files[0]);
     addItem.value.name = '';
+    fileUpload.value = fileUpload.value;
 };
 
 
@@ -121,8 +124,13 @@ const onSelect = (selected: any[] | null): void => {
             <div class="gap-3 mb-3">{{ t('admin.docker_images.title') }}</div>
         </Title>
         <Body class="w-full">
-            <SelectButton class="mb-3 gap-3 w-3" v-model="selectedOption" :options="selectOptions.map(t)" />
-            <div v-if="selectedOption === t(selectOptions[0])">
+            <SelectButton
+                class="mb-3 gap-3 w-3"
+                v-model="selectedOption"
+                :options="selectOptions"
+                :option-label="(option: string) => t(option)"
+            />
+            <div v-if="selectedOption === selectOptions[0]">
                 <LazyDataTable
                     :pagination="pagination"
                     :entities="dockerImages"
@@ -201,13 +209,14 @@ const onSelect = (selected: any[] | null): void => {
                 </div>
                 <FileUpload
                     class="mb-3 gap-3"
-                    :custom-upload="true"
+                    ref="fileUpload"
+                    custom-upload
                     @uploader="upload"
                     :file-limit="1"
                     :disabled="addItem.name.length === 0"
                 >
                     <template #empty>
-                        <strong>No file selected.</strong>
+                        <strong>{{ t('primevue.emptyFileSelect') }}</strong>
                     </template>
                 </FileUpload>
             </div>