فروش بر اساس دسته

setHoveredSlice(index) } onMouseLeave={() => setHoveredSlice(null)} > {salesCategoryData.map((entry) => ( ))}

{compactCurrencyFormatter.format(totalSales)} مجموع

{salesCategoryData.map((item, index) => (

setHoveredSlice(index)} onMouseLeave={() => setHoveredSlice(null)} >

{item.name}

{compactCurrencyFormatter.format(item.value)} {item.percent.toLocaleString("fa-IR")}٪

))}

); }; const SideChartsSection = () => { return (

); }; function CustomTooltip({ active, payload, label, colors, }: any & { colors: RevenueFlowColors }) { if (!active || !payload?.length) return null; const thisYear = payload.find((p: any) => p.dataKey === "thisYear")?.value || 0; const prevYear = payload.find((p: any) => p.dataKey === "prevYear")?.value || 0; const diff = Number(thisYear) - Number(prevYear); const percentage = prevYear ? Math.round((diff / Number(prevYear)) * 100) : 0; const currentYear = new Date().getFullYear(); return (

{label}، {currentYear.toLocaleString("fa-IR")}

امسال: {currencyFormatter.format(Number(thisYear))}

سال قبل: {currencyFormatter.format(Number(prevYear))}

= 0 ? "text-emerald-500" : "text-red-500", )} > {diff >= 0 ? "+" : ""} {percentage.toLocaleString("fa-IR")}٪ نسبت به سال قبل

); } const RevenueFlowChart = () => { const [period, setPeriod] = React.useState("6months"); const { active: activeSeries, handleHover } = useHoverHighlight< "thisYear" | "prevYear" >(); const legendItems = [ { key: "thisYear", label: "امسال", color: palette.primary }, { key: "prevYear", label: "سال قبل", color: palette.secondary.light }, ] as const; React.useEffect(() => { if (typeof window === "undefined") return; const params = new URLSearchParams(window.location.search); const nextPeriod = params.get("period"); if (nextPeriod === "6months" || nextPeriod === "year") { setPeriod(nextPeriod); } }, []); React.useEffect(() => { if (typeof window === "undefined") return; const params = new URLSearchParams(window.location.search); if (period !== "6months") { params.set("period", period); } else { params.delete("period"); } const nextQuery = params.toString(); const nextUrl = nextQuery ? `${window.location.pathname}?${nextQuery}` : window.location.pathname; window.history.replaceState(null, "", nextUrl); }, [period]); const chartData = getDataForPeriod(period); const totalRevenue = chartData.reduce((acc, item) => acc + item.thisYear, 0); return (

{currencyFormatter.format(totalRevenue)}

درآمد کل ({periodLabels[period]})

{legendItems.map((item) => (

handleHover(item.key)} onMouseLeave={() => handleHover(null)} >

{item.label}

))}

بازه زمانی {(Object.keys(periodLabels) as TimePeriod[]).map((key) => ( setPeriod(key)} > {periodLabels[key]} ))}

compactCurrencyFormatter.format(value)} width={40} /> } cursor={{ strokeOpacity: 0.2 }} />

); }; const statusStyles: Record = { Processing: "bg-amber-50 text-amber-700 ring-1 ring-inset ring-amber-600/20 dark:bg-amber-900/30 dark:text-amber-400 dark:ring-amber-400/20", Shipped: "bg-blue-50 text-blue-700 ring-1 ring-inset ring-blue-700/10 dark:bg-blue-900/30 dark:text-blue-400 dark:ring-blue-400/20", Delivered: "bg-emerald-50 text-emerald-700 ring-1 ring-inset ring-emerald-600/20 dark:bg-emerald-900/30 dark:text-emerald-400 dark:ring-emerald-400/20", Cancelled: "bg-red-50 text-red-700 ring-1 ring-inset ring-red-600/10 dark:bg-red-900/30 dark:text-red-400 dark:ring-red-400/20", }; const RecentTransactionsTable = ({ className }: { className?: string }) => { const [statusFilter, setStatusFilter] = React.useState( "all", ); const [currentPage, setCurrentPage] = React.useState(1); const [isHydrated, setIsHydrated] = React.useState(false); const pageSize = 6; React.useEffect(() => { if (typeof window === "undefined") return; const params = new URLSearchParams(window.location.search); const nextStatus = params.get("status"); if ( nextStatus && (nextStatus === "all" || orderStatuses.includes(nextStatus as OrderStatus)) ) { setStatusFilter(nextStatus as OrderStatus | "all"); } const nextPage = Number(params.get("page")); if (!Number.isNaN(nextPage) && nextPage > 0) { setCurrentPage(nextPage); } setIsHydrated(true); }, []); const filteredOrders = React.useMemo(() => { if (statusFilter === "all") return orders; return orders.filter((order) => order.status === statusFilter); }, [statusFilter]); const totalPages = Math.max(1, Math.ceil(filteredOrders.length / pageSize)); const paginatedOrders = React.useMemo(() => { const startIndex = (currentPage - 1) * pageSize; return filteredOrders.slice(startIndex, startIndex + pageSize); }, [filteredOrders, currentPage, pageSize]); React.useEffect(() => { setCurrentPage(1); }, [statusFilter]); React.useEffect(() => { if (!isHydrated || typeof window === "undefined") return; const params = new URLSearchParams(window.location.search); if (statusFilter !== "all") { params.set("status", statusFilter); } else { params.delete("status"); } if (currentPage > 1) { params.set("page", String(currentPage)); } else { params.delete("page"); } const nextQuery = params.toString(); const nextUrl = nextQuery ? `${window.location.pathname}?${nextQuery}` : window.location.pathname; window.history.replaceState(null, "", nextUrl); }, [statusFilter, currentPage, isHydrated]); const goToPage = (page: number) => { setCurrentPage(Math.max(1, Math.min(page, totalPages))); }; const startRow = filteredOrders.length ? (currentPage - 1) * pageSize + 1 : 0; const endRow = Math.min(currentPage * pageSize, filteredOrders.length); return (

تراکنش‌های اخیر {filteredOrders.length.toLocaleString("fa-IR")}

فیلتر بر اساس وضعیت setStatusFilter("all")} > همه وضعیت‌ها {orderStatuses.map((status) => ( setStatusFilter(status)} > {orderStatusLabels[status]} ))}

شماره سفارش خریدار مجموع وضعیت {paginatedOrders.length === 0 ? ( تراکنشی یافت نشد. ) : ( paginatedOrders.map((order) => ( {order.orderNumber} {order.customer} {currencyFormatter.format(order.total)} {orderStatusLabels[order.status]} )) )}

{filteredOrders.length === 0 ? "۰" : `${startRow.toLocaleString("fa-IR")}-${endRow.toLocaleString("fa-IR")}`}{" "} از {filteredOrders.length.toLocaleString("fa-IR")}

); }; const RecentActivity = ({ className }: { className?: string }) => { return (

فعالیت تیم‌های اخیر

{recentActivity.map((item) => (

{item.title} {item.time}

{item.detail}

))}

); }; const DashboardContent = () => { return (

); }; const Dashboard5 = ({ className }: { className?: string }) => { return ( رفتن به محتوای اصلی ); }; export { Dashboard5 };

داشبورد

خوش برگشتید، علی!