customers and service
This commit is contained in:
hamid zarghami
@@ -10,6 +10,8 @@ export const Pages = {
|
||||
other: "/other-service",
|
||||
detail: "/services/detail/",
|
||||
add: "/services/add",
|
||||
list: "/services/list",
|
||||
category: "/services/category",
|
||||
},
|
||||
transactions: "/transactions",
|
||||
receipts: {
|
||||
@@ -58,4 +60,8 @@ export const Pages = {
|
||||
messages: {
|
||||
list: "/messages/list",
|
||||
},
|
||||
customer: {
|
||||
list: "/customers/list",
|
||||
create: "/customers/create",
|
||||
},
|
||||
};
|
||||
|
||||
+54
-3
@@ -70,7 +70,10 @@
|
||||
},
|
||||
"submenu": {
|
||||
"services_list": "لیست سرویس ها",
|
||||
"add_service": "افزودن سرویس"
|
||||
"add_service": "افزودن سرویس",
|
||||
"service_category": "دسته بندی سرویس ها",
|
||||
"customer_list": "لیست مشتریان",
|
||||
"create_customer": "افزودن مشتری"
|
||||
},
|
||||
"header": {
|
||||
"search": "جستجو"
|
||||
@@ -131,8 +134,24 @@
|
||||
"service_icon": "آیکون سرویس",
|
||||
"upload_icon_service": "آیکون سرویس مورد نظر را آپلود کنید",
|
||||
"service_images": "تصاویر سرویس",
|
||||
"upload_images_service": "تصاویر سرویس مورد نظر را آپلود کنید"
|
||||
"upload_images_service": "تصاویر سرویس مورد نظر را آپلود کنید",
|
||||
"submit_service": "ثبت سرویس",
|
||||
"new_service": "سرویس جدید",
|
||||
"list_service": "لیست سرویس ها",
|
||||
"status": "وضعیت",
|
||||
"publish_date": "تاریخ انتشار",
|
||||
"cateory_services": "دسته بندی سرویس ها",
|
||||
"parent_category": "دسته مادر",
|
||||
"count_sub_category": "تعداد زیر دسته",
|
||||
"count_service": "تعداد سرویس",
|
||||
"add_category": "اضافه کردن دسته بندی",
|
||||
"status_category": "وضعیت دسته بندی",
|
||||
"title_category": "عنوان دسته بندی",
|
||||
"category_parent_2": "دسته بندی مادر",
|
||||
"icon_serice_category": "آیکون سرویس مورد نظر را آپلود کنید"
|
||||
},
|
||||
"save": "ذخیره",
|
||||
"search": "جستجو",
|
||||
"upload": "آپلود",
|
||||
"select": "انتخاب",
|
||||
"footer": {
|
||||
@@ -324,5 +343,37 @@
|
||||
"city": "شهر",
|
||||
"postal_code": "کد پستی"
|
||||
},
|
||||
"email": "ایمیل"
|
||||
"email": "ایمیل",
|
||||
"customer": {
|
||||
"customer_list": "لیست مشتریان",
|
||||
"add_cutomer": "افزودن مشتری",
|
||||
"name": "نام",
|
||||
"company": "سازمان / شرکت",
|
||||
"email": "ایمیل",
|
||||
"active_services": "سرویس های فعال",
|
||||
"factor": "صورت حساب ها",
|
||||
"tickets": "تیکت ها",
|
||||
"detail": "جزییات",
|
||||
"submit_customer": "ثبت مشتری",
|
||||
"family": "نام خانوادگی",
|
||||
"dateofbirth": "تاریخ تولد",
|
||||
"national_code": "کد ملی",
|
||||
"phone_number": "شماره تماس",
|
||||
"information_legal": "اطلاعات حقوقی",
|
||||
"economic_code": "کد اقتصادی",
|
||||
"id_national": "شناسه ملی",
|
||||
"enter_nation_code": "کد ملی خود را وارد کنید",
|
||||
"enter_email": "ایمیل خود را وارد کنید",
|
||||
"enter_phone_number": "شماره تماس خود را وارد کنید",
|
||||
"enter_economic_code": "کد اقتصادی را وارد کنید",
|
||||
"enter_id_nation": "شناسه ملی خود را وارد کنید",
|
||||
"registeration_id": "شناسه ثبت",
|
||||
"enter_registeration_id": "شناسه ثبت خود را وارد کنید",
|
||||
"your_phone_fixed": "شماره تماس ثابت",
|
||||
"enter_phone_fixed": "شماره تماس خود را وارد کنید",
|
||||
"state": "استان",
|
||||
"city": "شهر",
|
||||
"password": "رمز عبور",
|
||||
"reapeat_password": "تکرار رمز عبور"
|
||||
}
|
||||
}
|
||||
|
||||
@@ -0,0 +1,153 @@
|
||||
import { FC } from 'react'
|
||||
import { useTranslation } from 'react-i18next'
|
||||
import Input from '../../components/Input'
|
||||
import UploadBoxDraggble from '../../components/UploadBoxDraggble';
|
||||
import Button from '../../components/Button';
|
||||
import { TickCircle } from 'iconsax-react';
|
||||
import DatePickerComponent from '../../components/DatePicker';
|
||||
import Select from '../../components/Select';
|
||||
|
||||
const AddCustomer: FC = () => {
|
||||
|
||||
const { t } = useTranslation('global')
|
||||
|
||||
return (
|
||||
<div className='w-full mt-4'>
|
||||
<div className='flex w-full justify-between items-center'>
|
||||
<div>
|
||||
{t('customer.add_cutomer')}
|
||||
</div>
|
||||
<div>
|
||||
<Button
|
||||
className='px-5'
|
||||
>
|
||||
<div className='flex gap-2'>
|
||||
<TickCircle
|
||||
className='size-5'
|
||||
color='#fff'
|
||||
/>
|
||||
<div>{t('customer.submit_customer')}</div>
|
||||
</div>
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
<div className='flex gap-6'>
|
||||
<div className='flex-1'>
|
||||
|
||||
<div className='flex-1 mt-10 bg-white py-8 xl:px-10 px-4 rounded-3xl'>
|
||||
<div className='rowTwoInput'>
|
||||
<Input
|
||||
label={t('customer.name')}
|
||||
/>
|
||||
|
||||
<Input
|
||||
label={t('customer.family')}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className='mt-8 rowTwoInput'>
|
||||
<DatePickerComponent
|
||||
label={t('customer.dateofbirth')}
|
||||
onChange={() => null}
|
||||
placeholder=''
|
||||
/>
|
||||
<Input
|
||||
label={t('customer.national_code')}
|
||||
placeholder={t('customer.enter_nation_code')}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className='mt-8 rowTwoInput'>
|
||||
<Input
|
||||
label={t('customer.email')}
|
||||
placeholder={t('customer.enter_email')}
|
||||
/>
|
||||
|
||||
<Input
|
||||
label={t('customer.phone_number')}
|
||||
placeholder={t('customer.enter_phone_number')}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className='mt-8'>
|
||||
{t('customer.information_legal')}
|
||||
</div>
|
||||
|
||||
<div className='mt-8 rowTwoInput'>
|
||||
<Input
|
||||
label={t('customer.economic_code')}
|
||||
placeholder={t('customer.enter_economic_code')}
|
||||
/>
|
||||
|
||||
<Input
|
||||
label={t('customer.id_national')}
|
||||
placeholder={t('customer.enter_id_nation')}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className='mt-8 rowTwoInput'>
|
||||
<Input
|
||||
label={t('customer.registeration_id')}
|
||||
placeholder={t('customer.enter_registeration_id')}
|
||||
/>
|
||||
|
||||
<Input
|
||||
label={t('customer.your_phone_fixed')}
|
||||
placeholder={t('customer.enter_phone_fixed')}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className='mt-8 rowTwoInput'>
|
||||
<Select
|
||||
label={t('customer.state')}
|
||||
items={[
|
||||
{ value: '1', label: '1' },
|
||||
{ value: '2', label: '2' },
|
||||
{ value: '3', label: '3' },
|
||||
]}
|
||||
placeholder={t('select')}
|
||||
/>
|
||||
|
||||
<Select
|
||||
label={t('customer.city')}
|
||||
items={[
|
||||
{ value: '1', label: '1' },
|
||||
{ value: '2', label: '2' },
|
||||
{ value: '3', label: '3' },
|
||||
]}
|
||||
placeholder={t('select')}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className='bg-white mt-10 w-sidebar text-xs hidden 2xl:block h-fit px-5 py-7 rounded-3xl'>
|
||||
|
||||
<div>
|
||||
<Input
|
||||
label={t('customer.password')}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className='mt-5'>
|
||||
<Input
|
||||
label={t('customer.reapeat_password')}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className='mt-8'>
|
||||
<div>{t('service.service_icon')}</div>
|
||||
<div className='mt-2'>
|
||||
<UploadBoxDraggble
|
||||
label={t('service.upload_icon_service')}
|
||||
onChange={() => null}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default AddCustomer
|
||||
@@ -0,0 +1,124 @@
|
||||
import { FC } from 'react'
|
||||
import { useTranslation } from 'react-i18next'
|
||||
import Button from '../../components/Button'
|
||||
import { Add, Eye } from 'iconsax-react'
|
||||
import Select from '../../components/Select'
|
||||
import Input from '../../components/Input'
|
||||
import Td from '../../components/Td'
|
||||
import { Link } from 'react-router-dom'
|
||||
import { Pages } from '../../config/Pages'
|
||||
|
||||
const CustomerList: FC = () => {
|
||||
|
||||
const { t } = useTranslation('global')
|
||||
|
||||
return (
|
||||
<div className='mt-4'>
|
||||
<div className='flex w-full justify-between items-center'>
|
||||
<div>
|
||||
{t('customer.customer_list')}
|
||||
</div>
|
||||
<div>
|
||||
<Button
|
||||
className='px-5'
|
||||
>
|
||||
<div className='flex gap-2'>
|
||||
<Add
|
||||
className='size-5'
|
||||
color='#fff'
|
||||
/>
|
||||
<div>{t('customer.add_cutomer')}</div>
|
||||
</div>
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className='flex justify-between items-center mt-12'>
|
||||
<div className='flex gap-4'>
|
||||
<Select
|
||||
className='w-36'
|
||||
items={[
|
||||
{ label: 'All', value: 'all' },
|
||||
{ label: 'Active', value: 'active' },
|
||||
{ label: 'Inactive', value: 'inactive' },
|
||||
]}
|
||||
placeholder={t('service.category')}
|
||||
/>
|
||||
<Select
|
||||
className='w-36'
|
||||
items={[
|
||||
{ label: 'All', value: 'all' },
|
||||
{ label: 'Active', value: 'active' },
|
||||
{ label: 'Inactive', value: 'inactive' },
|
||||
]}
|
||||
placeholder={t('service.status')}
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<Input
|
||||
variant='search'
|
||||
placeholder={t('service.search')}
|
||||
className='bg-white border border-border'
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className='relative overflow-x-auto rounded-3xl mt-9 w-full'>
|
||||
<table className='w-full text-sm '>
|
||||
<thead className='thead'>
|
||||
<tr>
|
||||
<Td text={t('customer.name')} />
|
||||
<Td text={t('customer.company')} />
|
||||
<Td text={t('customer.email')} />
|
||||
<Td text={t('customer.active_services')} />
|
||||
<Td text={t('customer.factor')} />
|
||||
<Td text={t('customer.tickets')} />
|
||||
<Td text={t('customer.detail')} />
|
||||
<Td text={''} />
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr className='tr'>
|
||||
<Td text='مهرداد مظفری' />
|
||||
<Td text={'شرکت داناک'} />
|
||||
<Td text={'info@example.com'} />
|
||||
<Td text={'2 سرویس'} />
|
||||
<Td text={''}>
|
||||
<div className='text-[#0047FF]'>۳ صورت حساب</div>
|
||||
</Td>
|
||||
<Td text={''}>
|
||||
<div className='text-[#0047FF]'>۴ تیکت</div>
|
||||
</Td>
|
||||
<Td text={''}>
|
||||
<Link to={Pages.ticket.detail + '1'}>
|
||||
<Eye size={20} color='#8C90A3' />
|
||||
</Link>
|
||||
</Td>
|
||||
<Td text={''} />
|
||||
</tr>
|
||||
<tr className='tr'>
|
||||
<Td text='مهرداد مظفری' />
|
||||
<Td text={'شرکت داناک'} />
|
||||
<Td text={'info@example.com'} />
|
||||
<Td text={'2 سرویس'} />
|
||||
<Td text={''}>
|
||||
<div className='text-[#0047FF]'>۳ صورت حساب</div>
|
||||
</Td>
|
||||
<Td text={''}>
|
||||
<div className='text-[#0047FF]'>۴ تیکت</div>
|
||||
</Td>
|
||||
<Td text={''}>
|
||||
<Link to={Pages.ticket.detail + '1'}>
|
||||
<Eye size={20} color='#8C90A3' />
|
||||
</Link>
|
||||
</Td>
|
||||
<Td text={''} />
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default CustomerList
|
||||
@@ -6,6 +6,8 @@ import Quill from 'quill';
|
||||
import SwitchComponent from '../../components/Switch';
|
||||
import CheckBoxComponent from '../../components/CheckBoxComponent';
|
||||
import UploadBoxDraggble from '../../components/UploadBoxDraggble';
|
||||
import Button from '../../components/Button';
|
||||
import { TickCircle } from 'iconsax-react';
|
||||
|
||||
const AddService: FC = () => {
|
||||
|
||||
@@ -29,8 +31,23 @@ const AddService: FC = () => {
|
||||
|
||||
return (
|
||||
<div className='w-full mt-4'>
|
||||
<div>
|
||||
{t('service.add_service')}
|
||||
<div className='flex w-full justify-between items-center'>
|
||||
<div>
|
||||
{t('service.add_service')}
|
||||
</div>
|
||||
<div>
|
||||
<Button
|
||||
className='px-5'
|
||||
>
|
||||
<div className='flex gap-2'>
|
||||
<TickCircle
|
||||
className='size-5'
|
||||
color='#fff'
|
||||
/>
|
||||
<div>{t('service.submit_service')}</div>
|
||||
</div>
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
<div className='flex gap-6'>
|
||||
<div className='flex-1'>
|
||||
|
||||
@@ -0,0 +1,137 @@
|
||||
import { FC } from 'react'
|
||||
import { useTranslation } from 'react-i18next'
|
||||
import Select from '../../components/Select'
|
||||
import Input from '../../components/Input'
|
||||
import Td from '../../components/Td'
|
||||
import SwitchComponent from '../../components/Switch'
|
||||
import UploadBoxDraggble from '../../components/UploadBoxDraggble'
|
||||
import Button from '../../components/Button'
|
||||
import { TickCircle } from 'iconsax-react'
|
||||
|
||||
const Category: FC = () => {
|
||||
|
||||
const { t } = useTranslation('global')
|
||||
|
||||
return (
|
||||
<div className='mt-4'>
|
||||
<div>
|
||||
{t('service.cateory_services')}
|
||||
</div>
|
||||
|
||||
<div className='flex gap-6 mt-9'>
|
||||
<div className='flex-1'>
|
||||
<div className='flex justify-between items-center'>
|
||||
<div className='w-32'>
|
||||
<Select
|
||||
items={[
|
||||
{ label: 'All', value: 'all' },
|
||||
{ label: 'Active', value: 'active' },
|
||||
{ label: 'Inactive', value: 'inactive' },
|
||||
]}
|
||||
placeholder={t('service.category')}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className='w-40'>
|
||||
<Input
|
||||
variant='search'
|
||||
placeholder={t('search')}
|
||||
className='bg-white'
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className='flex-1 mt-8 bg-white py-2 xl:px-10 px-5 rounded-3xl'>
|
||||
<div className='relative overflow-x-auto rounded-3xl w-full'>
|
||||
<table className='w-full text-sm '>
|
||||
<thead className='thead'>
|
||||
<tr>
|
||||
<Td text='' />
|
||||
<Td text={t('service.title')} />
|
||||
<Td text={t('service.parent_category')} />
|
||||
<Td text={t('service.count_sub_category')} />
|
||||
<Td text={t('service.count_service')} />
|
||||
<Td text={t('ticket.status')} />
|
||||
<Td text={''} />
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr className='tr'>
|
||||
<Td text=''>
|
||||
<div className='size-10 rounded-lg bg-red-100'></div>
|
||||
</Td>
|
||||
<Td text={'کسب و کار'} />
|
||||
<Td text={'-'} />
|
||||
<Td text={'2'} />
|
||||
<Td text={'14'} />
|
||||
<Td text={''}>
|
||||
<SwitchComponent
|
||||
active
|
||||
onChange={() => null}
|
||||
/>
|
||||
</Td>
|
||||
<Td text={''} />
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className='bg-white p-8 w-sidebar hidden xl:block rounded-3xl overflow-hidden relative'>
|
||||
<div>
|
||||
{t('service.add_category')}
|
||||
</div>
|
||||
|
||||
<div className='mt-8 flex justify-between'>
|
||||
<div className='text-sm'>
|
||||
{t('service.status_category')}
|
||||
</div>
|
||||
<div className='flex'>
|
||||
<SwitchComponent active onChange={() => { }} />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className='mt-8'>
|
||||
<Input
|
||||
label={t('service.title_category')}
|
||||
/>
|
||||
</div>
|
||||
<div className='mt-6'>
|
||||
<Select
|
||||
label={t('service.category_parent_2')}
|
||||
items={[
|
||||
{ label: 'All', value: 'all' },
|
||||
{ label: 'Active', value: 'active' },
|
||||
{ label: 'Inactive', value: 'inactive' },
|
||||
]}
|
||||
placeholder={t('select')}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className='mt-6'>
|
||||
<UploadBoxDraggble
|
||||
label={t('service.icon_serice_category')}
|
||||
onChange={() => null}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className='flex flex-1 justify-end items-end mt-8'>
|
||||
<Button
|
||||
className='w-fit px-5'
|
||||
>
|
||||
<div className='flex items-center gap-2'>
|
||||
<TickCircle
|
||||
className='size-5'
|
||||
color='white'
|
||||
/>
|
||||
<div>{t('save')}</div>
|
||||
</div>
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default Category
|
||||
@@ -0,0 +1,110 @@
|
||||
import { FC } from 'react'
|
||||
import { useTranslation } from 'react-i18next'
|
||||
import Button from '../../components/Button'
|
||||
import { Add, Eye } from 'iconsax-react'
|
||||
import Select from '../../components/Select'
|
||||
import Input from '../../components/Input'
|
||||
import Td from '../../components/Td'
|
||||
import { Link } from 'react-router-dom'
|
||||
import { Pages } from '../../config/Pages'
|
||||
import SwitchComponent from '../../components/Switch'
|
||||
|
||||
const ListService: FC = () => {
|
||||
|
||||
const { t } = useTranslation('global')
|
||||
|
||||
return (
|
||||
<div className='mt-4'>
|
||||
<div className='flex w-full justify-between items-center'>
|
||||
<div>
|
||||
{t('service.list_service')}
|
||||
</div>
|
||||
<div>
|
||||
<Button
|
||||
className='px-5'
|
||||
>
|
||||
<div className='flex gap-2'>
|
||||
<Add
|
||||
className='size-5'
|
||||
color='#fff'
|
||||
/>
|
||||
<div>{t('service.submit_service')}</div>
|
||||
</div>
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className='flex justify-between items-center mt-12'>
|
||||
<div className='flex gap-4'>
|
||||
<Select
|
||||
className='w-36'
|
||||
items={[
|
||||
{ label: 'All', value: 'all' },
|
||||
{ label: 'Active', value: 'active' },
|
||||
{ label: 'Inactive', value: 'inactive' },
|
||||
]}
|
||||
placeholder={t('service.category')}
|
||||
/>
|
||||
<Select
|
||||
className='w-36'
|
||||
items={[
|
||||
{ label: 'All', value: 'all' },
|
||||
{ label: 'Active', value: 'active' },
|
||||
{ label: 'Inactive', value: 'inactive' },
|
||||
]}
|
||||
placeholder={t('service.status')}
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<Input
|
||||
variant='search'
|
||||
placeholder={t('service.search')}
|
||||
className='bg-white border border-border'
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className='relative overflow-x-auto rounded-3xl mt-9 w-full'>
|
||||
<table className='w-full text-sm '>
|
||||
<thead className='thead'>
|
||||
<tr>
|
||||
<Td text='' />
|
||||
<Td text={t('service.title')} />
|
||||
<Td text={t('service.company_developed')} />
|
||||
<Td text={t('service.category')} />
|
||||
<Td text={t('service.publish_date')} />
|
||||
<Td text={t('ticket.status')} />
|
||||
<Td text={t('ticket.detail')} />
|
||||
<Td text={''} />
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr className='tr'>
|
||||
<Td text=''>
|
||||
<div className='size-10 rounded-lg bg-red-100'></div>
|
||||
</Td>
|
||||
<Td text={'دی منو'} />
|
||||
<Td text={'شرکت داناک'} />
|
||||
<Td text={'رستوران'} />
|
||||
<Td text={'۱۴۰۳/۰۹/۳۰'} />
|
||||
<Td text={''}>
|
||||
<SwitchComponent
|
||||
active
|
||||
onChange={() => null}
|
||||
/>
|
||||
</Td>
|
||||
<Td text={''}>
|
||||
<Link to={Pages.ticket.detail + '1'}>
|
||||
<Eye size={20} color='#8C90A3' />
|
||||
</Link>
|
||||
</Td>
|
||||
<Td text={''} />
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default ListService
|
||||
@@ -25,6 +25,10 @@ import { clx } from '../helpers/utils'
|
||||
import { useSharedStore } from '../shared/store/sharedStore'
|
||||
import CreateReceipt from '../pages/receipts/Create'
|
||||
import AddService from '../pages/service/AddService'
|
||||
import ListService from '../pages/service/List'
|
||||
import Category from '../pages/service/Category'
|
||||
import CustomerList from '../pages/customer/List'
|
||||
import CreateCustomer from '../pages/customer/Create'
|
||||
|
||||
const MainRouter: FC = () => {
|
||||
|
||||
@@ -48,6 +52,8 @@ const MainRouter: FC = () => {
|
||||
<Route path={Pages.services.other} element={<OtherServices />} />
|
||||
<Route path={Pages.services.detail + ':id'} element={<DetailService />} />
|
||||
<Route path={Pages.services.add} element={<AddService />} />
|
||||
<Route path={Pages.services.list} element={<ListService />} />
|
||||
<Route path={Pages.services.category} element={<Category />} />
|
||||
<Route path={Pages.ticket.list} element={<TicketList />} />
|
||||
<Route path={Pages.ticket.create} element={<CreateTicket />} />
|
||||
<Route path={Pages.ticket.detail + ':id'} element={<TicketDetail />} />
|
||||
@@ -62,6 +68,9 @@ const MainRouter: FC = () => {
|
||||
<Route path={Pages.setting} element={<Setting />} />
|
||||
<Route path={Pages.wallet} element={<Wallet />} />
|
||||
<Route path={Pages.profile} element={<Profile />} />
|
||||
<Route path={Pages.customer.list} element={<CustomerList />} />
|
||||
<Route path={Pages.customer.create} element={<CreateCustomer />} />
|
||||
|
||||
</Routes>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -12,6 +12,7 @@ import ServicesSubMenu from './components/ServicesSubMenu'
|
||||
import { SideBarItemHasSubMenu } from '../config/SideBarSubMenu'
|
||||
import TransactionsSubMenu from './components/TransactionsSubMenu'
|
||||
import ReceiptSubMenu from './components/ReceiptSubMenu'
|
||||
import CustomerSubMenu from './components/CustomerSubMenu'
|
||||
|
||||
const SideBar: FC = () => {
|
||||
|
||||
@@ -253,7 +254,9 @@ const SideBar: FC = () => {
|
||||
<TransactionsSubMenu />
|
||||
: subMenuName === 'receipts' ?
|
||||
<ReceiptSubMenu />
|
||||
: null
|
||||
: subMenuName === 'customers' ?
|
||||
<CustomerSubMenu />
|
||||
: null
|
||||
}
|
||||
</div>
|
||||
}
|
||||
|
||||
@@ -0,0 +1,45 @@
|
||||
import { People } from 'iconsax-react'
|
||||
import { FC } from 'react'
|
||||
import { useTranslation } from 'react-i18next'
|
||||
import SubMenuItem from './SubMenuItem'
|
||||
import { Pages } from '../../config/Pages'
|
||||
|
||||
const CustomerSubMenu: FC = () => {
|
||||
|
||||
const { t } = useTranslation('global')
|
||||
|
||||
const isActive = (name: string) => {
|
||||
return location.pathname.includes(name)
|
||||
}
|
||||
|
||||
return (
|
||||
<div className='py-12'>
|
||||
<div className='flex gap-3 items-center border-b pb-10 px-6'>
|
||||
<People
|
||||
size={24}
|
||||
color='#000'
|
||||
variant='Bold'
|
||||
/>
|
||||
<div className='text-xs'>
|
||||
{t('sidebar.customers')}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className='flex flex-col mt-10 gap-4'>
|
||||
<SubMenuItem
|
||||
title={t('submenu.customer_list')}
|
||||
isActive={isActive('list')}
|
||||
link={Pages.customer.list}
|
||||
/>
|
||||
<SubMenuItem
|
||||
title={t('submenu.create_customer')}
|
||||
isActive={isActive('create')}
|
||||
link={Pages.customer.create}
|
||||
/>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default CustomerSubMenu
|
||||
@@ -32,13 +32,18 @@ const ServicesSubMenu: FC = () => {
|
||||
<SubMenuItem
|
||||
title={t('submenu.services_list')}
|
||||
isActive={isActive('list')}
|
||||
link={Pages.services.mine}
|
||||
link={Pages.services.list}
|
||||
/>
|
||||
<SubMenuItem
|
||||
title={t('submenu.add_service')}
|
||||
isActive={isActive('add')}
|
||||
link={Pages.services.add}
|
||||
/>
|
||||
<SubMenuItem
|
||||
title={t('submenu.service_category')}
|
||||
isActive={isActive('category')}
|
||||
link={Pages.services.category}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
|
||||
Reference in New Issue
Block a user