Many Changes

spaces/pages/inventory/index.vue

@@ -3,60 +3,71 @@ definePageMeta({
   middleware: "auth"
 })
 
-
+const dataStore = useDataStore()
 const supabase = useSupabaseClient()
-
-const {spaces, movements, products} = storeToRefs(useDataStore())
-
-
-const searchinput = ref("")
-const mode = ref("")
-
+const router = useRouter()
+const mode = ref("incoming")
 const toast = useToast()
-const showReader = ref(false)
 
 const inventoryChangeData = ref({
   productId: "",
   spaceId: "",
-  quantity: 0
+  quantity: 1
 })
 
 const createMovement = async () => {
-  if(mode.value === 'incoming'){
-    //await create('movements', inventoryChangeData.value)
 
-    const {data,error} = await supabase
-        .from("movements")
-        .insert([inventoryChangeData.value])
-        .select()
+  if(mode.value === '' || !checkSpaceId(inventoryChangeData.value.spaceId) || !checkArticle(inventoryChangeData.value.productId)){
 
-    console.log(error)
+  } else {
+    if(mode.value === 'incoming'){
+
+      const {error} = await supabase
+          .from("movements")
+          .insert([inventoryChangeData.value])
+          .select()
+      if(error) console.log(error)
 
 
-  } else if (mode.value === 'outgoing'){
-    inventoryChangeData.value.quantity *= -1
-    //await create('movements', inventoryChangeData.value)
+    } else if (mode.value === 'outgoing'){
+      inventoryChangeData.value.quantity *= -1
 
-    const {data,error} = await supabase
-        .from("movements")
-        .insert([inventoryChangeData.value])
-        .select()
+      const {error} = await supabase
+          .from("movements")
+          .insert([inventoryChangeData.value])
+          .select()
+      if(error) console.log(error)
+    } else if (mode.value === 'change'){}
 
-    console.log(error)
-  } else if (mode.value === 'change'){}
 
-  inventoryChangeData.value = {
-    productId: 0,
-    spaceId: 0,
-    quantity: 0
+    inventoryChangeData.value = {
+      productId: "",
+      spaceId: "",
+      quantity: 1
+    }
+
+
+    dataStore.fetchMovements()
   }
+
+
 }
 
+defineShortcuts({
+  meta_enter: {
+    usingInput: true,
+    handler: () => {
+      createMovement()
+    }
+  }
+})
+
+
 function checkArticle(productId) {
-  return products.value.filter(product =>product.ean === productId).length > 0;
+  return dataStore.products.filter(product =>product.id === productId).length > 0;
 }
 function checkSpaceId(spaceId) {
-  return spaces.value.filter(space => Number(space.spaceNumber) === Number(spaceId)).length > 0;
+  return dataStore.spaces.filter(space => space.id === spaceId).length > 0;
 }
 
 function changeFocusToSpaceId() {
@@ -73,42 +84,66 @@ function changeFocusToQuantity() {
   <div id="main">
 
     <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>
+      <UButton
+          @click="mode = 'incoming'"
+          class="ml-3"
+          :variant="mode === 'incoming' ? 'solid' : 'outline'"
+      >Wareneingang</UButton>
+      <UButton
+          @click="mode = 'outgoing'"
+          class="ml-1"
+          :variant="mode === 'outgoing' ? 'solid' : 'outline'"
+      >Warenausgang</UButton>
+<!--      <UButton
+          @click="mode = 'change'"
+          class="ml-1"
+          disabled
+          :variant="mode === 'change' ? 'solid' : 'outline'"
+      >Umlagern</UButton>-->
     </div>
 
 
+
+
+
     <UFormGroup
         label="Artikel:"
         class="mt-3 w-80"
     >
-      <UInput
+      <USelectMenu
+          :options="dataStore.products"
+          option-attribute="name"
+          value-attribute="id"
           variant="outline"
+          searchable
+          :search-attributes="['name','ean', 'barcode']"
           :color="checkArticle(inventoryChangeData.productId) ? 'primary' : 'rose'"
           v-model="inventoryChangeData.productId"
-          v-on:keyup.enter="changeFocusToSpaceId"
-      />
+          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>
 
     <UFormGroup
         label="Lagerplatz:"
         class="mt-3 w-80"
-    ><!--.map(space => {return  {id: space.id, name: space.spaceNumber}}-->
-<!--      <USelectMenu
-        :options="spaces"
+    >
+      <USelectMenu
+        :options="dataStore.spaces"
         searchable
-        option-attribute="spaceNumber"
+        option-attribute="description"
         :color="checkSpaceId(inventoryChangeData.spaceId) ? 'primary' : 'rose'"
         v-model="inventoryChangeData.spaceId"
+        v-on:select="changeFocusToQuantity"
         value-attribute="id"
-      />-->
-      <UInput
-        v-model="inventoryChangeData.spaceId"
-        :color="checkSpaceId(inventoryChangeData.spaceId) ? 'primary' : 'rose'"
-        id="spaceIdInput"
-        v-on:keyup.enter="changeFocusToQuantity"
-      />
+      >
+        <template #label>
+          {{dataStore.spaces.find(space => space.id === inventoryChangeData.spaceId) ? dataStore.spaces.find(space => space.id === inventoryChangeData.spaceId).description : "Kein Lagerplatz ausgewählt"}}
+        </template>
+      </USelectMenu>
     </UFormGroup>
 
     <UFormGroup