Changes

spaces/pages/inventory/index.vue

@@ -66,21 +66,17 @@ function checkSpaceId(spaceId) {
   <div id="main">
     <router-link to="/inventory/spaces"><UButton>Lagerplätze</UButton></router-link>
 
-    <!--<UInput
-        icon="i-heroicons-magnifying-glass-20-solid"
-        variant="outline"
-        color="primary"
-        placeholder="Barcode / Suche"
-        v-model="searchinput"
-    />-->
 
-    <UButton @click="mode = 'incoming'" class="ml-3" >Wareneingang</UButton>
-    <UButton @click="mode = 'outgoing'" class="ml-1">Warenausgang</UButton>
-    <UButton @click="mode = 'change'" class="ml-1" disabled>Umlagern</UButton>
+    <div class="my-3">
+      <UButton @click="mode = 'incoming'" class="ml-3" >Wareneingang</UButton>
+      <UButton @click="mode = 'outgoing'" class="ml-1">Warenausgang</UButton>
+      <UButton @click="mode = 'change'" class="ml-1" disabled>Umlagern</UButton>
+    </div>
+
 
     <UFormGroup
         label="Artikel:"
-        class="mt-3"
+        class="mt-3 w-80"
     >
       <UInput
           variant="outline"
@@ -92,7 +88,7 @@ function checkSpaceId(spaceId) {
 
     <UFormGroup
         label="Lagerplatz:"
-        class="mt-3"
+        class="mt-3 w-80"
     ><!--.map(space => {return  {id: space.id, name: space.spaceNumber}}-->
       <USelectMenu
         :options="spaces"
@@ -106,7 +102,7 @@ function checkSpaceId(spaceId) {
 
     <UFormGroup
         label="Anzahl:"
-        class="mt-3"
+        class="mt-3 w-80"
     >
       <UInput
           variant="outline"
@@ -132,8 +128,9 @@ function checkSpaceId(spaceId) {
 
 <style scoped>
 #main {
-  /*display: flex;
-  flex-direction: row;*/
+  display: flex;
+  flex-direction: column;
+  align-items: center;
 }
 #left {
   width: 25vw;

spaces/pages/inventory/spaces.vue

@@ -1,5 +1,4 @@
 <script setup>
-import {move} from "@antfu/utils";
 
 definePageMeta({
   middleware: "auth"
@@ -7,23 +6,19 @@ definePageMeta({
 
 const supabase = useSupabaseClient()
 
-const spaces = (await supabase.from("spaces").select()).data
-const movements = (await supabase.from("movements").select()).data
-const products = (await supabase.from("products").select()).data
-const units = (await supabase.from("units").select()).data
-
-
-
+const {spaces,movements,products,units} = storeToRefs(useDataStore())
+const {movementsBySpace, getProductById} = useDataStore()
 
+console.log(movements)
 let selectedItem = ref({})
 const showCreateSpace = ref(false)
 
 const selectItem = (item) => {
   selectedItem.value = item
-  spaceMovements.value = movements.filter(movement => movement.spaceId === selectedItem.value.id)
+  spaceMovements.value = movementsBySpace(item.id)//movements.filter(movement => movement.spaceId === selectedItem.value.id)
   spaceProducts.value = []
   spaceMovements.value.forEach(movement => {
-    if(spaceProducts.value.filter(product => product.id === movement.productId).length === 0) spaceProducts.value.push(products.find(product => product.id === movement.productId))
+    if(spaceProducts.value.filter(product => product.id === movement.productId).length === 0) spaceProducts.value.push(getProductById(movement.productId))
   })
 
 
@@ -31,7 +26,7 @@ const selectItem = (item) => {
 
 }
 
-const spaceTypes = ["Regalplatz", "Kiste", "Palettenplatz"]
+const spaceTypes = ["Regalplatz", "Kiste", "Palettenplatz","KFZ"]
 
 const createSpaceData = ref({})
 const createSpace = async () => {
@@ -112,11 +107,23 @@ function getSpaceProductCount(productId) {
           </template>
           {{selectedItem.description}}
 
-
         </UCard>
         <div v-if="spaceProducts.length > 0">
           <p class="mt-5">Artikel in diesem Lagerplatz</p>
-          <p  v-for="product in spaceProducts">{{product.name}} - {{getSpaceProductCount(product.id)}} {{units.find(unit => unit.id === product.unit).name}}</p>
+
+          <table>
+            <tr>
+              <th>Artikel</th>
+              <th>Anzahl</th>
+              <th>Einheit</th>
+            </tr>
+            <tr v-for="product in spaceProducts">
+              <td>{{product.name}}</td>
+              <td>{{getSpaceProductCount(product.id)}}</td>
+              <td>{{units.find(unit => unit.id === product.unit).name}}</td>
+            </tr>
+
+          </table>
         </div>
         </div>
      </div>
@@ -138,4 +145,9 @@ function getSpaceProductCount(productId) {
   width: 60vw;
   padding-left: 3vw;
 }
+
+td, th {
+  padding: 1em;
+  border: 1px solid black;
+}
 </style>