first initialization gallery

frontend/src/components/FolderItem.vue

@@ -0,0 +1,52 @@
+<template>
+    <div>
+        <span @click="selectFolder" class="folder-name" :class="{ selected: folder.id === selectedFolder?.id }">
+            <span v-if="!folder.children || !folder.children.length" class="end-marker">⌞</span>
+            <span v-else>{{ prefix }}</span>
+            <span> {{ folder.name }}</span>
+        </span>
+        <div v-if="folder.children && folder.children.length" class="children">
+            <folder-item v-for="child in folder.children" :key="child.id" :folder="child"
+                :selected-folder="selectedFolder" 
+                @select-folder="$emit('select-folder', child)">
+            </folder-item>
+        </div>
+    </div>
+</template>
+
+<script>
+export default {
+    props: {
+        folder: Object,
+        prefix: {
+            type: String,
+            default: ''
+        },
+        selectedFolder: Object, // Den aktuellen ausgewählten Ordner als Prop übergeben
+    },
+    methods: {
+        selectFolder() {
+            this.$emit('select-folder', this.folder); // Ordner auswählen und nach oben emitten
+        }
+    }
+};
+</script>
+
+<style scoped>
+.folder-name {
+    cursor: pointer;
+}
+
+.selected {
+    font-weight: bold;
+}
+
+.children {
+    margin-left: 20px;
+}
+
+.end-marker {
+    font-size: 1.2em;
+    vertical-align: middle;
+}
+</style>

frontend/src/components/form/MultiselectWidget.vue

@@ -12,10 +12,10 @@
             :track-by="'value'"
         >
             <template #option="{ option }">
-                <span v-if="option && option.value">Option: {{ getTranslation(option) }}</span>
+                <span v-if="option && option.value">{{ getTranslation(option) }}</span>
             </template>
             <template #tag="{ option, remove }">
-                <span v-if="option && option.captionTr" class="custom-tag">
+                <span v-if="option && option.captionTr" class="multiselect__tag">
                     {{ $t(option.captionTr) }}
                     <span @click="remove(option)">×</span>
                 </span>