42 lines
1.3 KiB
TypeScript
42 lines
1.3 KiB
TypeScript
import { NavLink, Outlet } from 'react-router-dom';
|
|
import type { PartnerNavKind } from '../lib/partnerAccess';
|
|
|
|
const STORE_STAFF_TABS = [
|
|
{ to: '/', end: true, icon: 'dashboard', label: '首页' },
|
|
{ to: '/stores', icon: 'store', label: '门店管理' },
|
|
{ to: '/me', icon: 'person', label: '个人中心' },
|
|
] as const;
|
|
|
|
const WAREHOUSE_STAFF_TABS = [
|
|
{ to: '/', end: true, icon: 'dashboard', label: '首页' },
|
|
{ to: '/orders', icon: 'receipt_long', label: '订单管理' },
|
|
{ to: '/me', icon: 'person', label: '个人中心' },
|
|
] as const;
|
|
|
|
type SubAccountLayoutProps = {
|
|
navKind: PartnerNavKind;
|
|
};
|
|
|
|
export default function SubAccountLayout({ navKind }: SubAccountLayoutProps) {
|
|
const tabs = navKind === 'warehouse_staff' ? WAREHOUSE_STAFF_TABS : STORE_STAFF_TABS;
|
|
|
|
return (
|
|
<>
|
|
<Outlet />
|
|
<nav className="app-tabbar">
|
|
{tabs.map((tab) => (
|
|
<NavLink
|
|
key={tab.to}
|
|
to={tab.to}
|
|
end={'end' in tab ? tab.end : undefined}
|
|
className={({ isActive }) => `app-tabbar-item${isActive ? ' active' : ''}`}
|
|
>
|
|
<span className="material-symbols-outlined app-tabbar-icon">{tab.icon}</span>
|
|
<span className="app-tabbar-label">{tab.label}</span>
|
|
</NavLink>
|
|
))}
|
|
</nav>
|
|
</>
|
|
);
|
|
}
|