fix: sale master

resources/js/components/AppMessage.vue

@@ -2,8 +2,6 @@
 import { usePage } from '@inertiajs/inertia-vue3'
 
 const onClose = () => {
-  usePage().props.value.errors = {}
-
   usePage().props.value.flash.success = null
 
   usePage().props.value.flash.error = null
@@ -11,24 +9,23 @@ const onClose = () => {
 </script>
 
 <template>
-  <Message v-if="$page.props.flash.success" severity="success" @close="onClose">
+  <Message
+    v-if="$page.props.flash.success"
+    severity="success"
+    :life="3000"
+    :sticky="false"
+    @close="onClose"
+  >
     {{ $page.props.flash.success }}
   </Message>
 
-  <Message v-if="$page.props.flash.error" severity="error" @close="onClose">
-    {{ $page.props.flash.error }}
-  </Message>
-
   <Message
-    v-if="Object.keys($page.props.errors).length > 0"
+    v-if="$page.props.flash.error"
     severity="error"
+    :life="3000"
+    :sticky="false"
     @close="onClose"
   >
-    <div v-if="Object.keys($page.props.errors).length === 1">
-      Ditemukan satu error pada form
-    </div>
-    <div v-else>
-      Ditemukan {{ Object.keys($page.props.errors).length }} error pada form
-    </div>
+    {{ $page.props.flash.error }}
   </Message>
 </template>

resources/js/composables/useForm.js

@@ -1,14 +1,19 @@
-import { watch, computed } from 'vue'
-import { useForm as useInertiaForm, usePage } from '@inertiajs/inertia-vue3'
+import { watch } from 'vue'
+import { useForm as useInertiaForm } from '@inertiajs/inertia-vue3'
 
 export function useForm(obj) {
   const form = useInertiaForm(obj)
 
-  const errors = computed(() => usePage().props.value.errors)
-
-  watch(errors, () => {
-    form.clearErrors()
-  })
+  for (const key in obj) {
+    watch(
+      () => form[key],
+      (newVal, oldVal) => {
+        if (newVal != oldVal) {
+          form.clearErrors(key)
+        }
+      }
+    )
+  }
 
   return form
 }

resources/js/pages/Sales/Composables/useProductCart.js

@@ -11,21 +11,16 @@ export function useProductCart(form, initialProducts = []) {
   const productValidation = () => {
     onClearProductErrors()
 
-    productCart.find((product) => {
-      if (product.number === form.product.number) {
-        // productErrors.push({
-        //   message: 'Produk sudah ada dikeranjang',
-        //   field: 'product',
-        // })
-
-        if (form.qty + product.qty > form.product.qty) {
-          productErrors.push({
-            message: 'Stok tidak mencukupi',
-            field: 'qty',
-          })
-        }
-      }
-    })
+    const productExists = productCart.find(
+      (product) => product.number === form.product.number
+    )
+
+    if (Number(form.qty) + (productExists?.qty ?? 0) > form.product.qty) {
+      productErrors.push({
+        message: 'Stok tidak mencukupi',
+        field: 'qty',
+      })
+    }
 
     if (productErrors.length) {
       throw new FormValidationError('form error', productErrors)
@@ -38,22 +33,24 @@ export function useProductCart(form, initialProducts = []) {
 
       productValidation()
 
-      productCart.find((product) => {
-        if (product.number === form.product.number) {
-          product.qty += form.qty
-        } else {
-          productCart.push({
-            label: 'add',
-            number: form.product.number,
-            name: form.product.name,
-            price: form.price,
-            qty: form.qty,
-            unit: form.product.unit,
-          })
-        }
-      })
+      const productExists = productCart.find(
+        (product) => product.number === form.product.number
+      )
+
+      if (productExists) {
+        productExists.qty += Number(form.qty)
+      } else {
+        productCart.push({
+          label: 'add',
+          number: form.product.number,
+          name: form.product.name,
+          price: form.price,
+          qty: Number(form.qty),
+          unit: form.product.unit,
+        })
+      }
 
-      form.reset('product', 'qty')
+      form.reset('product', 'price', 'qty')
     } catch (e) {
       e.errors.forEach((error) => {
         form.setError(error.field, error.message)

resources/js/pages/Sales/Create.vue

@@ -247,7 +247,7 @@ const { onShowCustomerCreate } = useDialog()
                     class="p-button-outlined"
                     :class="{ 'p-button-danger': productErrors.length }"
                     :disabled="
-                      !form.price || !form.qty || !form.product?.number
+                      !form.price || !Number(form.qty) || !form.product?.number
                     "
                     @click="onAddProduct"
                   />