Invoice list should display according to the selected date range in Collection module.
This commit is contained in:
parent
314dd67118
commit
b399977946
@ -27,16 +27,16 @@ const CollectionList = ({ fromDate, toDate, isPending, searchString }) => {
|
||||
|
||||
const selectedProject = useSelectedProject();
|
||||
const searchDebounce = useDebounce(searchString, 500);
|
||||
|
||||
|
||||
const { data, isLoading, isError, error } = useCollections(
|
||||
ITEMS_PER_PAGE,
|
||||
currentPage,
|
||||
selectedProject,
|
||||
searchDebounce,
|
||||
localToUtc(fromDate),
|
||||
localToUtc(toDate),
|
||||
isPending,
|
||||
ITEMS_PER_PAGE,
|
||||
currentPage,
|
||||
true,
|
||||
selectedProject,
|
||||
searchDebounce
|
||||
isPending
|
||||
);
|
||||
const { setProcessedPayment, setAddPayment, setViewCollection } =
|
||||
useCollectionContext();
|
||||
@ -186,84 +186,84 @@ const CollectionList = ({ fromDate, toDate, isPending, searchString }) => {
|
||||
canViewCollection ||
|
||||
canEditCollection ||
|
||||
canCreate) && (
|
||||
<td
|
||||
className="sticky-action-column text-center"
|
||||
style={{ padding: "12px 8px" }}
|
||||
>
|
||||
<div className="dropdown z-2">
|
||||
<button
|
||||
type="button"
|
||||
className="btn btn-icon btn-text-secondary rounded-pill dropdown-toggle hide-arrow p-0"
|
||||
data-bs-toggle="dropdown"
|
||||
aria-expanded="false"
|
||||
>
|
||||
<i
|
||||
className="bx bx-dots-vertical-rounded bx-sm text-muted"
|
||||
data-bs-toggle="tooltip"
|
||||
data-bs-offset="0,8"
|
||||
data-bs-placement="top"
|
||||
data-bs-custom-class="tooltip-dark"
|
||||
title="More Action"
|
||||
></i>
|
||||
</button>
|
||||
<td
|
||||
className="sticky-action-column text-center"
|
||||
style={{ padding: "12px 8px" }}
|
||||
>
|
||||
<div className="dropdown z-2">
|
||||
<button
|
||||
type="button"
|
||||
className="btn btn-icon btn-text-secondary rounded-pill dropdown-toggle hide-arrow p-0"
|
||||
data-bs-toggle="dropdown"
|
||||
aria-expanded="false"
|
||||
>
|
||||
<i
|
||||
className="bx bx-dots-vertical-rounded bx-sm text-muted"
|
||||
data-bs-toggle="tooltip"
|
||||
data-bs-offset="0,8"
|
||||
data-bs-placement="top"
|
||||
data-bs-custom-class="tooltip-dark"
|
||||
title="More Action"
|
||||
></i>
|
||||
</button>
|
||||
|
||||
<ul className="dropdown-menu dropdown-menu-end">
|
||||
{/* View */}
|
||||
<ul className="dropdown-menu dropdown-menu-end">
|
||||
{/* View */}
|
||||
|
||||
<li>
|
||||
<a
|
||||
className="dropdown-item cursor-pointer"
|
||||
onClick={() => setViewCollection(row.id)}
|
||||
>
|
||||
<i className="bx bx-show me-2 text-primary"></i>
|
||||
<span>View</span>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
className="dropdown-item cursor-pointer"
|
||||
onClick={() => setViewCollection(row.id)}
|
||||
>
|
||||
<i className="bx bx-show me-2 text-primary"></i>
|
||||
<span>View</span>
|
||||
</a>
|
||||
</li>
|
||||
|
||||
{/* Only if not completed */}
|
||||
{!row?.markAsCompleted && (
|
||||
<>
|
||||
{/* Add Payment */}
|
||||
{(isAdmin || canAddPayment) && (
|
||||
<li>
|
||||
<a
|
||||
className="dropdown-item cursor-pointer"
|
||||
onClick={() =>
|
||||
setAddPayment({
|
||||
isOpen: true,
|
||||
invoiceId: row.id,
|
||||
})
|
||||
}
|
||||
>
|
||||
<i className="bx bx-wallet me-2 text-warning"></i>
|
||||
<span>Add Payment</span>
|
||||
</a>
|
||||
</li>
|
||||
)}
|
||||
{/* Only if not completed */}
|
||||
{!row?.markAsCompleted && (
|
||||
<>
|
||||
{/* Add Payment */}
|
||||
{(isAdmin || canAddPayment) && (
|
||||
<li>
|
||||
<a
|
||||
className="dropdown-item cursor-pointer"
|
||||
onClick={() =>
|
||||
setAddPayment({
|
||||
isOpen: true,
|
||||
invoiceId: row.id,
|
||||
})
|
||||
}
|
||||
>
|
||||
<i className="bx bx-wallet me-2 text-warning"></i>
|
||||
<span>Add Payment</span>
|
||||
</a>
|
||||
</li>
|
||||
)}
|
||||
|
||||
{/* Mark Payment */}
|
||||
{isAdmin && (
|
||||
<li>
|
||||
<a
|
||||
className="dropdown-item cursor-pointer"
|
||||
onClick={() =>
|
||||
setProcessedPayment({
|
||||
isOpen: true,
|
||||
invoiceId: row.id,
|
||||
})
|
||||
}
|
||||
>
|
||||
<i className="bx bx-check-circle me-2 text-success"></i>
|
||||
<span>Mark Payment</span>
|
||||
</a>
|
||||
</li>
|
||||
)}
|
||||
</>
|
||||
)}
|
||||
</ul>
|
||||
</div>
|
||||
</td>
|
||||
)}
|
||||
{/* Mark Payment */}
|
||||
{isAdmin && (
|
||||
<li>
|
||||
<a
|
||||
className="dropdown-item cursor-pointer"
|
||||
onClick={() =>
|
||||
setProcessedPayment({
|
||||
isOpen: true,
|
||||
invoiceId: row.id,
|
||||
})
|
||||
}
|
||||
>
|
||||
<i className="bx bx-check-circle me-2 text-success"></i>
|
||||
<span>Mark Payment</span>
|
||||
</a>
|
||||
</li>
|
||||
)}
|
||||
</>
|
||||
)}
|
||||
</ul>
|
||||
</div>
|
||||
</td>
|
||||
)}
|
||||
</tr>
|
||||
))
|
||||
) : (
|
||||
|
||||
@ -2,39 +2,80 @@ import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
|
||||
import { CollectionRepository } from "../repositories/ColllectionRepository";
|
||||
import showToast from "../services/toastService";
|
||||
|
||||
// export const useCollections = (
|
||||
// pageSize,
|
||||
// pageNumber,
|
||||
// fromDate,
|
||||
// toDate,
|
||||
// isPending,
|
||||
// isActive,
|
||||
// projectId,
|
||||
// searchString
|
||||
// ) => {
|
||||
// return useQuery({
|
||||
// queryKey: [
|
||||
// "collections",
|
||||
// pageSize,
|
||||
// pageNumber,
|
||||
// fromDate,
|
||||
// toDate,
|
||||
// isPending,
|
||||
// isActive,
|
||||
// projectId,
|
||||
// searchString,
|
||||
// ],
|
||||
|
||||
// queryFn: async () => {
|
||||
// const response = await CollectionRepository.getCollections(
|
||||
// pageSize,
|
||||
// pageNumber,
|
||||
// fromDate,
|
||||
// toDate,
|
||||
// isPending,
|
||||
// isActive,
|
||||
// projectId,
|
||||
// searchString
|
||||
// );
|
||||
// return response.data;
|
||||
// },
|
||||
|
||||
// keepPreviousData: true,
|
||||
// staleTime: 1000 * 60 * 1,
|
||||
// });
|
||||
// };
|
||||
export const useCollections = (
|
||||
pageSize,
|
||||
pageNumber,
|
||||
projectId,
|
||||
searchString,
|
||||
fromDate,
|
||||
toDate,
|
||||
isPending,
|
||||
pageSize,
|
||||
pageNumber,
|
||||
isActive,
|
||||
projectId,
|
||||
searchString
|
||||
isPending
|
||||
) => {
|
||||
return useQuery({
|
||||
queryKey: [
|
||||
"collections",
|
||||
pageSize,
|
||||
pageNumber,
|
||||
fromDate,
|
||||
toDate,
|
||||
isPending,
|
||||
isActive,
|
||||
projectId,
|
||||
searchString,
|
||||
fromDate,
|
||||
toDate,
|
||||
pageSize,
|
||||
pageNumber,
|
||||
isActive,
|
||||
isPending,
|
||||
],
|
||||
|
||||
queryFn: async () => {
|
||||
const response = await CollectionRepository.getCollections(
|
||||
pageSize,
|
||||
pageNumber,
|
||||
projectId,
|
||||
searchString,
|
||||
fromDate,
|
||||
toDate,
|
||||
isPending,
|
||||
pageSize,
|
||||
pageNumber,
|
||||
isActive,
|
||||
projectId,
|
||||
searchString
|
||||
isPending
|
||||
);
|
||||
return response.data;
|
||||
},
|
||||
@ -44,15 +85,14 @@ export const useCollections = (
|
||||
});
|
||||
};
|
||||
|
||||
|
||||
export const useCollection =(collectionId)=>{
|
||||
export const useCollection = (collectionId) => {
|
||||
return useQuery({
|
||||
queryKey:["collection",collectionId],
|
||||
queryFn:async()=> {
|
||||
queryKey: ["collection", collectionId],
|
||||
queryFn: async () => {
|
||||
const resp = await CollectionRepository.getCollection(collectionId);
|
||||
return resp.data
|
||||
},
|
||||
enabled:!!collectionId
|
||||
enabled: !!collectionId
|
||||
})
|
||||
}
|
||||
|
||||
@ -133,11 +173,11 @@ export const useAddComment = (onSuccessCallBack) => {
|
||||
});
|
||||
};
|
||||
|
||||
export const useUpdateCollection =(onSuccessCallBack)=>{
|
||||
const client = useQueryClient();
|
||||
export const useUpdateCollection = (onSuccessCallBack) => {
|
||||
const client = useQueryClient();
|
||||
return useMutation({
|
||||
mutationFn:async({collectionId,payload})=> await CollectionRepository.updateCollection(collectionId,payload),
|
||||
onSuccess: () => {
|
||||
mutationFn: async ({ collectionId, payload }) => await CollectionRepository.updateCollection(collectionId, payload),
|
||||
onSuccess: () => {
|
||||
client.invalidateQueries({ queryKey: ["collections"] });
|
||||
client.invalidateQueries({ queryKey: ["collection"] });
|
||||
showToast("Collection Updated Successfully", "success");
|
||||
|
||||
@ -117,7 +117,8 @@ const CollectionPage = () => {
|
||||
{/* Left side: Date Picker + Show Pending (stacked on mobile) */}
|
||||
<div className="col-12 col-md-6 d-flex flex-column flex-md-row flex-wrap align-items-start align-md-items-center gap-2 gap-md-3 mb-3 mb-md-0">
|
||||
<FormProvider {...methods}>
|
||||
<DateRangePicker1 howManyDay={180} />
|
||||
<DateRangePicker1 howManyDay={180} startField="fromDate"
|
||||
endField="toDate" />
|
||||
</FormProvider>
|
||||
|
||||
<div className="form-check form-switch d-flex align-items-center mt-1">
|
||||
|
||||
@ -4,26 +4,46 @@ import { DirectoryRepository } from "./DirectoryRepository";
|
||||
export const CollectionRepository = {
|
||||
createNewCollection: (data) =>
|
||||
api.post(`/api/Collection/invoice/create`, data),
|
||||
updateCollection:(id,data)=>{
|
||||
api.put(`/api/Collection/invoice/edit/${id}`,data)
|
||||
updateCollection: (id, data) => {
|
||||
api.put(`/api/Collection/invoice/edit/${id}`, data)
|
||||
},
|
||||
getCollections: (pageSize, pageNumber,fromDate,toDate, isPending,isActive,projectId, searchString) => {
|
||||
let url = `/api/Collection/invoice/list?pageSize=${pageSize}&pageNumber=${pageNumber}&isPending=${isPending}&isActive=${isActive}&searchString=${searchString}`;
|
||||
// getCollections: (pageSize, pageNumber,fromDate,toDate, isPending,isActive,projectId, searchString) => {
|
||||
// let url = `/api/Collection/invoice/list?pageSize=${pageSize}&pageNumber=${pageNumber}&isPending=${isPending}&isActive=${isActive}&searchString=${searchString}`;
|
||||
|
||||
// const params = [];
|
||||
// if (fromDate) params.push(`fromDate=${fromDate}`);
|
||||
// if (toDate) params.push(`toDate=${toDate}`);
|
||||
// if(projectId) params.push(`projectId=${projectId}`)
|
||||
|
||||
// if (params.length > 0) {
|
||||
// url += `&${params.join("&")}`;
|
||||
// }
|
||||
// return api.get(url);
|
||||
// },
|
||||
|
||||
getCollections: (projectId, searchString, fromDate, toDate, pageSize, pageNumber, isActive, isPending) => {
|
||||
let url = `/api/Collection/invoice/list`;
|
||||
const params = [];
|
||||
if (fromDate) params.push(`fromDate=${fromDate}`);
|
||||
if (toDate) params.push(`toDate=${toDate}`);
|
||||
if(projectId) params.push(`projectId=${projectId}`)
|
||||
|
||||
if (projectId) params.push(`projectId=${projectId}`);
|
||||
if (searchString) params.push(`search=${searchString}`);
|
||||
if (fromDate) params.push(`dateFrom=${fromDate}`);
|
||||
if (toDate) params.push(`dateTo=${toDate}`);
|
||||
if (pageSize) params.push(`pageSize=${pageSize}`);
|
||||
if (pageNumber) params.push(`pageNumber=${pageNumber}`);
|
||||
if (isActive) params.push(`isActive=${isActive}`);
|
||||
if (isPending) params.push(`isPending=${isPending}`);
|
||||
|
||||
if (params.length > 0) {
|
||||
url += `&${params.join("&")}`;
|
||||
url += "?" + params.join("&");
|
||||
}
|
||||
return api.get(url);
|
||||
|
||||
return api.get(url);
|
||||
},
|
||||
|
||||
makeReceivePayment:(data)=> api.post(`/api/Collection/invoice/payment/received`,data),
|
||||
markPaymentReceived:(invoiceId)=>api.put(`/api/Collection/invoice/marked/completed/${invoiceId}`),
|
||||
getCollection:(id)=>api.get(`/api/Collection/invoice/details/${id}`),
|
||||
addComment:(data)=>api.post(`/api/Collection/invoice/add/comment`,data)
|
||||
makeReceivePayment: (data) => api.post(`/api/Collection/invoice/payment/received`, data),
|
||||
markPaymentReceived: (invoiceId) => api.put(`/api/Collection/invoice/marked/completed/${invoiceId}`),
|
||||
getCollection: (id) => api.get(`/api/Collection/invoice/details/${id}`),
|
||||
addComment: (data) => api.post(`/api/Collection/invoice/add/comment`, data)
|
||||
};
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user