Document Restructure

Introduced ExternalDevices Settingspage
Added DocumentDisplay.vue Component
Some Changes to Spaces

spaces/pages/projects/[id].vue

@@ -6,11 +6,13 @@ definePageMeta({
 import * as dayjs from 'dayjs'
 
 const supabase = useSupabaseClient()
+const user = useSupabaseUser()
 const route = useRoute()
 
-const {getProjectById, getFormSubmitsWithLabelProp, getTimesByProjectId} = useDataStore()
-const {forms, formSubmits, times, profiles} = storeToRefs(useDataStore())
+const {getProjectById, getFormSubmitsWithLabelProp, getTimesByProjectId, getDocumentTags, getDocumentsByProjectId, fetchDocuments} = useDataStore()
+const {forms, formSubmits, times, profiles,documents} = storeToRefs(useDataStore())
 
+fetchDocuments()
 const currentProject = getProjectById(Number(route.params.id))
 
 const formSubmissionsComposed = getFormSubmitsWithLabelProp
@@ -75,6 +77,9 @@ const tabItems = [
   },{
     key: "forms",
     label: "Formulare"
+  },{
+    key: "documents",
+    label: "Dokumente"
   },{
     key: "description",
     label: "Dokumentation"
@@ -131,6 +136,49 @@ const saveProjectDescription = async () => {
 
 };
 
+const uploadModalOpen = ref(false)
+const fileUploadFormData = ref({
+  tags: ["Dokument"],
+  folder: "Projekte",
+  usedInResource: {
+    type: "Projekt",
+  }
+})
+const tags = getDocumentTags
+const uploadFile = async () => {
+  const file = document.getElementById("fileUploadInput").files[0]
+
+  const {data,error} = await supabase
+      .storage
+      .from("documents")
+      .upload(`${user.value.app_metadata.tenant}/${fileUploadFormData.value.folder}/${currentProject.id}/${file.name}`,file)
+
+  console.log(data)
+  const returnPath = data.path
+
+  if(error) {
+
+  } else {
+    console.log(returnPath)
+    const files = (await supabase.storage.from('documents').list(`${user.value.app_metadata.tenant}/${fileUploadFormData.value.folder}/${currentProject.id}/`, {limit: 100, offset: 0, sortBy: { column: 'name', order: 'asc' }})).data
+    console.log(files)
+    const fileId = files.find(temp => returnPath.includes(temp.name)).id
+
+    fileUploadFormData.value.object = fileId
+    fileUploadFormData.value.path = returnPath
+    fileUploadFormData.value.usedInResource.id = currentProject.id
+    console.log(fileUploadFormData.value)
+
+    const {data,error} = await supabase
+        .from("documents")
+        .insert([fileUploadFormData.value])
+        .select()
+    console.log(data)
+    console.log(error)
+  }
+
+  uploadModalOpen.value = false;
+}
 
 const updatePhases = async () => {
   //await update('projects', route.params.id, {phases: project.attributes.phases})
@@ -240,6 +288,84 @@ const phaseInfo = ref({
             </template>
           </UAccordion>
         </div>
+        <div v-else-if="item.key === 'documents'" class="space-y-3">
+          <UButton
+            @click="uploadModalOpen = true"
+          >
+            Hochladen
+          </UButton>
+          <UModal
+              v-model="uploadModalOpen"
+          >
+            <UCard class="p-4">
+
+              <template #header>
+                Datei hochladen
+              </template>
+
+              <UFormGroup
+                  label="Datei:"
+              >
+                <UInput
+                    type="file"
+                    id="fileUploadInput"
+                />
+              </UFormGroup>
+              <!--          <UFormGroup
+                          label="Name:"
+                          class="mt-3"
+                        >
+                          <UInput
+                              v-model="fileUploadFormData.name"
+                          />
+                        </UFormGroup>-->
+              <UFormGroup
+                  label="Tags:"
+                  class="mt-3"
+              >
+                <USelectMenu
+                    multiple
+                    searchable
+                    searchable-placeholder="Suchen..."
+                    :options="tags"
+                    v-model="fileUploadFormData.tags"
+                />
+              </UFormGroup>
+              <!--<UFormGroup
+                  label="Ordner:"
+                  class="mt-3"
+              >
+                <USelectMenu
+                    :options="folders"
+                    v-model="fileUploadFormData.folder"
+                    value-attribute="label"
+
+                />
+              </UFormGroup>-->
+
+              <template #footer>
+                <UButton
+                    class="mt-3"
+                    @click="uploadFile"
+                >Hochladen</UButton>
+              </template>
+
+
+            </UCard>
+
+          </UModal>
+
+
+          <div class="documentList">
+            <DocumentDisplay
+                v-for="document in getDocumentsByProjectId(currentProject.id)"
+                :document="document"
+            />
+          </div>
+
+
+          Dokumente
+        </div>
         <div v-else-if="item.key === 'description'" class="space-y-3">
           <UButton
               :disabled="false/*newProjectDescription.time === currentProject.description.time*/"

spaces/pages/projects/index.vue

@@ -158,9 +158,14 @@ const {projects,customers} = storeToRefs(useDataStore())
 const {fetchProjects} = useDataStore()
 
 const projectColumns = [
+  {
+    key: 'measure',
+    label: "Gewerk",
+    sortable: true
+  },
   {
     key: 'name',
-    label: "Name.",
+    label: "Name",
     sortable: true
   },
   {