From e139eb771caa4527961d8c0f3602c02c8b9372b0 Mon Sep 17 00:00:00 2001
From: flfeders <f.federspiel@federspiel.tech>
Date: Sun, 2 Jun 2024 21:39:26 +0200
Subject: [PATCH] Changes

---
 layouts/default.vue                        |   8 +-
 pages/banking/index.vue                    | 210 +++++----
 pages/banking/statements/[mode]/[[id]].vue | 166 ++++---
 pages/createDocument/edit/[[id]].vue       |   1 +
 pages/createDocument/index.vue             |   2 +-
 pages/customers/[mode]/[[id]].vue          |  10 +-
 pages/incomingInvoices/[mode]/[[id]].vue   | 516 +++++++++++----------
 pages/incomingInvoices/index.vue           |   2 +-
 stores/data.js                             |  22 +-
 9 files changed, 498 insertions(+), 439 deletions(-)

diff --git a/layouts/default.vue b/layouts/default.vue
index ca58874..0c94c84 100644
--- a/layouts/default.vue
+++ b/layouts/default.vue
@@ -312,7 +312,7 @@ let links = computed(() => {
     ... dataStore.ownTenant.features.vehicles ? [{
       label: "Fahrzeuge",
       to: "/vehicles",
-      icon: "i-heroicons-truck"
+      icon: "i-heroicons-truck",
     }] : [],
     {
       label: "Stammdaten",
@@ -476,7 +476,7 @@ const footerLinks = [/*{
           <UDashboardSearchButton label="Suche..."/>
         </template>
 
-        <UDashboardSidebarLinks :links="links" >
+        <UDashboardSidebarLinks :links="links">
 
         </UDashboardSidebarLinks>
 
@@ -540,5 +540,7 @@ const footerLinks = [/*{
 </template>
 
 <style scoped>
-
+.testclass {
+  color: red;
+}
 </style>
\ No newline at end of file
diff --git a/pages/banking/index.vue b/pages/banking/index.vue
index 2d1d4a2..5476542 100644
--- a/pages/banking/index.vue
+++ b/pages/banking/index.vue
@@ -1,3 +1,116 @@
+<script setup>
+
+import dayjs from "dayjs";
+
+definePageMeta({
+  middleware: "auth"
+})
+
+defineShortcuts({
+  '/': () => {
+    //console.log(searchinput)
+    //searchinput.value.focus()
+    document.getElementById("searchinput").focus()
+  },
+  'escape': () => {
+    //console.log(searchinput)
+    //searchinput.value.focus()
+    showStatementModal.value = false
+  }
+})
+
+const dataStore = useDataStore()
+const router = useRouter()
+const supabase = useSupabaseClient()
+
+const bankstatements = ref([])
+
+
+const setupPage = async () => {
+  bankstatements.value = (await supabase.from("bankstatements").select("*, statementallocations(*)").eq('tenant', dataStore.currentTenant).order("date", {ascending:false})).data
+
+}
+
+
+
+const selectedStatement = ref(null)
+const showStatementModal = ref(false)
+
+const templateColumns = [
+  {
+    key: "account",
+    label: "Konto",
+    sortable: true
+  },{
+    key: "valueDate",
+    label: "Valuta",
+    sortable: true
+  },
+  {
+    key: "amount",
+    label: "Betrag",
+    sortable: true
+  },
+  {
+    key: "openAmount",
+    label: "Offener Betrag",
+    sortable: true
+  },
+  {
+    key: "partner",
+    label: "Name",
+    sortable: true
+  },
+  {
+    key: "text",
+    label: "Beschreibung",
+    sortable: true
+  }
+]
+const selectedColumns = ref(templateColumns)
+const columns = computed(() => templateColumns.filter((column) => selectedColumns.value.includes(column)))
+
+
+const searchString = ref('')
+const filterAccount = ref(dataStore.bankAccounts || [])
+const showOnlyNotAssigned = ref(true)
+
+const displayCurrency = (value, currency = "€") => {
+  return `${Number(value).toFixed(2).replace(".",",")} ${currency}`
+}
+
+const getDocumentSum = (doc) => {
+  let sum = 0
+  doc.rows.forEach(row => {
+    if(row.mode === "normal" || row.mode === "service" || row.mode === "free") {
+      sum += row.quantity * row.price * (1 - row.discountPercent / 100) * (1 + row.taxPercent / 100)
+    }
+  })
+  return sum
+}
+
+const calculateOpenSum = (statement) => {
+  let startingAmount = statement.amount || 0
+
+  statement.statementallocations.forEach(item => {
+    if(item.cd_id) {
+      startingAmount = startingAmount - item.amount
+    } else if(item.ii_id) {
+      startingAmount = Number(startingAmount) + item.amount
+    }
+  })
+
+  return startingAmount.toFixed(2)
+}
+
+
+const filteredRows = computed(() => {
+  return useSearch(searchString.value, bankstatements.value.filter(i => filterAccount.value.find(x => x.id === i.account) && (showOnlyNotAssigned.value ? Number(calculateOpenSum(i)) !== 0 : true)))
+})
+
+setupPage()
+</script>
+
 <template>
   <UDashboardNavbar title="Bankbuchungen">
     <template #right>
@@ -161,104 +274,7 @@
   </UModal>
 </template>
 
-<script setup>
 
-import dayjs from "dayjs";
-
-definePageMeta({
-  middleware: "auth"
-})
-
-defineShortcuts({
-  '/': () => {
-    //console.log(searchinput)
-    //searchinput.value.focus()
-    document.getElementById("searchinput").focus()
-  },
-  'escape': () => {
-    //console.log(searchinput)
-    //searchinput.value.focus()
-    showStatementModal.value = false
-  }
-})
-
-const dataStore = useDataStore()
-const router = useRouter()
-
-const selectedStatement = ref(null)
-const showStatementModal = ref(false)
-
-const templateColumns = [
-  {
-    key: "account",
-    label: "Konto",
-    sortable: true
-  },{
-    key: "valueDate",
-    label: "Valuta",
-    sortable: true
-  },
-  {
-    key: "amount",
-    label: "Betrag",
-    sortable: true
-  },
-  {
-    key: "openAmount",
-    label: "Offener Betrag",
-    sortable: true
-  },
-  {
-    key: "partner",
-    label: "Name",
-    sortable: true
-  },
-  {
-    key: "text",
-    label: "Beschreibung",
-    sortable: true
-  }
-]
-const selectedColumns = ref(templateColumns)
-const columns = computed(() => templateColumns.filter((column) => selectedColumns.value.includes(column)))
-
-
-const searchString = ref('')
-const filterAccount = ref(dataStore.bankAccounts || [])
-const showOnlyNotAssigned = ref(true)
-
-const displayCurrency = (value, currency = "€") => {
-  return `${Number(value).toFixed(2).replace(".",",")} ${currency}`
-}
-
-const getDocumentSum = (doc) => {
-  let sum = 0
-  doc.rows.forEach(row => {
-    if(row.mode === "normal" || row.mode === "service" || row.mode === "free") {
-      sum += row.quantity * row.price * (1 - row.discountPercent / 100) * (1 + row.taxPercent / 100)
-    }
-  })
-  return sum
-}
-
-const calculateOpenSum = (statement) => {
-  let startingAmount = statement.amount
-
-  statement.assignments.forEach(item => {
-    if(item.type === "createdDocument") {
-      let doc = dataStore.getCreatedDocumentById(item.id)
-      startingAmount = startingAmount - getDocumentSum(doc)
-    }
-  })
-
-  return startingAmount.toFixed(2)
-}
-
-
-const filteredRows = computed(() => {
-  return useSearch(searchString.value, dataStore.bankstatements.filter(i => filterAccount.value.find(x => x.id === i.account) && (showOnlyNotAssigned.value ? Number(calculateOpenSum(i)) !== 0 : true)))
-})
-</script>
 
 <style scoped>
 
diff --git a/pages/banking/statements/[mode]/[[id]].vue b/pages/banking/statements/[mode]/[[id]].vue
index 5cc33bf..fc3845b 100644
--- a/pages/banking/statements/[mode]/[[id]].vue
+++ b/pages/banking/statements/[mode]/[[id]].vue
@@ -16,16 +16,26 @@ const dataStore = useDataStore()
 const route = useRoute()
 const router = useRouter()
 const mode = ref(route.params.mode || "show")
+const supabase = useSupabaseClient()
 
-const itemInfo = ref({})
+const itemInfo = ref({statementallocations:[]})
 const oldItemInfo = ref({})
 
-const setup = () => {
+const openDocuments = ref([])
+
+const setup = async () => {
   if(route.params.id) {
-    itemInfo.value = dataStore.bankstatements.find(i => i.id === Number(route.params.id))
+    itemInfo.value =  (await supabase.from("bankstatements").select("*, statementallocations(*)").eq("id",route.params.id).single()).data  //dataStore.bankstatements.find(i => i.id === Number(route.params.id))
   }
   if(itemInfo.value) oldItemInfo.value = JSON.parse(JSON.stringify(itemInfo.value))
 
+  openDocuments.value = (await supabase.from("createddocuments").select("*, statementallocations(*)")).data.filter(i => i.statementallocations.length === 0 || i.statementallocations.find(x => x.bs_id === itemInfo.value.id))
+
+
+  let allocations = (await supabase.from("createddocuments").select(`*, statementallocations(*)`).eq("id",50)).data
+
+
+
 }
 
 const displayCurrency = (value, currency = "€") => {
@@ -57,18 +67,29 @@ const getInvoiceSum = (invoice) => {
 }
 
 const calculateOpenSum = computed(() => {
-    let startingAmount = itemInfo.value.amount
+    let startingAmount = itemInfo.value.amount || 0
 
-    itemInfo.value.assignments.forEach(item => {
-      if(item.type === "createdDocument") {
-        let doc = dataStore.getCreatedDocumentById(item.id)
-        startingAmount = startingAmount - getDocumentSum(doc)
+    itemInfo.value.statementallocations.forEach(item => {
+      if(item.cd_id) {
+        startingAmount = startingAmount - item.amount
+      } else if(item.ii_id) {
+        startingAmount = Number(startingAmount) + item.amount
       }
     })
 
     return startingAmount.toFixed(2)
 })
 
+const saveAllocations = async () =>  {
+  let allocationsToBeSaved = itemInfo.value.statementallocations.filter(i => !i.id)
+
+  for await (let i of allocationsToBeSaved) {
+    await dataStore.createNewItem("statementallocations", i)
+  }
+
+
+}
+
 
 setup()
 
@@ -89,13 +110,13 @@ setup()
     </template>
     <template #center>
       <h1
-          :class="['text-xl','font-medium', ... itemInfo.incomingInvoice || itemInfo.createdDocument ? ['text-primary-500'] : ['text-rose-600']]"
+          :class="['text-xl','font-medium', Number(calculateOpenSum) === 0 ? ['text-primary-500'] : ['text-rose-600']]"
       >Kontobewegung bearbeiten</h1>
     </template>
     <template #right>
       <UButton
           v-if="mode === 'edit'"
-          @click="dataStore.updateItem('bankstatements',itemInfo,oldItemInfo)"
+          @click="saveAllocations"
       >
         Speichern
       </UButton>
@@ -160,11 +181,11 @@ setup()
 
           <span v-if="itemInfo.amount > 0" class="text-primary-500 font-semibold">{{itemInfo.amount.toFixed(2).replace(".",",")}}  {{itemInfo.currency}}</span>
           <span v-else-if="itemInfo.amount < 0" class="text-rose-600 font-semibold">{{itemInfo.amount.toFixed(2).replace(".",",")}} {{itemInfo.currency}}</span>
-          <span v-else>{{itemInfo.amount.toFixed(2).replace(".",",")}} {{itemInfo.currency}}</span>
+          <span v-else>{{(itemInfo.amount || 0).toFixed(2).replace(".",",")}} {{itemInfo.currency}}</span>
         </div>
       </template>
 
-      <table class="w-full">
+      <table class="w-full" v-if="itemInfo.id">
         <tr class="flex-row flex justify-between">
           <td>
             <span class="font-semibold">Buchungsdatum:</span>
@@ -207,26 +228,36 @@ setup()
         </tr>
         <tr class="flex-row flex justify-between">
           <td colspan="2">
-            <span class="font-semibold">Verknüpftes Dokument:</span>
+            <span class="font-semibold">Verknüpfte Dokumente:</span>
           </td>
-
         </tr>
         <tr
             class="flex-row flex justify-between mb-3"
-            v-for="item in itemInfo.assignments"
+            v-for="item in itemInfo.statementallocations"
         >
+
           <td>
 <!--            <span v-if="itemInfo.createdDocument"><nuxt-link :to="`/createDocument/show/${itemInfo.createdDocument}`">{{dataStore.createddocuments.find(i => i.id === itemInfo.createdDocument).documentNumber}}</nuxt-link></span>
             <span v-else-if="itemInfo.incomingInvoice"><nuxt-link :to="`/incominInvoices/show/${itemInfo.incomingInvoice}`">{{dataStore.getIncomingInvoiceById(itemInfo.incomingInvoice).reference}}</nuxt-link></span>-->
-            <span v-if="item.type === 'createdDocument'">
-              {{dataStore.getCreatedDocumentById(item.id).documentNumber}}
+            <span v-if="item.cd_id">
+              {{dataStore.getCreatedDocumentById(item.cd_id).documentNumber}}
+            </span>
+            <span v-else-if="item.ii_id">
+              {{dataStore.getVendorById(dataStore.getIncomingInvoiceById(item.ii_id).vendor).name}} - {{dataStore.getIncomingInvoiceById(item.ii_id).reference}}
             </span>
           </td>
           <td>
             <UButton
               variant="outline"
               icon="i-heroicons-arrow-right-end-on-rectangle"
-              @click="router.push(`/createDocument/show/${item.id}`)"
+              @click="router.push(`/createDocument/show/${item.cd_id}`)"
+              v-if="item.cd_id"
+            />
+            <UButton
+              variant="outline"
+              icon="i-heroicons-arrow-right-end-on-rectangle"
+              @click="router.push(`/incominginvoices/show/${item.ii_id}`)"
+              v-else-if="item.ii_id"
             />
           </td>
         </tr>
@@ -253,15 +284,13 @@ setup()
         class="w-2/5 mx-auto"
         v-if="itemInfo.amount > 0 "
     >
-      <UDivider
-        label="Test"
-      >
+      <UDivider>
         <span>Offene Summe: {{displayCurrency(calculateOpenSum)}}</span>
       </UDivider>
       <UCard
           class="mt-5"
-          :ui="{ring: itemInfo.assignments.find(i => i.id === document.id) ? 'ring-primary-500' : 'ring-gray-200 dark:ring-gray-800'}"
-          v-for="document in dataStore.getOpenDocuments()"
+          :ui="{ring: itemInfo.statementallocations.find(i => i.cd_id === document.id) ? 'ring-primary-500' : 'ring-gray-200 dark:ring-gray-800'}"
+          v-for="document in openDocuments"
       >
         <template #header>
           <div class="flex flex-row justify-between">
@@ -273,57 +302,68 @@ setup()
             icon="i-heroicons-check"
             variant="outline"
             class="mr-3"
-            v-if="!itemInfo.assignments.find(i => i.id === document.id)"
-            @click="itemInfo.assignments.push({type: 'createdDocument',id: document.id})"
+            v-if="!itemInfo.statementallocations.find(i => i.cd_id === document.id)"
+            @click="itemInfo.statementallocations.push({cd_id: document.id, bs_id: itemInfo.id, amount: Number(getDocumentSum(document))})"
         />
         <UButton
             icon="i-heroicons-x-mark"
             variant="outline"
             color="rose"
-            v-if="itemInfo.assignments.find(i => i.id === document.id)"
-            @click="itemInfo.assignments = itemInfo.assignments.filter(i => i.id !== document.id)"
+            class="mr-3"
+            v-if="itemInfo.statementallocations.find(i => i.cd_id === document.id)"
+            @click="itemInfo.statementallocations = itemInfo.statementallocations.filter(i => i.cd_id !== document.id)"
+        />
+
+        <UButton
+            variant="outline"
+            icon="i-heroicons-arrow-right-end-on-rectangle"
+            @click="router.push(`/createDocument/show/${document.id}`)"
         />
       </UCard>
 
     </div>
-
-
-
-
-
-    <UCard
-      class="w-4/5 mx-auto mt-5"
-      v-else-if="itemInfo.amount < 0 && !itemInfo.incomingInvoice"
-      v-for="invoice in dataStore.getOpenIncomingInvoices()"
+    <div
+        class="w-2/5 mx-auto"
+        v-if="itemInfo.amount < 0 "
     >
-      <template #header>
-        <div class="flex flex-row justify-between">
-          <span>{{dataStore.getVendorById(invoice.vendor).name}} - {{invoice.reference}}</span>
-          <span class="font-semibold text-rose-600">-{{displayCurrency(getInvoiceSum(invoice))}}</span>
-        </div>
-      </template>
-      <table class="w-full">
-        <tr class="flex flex-row justify-between">
-          <td><span class="font-semibold">Belegdatum:</span></td>
-          <td>{{dayjs(invoice.date).format("DD.MM.YYYY")}}</td>
-        </tr>
-        <tr class="flex flex-row justify-between">
-          <td><span class="font-semibold">Fälligkeitsdatum:</span></td>
-          <td>{{dayjs(invoice.dueDate).format("DD.MM.YYYY")}}</td>
-        </tr>
-        <tr class="flex flex-row justify-between">
-          <td colspan="2"><span class="font-semibold">Beschreibung:</span></td>
-        </tr>
-        <tr class="flex flex-row justify-between">
-          <td colspan="2">{{invoice.description}}</td>
-        </tr>
-      </table>
-    </UCard>
+      <UDivider>
+        <span>Offene Summe: {{displayCurrency(calculateOpenSum)}}</span>
+      </UDivider>
+      <UCard
+          class="mt-5"
+          :ui="{ring: itemInfo.assignments.find(i => i.id === invoice.id) ? 'ring-primary-500' : 'ring-gray-200 dark:ring-gray-800'}"
+          v-for="invoice in dataStore.getOpenIncomingInvoices()"
+      >
+        <template #header>
+          <div class="flex flex-row justify-between">
+            <span>{{dataStore.getVendorById(invoice.vendor).name}} - {{invoice.reference}}</span>
+            <span class="font-semibold text-rose-600">-{{displayCurrency(getInvoiceSum(invoice))}}</span>
+          </div>
+        </template>
+        <UButton
+            icon="i-heroicons-check"
+            variant="outline"
+            class="mr-3"
+            v-if="!itemInfo.assignments.find(i => i.id === invoice.id)"
+            @click="itemInfo.assignments.push({type: 'incomingInvoice',id: invoice.id})"
+        />
+        <UButton
+            icon="i-heroicons-x-mark"
+            variant="outline"
+            color="rose"
+            class="mr-3"
+            v-if="itemInfo.assignments.find(i => i.id === invoice.id)"
+            @click="itemInfo.assignments = itemInfo.assignments.filter(i => i.id !== invoice.id)"
+        />
+        <UButton
+            variant="outline"
+            icon="i-heroicons-arrow-right-end-on-rectangle"
+            @click="router.push(`/incominginvoices/show/${invoice.id}`)"
+        />
+
+      </UCard>
+    </div>
   </UDashboardPanelContent>
-
-
-
-
 </template>
 
 <style scoped>
diff --git a/pages/createDocument/edit/[[id]].vue b/pages/createDocument/edit/[[id]].vue
index ab4c2f9..1666f1e 100644
--- a/pages/createDocument/edit/[[id]].vue
+++ b/pages/createDocument/edit/[[id]].vue
@@ -482,6 +482,7 @@ setupPage()
       </UButton>
       <UButton
           @click="closeDocument"
+          v-if="itemInfo.id"
       >
         Fertigstellen
       </UButton>
diff --git a/pages/createDocument/index.vue b/pages/createDocument/index.vue
index 499037d..f10776c 100644
--- a/pages/createDocument/index.vue
+++ b/pages/createDocument/index.vue
@@ -106,7 +106,7 @@
       <span :class="dayjs(row.dueDate).diff(dayjs()) <= 0 ? ['text-rose-500'] : '' ">{{row.dueDate ? dayjs(row.dueDate).format("DD.MM.YY") : ''}}</span>
     </template>
     <template #paid-data="{row}">
-      <span v-if="dataStore.bankstatements.find(x => x.assignments.find(y => y.id === row.id))" class="text-primary-500">Bezahlt</span>
+      <span v-if="dataStore.bankstatements.find(x => x.assignments.find(y => y.type === 'createdDocument' && y.id === row.id))" class="text-primary-500">Bezahlt</span>
       <span v-else :class="dayjs(row.dueDate).diff(dayjs()) <= 0 ? ['text-rose-500'] : ['text-cyan-500'] ">Offen</span>
 <!--      {{dataStore.bankstatements.find(x => x.assignments.find(y => y.id === row.id)) ? true : false}}-->
     </template>
diff --git a/pages/customers/[mode]/[[id]].vue b/pages/customers/[mode]/[[id]].vue
index dfd14c2..7462ff0 100644
--- a/pages/customers/[mode]/[[id]].vue
+++ b/pages/customers/[mode]/[[id]].vue
@@ -186,7 +186,6 @@ setupPage()
                 :render-headline="true"
             />
           </UCard>
-
         </div>
 
       </div>
@@ -194,15 +193,8 @@ setupPage()
 
 
       <UCard class="mt-5" v-else>
-      <div v-if="item.label === 'Informationen'" class="flex">
 
-
-
-
-
-
-      </div>
-      <div v-else-if="item.label === 'Projekte'">
+      <div v-if="item.label === 'Projekte'">
         <Toolbar>
           <UButton
               @click="router.push(`/projects/create?customer=${currentItem.id}`)"
diff --git a/pages/incomingInvoices/[mode]/[[id]].vue b/pages/incomingInvoices/[mode]/[[id]].vue
index 3d1d8ef..8d9a317 100644
--- a/pages/incomingInvoices/[mode]/[[id]].vue
+++ b/pages/incomingInvoices/[mode]/[[id]].vue
@@ -187,294 +187,296 @@ setupPage()
       </UButton>
     </template>
   </UDashboardNavbar>
-  <div v-if="!itemInfo.document">
-<!--    <div v-if="availableDocuments.length === 0" class="w-1/2 mx-auto text-center">
-      <p class="text-2xl mt-5">Keine Dokumente zur Auswahl vefügbar</p>
-      <UButton
-        @click="router.push(`/documents`)"
-        class="mt-5"
-        variant="outline"
-      >
-        Zu den Dokumenten
-      </UButton>
-    </div>-->
+  <UDashboardPanelContent>
+    <div v-if="!itemInfo.document">
+      <!--    <div v-if="availableDocuments.length === 0" class="w-1/2 mx-auto text-center">
+            <p class="text-2xl mt-5">Keine Dokumente zur Auswahl vefügbar</p>
+            <UButton
+              @click="router.push(`/documents`)"
+              class="mt-5"
+              variant="outline"
+            >
+              Zu den Dokumenten
+            </UButton>
+          </div>-->
 
 
-    <DocumentList
-        :documents="availableDocuments"
-        :return-document-id="true"
-        @selectDocument="(documentId) => itemInfo.document = documentId"
-    />
-  </div>
-  <div
-      v-else
-      class="flex justify-between mt-5"
-  >
-    <object
-        v-if="currentDocument ? currentDocument.url : false"
-        :data="currentDocument.url + '#toolbar=0&navpanes=0&scrollbar=0&statusbar=0&messages=0&scrollbar=0'"
-        type="application/pdf"
-        class="mx-5 documentPreview w-full"
-    />
-    <div class="w-3/5 mx-5">
+      <DocumentList
+          :documents="availableDocuments"
+          :return-document-id="true"
+          @selectDocument="(documentId) => itemInfo.document = documentId"
+      />
+    </div>
+    <div
+        v-else
+        class="flex justify-between mt-5"
+    >
+      <object
+          v-if="currentDocument ? currentDocument.url : false"
+          :data="currentDocument.url + '#toolbar=0&navpanes=0&scrollbar=0&statusbar=0&messages=0&scrollbar=0'"
+          type="application/pdf"
+          class="mx-5 documentPreview w-full"
+      />
+      <div class="w-3/5 mx-5">
 
-      <div v-if="mode === 'show'">
+        <div v-if="mode === 'show'">
 
-        <div class="truncate mb-5">
-          <p>Status: {{itemInfo.state}}</p>
-          <p>Datum: {{dayjs(itemInfo.date).format('DD.MM.YYYY')}}</p>
-          <p>Fälligkeitsdatum: {{dayjs(itemInfo.dueDate).format('DD.MM.YYYY')}}</p>
-          <p>Lieferant: <nuxt-link :to="`/vendors/show/${itemInfo.vendor}`">{{dataStore.getVendorById(itemInfo.vendor).name}}</nuxt-link></p>
-          <p>Bezahlt: {{itemInfo.paid}}</p>
-          <p>Beschreibung: {{itemInfo.description}}</p>
+          <div class="truncate mb-5">
+            <p>Status: {{itemInfo.state}}</p>
+            <p>Datum: {{dayjs(itemInfo.date).format('DD.MM.YYYY')}}</p>
+            <p>Fälligkeitsdatum: {{dayjs(itemInfo.dueDate).format('DD.MM.YYYY')}}</p>
+            <p>Lieferant: <nuxt-link :to="`/vendors/show/${itemInfo.vendor}`">{{dataStore.getVendorById(itemInfo.vendor).name}}</nuxt-link></p>
+            <p>Bezahlt: {{itemInfo.paid}}</p>
+            <p>Beschreibung: {{itemInfo.description}}</p>
 
-<!--     TODO: Buchungszeilen darstellen     -->
+            <!--     TODO: Buchungszeilen darstellen     -->
+          </div>
+
+          <HistoryDisplay
+              type="incomingInvoice"
+              v-if="itemInfo"
+              :element-id="itemInfo.id"
+              :render-headline="true"
+          />
         </div>
 
-        <HistoryDisplay
-            type="incomingInvoice"
-            v-if="itemInfo"
-            :element-id="itemInfo.id"
-            :render-headline="true"
-        />
-      </div>
-
-      <div v-else class=" scrollContainer">
-        <InputGroup class="mb-3">
-          <UButton
-              :variant="itemInfo.expense ? 'solid' : 'outline'"
-              @click="itemInfo.expense = true"
-          >
-            Ausgabe
-          </UButton>
-          <UButton
-              :variant="!itemInfo.expense ? 'solid' : 'outline'"
-              @click="itemInfo.expense = false"
-          >
-            Einnahme
-          </UButton>
-        </InputGroup>
-
-        <UFormGroup label="Lieferant:" required>
-          <InputGroup>
-            <USelectMenu
-                v-model="itemInfo.vendor"
-                :options="dataStore.vendors"
-                option-attribute="name"
-                value-attribute="id"
-                searchable
-                :search-attributes="['name','vendorNumber']"
-                class="flex-auto"
-            >
-              <template #label>
-                {{dataStore.vendors.find(vendor => vendor.id === itemInfo.vendor) ? dataStore.vendors.find(vendor => vendor.id === itemInfo.vendor).name : 'Lieferant auswählen'}}
-              </template>
-            </USelectMenu>
+        <div v-else class=" scrollContainer">
+          <InputGroup class="mb-3">
             <UButton
-                @click="router.push('/vendors/create')"
+                :variant="itemInfo.expense ? 'solid' : 'outline'"
+                @click="itemInfo.expense = true"
             >
-              + Lieferant
+              Ausgabe
+            </UButton>
+            <UButton
+                :variant="!itemInfo.expense ? 'solid' : 'outline'"
+                @click="itemInfo.expense = false"
+            >
+              Einnahme
             </UButton>
           </InputGroup>
 
-
-        </UFormGroup>
-
-        <UFormGroup
-            class="mt-3"
-            label="Rechnungsreferenz:"
-            required
-        >
-          <UInput
-              v-model="itemInfo.reference"
-          />
-        </UFormGroup>
-
-        <InputGroup class="mt-3" gap="2">
-          <UFormGroup label="Rechnungsdatum:" required>
-            <UPopover :popper="{ placement: 'bottom-start' }">
-              <UButton icon="i-heroicons-calendar-days-20-solid" :label="itemInfo.date ? dayjs(itemInfo.date).format('DD.MM.YYYY') : 'Datum auswählen'" />
-
-              <template #panel="{ close }">
-                <LazyDatePicker v-model="itemInfo.date" @close="close" />
-              </template>
-            </UPopover>
-          </UFormGroup>
-
-          <UFormGroup label="Fälligkeitsdatum:" required>
-            <UPopover :popper="{ placement: 'bottom-start' }">
-              <UButton icon="i-heroicons-calendar-days-20-solid" :label="itemInfo.dueDate ? dayjs(itemInfo.dueDate).format('DD.MM.YYYY') : 'Datum auswählen'" />
-
-              <template #panel="{ close }">
-                <LazyDatePicker v-model="itemInfo.dueDate" @close="close" />
-              </template>
-            </UPopover>
-          </UFormGroup>
-        </InputGroup>
-
-
-
-        <UFormGroup label="Beschreibung:" required>
-          <UTextarea
-              v-model="itemInfo.description"
-          />
-        </UFormGroup>
-
-        <InputGroup class="my-3">
-          Brutto
-          <UToggle
-              v-model="useNetMode"
-              @update:model-value="itemInfo.accounts = [{account: null,amountNet: null,amountTax: null,taxType: '19'}]"
-          />
-          Netto
-        </InputGroup>
-
-        <table v-if="itemInfo.accounts.length > 1">
-          <tr>
-            <td>Gesamt exkl. Steuer: </td>
-            <td class="text-right">{{totalCalculated.totalNet.toFixed(2)}} €</td>
-          </tr>
-          <tr>
-            <td>19% Steuer: </td>
-            <td class="text-right">{{totalCalculated.totalAmount19Tax.toFixed(2)}} €</td>
-          </tr>
-          <tr>
-            <td>Gesamt inkl. Steuer: </td>
-            <td class="text-right">{{totalCalculated.totalGross.toFixed(2)}} €</td>
-          </tr>
-        </table>
-
-        <div
-            class="my-3"
-            v-for="(item,index) in itemInfo.accounts"
-        >
-
-          <UFormGroup
-              label="Kategorie"
-              class=" mb-3"
-          >
-            <USelectMenu
-                :options="dataStore.accounts"
-                option-attribute="label"
-                value-attribute="id"
-                searchable
-                :search-attributes="['label']"
-                searchable-placeholder="Suche..."
-                v-model="item.account"
-            >
-              <template #label>
-                {{dataStore.accounts.find(account => account.id === item.account) ? dataStore.accounts.find(account => account.id === item.account).label : "Keine Kategorie ausgewählt" }}
-              </template>
-
-            </USelectMenu>
-          </UFormGroup>
-          <UFormGroup
-              label="Kostenstelle"
-              class=" mb-3"
-          >
-            <USelectMenu
-                :options="dataStore.getCostCentresComposed"
-                option-attribute="label"
-                value-attribute="id"
-                searchable
-                :search-attributes="['label']"
-                searchable-placeholder="Suche..."
-                v-model="item.costCentre"
-            >
-              <template #label>
-                {{dataStore.getCostCentresComposed.find(account => account.id === item.costCentre) ? dataStore.getCostCentresComposed.find(account => account.id === item.costCentre).label : "Keine Kostenstelle ausgewählt" }}
-              </template>
-
-            </USelectMenu>
-          </UFormGroup>
-
-
-
-          <InputGroup>
-            <UFormGroup
-                label="Umsatzsteuer"
-                class="w-32"
-                :help="`Betrag: ${item.amountTax ? String(item.amountTax).replace('.',',') : '0,00'} €`"
-            >
+          <UFormGroup label="Lieferant:" required>
+            <InputGroup>
               <USelectMenu
-                  :options="taxOptions"
-                  v-model="item.taxType"
-                  value-attribute="key"
-                  option-attribute="label"
-                  @change="item.amountTax = Number(((item.amountNet ? item.amountNet : 0) * (Number(taxOptions.find(i => i.key === item.taxType).percentage)/100)).toFixed(2))"
+                  v-model="itemInfo.vendor"
+                  :options="dataStore.vendors"
+                  option-attribute="name"
+                  value-attribute="id"
+                  searchable
+                  :search-attributes="['name','vendorNumber']"
+                  class="flex-auto"
               >
                 <template #label>
-                  <span class="truncate">{{taxOptions.find(i => i.key === item.taxType) ? taxOptions.find(i => i.key === item.taxType).label : ""}}</span>
+                  {{dataStore.vendors.find(vendor => vendor.id === itemInfo.vendor) ? dataStore.vendors.find(vendor => vendor.id === itemInfo.vendor).name : 'Lieferant auswählen'}}
                 </template>
               </USelectMenu>
-            </UFormGroup>
-            <UFormGroup
-                v-if="useNetMode"
-                label="Gesamtbetrag exkl. Steuer in EUR"
-                class="flex-auto"
-                :help="item.taxType !== null ? `Betrag inkl. Steuern: ${String(Number(item.amountNet + item.amountTax).toFixed(2)).replace('.',',')} €` : 'Zuerst Steuertyp festlegen' "
-
-            >
-              <UInput
-                  type="number"
-                  step="0.01"
-                  v-model="item.amountNet"
-                  :disabled="item.taxType === null"
-                  @keyup="item.amountTax = Number((item.amountNet * (Number(item.taxType)/100)).toFixed(2))"
+              <UButton
+                  @click="router.push('/vendors/create')"
               >
-                <template #trailing>
-                  <span class="text-gray-500 dark:text-gray-400 text-xs">EUR</span>
+                + Lieferant
+              </UButton>
+            </InputGroup>
+
+
+          </UFormGroup>
+
+          <UFormGroup
+              class="mt-3"
+              label="Rechnungsreferenz:"
+              required
+          >
+            <UInput
+                v-model="itemInfo.reference"
+            />
+          </UFormGroup>
+
+          <InputGroup class="mt-3" gap="2">
+            <UFormGroup label="Rechnungsdatum:" required>
+              <UPopover :popper="{ placement: 'bottom-start' }">
+                <UButton icon="i-heroicons-calendar-days-20-solid" :label="itemInfo.date ? dayjs(itemInfo.date).format('DD.MM.YYYY') : 'Datum auswählen'" />
+
+                <template #panel="{ close }">
+                  <LazyDatePicker v-model="itemInfo.date" @close="close" />
                 </template>
-              </UInput>
+              </UPopover>
             </UFormGroup>
-            <UFormGroup
-                v-else
-                label="Gesamtbetrag inkl. Steuer in EUR"
-                class="flex-auto"
-                :help="item.taxType !== null ? `Betrag exkl. Steuern: ${item.amountNet ? String(item.amountNet.toFixed(2)).replace('.',',') : '0,00'} €` : 'Zuerst Steuertyp festlegen' "
 
-            >
-              <UInput
-                  type="number"
-                  step="0.01"
-                  :disabled="item.taxType === null"
-                  v-model="item.amountGross"
-                  @keyup="item.amountNet = Number((item.amountGross / (1 + Number(item.taxType)/100)).toFixed(2)),
-                  item.amountTax = Number((item.amountGross - item.amountNet).toFixed(2))"
-              >
-                <template #trailing>
-                  <span class="text-gray-500 dark:text-gray-400 text-xs">EUR</span>
+            <UFormGroup label="Fälligkeitsdatum:" required>
+              <UPopover :popper="{ placement: 'bottom-start' }">
+                <UButton icon="i-heroicons-calendar-days-20-solid" :label="itemInfo.dueDate ? dayjs(itemInfo.dueDate).format('DD.MM.YYYY') : 'Datum auswählen'" />
+
+                <template #panel="{ close }">
+                  <LazyDatePicker v-model="itemInfo.dueDate" @close="close" />
                 </template>
-              </UInput>
-
+              </UPopover>
             </UFormGroup>
-            {{item}}
-
-
           </InputGroup>
 
 
-          <UButton
-              class="mt-3"
-              @click="itemInfo.accounts = [...itemInfo.accounts.slice(0,index+1),{account:null, amountNet: null, amountTax:null, taxType: '19'} , ...itemInfo.accounts.slice(index+1)]"
+
+          <UFormGroup label="Beschreibung:" required>
+            <UTextarea
+                v-model="itemInfo.description"
+            />
+          </UFormGroup>
+
+          <InputGroup class="my-3">
+            Brutto
+            <UToggle
+                v-model="useNetMode"
+                @update:model-value="itemInfo.accounts = [{account: null,amountNet: null,amountTax: null,taxType: '19'}]"
+            />
+            Netto
+          </InputGroup>
+
+          <table v-if="itemInfo.accounts.length > 1">
+            <tr>
+              <td>Gesamt exkl. Steuer: </td>
+              <td class="text-right">{{totalCalculated.totalNet.toFixed(2)}} €</td>
+            </tr>
+            <tr>
+              <td>19% Steuer: </td>
+              <td class="text-right">{{totalCalculated.totalAmount19Tax.toFixed(2)}} €</td>
+            </tr>
+            <tr>
+              <td>Gesamt inkl. Steuer: </td>
+              <td class="text-right">{{totalCalculated.totalGross.toFixed(2)}} €</td>
+            </tr>
+          </table>
+
+          <div
+              class="my-3"
+              v-for="(item,index) in itemInfo.accounts"
           >
-            Position hinzufügen
-          </UButton>
-          <UButton
-              v-if="index !== 0"
-              class="mt-3"
-              variant="ghost"
-              color="rose"
-              @click="itemInfo.accounts = itemInfo.accounts.filter((account,itemIndex) => itemIndex !== index)"
-          >
-            Position entfernen
-          </UButton>
+
+            <UFormGroup
+                label="Kategorie"
+                class=" mb-3"
+            >
+              <USelectMenu
+                  :options="dataStore.accounts"
+                  option-attribute="label"
+                  value-attribute="id"
+                  searchable
+                  :search-attributes="['label']"
+                  searchable-placeholder="Suche..."
+                  v-model="item.account"
+              >
+                <template #label>
+                  {{dataStore.accounts.find(account => account.id === item.account) ? dataStore.accounts.find(account => account.id === item.account).label : "Keine Kategorie ausgewählt" }}
+                </template>
+
+              </USelectMenu>
+            </UFormGroup>
+            <UFormGroup
+                label="Kostenstelle"
+                class=" mb-3"
+            >
+              <USelectMenu
+                  :options="dataStore.getCostCentresComposed"
+                  option-attribute="label"
+                  value-attribute="id"
+                  searchable
+                  :search-attributes="['label']"
+                  searchable-placeholder="Suche..."
+                  v-model="item.costCentre"
+              >
+                <template #label>
+                  {{dataStore.getCostCentresComposed.find(account => account.id === item.costCentre) ? dataStore.getCostCentresComposed.find(account => account.id === item.costCentre).label : "Keine Kostenstelle ausgewählt" }}
+                </template>
+
+              </USelectMenu>
+            </UFormGroup>
+
+
+
+            <InputGroup>
+              <UFormGroup
+                  label="Umsatzsteuer"
+                  class="w-32"
+                  :help="`Betrag: ${item.amountTax ? String(item.amountTax).replace('.',',') : '0,00'} €`"
+              >
+                <USelectMenu
+                    :options="taxOptions"
+                    v-model="item.taxType"
+                    value-attribute="key"
+                    option-attribute="label"
+                    @change="item.amountTax = Number(((item.amountNet ? item.amountNet : 0) * (Number(taxOptions.find(i => i.key === item.taxType).percentage)/100)).toFixed(2))"
+                >
+                  <template #label>
+                    <span class="truncate">{{taxOptions.find(i => i.key === item.taxType) ? taxOptions.find(i => i.key === item.taxType).label : ""}}</span>
+                  </template>
+                </USelectMenu>
+              </UFormGroup>
+              <UFormGroup
+                  v-if="useNetMode"
+                  label="Gesamtbetrag exkl. Steuer in EUR"
+                  class="flex-auto"
+                  :help="item.taxType !== null ? `Betrag inkl. Steuern: ${String(Number(item.amountNet + item.amountTax).toFixed(2)).replace('.',',')} €` : 'Zuerst Steuertyp festlegen' "
+
+              >
+                <UInput
+                    type="number"
+                    step="0.01"
+                    v-model="item.amountNet"
+                    :disabled="item.taxType === null"
+                    @keyup="item.amountTax = Number((item.amountNet * (Number(item.taxType)/100)).toFixed(2))"
+                >
+                  <template #trailing>
+                    <span class="text-gray-500 dark:text-gray-400 text-xs">EUR</span>
+                  </template>
+                </UInput>
+              </UFormGroup>
+              <UFormGroup
+                  v-else
+                  label="Gesamtbetrag inkl. Steuer in EUR"
+                  class="flex-auto"
+                  :help="item.taxType !== null ? `Betrag exkl. Steuern: ${item.amountNet ? String(item.amountNet.toFixed(2)).replace('.',',') : '0,00'} €` : 'Zuerst Steuertyp festlegen' "
+
+              >
+                <UInput
+                    type="number"
+                    step="0.01"
+                    :disabled="item.taxType === null"
+                    v-model="item.amountGross"
+                    @keyup="item.amountNet = Number((item.amountGross / (1 + Number(item.taxType)/100)).toFixed(2)),
+                  item.amountTax = Number((item.amountGross - item.amountNet).toFixed(2))"
+                >
+                  <template #trailing>
+                    <span class="text-gray-500 dark:text-gray-400 text-xs">EUR</span>
+                  </template>
+                </UInput>
+
+              </UFormGroup>
+
+
+            </InputGroup>
+
+
+            <UButton
+                class="mt-3"
+                @click="itemInfo.accounts = [...itemInfo.accounts.slice(0,index+1),{account:null, amountNet: null, amountTax:null, taxType: '19'} , ...itemInfo.accounts.slice(index+1)]"
+            >
+              Position hinzufügen
+            </UButton>
+            <UButton
+                v-if="index !== 0"
+                class="mt-3"
+                variant="ghost"
+                color="rose"
+                @click="itemInfo.accounts = itemInfo.accounts.filter((account,itemIndex) => itemIndex !== index)"
+            >
+              Position entfernen
+            </UButton>
+
+          </div>
 
         </div>
-
       </div>
     </div>
-  </div>
+  </UDashboardPanelContent>
+
 
 
 
diff --git a/pages/incomingInvoices/index.vue b/pages/incomingInvoices/index.vue
index c2f2df9..615aa9a 100644
--- a/pages/incomingInvoices/index.vue
+++ b/pages/incomingInvoices/index.vue
@@ -120,7 +120,7 @@ const filteredRows = computed(() => {
         {{dayjs(row.dueDate).format("DD.MM.YYYY")}}
       </template>
       <template #paid-data="{row}">
-        <span v-if="row.paid" class="text-primary-500">Bezahlt</span>
+        <span v-if="dataStore.bankstatements.find(x => x.assignments.find(y => y.type === 'incomingInvoice' && y.id === row.id))" class="text-primary-500">Bezahlt</span>
         <span v-else class="text-rose-600">Offen</span>
       </template>
     </UTable>
diff --git a/stores/data.js b/stores/data.js
index 1d0d561..0b51194 100644
--- a/stores/data.js
+++ b/stores/data.js
@@ -130,6 +130,10 @@ export const useDataStore = defineStore('data', () => {
             label: "Kontobewegungen",
             labelSingle: "Kontobewegung",
             historyItemHolder: "bankStatement",
+        },
+        statementallocations: {
+            label: "Bankzuweisungen",
+            labelSingle: "Bankzuweisung"
         }
     }
 
@@ -809,7 +813,7 @@ export const useDataStore = defineStore('data', () => {
         } else if (supabaseData) {
             console.log(supabaseData)
             await generateHistoryItems(dataType, supabaseData[0])
-            await eval( dataType + '.value.push(' + JSON.stringify(...supabaseData) + ')')
+            //await eval( dataType + '.value.push(' + JSON.stringify(...supabaseData) + ')')
             toast.add({title: `${dataTypes[dataType].labelSingle} hinzugefügt`})
             if(dataTypes[dataType].redirect) await router.push(`/${dataType}/show/${supabaseData[0].id}`)
             return supabaseData
@@ -1526,12 +1530,12 @@ export const useDataStore = defineStore('data', () => {
         return workingtimes.value.find(item => item.id === itemId)
     })
 
-    const getOpenDocuments = computed(() => (itemId) => {
+    /*const getOpenDocuments = computed(() => (itemId) => {
 
         let items = createddocuments.value.filter(i => i.type === "invoices" || i.type === "advanceInvoices")
-        items = items.filter(i => bankstatements.value.filter(x => x.assignments.find(y => y.id === i.id)).length === 0)
+        items = items.filter(i => bankstatements.value.filter(x => x.assignments.find(y => y.type === 'createdDocument' && y.id === i.id)).length === 0)
 
-        /*let finalItems = []
+        /!*let finalItems = []
         items.forEach(item => {
             if(bankstatements.value.filter(i => i.assignments.find(x => x.id === item.id))){
                 finalItems.push(item)
@@ -1539,16 +1543,18 @@ export const useDataStore = defineStore('data', () => {
 
         })
 
-        return finalItems*/
+        return finalItems*!/
 
         return items
 
         //return createddocuments.value.filter(i => (i.type === "invoices" || i.type === "advanceInvoices") && !bankstatements.value.some(x => x.amount -))
 
-    })
+    })*/
     const getOpenIncomingInvoices = computed(() => (itemId) => {
 
-        return incominginvoices.value.filter(i => !i.paid)
+        return incominginvoices.value.filter(i => bankstatements.value.filter(x => x.assignments.find(y => y.type === 'incomingInvoice' && y.id === i.id)).length === 0)
+
+        //return incominginvoices.value.filter(i => !i.paid)
 
     })
 
@@ -1726,7 +1732,7 @@ export const useDataStore = defineStore('data', () => {
         getBankAccountById,
         getEventById,
         getWorkingTimeById,
-        getOpenDocuments,
+        //getOpenDocuments,
         getOpenIncomingInvoices
     }