Changes to post|put|patch|delete

resources/js/Components/PersonInfo/PersonInfoGrid.vue

@@ -1,6 +1,5 @@
 <script setup>
 import { ref, computed } from "vue";
-import axios from "axios";
 import { router } from "@inertiajs/vue3";
 import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/Components/ui/tabs";
 import PersonUpdateForm from "./PersonUpdateForm.vue";
@@ -151,54 +150,63 @@ const closeConfirm = () => {
 
 const onConfirmDelete = async () => {
   const { type, id } = confirm.value;
-  try {
-    if (type === "email") {
-      await axios.delete(
-        route("person.email.delete", { person: props.person, email_id: id })
+  
+  if (type === "email") {
+    router.delete(
+      route("person.email.delete", { person: props.person, email_id: id }),
+      {
+        preserveScroll: true,
+        onSuccess: () => {
+          closeConfirm();
+        },
+        onError: (errors) => {
+          console.error("Delete failed", errors);
+          closeConfirm();
+        },
+      }
+    );
+  } else if (type === "trr") {
+    router.delete(
+      route("person.trr.delete", { person: props.person, trr_id: id }),
+      {
+        preserveScroll: true,
+        onSuccess: () => {
+          closeConfirm();
+        },
+        onError: (errors) => {
+          console.error("Delete failed", errors);
+          closeConfirm();
+        },
+      }
+    );
+  } else if (type === "address") {
+    router.delete(
+      route("person.address.delete", { person: props.person, address_id: id }),
+      {
+        preserveScroll: true,
+        onSuccess: () => {
+          closeConfirm();
+        },
+        onError: (errors) => {
+          console.error("Delete failed", errors);
+          closeConfirm();
+        },
+      }
       );
-      const list = props.person.emails || [];
-      const idx = list.findIndex((e) => e.id === id);
-      if (idx !== -1) list.splice(idx, 1);
-      closeConfirm();
-    } else if (type === "trr") {
-      await axios.delete(
-        route("person.trr.delete", { person: props.person, trr_id: id })
-      );
-      let list =
-        props.person.trrs ||
-        props.person.bank_accounts ||
-        props.person.accounts ||
-        props.person.bankAccounts ||
-        [];
-      const idx = list.findIndex((a) => a.id === id);
-      if (idx !== -1) list.splice(idx, 1);
-      closeConfirm();
-    } else if (type === "address") {
-      await axios.delete(
-        route("person.address.delete", { person: props.person, address_id: id })
-      );
-      const list = props.person.addresses || [];
-      const idx = list.findIndex((a) => a.id === id);
-      if (idx !== -1) list.splice(idx, 1);
-      closeConfirm();
-    } else if (type === "phone") {
-      router.delete(
-        route("person.phone.delete", { person: props.person, phone_id: id }),
-        {
-          preserveScroll: true,
-          onSuccess: () => {
-            closeConfirm();
-          },
-          onError: (errors) => {
-            console.error("Delete failed", errors);
-            closeConfirm();
-          },
-        }
-      );
-    }
-  } catch (e) {
-    console.error("Delete failed", e?.response || e);
-    closeConfirm();
+  } else if (type === "phone") {
+    router.delete(
+      route("person.phone.delete", { person: props.person, phone_id: id }),
+      {
+        preserveScroll: true,
+        onSuccess: () => {
+          closeConfirm();
+        },
+        onError: (errors) => {
+          console.error("Delete failed", errors);
+          closeConfirm();
+        },
+      }
+    );
   }
 };
 

resources/js/Components/PersonInfo/PersonUpdateForm.vue

@@ -4,7 +4,7 @@ import SectionTitle from '@/Components/SectionTitle.vue';
 import { useForm, Field as FormField } from "vee-validate";
 import { toTypedSchema } from "@vee-validate/zod";
 import * as z from "zod";
-import axios from 'axios';
+import { router } from '@inertiajs/vue3';
 import { ref } from 'vue';
 import {
   FormControl,
@@ -64,31 +64,30 @@ const updatePerson = async () => {
     processingUpdate.value = true;
     const { values } = form;
 
-    try {
-      const response = await axios({
-          method: 'put',
-          url: route('person.update', props.person),
-          data: values
-      });
-      
-      props.person.full_name = response.data.person.full_name;
-      props.person.tax_number = response.data.person.tax_number;
-      props.person.social_security_number = response.data.person.social_security_number;
-      props.person.description = response.data.person.description;
-
-      processingUpdate.value = false;
-      close();
-    } catch (reason) {
-      const errors = reason.response?.data?.errors || {};
-      // Map axios errors to VeeValidate field errors
-      Object.keys(errors).forEach((field) => {
-        const errorMessages = Array.isArray(errors[field])
-          ? errors[field]
-          : [errors[field]];
-        form.setFieldError(field, errorMessages[0]);
-      });
-      processingUpdate.value = false;
-    }
+    router.put(
+      route('person.update', props.person),
+      values,
+      {
+        preserveScroll: true,
+        onSuccess: () => {
+          processingUpdate.value = false;
+          close();
+        },
+        onError: (errors) => {
+          // Map Inertia errors to VeeValidate field errors
+          Object.keys(errors).forEach((field) => {
+            const errorMessages = Array.isArray(errors[field])
+              ? errors[field]
+              : [errors[field]];
+            form.setFieldError(field, errorMessages[0]);
+          });
+          processingUpdate.value = false;
+        },
+        onFinish: () => {
+          processingUpdate.value = false;
+        },
+      }
+    );
 }
 
 const onSubmit = form.handleSubmit(() => {

resources/js/Components/PersonInfo/TrrCreateForm.vue

@@ -3,7 +3,7 @@ import { ref, watch } from 'vue';
 import { useForm, Field as FormField } from "vee-validate";
 import { toTypedSchema } from "@vee-validate/zod";
 import * as z from "zod";
-import axios from 'axios';
+import { router } from '@inertiajs/vue3';
 import CreateDialog from '../Dialogs/CreateDialog.vue';
 import UpdateDialog from '../Dialogs/UpdateDialog.vue';
 import SectionTitle from '../SectionTitle.vue';
@@ -95,26 +95,32 @@ const create = async () => {
   errors.value = {};
   const { values } = form;
 
-  try {
-    const { data } = await axios.post(route('person.trr.create', props.person), values);
-    if (!Array.isArray(props.person.trrs)) props.person.trrs = (props.person.bank_accounts || props.person.accounts || props.person.bankAccounts || []);
-    (props.person.trrs).push(data.trr);
-    processing.value = false;
-    close();
-    resetForm();
-  } catch (e) {
-    errors.value = e?.response?.data?.errors || {};
-    // Map axios errors to VeeValidate field errors
-    if (errors.value) {
-      Object.keys(errors.value).forEach((field) => {
-        const errorMessages = Array.isArray(errors.value[field])
-          ? errors.value[field]
-          : [errors.value[field]];
-        form.setFieldError(field, errorMessages[0]);
-      });
+  router.post(
+    route('person.trr.create', props.person),
+    values,
+    {
+      preserveScroll: true,
+      onSuccess: () => {
+        processing.value = false;
+        close();
+        resetForm();
+      },
+      onError: (inertiaErrors) => {
+        errors.value = inertiaErrors || {};
+        // Map Inertia errors to VeeValidate field errors
+        Object.keys(errors.value).forEach((field) => {
+          const errorMessages = Array.isArray(errors.value[field])
+            ? errors.value[field]
+            : [errors.value[field]];
+          form.setFieldError(field, errorMessages[0]);
+        });
+        processing.value = false;
+      },
+      onFinish: () => {
+        processing.value = false;
+      },
     }
-    processing.value = false;
-  }
+  );
 };
 
 const update = async () => {
@@ -122,27 +128,32 @@ const update = async () => {
   errors.value = {};
   const { values } = form;
 
-  try {
-    const { data } = await axios.put(route('person.trr.update', { person: props.person, trr_id: props.id }), values);
-    let list = props.person.trrs || props.person.bank_accounts || props.person.accounts || props.person.bankAccounts || [];
-    const idx = list.findIndex(a => a.id === data.trr.id);
-    if (idx !== -1) list[idx] = data.trr;
-    processing.value = false;
-    close();
-    resetForm();
-  } catch (e) {
-    errors.value = e?.response?.data?.errors || {};
-    // Map axios errors to VeeValidate field errors
-    if (errors.value) {
-      Object.keys(errors.value).forEach((field) => {
-        const errorMessages = Array.isArray(errors.value[field])
-          ? errors.value[field]
-          : [errors.value[field]];
-        form.setFieldError(field, errorMessages[0]);
-      });
+  router.put(
+    route('person.trr.update', { person: props.person, trr_id: props.id }),
+    values,
+    {
+      preserveScroll: true,
+      onSuccess: () => {
+        processing.value = false;
+        close();
+        resetForm();
+      },
+      onError: (inertiaErrors) => {
+        errors.value = inertiaErrors || {};
+        // Map Inertia errors to VeeValidate field errors
+        Object.keys(errors.value).forEach((field) => {
+          const errorMessages = Array.isArray(errors.value[field])
+            ? errors.value[field]
+            : [errors.value[field]];
+          form.setFieldError(field, errorMessages[0]);
+        });
+        processing.value = false;
+      },
+      onFinish: () => {
+        processing.value = false;
+      },
     }
-    processing.value = false;
-  }
+  );
 };
 
 watch(