Added IncomingInvoices to Accounts

pages/accounts/show/[id].vue

@@ -1,6 +1,7 @@
 <script setup>
 
 import dayjs from "dayjs";
+import {useSupabaseSelect} from "~/composables/useSupabase.js";
 
 const supabase = useSupabaseClient()
 const route = useRoute()
@@ -8,21 +9,57 @@ const router = useRouter()
 const profileStore = useProfileStore()
 
 const itemInfo = ref(null)
-const statementallocations = ref(null)
+const statementallocations = ref([])
+const incominginvoices = ref([])
 
 const setup = async () => {
   itemInfo.value = (await supabase.from("accounts").select("*").eq("id",route.params.id).single()).data
   statementallocations.value = (await supabase.from("statementallocations").select("*, bs_id(*)").eq("account", route.params.id).eq("tenant",profileStore.currentTenant).order("created_at",{ascending: true})).data
+  incominginvoices.value = (await useSupabaseSelect("incominginvoices", "*, vendor(*)")).filter(i => i.accounts.find(x => x.account == route.params.id))
 }
 
 setup()
 
 const selectAllocation = (allocation) => {
-  if(allocation.bs_id) {
+  if(allocation.type === "statementallocation") {
     router.push(`/banking/statements/edit/${allocation.bs_id.id}`)
+  } else if(allocation.type === "incominginvoice") {
+    router.push(`/incominginvoices/show/${allocation.incominginvoiceid}`)
   }
 }
 
+const renderedAllocations = computed(() => {
+
+  let tempstatementallocations = statementallocations.value.map(i => {
+    return {
+      ...i,
+      type: "statementallocation",
+      date: i.bs_id.date,
+      partner: i.bs_id ? (i.bs_id.debName ? i.bs_id.debName : (i.bs_id.credName ? i.bs_id.credName : '')) : ''
+    }
+  })
+
+
+  let incominginvoicesallocations = []
+
+  incominginvoices.value.forEach(i => {
+
+    incominginvoicesallocations.push(...i.accounts.filter(x => x.account == route.params.id).map(x => {
+      return {
+        ...x,
+        incominginvoiceid: i.id,
+        type: "incominginvoice",
+        amount: x.amountGross ? x.amountGross : x.amountNet,
+        date: i.date,
+        partner: i.vendor.name,
+        description: i.description,
+        color: i.expense ? "red" : "green"
+      }
+    }))
+  })
+
+  return [...tempstatementallocations, ... incominginvoicesallocations]
+})
 
 </script>
 
@@ -76,21 +113,18 @@ const selectAllocation = (allocation) => {
         <UCard class="mt-5" v-if="item.label === 'Buchungen'">
           <UTable
               v-if="statementallocations"
-            :rows="statementallocations"
+            :rows="renderedAllocations"
               :columns="[{key:'amount', label:'Betrag'},{key:'date', label:'Datum'},{key:'partner', label:'Partner'},{key:'description', label:'Beschreibung'}]"
               @select="(i) => selectAllocation(i)"
               :empty-state="{ icon: 'i-heroicons-circle-stack-20-solid', label: 'Keine Buchungen anzuzeigen' }"
           >
             <template #amount-data="{row}">
-              <span class="text-right text-rose-600" v-if="row.amount < 0">{{useCurrency(row.amount)}}</span>
+              <span class="text-right text-rose-600" v-if="row.amount < 0 || row.color === 'red'">{{useCurrency(row.amount)}}</span>
-              <span class="text-right text-primary-500" v-else-if="row.amount > 0">{{useCurrency(row.amount)}}</span>
+              <span class="text-right text-primary-500" v-else-if="row.amount > 0 || row.color === 'green'">{{useCurrency(row.amount)}}</span>
               <span v-else>{{useCurrency(row.amount)}}</span>
             </template>
             <template #date-data="{row}">
-              {{row.bs_id ? dayjs(row.bs_id.date).format('DD.MM.YYYY') : ''}}
+              {{row.date ? dayjs(row.date).format('DD.MM.YYYY') : ''}}
-            </template>
-            <template #partner-data="{row}">
-              {{row.bs_id ? (row.bs_id.debName ? row.bs_id.debName : (row.bs_id.credName ? row.bs_id.credName : '')) : ''}}
             </template>
             <template #description-data="{row}">
               {{row.description ? row.description : ''}}