other services
This commit is contained in:
Binary file not shown.
|
After Width: | Height: | Size: 318 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 133 KiB |
+4
-1
@@ -80,7 +80,10 @@
|
|||||||
"service": {
|
"service": {
|
||||||
"my_service": "سرویس های من",
|
"my_service": "سرویس های من",
|
||||||
"search": "جستجو در سرویس ها",
|
"search": "جستجو در سرویس ها",
|
||||||
"active_menu": "منو فعال"
|
"active_menu": "منو فعال",
|
||||||
|
"selected_danak": "انتخاب داناک",
|
||||||
|
"buy": "خرید",
|
||||||
|
"other_services": "سایر سرویس ها"
|
||||||
},
|
},
|
||||||
"ticket": {
|
"ticket": {
|
||||||
"tickets": "تیکت ها",
|
"tickets": "تیکت ها",
|
||||||
|
|||||||
@@ -0,0 +1,209 @@
|
|||||||
|
import { Carousel } from '@material-tailwind/react'
|
||||||
|
import { FC } from 'react'
|
||||||
|
import { useTranslation } from 'react-i18next'
|
||||||
|
import BannerImage from '../../assets/images/banner2.jpeg'
|
||||||
|
import RobotImage from '../../assets/images/robot.jpeg'
|
||||||
|
import { ArrowLeft } from 'iconsax-react'
|
||||||
|
import TitleLine from '../../components/TitleLine'
|
||||||
|
import { SIDEBAR_SIZE_LEFT } from '../../config/Const'
|
||||||
|
import Button from '../../components/Button'
|
||||||
|
import ServiceSection from '../../components/ServiceSection'
|
||||||
|
|
||||||
|
const OtherServices: FC = () => {
|
||||||
|
|
||||||
|
const { t } = useTranslation('global')
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className='w-full flex gap-6'>
|
||||||
|
<div className='flex-1'>
|
||||||
|
<Carousel autoplay className="rounded-xl h-fit dltr" placeholder="" onPointerEnterCapture={() => { }} onPointerLeaveCapture={() => { }} >
|
||||||
|
<div className='relative drtl'>
|
||||||
|
<img src={BannerImage} className='w-full max-h-[300px] h-full object-cover rounded-3xl' />
|
||||||
|
<div className='absolute bg-black bg-opacity-20 size-full top-0 right-0 py-6 px-8 flex flex-col justify-between'>
|
||||||
|
<button className="px-8 w-fit py-1.5 bg-white bg-opacity-10 text-white text-sm rounded-full shadow-md ">
|
||||||
|
{t('home.new')}
|
||||||
|
</button>
|
||||||
|
|
||||||
|
<div className='max-w-[340px] font-medium text-white text-lg leading-10'>
|
||||||
|
<div>
|
||||||
|
سفارش نرمافزار اختصاصی: سرمایهای برای آینده یا فقط هزینهای برای امروز؟
|
||||||
|
</div>
|
||||||
|
<div className='mt-3 text-border text-xs'>
|
||||||
|
۸ دقیقه مطالعه
|
||||||
|
</div>
|
||||||
|
<button className='mt-3 px-4 h-9 flex gap-2 items-center text-xs rounded-2.5 bg-black text-white'>
|
||||||
|
<div>
|
||||||
|
{t('home.study')}
|
||||||
|
</div>
|
||||||
|
<ArrowLeft size={14} color='white' />
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className='relative drtl'>
|
||||||
|
<img src={BannerImage} className='w-full max-h-[300px] object-cover rounded-3xl' />
|
||||||
|
<div className='absolute bg-black bg-opacity-20 size-full top-0 right-0 py-6 px-8 flex flex-col justify-between'>
|
||||||
|
<button className="px-8 w-fit py-1.5 bg-white bg-opacity-10 text-white text-sm rounded-full shadow-md ">
|
||||||
|
{t('home.new')}
|
||||||
|
</button>
|
||||||
|
|
||||||
|
<div className='max-w-[340px] font-medium text-white text-lg leading-10'>
|
||||||
|
<div>
|
||||||
|
سفارش نرمافزار اختصاصی: سرمایهای برای آینده یا فقط هزینهای برای امروز؟
|
||||||
|
</div>
|
||||||
|
<div className='mt-3 text-border text-xs'>
|
||||||
|
۸ دقیقه مطالعه
|
||||||
|
</div>
|
||||||
|
<button className='mt-3 px-4 h-9 flex gap-2 items-center text-xs rounded-2.5 bg-black text-white'>
|
||||||
|
<div>
|
||||||
|
{t('home.study')}
|
||||||
|
</div>
|
||||||
|
<ArrowLeft size={14} color='white' />
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</Carousel>
|
||||||
|
|
||||||
|
|
||||||
|
<div className='w-full mt-8'>
|
||||||
|
<TitleLine title={t('service.selected_danak')} />
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className='flex gap-6 items-center mt-8'>
|
||||||
|
<div className='flex-1 bg-white rounded-3xl p-6'>
|
||||||
|
<div className='flex gap-2 items-center'>
|
||||||
|
<div className='size-[50px] bg-[#FF7B00] rounded-xl'></div>
|
||||||
|
<div>
|
||||||
|
دی منو
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className='mt-4 text-xs'>
|
||||||
|
<div className='font-extralight'>منو رستوران </div>
|
||||||
|
<p className='text-description mt-2'>
|
||||||
|
دی منو، راهی ساده و هوشمند برای مدیریت منو شما!
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className='mt-4'>
|
||||||
|
<Button
|
||||||
|
className='h-8 w-fit px-5 text-xs text-black bg-description bg-opacity-20 rounded-xl'
|
||||||
|
>
|
||||||
|
<div className='flex gap-2'>
|
||||||
|
<div>{t('service.buy')}</div>
|
||||||
|
<ArrowLeft color='black' size={16} />
|
||||||
|
</div>
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className='flex-1 bg-white rounded-3xl p-6'>
|
||||||
|
<div className='flex gap-2 items-center'>
|
||||||
|
<div className='size-[50px] bg-[#FF7B00] rounded-xl'></div>
|
||||||
|
<div>
|
||||||
|
دی منو
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className='mt-4 text-xs'>
|
||||||
|
<div className='font-extralight'>منو رستوران </div>
|
||||||
|
<p className='text-description mt-2'>
|
||||||
|
دی منو، راهی ساده و هوشمند برای مدیریت منو شما!
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className='mt-4'>
|
||||||
|
<Button
|
||||||
|
className='h-8 w-fit px-5 text-xs text-black bg-description bg-opacity-20 rounded-xl'
|
||||||
|
>
|
||||||
|
<div className='flex gap-2'>
|
||||||
|
<div>{t('service.buy')}</div>
|
||||||
|
<ArrowLeft color='black' size={16} />
|
||||||
|
</div>
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className='flex-1 bg-white rounded-3xl p-6'>
|
||||||
|
<div className='flex gap-2 items-center'>
|
||||||
|
<div className='size-[50px] bg-[#FF7B00] rounded-xl'></div>
|
||||||
|
<div>
|
||||||
|
دی منو
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className='mt-4 text-xs'>
|
||||||
|
<div className='font-extralight'>منو رستوران </div>
|
||||||
|
<p className='text-description mt-2'>
|
||||||
|
دی منو، راهی ساده و هوشمند برای مدیریت منو شما!
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className='mt-4'>
|
||||||
|
<Button
|
||||||
|
className='h-8 w-fit px-5 text-xs text-black bg-description bg-opacity-20 rounded-xl'
|
||||||
|
>
|
||||||
|
<div className='flex gap-2'>
|
||||||
|
<div>{t('service.buy')}</div>
|
||||||
|
<ArrowLeft color='black' size={16} />
|
||||||
|
</div>
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className='w-full mt-8'>
|
||||||
|
<TitleLine title={t('service.other_services')} />
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className='flex w-full gap-6 items-center mt-8'>
|
||||||
|
<div className='flex gap-6 items-center mt-8'>
|
||||||
|
<div className='flex-1 bg-white rounded-3xl py-4 px-6'>
|
||||||
|
<div className='flex justify-between items-center'>
|
||||||
|
<ServiceSection
|
||||||
|
/>
|
||||||
|
<Button
|
||||||
|
className='h-8 w-fit px-2 text-xs text-black bg-description bg-opacity-20 rounded-xl'
|
||||||
|
>
|
||||||
|
<div className='flex gap-2'>
|
||||||
|
<div>{t('service.buy')}</div>
|
||||||
|
<ArrowLeft color='black' size={16} />
|
||||||
|
</div>
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div className='flex-1 bg-white rounded-3xl py-4 px-6'>
|
||||||
|
<div className='flex justify-between items-center'>
|
||||||
|
<ServiceSection
|
||||||
|
/>
|
||||||
|
<Button
|
||||||
|
className='h-8 w-fit px-2 text-xs text-black bg-description bg-opacity-20 rounded-xl'
|
||||||
|
>
|
||||||
|
<div className='flex gap-2'>
|
||||||
|
<div>{t('service.buy')}</div>
|
||||||
|
<ArrowLeft color='black' size={16} />
|
||||||
|
</div>
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div style={{ width: SIDEBAR_SIZE_LEFT }} className='bg-white h-fit rounded-3xl overflow-hidden relative'>
|
||||||
|
<img
|
||||||
|
src={RobotImage}
|
||||||
|
className='w-full backdrop-blur-[100px] h-[550px] object-cover'
|
||||||
|
/>
|
||||||
|
|
||||||
|
<div className='absolute flex items-center px-4 w-full bottom-0 h-[86px] bg-black bg-opacity-5 backdrop-blur-[14px]'>
|
||||||
|
<div className='max-w-[80%] text-sm leading-6 text-white'>
|
||||||
|
سفارش نرمافزار اختصاصی: سرمایهای برای آینده یا فقط هزینهای برای امروز؟
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export default OtherServices
|
||||||
@@ -17,6 +17,7 @@ import Setting from '../pages/setting/Setting'
|
|||||||
import Wallet from '../pages/wallet/Wallet'
|
import Wallet from '../pages/wallet/Wallet'
|
||||||
import ReceiptsDetail from '../pages/receipts/Detail'
|
import ReceiptsDetail from '../pages/receipts/Detail'
|
||||||
import Profile from '../pages/profile/Profile'
|
import Profile from '../pages/profile/Profile'
|
||||||
|
import OtherServices from '../pages/service/OtherServices'
|
||||||
|
|
||||||
const MainRouter: FC = () => {
|
const MainRouter: FC = () => {
|
||||||
return (
|
return (
|
||||||
@@ -29,6 +30,7 @@ const MainRouter: FC = () => {
|
|||||||
<Routes>
|
<Routes>
|
||||||
<Route path={Pages.dashboard} element={<Home />} />
|
<Route path={Pages.dashboard} element={<Home />} />
|
||||||
<Route path={Pages.services.mine} element={<MyServices />} />
|
<Route path={Pages.services.mine} element={<MyServices />} />
|
||||||
|
<Route path={Pages.services.other} element={<OtherServices />} />
|
||||||
<Route path={Pages.ticket.list} element={<TicketList />} />
|
<Route path={Pages.ticket.list} element={<TicketList />} />
|
||||||
<Route path={Pages.ticket.create} element={<CreateTicket />} />
|
<Route path={Pages.ticket.create} element={<CreateTicket />} />
|
||||||
<Route path={Pages.ticket.detail + ':id'} element={<TicketDetail />} />
|
<Route path={Pages.ticket.detail + ':id'} element={<TicketDetail />} />
|
||||||
|
|||||||
Reference in New Issue
Block a user