From eb1eacdad949b7b9e644edc5aeadde2d63fb1324 Mon Sep 17 00:00:00 2001
From: florianfederspiel <florian@fedeo.de>
Date: Mon, 27 Jan 2025 18:14:33 +0100
Subject: [PATCH] Changes in Statement Allocation and Open Sum Calc

---
 pages/banking/index.vue                    | 108 +-------
 pages/banking/statements/[mode]/[[id]].vue | 276 +++++++++++++--------
 2 files changed, 184 insertions(+), 200 deletions(-)

diff --git a/pages/banking/index.vue b/pages/banking/index.vue
index 51b5f87..928daad 100644
--- a/pages/banking/index.vue
+++ b/pages/banking/index.vue
@@ -11,32 +11,21 @@ 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 profileStore = useProfileStore()
 const router = useRouter()
 const supabase = useSupabaseClient()
 
 const bankstatements = ref([])
-
+const bankaccounts = ref([])
 
 const setupPage = async () => {
   bankstatements.value = (await supabase.from("bankstatements").select("*, statementallocations(*)").eq('tenant', profileStore.currentTenant).order("date", {ascending:false})).data
-
+  bankaccounts.value = await useSupabaseSelect("bankaccounts")
 }
 
-
-
-const selectedStatement = ref(null)
-const showStatementModal = ref(false)
-
 const templateColumns = [
   {
     key: "account",
@@ -73,35 +62,23 @@ const columns = computed(() => templateColumns.filter((column) => selectedColumn
 
 
 const searchString = ref('')
-const filterAccount = ref(dataStore.bankAccounts || [])
+const filterAccount = ref(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
+  let startingAmount = 0
 
   statement.statementallocations.forEach(item => {
-    if(item.cd_id) {
-      startingAmount = startingAmount - item.amount
-    } else if(item.ii_id) {
-      startingAmount = Number(startingAmount) + item.amount
-    }
+    startingAmount += Math.abs(item.amount)
   })
 
-  return startingAmount.toFixed(2)
+  return (Math.abs(statement.amount) - startingAmount).toFixed(2)
 }
 
 
@@ -134,11 +111,12 @@ setupPage()
   <UDashboardToolbar>
     <template #left>
       <USelectMenu
-        :options="dataStore.bankAccounts"
+        :options="bankaccounts"
         v-model="filterAccount"
         option-attribute="iban"
         multiple
         by="id"
+        :ui-menu="{ width: 'min-w-max' }"
       >
         <template #label>
           Konto
@@ -158,6 +136,7 @@ setupPage()
           multiple
           class="hidden lg:block"
           by="key"
+          :ui-menu="{ width: 'min-w-max' }"
       >
         <template #label>
           Spalten
@@ -175,7 +154,7 @@ setupPage()
   >
 
     <template #account-data="{row}">
-      {{row.account ? (dataStore.getBankAccountById(row.account).name ? dataStore.getBankAccountById(row.account).name :dataStore.getBankAccountById(row.account).iban) : ""}}
+      {{row.account ? bankaccounts.find(i => i.id === row.account).iban : ""}}
     </template>
     <template #valueDate-data="{row}">
       {{dayjs(row.valueDate).format("DD.MM.YY")}}
@@ -207,72 +186,7 @@ setupPage()
     </template>
   </UTable>
 
-  <UModal
-    v-model="showStatementModal"
-    class="no-doc-sroll"
-  >
 
-    <UCard class="h-full">
-      <template #header>
-        <div class="flex items-center justify-between">
-          <span
-              v-if="selectedStatement.amount > 0"
-              class="text-base font-semibold leading-6 text-gray-900 dark:text-white"
-          >
-            {{selectedStatement.debName}}
-          </span>
-          <span
-              v-else-if="selectedStatement.amount < 0"
-              class="text-base font-semibold leading-6 text-gray-900 dark:text-white"
-          >
-            {{selectedStatement.credName}}
-          </span>
-
-          <UButton color="gray" variant="ghost" icon="i-heroicons-x-mark-20-solid" class="-my-1" @click="showStatementModal = false" />
-        </div>
-      </template>
-
-      {{selectedStatement.id}}
-
-      <div class="flex flex-row">
-        <div class="w-1/2 truncate">
-          <p>Betrag: {{String(selectedStatement.amount.toFixed(2)).replace(".",",")}} €</p>
-          <p>Buchungsdatum: {{dayjs(selectedStatement.date).format("DD.MM.YYYY")}}</p>
-          <p>Werstellungsdatum: {{dayjs(selectedStatement.valueDate).format("DD.MM.YYYY")}}</p>
-          <p>Partner: {{selectedStatement.amount > 0 ? selectedStatement.debName : selectedStatement.credName}}</p>
-          <p>Partner IBAN: {{selectedStatement.amount > 0 ? selectedStatement.debIban : selectedStatement.credIban}}</p>
-          <p>Konto: {{selectedStatement.account}}</p>
-          <p class="text-wrap">Beschreibung: <br>{{selectedStatement.text}}</p>
-        </div>
-        <div class="w-full p-2 overflow-scroll">
-          <UCard
-              v-for="document in dataStore.getOpenDocuments()"
-          >
-
-
-            {{document.documentNumber ||document.reference}}
-            <!--        {{document}}-->
-          </UCard>
-        </div>
-      </div>
-
-
-
-
-
-
-
-<!--      <UFormGroup>
-        <USelectMenu
-          :options="dataStore.createddocuments"
-        />
-      </UFormGroup>-->
-
-
-
-    </UCard>
-
-  </UModal>
 </template>
 
 
diff --git a/pages/banking/statements/[mode]/[[id]].vue b/pages/banking/statements/[mode]/[[id]].vue
index 378abf9..e77c587 100644
--- a/pages/banking/statements/[mode]/[[id]].vue
+++ b/pages/banking/statements/[mode]/[[id]].vue
@@ -29,6 +29,7 @@ const openIncomingInvoices = ref([])
 
 const accounts = ref([])
 
+const loading = ref(true)
 const setup = async () => {
   if(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))
@@ -42,12 +43,13 @@ const setup = async () => {
   openDocuments.value = documents.filter(i => i.statementallocations.reduce((n,{amount}) => n + amount, 0).toFixed(2) !== getDocumentSum(i).toFixed(2))
   openDocuments.value = openDocuments.value.map(i => {
 
+    console.log()
 
     return {
         ...i,
-      docTotal: getDocumentSum(i),
+      docTotal: getDocumentSum(i, i.usedAdvanceInvoices.map(i => getDocumentSum(documents.find(x => x.id === i)))),
       statementTotal: Number(i.statementallocations.reduce((n,{amount}) => n + amount, 0)),
-      openSum: (Number(getDocumentSum(i)) - Number(i.statementallocations.reduce((n,{amount}) => n + amount, 0))).toFixed(2)
+      openSum: (Number(getDocumentSum(i, i.usedAdvanceInvoices.map(i => getDocumentSum(documents.find(x => x.id === i))))) - Number(i.statementallocations.reduce((n,{amount}) => n + amount, 0))).toFixed(2)
     }
   })
 
@@ -63,7 +65,7 @@ const setup = async () => {
 
   let allocations = (await supabase.from("createddocuments").select(`*, statementallocations(*)`).eq("id",50)).data
 
-
+  loading.value = false
 
 }
 
@@ -71,19 +73,36 @@ const displayCurrency = (value, currency = "€") => {
   return `${Number(value).toFixed(2).replace(".",",")} ${currency}`
 }
 
-const separateIBAN = (input)  => {
+const separateIBAN = (input = "")  => {
   const separates = input.match(/.{1,4}/g)
   return separates.join(" ")
 }
 
-const getDocumentSum = (doc) => {
+const getDocumentSum = (doc,advanceInvoices = []) => {
   let sum = 0
+
+  console.log(advanceInvoices)
+
   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
+
+  console.log(sum)
+
+  if(advanceInvoices.length > 0) {
+    advanceInvoices.forEach(i => {
+      console.log(i)
+      sum -= i
+    })
+  }
+
+  console.log(sum)
+
+
+
+  return Number(sum.toFixed(2))
 }
 
 const getInvoiceSum = (invoice) => {
@@ -96,37 +115,16 @@ const getInvoiceSum = (invoice) => {
 }
 
 const calculateOpenSum = computed(() => {
-    let startingAmount = itemInfo.value.amount || 0
+    let startingAmount = 0
 
     itemInfo.value.statementallocations.forEach(item => {
-      if(item.cd_id) {
-        startingAmount = startingAmount - item.amount
-      } else if(item.ii_id) {
-        startingAmount = Number(startingAmount) + item.amount
-      }else if(item.account) {
-        startingAmount = Number(startingAmount) - item.amount
-      }
+      startingAmount += Math.abs(item.amount)
     })
 
-    return startingAmount.toFixed(2)
+    return (Math.abs(itemInfo.value.amount) - startingAmount).toFixed(2)
 })
 
-const calculateAllocatedSum = computed(() => {
-  let startingAmount = 0
 
-  itemInfo.value.statementallocations.forEach(item => {
-    console.log(item)
-
-    if(item.cd_id) {
-      startingAmount = startingAmount + item.amount
-    } else if(item.ii_id) {
-      startingAmount = Number(startingAmount) + item.amount
-    }
-  })
-
-  return startingAmount
-
-})
 
 const saveAllocations = async () =>  {
   let allocationsToBeSaved = itemInfo.value.statementallocations.filter(i => !i.id)
@@ -138,6 +136,14 @@ const saveAllocations = async () =>  {
 
 }
 
+const showAccountSelection = ref(false)
+const accountToSave = ref("")
+
+const selectAccount = (id) => {
+  accountToSave.value = id
+  showAccountSelection.value = false
+}
+
 const saveAllocation = async (allocation) => {
   const {data,error} = await supabase.from("statementallocations").insert({
     ...allocation,
@@ -184,37 +190,9 @@ setup()
     </template>
     <template #center>
       <h1
-          :class="['text-xl','font-medium', Number(calculateOpenSum) === 0 ? ['text-primary-500'] : ['text-rose-600']]"
+          :class="['text-xl','font-medium']"
       >Kontobewegung bearbeiten</h1>
     </template>
-    <template #right>
-<!--      <UButton
-          v-if="mode === 'edit'"
-          @click="saveAllocations"
-      >
-        Speichern
-      </UButton>-->
-      <!--<UButton
-          v-else-if="mode === 'create'"
-          @click="dataStore.createNewItem('customers',itemInfo)"
-      >
-        Erstellen
-      </UButton>
-      <UButton
-          @click="cancelEditorCreate"
-          color="red"
-          class="ml-2"
-          v-if="mode === 'edit' || mode === 'create'"
-      >
-        Abbrechen
-      </UButton>
-      <UButton
-          v-if="mode === 'show'"
-          @click="editItem"
-      >
-        Bearbeiten
-      </UButton>-->
-    </template>
     <template #badge v-if="itemInfo">
       <UBadge
           v-if="itemInfo.incomingInvoice || itemInfo.createdDocument"
@@ -232,9 +210,10 @@ setup()
 
   <UDashboardPanelContent
     class="flex flex-row"
+    v-if="!loading"
   >
     <UCard
-        class="w-2/5 mx-auto mt-5"
+        class="w-2/5 mx-auto "
         v-if="itemInfo"
     >
       <template #header>
@@ -282,7 +261,9 @@ setup()
               <span class="font-semibold">Partner:</span>
             </td>
             <td>
-              {{itemInfo.amount > 0 ? itemInfo.debName : itemInfo.credName}}
+              <span v-if="itemInfo.debName">{{itemInfo.debName}}</span>
+              <span v-else-if="itemInfo.credName">{{itemInfo.credName}}</span>
+              <span v-else>-</span>
 
             </td>
           </tr>
@@ -291,7 +272,9 @@ setup()
               <span class="font-semibold">Partner IBAN:</span>
             </td>
             <td>
-              {{itemInfo.amount > 0 ? separateIBAN(itemInfo.debIban) : separateIBAN(itemInfo.credIban)}}
+              <span v-if="itemInfo.debIban">{{itemInfo.debIban}}</span>
+              <span v-else-if="itemInfo.credIban">{{itemInfo.credIban}}</span>
+              <span v-else>-</span>
             </td>
           </tr>
           <tr class="flex-row flex justify-between">
@@ -356,19 +339,41 @@ setup()
 
     </UCard>
 
-<!--    <UDivider
-        class="mt-5 w-2/5 mx-auto"
-        v-if="!itemInfo.createdDocument && !itemInfo.incomingInvoice"
-    />-->
+    <div class="w-2/5 mx-auto">
+      <UAlert
+          class="mb-3"
+          :color="calculateOpenSum > 0 ? 'rose' : 'primary'"
+          variant="outline"
+          :title="calculateOpenSum > 0 ? `${displayCurrency(calculateOpenSum)} von ${displayCurrency(Math.abs(itemInfo.amount))} nicht zugewiesen` : 'Kontobewegung vollständig zugewiesen'"
+      >
+        <template #description>
+          <UProgress
+              :value="Math.abs(itemInfo.amount) - calculateOpenSum"
+              :max="Math.abs(itemInfo.amount)"
+              :color="calculateOpenSum > 0 ? 'rose' : 'primary'"
+          />
+        </template>
+      </UAlert>
 
-    <div
-        class="w-2/5 mx-auto"
-        v-if="itemInfo.amount > 0 "
-    >
+      <UCard
+          class="mt-5"
+          v-for="item in itemInfo.statementallocations.filter(i => i.account)"
+      >
+        <template #header>
+          <div class="flex flex-row justify-between">
+            <span>{{accounts.find(i => i.id === item.account).number}} - {{accounts.find(i => i.id === item.account).label}}</span>
+            <span class="font-semibold text-nowrap">{{displayCurrency(item.amount)}}</span>
+          </div>
+        </template>
+        <UButton
+            icon="i-heroicons-x-mark"
+            variant="outline"
+            color="rose"
+            class="mr-3"
+            @click="removeAllocation(itemInfo.statementallocations.find(i => i.account === item.account).id)"
+        />
+      </UCard>
 
-      <UDivider v-if="allocatedDocuments.length > 0">
-        <span>Zugewiesene Summe: {{displayCurrency(calculateAllocatedSum)}}</span>
-      </UDivider>
       <UCard
           class="mt-5"
           :ui="{ring: itemInfo.statementallocations.find(i => i.cd_id === document.id) ? 'ring-primary-500' : 'ring-gray-200 dark:ring-gray-800'}"
@@ -377,7 +382,7 @@ setup()
         <template #header>
           <div class="flex flex-row justify-between">
             <span>{{document.customer ? document.customer.name : ""}} - {{document.documentNumber}}</span>
-            <span class="font-semibold text-primary-500 text-nowrap">{{displayCurrency(getDocumentSum(document))}}</span>
+            <span class="font-semibold text-nowrap">{{displayCurrency(getDocumentSum(document))}}</span>
           </div>
         </template>
         <UButton
@@ -402,28 +407,100 @@ setup()
             @click="router.push(`/createDocument/show/${document.id}`)"
         />
       </UCard>
-      <UDivider class="mt-3">
-        <span>Offene Summe: {{displayCurrency(calculateOpenSum)}}</span>
-      </UDivider>
-      <UInput
-          id="searchinput"
-          v-model="searchString"
-          icon="i-heroicons-funnel"
-          autocomplete="off"
-          placeholder="Suche..."
-          class="hidden lg:block mt-3"
-          @keydown.esc="$event.target.blur()"
-      >
-        <template #trailing>
-          <UKbd value="/" />
-        </template>
-      </UInput>
 
-      <UButton
-        @click="saveAllocation({bs_id: itemInfo.id, amount: Number(itemInfo.amount), account: 20 })"
+      <UDivider class="my-3">Ohne Beleg buchen</UDivider>
+
+      <InputGroup class="mt-3 w-full">
+        <USelectMenu
+            class="w-full"
+            :options="accounts"
+            value-attribute="id"
+            option-attribute="label"
+            :ui-menu="{ width: 'min-w-max' }"
+            v-model="accountToSave"
+            searchable
+            :search-attributes="['number','label']"
+        >
+          <template #label>
+            <span v-if="accountToSave">{{accounts.find(i => i.id === accountToSave).number}} - {{accounts.find(i => i.id === accountToSave).label}}</span>
+            <span v-else>Kein Konto ausgewählt</span>
+          </template>
+          <template #option="{option}">
+            {{option.number}} - {{option.label}}
+          </template>
+        </USelectMenu>
+        <UButton
+            @click="showAccountSelection = true"
+            icon="i-heroicons-magnifying-glass"
+        />
+        <UButton
+            variant="outline"
+            icon="i-heroicons-check"
+            @click="saveAllocation({bs_id: itemInfo.id, amount: Number(itemInfo.amount), account: accountToSave })"
+        >
+          Buchen
+        </UButton>
+        <UButton
+            @click="accountToSave = ''"
+            icon="i-heroicons-x-mark"
+            variant="outline"
+            color="rose"
+        />
+      </InputGroup>
+      <UModal
+          v-model="showAccountSelection"
       >
-        Als DP markieren
-      </UButton>
+        <UCard>
+          <template #header>
+            <div class="flex items-center justify-between">
+              <h3 class="text-base font-semibold leading-6 text-gray-900 dark:text-white">
+                Konto auswählen
+              </h3>
+              <UButton color="gray" variant="ghost" icon="i-heroicons-x-mark-20-solid" class="-my-1" @click="showAccountSelection = false" />
+            </div>
+          </template>
+          <UButton
+              v-for="selectableAccount in accounts"
+              variant="outline"
+              class="m-3"
+              @click="selectAccount(selectableAccount.id)"
+          >
+            {{selectableAccount.label}}
+          </UButton>
+        </UCard>
+
+      </UModal>
+
+      <UDivider
+          class="my-3"
+      >
+        Auf Beleg buchen
+      </UDivider>
+
+      <InputGroup
+          class="mt-3 w-full"
+      >
+        <UInput
+            id="searchinput"
+            v-model="searchString"
+            icon="i-heroicons-funnel"
+            autocomplete="off"
+            placeholder="Suche..."
+            class="hidden lg:block w-full mr-1"
+            @keydown.esc="$event.target.blur()"
+        >
+          <template #trailing>
+            <UKbd value="/" />
+          </template>
+        </UInput>
+        <UButton
+            variant="outline"
+            icon="i-heroicons-x-mark"
+            color="rose"
+            @click="searchString = ''"
+        />
+      </InputGroup>
+
 
       <UCard
           class="mt-5"
@@ -459,14 +536,6 @@ setup()
         />
       </UCard>
 
-    </div>
-    <div
-        class="w-2/5 mx-auto"
-        v-if="itemInfo.amount < 0 "
-    >
-      <UDivider>
-        <span>Offene Summe: {{displayCurrency(calculateOpenSum)}}</span>
-      </UDivider>
       <UCard
           class="mt-5"
           :ui="{ring: /*itemInfo.assignments.find(i => i.id === invoice.id)*/ false ? 'ring-primary-500' : 'ring-gray-200 dark:ring-gray-800'}"
@@ -474,7 +543,7 @@ setup()
       >
         <template #header>
           <div class="flex flex-row justify-between">
-            <span>{{dataStore.getVendorById(item.vendor).name}} - {{item.reference}}</span>
+            <span>{{dataStore.getVendorById(item.vendor) ? dataStore.getVendorById(item.vendor).name : ''}} - {{item.reference}}</span>
             <span class="font-semibold text-rose-600 text-nowrap">-{{displayCurrency(getInvoiceSum(item))}}</span>
           </div>
         </template>
@@ -501,6 +570,7 @@ setup()
 
       </UCard>
     </div>
+
   </UDashboardPanelContent>
 </template>