card owner

src/app/[name]/(Dialogs)/order/checkout/[id]/components/PaymentSection.tsx

@@ -74,6 +74,7 @@ export const PaymentSection = ({ paymentType, onPaymentTypeChange }: PaymentSect
                 icon: getIconByMethod(item.method),
                 method: item.method,
                 cardNumber: item.cardNumber,
+                cardOwner: item.cardOwner,
                 description: item.description,
                 isWallet: item.method === PaymentMethodEnum.Wallet,
             }));
@@ -159,6 +160,16 @@ export const PaymentSection = ({ paymentType, onPaymentTypeChange }: PaymentSect
 
                 {selectedCreditCard && (
                     <div className='mt-6 pt-4 border-t border-border flex flex-col gap-4'>
+                        {selectedCreditCard.cardOwner && (
+                            <div>
+                                <span className='text-xs text-gray-500 dark:text-gray-400'>
+                                    {tOrderDetail('SectionPayment.CreditCard.CardOwnerLabel')}
+                                </span>
+                                <p className='text-sm font-medium mt-1'>
+                                    {selectedCreditCard.cardOwner}
+                                </p>
+                            </div>
+                        )}
                         {selectedCreditCard.cardNumber && (
                             <div>
                                 <span className='text-xs text-gray-500 dark:text-gray-400'>

src/app/[name]/(Dialogs)/order/checkout/types/Types.ts

@@ -112,6 +112,7 @@ export interface PaymentMethodResponse {
   gateway: string | null;
   description: string;
   cardNumber: string | null;
+  cardOwner: string | null;
   enabled: boolean;
   order: number;
   merchantId: string | null;
@@ -362,6 +363,7 @@ export interface OrderDetailPaymentMethod {
   gateway: string | null;
   description: string;
   cardNumber: string | null;
+  cardOwner: string | null;
   enabled: boolean;
   order: number;
   merchantId: string | null;
@@ -426,6 +428,7 @@ export interface OrderDetailPayment {
   paidAt: string | null;
   failedAt: string | null;
   description: string | null;
+  attachments: string[];
 }
 
 export interface OrderDetailCarAddress {
@@ -435,6 +438,17 @@ export interface OrderDetailCarAddress {
   plateNumber: string;
 }
 
+export interface OrderDetailUserAddress {
+  city: string;
+  phone: string;
+  address: string;
+  fullName: string;
+  latitude: number;
+  province: string;
+  longitude: number;
+  postalCode: string;
+}
+
 export interface OrderDetail {
   id: string;
   createdAt: string;
@@ -443,7 +457,7 @@ export interface OrderDetail {
   user: OrderDetailUser;
   restaurant: OrderDetailRestaurant;
   deliveryMethod: OrderDetailDeliveryMethod;
-  userAddress: OrderAddress | null;
+  userAddress: OrderDetailUserAddress | null;
   carAddress: OrderDetailCarAddress | null;
   paymentMethod: OrderDetailPaymentMethod;
   orderNumber: number;
@@ -461,9 +475,12 @@ export interface OrderDetail {
   status:
     | "pendingPayment"
     | "new"
+    | "paid"
+    | "confirmed"
     | "preparing"
     | "ready"
     | "delivering"
+    | "completed"
     | "delivered"
     | "cancelled";
   history: OrderDetailHistory[];

src/app/[name]/(Dialogs)/order/track/[id]/page.tsx

@@ -1,6 +1,7 @@
 'use client';
 
 import { useParams, useRouter } from 'next/navigation';
+import Image from 'next/image';
 import React from 'react';
 import Button from '@/components/button/PrimaryButton';
 import { Skeleton } from '@/components/ui/skeleton';
@@ -29,6 +30,11 @@ const getDeliveryMethodTitle = (method: string) => {
     }
 };
 
+const getPaymentMethodTitle = (method: string, fallback?: string) => {
+    const methodKey = method as keyof typeof ordersTranslations.paymentMethod;
+    return ordersTranslations.paymentMethod[methodKey] || fallback || 'نامشخص';
+};
+
 // const getStatusPercentage = (status: string) => {
 //     switch (status) {
 //         case 'new':
@@ -164,6 +170,46 @@ function OrderTrackingPage() {
                                     </div>
                                 )}
 
+                                {orderDetail.data.paymentMethod && (
+                                    <div className='flex justify-between items-center h-16 border-b border-border'>
+                                        <span className='text-sm text-muted-foreground'>نوع پرداخت</span>
+                                        <span className='text-sm font-semibold'>
+                                            {getPaymentMethodTitle(
+                                                orderDetail.data.paymentMethod.method,
+                                                orderDetail.data.paymentMethod.description
+                                            )}
+                                        </span>
+                                    </div>
+                                )}
+
+                                {orderDetail.data.payments?.[0]?.description?.trim() && (
+                                    <div className='py-3 border-b border-border'>
+                                        <div className='text-sm text-muted-foreground mb-1'>توضیحات پرداخت</div>
+                                        <div className='text-sm'>{orderDetail.data.payments[0].description}</div>
+                                    </div>
+                                )}
+
+                                {orderDetail.data.payments?.[0]?.attachments?.length ? (
+                                    <div className='py-3 border-b border-border'>
+                                        <div className='text-sm text-muted-foreground mb-2'>پیوست پرداخت</div>
+                                        <div className='flex flex-col gap-2'>
+                                            {orderDetail.data.payments[0].attachments.map((attachment, index) => (
+                                                <div
+                                                    key={attachment}
+                                                    className='relative w-full h-40 rounded-normal overflow-hidden border border-border'
+                                                >
+                                                    <Image
+                                                        src={attachment}
+                                                        alt={`پیوست پرداخت ${index + 1}`}
+                                                        fill
+                                                        className='object-contain'
+                                                    />
+                                                </div>
+                                            ))}
+                                        </div>
+                                    </div>
+                                ) : null}
+
                                 <div className='flex justify-between items-center py-4 border-t border-border'>
                                     <span className='text-sm font-medium'>مجموع سفارش</span>
                                     <span className='text-sm font-bold '>

src/locales/fa/parallels.json

@@ -68,6 +68,7 @@
     "SectionPayment": {
       "Title": "انتخاب شیوه پرداخت",
       "CreditCard": {
+        "CardOwnerLabel": "نام صاحب کارت",
         "CardNumberLabel": "شماره کارت",
         "PaymentDescLabel": "توضیحات پرداخت",
         "PaymentDescPlaceholder": "مثال: واریز از حساب با شماره ۱۲۳۴",