Updated the stats endpoint path to match backend (/api/v1/admin/checkout/orders/statistics).
This commit is contained in:
parent
abdf73bcb0
commit
6c9ce63815
|
|
@ -92,7 +92,7 @@ export const API_ROUTES = {
|
||||||
// Orders APIs
|
// Orders APIs
|
||||||
GET_ORDERS: "checkout/orders",
|
GET_ORDERS: "checkout/orders",
|
||||||
GET_ORDER: (id: string) => `checkout/orders/${id}`,
|
GET_ORDER: (id: string) => `checkout/orders/${id}`,
|
||||||
GET_ORDER_STATS: "checkout/orders/stats",
|
GET_ORDER_STATS: "checkout/orders/statistics",
|
||||||
UPDATE_ORDER_STATUS: (id: string) => `checkout/orders/${id}/status`,
|
UPDATE_ORDER_STATUS: (id: string) => `checkout/orders/${id}/status`,
|
||||||
|
|
||||||
// Shipping Methods APIs
|
// Shipping Methods APIs
|
||||||
|
|
|
||||||
|
|
@ -1,7 +1,8 @@
|
||||||
import { Users, ShoppingBag, DollarSign, TrendingUp, BarChart3, Plus } from 'lucide-react';
|
import { Users, ShoppingBag, DollarSign, TrendingUp, BarChart3, Plus, Clock } from 'lucide-react';
|
||||||
import { StatsCard } from '../components/dashboard/StatsCard';
|
import { StatsCard } from '../components/dashboard/StatsCard';
|
||||||
import { BarChart } from '../components/charts/BarChart';
|
import { BarChart } from '../components/charts/BarChart';
|
||||||
import { lazy, Suspense } from 'react';
|
import { lazy, Suspense } from 'react';
|
||||||
|
import { useOrderStats } from './orders/core/_hooks';
|
||||||
|
|
||||||
const LineChart = lazy(() => import('../components/charts/LineChart').then(module => ({ default: module.LineChart })));
|
const LineChart = lazy(() => import('../components/charts/LineChart').then(module => ({ default: module.LineChart })));
|
||||||
import { PieChart } from '../components/charts/PieChart';
|
import { PieChart } from '../components/charts/PieChart';
|
||||||
|
|
@ -11,36 +12,36 @@ import { PermissionWrapper } from '../components/common/PermissionWrapper';
|
||||||
import { PageContainer, PageTitle, CardTitle } from '../components/ui/Typography';
|
import { PageContainer, PageTitle, CardTitle } from '../components/ui/Typography';
|
||||||
import { ChartData, TableColumn } from '../types';
|
import { ChartData, TableColumn } from '../types';
|
||||||
|
|
||||||
const statsData = [
|
const useDashboardStats = () => {
|
||||||
{
|
const { data, isLoading, error } = useOrderStats(true);
|
||||||
title: 'کل کاربران',
|
const items = [
|
||||||
value: 1247,
|
|
||||||
change: 12,
|
|
||||||
icon: Users,
|
|
||||||
color: 'blue',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: 'فروش ماهانه',
|
|
||||||
value: '۲۴,۵۶۷,۰۰۰',
|
|
||||||
change: 8.5,
|
|
||||||
icon: DollarSign,
|
|
||||||
color: 'green',
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
title: 'کل سفارشات',
|
title: 'کل سفارشات',
|
||||||
value: 356,
|
value: data?.total_orders_count ?? 0,
|
||||||
change: -2.3,
|
|
||||||
icon: ShoppingBag,
|
icon: ShoppingBag,
|
||||||
color: 'yellow',
|
color: 'yellow' as const,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: 'رشد فروش',
|
title: 'مجموع فروش',
|
||||||
value: '۲۳.۵%',
|
value: data?.total_amount_of_sale ?? 0,
|
||||||
change: 15.2,
|
icon: DollarSign,
|
||||||
icon: TrendingUp,
|
color: 'green' as const,
|
||||||
color: 'purple',
|
|
||||||
},
|
},
|
||||||
];
|
{
|
||||||
|
title: 'سفارشهای در انتظار',
|
||||||
|
value: data?.total_order_pending ?? 0,
|
||||||
|
icon: Clock,
|
||||||
|
color: 'blue' as const,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: 'میانگین سفارش',
|
||||||
|
value: data?.order_avg ?? 0,
|
||||||
|
icon: TrendingUp,
|
||||||
|
color: 'purple' as const,
|
||||||
|
},
|
||||||
|
];
|
||||||
|
return { items, isLoading, error };
|
||||||
|
};
|
||||||
|
|
||||||
const chartData: ChartData[] = [
|
const chartData: ChartData[] = [
|
||||||
{ name: 'فروردین', value: 4000 },
|
{ name: 'فروردین', value: 4000 },
|
||||||
|
|
@ -100,6 +101,7 @@ const userColumns: TableColumn[] = [
|
||||||
];
|
];
|
||||||
|
|
||||||
export const Dashboard = () => {
|
export const Dashboard = () => {
|
||||||
|
const { items: statsData, isLoading: statsLoading, error: statsError } = useDashboardStats();
|
||||||
return (
|
return (
|
||||||
<PageContainer>
|
<PageContainer>
|
||||||
{/* Header with mobile-responsive layout */}
|
{/* Header with mobile-responsive layout */}
|
||||||
|
|
@ -125,10 +127,23 @@ export const Dashboard = () => {
|
||||||
|
|
||||||
{/* Stats Cards - Mobile responsive grid */}
|
{/* Stats Cards - Mobile responsive grid */}
|
||||||
<div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-3 sm:gap-4 lg:gap-6">
|
<div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-3 sm:gap-4 lg:gap-6">
|
||||||
{statsData.map((stat, index) => (
|
{statsLoading ? (
|
||||||
<StatsCard key={index} {...stat} />
|
<>
|
||||||
|
{[...Array(4)].map((_, idx) => (
|
||||||
|
<div key={idx} className="card p-6 animate-pulse bg-gray-100 dark:bg-gray-800 h-24" />
|
||||||
))}
|
))}
|
||||||
|
</>
|
||||||
|
) : (
|
||||||
|
statsData.map((stat, index) => (
|
||||||
|
<StatsCard key={index} {...stat} />
|
||||||
|
))
|
||||||
|
)}
|
||||||
</div>
|
</div>
|
||||||
|
{statsError && (
|
||||||
|
<div className="mt-2 text-sm text-red-600 dark:text-red-400">
|
||||||
|
خطا در دریافت آمار سفارشات
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
|
||||||
{/* Charts - Better mobile layout */}
|
{/* Charts - Better mobile layout */}
|
||||||
<div className="grid grid-cols-1 xl:grid-cols-2 gap-4 sm:gap-6">
|
<div className="grid grid-cols-1 xl:grid-cols-2 gap-4 sm:gap-6">
|
||||||
|
|
|
||||||
|
|
@ -183,10 +183,10 @@ export interface UpdateOrderStatusRequest {
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface OrderStats {
|
export interface OrderStats {
|
||||||
total_orders: number;
|
total_orders_count: number;
|
||||||
total_revenue: number;
|
total_amount_of_sale: number;
|
||||||
orders_by_status: Record<OrderStatus, number>;
|
total_order_pending: number;
|
||||||
avg_order_value: number;
|
order_avg: number;
|
||||||
}
|
}
|
||||||
|
|
||||||
export type Response<T> = {
|
export type Response<T> = {
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue