Many Changes

components/EntityShow.vue

@@ -1,6 +1,5 @@
 <script setup>
 import dayjs from "dayjs";
-import {useSupabaseSelectSomeDocuments} from "~/composables/useSupabase.js";
 
 const props = defineProps({
   type: {
@@ -36,14 +35,15 @@ const router = useRouter()
 const dataStore = useDataStore()
 const profileStore = useProfileStore()
 const supabase = useSupabaseClient()
+const files = useFiles()
 
 const dataType = dataStore.dataTypes[type]
 
-const documents = ref([])
+const availableFiles = ref([])
 
 const setup = async () => {
-  if(props.item.documents) {
-    documents.value = await useSupabaseSelectSomeDocuments(props.item.documents.map(i => i.id)) || []
+  if(props.item.files) {
+    availableFiles.value = await files.selectSomeDocuments(props.item.files.map(i => i.id)) || []
   }
 }
 
@@ -154,19 +154,6 @@ const getAvailableQueryStringData = () => {
       >{{item ? `${dataType.labelSingle}${props.item[dataType.templateColumns.find(i => i.title).key] ? ': ' + props.item[dataType.templateColumns.find(i => i.title).key] : ''}`: '' }}</h1>
     </template>
     <template #right>
-      <ButtonWithConfirm
-          color="rose"
-          variant="outline"
-          @confirmed="dataStore.updateItem(type,{...item, archived: true})"
-      >
-        <template #button>
-          Archivieren
-        </template>
-        <template #header>
-          <span class="text-md text-black font-bold">Archivieren bestätigen</span>
-        </template>
-        Möchten Sie das Fahrzeug {{item.name}} wirklich archivieren?
-      </ButtonWithConfirm>
       <UButton
           @click="router.push(`/standardEntity/${type}/edit/${item.id}`)"
       >
@@ -174,25 +161,22 @@ const getAvailableQueryStringData = () => {
       </UButton>
     </template>
   </UDashboardNavbar>
-  <UDashboardPanelContent>
-
-  </UDashboardPanelContent>
   <UTabs
       :items="dataType.showTabs"
       v-if="props.item.id"
       class="p-5"
       v-model="openTab"
   >
-    <template #item="{item}">
+    <template #item="{item:tab}">
       <div class="scroll">
-        <div v-if="item.label === 'Informationen'" class="flex flex-row mt-5">
+        <div v-if="tab.label === 'Informationen'" class="flex flex-row mt-5">
           <UCard class="w-1/2 mr-5">
             <UAlert
                 v-if="item.archived"
                 color="rose"
                 variant="outline"
                 :title="`${dataType.labelSingle} archiviert`"
-                icon="i-heroicons-light-bulb"
+                icon="i-heroicons-archive-box"
                 class="mb-5"
             />
             <div class="text-wrap">
@@ -225,7 +209,7 @@ const getAvailableQueryStringData = () => {
             />
           </UCard>
         </div>
-        <div v-else-if="item.label === 'Dokumente'">
+        <div v-else-if="tab.label === 'Dateien'">
           <UCard class="mt-5">
             <Toolbar>
               <DocumentUpload
@@ -235,11 +219,17 @@ const getAvailableQueryStringData = () => {
             </Toolbar>
 
             <DocumentList
-                :documents="documents"
+                :documents="availableFiles"
+                v-if="availableFiles.length > 0"
+            />
+            <UAlert
+              v-else
+              icon="i-heroicons-x-mark"
+              title="Keine Dateien verfügbar"
             />
           </UCard>
         </div>
-        <div v-else-if="item.label === 'Projekte'">
+        <div v-else-if="tab.label === 'Projekte'">
           <UCard class="mt-5">
             <Toolbar>
               <UButton
@@ -262,7 +252,7 @@ const getAvailableQueryStringData = () => {
 
           </UCard>
         </div>
-        <div v-else-if="item.label === 'Objekte'">
+        <div v-else-if="tab.label === 'Objekte'">
           <UCard class="mt-5">
             <Toolbar>
               <UButton
@@ -288,7 +278,7 @@ const getAvailableQueryStringData = () => {
             </UTable>
           </UCard>
         </div>
-        <div v-else-if="item.label === 'Aufgaben'">
+        <div v-else-if="tab.label === 'Aufgaben'">
           <UCard class="mt-5">
             <Toolbar>
               <UButton
@@ -305,7 +295,7 @@ const getAvailableQueryStringData = () => {
             />
           </UCard>
         </div>
-        <div v-else-if="item.label === 'Verträge'">
+        <div v-else-if="tab.label === 'Verträge'">
           <UCard class="mt-5">
             <Toolbar>
               <UButton
@@ -323,7 +313,7 @@ const getAvailableQueryStringData = () => {
             ></UTable>
           </UCard>
         </div>
-        <div v-else-if="item.label === 'Überprüfungen'">
+        <div v-else-if="tab.label === 'Überprüfungen'">
           <UCard class="mt-5">
             <UTable
                 :rows="props.item.checks"
@@ -341,7 +331,7 @@ const getAvailableQueryStringData = () => {
             </UTable>
           </UCard>
         </div>
-        <div v-else-if="item.label === 'Phasen'">
+        <div v-else-if="tab.label === 'Phasen'">
           <UCard class="mt-5">
             <UAccordion
                 :items="renderedPhases"
@@ -404,7 +394,8 @@ const getAvailableQueryStringData = () => {
               </template>
             </UAccordion>
           </UCard>
-        </div><div v-else-if="item.label === 'Ausgangsbelege'">
+        </div>
+        <div v-else-if="tab.label === 'Ausgangsbelege'">
           <UCard class="mt-5">
 
             <Toolbar>