Many Changes

spaces/components/DocumentUpload.vue

@@ -0,0 +1,103 @@
+<script setup >
+
+const props = defineProps({
+  type: {
+    type: String
+  },
+  elementId: {
+    type: String
+  }
+})
+
+const {type, elementId} = props
+
+const dataStore = useDataStore()
+const tags = dataStore.getDocumentTags
+
+const uploadModalOpen = ref(false)
+const uploadInProgress = ref(false)
+const fileUploadFormData = ref({
+  tags: ["Dokument"],
+  project: null
+})
+
+const openModal = () => {
+  console.log("Oepn")
+  uploadModalOpen.value = true
+}
+
+const uploadFiles = async () => {
+  uploadInProgress.value = true;
+
+  let fileData = fileUploadFormData.value
+  fileData[type] = elementId
+
+  await dataStore.uploadFiles(fileData,  document.getElementById("fileUploadInput").files)
+
+  uploadModalOpen.value = false;
+  uploadInProgress.value = false;
+}
+</script>
+
+<template>
+  <UModal
+      v-model="uploadModalOpen"
+  >
+    <UCard :ui="{ ring: '', divide: 'divide-y divide-gray-100 dark:divide-gray-800' }">
+      <template #header>
+        <div class="flex items-center justify-between">
+          <h3 class="text-base font-semibold leading-6 text-gray-900 dark:text-white">
+            Datei hochladen
+          </h3>
+          <UButton
+              color="gray"
+              variant="ghost"
+              icon="i-heroicons-x-mark-20-solid"
+              class="-my-1"
+              @click="uploadModalOpen = false"
+              :disabled="uploadInProgress"
+          />
+        </div>
+      </template>
+
+      <UFormGroup
+          label="Datei:"
+      >
+        <UInput
+            type="file"
+            id="fileUploadInput"
+        />
+      </UFormGroup>
+      <UFormGroup
+          label="Tags:"
+          class="mt-3"
+      >
+        <USelectMenu
+            multiple
+            searchable
+            searchable-placeholder="Suchen..."
+            :options="tags"
+            v-model="fileUploadFormData.tags"
+        />
+      </UFormGroup>
+
+      <template #footer>
+        <UButton
+            @click="uploadFiles"
+            :loading="uploadInProgress"
+        >Hochladen</UButton>
+      </template>
+
+    </UCard>
+  </UModal>
+
+  <UButton
+      @click="openModal"
+  >
+    Hochladen
+  </UButton>
+</template>
+
+<style scoped>
+
+</style>