feat(order): order process enchancements

spa/src/stores/CheckoutStore.js

@@ -25,16 +25,18 @@ export const useCheckoutStore = defineStore('checkout', {
 
     actions: {
         async makeOrder() {
-            await storeOrder(this.customer)
-                .catch(error => {
-                    if (error.response?.status === 422) {
-                        this.validationErrors = error.response._data.data;
-                    } else {
-                        console.error('Unexpected error', error);
-                    }
-                });
+            try {
+                await storeOrder(this.customer);
+                await useCartStore().getProducts();
+            } catch (error) {
+                if (error.response?.status === 422) {
+                    this.validationErrors = error.response._data.data;
+                } else {
+                    console.error('Server error', error);
+                }
 
-            await useCartStore().getProducts();
+                throw error;
+            }
         },
 
         clearError(field) {

spa/src/utils/ftch.js

@@ -3,6 +3,7 @@ import {ofetch} from "ofetch";
 const BASE_URL = '/';
 
 export const apiFetch = ofetch.create({
+    throwHttpErrors: true,
     onRequest({request, options}) {
         const initData = window.Telegram?.WebApp?.initData
 

spa/src/views/Checkout.vue

@@ -53,7 +53,8 @@
     </div>
 
     <div
-        class="fixed px-4 pb-10 pt-4 bottom-0 left-0 w-full bg-base-200 z-50 flex justify-between items-center gap-2 border-t-1 border-t-base-300">
+        class="fixed px-4 pb-10 pt-4 bottom-0 left-0 w-full bg-base-200 z-50 flex flex-col justify-between items-center gap-2 border-t-1 border-t-base-300">
+      <div v-if="error" class="text-error text-sm">{{ error }}</div>
       <button class="btn btn-primary w-full" @click="onCreateBtnClick">Создать заказ</button>
     </div>
   </div>
@@ -64,12 +65,20 @@ import {useCheckoutStore} from "@/stores/CheckoutStore.js";
 import TgInput from "@/components/Form/TgInput.vue";
 import TgTextarea from "@/components/Form/TgTextarea.vue";
 import {useRouter} from "vue-router";
+import {ref} from "vue";
 
 const checkout = useCheckoutStore();
 const router = useRouter();
 
+const error = ref(null);
+
 async function onCreateBtnClick() {
-  await checkout.makeOrder();
-  router.push({name: 'order_created'});
+  try {
+    error.value = null;
+    await checkout.makeOrder();
+    router.push({name: 'order_created'});
+  } catch {
+    error.value = 'Невозможно создать заказ.';
+  }
 }
 </script>