diff --git a/spaces/components/DocumentDisplay.vue b/spaces/components/DocumentDisplay.vue
index a6e690f..9bed3b7 100644
--- a/spaces/components/DocumentDisplay.vue
+++ b/spaces/components/DocumentDisplay.vue
@@ -85,11 +85,44 @@ const createVendorInvoice = async () => {
 
 
 const archiveDocument = () => {
-  documentData.tags = ["Archiviert"]
+  documentData.tags.push("Archiviert")
   updateDocument()
 }
 
+const resourceOptions = ref([
+    {label: 'Projekt', value: 'project', optionAttr: "name"},
+  {label: 'Kunde', value: 'customer', optionAttr: "name"},
+  {label: 'Lieferant', value: 'vendor', optionAttr: "name"},
+  {label: 'Fahrzeug', value: 'vehicle', optionAttr: "licensePlate"},
+  {label: 'Objekt', value: 'plant', optionAttr: "name"},
+  {label: 'Produkt', value: 'product', optionAttr: "name"}
+])
+const resourceToAssign = ref("project")
+const itemOptions = ref([])
+const idToAssign = ref(null)
+const getItemsBySelectedResource = () => {
+  if(resourceToAssign.value === "project") {
+    itemOptions.value = dataStore.projects
+  } else if(resourceToAssign.value === "customer") {
+    itemOptions.value = dataStore.customers
+  } else if(resourceToAssign.value === "vendor") {
+    itemOptions.value = dataStore.vendors
+  } else if(resourceToAssign.value === "vehicle") {
+    itemOptions.value = dataStore.vehicles
+  } else if(resourceToAssign.value === "product") {
+    itemOptions.value = dataStore.products
+  } else if(resourceToAssign.value === "plant") {
+    itemOptions.value = dataStore.plants
+  } else {
+    itemOptions.value =  []
+  }
+}
+getItemsBySelectedResource()
 
+const updateDocumentAssignment = async () => {
+  documentData[resourceToAssign.value] = idToAssign.value
+  await updateDocument()
+}
 
 </script>
 
@@ -196,7 +229,36 @@ const archiveDocument = () => {
           </USelectMenu>
         </UFormGroup>
 
+        <p>Dokument zuweisen:</p>
         <UFormGroup
+          label="Resource auswählen"
+        >
+          <USelectMenu
+              :options="resourceOptions"
+              v-model="resourceToAssign"
+              value-attribute="value"
+              option-attribute="label"
+              @change="getItemsBySelectedResource"
+          >
+
+          </USelectMenu>
+        </UFormGroup>
+        <UFormGroup
+          label="Eintrag auswählen:"
+        >
+
+        </UFormGroup>
+
+        <USelectMenu
+          :options="itemOptions"
+          v-model="idToAssign"
+          :option-attribute="resourceOptions.find(i => i.value === resourceToAssign)? resourceOptions.find(i => i.value === resourceToAssign).optionAttr : 'name'"
+          value-attribute="id"
+          @change="updateDocumentAssignment"
+        ></USelectMenu>
+
+
+<!--        <UFormGroup
             label="Projekt zuweisen:"
         >
           <USelectMenu
@@ -230,7 +292,7 @@ const archiveDocument = () => {
               {{dataStore.customers.find(item => item.id === documentData.customer) ? dataStore.customers.find(item => item.id === documentData.customer).name : "Kein Kunde ausgewählt" }}
             </template>
           </USelectMenu>
-        </UFormGroup>
+        </UFormGroup>-->
 
 
       </template>
diff --git a/spaces/composables/usePDFGenerator.js b/spaces/composables/usePDFGenerator.js
index a3b5b1e..e526428 100644
--- a/spaces/composables/usePDFGenerator.js
+++ b/spaces/composables/usePDFGenerator.js
@@ -1,26 +1,6 @@
 import {PDFDocument, StandardFonts, rgb} from "pdf-lib"
 
-let headerData = {
-    sender: "Federspiel Technology UG haftungsbeschränkt, Am Schwarzen Brack 14 26452 Sande",
-    recipient: {
-        name: "NOA Service GmbH",
-        contact: "Lena Kramer",
-        special: "Hinterm Haus",
-        address: "Oldenburger Str. 52",
-        city: "26340 Zetel"
-    },
-    info: {
-        invoiceNumber: "RE23-1409",
-        customerNumber: "10069",
-        invoiceDate: "15.09.2023",
-        dateOfPerformance: "31.08.2023",
-        contactPerson: "Florian Federspiel",
-        tel: "015755769509",
-        email: "f.federspiel@federspiel.tech"
-    },
-    title: "Rechnung-Nr. RE23-1409",
-    description: "BV: Stubbendränk 23, 26340 Zetel"
-}
+
 
 const getCoordinatesForPDFLib = (x ,y, page) => {
     /*
@@ -45,7 +25,7 @@ const getCoordinatesForPDFLib = (x ,y, page) => {
 
 
 
-export const useCreatePdf = async (invoiceData) => {
+export const useCreatePdf = async (invoiceData,backgroundSourceBuffer) => {
 
     const uri = ref("test")
     const genPDF = async () => {
@@ -57,11 +37,13 @@ export const useCreatePdf = async (invoiceData) => {
         let pages = []
         let pageCounter = 1
 
-        const backgroundPdfSourceBuffer = await fetch("/Briefpapier.pdf").then((res) => res.arrayBuffer())
-        const backgroudPdf = await PDFDocument.load(backgroundPdfSourceBuffer)
+
+
+        //const backgroundPdfSourceBuffer = await fetch("/Briefpapier.pdf").then((res) => res.arrayBuffer())
+        const backgroudPdf = await PDFDocument.load(backgroundSourceBuffer)
 
         const firstPageBackground = await pdfDoc.embedPage(backgroudPdf.getPages()[0])
-        const secondPageBackground = await pdfDoc.embedPage(backgroudPdf.getPages()[1])
+        const secondPageBackground = await pdfDoc.embedPage(backgroudPdf.getPages()[backgroudPdf.getPages().length > 1 ? 1 : 0])
 
         //console.log("TEST")
         const page1 = pdfDoc.addPage()
@@ -142,40 +124,124 @@ export const useCreatePdf = async (invoiceData) => {
             opacity: 1,
             maxWidth: 240
         })
-        pages[pageCounter - 1].drawText(invoiceData.recipient.contact, {
-            ...getCoordinatesForPDFLib(21,60, page1),
-            size:10,
-            color:rgb(0,0,0),
-            lineHeight:10,
-            opacity: 1,
-            maxWidth: 240
-        })
-        pages[pageCounter - 1].drawText(invoiceData.recipient.special, {
-            ...getCoordinatesForPDFLib(21,65, page1),
-            size:10,
-            color:rgb(0,0,0),
-            lineHeight:10,
-            opacity: 1,
-            maxWidth: 240
-        })
+
+        if(invoiceData.recipient.contact && !invoiceData.recipient.special) {
+            pages[pageCounter - 1].drawText(invoiceData.recipient.contact, {
+                ...getCoordinatesForPDFLib(21,60, page1),
+                size:10,
+                color:rgb(0,0,0),
+                lineHeight:10,
+                opacity: 1,
+                maxWidth: 240
+            })
+            pages[pageCounter - 1].drawText(invoiceData.recipient.street, {
+                ...getCoordinatesForPDFLib(21,65, page1),
+                size:10,
+                color:rgb(0,0,0),
+                lineHeight:10,
+                opacity: 1,
+                maxWidth: 240
+            })
+            pages[pageCounter - 1].drawText(`${invoiceData.recipient.zip} ${invoiceData.recipient.city}`, {
+                ...getCoordinatesForPDFLib(21,70, page1),
+                size:10,
+                color:rgb(0,0,0),
+                lineHeight:10,
+                opacity: 1,
+                maxWidth: 240
+            })
+        } else if(invoiceData.recipient.contact && invoiceData.recipient.special) {
+            pages[pageCounter - 1].drawText(invoiceData.recipient.contact, {
+                ...getCoordinatesForPDFLib(21,60, page1),
+                size:10,
+                color:rgb(0,0,0),
+                lineHeight:10,
+                opacity: 1,
+                maxWidth: 240
+            })
+            pages[pageCounter - 1].drawText(invoiceData.recipient.special, {
+                ...getCoordinatesForPDFLib(21,65, page1),
+                size:10,
+                color:rgb(0,0,0),
+                lineHeight:10,
+                opacity: 1,
+                maxWidth: 240
+            })
+
+
+            pages[pageCounter - 1].drawText(invoiceData.recipient.street, {
+                ...getCoordinatesForPDFLib(21,70, page1),
+                size:10,
+                color:rgb(0,0,0),
+                lineHeight:10,
+                opacity: 1,
+                maxWidth: 240
+            })
+            pages[pageCounter - 1].drawText(`${invoiceData.recipient.zip} ${invoiceData.recipient.city}`, {
+                ...getCoordinatesForPDFLib(21,75, page1),
+                size:10,
+                color:rgb(0,0,0),
+                lineHeight:10,
+                opacity: 1,
+                maxWidth: 240
+            })
+        } else if(!invoiceData.recipient.contact && !invoiceData.recipient.special) {
+
+            pages[pageCounter - 1].drawText(invoiceData.recipient.street, {
+                ...getCoordinatesForPDFLib(21,60, page1),
+                size:10,
+                color:rgb(0,0,0),
+                lineHeight:10,
+                opacity: 1,
+                maxWidth: 240
+            })
+            pages[pageCounter - 1].drawText(`${invoiceData.recipient.zip} ${invoiceData.recipient.city}`, {
+                ...getCoordinatesForPDFLib(21,65, page1),
+                size:10,
+                color:rgb(0,0,0),
+                lineHeight:10,
+                opacity: 1,
+                maxWidth: 240
+            })
+        } else {
+            pages[pageCounter - 1].drawText(invoiceData.recipient.contact, {
+                ...getCoordinatesForPDFLib(21,60, page1),
+                size:10,
+                color:rgb(0,0,0),
+                lineHeight:10,
+                opacity: 1,
+                maxWidth: 240
+            })
+            pages[pageCounter - 1].drawText(invoiceData.recipient.special, {
+                ...getCoordinatesForPDFLib(21,65, page1),
+                size:10,
+                color:rgb(0,0,0),
+                lineHeight:10,
+                opacity: 1,
+                maxWidth: 240
+            })
+
+
+            pages[pageCounter - 1].drawText(invoiceData.recipient.street, {
+                ...getCoordinatesForPDFLib(21,70, page1),
+                size:10,
+                color:rgb(0,0,0),
+                lineHeight:10,
+                opacity: 1,
+                maxWidth: 240
+            })
+            pages[pageCounter - 1].drawText(`${invoiceData.recipient.zip} ${invoiceData.recipient.city}`, {
+                ...getCoordinatesForPDFLib(21,75, page1),
+                size:10,
+                color:rgb(0,0,0),
+                lineHeight:10,
+                opacity: 1,
+                maxWidth: 240
+            })
+        }
+
 
 
-        pages[pageCounter - 1].drawText(invoiceData.recipient.street, {
-            ...getCoordinatesForPDFLib(21,70, page1),
-            size:10,
-            color:rgb(0,0,0),
-            lineHeight:10,
-            opacity: 1,
-            maxWidth: 240
-        })
-        pages[pageCounter - 1].drawText(`${invoiceData.recipient.zip} ${invoiceData.recipient.city}`, {
-            ...getCoordinatesForPDFLib(21,75, page1),
-            size:10,
-            color:rgb(0,0,0),
-            lineHeight:10,
-            opacity: 1,
-            maxWidth: 240
-        })
 
 
 
@@ -198,7 +264,7 @@ export const useCreatePdf = async (invoiceData) => {
             opacity: 1
         })*/
 
-        pages[pageCounter - 1].drawText("Rechnungsnummer", {
+        pages[pageCounter - 1].drawText(invoiceData.info.documentNumberTitle, {
             ...getCoordinatesForPDFLib(126,55, page1),
             size:10,
             color:rgb(0,0,0),
@@ -207,9 +273,9 @@ export const useCreatePdf = async (invoiceData) => {
             maxWidth: 240
         })
 
-        pages[pageCounter - 1].drawText(invoiceData.info.documentNumber, {
+        pages[pageCounter - 1].drawText(invoiceData.info.documentNumber ? invoiceData.info.documentNumber : "XXXX", {
             y: getCoordinatesForPDFLib(126,55, page1).y,
-            x: getCoordinatesForPDFLib(126,55,page1).x + 210 - font.widthOfTextAtSize(headerData.info.invoiceNumber,10),
+            x: getCoordinatesForPDFLib(126,55,page1).x + 210 - font.widthOfTextAtSize(invoiceData.info.documentNumber ? invoiceData.info.documentNumber : "XXXX",10),
             size:10,
             color:rgb(0,0,0),
             lineHeight:10,
@@ -227,7 +293,7 @@ export const useCreatePdf = async (invoiceData) => {
 
         pages[pageCounter - 1].drawText(invoiceData.info.customerNumber, {
             y: getCoordinatesForPDFLib(126,60, page1).y,
-            x: getCoordinatesForPDFLib(126,60,page1).x + 210 - font.widthOfTextAtSize(headerData.info.customerNumber,10),
+            x: getCoordinatesForPDFLib(126,60,page1).x + 210 - font.widthOfTextAtSize(invoiceData.info.customerNumber,10),
             size:10,
             color:rgb(0,0,0),
             lineHeight:10,
@@ -246,15 +312,7 @@ export const useCreatePdf = async (invoiceData) => {
 
         pages[pageCounter - 1].drawText(invoiceData.info.documentDate, {
             y: getCoordinatesForPDFLib(126,65, page1).y,
-            x: getCoordinatesForPDFLib(126,65,page1).x + 210 - font.widthOfTextAtSize(headerData.info.invoiceDate,10),
-            size:10,
-            color:rgb(0,0,0),
-            lineHeight:10,
-            opacity: 1,
-            maxWidth: 240
-        })
-        pages[pageCounter - 1].drawText("Lieferdatum", {
-            ...getCoordinatesForPDFLib(126,70, page1),
+            x: getCoordinatesForPDFLib(126,65,page1).x + 210 - font.widthOfTextAtSize(invoiceData.info.documentDate,10),
             size:10,
             color:rgb(0,0,0),
             lineHeight:10,
@@ -262,15 +320,28 @@ export const useCreatePdf = async (invoiceData) => {
             maxWidth: 240
         })
 
-        pages[pageCounter - 1].drawText(invoiceData.info.deliveryDate, {
-            y: getCoordinatesForPDFLib(126,70, page1).y,
-            x: getCoordinatesForPDFLib(126,70,page1).x + 210 - font.widthOfTextAtSize(invoiceData.info.deliveryDate,10),
-            size:10,
-            color:rgb(0,0,0),
-            lineHeight:10,
-            opacity: 1,
-            maxWidth: 240
-        })
+        if(invoiceData.info.deliveryDateType !== "Kein Lieferdatum anzeigen") {
+            pages[pageCounter - 1].drawText(invoiceData.info.deliveryDateType, {
+                ...getCoordinatesForPDFLib(126,70, page1),
+                size:10,
+                color:rgb(0,0,0),
+                lineHeight:10,
+                opacity: 1,
+                maxWidth: 240
+            })
+
+            pages[pageCounter - 1].drawText(invoiceData.info.deliveryDate, {
+                y: getCoordinatesForPDFLib(126,70, page1).y,
+                x: getCoordinatesForPDFLib(126,70,page1).x + 210 - font.widthOfTextAtSize(invoiceData.info.deliveryDate,10),
+                size:10,
+                color:rgb(0,0,0),
+                lineHeight:10,
+                opacity: 1,
+                maxWidth: 240
+            })
+        }
+
+
 
         pages[pageCounter - 1].drawText("Ansprechpartner", {
             ...getCoordinatesForPDFLib(126,75, page1),
@@ -291,43 +362,86 @@ export const useCreatePdf = async (invoiceData) => {
             maxWidth: 240
         })
 
-        pages[pageCounter - 1].drawText("Telefon", {
-            ...getCoordinatesForPDFLib(126,80, page1),
-            size:10,
-            color:rgb(0,0,0),
-            lineHeight:10,
-            opacity: 1,
-            maxWidth: 240
-        })
+        if(invoiceData.info.contactTel && invoiceData.info.contactEMail) {
+            pages[pageCounter - 1].drawText("Telefon", {
+                ...getCoordinatesForPDFLib(126,80, page1),
+                size:10,
+                color:rgb(0,0,0),
+                lineHeight:10,
+                opacity: 1,
+                maxWidth: 240
+            })
+
+            pages[pageCounter - 1].drawText(invoiceData.info.contactTel, {
+                y: getCoordinatesForPDFLib(126,80, page1).y,
+                x: getCoordinatesForPDFLib(126,80,page1).x + 210 - font.widthOfTextAtSize(invoiceData.info.contactTel,10),
+                size:10,
+                color:rgb(0,0,0),
+                lineHeight:10,
+                opacity: 1,
+                maxWidth: 240
+            })
+
+            pages[pageCounter - 1].drawText("E-Mail", {
+                ...getCoordinatesForPDFLib(126,85, page1),
+                size:10,
+                color:rgb(0,0,0),
+                lineHeight:10,
+                opacity: 1,
+                maxWidth: 240
+            })
+
+            pages[pageCounter - 1].drawText(invoiceData.info.contactEMail, {
+                y: getCoordinatesForPDFLib(126,85, page1).y,
+                x: getCoordinatesForPDFLib(126,85,page1).x + 210 - font.widthOfTextAtSize(invoiceData.info.contactEMail,10),
+                size:10,
+                color:rgb(0,0,0),
+                lineHeight:10,
+                opacity: 1,
+                maxWidth: 240
+            })
+        } else if(invoiceData.info.contactTel && !invoiceData.info.contactEMail) {
+            pages[pageCounter - 1].drawText("Telefon", {
+                ...getCoordinatesForPDFLib(126,80, page1),
+                size:10,
+                color:rgb(0,0,0),
+                lineHeight:10,
+                opacity: 1,
+                maxWidth: 240
+            })
+
+            pages[pageCounter - 1].drawText(invoiceData.info.contactTel, {
+                y: getCoordinatesForPDFLib(126,80, page1).y,
+                x: getCoordinatesForPDFLib(126,80,page1).x + 210 - font.widthOfTextAtSize(invoiceData.info.contactTel,10),
+                size:10,
+                color:rgb(0,0,0),
+                lineHeight:10,
+                opacity: 1,
+                maxWidth: 240
+            })
+        } else if(!invoiceData.info.contactTel && invoiceData.info.contactEMail) {
+            pages[pageCounter - 1].drawText("E-Mail", {
+                ...getCoordinatesForPDFLib(126,80, page1),
+                size:10,
+                color:rgb(0,0,0),
+                lineHeight:10,
+                opacity: 1,
+                maxWidth: 240
+            })
+
+            pages[pageCounter - 1].drawText(invoiceData.info.contactEMail, {
+                y: getCoordinatesForPDFLib(126,80, page1).y,
+                x: getCoordinatesForPDFLib(126,80,page1).x + 210 - font.widthOfTextAtSize(invoiceData.info.contactEMail,10),
+                size:10,
+                color:rgb(0,0,0),
+                lineHeight:10,
+                opacity: 1,
+                maxWidth: 240
+            })
+        }
 
-        pages[pageCounter - 1].drawText(invoiceData.info.contactTel, {
-            y: getCoordinatesForPDFLib(126,80, page1).y,
-            x: getCoordinatesForPDFLib(126,80,page1).x + 210 - font.widthOfTextAtSize(invoiceData.info.contactTel,10),
-            size:10,
-            color:rgb(0,0,0),
-            lineHeight:10,
-            opacity: 1,
-            maxWidth: 240
-        })
 
-        pages[pageCounter - 1].drawText("E-Mail", {
-            ...getCoordinatesForPDFLib(126,85, page1),
-            size:10,
-            color:rgb(0,0,0),
-            lineHeight:10,
-            opacity: 1,
-            maxWidth: 240
-        })
 
-        pages[pageCounter - 1].drawText(invoiceData.info.contactEMail, {
-            y: getCoordinatesForPDFLib(126,85, page1).y,
-            x: getCoordinatesForPDFLib(126,85,page1).x + 210 - font.widthOfTextAtSize(invoiceData.info.contactEMail,10),
-            size:10,
-            color:rgb(0,0,0),
-            lineHeight:10,
-            opacity: 1,
-            maxWidth: 240
-        })
         /*pages[pageCounter - 1].drawText("Projekt:", {
             ...getCoordinatesForPDFLib(126,90, page1),
             size:10,
@@ -382,14 +496,17 @@ export const useCreatePdf = async (invoiceData) => {
             opacity: 1
         })*/
 
-        pages[pageCounter - 1].drawText(invoiceData.description, {
-            ...getCoordinatesForPDFLib(20,112, page1),
-            size:13,
-            color:rgb(0,0,0),
-            lineHeight:15,
-            opacity: 1,
-            maxWidth: 500
-        })
+        if(invoiceData.description) {
+            pages[pageCounter - 1].drawText(invoiceData.description, {
+                ...getCoordinatesForPDFLib(20,112, page1),
+                size:13,
+                color:rgb(0,0,0),
+                lineHeight:15,
+                opacity: 1,
+                maxWidth: 500
+            })
+        }
+
 
         pages[pageCounter - 1].drawText(invoiceData.startText,{
             ...getCoordinatesForPDFLib(20,119, page1),
diff --git a/spaces/layouts/default.vue b/spaces/layouts/default.vue
index 9d854aa..89b2f07 100644
--- a/spaces/layouts/default.vue
+++ b/spaces/layouts/default.vue
@@ -303,7 +303,11 @@ const links = [[{
     label: "Inventar",
     to: "/inventoryitems",
     icon: "i-heroicons-puzzle-piece"
-  },]
+  },],[{
+  label: "Einstellungen",
+  to:"/settings",
+  icon: "i-heroicons-cog-8-tooth"
+}]
 ]
 
 </script>
@@ -441,6 +445,13 @@ const links = [[{
           />
         </template>
       </UVerticalNavigation>
+<!--      <UButton
+          :icon="!isLight ? 'i-heroicons-moon-20-solid' : 'i-heroicons-sun-20-solid'"
+          color="white"
+          variant="outline"
+          aria-label="Theme"
+          @click="isLight = !isLight"
+      />-->
     </div>
 
     <div class="m-3" id="contentContainer">
@@ -476,13 +487,13 @@ const links = [[{
 #contentContainer {
   width: 77vw;
   height: 95vh;
-}
-/*  -ms-overflow-style: none;  !* IE and Edge *!
-  scrollbar-width: none;  !* Firefox *!
+  overflow-y: scroll;
+  -ms-overflow-style: none;  /* IE and Edge */
+  scrollbar-width: none;  /* Firefox */
 }
 
 #contentContainer::-webkit-scrollbar {
   display: none;
-}*/
+}
 
 </style>
\ No newline at end of file
diff --git a/spaces/package.json b/spaces/package.json
index f59c861..5b7c45e 100644
--- a/spaces/package.json
+++ b/spaces/package.json
@@ -48,6 +48,7 @@
     "buffer": "^6.0.3",
     "client-oauth2": "^4.3.3",
     "dayjs": "^1.11.10",
+    "handlebars": "^4.7.8",
     "jsprintmanager": "^6.0.3",
     "nuxt-editorjs": "^1.0.4",
     "nuxt-viewport": "^2.0.6",
diff --git a/spaces/pages/banking/index.vue b/spaces/pages/banking/index.vue
index 4178ef9..ea370fc 100644
--- a/spaces/pages/banking/index.vue
+++ b/spaces/pages/banking/index.vue
@@ -10,7 +10,13 @@
           placeholder="Suche..."
       />
     </InputGroup>-->
-
+    <Toolbar>
+      <UButton
+        @click="router.push('/banking/newAccount')"
+      >
+        + Konto
+      </UButton>
+    </Toolbar>
 
 
     <UTable
diff --git a/spaces/pages/banking/newAccount/index.vue b/spaces/pages/banking/newAccount/index.vue
new file mode 100644
index 0000000..bde16f2
--- /dev/null
+++ b/spaces/pages/banking/newAccount/index.vue
@@ -0,0 +1,25 @@
+<script setup>
+import Axios from "axios"
+
+
+const newAccounts = ref([])
+
+const setupPage = async () => {
+
+}
+
+
+</script>
+
+<template>
+    New
+  <UButton
+    @click="setupPage"
+  >
+    Setup
+  </UButton>
+</template>
+
+<style scoped>
+
+</style>
\ No newline at end of file
diff --git a/spaces/pages/contracts/[mode]/[[id]].vue b/spaces/pages/contracts/[mode]/[[id]].vue
index 08ca69a..30b239f 100644
--- a/spaces/pages/contracts/[mode]/[[id]].vue
+++ b/spaces/pages/contracts/[mode]/[[id]].vue
@@ -62,11 +62,11 @@ setupPage()
 
 <template>
   <h1
-      class="text-center my-3 font-bold text-2xl"
+      class="mb-3 truncate font-bold text-2xl"
       v-if="currentItem"
-  >{{currentItem.name}}</h1>
+  >Vertrag: {{currentItem.name}}</h1>
   <UTabs
-      v-if="currentItem && mode == 'show'"
+      v-if="currentItem && mode === 'show'"
       :items="[{label: 'Informationen'}, {label: 'Logbuch'}, {label: 'Dokumente'}]"
   >
     <template #item="{item}">
@@ -74,7 +74,7 @@ setupPage()
         <div v-if="item.label === 'Informationen'">
           <Toolbar>
             <UButton
-                v-if="mode == 'show' && currentItem.id"
+                v-if="mode === 'show' && currentItem.id"
                 @click="editCustomer"
             >
               Bearbeiten
diff --git a/spaces/pages/createDocument/edit/[[id]].vue b/spaces/pages/createDocument/edit/[[id]].vue
index 4761b1f..948f510 100644
--- a/spaces/pages/createDocument/edit/[[id]].vue
+++ b/spaces/pages/createDocument/edit/[[id]].vue
@@ -1,23 +1,17 @@
 <script setup>
 import dayjs from "dayjs"
+import Handlebars from "handlebars"
+
 const dataStore = useDataStore()
 const user = useSupabaseUser()
 const route = useRoute()
 const router = useRouter()
 const supabase = useSupabaseClient()
-import {decode} from 'base64-arraybuffer'
 
 
 
 
-const tabItems = [
-  {
-    label: "Editor"
-  },
-  {
-    label: "Vorschau"
-  }
-]
+
 
 const itemInfo = ref({
   type: "invoices",
@@ -31,8 +25,10 @@ const itemInfo = ref({
   },
   project: null,
   documentNumber: null,
-  documentDate: null,
-  deliveryDate: null,
+  documentNumberTitle: "Rechnungsnummer",
+  documentDate: dayjs(),
+  deliveryDate: dayjs(),
+  deliveryDateType: "Lieferdatum",
   dateOfPerformance: null,
   createdBy: user.value.id,
   title: null,
@@ -41,6 +37,22 @@ const itemInfo = ref({
   endText: null,
   rows: [
 
+  ],
+  contactPerson: null,
+  contactPersonName: null,
+  contactTel: null,
+  contactEMail: null,
+})
+
+const tabItems = computed(() => {
+  return [
+    {
+      label: "Editor"
+    },
+    {
+      label: "Vorschau",
+      disabled: !itemInfo.value.customer && !itemInfo.value.contact
+    }
   ]
 })
 
@@ -51,11 +63,52 @@ const setupPage = () => {
 
   if(route.query) {
     if(route.query.type) itemInfo.value.type = route.query.type
+
+    if(itemInfo.value.type === "invoices") {
+      itemInfo.value.documentNumberTitle = "Rechnungsnummer"
+      itemInfo.value.title = `Rechnung-Nr. ${itemInfo.value.documentNumber ? itemInfo.value.documentNumber : "XXXX"}`
+    } else if(itemInfo.value.type === "quotes") {
+      itemInfo.value.documentNumberTitle = "Angebotsnummer"
+      itemInfo.value.title = `Angebot-Nr. ${itemInfo.value.documentNumber ? itemInfo.value.documentNumber : "XXXX"}`
+    } else if(itemInfo.value.type === "deliveryNotes") {
+      itemInfo.value.documentNumberTitle = "Lieferscheinnummer"
+      itemInfo.value.title = `Lieferschein-Nr. ${itemInfo.value.documentNumber ? itemInfo.value.documentNumber : "XXXX"}`
+    }
+
+    itemInfo.value.startText = dataStore.getTextTemplatesByDocumentType(itemInfo.value.type).find(i => i.default && i.pos === "startText").text
+    itemInfo.value.endText = dataStore.getTextTemplatesByDocumentType(itemInfo.value.type).find(i => i.default && i.pos === "endText").text
+
+    setContactPersonData()
+
+
     if(route.query.project) itemInfo.value.project = Number(route.query.project)
+    if(route.query.contact) itemInfo.value.contact = Number(route.query.contact)
     if(route.query.customer) itemInfo.value.customer = Number(route.query.customer)
   }
 }
 
+const setCustomerData = () => {
+  let customer = dataStore.getCustomerById(itemInfo.value.customer)
+  itemInfo.value.contact = null
+  if(customer) {
+    itemInfo.value.address.street = customer.infoData.street
+    itemInfo.value.address.zip = customer.infoData.zip
+    itemInfo.value.address.city = customer.infoData.city
+    itemInfo.value.address.special = customer.infoData.special
+  }
+}
+
+const setContactPersonData = () => {
+  if(!itemInfo.value.contactPerson) itemInfo.value.contactPerson = user.value.id
+
+  let profile = dataStore.getProfileById(itemInfo.value.contactPerson)
+
+  itemInfo.value.contactPersonName = profile.fullName
+  itemInfo.value.contactTel = profile.mobileTel || profile.fixedTel || ""
+  itemInfo.value.contactEMail = profile.email
+
+}
+
 
 
 const getRowAmount = (row) => {
@@ -122,11 +175,13 @@ const documentTotal = computed(() => {
 
   itemInfo.value.rows.forEach(row => {
     if(row.mode === 'free' || row.mode === 'normal'){
-      let rowPrice = Number(Number(row.quantity) * Number(row.price)).toFixed(2)
-      totalNet += Number(rowPrice)
+      console.log(row)
+      let rowPrice = Number(Number(row.quantity) * Number(row.price) * (1 - Number(row.discountPercent) /100) ).toFixed(2)
+      console.log(rowPrice)
+      totalNet = totalNet + Number(rowPrice)
 
       if(row.taxPercent === 19) {
-        total19 += Number(rowPrice * 0.19)
+        total19 = total19 + Number(rowPrice * 0.19)
       }
     }
   })
@@ -170,18 +225,21 @@ const getDocumentData = () => {
     } else {
       return row
     }
-
-
-
-
-
   })
 
+  //Compile Start & EndText
+  const templateStartText = Handlebars.compile(itemInfo.value.startText);
+  const templateEndText = Handlebars.compile(itemInfo.value.endText);
+  console.log(templateStartText({vorname: contactData.firstName, nachname: contactData.lastName}))
+  console.log(templateEndText({zahlungsziel_in_tagen: 14}))
+
+
+
   const returnData = {
 
     recipient: {
       name: customerData.name,
-      contact: `${contactData.firstName} ${contactData.lastName}`,
+      contact: contactData ? `${contactData.firstName} ${contactData.lastName}` : "",
       street: customerData.infoData.street,
       special: "",
       city: customerData.infoData.city,
@@ -190,17 +248,19 @@ const getDocumentData = () => {
     info: {
       customerNumber: customerData.customerNumber,
       documentNumber: itemInfo.value.documentNumber,
+      documentNumberTitle: itemInfo.value.documentNumberTitle,
       documentDate: dayjs(itemInfo.value.documentDate, 'DD.MM.YYYY').format("DD.MM.YYYY"),
       deliveryDate: dayjs(itemInfo.value.deliveryDate, 'DD.MM.YYYY').format("DD.MM.YYYY"),
-      contactPerson: userData.fullName ||"",
-      contactTel: userData.mobileTel ||"",
-      contactEMail: userData.email,
-      project: dataStore.getProjectById(itemInfo.value.project).name
+      deliveryDateType: itemInfo.value.deliveryDateType,
+      contactPerson: itemInfo.value.contactPersonName,
+      contactTel: itemInfo.value.contactTel,
+      contactEMail: itemInfo.value.contactEMail,
+      project: dataStore.getProjectById(itemInfo.value.project) ? dataStore.getProjectById(itemInfo.value.project).name : null
     },
     title: itemInfo.value.title,
     description: itemInfo.value.description,
-    endText: itemInfo.value.endText,
-    startText: itemInfo.value.startText,
+    endText: templateEndText({zahlungsziel_in_tagen: 14}),
+    startText: templateStartText({vorname: contactData.firstName, nachname: contactData.lastName}),
     rows: rows,
     total: documentTotal.value
   }
@@ -214,7 +274,16 @@ const getDocumentData = () => {
 const showDocument = ref(false)
 const uri = ref("")
 const generateDocument = async () => {
-  uri.value = await useCreatePdf(getDocumentData())
+  const ownTenant = dataStore.ownTenant
+  const path = ownTenant.letterheadConfig[itemInfo.value.type]
+  console.log(path)
+  console.log(ownTenant)
+
+  const {data,error} = await supabase.storage.from("files").download(path)
+  console.log(data)
+  console.log(error)
+
+  uri.value = await useCreatePdf(getDocumentData(), await data.arrayBuffer())
   //alert(uri.value)
   showDocument.value = true
 }
@@ -316,7 +385,6 @@ const closeDocument = async () => {
   //console.log(uri)
 }
 
-
 setupPage()
 </script>
 
@@ -365,11 +433,19 @@ setupPage()
                       searchable
                       searchable-placeholder="Suche..."
                       v-model="itemInfo.customer"
-
+                      @change="setCustomerData"
                   >
-                    <template #label>
+                    <UButton
+                        :color="itemInfo.customer ? 'primary' : 'rose'"
+                        variant="outline"
+                        class="flex-1 justify-between">
                       {{dataStore.getCustomerById(itemInfo.customer) ? dataStore.getCustomerById(itemInfo.customer).name : "Kein Kunde ausgewählt"}}
-                    </template>
+
+                      <UIcon name="i-heroicons-chevron-right-20-solid" class="w-5 h-5 transition-transform text-gray-400 dark:text-gray-500" :class="['transform rotate-90']" />
+                    </UButton>
+<!--                    <template #label>
+                      {{dataStore.getCustomerById(itemInfo.customer) ? dataStore.getCustomerById(itemInfo.customer).name : "Kein Kunde ausgewählt"}}
+                    </template>-->
                   </USelectMenu>
                 </UFormGroup>
                 <UFormGroup
@@ -384,6 +460,14 @@ setupPage()
                       searchable-placeholder="Suche..."
                       v-model="itemInfo.contact"
                   >
+                    <UButton
+                        :color="itemInfo.contact ? 'primary' : 'rose'"
+                        variant="outline"
+                        class="flex-1 justify-between">
+                      {{dataStore.getContactById(itemInfo.contact) ? dataStore.getContactById(itemInfo.contact).fullName : "Kein Kontakt ausgewählt"}}
+
+                      <UIcon name="i-heroicons-chevron-right-20-solid" class="w-5 h-5 transition-transform text-gray-400 dark:text-gray-500" :class="['transform rotate-90']" />
+                    </UButton>
                     <template #label>
                       {{dataStore.getContactById(itemInfo.contact) ? dataStore.getContactById(itemInfo.contact).fullName : "Kein Kontakt ausgewählt"}}
                     </template>
@@ -422,52 +506,78 @@ setupPage()
               </div>
               <div class="flex-auto">
                 <UFormGroup
-                    label="Rechnungsnummer:"
+                    :label="itemInfo.documentNumberTitle + ':'"
                 >
                   <UInput
                       v-model="itemInfo.documentNumber"
-                      placeholder="Leer lassen für automatisch generierte Nummer"
+                      placeholder="XXXX"
+                      disabled
                   />
                 </UFormGroup>
+
+
                 <UFormGroup
                     label="Datum:"
                 >
-                  <UInput
-                      v-model="itemInfo.documentDate"
-                  />
+                  <UPopover :popper="{ placement: 'bottom-start' }">
+                    <UButton
+                        icon="i-heroicons-calendar-days-20-solid"
+                        :label="itemInfo.documentDate ? dayjs(itemInfo.documentDate).format('DD.MM.YYYY') : 'Datum auswählen'"
+                        variant="outline"
+                    />
+
+                    <template #panel="{ close }">
+                      <LazyDatePicker v-model="itemInfo.documentDate" @close="close" />
+                    </template>
+                  </UPopover>
                 </UFormGroup>
+
+
+
+
                 <UFormGroup
-                    label="Lieferdatum:"
+                    class="mt-3"
                 >
-                  <UInput
-                      v-model="itemInfo.deliveryDate"
+                  <USelectMenu
+                    :options="['Lieferdatum'/*,'Lieferzeitraum'*/,'Leistungsdatum'/*,'Leistungszeitraum'*/,'Kein Lieferdatum anzeigen']"
+                    v-model="itemInfo.deliveryDateType"
+                    class="mb-2"
                   />
+                  <UPopover :popper="{ placement: 'bottom-start' }">
+                    <UButton
+                        icon="i-heroicons-calendar-days-20-solid"
+                        :label="itemInfo.deliveryDate ? dayjs(itemInfo.deliveryDate).format('DD.MM.YYYY') : 'Datum auswählen'"
+                        variant="outline"
+                    />
+
+                    <template #panel="{ close }">
+                      <LazyDatePicker v-model="itemInfo.deliveryDate" @close="close" />
+                    </template>
+                  </UPopover>
                 </UFormGroup>
                 <UFormGroup
                     label="Ansprechpartner:"
                 >
-                  <UInput
-
+                  <USelectMenu
+                    :options="dataStore.profiles"
+                    v-model="itemInfo.contactPerson"
+                    option-attribute="fullName"
+                    value-attribute="id"
+                    @change="setContactPersonData"
                   />
                 </UFormGroup>
                 <UFormGroup
                     label="Kontakt Telefon:"
                 >
                   <UInput
-
+                    v-model="itemInfo.contactTel"
                   />
                 </UFormGroup>
                 <UFormGroup
                     label="Kontakt E-Mail:"
                 >
                   <UInput
-
-                  />
-                </UFormGroup><UFormGroup
-                    label="Kontakt E-Mail:"
-                >
-                  <UInput
-
+                      v-model="itemInfo.contactEMail"
                   />
                 </UFormGroup>
                 <UFormGroup
@@ -514,14 +624,35 @@ setupPage()
                 class="my-3"
             />
 
+            <UFormGroup
+              label="Vorlage auswählen"
+            >
+              <USelectMenu
+                  :options="dataStore.getTextTemplatesByDocumentType(itemInfo.type)"
+                  v-model="itemInfo.startText"
+                  option-attribute="text"
+                  value-attribute="text"
+              >
+                <template #option="{option}">
+                  {{option.name}} - {{option.text}}
+                </template>
+                <template #label>
+                  {{dataStore.texttemplates.find(i => i.text === itemInfo.startText) ? dataStore.texttemplates.find(i => i.text === itemInfo.startText).name : "Keine Vorlage ausgewählt oder Vorlage verändert"}}
+                </template>
+              </USelectMenu>
+            </UFormGroup>
+
+
             <UFormGroup
                 label="Einleitung:"
             >
               <UTextarea
                 v-model="itemInfo.startText"
+                :rows="6"
               />
             </UFormGroup>
 
+
             <UDivider
                 class="my-3"
             />
@@ -673,7 +804,7 @@ setupPage()
                     <td
                         v-if="row.mode === 'free' || row.mode === 'normal'"
                     >
-                      <div class="text-right font-bold">{{getRowAmount(row)}} €</div>
+                      <p class="text-right font-bold whitespace-nowrap">{{getRowAmount(row)}} €</p>
                     </td>
                     <td>
                       <UButton
@@ -880,11 +1011,30 @@ setupPage()
                 class="my-3"
             />
 
+            <UFormGroup
+                label="Vorlage auswählen"
+            >
+              <USelectMenu
+                  :options="dataStore.getTextTemplatesByDocumentType(itemInfo.type)"
+                  v-model="itemInfo.endText"
+                  option-attribute="text"
+                  value-attribute="text"
+              >
+                <template #option="{option}">
+                  {{option.name}} - {{option.text}}
+                </template>
+                <template #label>
+                  {{dataStore.texttemplates.find(i => i.text === itemInfo.endText) ? dataStore.texttemplates.find(i => i.text === itemInfo.endText).name : "Keine Vorlage ausgewählt oder Vorlage verändert"}}
+                </template>
+              </USelectMenu>
+            </UFormGroup>
+
             <UFormGroup
                 label="Nachbemerkung:"
             >
               <UTextarea
                 v-model="itemInfo.endText"
+                :rows="6"
               />
             </UFormGroup>
           </div>
diff --git a/spaces/pages/tasks/[mode]/[[id]].vue b/spaces/pages/tasks/[mode]/[[id]].vue
index e92fe01..096c99b 100644
--- a/spaces/pages/tasks/[mode]/[[id]].vue
+++ b/spaces/pages/tasks/[mode]/[[id]].vue
@@ -75,156 +75,152 @@ setupPage()
 </script>
 
 <template>
-  <div>
-    <UCard v-if="currentItem && mode == 'show'" >
-      <template #header>
-        <UBadge>
-          {{currentItem.categorie}}
-        </UBadge>
+  <h1
+      class="mb-3 truncate font-bold text-2xl"
+      v-if="currentItem"
+  >Aufgabe: {{currentItem.name}}</h1>
+  <UTabs
+    :items="[{label: 'Informationen'},{label: 'Logbuch'}]"
+    v-if="currentItem && mode === 'show'"
+  >
+    <template #item="{item}">
+      <UCard class="mt-5">
+        <div v-if="item.label === 'Informationen'">
+          <Toolbar>
+            <UButton
+                v-if="mode === 'show' && currentItem.id"
+                @click="editItem"
+            >
+              Bearbeiten
+            </UButton>
+            <UButton
+                v-if="currentItem.project"
+                @click="router.push(`/projects/show/${currentItem.project}`)"
+            >
+              Zum Projekt
+            </UButton>
+          </Toolbar>
 
-        {{currentItem.name}}
-      </template>
+          <div class="truncate">
+            <p>Kategorie: {{currentItem.categorie}}</p>
+            <p v-if="currentItem.project">Projekt: <nuxt-link :to="`/projects/show/${currentItem.project}`">{{dataStore.getProjectById(currentItem.project).name}}</nuxt-link></p>
+            <p>Beschreibung: {{currentItem.description}}</p>
+          </div>
 
-      <InputGroup>
-        <UButton
-          v-if="currentItem.project"
-          @click="router.push(`/projects/show/${currentItem.project}`)"
-          class="mb-3"
-        >
-          Zum Projekt
-        </UButton>
-      </InputGroup>
+        </div>
+        <!-- TODO: Logbuch Tasks -->
+      </UCard>
+    </template>
+  </UTabs>
+  <UCard v-else-if="mode === 'edit' || mode === 'create'" >
+    <template #header v-if="mode === 'edit'">
+      {{itemInfo.name}}
+    </template>
 
+    <UFormGroup
+        label="Name:"
+    >
+      <UInput
+          v-model="itemInfo.name"
+      />
+    </UFormGroup>
 
-      Beschreibung:<br>
-      {{currentItem.description}}<br>
-      Projekt: {{currentItem.project ? dataStore.getProjectById(currentItem.project).name : "Kein Projekt zugeordnet"}}
+    <UFormGroup
+        label="Kategorie:"
+    >
+      <USelectMenu
+          v-model="itemInfo.categorie"
+          :options="categories"
+      />
+    </UFormGroup>
 
-
-
-
-      <template #footer>
-        <UButton
-            v-if="mode == 'show' && currentItem.id"
-            @click="editItem"
-        >
-          Bearbeiten
-        </UButton>
-      </template>
-
-
-
-    </UCard>
-    <UCard v-else-if="mode === 'edit' || mode === 'create'" >
-      <template #header v-if="mode === 'edit'">
-        {{itemInfo.name}}
-      </template>
-
-      <UFormGroup
-          label="Name:"
+    <UFormGroup
+        label="Benutzer:"
+    >
+      <USelectMenu
+          v-model="itemInfo.user"
+          :options="dataStore.profiles"
+          option-attribute="fullName"
+          value-attribute="id"
+          searchable-placeholder="Suche..."
+          searchable
+          :search-attributes="['fullName']"
       >
-        <UInput
-            v-model="itemInfo.name"
-        />
-      </UFormGroup>
-
-      <UFormGroup
-          label="Kategorie:"
+        <template #label>
+          {{dataStore.getProfileById(itemInfo.user) ? dataStore.getProfileById(itemInfo.user).fullName : "Kein Benutzer ausgewählt"}}
+        </template>
+      </USelectMenu>
+    </UFormGroup>
+    <UFormGroup
+        label="Projekt:"
+    >
+      <USelectMenu
+          v-model="itemInfo.project"
+          :options="dataStore.projects"
+          option-attribute="name"
+          value-attribute="id"
+          searchable-placeholder="Suche..."
+          searchable
+          :search-attributes="['name']"
       >
-        <USelectMenu
-            v-model="itemInfo.categorie"
-            :options="categories"
-        />
-      </UFormGroup>
-
-      <UFormGroup
-          label="Benutzer:"
+        <template #label>
+          {{dataStore.getProjectById(itemInfo.project) ? dataStore.getProjectById(itemInfo.project).name : "Kein Projekt ausgewählt"}}
+        </template>
+      </USelectMenu>
+    </UFormGroup>
+    <UFormGroup
+        label="Objekt:"
+    >
+      <USelectMenu
+          v-model="itemInfo.plant"
+          :options="dataStore.plants"
+          option-attribute="name"
+          value-attribute="id"
+          searchable-placeholder="Suche..."
+          searchable
+          :search-attributes="['name']"
       >
-        <USelectMenu
-            v-model="itemInfo.user"
-            :options="dataStore.profiles"
-            option-attribute="fullName"
-            value-attribute="id"
-            searchable-placeholder="Suche..."
-            searchable
-            :search-attributes="['fullName']"
-        >
-          <template #label>
-            {{dataStore.getProfileById(itemInfo.user) ? dataStore.getProfileById(itemInfo.user).fullName : "Kein Benutzer ausgewählt"}}
-          </template>
-        </USelectMenu>
-      </UFormGroup>
-      <UFormGroup
-          label="Projekt:"
+        <template #label>
+          {{dataStore.getPlantById(itemInfo.plant) ? dataStore.getPlantById(itemInfo.plant).name : "Kein Objekt ausgewählt"}}
+        </template>
+      </USelectMenu>
+    </UFormGroup>
+
+
+
+
+    <UFormGroup
+        label="Beschreibung:"
+    >
+      <UTextarea
+          v-model="itemInfo.description"
+      />
+    </UFormGroup>
+
+
+    <template #footer>
+      <UButton
+          v-if="mode === 'edit'"
+          @click="dataStore.updateItem('tasks',itemInfo)"
       >
-        <USelectMenu
-            v-model="itemInfo.project"
-            :options="dataStore.projects"
-            option-attribute="name"
-            value-attribute="id"
-            searchable-placeholder="Suche..."
-            searchable
-            :search-attributes="['name']"
-        >
-          <template #label>
-            {{dataStore.getProjectById(itemInfo.project) ? dataStore.getProjectById(itemInfo.project).name : "Kein Projekt ausgewählt"}}
-          </template>
-        </USelectMenu>
-      </UFormGroup>
-      <UFormGroup
-          label="Objekt:"
+        Speichern
+      </UButton>
+      <UButton
+          v-else-if="mode === 'create'"
+          @click="dataStore.createNewItem('tasks',itemInfo)"
       >
-        <USelectMenu
-            v-model="itemInfo.plant"
-            :options="dataStore.plants"
-            option-attribute="name"
-            value-attribute="id"
-            searchable-placeholder="Suche..."
-            searchable
-            :search-attributes="['name']"
-        >
-          <template #label>
-            {{dataStore.getPlantById(itemInfo.plant) ? dataStore.getPlantById(itemInfo.plant).name : "Kein Objekt ausgewählt"}}
-          </template>
-        </USelectMenu>
-      </UFormGroup>
-
-
-
-
-      <UFormGroup
-          label="Beschreibung:"
+        Erstellen
+      </UButton>
+      <UButton
+          @click="cancelEditorCreate"
+          color="red"
+          class="ml-2"
       >
-        <UTextarea
-            v-model="itemInfo.description"
-        />
-      </UFormGroup>
+        Abbrechen
+      </UButton>
+    </template>
 
-
-      <template #footer>
-        <UButton
-            v-if="mode == 'edit'"
-            @click="dataStore.updateItem('tasks',itemInfo)"
-        >
-          Speichern
-        </UButton>
-        <UButton
-            v-else-if="mode == 'create'"
-            @click="dataStore.createNewItem('tasks',itemInfo)"
-        >
-          Erstellen
-        </UButton>
-        <UButton
-            @click="cancelEditorCreate"
-            color="red"
-            class="ml-2"
-        >
-          Abbrechen
-        </UButton>
-      </template>
-
-    </UCard>
-  </div>
+  </UCard>
 </template>
 
 <style scoped>
diff --git a/spaces/pages/vendors/[mode]/[[id]].vue b/spaces/pages/vendors/[mode]/[[id]].vue
index 9aea136..53795af 100644
--- a/spaces/pages/vendors/[mode]/[[id]].vue
+++ b/spaces/pages/vendors/[mode]/[[id]].vue
@@ -55,7 +55,7 @@ setupPage()
       v-if="currentItem "
   >Lieferant: {{currentItem.name}}</h1>
   <UTabs
-    :items="[{label: 'Informationen'},{label: 'Logbuch'},{label: 'Ansprechpartner'}]"
+    :items="[{label: 'Informationen'},{label: 'Logbuch'},{label: 'Ansprechpartner'},{label: 'Dokumente'}]"
     v-if="currentItem && mode == 'show'"
   >
     <template #item="{item}">
@@ -105,6 +105,18 @@ setupPage()
           </UTable>
 
         </div>
+        <div v-else-if="item.label === 'Dokumente'">
+          <InputGroup>
+            <DocumentUpload
+                type="vendor"
+                :element-id="currentItem.id"
+            />
+          </InputGroup>
+
+          <DocumentList
+              :documents="dataStore.getDocumentsByVendorId(currentItem.id)"
+          />
+        </div>
       </UCard>
     </template>
   </UTabs>
diff --git a/spaces/stores/data.js b/spaces/stores/data.js
index 5612a36..bb6a6ce 100644
--- a/spaces/stores/data.js
+++ b/spaces/stores/data.js
@@ -163,6 +163,7 @@ export const useDataStore = defineStore('data', () => {
     const workingtimes = ref([])
     const phasesTemplates = ref([])
     const emailAccounts = ref([])
+    const texttemplates =ref([])
 
 
     const rights = ref({
@@ -277,6 +278,7 @@ export const useDataStore = defineStore('data', () => {
         await fetchWorkingTimes()
         await fetchPhasesTemplates()
         await fetchEmailAccounts()
+        await fetchTextTemplates()
         loaded.value = true
     }
 
@@ -318,6 +320,7 @@ export const useDataStore = defineStore('data', () => {
         workingtimes.value = []
         phasesTemplates.value = []
         emailAccounts.value = []
+        texttemplates.value = []
     }
 
     function hasRight (right) {
@@ -574,6 +577,10 @@ export const useDataStore = defineStore('data', () => {
         emailAccounts.value = (await supabase.from("emailAccounts").select().eq('tenant', currentTenant.value)).data
     }
 
+    async function fetchTextTemplates() {
+        texttemplates.value = (await supabase.from("textTemplates").select().eq('tenant', currentTenant.value)).data
+    }
+
     async function fetchDocuments () {
         let tempDocuments = (await supabase.from("documents").select().eq('tenant', currentTenant.value)).data
 
@@ -680,6 +687,10 @@ export const useDataStore = defineStore('data', () => {
         return documents.value.filter(item => item.product === itemId && !item.tags.includes("Archiviert"))
     })
 
+    const getDocumentsByVendorId = computed(() => (itemId) => {
+        return documents.value.filter(item => item.vendor === itemId && !item.tags.includes("Archiviert"))
+    })
+
     const getEventsByProjectId = computed(() => (projectId) => {
         return events.value.filter(item => item.project === projectId)
     })
@@ -712,6 +723,10 @@ export const useDataStore = defineStore('data', () => {
         return messages.value.filter(i => i.destination === chatId)
     })
 
+    const getTextTemplatesByDocumentType = computed(() => (documentType) => {
+        return texttemplates.value.filter(i => i.documentType === documentType)
+    })
+
     const getStockByProductId = computed(() => (productId) => {
         let productMovements = movements.value.filter(movement => movement.productId === productId)
 
@@ -1006,6 +1021,7 @@ export const useDataStore = defineStore('data', () => {
         workingtimes,
         phasesTemplates,
         emailAccounts,
+        texttemplates,
         documentTypesForCreation,
 
         //Functions
@@ -1057,6 +1073,7 @@ export const useDataStore = defineStore('data', () => {
         getDocumentsByContractId,
         getDocumentsByVehicleId,
         getDocumentsByProductId,
+        getDocumentsByVendorId,
         getEventsByProjectId,
         getTimesByProjectId,
         getTasksByProjectId,
@@ -1064,6 +1081,7 @@ export const useDataStore = defineStore('data', () => {
         getProjectsByPlantId,
         getMovementsBySpaceId,
         getMessagesByChatId,
+        getTextTemplatesByDocumentType,
         getStockByProductId,
         getIncomingInvoicesByVehicleId,
         getEventTypes,