{label}

درآمد: {currencyFormatter.format(Number(revenue))}

هزینه: {currencyFormatter.format(Number(expenses))}

مجموع: {currencyFormatter.format(total)}

); }; const RevenueChart = () => { const totalRevenue = weeklyRevenueData.reduce((sum, d) => sum + d.revenue, 0); return (

درآمد

هزینه

{currencyFormatter.format(totalRevenue)}

این هفته در برابر هفته قبل

compactCurrencyFormatter.format(value) } width={40} /> } cursor={{ fillOpacity: 0.05 }} />

); }; const SalesPipelineChart = () => { const [searchParams, setSearchParams] = React.useState( () => new URLSearchParams( typeof window !== "undefined" ? window.location.search : "", ), ); const quarter = searchParams.get("quarter") ?? "q3"; const handleQuarterChange = (value: string) => { const next = new URLSearchParams(searchParams); next.set("quarter", value); setSearchParams(next); window.history.replaceState(null, "", `?${next.toString()}`); }; const data = salesPipelineData[quarter] ?? salesPipelineData.q3; const totalOrders = data.reduce((sum, d) => sum + d.orders, 0); const totalSales = data.reduce((sum, d) => sum + d.sales, 0); const pipelineLabelFormatter = ( value: React.ReactNode, payload: ReadonlyArray<{ payload?: { week?: string } }> | undefined, ) => { const week = payload?.[0]?.payload?.week; if (!week) return value; return `${value} · ${week}`; }; return (

قیف فروش

{numberFormatter.format(totalOrders)}

مجموع سفارش‌ها

{ const numericValue = Number(value); const formatted = numberFormatter.format( Number.isFinite(numericValue) ? numericValue : 0, ); return (

سفارش‌ها {formatted}

); }} /> } />

{compactCurrencyOneDecimalFormatter.format(totalSales)}

مجموع فروش

{ const numericValue = Number(value); const formatted = currencyFormatter.format( Number.isFinite(numericValue) ? numericValue : 0, ); return (

فروش {formatted}

); }} /> } />

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

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

} />

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

منابع ترافیک

+30%

زیاد

متوسط

کم

{trafficSourcesData.map((source) => (

{source.total}

{source.weeks.map((cell, weekIndex) => { const intensity = cell.isCurrentWeek ? Math.round(cell.value * 30 + 65) : Math.round(cell.value * 35 + 15); const tooltipTitle = source.name || "کل"; const weekLabel = weekLabels[weekIndex] ?? `هفته ${(weekIndex + 1).toLocaleString("fa-IR")}`; const strength = Math.round(cell.value * 100); return (

); }; const OrderStatusChart = () => { const total = orderStatIRRata.reduce((sum, d) => sum + d.value, 0); const sliceColors = [palette.primary, palette.tertiary.light]; const [activeIndex, setActiveIndex] = React.useState(null); return (

وضعیت سفارش

} /> ( )} onMouseEnter={(_, index) => setActiveIndex(index)} onMouseLeave={() => setActiveIndex(null)} onClick={(_, index) => setActiveIndex((current) => (current === index ? null : index)) } > {orderStatIRRata.map((entry, index) => ( ))}

سفارش‌ها {numberFormatter.format(total)}

{orderStatIRRata.map((item, index) => ( ))}

); }; const RecentInvoicesTable = () => { const [searchQuery, setSearchQuery] = React.useState(""); const [statusFilter, setStatusFilter] = React.useState("all"); const [currentPage, setCurrentPage] = React.useState(1); const [pageSize, setPageSize] = React.useState(5); const [sortKey, setSortKey] = React.useState(""); const [sortDir, setSortDir] = React.useState<"asc" | "desc">("asc"); const [isHydrated, setIsHydrated] = React.useState(false); const skipNextReset = React.useRef(true); const hasActiveFilters = statusFilter !== "all"; const clearFilters = () => { setStatusFilter("all"); }; // Hydrate from URL params on mount React.useEffect(() => { if (typeof window === "undefined") return; const params = new URLSearchParams(window.location.search); const statusParam = params.get("invoiceStatus"); const pageParam = Number.parseInt(params.get("page") ?? "", 10); const pageSizeParam = Number.parseInt(params.get("pageSize") ?? "", 10); const sortKeyParam = params.get("sortKey") as InvoiceSortKey | null; const sortDirParam = params.get("sortDir"); setSearchQuery(params.get("q") ?? ""); setStatusFilter( statusParam && invoiceStatuses.includes(statusParam as InvoiceStatus) ? statusParam : "all", ); setCurrentPage(Number.isFinite(pageParam) && pageParam > 0 ? pageParam : 1); setPageSize( INVOICE_PAGE_SIZE_OPTIONS.includes(pageSizeParam) ? pageSizeParam : 5, ); if ( sortKeyParam && ["customer", "invoiceId", "date", "amount"].includes(sortKeyParam) ) { setSortKey(sortKeyParam); setSortDir(sortDirParam === "desc" ? "desc" : "asc"); } setIsHydrated(true); }, []); // Reset page to 1 when filters change React.useEffect(() => { if (!isHydrated) return; if (skipNextReset.current) { skipNextReset.current = false; return; } setCurrentPage(1); }, [searchQuery, statusFilter, pageSize, isHydrated]); // Sync state to URL React.useEffect(() => { if (!isHydrated) return; if (typeof window === "undefined") return; const params = new URLSearchParams(window.location.search); if (searchQuery) { params.set("q", searchQuery); } else { params.delete("q"); } if (statusFilter !== "all") { params.set("invoiceStatus", statusFilter); } else { params.delete("invoiceStatus"); } if (currentPage > 1) { params.set("page", String(currentPage)); } else { params.delete("page"); } if (pageSize !== INVOICE_PAGE_SIZE_OPTIONS[0]) { params.set("pageSize", String(pageSize)); } else { params.delete("pageSize"); } if (sortKey) { params.set("sortKey", sortKey); params.set("sortDir", sortDir); } else { params.delete("sortKey"); params.delete("sortDir"); } const nextQuery = params.toString(); const nextUrl = nextQuery ? `${window.location.pathname}?${nextQuery}` : window.location.pathname; window.history.replaceState(null, "", nextUrl); }, [ searchQuery, statusFilter, currentPage, pageSize, sortKey, sortDir, isHydrated, ]); const handleSort = (key: InvoiceSortKey) => { if (sortKey === key) { setSortDir((prev) => (prev === "asc" ? "desc" : "asc")); } else { setSortKey(key); setSortDir("asc"); } }; const filteredInvoices = React.useMemo(() => { return invoices.filter((invoice) => { const matchesSearch = invoice.customer.toLowerCase().includes(searchQuery.toLowerCase()) || invoice.invoiceId.toLowerCase().includes(searchQuery.toLowerCase()); const matchesStatus = statusFilter === "all" || invoice.status === statusFilter; return matchesSearch && matchesStatus; }); }, [searchQuery, statusFilter]); const sortedInvoices = React.useMemo(() => { if (!sortKey) return filteredInvoices; return [...filteredInvoices].sort((a, b) => { let cmp = 0; switch (sortKey) { case "customer": cmp = a.customer.localeCompare(b.customer); break; case "invoiceId": cmp = a.invoiceId.localeCompare(b.invoiceId); break; case "date": cmp = a.date.localeCompare(b.date); break; case "amount": cmp = a.amount - b.amount; break; } return sortDir === "desc" ? -cmp : cmp; }); }, [filteredInvoices, sortKey, sortDir]); const totalPages = Math.max(1, Math.ceil(sortedInvoices.length / pageSize)); const paginatedInvoices = React.useMemo(() => { const startIndex = (currentPage - 1) * pageSize; return sortedInvoices.slice(startIndex, startIndex + pageSize); }, [sortedInvoices, currentPage, pageSize]); const goToPage = (page: number) => { setCurrentPage(Math.max(1, Math.min(page, totalPages))); }; const sortableHeader = ( label: string, key: InvoiceSortKey, className?: string, ) => ( ); return (

فاکتورهای اخیر

{sortedInvoices.length.toLocaleString("fa-IR")}

فاکتورهای اخیر در جدول زیر نمایش داده می‌شوند.

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

{hasActiveFilters && (

فیلترها: {statusFilter !== "all" && ( )}

)}

{sortableHeader("مشتری", "customer", "min-w-[160px]")} {sortableHeader("شناسه فاکتور", "invoiceId", "min-w-[120px]")} {sortableHeader( "تاریخ", "date", "hidden min-w-[100px] sm:table-cell", )} {sortableHeader("مبلغ", "amount", "min-w-[90px]")} اولویت وضعیت {paginatedInvoices.length === 0 ? ( فاکتوری با این فیلترها یافت نشد. ) : ( paginatedInvoices.map((invoice) => (

{invoice.customerInitials} {invoice.customer}

{invoice.invoiceId} {invoiceDateFormatter.format(new Date(invoice.date))} {currencyFormatter.format(invoice.amount)} {invoicePriorityLabels[invoice.priority]} {invoiceStatusLabels[invoice.status]} )) )}

ردیف در هر صفحه: {sortedInvoices.length === 0 ? "۰" : `${((currentPage - 1) * pageSize + 1).toLocaleString("fa-IR")}-${Math.min( currentPage * pageSize, sortedInvoices.length, ).toLocaleString("fa-IR")}`}{" "} از {sortedInvoices.length.toLocaleString("fa-IR")}

{Array.from({ length: Math.min(totalPages, 5) }, (_, i) => { let pageNum: number; if (totalPages <= 5) { pageNum = i + 1; } else if (currentPage <= 3) { pageNum = i + 1; } else if (currentPage >= totalPages - 2) { pageNum = totalPages - 4 + i; } else { pageNum = currentPage - 2 + i; } return ( ); })}

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

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