108 lines
4.4 KiB
TypeScript
108 lines
4.4 KiB
TypeScript
import { type FC } from 'react'
|
||
import Input from '@/components/Input'
|
||
import { User, ShoppingCart } from 'iconsax-react'
|
||
import { formatOptionalDate, formatPrice, formatFaNumber } from '@/helpers/func'
|
||
import type { ReviewDetail } from '../types/Types'
|
||
|
||
interface ReviewSidebarProps {
|
||
review: ReviewDetail
|
||
}
|
||
|
||
const ReviewSidebar: FC<ReviewSidebarProps> = ({ review }) => {
|
||
const userName = [review.user?.firstName, review.user?.lastName].filter(Boolean).join(' ') || '-'
|
||
|
||
return (
|
||
<div className='w-[330px] h-fit bg-white rounded-4xl p-8 flex flex-col gap-6'>
|
||
<div>
|
||
<div className='flex items-center gap-2 mb-4'>
|
||
<User size={20} color="#8C90A3" />
|
||
<span className='text-sm font-medium'>اطلاعات کاربر</span>
|
||
</div>
|
||
<div className='space-y-4'>
|
||
<Input label='نام و نام خانوادگی' value={userName} readOnly />
|
||
<Input label='شماره تماس' value={review.user?.phone || '-'} readOnly />
|
||
<Input
|
||
label='تاریخ تولد'
|
||
value={formatOptionalDate(review.user?.birthDate)}
|
||
readOnly
|
||
/>
|
||
<Input
|
||
label='خریدار'
|
||
value={review.isBuyer ? 'بله' : 'خیر'}
|
||
readOnly
|
||
/>
|
||
</div>
|
||
</div>
|
||
|
||
{review.order && (
|
||
<div className='pt-6 border-t border-border'>
|
||
<div className='flex items-center gap-2 mb-4'>
|
||
<ShoppingCart size={20} color="#8C90A3" />
|
||
<span className='text-sm font-medium'>اطلاعات سفارش</span>
|
||
</div>
|
||
<div className='space-y-4'>
|
||
<Input
|
||
label='شماره سفارش'
|
||
value={formatFaNumber(review.order.orderNumber)}
|
||
readOnly
|
||
/>
|
||
<Input
|
||
label='تاریخ سفارش'
|
||
value={formatOptionalDate(review.order.createdAt, {
|
||
year: 'numeric',
|
||
month: '2-digit',
|
||
day: '2-digit',
|
||
hour: '2-digit',
|
||
minute: '2-digit',
|
||
})}
|
||
readOnly
|
||
/>
|
||
<Input
|
||
label='مبلغ کل'
|
||
value={formatPrice(review.order.total)}
|
||
readOnly
|
||
/>
|
||
<Input label='وضعیت سفارش' value={review.order.status} readOnly />
|
||
<Input
|
||
label='وضعیت پرداخت'
|
||
value={review.order.paymentStatus}
|
||
readOnly
|
||
/>
|
||
</div>
|
||
</div>
|
||
)}
|
||
|
||
<div className='pt-6 border-t border-border'>
|
||
<div className='space-y-4'>
|
||
<Input
|
||
label='تاریخ ثبت نظر'
|
||
value={formatOptionalDate(review.createdAt, {
|
||
year: 'numeric',
|
||
month: '2-digit',
|
||
day: '2-digit',
|
||
hour: '2-digit',
|
||
minute: '2-digit',
|
||
})}
|
||
readOnly
|
||
/>
|
||
{review.updatedAt && (
|
||
<Input
|
||
label='تاریخ آخرین بروزرسانی'
|
||
value={formatOptionalDate(review.updatedAt, {
|
||
year: 'numeric',
|
||
month: '2-digit',
|
||
day: '2-digit',
|
||
hour: '2-digit',
|
||
minute: '2-digit',
|
||
})}
|
||
readOnly
|
||
/>
|
||
)}
|
||
</div>
|
||
</div>
|
||
</div>
|
||
)
|
||
}
|
||
|
||
export default ReviewSidebar
|