Many Changes

composables/useSearch.js

@@ -19,7 +19,7 @@ export const useSearch = (searchString,items) => {
 
 
 
-    return items.filter(i => JSON.stringify(i).includes(searchString))
+    return items.filter(i => JSON.stringify(i).toLowerCase().includes(searchString.toLowerCase()))
 
     /*return items.filter(item => {
         return Object.values(item).some((value) => {

pages/banking/index.vue

@@ -1,6 +1,21 @@
 <template>
   <UDashboardNavbar title="Bankbuchungen">
-
+    <template #right>
+      <UInput
+          id="searchinput"
+          name="searchinput"
+          v-model="searchString"
+          icon="i-heroicons-funnel"
+          autocomplete="off"
+          placeholder="Suche..."
+          class="hidden lg:block"
+          @keydown.esc="$event.target.blur()"
+      >
+        <template #trailing>
+          <UKbd value="/" />
+        </template>
+      </UInput>
+    </template>
   </UDashboardNavbar>
   <UDashboardToolbar>
     <template #left>
@@ -15,6 +30,11 @@
           Konto
         </template>
       </USelectMenu>
+      <UCheckbox
+          v-model="showOnlyNotAssigned"
+          class="my-auto ml-3"
+          label="Nur offene anzeigen"
+      />
     </template>
     <template #right>
       <USelectMenu
@@ -36,9 +56,10 @@
       :columns="columns"
       class="w-full"
       :ui="{ divide: 'divide-gray-200 dark:divide-gray-800' }"
-      @select="(i) => {selectedStatement = i; showStatementModal = true}"
+      @select="(i) => router.push(`/banking/statements/edit/${i.id}`)"
       :empty-state="{ icon: 'i-heroicons-circle-stack-20-solid', label: 'Keine Buchungen anzuzeigen' }"
   >
+
     <template #account-data="{row}">
       {{row.account ? (dataStore.getBankAccountById(row.account).name ? dataStore.getBankAccountById(row.account).name :dataStore.getBankAccountById(row.account).iban) : ""}}
     </template>
@@ -69,40 +90,72 @@
     </template>
   </UTable>
 
-  <USlideover
+  <UModal
     v-model="showStatementModal"
+    class="no-doc-sroll"
   >
+
     <UCard class="h-full">
       <template #header>
-        <span v-if="selectedStatement.amount > 0">
+        <div class="flex items-center justify-between">
-          {{selectedStatement.debName}}
+          <span
-        </span>
+              v-if="selectedStatement.amount > 0"
-        <span v-else-if="selectedStatement.amount < 0">
+              class="text-base font-semibold leading-6 text-gray-900 dark:text-white"
-          {{selectedStatement.credName}}
+          >
-        </span>
+            {{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>
 
-      <div class="truncate">
+      {{selectedStatement.id}}
-        <p>Betrag: {{String(selectedStatement.amount.toFixed(2)).replace(".",",")}} €</p>
+
-        <p>Buchungsdatum: {{dayjs(selectedStatement.date).format("DD.MM.YYYY")}}</p>
+      <div class="flex flex-row">
-        <p>Werstellungsdatum: {{dayjs(selectedStatement.valueDate).format("DD.MM.YYYY")}}</p>
+        <div class="w-1/2 truncate">
-        <p>Partner: {{selectedStatement.amount > 0 ? selectedStatement.debName : selectedStatement.credName}}</p>
+          <p>Betrag: {{String(selectedStatement.amount.toFixed(2)).replace(".",",")}} €</p>
-        <p>Partner IBAN: {{selectedStatement.amount > 0 ? selectedStatement.debIban : selectedStatement.credIban}}</p>
+          <p>Buchungsdatum: {{dayjs(selectedStatement.date).format("DD.MM.YYYY")}}</p>
-        <p>Konto: {{selectedStatement.account}}</p>
+          <p>Werstellungsdatum: {{dayjs(selectedStatement.valueDate).format("DD.MM.YYYY")}}</p>
-        <p class="text-wrap">Beschreibung: <br>{{selectedStatement.text}}</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>
+
+
+
+
+
+
+<!--      <UFormGroup>
         <USelectMenu
           :options="dataStore.createddocuments"
         />
-      </UFormGroup>
+      </UFormGroup>-->
 
 
 
     </UCard>
 
-  </USlideover>
+  </UModal>
 </template>
 
 <script setup>
@@ -113,6 +166,19 @@ 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()
 
@@ -151,9 +217,11 @@ const columns = computed(() => templateColumns.filter((column) => selectedColumn
 
 const searchString = ref('')
 const filterAccount = ref(dataStore.bankAccounts || [])
+const showOnlyNotAssigned = ref(true)
+
 
 const filteredRows = computed(() => {
-  return useSearch(searchString.value, dataStore.bankStatements.filter(i => filterAccount.value.find(x => x.id === i.account)))
+  return useSearch(searchString.value, dataStore.bankstatements.filter(i => filterAccount.value.find(x => x.id === i.account) && (showOnlyNotAssigned.value ? (!i.createdDocument && !i.incomingInvoice) : true)))
 })
 </script>
 

pages/banking/statements/[mode]/[[id]].vue

@@ -0,0 +1,278 @@
+<script setup>
+
+import dayjs from "dayjs";
+
+definePageMeta({
+  middleware: "auth"
+})
+
+defineShortcuts({
+  'backspace': () => {
+    router.push("/banking")
+  }
+})
+
+const dataStore = useDataStore()
+const route = useRoute()
+const router = useRouter()
+const mode = ref(route.params.mode || "show")
+
+const itemInfo = ref({})
+const oldItemInfo = ref({})
+
+const setup = () => {
+  if(route.params.id) {
+    itemInfo.value = dataStore.bankstatements.find(i => i.id === Number(route.params.id))
+  }
+  if(itemInfo.value) oldItemInfo.value = JSON.parse(JSON.stringify(itemInfo.value))
+
+}
+
+const displayCurrency = (value, currency = "€") => {
+  return `${Number(value).toFixed(2).replace(".",",")} ${currency}`
+}
+
+const separateIBAN = (input)  => {
+  const separates = input.match(/.{1,4}/g)
+  return separates.join(" ")
+}
+
+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 getInvoiceSum = (invoice) => {
+  let sum = 0
+  invoice.accounts.forEach(account => {
+    sum += account.amountTax
+    sum += account.amountNet
+  })
+  return sum
+}
+
+setup()
+
+</script>
+
+<template>
+  <UDashboardNavbar
+      :ui="{center: 'flex items-stretch gap-1.5 min-w-0'}"
+  >
+    <template #left>
+      <UButton
+          icon="i-heroicons-chevron-left"
+          variant="outline"
+          @click="router.push(`/banking`)"
+      >
+        Kontobewegungen
+      </UButton>
+    </template>
+    <template #center>
+      <h1
+          :class="['text-xl','font-medium', ... itemInfo.incomingInvoice || itemInfo.createdDocument ? ['text-primary-500'] : ['text-rose-600']]"
+      >Kontobewegung bearbeiten</h1>
+    </template>
+    <template #right>
+      <UButton
+          v-if="mode === 'edit'"
+          @click="dataStore.updateItem('bankstatements',itemInfo,oldItemInfo)"
+      >
+        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"
+      >
+        Gebucht
+      </UBadge>
+      <UBadge
+          v-else
+          color="red"
+      >
+        Offen
+      </UBadge>
+    </template>
+  </UDashboardNavbar>
+
+  <UDashboardPanelContent>
+    <UCard
+        class="w-4/5 mx-auto mt-10"
+        v-if="itemInfo"
+    >
+      <template #header>
+        <div class="flex flex-row justify-between">
+        <span
+            v-if="itemInfo.amount > 0"
+            class="text-base font-semibold leading-6 text-gray-900 dark:text-white"
+        >
+            {{itemInfo.debName}}
+          </span>
+          <span
+              v-else-if="itemInfo.amount < 0"
+              class="text-base font-semibold leading-6 text-gray-900 dark:text-white"
+          >
+            {{itemInfo.credName}}
+          </span>
+
+
+          <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>
+        </div>
+      </template>
+
+      <table class="w-full">
+        <tr class="flex-row flex justify-between">
+          <td>
+            <span class="font-semibold">Buchungsdatum:</span>
+          </td>
+          <td>
+            {{dayjs(itemInfo.date).format("DD.MM.YYYY")}}
+          </td>
+        </tr>
+        <tr class="flex-row flex justify-between">
+          <td>
+            <span class="font-semibold">Wertstellungsdatum:</span>
+          </td>
+          <td>
+            {{dayjs(itemInfo.valueDate).format("DD.MM.YYYY")}}
+          </td>
+        </tr>
+        <tr class="flex-row flex justify-between">
+          <td>
+            <span class="font-semibold">Partner:</span>
+          </td>
+          <td>
+            {{itemInfo.amount > 0 ? itemInfo.debName : itemInfo.credName}}
+          </td>
+        </tr>
+        <tr class="flex-row flex justify-between">
+          <td>
+            <span class="font-semibold">Partner IBAN:</span>
+          </td>
+          <td>
+            {{itemInfo.amount > 0 ? separateIBAN(itemInfo.debIban) : separateIBAN(itemInfo.credIban)}}
+          </td>
+        </tr>
+        <tr class="flex-row flex justify-between">
+          <td>
+            <span class="font-semibold">Konto:</span>
+          </td>
+          <td>
+            {{dataStore.getBankAccountById(itemInfo.account) ? dataStore.getBankAccountById(itemInfo.account).name || separateIBAN(dataStore.getBankAccountById(itemInfo.account).iban) : ""}}
+          </td>
+        </tr>
+        <tr class="flex-row flex justify-between">
+          <td>
+            <span class="font-semibold">Verknüpftes Dokument:</span>
+          </td>
+          <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>
+          </td>
+        </tr>
+        <tr class="flex-row flex justify-between">
+          <td colspan="2">
+            <span class="font-semibold">Beschreibung:</span>
+          </td>
+        </tr>
+        <tr>
+          <td colspan="2">
+            {{itemInfo.text}}
+          </td>
+        </tr>
+      </table>
+    </UCard>
+
+    <UDivider
+        class="mt-5 w-4/5 mx-auto"
+        v-if="!itemInfo.createdDocument && !itemInfo.incomingInvoice"
+    />
+
+    <UCard
+        class="w-4/5 mx-auto mt-5"
+        v-if="itemInfo.amount > 0 && !itemInfo.createdDocument"
+        :ui="{ring: itemInfo.createdDocument === document.id ? 'ring-primary-500' : 'ring-gray-200 dark:ring-gray-800'}"
+        v-for="document in dataStore.getOpenDocuments()"
+    >
+      <template #header>
+        <div class="flex flex-row justify-between">
+          <span>{{dataStore.getCustomerById(document.customer).name}} - {{document.documentNumber}}</span>
+          <span class="font-semibold text-primary-500">{{displayCurrency(getDocumentSum(document))}}</span>
+        </div>
+      </template>
+      <UButton
+        icon="i-heroicons-check"
+        variant="outline"
+        v-if="Number(getDocumentSum(document)) === itemInfo.amount"
+        @click="itemInfo.createdDocument = document.id"
+      />
+    </UCard>
+
+
+
+    <UCard
+      class="w-4/5 mx-auto mt-5"
+      v-else-if="itemInfo.amount < 0 && !itemInfo.incomingInvoice"
+      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>
+      <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>
+  </UDashboardPanelContent>
+
+
+
+
+</template>
+
+<style scoped>
+
+</style>

pages/events/index.vue

@@ -70,7 +70,7 @@ defineShortcuts({
     document.getElementById("searchinput").focus()
   },
   '+': () => {
-    router.push("/events/edit")
+    router.push("/events/[mode]")
   }
 })
 

pages/incomingInvoices/index.vue

@@ -11,7 +11,7 @@ defineShortcuts({
     document.getElementById("searchinput").focus()
   },
   '+': () => {
-    router.push("/incomingInvoices/edit")
+    router.push("/incomingInvoices/[mode]")
   }
 })
 

pages/inventory/index.vue

@@ -10,7 +10,7 @@ const mode = ref("incoming")
 const toast = useToast()
 
 const inventoryChangeData = ref({
-  productId: "",
+  productId: null,
   sourceSpaceId: null,
   sourceProjectId: null,
   destinationSpaceId: null,
@@ -18,6 +18,17 @@ const inventoryChangeData = ref({
   quantity: 1
 })
 
+const resetInput = () => {
+  inventoryChangeData.value = {
+    productId: null,
+    sourceSpaceId: null,
+    sourceProjectId: null,
+    destinationSpaceId: null,
+    destinationProjectId: null,
+    quantity: 1
+  }
+}
+
 const createMovement = async () => {
 
   let movements = []
@@ -164,39 +175,61 @@ const processBarcodeInput = () => {
 </script>
 
 <template>
+  <UDashboardNavbar
+    title="Lager Vorgänge"
+  >
+      <template #right>
+        <UButton
+            @click="resetInput"
+            class="mt-3"
+            color="rose"
+            variant="outline"
+        >
+          Abbrechen
+        </UButton>
+        <UButton
+            @click="createMovement"
+            :disabled="mode === '' && checkSpaceId(inventoryChangeData.spaceId) && checkProductId(inventoryChangeData.productId)"
+            class="mt-3"
+        >
+          Bestätigen
+        </UButton>
 
-  <div class="w-80 mx-auto mt-5">
+      </template>
-    <div class="flex flex-col">
+  </UDashboardNavbar>
-      <UButton
+  <UDashboardPanelContent>
-          @click="mode = 'incoming'"
+    <div class="w-80 mx-auto mt-5">
-          class="my-2"
+      <div class="flex flex-col">
-          :variant="mode === 'incoming' ? 'solid' : 'outline'"
+        <UButton
-      >Wareneingang</UButton>
+            @click="mode = 'incoming'"
-      <UButton
+            class="my-2"
-          @click="mode = 'outgoing'"
+            :variant="mode === 'incoming' ? 'solid' : 'outline'"
-          class="my-2"
+        >Wareneingang</UButton>
-          :variant="mode === 'outgoing' ? 'solid' : 'outline'"
+        <UButton
-      >Warenausgang</UButton>
+            @click="mode = 'outgoing'"
-      <UButton
+            class="my-2"
-          @click="mode = 'change'"
+            :variant="mode === 'outgoing' ? 'solid' : 'outline'"
-          class="my-2"
+        >Warenausgang</UButton>
-          :variant="mode === 'change' ? 'solid' : 'outline'"
+        <UButton
-      >Umlagern</UButton>
+            @click="mode = 'change'"
-    </div>
+            class="my-2"
+            :variant="mode === 'change' ? 'solid' : 'outline'"
+        >Umlagern</UButton>
+      </div>
 
-    <UAlert
+      <UAlert
-      title="Info"
+          title="Info"
-      variant="outline"
+          variant="outline"
-      color="primary"
+          color="primary"
-      v-if="showBarcodeTip"
+          v-if="showBarcodeTip"
-      @close="showBarcodeTip = false"
+          @close="showBarcodeTip = false"
-      :close-button="{ icon: 'i-heroicons-x-mark-20-solid', color: 'gray', variant: 'link', padded: false }"
+          :close-button="{ icon: 'i-heroicons-x-mark-20-solid', color: 'gray', variant: 'link', padded: false }"
-      description="Über die Barcode Eingabe könenn folgende Werte automatisch erkannt werden: Quell Lagerplatz, Ziellagerplatz, Artikel(EAN oder Barcode). Es wird immer zuerst der Quell- und anschließend der Ziellagerplatz ausgefüllt."
+          description="Über die Barcode Eingabe können folgende Werte automatisch erkannt werden: Quelllagerplatz, Ziellagerplatz, Artikel (EAN oder Barcode). Es wird immer zuerst der Quell- und anschließend der Ziellagerplatz ausgefüllt."
-    />
+      />
 
-<!--    <UTooltip
+      <!--    <UTooltip
-        text="Über die Barcode Eingabe könenn folgende Werte automatisch erkannt werden: Quell Lagerplatz, Ziellagerplatz, Artikel(EAN oder Barcode). Es wird immer zuerst der Quell- und anschließend der Ziellagerplatz ausgefüllt."
+              text="Über die Barcode Eingabe könenn folgende Werte automatisch erkannt werden: Quell Lagerplatz, Ziellagerplatz, Artikel(EAN oder Barcode). Es wird immer zuerst der Quell- und anschließend der Ziellagerplatz ausgefüllt."
-    >-->
+          >-->
       <UFormGroup
           label="Barcode:"
           class="mt-3"
@@ -211,189 +244,152 @@ const processBarcodeInput = () => {
         />
 
       </UFormGroup>
-<!--      <template #text>
+      <!--      <template #text>
-        <span class="text-wrap">Über die Barcode Eingabe könenn folgende Werte automatisch erkannt werden: Quell Lagerplatz, Ziellagerplatz, Artikel(EAN oder Barcode). Es wird immer zuerst der Quell- und anschließend der Ziellagerplatz ausgefüllt.</span>
+              <span class="text-wrap">Über die Barcode Eingabe könenn folgende Werte automatisch erkannt werden: Quell Lagerplatz, Ziellagerplatz, Artikel(EAN oder Barcode). Es wird immer zuerst der Quell- und anschließend der Ziellagerplatz ausgefüllt.</span>
 
-      </template>
+            </template>
-    </UTooltip>-->
+          </UTooltip>-->
 
-    <UDivider
+      <UDivider
-        class="mt-5 w-80"
+          class="mt-5 w-80"
-        v-if="mode !== 'incoming'"
+          v-if="mode !== 'incoming'"
-    />
-
-    <UFormGroup
-        label="Quell Lagerplatz:"
-        class="mt-3 w-80"
-        v-if="mode !== 'incoming' "
-    >
-      <USelectMenu
-          :options="dataStore.spaces"
-          searchable
-          option-attribute="spaceNumber"
-          :color="checkSpaceId(inventoryChangeData.sourceSpaceId) ? 'primary' : 'rose'"
-          v-model="inventoryChangeData.sourceSpaceId"
-          @change="inventoryChangeData.sourceProjectId = null"
-          value-attribute="id"
-      >
-        <template #label>
-          {{dataStore.spaces.find(space => space.id === inventoryChangeData.sourceSpaceId) ? dataStore.spaces.find(space => space.id === inventoryChangeData.sourceSpaceId).description : "Kein Lagerplatz ausgewählt"}}
-        </template>
-      </USelectMenu>
-    </UFormGroup>
-    <UFormGroup
-        label="Quell Projekt:"
-        class="mt-3 w-80"
-        v-if="mode !== 'incoming' "
-    >
-      <USelectMenu
-          :options="dataStore.projects"
-          searchable
-          option-attribute="name"
-          :color="checkProjectId(inventoryChangeData.sourceProjectId) ? 'primary' : 'rose'"
-          v-model="inventoryChangeData.sourceProjectId"
-          @change="inventoryChangeData.sourceSpaceId = null"
-          value-attribute="id"
-      >
-        <template #label>
-          {{dataStore.getProjectById(inventoryChangeData.sourceProjectId) ? dataStore.getProjectById(inventoryChangeData.sourceProjectId).name : "Kein Projekt ausgewählt"}}
-        </template>
-      </USelectMenu>
-    </UFormGroup>
-
-    <UDivider
-      class="mt-5 w-80"
-    />
-
-    <UFormGroup
-        label="Artikel:"
-        class="mt-3 w-80"
-    >
-      <USelectMenu
-          :options="dataStore.products"
-          option-attribute="name"
-          value-attribute="id"
-          variant="outline"
-          searchable
-          :search-attributes="['name','ean', 'barcode']"
-          :color="checkProductId(inventoryChangeData.productId) ? 'primary' : 'rose'"
-          v-model="inventoryChangeData.productId"
-          v-on:select="changeFocusToSpaceId"
-      >
-        <template #label>
-          {{dataStore.products.find(product => product.id === inventoryChangeData.productId) ? dataStore.products.find(product => product.id === inventoryChangeData.productId).name : "Bitte Artikel auswählen"}}
-        </template>
-      </USelectMenu>
-    </UFormGroup>
-
-    <UDivider
-        class="mt-5 w-80"
-        v-if="mode !== 'outgoing'"
-    />
-
-    <UFormGroup
-        label="Ziel Lagerplatz:"
-        class="mt-3 w-80"
-        v-if="mode !== 'outgoing'"
-    >
-      <USelectMenu
-          :options="dataStore.spaces"
-          searchable
-          option-attribute="spaceNumber"
-          :color="checkSpaceId(inventoryChangeData.destinationSpaceId) ? 'primary' : 'rose'"
-          v-model="inventoryChangeData.destinationSpaceId"
-          @change="inventoryChangeData.destinationProjectId = null"
-          value-attribute="id"
-      >
-        <template #label>
-          {{dataStore.spaces.find(space => space.id === inventoryChangeData.destinationSpaceId) ? dataStore.spaces.find(space => space.id === inventoryChangeData.destinationSpaceId).description : "Kein Lagerplatz ausgewählt"}}
-        </template>
-      </USelectMenu>
-    </UFormGroup>
-    <UFormGroup
-        label="Ziel Projekt:"
-        class="mt-3 w-80"
-        v-if="mode !== 'outgoing'"
-    >
-      <USelectMenu
-          :options="dataStore.projects"
-          searchable
-          option-attribute="name"
-          :color="checkProjectId(inventoryChangeData.destinationProjectId) ? 'primary' : 'rose'"
-          v-model="inventoryChangeData.destinationProjectId"
-          value-attribute="id"
-          @change="inventoryChangeData.destinationSpaceId = null"
-      >
-        <template #label>
-          {{dataStore.getProjectById(inventoryChangeData.destinationProjectId) ? dataStore.getProjectById(inventoryChangeData.destinationProjectId).name : "Kein Projekt ausgewählt"}}
-        </template>
-      </USelectMenu>
-    </UFormGroup>
-
-    <UDivider
-        class="mt-5 w-80"
-    />
-
-    <UFormGroup
-        label="Anzahl:"
-        class="mt-3 w-80"
-    >
-      <UInput
-          variant="outline"
-          color="primary"
-          placeholder="Anzahl"
-          v-model="inventoryChangeData.quantity"
-          type="number"
-          id="quantityInput"
       />
-    </UFormGroup>
-    <UButton
-        @click="createMovement"
-        :disabled="mode === '' && checkSpaceId(inventoryChangeData.spaceId) && checkProductId(inventoryChangeData.productId)"
-        class="mt-3"
-    >
-      Bestätigen
-    </UButton>
 
+      <UFormGroup
+          label="Quell Lagerplatz:"
+          class="mt-3 w-80"
+          v-if="mode !== 'incoming' "
+      >
+        <USelectMenu
+            :options="dataStore.spaces"
+            searchable
+            option-attribute="spaceNumber"
+            :color="checkSpaceId(inventoryChangeData.sourceSpaceId) ? 'primary' : 'rose'"
+            v-model="inventoryChangeData.sourceSpaceId"
+            @change="inventoryChangeData.sourceProjectId = null"
+            value-attribute="id"
+        >
+          <template #label>
+            {{dataStore.spaces.find(space => space.id === inventoryChangeData.sourceSpaceId) ? dataStore.spaces.find(space => space.id === inventoryChangeData.sourceSpaceId).description : "Kein Lagerplatz ausgewählt"}}
+          </template>
+        </USelectMenu>
+      </UFormGroup>
+      <UFormGroup
+          label="Quell Projekt:"
+          class="mt-3 w-80"
+          v-if="mode !== 'incoming' "
+      >
+        <USelectMenu
+            :options="dataStore.projects"
+            searchable
+            option-attribute="name"
+            :color="checkProjectId(inventoryChangeData.sourceProjectId) ? 'primary' : 'rose'"
+            v-model="inventoryChangeData.sourceProjectId"
+            @change="inventoryChangeData.sourceSpaceId = null"
+            value-attribute="id"
+        >
+          <template #label>
+            {{dataStore.getProjectById(inventoryChangeData.sourceProjectId) ? dataStore.getProjectById(inventoryChangeData.sourceProjectId).name : "Kein Projekt ausgewählt"}}
+          </template>
+        </USelectMenu>
+      </UFormGroup>
 
+      <UDivider
+          class="mt-5 w-80"
+      />
 
+      <UFormGroup
+          label="Artikel:"
+          class="mt-3 w-80"
+      >
+        <USelectMenu
+            :options="dataStore.products"
+            option-attribute="name"
+            value-attribute="id"
+            variant="outline"
+            searchable
+            :search-attributes="['name','ean', 'barcode']"
+            :color="checkProductId(inventoryChangeData.productId) ? 'primary' : 'rose'"
+            v-model="inventoryChangeData.productId"
+            v-on:select="changeFocusToSpaceId"
+        >
+          <template #label>
+            {{dataStore.products.find(product => product.id === inventoryChangeData.productId) ? dataStore.products.find(product => product.id === inventoryChangeData.productId).name : "Bitte Artikel auswählen"}}
+          </template>
+        </USelectMenu>
+      </UFormGroup>
 
+      <UDivider
+          class="mt-5 w-80"
+          v-if="mode !== 'outgoing'"
+      />
 
-<!--    <div class="my-3">
+      <UFormGroup
+          label="Ziel Lagerplatz:"
+          class="mt-3 w-80"
+          v-if="mode !== 'outgoing'"
+      >
+        <USelectMenu
+            :options="dataStore.spaces"
+            searchable
+            option-attribute="spaceNumber"
+            :color="checkSpaceId(inventoryChangeData.destinationSpaceId) ? 'primary' : 'rose'"
+            v-model="inventoryChangeData.destinationSpaceId"
+            @change="inventoryChangeData.destinationProjectId = null"
+            value-attribute="id"
+        >
+          <template #label>
+            {{dataStore.spaces.find(space => space.id === inventoryChangeData.destinationSpaceId) ? dataStore.spaces.find(space => space.id === inventoryChangeData.destinationSpaceId).description : "Kein Lagerplatz ausgewählt"}}
+          </template>
+        </USelectMenu>
+      </UFormGroup>
+      <UFormGroup
+          label="Ziel Projekt:"
+          class="mt-3 w-80"
+          v-if="mode !== 'outgoing'"
+      >
+        <USelectMenu
+            :options="dataStore.projects"
+            searchable
+            option-attribute="name"
+            :color="checkProjectId(inventoryChangeData.destinationProjectId) ? 'primary' : 'rose'"
+            v-model="inventoryChangeData.destinationProjectId"
+            value-attribute="id"
+            @change="inventoryChangeData.destinationSpaceId = null"
+        >
+          <template #label>
+            {{dataStore.getProjectById(inventoryChangeData.destinationProjectId) ? dataStore.getProjectById(inventoryChangeData.destinationProjectId).name : "Kein Projekt ausgewählt"}}
+          </template>
+        </USelectMenu>
+      </UFormGroup>
+
+      <UDivider
+          class="mt-5 w-80"
+      />
+
+      <UFormGroup
+          label="Anzahl:"
+          class="mt-3 w-80"
+      >
+        <UInput
+            variant="outline"
+            color="primary"
+            placeholder="Anzahl"
+            v-model="inventoryChangeData.quantity"
+            type="number"
+            id="quantityInput"
+        />
+      </UFormGroup>
 
     </div>
+  </UDashboardPanelContent>
 
 
 
 
 
-
-
-
-
-
-
-    -->
-
-
-  </div>
-
-
-
 </template>
 
 <style scoped>
-#main {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-}
-#left {
-  width: 25vw;
-}
 
-#right {
-  width: 60vw;
-  padding-left: 3vw;
-}
 </style>

pages/products/[mode]/[[id]].vue

@@ -44,7 +44,25 @@ setupPage()
 </script>
 
 <template>
-  <UDashboardNavbar :title="currentItem ? currentItem.name : (mode === 'create' ? 'Artikel erstellen' : 'Artikel bearbeiten')">
+  <UDashboardNavbar
+      :title="currentItem ? currentItem.name : (mode === 'create' ? 'Artikel erstellen' : 'Artikel bearbeiten')"
+      :ui="{center: 'flex items-stretch gap-1.5 min-w-0'}"
+  >
+    <template #left>
+      <UButton
+          icon="i-heroicons-chevron-left"
+          variant="outline"
+          @click="router.push(`/products`)"
+      >
+        Artikel
+      </UButton>
+    </template>
+    <template #center>
+      <h1
+          v-if="currentItem"
+          class="text-xl font-medium"
+      >{{currentItem ? `Artikel: ${currentItem.name}` : (mode === 'create' ? 'Artikel erstellen' : 'Artikel bearbeiten')}}</h1>
+    </template>
     <template #right>
       <UButton
           v-if="mode === 'edit'"
@@ -145,6 +163,13 @@ setupPage()
           v-model="itemInfo.manufacturer"
       />
     </UFormGroup>
+    <UFormGroup
+        label="Hersteller Nr.:"
+    >
+      <UInput
+          v-model="itemInfo.manufacturerNumber"
+      />
+    </UFormGroup>
     <UFormGroup
         label="Einheit:"
     >
@@ -168,7 +193,7 @@ setupPage()
           multiple
       >
         <template #label>
-          {{itemInfo.tags.join(", ")}}
+          {{itemInfo.tags.length > 0 ? itemInfo.tags.join(", ") : "Keine Tags ausgewählt"}}
         </template>
       </USelectMenu>
     </UFormGroup>
@@ -199,6 +224,13 @@ setupPage()
         </template>
       </UInput>
     </UFormGroup>
+    <UFormGroup
+        label="Beschreibung:"
+    >
+      <UTextarea
+          v-model="itemInfo.description"
+      />
+    </UFormGroup>
   </UForm>
 </template>
 

pages/products/index.vue

@@ -20,6 +20,19 @@
   </UDashboardNavbar>
 
   <UDashboardToolbar>
+    <template #left>
+      <USelectMenu
+          v-model="selectedTags"
+          icon="i-heroicons-adjustments-horizontal-solid"
+          :options="templateTags"
+          multiple
+          class="hidden lg:block"
+      >
+        <template #label>
+          Tags
+        </template>
+      </USelectMenu>
+    </template>
     <template #right>
       <USelectMenu
           v-model="selectedColumns"
@@ -121,14 +134,33 @@ const templateColumns = [
 const selectedColumns = ref(templateColumns)
 const columns = computed(() => templateColumns.filter((column) => selectedColumns.value.includes(column)))
 
+const templateTags = computed(() => {
+  let temp = []
+
+  dataStore.products.forEach(row => {
+    row.tags.forEach(tag => {
+      if(!temp.includes(tag)) temp.push(tag)
+    })
+  })
+
+  return temp
+
+})
+const selectedTags = ref(templateTags.value)
+
+
 const searchString = ref('')
 
 const filteredRows = computed(() => {
+  let items = dataStore.products
+
+  items = items.filter(i => i.tags.some(x => selectedTags.value.includes(x)) || i.tags.length === 0)
+
   if(!searchString.value) {
-    return dataStore.products
+    return items
   }
 
-  return dataStore.products.filter(product => {
+  return items.filter(product => {
     return Object.values(product).some((value) => {
       return String(value).toLowerCase().includes(searchString.value.toLowerCase())
     })
@@ -136,6 +168,7 @@ const filteredRows = computed(() => {
 })
 
 
+
 </script>
 
 <style scoped>

pages/workingtimes/index.vue

@@ -93,6 +93,8 @@ const columns = [
   }
 ]
 
+console.log(dataStore.workingtimes)
+
 const runningTimeInfo = ref({})
 
 const startTime = async () => {
@@ -225,7 +227,7 @@ const getDuration = (time) => {
       :empty-state="{ icon: 'i-heroicons-circle-stack-20-solid', label: 'Noch keine Einträge' }"
       @select="(row) => {
         router.push(`/workingtimes/edit/${row.id}`)
-        /*configTimeMode = 'edit';
+        /*configTimeMode = '[mode]';
         itemInfo = row;
         showConfigTimeModal = true*/}"
   >

stores/data.js

@@ -125,6 +125,11 @@ export const useDataStore = defineStore('data', () => {
         texttemplates: {
             label: "Textvorlagen",
             labelSingle: "Textvorlage"
+        },
+        bankstatements: {
+            label: "Kontobewegungen",
+            labelSingle: "Kontobewegung",
+            historyItemHolder: "bankStatement",
         }
     }
 
@@ -193,7 +198,7 @@ export const useDataStore = defineStore('data', () => {
     const vendors = ref([])
     const incominginvoices = ref([])
     const bankAccounts = ref([])
-    const bankStatements = ref([])
+    const bankstatements = ref([])
     const bankrequisitions = ref([])
     const historyItems = ref([])
     const numberRanges = ref([])
@@ -394,7 +399,7 @@ export const useDataStore = defineStore('data', () => {
         vendors.value= []
         incominginvoices.value= []
         bankAccounts.value= []
-        bankStatements.value= []
+        bankstatements.value= []
         bankrequisitions.value= []
         historyItems.value = []
         numberRanges.value = []
@@ -722,7 +727,7 @@ export const useDataStore = defineStore('data', () => {
 
 
     //Realtime Update
-    const channelA = supabase
+    /*const channelA = supabase
         .channel('schema-db-changes')
         .on(
             'postgres_changes',
@@ -733,16 +738,16 @@ export const useDataStore = defineStore('data', () => {
             (payload) => {
                 //console.log(payload)
 
-                /*if(payload.eventType === 'INSERT') {
+                /!*if(payload.eventType === 'INSERT') {
                     const c = payload.table + '.value.push(' + JSON.stringify(payload.new) + ')'
                     eval(c)
                 } else if(payload.eventType === 'UPDATE'){
                     const c = payload.table + '.value[' + payload.table + '.value.findIndex(i => i.id === ' + JSON.stringify(payload.old.id) + ')] = ' + JSON.stringify(payload.new)
                     eval(c)
-                }*/
+                }*!/
             }
         )
-        .subscribe()
+        .subscribe()*/
 
     async function createNewItem (dataType,data){
         if(typeOf(data) === 'object') {
@@ -927,7 +932,7 @@ export const useDataStore = defineStore('data', () => {
         bankAccounts.value = (await supabase.from("bankaccounts").select().eq('tenant', currentTenant.value)).data
     }
     async function fetchBankStatements () {
-        bankStatements.value = (await supabase.from("bankstatements").select().eq('tenant', currentTenant.value).order("date", {ascending:false})).data
+        bankstatements.value = (await supabase.from("bankstatements").select().eq('tenant', currentTenant.value).order("date", {ascending:false})).data
     }
     async function fetchBankRequisitions () {
         bankrequisitions.value = (await supabase.from("bankrequisitions").select().eq('status', "LN")).data
@@ -1193,6 +1198,10 @@ export const useDataStore = defineStore('data', () => {
         return createddocuments.value.filter(i => i.project === project)
     })
 
+    const getCreatedDocumentsByType = computed(() => (type) => {
+        return createddocuments.value.filter(i => i.type === type)
+    })
+
     const getWorkingTimesByProfileId = computed(() => (profileId) => {
         return workingtimes.value.filter(i => i.profile === profileId)
     })
@@ -1508,6 +1517,17 @@ export const useDataStore = defineStore('data', () => {
         return workingtimes.value.find(item => item.id === itemId)
     })
 
+    const getOpenDocuments = computed(() => (itemId) => {
+
+        return createddocuments.value.filter(i => (i.type === "invoices" || i.type === "advanceInvoices") && !bankstatements.value.some(x => x.createdDocument === i.id))
+
+    })
+    const getOpenIncomingInvoices = computed(() => (itemId) => {
+
+        return incominginvoices.value.filter(i => !i.paid)
+
+    })
+
     const getProjectById = computed(() => (itemId) => {
         if(projects.value.find(i => i.id === itemId)) {
             let project = projects.value.find(project => project.id === itemId)
@@ -1563,7 +1583,7 @@ export const useDataStore = defineStore('data', () => {
         vendors,
         incominginvoices,
         bankAccounts,
-        bankStatements,
+        bankstatements,
         bankrequisitions,
         historyItems,
         numberRanges,
@@ -1646,6 +1666,7 @@ export const useDataStore = defineStore('data', () => {
         getMessagesByChatId,
         getTextTemplatesByDocumentType,
         getCreatedDocumentsByProject,
+        getCreatedDocumentsByType,
         getWorkingTimesByProfileId,
         getStartedWorkingTimes,
         getStockByProductId,
@@ -1680,7 +1701,9 @@ export const useDataStore = defineStore('data', () => {
         getInventoryItemById,
         getBankAccountById,
         getEventById,
-        getWorkingTimeById
+        getWorkingTimeById,
+        getOpenDocuments,
+        getOpenIncomingInvoices
     }