sidebar
This commit is contained in:
hamid zarghami
+25
-99
@@ -5,115 +5,41 @@ export const Pages = {
|
||||
forgotPassword: "/auth/forgot",
|
||||
},
|
||||
dashboard: "/dashboard",
|
||||
services: {
|
||||
mine: "/services",
|
||||
other: "/other-service",
|
||||
detail: "/services/detail/",
|
||||
update: "/services/update/",
|
||||
add: "/services/add",
|
||||
list: "/services/list",
|
||||
category: "/services/category",
|
||||
plan: "/services/plan/",
|
||||
review: "/services/reviews",
|
||||
guide: "/services/guide/",
|
||||
foods: {
|
||||
list: "/foods/list",
|
||||
add: "/foods/add",
|
||||
category: "/foods/category",
|
||||
detail: "/foods/detail/",
|
||||
update: "/foods/update/",
|
||||
},
|
||||
sliders: {
|
||||
list: "/sliders/list",
|
||||
create: "/sliders/create",
|
||||
detail: "/sliders/detail/",
|
||||
orders: {
|
||||
list: "/orders/list",
|
||||
add: "/orders/add",
|
||||
detail: "/orders/detail/",
|
||||
},
|
||||
transactions: "/transactions",
|
||||
receipts: {
|
||||
index: "/receipts/list",
|
||||
detail: "/receipts/detail/",
|
||||
create: "/receipts/create",
|
||||
},
|
||||
ticket: {
|
||||
list: "/tickets/list",
|
||||
create: "/tickets/create",
|
||||
detail: "/tickets/messages/",
|
||||
category: "/tickets/category",
|
||||
},
|
||||
announcement: {
|
||||
list: "/announcement",
|
||||
detail: "/announcement/detail/",
|
||||
create: "/announcement/create",
|
||||
},
|
||||
criticisms: {
|
||||
list: "/criticisms/list",
|
||||
detail: "/ccriticisms/detail/",
|
||||
},
|
||||
feedback: {
|
||||
list: "/feedback/list",
|
||||
},
|
||||
learning: {
|
||||
list: "/learning/list",
|
||||
detail: "/learning/detail/",
|
||||
create: "/learning/create",
|
||||
category: "/learning/category",
|
||||
},
|
||||
setting: "/setting",
|
||||
wallet: "/wallet",
|
||||
profile: "/profile",
|
||||
customers: {
|
||||
list: "/customers/list",
|
||||
},
|
||||
representative: {
|
||||
list: "/representatives/list",
|
||||
},
|
||||
developers: {
|
||||
list: "/developers/list",
|
||||
add: "/customers/add",
|
||||
detail: "/customers/detail/",
|
||||
update: "/customers/update/",
|
||||
},
|
||||
discount: {
|
||||
list: "/discounts/list",
|
||||
create: "/discounts/create",
|
||||
add: "/discounts/add",
|
||||
detail: "/discounts/detail/",
|
||||
update: "/discounts/update/",
|
||||
},
|
||||
referralCode: {
|
||||
list: "/referral-code/list",
|
||||
announcements: {
|
||||
list: "/announcements/list",
|
||||
add: "/announcements/add",
|
||||
detail: "/announcements/detail/",
|
||||
},
|
||||
users: {
|
||||
list: "/users/list",
|
||||
create: "/users/create",
|
||||
detail: "/users/detail/",
|
||||
roleList: "/users/roles-all",
|
||||
roleCreate: "/users/roles-add",
|
||||
groupAdd: "/users/group-add",
|
||||
groupList: "/users/groups",
|
||||
reports: {
|
||||
list: "/reports/list",
|
||||
},
|
||||
ads: {
|
||||
list: "/ads/list",
|
||||
create: "/ads/create",
|
||||
update: "/ads/update/",
|
||||
},
|
||||
blog: {
|
||||
list: "/blog/list",
|
||||
create: "/blog/create",
|
||||
category: "/blog/category",
|
||||
detail: "/blog/detail/",
|
||||
comments: "/blog/comments",
|
||||
},
|
||||
messages: {
|
||||
list: "/messages/list",
|
||||
detail: "/messages/detail/",
|
||||
},
|
||||
customer: {
|
||||
list: "/customers/list",
|
||||
create: "/customers/create",
|
||||
update: "/customers/update/",
|
||||
},
|
||||
cardBank: {
|
||||
list: "/card-bank/list",
|
||||
create: "/card-bank/create",
|
||||
detail: "/card-bank/detail/",
|
||||
},
|
||||
payment: {
|
||||
list: "/payments/list",
|
||||
},
|
||||
support: {
|
||||
create: "/support/create",
|
||||
list: "/support/list",
|
||||
detail: "/support/detail/",
|
||||
planUsers: "/support/plan-users/",
|
||||
comments: {
|
||||
list: "/comments/list",
|
||||
detail: "/comments/detail/",
|
||||
},
|
||||
setting: "/setting",
|
||||
};
|
||||
|
||||
@@ -1,10 +1,6 @@
|
||||
export const SideBarItemHasSubMenu = [
|
||||
"services",
|
||||
"foods",
|
||||
"orders",
|
||||
"customers",
|
||||
"receipts",
|
||||
"users",
|
||||
"tickets",
|
||||
"learning",
|
||||
"blog",
|
||||
"support",
|
||||
"discounts",
|
||||
];
|
||||
|
||||
+20
-48
@@ -44,35 +44,17 @@
|
||||
"description": "توضیحات",
|
||||
"sidebar": {
|
||||
"menu": "منو",
|
||||
"services": "سرویس ها",
|
||||
"customers": "مشتریان",
|
||||
"representatives": "نمایندگان",
|
||||
"developers": "توسعه دهندگان",
|
||||
"discounts": "تخفیف ها",
|
||||
"code_referral": "کد ارجاع",
|
||||
"users": "کاربران",
|
||||
"mnage_content": "مدیریت محتوا",
|
||||
"ads": "تبلیغات",
|
||||
"blog": "بلاگ",
|
||||
"messages": "پیام ها",
|
||||
|
||||
"mainpage": "صفحه اصلی",
|
||||
"myservice": "سرویس های من",
|
||||
"other_service": "سایر سرویس ها",
|
||||
"receipt_list": "لیست صورتحساب",
|
||||
"transactions": "تراکنش ها",
|
||||
"foods": "غذا ها",
|
||||
"orders": "سفارشات",
|
||||
"customers": "مشتریان",
|
||||
"discount": "کد تخفیف",
|
||||
"other": "سایر",
|
||||
"ticket": "تیکت ها",
|
||||
"announcement": "اطلاعیه ها",
|
||||
"criticisms": "انتقادات",
|
||||
"learning": "آموزش",
|
||||
"announcements": "اطلاعیه ها",
|
||||
"reports": "گزارشات",
|
||||
"comments": "نظرات",
|
||||
"setting": "تنظیمات",
|
||||
"logout": "خروج",
|
||||
"card": "حساب های بانکی",
|
||||
"payments": "پرداخت ها",
|
||||
"sliders": "اسلایدر",
|
||||
"support": "پلن پشتیبانی",
|
||||
"feedback": "گزارش ها"
|
||||
"logout": "خروج"
|
||||
},
|
||||
"slider": {
|
||||
"new_slider": "اسلایدر جدید",
|
||||
@@ -91,23 +73,15 @@
|
||||
"slider_deleted": "اسلایدر با موفقیت حذف شد"
|
||||
},
|
||||
"submenu": {
|
||||
"services_list": "لیست سرویس ها",
|
||||
"add_service": "افزودن سرویس",
|
||||
"service_category": "دسته بندی سرویس ها",
|
||||
"customer_list": "لیست مشتریان",
|
||||
"create_customer": "افزودن مشتری",
|
||||
"ticket_list": "لیست تیکت ها",
|
||||
"send_ticket": "ارسال تیکت",
|
||||
"category": "دسته بندی",
|
||||
"user_list": "لیست کاربران",
|
||||
"add_user": "افزودن کاربر",
|
||||
"role_list": "لیست نقش ها",
|
||||
"role_create": "افزودن نقش",
|
||||
"reviews": "نظرات",
|
||||
"create_plan": "ایجاد پلن",
|
||||
"plan_users": "کاربران پلن",
|
||||
"plan_list": "لیست پلن ها",
|
||||
"guide": "راهنمای سرویس"
|
||||
"foods_list": "لیست غذا ها",
|
||||
"add_food": "افزودن غذا",
|
||||
"categories": "دسته بندی ها",
|
||||
"orders_list": "لیست سفارشات",
|
||||
"add_order": "افزودن سفارش",
|
||||
"discount_list": "لیست تخفیف",
|
||||
"add_discount": "افزودن تخفیف",
|
||||
"customers_list": "لیست مشتریان",
|
||||
"add_customer": "افزودن مشتری"
|
||||
},
|
||||
"guide": {
|
||||
"list_guide": "لیست راهنمای سرویس",
|
||||
@@ -241,12 +215,10 @@
|
||||
"select": "انتخاب",
|
||||
"footer": {
|
||||
"home": "صفحه اصلی",
|
||||
"other_services": "سایر سرویس ها",
|
||||
"my_services": "سرویس های من",
|
||||
"announcements": "اطلاعیه ها",
|
||||
"tickets": "تیکت ها",
|
||||
"customers": "مشتریان",
|
||||
"receipts": "صورت حساب ها"
|
||||
"foods": "غذا ها",
|
||||
"announcements": "اطلاعیه ها",
|
||||
"orders": "سفارشات"
|
||||
},
|
||||
"ticket": {
|
||||
"tickets": "تیکت ها",
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import { Home2, Messages3, NotificationStatus, People, Receipt21 } from 'iconsax-react'
|
||||
import { Home2, DocumentText, NotificationStatus, People, Element3 } from 'iconsax-react'
|
||||
import { type FC } from 'react'
|
||||
import { useTranslation } from 'react-i18next'
|
||||
import { Pages } from '../config/Pages'
|
||||
@@ -23,7 +23,7 @@ const Footer: FC = () => {
|
||||
</div>
|
||||
</div>
|
||||
</Link>
|
||||
<Link to={Pages.customer.list}>
|
||||
<Link to={Pages.customers.list}>
|
||||
<div className='text-description w-[70px] flex flex-col items-center gap-1.5'>
|
||||
<People
|
||||
className='size-5'
|
||||
@@ -34,22 +34,22 @@ const Footer: FC = () => {
|
||||
</div>
|
||||
</div>
|
||||
</Link>
|
||||
<Link to={Pages.receipts.index}>
|
||||
<Link to={Pages.foods.list}>
|
||||
<div className='text-description w-[70px] flex flex-col items-center gap-1.5'>
|
||||
<div className='bg-white p-1 rounded-full -mt-7'>
|
||||
<div className='bg-black flex justify-center items-center size-10 rounded-full'>
|
||||
<Receipt21
|
||||
<Element3
|
||||
className='size-5'
|
||||
color='white'
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className='text-[10px] '>
|
||||
{t('footer.receipts')}
|
||||
{t('footer.foods')}
|
||||
</div>
|
||||
</div>
|
||||
</Link>
|
||||
<Link to={Pages.announcement.list}>
|
||||
<Link to={Pages.announcements.list}>
|
||||
<div className='text-description w-[70px] flex flex-col items-center gap-1.5'>
|
||||
<NotificationStatus
|
||||
className='size-5'
|
||||
@@ -61,14 +61,14 @@ const Footer: FC = () => {
|
||||
</div>
|
||||
</Link>
|
||||
|
||||
<Link to={Pages.ticket.list}>
|
||||
<Link to={Pages.orders.list}>
|
||||
<div className='text-description w-[70px] flex flex-col items-center gap-1.5'>
|
||||
<Messages3
|
||||
<DocumentText
|
||||
className='size-5'
|
||||
color='#8C90A3'
|
||||
/>
|
||||
<div className='text-[10px]'>
|
||||
{t('footer.tickets')}
|
||||
{t('footer.orders')}
|
||||
</div>
|
||||
</div>
|
||||
</Link>
|
||||
|
||||
+51
-209
@@ -2,37 +2,30 @@ import { type FC, useEffect } from 'react'
|
||||
import LogoImage from '../assets/images/logo.svg'
|
||||
import LogoSmall from '../assets/images/logo-small.svg'
|
||||
import { useTranslation } from 'react-i18next'
|
||||
import { Card, Code, CodeCircle, DocumentLike, DocumentText, Element3, Gallery, Headphone, Home2, Logout, Message, Messages3, Money3, NotificationStatus, People, Profile, Receipt21, Setting2, SmsTracking, Teacher, TicketDiscount, UserSquare } from 'iconsax-react'
|
||||
import { Element3, DocumentText, Home2, Logout, Message, NotificationStatus, People, Setting2, TicketDiscount, Chart } from 'iconsax-react'
|
||||
import SideBarItem from './SideBarItem'
|
||||
import { useLocation } from 'react-router-dom'
|
||||
import { Pages } from '../config/Pages'
|
||||
import { useSharedStore } from './store/sharedStore'
|
||||
import { clx } from '../helpers/utils'
|
||||
import ServicesSubMenu from './components/ServicesSubMenu'
|
||||
import FoodsSubMenu from './components/FoodsSubMenu'
|
||||
import OrdersSubMenu from './components/OrdersSubMenu'
|
||||
import CustomersSubMenu from './components/CustomersSubMenu'
|
||||
import DiscountSubMenu from './components/DiscountSubMenu'
|
||||
import { SideBarItemHasSubMenu } from '../config/SideBarSubMenu'
|
||||
import ReceiptSubMenu from './components/ReceiptSubMenu'
|
||||
import CustomerSubMenu from './components/CustomerSubMenu'
|
||||
import TicketSubMenu from './components/TicketSubMenu'
|
||||
import UsersSubMenu from './components/UsersSubMenu'
|
||||
import LearningSubMenu from './components/LearningSubMenu'
|
||||
import BlogSubMenu from './components/BlogSubMenu'
|
||||
// import { useGetProfile } from '../pages/profile/hooks/useProfileData'
|
||||
import SupportSubMenu from './components/SupportSubMenu'
|
||||
const SideBar: FC = () => {
|
||||
|
||||
const { t } = useTranslation('global')
|
||||
const { openSidebar, setOpenSidebar, hasSubMenu, setSubMenuName, setSubtMenu, subMenuName } = useSharedStore()
|
||||
const location = useLocation()
|
||||
// const { data: profile } = useGetProfile()
|
||||
|
||||
const isActive = (name: string) => {
|
||||
return location.pathname.includes(name)
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
|
||||
const split = location.pathname.split('/')
|
||||
|
||||
|
||||
if (SideBarItemHasSubMenu.includes(split[1])) {
|
||||
setSubMenuName(split[1])
|
||||
setSubtMenu(true)
|
||||
@@ -40,12 +33,9 @@ const SideBar: FC = () => {
|
||||
setSubMenuName('')
|
||||
setSubtMenu(false)
|
||||
}
|
||||
|
||||
|
||||
// eslint-disable-next-line react-hooks/exhaustive-deps
|
||||
}, [location.pathname])
|
||||
|
||||
|
||||
const iconSizeSideBar = 20
|
||||
|
||||
|
||||
@@ -87,211 +77,71 @@ const SideBar: FC = () => {
|
||||
activeName=''
|
||||
/>
|
||||
<SideBarItem
|
||||
icon={<Element3 variant={isActive('services') ? 'Bold' : 'Outline'} color={isActive('services') ? 'black' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
title={t('sidebar.services')}
|
||||
isActive={isActive('services')}
|
||||
link={Pages.services.list}
|
||||
name='services'
|
||||
activeName='services'
|
||||
icon={<Element3 variant={isActive('foods') ? 'Bold' : 'Outline'} color={isActive('foods') ? 'black' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
title={t('sidebar.foods')}
|
||||
isActive={isActive('foods')}
|
||||
link={Pages.foods.list}
|
||||
name='foods'
|
||||
activeName='foods'
|
||||
/>
|
||||
|
||||
<SideBarItem
|
||||
icon={<Headphone variant={isActive('support') ? 'Bold' : 'Outline'} color={isActive('support') ? 'black' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
title={t('sidebar.support')}
|
||||
isActive={isActive('support')}
|
||||
link={Pages.support.list}
|
||||
activeName='support_plan'
|
||||
icon={<DocumentText variant={isActive('orders') ? 'Bold' : 'Outline'} color={isActive('orders') ? 'black' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
title={t('sidebar.orders')}
|
||||
isActive={isActive('orders')}
|
||||
link={Pages.orders.list}
|
||||
name='orders'
|
||||
activeName='orders'
|
||||
/>
|
||||
|
||||
<SideBarItem
|
||||
icon={<People variant={isActive('customers') ? 'Bold' : 'Outline'} color={isActive('customers') ? 'black' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
title={t('sidebar.customers')}
|
||||
isActive={isActive('customers')}
|
||||
link={Pages.customers.list}
|
||||
name='customers'
|
||||
activeName='customers'
|
||||
/>
|
||||
<SideBarItem
|
||||
icon={<UserSquare variant={isActive('representatives') ? 'Bold' : 'Outline'} color={isActive('representatives') ? 'black' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
title={t('sidebar.representatives')}
|
||||
isActive={isActive('representatives')}
|
||||
link={Pages.representative.list}
|
||||
activeName='agents'
|
||||
/>
|
||||
<SideBarItem
|
||||
icon={<CodeCircle variant={isActive('developers') ? 'Bold' : 'Outline'} color={isActive('developers') ? 'black' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
title={t('sidebar.developers')}
|
||||
isActive={isActive('developers')}
|
||||
link={Pages.developers.list}
|
||||
activeName='developers'
|
||||
/>
|
||||
|
||||
|
||||
<SideBarItem
|
||||
icon={<Receipt21 variant={isActive('receipts') ? 'Bold' : 'Outline'} color={isActive('receipts') ? 'black' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
title={t('sidebar.receipt_list')}
|
||||
isActive={isActive('receipts')}
|
||||
link={Pages.receipts.index}
|
||||
activeName='invoices'
|
||||
/>
|
||||
<SideBarItem
|
||||
icon={<Card variant={isActive('transactions') ? 'Bold' : 'Outline'} color={isActive('transactions') ? 'black' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
title={t('sidebar.transactions')}
|
||||
isActive={isActive('transactions')}
|
||||
link={Pages.transactions}
|
||||
activeName='transactions'
|
||||
/>
|
||||
<SideBarItem
|
||||
icon={<Money3 variant={isActive('payments') ? 'Bold' : 'Outline'} color={isActive('payments') ? 'black' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
title={t('sidebar.payments')}
|
||||
isActive={isActive('payments')}
|
||||
link={Pages.payment.list}
|
||||
activeName='payments'
|
||||
/>
|
||||
<SideBarItem
|
||||
icon={<TicketDiscount variant={isActive('discounts') ? 'Bold' : 'Outline'} color={isActive('discounts') ? 'black' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
title={t('sidebar.discounts')}
|
||||
title={t('sidebar.discount')}
|
||||
isActive={isActive('discounts')}
|
||||
link={Pages.discount.list}
|
||||
name='discounts'
|
||||
activeName='discounts'
|
||||
/>
|
||||
<SideBarItem
|
||||
icon={<Code variant={isActive('referral-code') ? 'Bold' : 'Outline'} color={isActive('referral-code') ? 'black' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
title={t('sidebar.code_referral')}
|
||||
isActive={isActive('referral-code')}
|
||||
link={Pages.referralCode.list}
|
||||
activeName='referralCode'
|
||||
/>
|
||||
<SideBarItem
|
||||
icon={<Profile variant={isActive('users') ? 'Bold' : 'Outline'} color={isActive('users') ? 'black' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
title={t('sidebar.users')}
|
||||
isActive={isActive('users')}
|
||||
link={Pages.users.list}
|
||||
activeName='admins'
|
||||
/>
|
||||
<SideBarItem
|
||||
icon={<Gallery variant={isActive('sliders') ? 'Bold' : 'Outline'} color={isActive('sliders') ? 'black' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
title={t('sidebar.sliders')}
|
||||
isActive={isActive('sliders')}
|
||||
link={Pages.sliders.list}
|
||||
activeName='blogs'
|
||||
/>
|
||||
|
||||
<SideBarItem
|
||||
icon={<Message variant={isActive('feedback') ? 'Bold' : 'Outline'} color={isActive('feedback') ? 'black' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
title={t('sidebar.feedback')}
|
||||
isActive={isActive('feedback')}
|
||||
link={Pages.feedback.list}
|
||||
activeName='services'
|
||||
/>
|
||||
|
||||
</div>
|
||||
|
||||
{/* {
|
||||
profile?.data?.user?.roles.some((role: { name: string }) => role.name === 'super_admin') &&
|
||||
<div className={clx(
|
||||
'mt-10 px-12 text-header text-sm font-normal',
|
||||
hasSubMenu && 'px-2 text-center'
|
||||
)}>
|
||||
{t('sidebar.other')}
|
||||
</div>
|
||||
} */}
|
||||
|
||||
|
||||
|
||||
|
||||
<div className='text-xs text-[#8C90A3]'>
|
||||
<SideBarItem
|
||||
icon={<Messages3 variant={isActive('tickets') ? 'Bold' : 'Outline'} color={isActive('tickets') ? 'black' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
title={t('sidebar.ticket')}
|
||||
isActive={isActive('tickets')}
|
||||
link={Pages.ticket.list}
|
||||
activeName='tickets'
|
||||
/>
|
||||
<div className={clx(
|
||||
'mt-10 px-12 text-header text-sm font-normal',
|
||||
hasSubMenu && 'px-2 text-center'
|
||||
)}>
|
||||
{t('sidebar.other')}
|
||||
</div>
|
||||
|
||||
<div className='text-xs text-[#8C90A3]'>
|
||||
<SideBarItem
|
||||
icon={<DocumentText variant={isActive('criticisms') ? 'Bold' : 'Outline'} color={isActive('criticisms') ? 'black' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
title={t('sidebar.criticisms')}
|
||||
isActive={isActive('criticisms')}
|
||||
link={Pages.criticisms.list}
|
||||
activeName='criticisms'
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* {
|
||||
profile?.data?.user?.roles?.some((role: { name: string }) => role.name === 'super_admin') &&
|
||||
<div className={clx(
|
||||
'mt-10 px-12 text-header text-sm font-normal',
|
||||
hasSubMenu && 'px-2 text-center text-xs'
|
||||
)}>
|
||||
{t('sidebar.mnage_content')}
|
||||
</div>
|
||||
} */}
|
||||
|
||||
|
||||
<div className='text-xs text-[#8C90A3]'>
|
||||
<SideBarItem
|
||||
icon={<DocumentLike variant={isActive('ads') ? 'Bold' : 'Outline'} color={isActive('ads') ? 'black' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
title={t('sidebar.ads')}
|
||||
isActive={isActive('ads')}
|
||||
link={Pages.ads.list}
|
||||
activeName='advertisements'
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className='text-xs text-[#8C90A3]'>
|
||||
<SideBarItem
|
||||
icon={<NotificationStatus variant={isActive('announcement') ? 'Bold' : 'Outline'} color={isActive('announcement') ? 'black' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
title={t('sidebar.announcement')}
|
||||
isActive={isActive('announcement')}
|
||||
link={Pages.announcement.list}
|
||||
icon={<NotificationStatus variant={isActive('announcements') ? 'Bold' : 'Outline'} color={isActive('announcements') ? 'black' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
title={t('sidebar.announcements')}
|
||||
isActive={isActive('announcements')}
|
||||
link={Pages.announcements.list}
|
||||
activeName='announcements'
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className='text-xs text-[#8C90A3]'>
|
||||
<SideBarItem
|
||||
icon={<DocumentText variant={isActive('blog') ? 'Bold' : 'Outline'} color={isActive('blog') ? 'black' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
title={t('sidebar.blog')}
|
||||
isActive={isActive('blog')}
|
||||
link={Pages.blog.list}
|
||||
activeName='blogs'
|
||||
icon={<Chart variant={isActive('reports') ? 'Bold' : 'Outline'} color={isActive('reports') ? 'black' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
title={t('sidebar.reports')}
|
||||
isActive={isActive('reports')}
|
||||
link={Pages.reports.list}
|
||||
activeName='reports'
|
||||
/>
|
||||
<SideBarItem
|
||||
icon={<Message variant={isActive('comments') ? 'Bold' : 'Outline'} color={isActive('comments') ? 'black' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
title={t('sidebar.comments')}
|
||||
isActive={isActive('comments')}
|
||||
link={Pages.comments.list}
|
||||
activeName='comments'
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className='text-xs text-[#8C90A3]'>
|
||||
<SideBarItem
|
||||
icon={<Teacher variant={isActive('learning') ? 'Bold' : 'Outline'} color={isActive('learning') ? 'black' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
title={t('sidebar.learning')}
|
||||
isActive={isActive('learning')}
|
||||
link={Pages.learning.list}
|
||||
activeName='learnings'
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className='text-xs text-[#8C90A3]'>
|
||||
<SideBarItem
|
||||
icon={<SmsTracking variant={isActive('messages') ? 'Bold' : 'Outline'} color={isActive('messages') ? 'black' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
title={t('sidebar.messages')}
|
||||
isActive={isActive('messages')}
|
||||
link={Pages.messages.list}
|
||||
activeName='contacts_us'
|
||||
/>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div className='flex-1 flex flex-col justify-end mt-14'>
|
||||
<div className='text-xs text-[#8C90A3]'>
|
||||
<SideBarItem
|
||||
icon={<Card variant={isActive('card') ? 'Bold' : 'Outline'} color={isActive('card') ? 'black' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
title={t('sidebar.card')}
|
||||
isActive={isActive('card')}
|
||||
link={Pages.cardBank.list}
|
||||
activeName='bank_accounts'
|
||||
/>
|
||||
</div>
|
||||
<div className='text-xs text-[#8C90A3]'>
|
||||
<SideBarItem
|
||||
icon={<Setting2 variant={isActive('setting') ? 'Bold' : 'Outline'} color={isActive('setting') ? 'black' : '#8C90A3'} size={iconSizeSideBar} />}
|
||||
@@ -317,25 +167,17 @@ const SideBar: FC = () => {
|
||||
|
||||
{
|
||||
hasSubMenu && (openSidebar || window.innerWidth > 1139) &&
|
||||
<div className='fixed xl:right-[112px] right-[96px] bg-white z-20 xl:top-4 xl:bottom-4 top-0 bottom-0 rounded-tl-[32px] rounded-bl-[32px] w-[190px] border-r'>
|
||||
<div className='fixed xl:right-[112px] right-[96px] bg-white z-20 xl:top-4 xl:bottom-4 top-0 bottom-0 rounded-tl-[32px] rounded-bl-[32px] w-[190px] border-r'>
|
||||
{
|
||||
subMenuName === 'services' ?
|
||||
<ServicesSubMenu />
|
||||
: subMenuName === 'receipts' ?
|
||||
<ReceiptSubMenu />
|
||||
subMenuName === 'foods' ?
|
||||
<FoodsSubMenu />
|
||||
: subMenuName === 'orders' ?
|
||||
<OrdersSubMenu />
|
||||
: subMenuName === 'customers' ?
|
||||
<CustomerSubMenu />
|
||||
: subMenuName === 'tickets' ?
|
||||
<TicketSubMenu />
|
||||
: subMenuName === 'users' ?
|
||||
<UsersSubMenu />
|
||||
: subMenuName === 'learning' ?
|
||||
<LearningSubMenu />
|
||||
: subMenuName === 'blog' ?
|
||||
<BlogSubMenu />
|
||||
: subMenuName === 'support' ?
|
||||
<SupportSubMenu />
|
||||
: null
|
||||
<CustomersSubMenu />
|
||||
: subMenuName === 'discounts' ?
|
||||
<DiscountSubMenu />
|
||||
: null
|
||||
}
|
||||
</div>
|
||||
}
|
||||
|
||||
@@ -0,0 +1,47 @@
|
||||
import { People } from 'iconsax-react'
|
||||
import { FC } from 'react'
|
||||
import { useTranslation } from 'react-i18next'
|
||||
import SubMenuItem from './SubMenuItem'
|
||||
import { useLocation } from 'react-router-dom'
|
||||
import { Pages } from '../../config/Pages'
|
||||
|
||||
const CustomersSubMenu: FC = () => {
|
||||
|
||||
const location = useLocation()
|
||||
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.customers_list')}
|
||||
isActive={isActive('list')}
|
||||
link={Pages.customers.list}
|
||||
/>
|
||||
<SubMenuItem
|
||||
title={t('submenu.add_customer')}
|
||||
isActive={isActive('add')}
|
||||
link={Pages.customers.add}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default CustomersSubMenu
|
||||
|
||||
@@ -0,0 +1,47 @@
|
||||
import { TicketDiscount } from 'iconsax-react'
|
||||
import { FC } from 'react'
|
||||
import { useTranslation } from 'react-i18next'
|
||||
import SubMenuItem from './SubMenuItem'
|
||||
import { useLocation } from 'react-router-dom'
|
||||
import { Pages } from '../../config/Pages'
|
||||
|
||||
const DiscountSubMenu: FC = () => {
|
||||
|
||||
const location = useLocation()
|
||||
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'>
|
||||
<TicketDiscount
|
||||
size={24}
|
||||
color='#000'
|
||||
variant='Bold'
|
||||
/>
|
||||
<div className='text-xs'>
|
||||
{t('sidebar.discount')}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className='flex flex-col mt-10 gap-4'>
|
||||
<SubMenuItem
|
||||
title={t('submenu.discount_list')}
|
||||
isActive={isActive('list')}
|
||||
link={Pages.discount.list}
|
||||
/>
|
||||
<SubMenuItem
|
||||
title={t('submenu.add_discount')}
|
||||
isActive={isActive('add')}
|
||||
link={Pages.discount.add}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default DiscountSubMenu
|
||||
|
||||
@@ -0,0 +1,52 @@
|
||||
import { Element3 } from 'iconsax-react'
|
||||
import { FC } from 'react'
|
||||
import { useTranslation } from 'react-i18next'
|
||||
import SubMenuItem from './SubMenuItem'
|
||||
import { useLocation } from 'react-router-dom'
|
||||
import { Pages } from '../../config/Pages'
|
||||
|
||||
const FoodsSubMenu: FC = () => {
|
||||
|
||||
const location = useLocation()
|
||||
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'>
|
||||
<Element3
|
||||
size={24}
|
||||
color='#000'
|
||||
variant='Bold'
|
||||
/>
|
||||
<div className='text-xs'>
|
||||
{t('sidebar.foods')}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className='flex flex-col mt-10 gap-4'>
|
||||
<SubMenuItem
|
||||
title={t('submenu.foods_list')}
|
||||
isActive={isActive('list')}
|
||||
link={Pages.foods.list}
|
||||
/>
|
||||
<SubMenuItem
|
||||
title={t('submenu.add_food')}
|
||||
isActive={isActive('add')}
|
||||
link={Pages.foods.add}
|
||||
/>
|
||||
<SubMenuItem
|
||||
title={t('submenu.categories')}
|
||||
isActive={isActive('category')}
|
||||
link={Pages.foods.category}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default FoodsSubMenu
|
||||
|
||||
@@ -0,0 +1,47 @@
|
||||
import { DocumentText } from 'iconsax-react'
|
||||
import { FC } from 'react'
|
||||
import { useTranslation } from 'react-i18next'
|
||||
import SubMenuItem from './SubMenuItem'
|
||||
import { useLocation } from 'react-router-dom'
|
||||
import { Pages } from '../../config/Pages'
|
||||
|
||||
const OrdersSubMenu: FC = () => {
|
||||
|
||||
const location = useLocation()
|
||||
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'>
|
||||
<DocumentText
|
||||
size={24}
|
||||
color='#000'
|
||||
variant='Bold'
|
||||
/>
|
||||
<div className='text-xs'>
|
||||
{t('sidebar.orders')}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className='flex flex-col mt-10 gap-4'>
|
||||
<SubMenuItem
|
||||
title={t('submenu.orders_list')}
|
||||
isActive={isActive('list')}
|
||||
link={Pages.orders.list}
|
||||
/>
|
||||
<SubMenuItem
|
||||
title={t('submenu.add_order')}
|
||||
isActive={isActive('add')}
|
||||
link={Pages.orders.add}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default OrdersSubMenu
|
||||
|
||||
Reference in New Issue
Block a user