سفارشهای من
- - {orderGroups.length === 0 &&هنوز سفارشی ثبت نکردهاید.
} - -
- {orderGroups.map((group) => (
-
-
-
- {new Date(group.created_at).toLocaleDateString("fa-IR")}
- {PAYMENT_STATUS_LABELS_FA[group.payment_status]}
-
-
- {group.orders.map((order) => (
-
- {order.store.name}
-
- ))}
-
-
- مجموع
- {group.total_amount.toLocaleString("fa-IR")} تومان
-
-
- ))}
- در حال بارگذاری...
;
+ }
+
+ if (error || !orderGroup) {
+ return (
+
+ {error ?? "سفارش یافت نشد"}
+
+ );
+ }
+
+ // وضعیت اصلی رو از اولین سفارش میگیریم (یا میتونی منطق پیچیدهتری بذاری)
+ const mainStatus = orderGroup.orders[0]?.status ?? "placed";
+
+ const statusToStep: Record+ {statusLabel} +
+ + {mainStatus !== "cancelled" && ( +
+
+ )
+}
+
+export default OrderEmpty
\ No newline at end of file
diff --git a/src/components/orders/order-header.tsx b/src/components/orders/order-header.tsx
new file mode 100644
index 0000000..cd6ea49
--- /dev/null
+++ b/src/components/orders/order-header.tsx
@@ -0,0 +1,44 @@
+'use client';
+
+import { ArrowRight, ShoppingBagIcon } from 'lucide-react';
+import { usePathname, useRouter } from 'next/navigation';
+
+const OrderHeader = () => {
+ const router = useRouter();
+ const pathname = usePathname();
+ const isExactOrders = pathname === '/orders';
+
+ const onBackHandler = () => {
+ router.back();
+ };
+
+ const goToCartPage = () => {
+ router.push('/cart');
+ };
+
+ return (
+
+
+
+
+ هنوز سفارشی ثبت نکردهاید
+لیست سفارشهای شما در حال حاضر خالی است. برای خرید از فروشگاههای اطراف روی دکمه زیر کلیک کنید.
+ شروع خرید +
+
+
+ {isExactOrders && (
+ سفارشها
+
+
+ )}
+
+
+
+
+ 90
+
+
+ {/* هدر */}
+
+ );
+};
+
+export default OrderItem;
\ No newline at end of file
diff --git a/src/components/orders/order-items.tsx b/src/components/orders/order-items.tsx
new file mode 100644
index 0000000..5e86468
--- /dev/null
+++ b/src/components/orders/order-items.tsx
@@ -0,0 +1,45 @@
+"use client";
+
+import type { OrderGroup } from "@/types/api";
+import {formatTomanPrice} from "@/lib/utils/priceUtils";
+
+interface Props {
+ order: OrderGroup;
+}
+
+const OrderItems = ({ order }: Props) => {
+ // همه آیتمهای همه فروشگاهها رو جمع میکنیم
+ const allItems = order.orders.flatMap((o) =>
+ o.items.map((item) => ({
+ ...item,
+ storeName: o.store.name,
+ }))
+ );
+
+ return (
+
+
+
+
+
+ {/* پایین کارت */}
+
+
+
+
+ {currentStatus.label}
+
+
+ {mainOrder?.store.logo_url ? (
+ 
+ ) : (
+ mainOrder?.store.name?.charAt(0) ?? "س"
+ )}
+
+
+
+ {storeNames}
++ {orderGroup.orders.length > 1 + ? `${orderGroup.orders.length} فروشگاه` + : mainOrder?.items[0]?.product_name_snapshot ?? "سفارش"} +
+
+
+
+
+
+ {images.length > 0 ? (
+ images.map((img) => (
+
+
+
+ {img.src ? (
+ 
+ ) : (
+
+ ))
+ ) : (
+
+ {img.alt.charAt(0)}
+
+ )}
+ بدون تصویر
+ )}
+
+
+ {timeText}
+
+ {totalItems} کالا • {orderGroup.total_amount.toLocaleString("fa-IR")} تومان
+
+
+
+ );
+};
+
+export default OrderItems;
\ No newline at end of file
diff --git a/src/components/orders/order-payment-sticky.tsx b/src/components/orders/order-payment-sticky.tsx
new file mode 100644
index 0000000..afc47bb
--- /dev/null
+++ b/src/components/orders/order-payment-sticky.tsx
@@ -0,0 +1,48 @@
+"use client";
+
+import type { OrderGroup } from "@/types/api";
+import {formatTomanPrice} from "@/lib/utils/priceUtils";
+
+interface Props {
+ order: OrderGroup;
+}
+
+const OrderPaymentSticky = ({ order }: Props) => {
+ const paymentMethodLabel: Recordاقلام سفارش
+ + {allItems.map((item) => ( +
+
+ ))}
+
+
+
+ {formatTomanPrice(item.line_total)}
+
+
+ {item.product_name_snapshot}
+
+ {item.quantity.toLocaleString("fa-IR")} عدد
+
+
+ {order.orders.length > 1 && (
+ {item.storeName}
+ )}
+
+
+ );
+};
+
+export default OrderPaymentSticky;
\ No newline at end of file
diff --git a/src/components/orders/order-server-error.tsx b/src/components/orders/order-server-error.tsx
new file mode 100644
index 0000000..d9764ba
--- /dev/null
+++ b/src/components/orders/order-server-error.tsx
@@ -0,0 +1,24 @@
+import { ServerCrashIcon } from 'lucide-react'
+import React from 'react'
+
+const OrderServerError = () => {
+ return (
+
+
+
+
+
+
+ {/* فعلاً فقط نمایش، بعداً میتونی دکمه لغو اضافه کنی */}
+
+
+ مبلغ پرداختی
+
+ {paymentMethodLabel[order.payment_method] ?? order.payment_method}
+
+
+
+ {formatTomanPrice(order.total_amount)}
+
+
+
+
+
+
+ )
+}
+
+export default OrderServerError
\ No newline at end of file
diff --git a/src/components/orders/order-stepper-status.tsx b/src/components/orders/order-stepper-status.tsx
new file mode 100644
index 0000000..e21217e
--- /dev/null
+++ b/src/components/orders/order-stepper-status.tsx
@@ -0,0 +1,100 @@
+import React from 'react'
+import { Check } from 'lucide-react'
+
+type StepStatus = 'completed' | 'current' | 'upcoming'
+
+interface Step {
+ label: string
+ status: StepStatus
+}
+
+interface OrderStepperStatusProps {
+ /** ایندکس مرحله فعلی (۰-based). مراحل قبل completed، خودش current، بعد upcoming */
+ currentStep?: number
+ steps?: string[]
+}
+
+const DEFAULT_STEPS = [
+ 'ثبت شد',
+ 'پذیرفته شد',
+ 'آمادهسازی',
+ 'ارسال شد',
+ 'تحویل',
+]
+
+const OrderStepperStatus = ({
+ currentStep = 2,
+ steps = DEFAULT_STEPS,
+}: OrderStepperStatusProps) => {
+ const computedSteps: Step[] = steps.map((label, index) => {
+ if (index < currentStep) return { label, status: 'completed' }
+ if (index === currentStep) return { label, status: 'current' }
+ return { label, status: 'upcoming' }
+ })
+
+ return (
+
+
+
+ {/* 
+
+
+ خطا در برقراری ارتباط
++ متأسفانه در دریافت اطلاعات سفارشها مشکلی پیش آمده است. لطفاً اتصال اینترنت خود را بررسی کرده و مجدداً تلاش کنید. +
+ +
+
+ )
+}
+
+export default OrderStepperStatus
\ No newline at end of file
diff --git a/src/components/orders/order-time-address-info-alert.tsx b/src/components/orders/order-time-address-info-alert.tsx
new file mode 100644
index 0000000..b490233
--- /dev/null
+++ b/src/components/orders/order-time-address-info-alert.tsx
@@ -0,0 +1,35 @@
+"use client";
+
+import { ClockIcon, MapPinIcon } from "lucide-react";
+import type { OrderGroup } from "@/types/api";
+
+interface Props {
+ order: OrderGroup;
+}
+
+const OrderTimeAddressInfoAlert = ({ order }: Props) => {
+ // زمان تخمینی (فعلاً ساده)
+ const estimatedTime =
+ order.delivery_type === "express"
+ ? "۳۰–۴۵ دقیقه دیگر"
+ : order.scheduled_at
+ ? new Date(order.scheduled_at).toLocaleString("fa-IR")
+ : "زمان مشخص نشده";
+
+ return (
+
+ {computedSteps.map((step, index) => {
+ const isLast = index === computedSteps.length - 1
+ const isCompleted = step.status === 'completed'
+ const isCurrent = step.status === 'current'
+
+ const circleBg = step.status === 'upcoming' ? 'bg-gray-300' : 'bg-primary-action'
+ const nextLineBg =
+ index < currentStep ? 'bg-primary-action' : 'bg-gray-300'
+
+ return (
+
+
+ )
+ })}
+
+
+
+ {isCompleted && (
+
+
+ {!isLast && (
+
+ )}
+
+ {computedSteps.map((step, index) => {
+ const isLast = index === computedSteps.length - 1
+ const textColor =
+ step.status === 'upcoming'
+ ? 'text-gray-500'
+ : 'text-primary-action'
+
+ return (
+
+
+ )
+ })}
+
+
+
+ {step.label}
+
+
+ {!isLast && }
+
+
+ );
+};
+
+export default OrderTimeAddressInfoAlert;
\ No newline at end of file
diff --git a/src/components/orders/orders-skeleton.tsx b/src/components/orders/orders-skeleton.tsx
new file mode 100644
index 0000000..233ec2e
--- /dev/null
+++ b/src/components/orders/orders-skeleton.tsx
@@ -0,0 +1,47 @@
+import React from 'react';
+
+const OrdersSkeleton = () => {
+ return (
+
+
+ + زمان تخمینی تحویل: {estimatedTime} +
+
+
+ {order.full_address}
+
+ {Array.from({ length: 10 }).map((_, index) => (
+
+ );
+};
+
+export default OrdersSkeleton;
\ No newline at end of file
diff --git a/src/lib/providers/order-detail-provider.tsx b/src/lib/providers/order-detail-provider.tsx
new file mode 100644
index 0000000..9d95b9a
--- /dev/null
+++ b/src/lib/providers/order-detail-provider.tsx
@@ -0,0 +1,42 @@
+"use client";
+
+import {createContext, useContext, type ReactNode} from "react";
+import type {Order, OrderGroup} from "@/types/api";
+
+type OrderDetailContextValue = {
+ data: OrderGroup | null;
+ error: string | null;
+ isLoading: boolean;
+};
+
+const OrderDetailContext = createContext
+
+ ))}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {Array.from({ length: 3 }).map((_, imgIndex) => (
+
+ ))}
+
+
+
+
+
+
+