Many Changes

spaces/pages/vendorinvoices/[mode]/[[id]].vue

@@ -69,6 +69,97 @@
         />
       </UFormGroup>
 
+      <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>
+
+        <InputGroup>
+          <UFormGroup
+            label="Steuer"
+            class="w-32"
+            :help="`Betrag: ${String(item.amountTax).replace('.',',')} €`"
+          >
+            <USelectMenu
+              :options="[19,7,0]"
+              v-model="item.taxType"
+            >
+              <template #label>
+                {{item.taxType}} %
+              </template>
+            </USelectMenu>
+          </UFormGroup>
+          <UFormGroup
+            label="Gesamtbetrag exkl. Steuer in EUR"
+            class="flex-auto"
+            :help="`Betrag inkl. Steuern: ${String(Number(calculateWithTax(item)) + Number(item.amountNet)).replace('.',',')} €` "
+
+          >
+            <UInput
+              type="number"
+              step="0.01"
+              v-model="item.amountNet"
+            >
+              <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: null} , ...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>
+
+
+<!--
+      <UFormGroup label="Kategorie:" required>
+        <USelectMenu
+          :options="dataStore.accounts"
+          option-attribute="label"
+          value-attribute="number"
+          searchable
+          :search-attributes="['label']"
+          v-model="itemInfo.account"
+        >
+
+        </USelectMenu>
+      </UFormGroup>
       <UFormGroup label="Betrag:" required>
         <UInput
           type="number"
@@ -79,7 +170,7 @@
             <span class="text-gray-500 dark:text-gray-400 text-xs">EUR</span>
           </template>
         </UInput>
-      </UFormGroup>
+      </UFormGroup>-->
 
       <InputGroup class="mt-3">
         <UButton
@@ -117,6 +208,48 @@ let currentDocument  = ref(null)
 //Working
 const mode = ref(route.params.mode || "show")
 
+const types = [
+  {
+    number: "3200",
+    label: "Wareneinkauf",
+    description: "Der Einkauf von Produkten umfasst auch die Kosten für die Bearbeitung/Verarbeitung und den Handel"
+  },{
+    number: "3000",
+    label: "Materialeinkauf",
+    description: "Hierzu gehören sämtliche Kosten, die im Rahmen der Produktion für Roh, Hilfs- und Betriebsstoffe anfallen."
+  },{
+    number: "3800",
+    label: "Bezugsnebenkosten",
+    description: "Dazu zählen alle Beschaffungskosten für Material und Waren bzw. Produkte"
+  },{
+    number: "4930",
+    label: "Bürobedarf",
+    description: ""
+  },{
+    number: "4964",
+    label: "Lizenzen und Konzessionen",
+    description: ""
+  },{
+    number: "4925",
+    label: "Internet",
+    description: ""
+  },{
+    number: "4920",
+    label: "Telekommunikation",
+    description: ""
+  },{
+    number: "4530",
+    label: "Kraftstoff/Ladestrom",
+    description: ""
+  },{
+    number: "4969",
+    label: "Müllgebühren",
+    description: ""
+  }
+]
+
+
+
 
 //Functions
 const setupPage = async () => {
@@ -139,9 +272,24 @@ const itemInfo = ref({
   dueDate: null,
   paymentType: "",
   description: "",
-  state: "Entwurf"
+  state: "Entwurf",
+  accounts: [
+    {
+      account: null,
+      amountNet: null,
+      amountTax: null,
+      taxType: null
+    }
+  ]
 })
 
+const calculateWithTax = (item) => {
+  item.amountTax = Number((item.amountNet / 100 *  Number(item.taxType)).toFixed(2))
+
+  return item.amountTax
+}
+
+
 const updateItem = async () => {
   const {error} = await supabase
       .from("vendorInvoices")