danak/dmenu-admin
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

user Addresses

Browse Source
This commit is contained in:
hamid zarghami
2026-06-23 11:16:25 +03:30
parent 223b1b5e8f
commit 45494d7ae5
9 changed files with 422 additions and 167 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/pages/orders/components/CreateOrderSidebar.tsx
+117 -134
View File
@@ -1,148 +1,131 @@
import { type FC } from 'react'
import { ShoppingCart, User } from 'iconsax-react'
import type { FormikProps } from 'formik'
import { formatFaNumber, formatPrice } from '@/helpers/func'
import { PaymentMethodEnum } from '@/pages/paymentMethods/enum/Enum'
import { DeliveryMethodEnum } from '@/pages/shipmentMethod/enum/Enum'
import type { CreateOrderFormValues } from '../hooks/useCreateOrderForm'
import type { RestaurantPaymentMethod, RestaurantShipmentMethod } from '../hooks/useCreateOrderForm'
import { formatFaNumber, formatPrice } from "@/helpers/func";
import { PaymentMethodEnum } from "@/pages/paymentMethods/enum/Enum";
import { DeliveryMethodEnum } from "@/pages/shipmentMethod/enum/Enum";
import type { FormikProps } from "formik";
import { ShoppingCart, User } from "iconsax-react";
import { type FC } from "react";
import type { CreateOrderFormValues, RestaurantPaymentMethod, RestaurantShipmentMethod } from "../hooks/useCreateOrderForm";
interface OrderSummaryData {
lineItems: Array<{
foodId: string
title: string
image: string
quantity: number
unitPrice: number
totalPrice: number
} | null>
subTotal: number
deliveryFee: number
total: number
totalItems: number
lineItems: Array<{
foodId: string;
title: string;
image: string;
quantity: number;
unitPrice: number;
totalPrice: number;
} | null>;
subTotal: number;
deliveryFee: number;
total: number;
totalItems: number;
}
interface CreateOrderSidebarProps {
formik: FormikProps<CreateOrderFormValues>
orderSummary: OrderSummaryData
selectedDeliveryMethod?: RestaurantShipmentMethod
selectedPaymentMethod?: RestaurantPaymentMethod
formik: FormikProps<CreateOrderFormValues>;
orderSummary: OrderSummaryData;
selectedDeliveryMethod?: RestaurantShipmentMethod;
selectedPaymentMethod?: RestaurantPaymentMethod;
}
const getDeliveryMethodText = (method?: string): string => {
const methodMap: Record<string, string> = {
[DeliveryMethodEnum.DineIn]: 'سرو در رستوران',
[DeliveryMethodEnum.CustomerPickup]: 'دریافت از محل',
[DeliveryMethodEnum.DeliveryCar]: 'تحویل به خودرو',
[DeliveryMethodEnum.DeliveryCourier]: 'بیرون‌بر',
}
return method ? methodMap[method] || method : '-'
}
const methodMap: Record<string, string> = {
[DeliveryMethodEnum.DineIn]: "سرو در رستوران",
[DeliveryMethodEnum.CustomerPickup]: "دریافت از محل",
[DeliveryMethodEnum.DeliveryCar]: "تحویل به خودرو",
[DeliveryMethodEnum.DeliveryCourier]: "بیرون‌بر",
};
return method ? methodMap[method] || method : "-";
};
const getPaymentMethodText = (method?: string): string => {
const methodMap: Record<string, string> = {
[PaymentMethodEnum.Cash]: 'پرداخت نقدی',
[PaymentMethodEnum.Online]: 'پرداخت آنلاین',
[PaymentMethodEnum.CreditCard]: 'کارت به کارت',
[PaymentMethodEnum.Wallet]: 'کیف پول',
}
return method ? methodMap[method] || method : '-'
}
const methodMap: Record<string, string> = {
[PaymentMethodEnum.Cash]: "پرداخت نقدی",
[PaymentMethodEnum.Online]: "پرداخت آنلاین",
[PaymentMethodEnum.CreditCard]: "کارت به کارت",
[PaymentMethodEnum.Wallet]: "کیف پول",
};
return method ? methodMap[method] || method : "-";
};
const CreateOrderSidebar: FC<CreateOrderSidebarProps> = ({
formik,
orderSummary,
selectedDeliveryMethod,
selectedPaymentMethod,
}) => {
const customerName = [formik.values.firstName, formik.values.lastName]
.filter(Boolean)
.join(' ')
const CreateOrderSidebar: FC<CreateOrderSidebarProps> = ({ formik, orderSummary, selectedDeliveryMethod, selectedPaymentMethod }) => {
const customerName = [formik.values.firstName, formik.values.lastName].filter(Boolean).join(" ");
return (
<div className='space-y-6'>
<div className='bg-white rounded-4xl p-8'>
<div className='flex items-center gap-2 text-lg font-light'>
<User size={20} color='#000' />
خلاصه سفارش
</div>
<div className='mt-6 space-y-3 text-[13px] font-light'>
<div className='flex justify-between items-center border-b border-border border-dashed pb-3'>
<span className='text-description'>مشتری</span>
<span>{customerName || '-'}</span>
</div>
<div className='flex justify-between items-center border-b border-border border-dashed pb-3'>
<span className='text-description'>شماره تماس</span>
<span>{formik.values.userPhone || '-'}</span>
</div>
<div className='flex justify-between items-center border-b border-border border-dashed pb-3'>
<span className='text-description'>روش تحویل</span>
<span>{getDeliveryMethodText(selectedDeliveryMethod?.method)}</span>
</div>
<div className='flex justify-between items-center border-b border-border border-dashed pb-3'>
<span className='text-description'>روش پرداخت</span>
<span>{getPaymentMethodText(selectedPaymentMethod?.method)}</span>
</div>
</div>
</div>
<div className='bg-white rounded-4xl p-8'>
<div className='flex items-center gap-2 text-lg font-light'>
<ShoppingCart size={20} color='#000' />
آیتم‌ها
{orderSummary.totalItems > 0 && (
<span className='text-xs text-description'>
({formatFaNumber(orderSummary.totalItems)})
</span>
)}
</div>
{orderSummary.lineItems.length === 0 ? (
<div className='mt-6 text-center text-xs text-description py-6'>
سبد خالی است
</div>
) : (
<div className='mt-6 space-y-3'>
{orderSummary.lineItems.map((item) => {
if (!item) return null
return (
<div
key={item.foodId}
className='flex justify-between items-start gap-3 text-[13px] border-b border-border border-dashed pb-3'
>
<div className='flex-1'>
<div>{item.title}</div>
<div className='text-description mt-1'>
{formatFaNumber(item.quantity)} × {formatPrice(item.unitPrice)}
</div>
</div>
<div>{formatPrice(item.totalPrice)}</div>
</div>
)
})}
</div>
)}
<div className='mt-6 space-y-3 text-[13px] font-light'>
<div className='flex justify-between items-center'>
<span className='text-description'>جمع آیتم‌ها</span>
<span>{formatPrice(orderSummary.subTotal)}</span>
</div>
{orderSummary.deliveryFee > 0 && (
<div className='flex justify-between items-center'>
<span className='text-description'>هزینه ارسال</span>
<span>{formatPrice(orderSummary.deliveryFee)}</span>
</div>
)}
<div className='flex justify-between items-center font-bold text-base pt-3 border-t-2 border-gray-200'>
<span>جمع کل (تقریبی)</span>
<span>{formatPrice(orderSummary.total)}</span>
</div>
</div>
</div>
return (
<div className="space-y-6">
<div className="bg-white rounded-4xl p-8">
<div className="flex items-center gap-2 text-lg font-light">
<User size={20} color="#000" />
خلاصه سفارش
</div>
)
}
export default CreateOrderSidebar
<div className="mt-6 space-y-3 text-[13px] font-light">
<div className="flex justify-between items-center border-b border-border border-dashed pb-3">
<span className="text-description">مشتری</span>
<span>{customerName || "-"}</span>
</div>
<div className="flex justify-between items-center border-b border-border border-dashed pb-3">
<span className="text-description">شماره تماس</span>
<span>{formik.values.userPhone || "-"}</span>
</div>
<div className="flex justify-between items-center border-b border-border border-dashed pb-3">
<span className="text-description">روش تحویل</span>
<span>{getDeliveryMethodText(selectedDeliveryMethod?.method)}</span>
</div>
<div className="flex justify-between items-center border-b border-border border-dashed pb-3">
<span className="text-description">روش پرداخت</span>
<span>{getPaymentMethodText(selectedPaymentMethod?.method)}</span>
</div>
</div>
</div>
<div className="bg-white rounded-4xl p-8">
<div className="flex items-center gap-2 text-lg font-light">
<ShoppingCart size={20} color="#000" />
آیتم‌ها
{orderSummary.totalItems > 0 && <span className="text-xs text-description">({formatFaNumber(orderSummary.totalItems)})</span>}
</div>
{orderSummary.lineItems.length === 0 ? (
<div className="mt-6 text-center text-xs text-description py-6">سبد خالی است</div>
) : (
<div className="mt-6 space-y-3">
{orderSummary.lineItems.map((item) => {
if (!item) return null;
return (
<div key={item.foodId} className="flex justify-between items-start gap-3 text-[13px] border-b border-border border-dashed pb-3">
<div className="flex-1">
<div>{item.title}</div>
<div className="text-description mt-1">
{formatFaNumber(item.quantity)} × {formatPrice(item.unitPrice)}
</div>
</div>
<div>{formatPrice(item.totalPrice)}</div>
</div>
);
})}
</div>
)}
<div className="mt-6 space-y-3 text-[13px] font-light">
<div className="flex justify-between items-center">
<span className="text-description">جمع آیتم‌ها</span>
<span>{formatPrice(orderSummary.subTotal)}</span>
</div>
{orderSummary.deliveryFee > 0 && (
<div className="flex justify-between items-center">
<span className="text-description">هزینه ارسال</span>
<span>{formatPrice(orderSummary.deliveryFee)}</span>
</div>
)}
<div className="flex justify-between items-center font-bold text-sm pt-3 border-t-2 border-gray-200">
<span>جمع کل</span>
<span>{formatPrice(orderSummary.total)}</span>
</div>
</div>
</div>
</div>
);
};
export default CreateOrderSidebar;