diff --git a/src/pages/statistics/Statistics.tsx b/src/pages/statistics/Statistics.tsx index e14a5ff..e76658d 100644 --- a/src/pages/statistics/Statistics.tsx +++ b/src/pages/statistics/Statistics.tsx @@ -3,8 +3,24 @@ import { type FC } from 'react' import FoodSalesChart from './components/FoodSalesChart' import RevenueChart from './components/RevenueChart' import StatCard from './components/StatCard' +import { useGetStatistics } from './hooks/useStatsData' +import { formatFaNumber, formatPrice } from '@/helpers/func' +import PageLoading from '@/components/PageLoading' const Statistics: FC = () => { + + const { data: statisticsData, isLoading } = useGetStatistics(); + + if (isLoading) { + return ( +
+ +
+ ) + } + + const stats = statisticsData?.data; + return (
{/* Stats Cards */} @@ -12,25 +28,25 @@ const Statistics: FC = () => { } title='غذاها' - value='۱۰۴ عددی' + value={`${formatFaNumber(stats?.activeFoods)} عددی`} color='#6B7FED' /> } title='مشتریان' - value='۲۶۰ مشتری' + value={`${formatFaNumber(stats?.totalClients)} مشتری`} color='#6B7FED' /> } title='سفارشات' - value='۳۰۳ سفارش' + value={`${formatFaNumber(stats?.totalOrders)} سفارش`} color='#FF9A62' /> } title='درآمد' - value='۲۰,۰۰۰,۰۰۰ تومان' + value={stats?.totalRevenue ? formatPrice(stats.totalRevenue) : '۰ تومان'} color='#10B981' />
diff --git a/src/pages/statistics/hooks/useStatsData.ts b/src/pages/statistics/hooks/useStatsData.ts new file mode 100644 index 0000000..46b8f54 --- /dev/null +++ b/src/pages/statistics/hooks/useStatsData.ts @@ -0,0 +1,16 @@ +import { useQuery } from "@tanstack/react-query"; +import * as api from "../service/StatisticsService"; + +export const useGetStatistics = () => { + return useQuery({ + queryKey: ["statistics"], + queryFn: api.getStatistics, + }); +}; + +export const useGetFoodSalesPieChart = () => { + return useQuery({ + queryKey: ["food-sales-pie-chart"], + queryFn: api.getFoodSalesPieChart, + }); +}; diff --git a/src/pages/statistics/service/StatisticsService.ts b/src/pages/statistics/service/StatisticsService.ts new file mode 100644 index 0000000..bdc92e3 --- /dev/null +++ b/src/pages/statistics/service/StatisticsService.ts @@ -0,0 +1,12 @@ +import axios from "@/config/axios"; +import type { IStatisticsResponse } from "../types/Types"; + +export const getStatistics = async (): Promise => { + const { data } = await axios.get("/admin/orders/stats"); + return data; +}; + +export const getFoodSalesPieChart = async () => { + const { data } = await axios.get("/admin/orders/food-sales-pie-chart"); + return data; +}; diff --git a/src/pages/statistics/types/Types.ts b/src/pages/statistics/types/Types.ts new file mode 100644 index 0000000..0db6c6a --- /dev/null +++ b/src/pages/statistics/types/Types.ts @@ -0,0 +1,10 @@ +import type { IResponse } from "@/types/response.types"; + +export interface IStatisticsData { + totalOrders: number; + activeFoods: number; + totalClients: number; + totalRevenue: number; +} + +export type IStatisticsResponse = IResponse; diff --git a/src/router/Main.tsx b/src/router/Main.tsx index 26eeb09..4341db3 100644 --- a/src/router/Main.tsx +++ b/src/router/Main.tsx @@ -60,6 +60,8 @@ const MainRouter: FC = () => { )}>
+ } /> + } /> } /> } />