fix: order page
This commit is contained in:
@@ -8,6 +8,7 @@ import TabContainer from '@/components/tab/TabContainer'
|
||||
import { TabHeader } from '@/components/tab/TabHeader';
|
||||
import { Receipt2, ReceiptItem } from 'iconsax-react';
|
||||
import Image from 'next/image';
|
||||
import Link from 'next/link';
|
||||
import React from 'react'
|
||||
import { useTranslation } from 'react-i18next';
|
||||
|
||||
@@ -153,7 +154,63 @@ function OrdersIndex() {
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<Button className='mt-6 font-medium!'>{t('Card.TrackOrder')}</Button>
|
||||
<Link href={`track/${order.id}`}>
|
||||
<Button className='mt-6 font-medium!'>{t('Card.TrackOrder')}</Button>
|
||||
</Link>
|
||||
</div>
|
||||
)
|
||||
})
|
||||
}
|
||||
|
||||
const secondTab = () => {
|
||||
return currentOrders.map((order) => {
|
||||
return (
|
||||
<div key={order.id} className='w-full px-[17px] mb-4 pt-8 pb-6 bg-white rounded-3xl'>
|
||||
<div className="text-sm2">
|
||||
<div className='flex gap-2'>
|
||||
<LocationPinIcon size={16} />
|
||||
<p>{order.address}</p>
|
||||
</div>
|
||||
<div className='mt-2 flex gap-2'>
|
||||
<CalendarIcon size={16} />
|
||||
<p>{order.date}</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<hr className='mx-4 mt-6 text-disabled3 border-2' />
|
||||
|
||||
<div className='flex justify-between mt-6'>
|
||||
<div className='flex justify-start gap-[9px]'>
|
||||
{order.items.map((item) => {
|
||||
return (
|
||||
<span key={item.id} className='w-8 h-8 relative'>
|
||||
<Image
|
||||
priority
|
||||
className='rounded-lg'
|
||||
src={item.image}
|
||||
width={32}
|
||||
height={32}
|
||||
alt="order image"
|
||||
/>
|
||||
<span className="absolute -bottom-3.5 -right-0.5 text-xs2 bg-white border border-border rounded-full w-[18px] h-[18px] text-center leading-4.5">
|
||||
{item.quantity}
|
||||
</span>
|
||||
</span>
|
||||
)
|
||||
})}
|
||||
</div>
|
||||
<div className='font-medium text-sm' dir='ltr'>
|
||||
{order.price} T
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className='grid grid-cols-2 gap-4'>
|
||||
<Link href={`rate/${order.id}`}>
|
||||
<Button className='mt-6 font-medium!'>{t('Card.Rate')}</Button>
|
||||
</Link>
|
||||
<Button className='mt-6 font-medium! bg-disabled! text-disabled-text!'>{t('Card.Reorder')}</Button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
)
|
||||
})
|
||||
@@ -168,7 +225,7 @@ function OrdersIndex() {
|
||||
title={categories[0].title} icon={categories[0].icon}>
|
||||
</TabHeader>
|
||||
<TabHeader
|
||||
viewRenderer={<PerformantTabRenderer><div>empty</div><div></div></PerformantTabRenderer>}
|
||||
viewRenderer={<PerformantTabRenderer rowHeight={320}>{secondTab()}</PerformantTabRenderer>}
|
||||
title={categories[1].title} icon={categories[1].icon}>
|
||||
</TabHeader>
|
||||
</TabContainer>
|
||||
|
||||
@@ -4,6 +4,8 @@
|
||||
"PreviousOrders": "سفارشات قبلی"
|
||||
},
|
||||
"Card": {
|
||||
"TrackOrder": "پیگیری سفارش"
|
||||
"TrackOrder": "پیگیری سفارش",
|
||||
"Reorder": "سفارش مجدد",
|
||||
"Rate": "ثبت امتیاز"
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user