diff --git a/src/pages/order/List.tsx b/src/pages/order/List.tsx index f66c188..cf37e25 100644 --- a/src/pages/order/List.tsx +++ b/src/pages/order/List.tsx @@ -18,6 +18,7 @@ import { getOrderListColumns } from "./components/OrderListColumns"; import { useDeleteOrder, useGetOrders, + useGetOrderTabCounts, useUpdateOrderStatus, } from "./hooks/useOrderData"; import { @@ -51,11 +52,39 @@ const OrdersList: FC = () => { } = useOrderListParams(); const { data, refetch, isFetching } = useGetOrders(queryParams); + const { data: tabCounts } = useGetOrderTabCounts({ + designId: params.designerId, + categoryId: params.categoryId, + userId: params.userId, + search: params.search ?? null, + from: params.from ?? null, + to: params.to ?? null, + }); const { mutate: deleteOrder, isPending: isDeleting } = useDeleteOrder(); const { mutate: updateOrderStatus, isPending: isUpdatingStatus } = useUpdateOrderStatus(); const activeFilterCount = useMemo(() => countActiveFilters(params), [params]); const hasActiveFilters = activeFilterCount > 0; + const tabCountByTab: Record = useMemo( + () => ({ + [TabOrderListEnum.IN_PROGRESS]: tabCounts?.inProgress ?? 0, + [TabOrderListEnum.FINISHED]: tabCounts?.finished ?? 0, + [TabOrderListEnum.CANCELED]: tabCounts?.canceled ?? 0, + [TabOrderListEnum.INVOICED]: tabCounts?.invoiced ?? 0, + }), + [tabCounts], + ); + const tabsWithCount = useMemo( + () => + orderListTabs.map((tab) => { + const total = tabCountByTab[tab.value as TabOrderListEnum] ?? 0; + return { + ...tab, + label: total > 0 ? `${tab.label} (${total.toLocaleString("fa-IR")})` : tab.label, + }; + }), + [tabCountByTab], + ); const handleDelete = useCallback( (id: string) => { @@ -126,7 +155,7 @@ const OrdersList: FC = () => { setTab(tab as TabOrderListEnum)} /> diff --git a/src/pages/order/hooks/useOrderData.ts b/src/pages/order/hooks/useOrderData.ts index 6d97645..a3081b5 100644 --- a/src/pages/order/hooks/useOrderData.ts +++ b/src/pages/order/hooks/useOrderData.ts @@ -14,6 +14,14 @@ export const useGetOrders = (params?: api.GetOrdersParams) => { }); }; +export const useGetOrderTabCounts = (params?: api.GetOrderTabCountsParams) => { + return useQuery({ + queryKey: ["orders-tab-counts", params], + queryFn: () => api.getOrderTabCounts(params), + refetchInterval: 60_000, + }); +}; + export const useGetOrdersInvoiced = (page: number = 1) => { return useQuery({ queryKey: ["orders-invoiced", page], diff --git a/src/pages/order/service/OrderService.ts b/src/pages/order/service/OrderService.ts index e13cc11..f656a31 100644 --- a/src/pages/order/service/OrderService.ts +++ b/src/pages/order/service/OrderService.ts @@ -11,6 +11,7 @@ import type { TicketsResponseType, UpdateOrderType, } from "../types/Types"; +import type { BaseResponse } from "@/shared/types/Types"; import type { FieldResponseType, ProductResponeType, @@ -27,6 +28,15 @@ export type GetOrdersParams = { statuses?: OrderStatusEnum[]; }; +export type GetOrderTabCountsParams = Omit; + +export type OrderTabCountsResponseType = { + inProgress: number; + finished: number; + canceled: number; + invoiced: number; +}; + const cleanParams = (params?: GetOrdersParams) => { if (!params) return undefined; const { designId, statuses, ...rest } = params; @@ -57,6 +67,17 @@ export const getOrders = async (params?: GetOrdersParams) => { return data; }; +export const getOrderTabCounts = async (params?: GetOrderTabCountsParams) => { + const query = cleanParams(params); + const { data } = await axios.get>( + `/admin/orders/tab-counts`, + { + params: query, + }, + ); + return data.data; +}; + export const getOrdersInvoiced = async (page: number = 1) => { const { data } = await axios.get( `/admin/orders/invoiced?page=${page}`,