111 lines
2.5 KiB
Vue
111 lines
2.5 KiB
Vue
<script setup >
|
|
|
|
const props = defineProps({
|
|
type: {
|
|
type: String
|
|
},
|
|
elementId: {
|
|
type: String
|
|
}
|
|
})
|
|
|
|
const {type, elementId} = props
|
|
|
|
const dataStore = useDataStore()
|
|
const profileStore = useProfileStore()
|
|
const tags = dataStore.getDocumentTags
|
|
|
|
const uploadModalOpen = ref(false)
|
|
const uploadInProgress = ref(false)
|
|
const fileUploadFormData = ref({
|
|
tags: ["Dokument"],
|
|
project: null,
|
|
tenant: profileStore.currentTenant
|
|
})
|
|
|
|
const openModal = () => {
|
|
uploadModalOpen.value = true
|
|
}
|
|
|
|
const uploadFiles = async () => {
|
|
uploadInProgress.value = true;
|
|
|
|
let fileData = fileUploadFormData.value
|
|
fileData[type] = elementId
|
|
|
|
await dataStore.uploadFiles(fileData, document.getElementById("fileUploadInput").files,true)
|
|
|
|
uploadModalOpen.value = false;
|
|
uploadInProgress.value = false;
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<USlideover
|
|
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"
|
|
multiple
|
|
/>
|
|
</UFormGroup>
|
|
<UFormGroup
|
|
label="Tags:"
|
|
class="mt-3"
|
|
>
|
|
<USelectMenu
|
|
multiple
|
|
searchable
|
|
searchable-placeholder="Suchen..."
|
|
:options="tags"
|
|
v-model="fileUploadFormData.tags"
|
|
>
|
|
<template #label>
|
|
<span v-if="fileUploadFormData.tags.length > 0">{{fileUploadFormData.tags.join(", ")}}</span>
|
|
<span v-else>Keine Tags ausgewählt</span>
|
|
</template>
|
|
</USelectMenu>
|
|
</UFormGroup>
|
|
|
|
<template #footer>
|
|
<UButton
|
|
@click="uploadFiles"
|
|
:loading="uploadInProgress"
|
|
>Hochladen</UButton>
|
|
</template>
|
|
|
|
</UCard>
|
|
</USlideover>
|
|
|
|
<UButton
|
|
@click="openModal"
|
|
icon="i-heroicons-arrow-up-tray"
|
|
>
|
|
Hochladen
|
|
</UButton>
|
|
</template>
|
|
|
|
<style scoped>
|
|
|
|
</style> |