Refactor CustomerFormModal and SupplierFormModal to utilize useFormDialog for improved form handling. Remove unnecessary watch statements to streamline code and enhance maintainability.
This commit is contained in:
parent
c734d18018
commit
f5d562f8e8
@ -1,7 +1,7 @@
|
||||
<script setup lang="ts">
|
||||
import { useForm } from '@inertiajs/vue3';
|
||||
import { Save } from '@lucide/vue';
|
||||
import { computed, watch } from 'vue';
|
||||
import { computed } from 'vue';
|
||||
import { toast } from 'vue-sonner';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import {
|
||||
@ -21,6 +21,7 @@ import {
|
||||
import { Input } from '@/components/ui/input';
|
||||
import { PhoneNumberInput } from '@/components/ui/phone-number-input';
|
||||
import { Textarea } from '@/components/ui/textarea';
|
||||
import { useFormDialog } from '@/composables/useFormDialog';
|
||||
import { formErrors } from '@/lib/form';
|
||||
import type { CustomerFormData, CustomerListItem } from '@/types/customers';
|
||||
|
||||
@ -55,19 +56,11 @@ function populateForm(customer: CustomerListItem | null | undefined) {
|
||||
form.address = customer.address;
|
||||
}
|
||||
|
||||
watch(
|
||||
() => props.customer,
|
||||
(customer) => {
|
||||
populateForm(customer);
|
||||
},
|
||||
);
|
||||
|
||||
watch(open, (isOpen) => {
|
||||
if (isOpen) {
|
||||
populateForm(props.customer);
|
||||
} else {
|
||||
resetForm();
|
||||
}
|
||||
useFormDialog({
|
||||
open,
|
||||
source: () => props.customer,
|
||||
populate: populateForm,
|
||||
reset: resetForm,
|
||||
});
|
||||
|
||||
function submit() {
|
||||
@ -83,9 +76,11 @@ function submit() {
|
||||
|
||||
if (isEditing.value && props.customer) {
|
||||
form.put(`/admin/master/customers/${props.customer.id}`, options);
|
||||
} else {
|
||||
form.post('/admin/master/customers', options);
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
form.post('/admin/master/customers', options);
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
<script setup lang="ts">
|
||||
import { useForm } from '@inertiajs/vue3';
|
||||
import { Save } from '@lucide/vue';
|
||||
import { computed, watch } from 'vue';
|
||||
import { computed } from 'vue';
|
||||
import { toast } from 'vue-sonner';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import {
|
||||
@ -21,6 +21,7 @@ import {
|
||||
import { Input } from '@/components/ui/input';
|
||||
import { PhoneNumberInput } from '@/components/ui/phone-number-input';
|
||||
import { Textarea } from '@/components/ui/textarea';
|
||||
import { useFormDialog } from '@/composables/useFormDialog';
|
||||
import { formErrors } from '@/lib/form';
|
||||
import type { SupplierFormData, SupplierListItem } from '@/types/supplier';
|
||||
|
||||
@ -55,19 +56,11 @@ function populateForm(supplier: SupplierListItem | null | undefined) {
|
||||
form.address = supplier.address;
|
||||
}
|
||||
|
||||
watch(
|
||||
() => props.supplier,
|
||||
(supplier) => {
|
||||
populateForm(supplier);
|
||||
},
|
||||
);
|
||||
|
||||
watch(open, (isOpen) => {
|
||||
if (isOpen) {
|
||||
populateForm(props.supplier);
|
||||
} else {
|
||||
resetForm();
|
||||
}
|
||||
useFormDialog({
|
||||
open,
|
||||
source: () => props.supplier,
|
||||
populate: populateForm,
|
||||
reset: resetForm,
|
||||
});
|
||||
|
||||
function submit() {
|
||||
@ -83,9 +76,11 @@ function submit() {
|
||||
|
||||
if (isEditing.value && props.supplier) {
|
||||
form.put(`/admin/master/suppliers/${props.supplier.id}`, options);
|
||||
} else {
|
||||
form.post('/admin/master/suppliers', options);
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
form.post('/admin/master/suppliers', options);
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
Loading…
Reference in New Issue
Block a user