Refactor_Expenses #321
@ -2,7 +2,7 @@ import React, { useEffect } from "react";
|
|||||||
import { useForm } from "react-hook-form";
|
import { useForm } from "react-hook-form";
|
||||||
import { z } from "zod";
|
import { z } from "zod";
|
||||||
import { zodResolver } from "@hookform/resolvers/zod";
|
import { zodResolver } from "@hookform/resolvers/zod";
|
||||||
import { useCreatePaymentMode } from "../../hooks/masterHook/useMaster";
|
import { useCreatePaymentMode, useUpdatePaymentMode } from "../../hooks/masterHook/useMaster";
|
||||||
|
|
||||||
const ExpnseSchema = z.object({
|
const ExpnseSchema = z.object({
|
||||||
name: z.string().min(1, { message: "Name is required" }),
|
name: z.string().min(1, { message: "Name is required" }),
|
||||||
@ -17,17 +17,32 @@ const ManagePaymentMode = ({ data = null, onClose }) => {
|
|||||||
formState: { errors },
|
formState: { errors },
|
||||||
} = useForm({
|
} = useForm({
|
||||||
resolver: zodResolver(ExpnseSchema),
|
resolver: zodResolver(ExpnseSchema),
|
||||||
defaultValues: { name: "", noOfPersonsRequired: false, description: "" },
|
defaultValues: { name: "", description: "" },
|
||||||
});
|
});
|
||||||
|
|
||||||
const { mutate: CreatePaymentMode, isPending } = useCreatePaymentMode(() =>
|
const { mutate: CreatePaymentMode, isPending } = useCreatePaymentMode(() =>
|
||||||
onClose?.()
|
onClose?.()
|
||||||
);
|
);
|
||||||
|
const {mutate:UpdatePaymentMode,isPending:Updating} = useUpdatePaymentMode(()=>onClose?.())
|
||||||
|
|
||||||
const onSubmit = (payload) => {
|
const onSubmit = (payload) => {
|
||||||
CreatePaymentMode(payload);
|
if(data){
|
||||||
|
UpdatePaymentMode({id:data.id,payload:{...payload,id:data.id}})
|
||||||
|
}else(
|
||||||
|
CreatePaymentMode(payload)
|
||||||
|
)
|
||||||
|
|
||||||
};
|
};
|
||||||
|
|
||||||
|
useEffect(()=>{
|
||||||
|
if(data){
|
||||||
|
reset({
|
||||||
|
name:data.name ?? "",
|
||||||
|
description:data.description ?? ""
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},[data])
|
||||||
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<form className="row g-2" onSubmit={handleSubmit(onSubmit)}>
|
<form className="row g-2" onSubmit={handleSubmit(onSubmit)}>
|
||||||
@ -59,16 +74,16 @@ const ManagePaymentMode = ({ data = null, onClose }) => {
|
|||||||
<button
|
<button
|
||||||
type="submit"
|
type="submit"
|
||||||
className="btn btn-sm btn-primary me-3"
|
className="btn btn-sm btn-primary me-3"
|
||||||
disabled={isPending }
|
disabled={isPending || Updating}
|
||||||
>
|
>
|
||||||
{isPending ? "Please Wait..." : "Submit"}
|
{isPending || Updating? "Please Wait..." : Updating ? "Update" : "Submit"}
|
||||||
</button>
|
</button>
|
||||||
<button
|
<button
|
||||||
type="reset"
|
type="reset"
|
||||||
className="btn btn-sm btn-label-secondary "
|
className="btn btn-sm btn-label-secondary "
|
||||||
data-bs-dismiss="modal"
|
data-bs-dismiss="modal"
|
||||||
aria-label="Close"
|
aria-label="Close"
|
||||||
disabled={isPending}
|
disabled={isPending || Updating}
|
||||||
>
|
>
|
||||||
Cancel
|
Cancel
|
||||||
</button>
|
</button>
|
||||||
|
@ -92,7 +92,8 @@ const MasterModal = ({ modaldata, closeModal }) => {
|
|||||||
"Edit-Contact Tag": <EditContactTag data={item} onClose={closeModal} />,
|
"Edit-Contact Tag": <EditContactTag data={item} onClose={closeModal} />,
|
||||||
"Expense Type":<ManageExpenseType onClose={closeModal} />,
|
"Expense Type":<ManageExpenseType onClose={closeModal} />,
|
||||||
"Edit-Expense Type":<ManageExpenseType data={item} onClose={closeModal} />,
|
"Edit-Expense Type":<ManageExpenseType data={item} onClose={closeModal} />,
|
||||||
"Payment Mode":<ManagePaymentMode onClose={closeModal}/>
|
"Payment Mode":<ManagePaymentMode onClose={closeModal}/>,
|
||||||
|
"Edit-Payment Mode":<ManagePaymentMode data={item} onClose={closeModal}/>
|
||||||
};
|
};
|
||||||
|
|
||||||
return modalComponents[modalType] || null;
|
return modalComponents[modalType] || null;
|
||||||
|
@ -605,6 +605,27 @@ export const useCreatePaymentMode = (onSuccessCallback)=>{
|
|||||||
}
|
}
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
export const useUpdatePaymentMode = (onSuccessCallback)=>{
|
||||||
|
const queryClient = useQueryClient();
|
||||||
|
|
||||||
|
return useMutation( {
|
||||||
|
mutationFn: async ( {id,payload} ) =>
|
||||||
|
{
|
||||||
|
const resp = await MasterRespository.updatePaymentMode(id,payload);
|
||||||
|
return resp.data;
|
||||||
|
},
|
||||||
|
onSuccess: ( data ) =>
|
||||||
|
{
|
||||||
|
queryClient.invalidateQueries( {queryKey:[ "masterData", "Payment Mode" ]} )
|
||||||
|
showToast( "Payment Mode Updated successfully", "success" );
|
||||||
|
if(onSuccessCallback) onSuccessCallback(data)
|
||||||
|
},
|
||||||
|
onError: ( error ) =>
|
||||||
|
{
|
||||||
|
showToast(error.message || "Something went wrong", "error");
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
// -Delete Master --------
|
// -Delete Master --------
|
||||||
export const useDeleteMasterItem = () => {
|
export const useDeleteMasterItem = () => {
|
||||||
|
@ -66,6 +66,7 @@ export const MasterRespository = {
|
|||||||
|
|
||||||
getPaymentMode:()=>api.get('/api/Master/payment-modes'),
|
getPaymentMode:()=>api.get('/api/Master/payment-modes'),
|
||||||
createPaymentMode:(data)=>api.post(`/api/Master/payment-mode`,data),
|
createPaymentMode:(data)=>api.post(`/api/Master/payment-mode`,data),
|
||||||
|
updatePaymentMode:(id,data)=>api.put(`/api/Master/payment-mode/edit/${id}`,data),
|
||||||
|
|
||||||
|
|
||||||
getExpenseStatus:()=>api.get('/api/Master/expenses-status')
|
getExpenseStatus:()=>api.get('/api/Master/expenses-status')
|
||||||
|
Loading…
x
Reference in New Issue
Block a user