Added Saldo and Count

pages/accounts/index.vue

@@ -1,6 +1,7 @@
 <script setup>
 
 import dayjs from "dayjs";
+import {useSupabaseSelect} from "~/composables/useSupabase.js";
 
 definePageMeta({
   middleware: "auth"
@@ -20,9 +21,80 @@ const router = useRouter()
 const supabase = useSupabaseClient()
 
 const items = ref([])
+const dataLoaded = ref(false)
 
 const setupPage = async () => {
   items.value = (await supabase.from("accounts").select("*").order("number", {ascending:true})).data
+
+  items.value = await Promise.all(items.value.map(async (i) => {
+    let renderedAllocationsTemp = await renderedAllocations(i.id)
+    let saldo = getSaldo(renderedAllocationsTemp)
+
+    return {
+      ...i,
+      saldo: saldo,
+      allocations: renderedAllocationsTemp.length,
+    }
+
+  }))
+  dataLoaded.value = true
+
+
+}
+
+const renderedAllocations = async (account) => {
+
+  let statementallocations = (await supabase.from("statementallocations").select("*, bs_id(*)").eq("account", account).eq("tenant",profileStore.currentTenant).order("created_at",{ascending: true})).data
+  let incominginvoices = (await useSupabaseSelect("incominginvoices", "*, vendor(*)")).filter(i => i.accounts.find(x => x.account === account))
+
+  let tempstatementallocations = statementallocations.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.forEach(i => {
+
+    incominginvoicesallocations.push(...i.accounts.filter(x => x.account === account).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",
+        expense: i.expense
+      }
+    }))
+  })
+
+  return [...tempstatementallocations, ... incominginvoicesallocations]
+}
+
+const getSaldo = (allocations) => {
+  let value = 0
+
+  allocations.forEach(i => {
+    if(i.incominginvoiceid) {
+      if(i.expense) {
+        value = value - i.amount
+      } else {
+        value += i.amount
+      }
+    } else {
+      value += i.amount
+    }
+  })
+
+  return value
 }
 
 const templateColumns = [
@@ -32,8 +104,13 @@ const templateColumns = [
   },{
     key: "label",
     label: "Name"
-  },
-  {
+  },{
+    key: "allocations",
+    label: "Buchungen"
+  },{
+    key: "saldo",
+    label: "Saldo"
+  }, {
     key: "description",
     label: "Beschreibung"
   },
@@ -49,15 +126,6 @@ const clearSearchString = () => {
   searchString.value = ''
 }
 
-
-const displayCurrency = (value, currency = "€") => {
-  return `${Number(value).toFixed(2).replace(".",",")} ${currency}`
-}
-
-
-
-
-
 const selectedFilters = ref(['Nur offene anzeigen'])
 
 const filteredRows = computed(() => {
@@ -134,7 +202,15 @@ setupPage()
       @select="(i) => router.push(`/accounts/show/${i.id}`)"
       :empty-state="{ icon: 'i-heroicons-circle-stack-20-solid', label: 'Keine Buchungen anzuzeigen' }"
   >
+    <template #allocations-data="{row}">
+        <span v-if="dataLoaded">{{row.allocations ? row.allocations : null}}</span>
+      <USkeleton v-else class="h-4 w-[250px]" />
 
+    </template>
+    <template #saldo-data="{row}">
+      <span v-if="dataLoaded">{{row.allocations ? useCurrency(row.saldo) : null}}</span>
+      <USkeleton v-else class="h-4 w-[250px]" />
+    </template>
   </UTable>
 
 

pages/accounts/show/[id].vue

@@ -53,7 +53,8 @@ const renderedAllocations = computed(() => {
         date: i.date,
         partner: i.vendor.name,
         description: i.description,
-        color: i.expense ? "red" : "green"
+        color: i.expense ? "red" : "green",
+        expense: i.expense
       }
     }))
   })
@@ -61,6 +62,24 @@ const renderedAllocations = computed(() => {
   return [...tempstatementallocations, ... incominginvoicesallocations]
 })
 
+const saldo = computed(() => {
+  let value = 0
+
+  renderedAllocations.value.forEach(i => {
+    if(i.incominginvoiceid) {
+      if(i.expense) {
+        value = value - i.amount
+      } else {
+        value += i.amount
+      }
+    } else {
+      value += i.amount
+    }
+  })
+
+  return value
+})
+
 </script>
 
 <template>
@@ -102,6 +121,14 @@ const renderedAllocations = computed(() => {
                 <td>Name:</td>
                 <td>{{itemInfo.label}}</td>
               </tr>
+              <tr>
+                <td>Anzahl:</td>
+                <td>{{renderedAllocations.length}}</td>
+              </tr>
+              <tr>
+                <td>Saldo:</td>
+                <td>{{useCurrency(saldo)}}</td>
+              </tr>
               <tr>
                 <td>Beschreibung:</td>
                 <td>{{itemInfo.description}}</td>