عملکرد دسته‌ها

{numberFormatter.format(totalOrders)}

{Object.entries(categoryChartConfig).map(([key, config]) => (

))}

{ if (!active || !payload?.length) return null; return (

{label}

{payload.map((entry) => (

{categoryChartConfig[ entry.dataKey as keyof typeof categoryChartConfig ]?.label ?? entry.dataKey} : {numberFormatter.format(Number(entry.value))}

))}

); }} />

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

تکمیل سفارش

خروجی جدول مشاهده همه سفارش‌ها

سفارش ارسال وضعیت تحویل٪

{fulfillmentData.map((row) => (

{row.order} {dateFormatter.format(row.shipped)}

{row.segments.slice(0, 15).map((opacity, i) => { const filled = i < Math.round((row.progress / 100) * 15); return (

); })}

{row.progress.toLocaleString("fa-IR")}

))}

); }; const tableHeadClass = "text-xs font-medium text-muted-foreground sm:text-sm"; 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 RecentOrdersTable = () => { const [searchQuery, setSearchQuery] = React.useState( () => readRecentOrdersTableState().searchQuery, ); const [statusFilter, setStatusFilter] = React.useState( () => readRecentOrdersTableState().statusFilter, ); const [currentPage, setCurrentPage] = React.useState( () => readRecentOrdersTableState().currentPage, ); const [pageSize, setPageSize] = React.useState( () => readRecentOrdersTableState().pageSize, ); const isHydrated = typeof window !== "undefined"; const skipNextReset = React.useRef(true); const hasActiveFilters = statusFilter !== "all"; const clearFilters = () => { setStatusFilter("all"); }; const filteredOrders = React.useMemo(() => { return orders.filter((order) => { const matchesSearch = order.orderNumber.toLowerCase().includes(searchQuery.toLowerCase()) || order.customer.toLowerCase().includes(searchQuery.toLowerCase()); const matchesStatus = statusFilter === "all" || order.status === statusFilter; return matchesSearch && matchesStatus; }); }, [searchQuery, statusFilter]); const totalPages = Math.ceil(filteredOrders.length / pageSize); const paginatedOrders = React.useMemo(() => { const startIndex = (currentPage - 1) * pageSize; const endIndex = startIndex + pageSize; return filteredOrders.slice(startIndex, endIndex); }, [filteredOrders, currentPage, pageSize]); React.useEffect(() => { if (!isHydrated) return; if (skipNextReset.current) { skipNextReset.current = false; return; } setCurrentPage(1); }, [searchQuery, statusFilter, pageSize, isHydrated]); 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("status", statusFilter); } else { params.delete("status"); } if (currentPage > 1) { params.set("page", String(currentPage)); } else { params.delete("page"); } if (pageSize !== PAGE_SIZE_OPTIONS[0]) { params.set("pageSize", String(pageSize)); } else { params.delete("pageSize"); } const nextQuery = params.toString(); const nextUrl = nextQuery ? `${window.location.pathname}?${nextQuery}` : window.location.pathname; window.history.replaceState(null, "", nextUrl); }, [searchQuery, statusFilter, currentPage, pageSize, isHydrated]); const goToPage = (page: number) => { setCurrentPage(Math.max(1, Math.min(page, totalPages))); }; return (

سفارش‌های اخیر

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

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

{hasActiveFilters && (

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

)}

# سفارش مشتری وضعیت مجموع تاریخ {paginatedOrders.length === 0 ? ( سفارشی با این فیلترها یافت نشد. ) : ( paginatedOrders.map((order, index) => ( {((currentPage - 1) * pageSize + index + 1).toLocaleString( "fa-IR", )}

{order.orderNumber} {order.productCount.toLocaleString("fa-IR")} قلم

{order.customerInitials} {order.customer}

{orderStatusLabels[order.status]} {currencyFormatter.format(order.total)} {dateFormatter.format(order.date)} { event.preventDefault(); if (typeof window === "undefined") return; window.confirm( "این سفارش لغو شود؟ این عمل قابل بازگشت نیست.", ); }} > )) )}

ردیف در هر صفحه: {filteredOrders.length === 0 ? "۰" : `${((currentPage - 1) * pageSize + 1).toLocaleString("fa-IR")}-${Math.min( currentPage * pageSize, filteredOrders.length, ).toLocaleString("fa-IR")}`}{" "} از {filteredOrders.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 Dashboard7 = ({ className }: { className?: string }) => { return ( رفتن به محتوای اصلی ); }; export { Dashboard7 };