fix(distribution-admin): 优化左侧导航栏为固定不随页面滚动，独立右侧主体滚动区
This commit is contained in:
yml2213
@@ -74,93 +74,93 @@ function MainLayout({ member, onLogout }: { member: CurrentMember; onLogout: ()
|
||||
return (
|
||||
<MemberContext.Provider value={member}>
|
||||
<Layout className="app">
|
||||
<Layout.Sider breakpoint="lg" collapsedWidth="0">
|
||||
<div className="brand">
|
||||
<ShopOutlined style={{ fontSize: 20, color: '#1677ff' }} />
|
||||
<span>HFB 分销后台</span>
|
||||
</div>
|
||||
<Menu
|
||||
theme="dark"
|
||||
mode="inline"
|
||||
items={menuItems}
|
||||
selectedKeys={[selectedKey]}
|
||||
/>
|
||||
</Layout.Sider>
|
||||
<Layout>
|
||||
<Layout.Header className="header">
|
||||
<div className="header-left">
|
||||
{member.is_superadmin ? (
|
||||
<Tag color="gold" style={{ fontSize: 13, padding: '2px 8px' }}>
|
||||
平台全局管理模式
|
||||
</Tag>
|
||||
) : (
|
||||
<Tag color="blue" style={{ fontSize: 13, padding: '2px 8px' }}>
|
||||
{member.site_name || '当前分销站点'} · {member.domain || member.site_code}
|
||||
</Tag>
|
||||
)}
|
||||
<Typography.Text type="secondary" style={{ fontSize: 12 }}>
|
||||
主站 hao858.com · 分销管理系统
|
||||
</Typography.Text>
|
||||
<Layout.Sider breakpoint="lg" collapsedWidth="0" className="app-sider" width={220}>
|
||||
<div className="brand">
|
||||
<ShopOutlined style={{ fontSize: 20, color: '#1677ff' }} />
|
||||
<span>HFB 分销后台</span>
|
||||
</div>
|
||||
<div className="header-right">
|
||||
<Space size="middle">
|
||||
{member.site_code && (
|
||||
<Button
|
||||
type="primary"
|
||||
ghost
|
||||
icon={<EyeOutlined />}
|
||||
size="small"
|
||||
onClick={() => {
|
||||
const isLocal = window.location.hostname === 'localhost' || window.location.hostname === '127.0.0.1'
|
||||
const targetUrl = isLocal
|
||||
? `http://${window.location.hostname}:5189/?site=${member.site_code}`
|
||||
: member.domain
|
||||
? `https://${member.domain}`
|
||||
: `/?site=${member.site_code}`
|
||||
window.open(targetUrl, '_blank')
|
||||
}}
|
||||
style={{ borderColor: '#1677ff', color: '#1677ff' }}
|
||||
>
|
||||
预览分销前台商城 ↗
|
||||
</Button>
|
||||
<Menu
|
||||
theme="dark"
|
||||
mode="inline"
|
||||
items={menuItems}
|
||||
selectedKeys={[selectedKey]}
|
||||
/>
|
||||
</Layout.Sider>
|
||||
<Layout className="app-layout">
|
||||
<Layout.Header className="header">
|
||||
<div className="header-left">
|
||||
{member.is_superadmin ? (
|
||||
<Tag color="gold" style={{ fontSize: 13, padding: '2px 8px' }}>
|
||||
平台全局管理模式
|
||||
</Tag>
|
||||
) : (
|
||||
<Tag color="blue" style={{ fontSize: 13, padding: '2px 8px' }}>
|
||||
{member.site_name || '当前分销站点'} · {member.domain || member.site_code}
|
||||
</Tag>
|
||||
)}
|
||||
<div className="user-profile">
|
||||
<UserOutlined style={{ color: '#1677ff' }} />
|
||||
<Typography.Text strong style={{ fontSize: 13 }}>
|
||||
{member.nickname || member.username}
|
||||
</Typography.Text>
|
||||
<Tag color={member.is_superadmin ? 'purple' : 'cyan'}>{roleLabel}</Tag>
|
||||
</div>
|
||||
<Button
|
||||
type="text"
|
||||
danger
|
||||
icon={<LogoutOutlined />}
|
||||
onClick={onLogout}
|
||||
size="small"
|
||||
>
|
||||
退出登录
|
||||
</Button>
|
||||
</Space>
|
||||
</div>
|
||||
</Layout.Header>
|
||||
<Layout.Content>
|
||||
<Routes>
|
||||
<Route path="/" element={<Dashboard />} />
|
||||
{member.is_superadmin && <Route path="/sites" element={<Sites isSuperadmin={true} />} />}
|
||||
<Route path="/rules" element={<Rules />} />
|
||||
<Route path="/payments" element={<Payments />} />
|
||||
<Route path="/accounts" element={<Accounts />} />
|
||||
<Route path="/wallet" element={<Wallet />} />
|
||||
<Route path="/settings" element={<SiteSettings />} />
|
||||
<Route path="/settlements" element={<Settlements />} />
|
||||
<Route path="/sold" element={<Orders kind="sold" />} />
|
||||
<Route path="/receive" element={<Orders kind="receive" />} />
|
||||
<Route path="/orders" element={<Orders kind="all" />} />
|
||||
<Route path="*" element={<Navigate to="/" replace />} />
|
||||
</Routes>
|
||||
</Layout.Content>
|
||||
<Typography.Text type="secondary" style={{ fontSize: 12 }}>
|
||||
主站 hao858.com · 分销管理系统
|
||||
</Typography.Text>
|
||||
</div>
|
||||
<div className="header-right">
|
||||
<Space size="middle">
|
||||
{member.site_code && (
|
||||
<Button
|
||||
type="primary"
|
||||
ghost
|
||||
icon={<EyeOutlined />}
|
||||
size="small"
|
||||
onClick={() => {
|
||||
const isLocal = window.location.hostname === 'localhost' || window.location.hostname === '127.0.0.1'
|
||||
const targetUrl = isLocal
|
||||
? `http://${window.location.hostname}:5189/?site=${member.site_code}`
|
||||
: member.domain
|
||||
? `https://${member.domain}`
|
||||
: `/?site=${member.site_code}`
|
||||
window.open(targetUrl, '_blank')
|
||||
}}
|
||||
style={{ borderColor: '#1677ff', color: '#1677ff' }}
|
||||
>
|
||||
预览分销前台商城 ↗
|
||||
</Button>
|
||||
)}
|
||||
<div className="user-profile">
|
||||
<UserOutlined style={{ color: '#1677ff' }} />
|
||||
<Typography.Text strong style={{ fontSize: 13 }}>
|
||||
{member.nickname || member.username}
|
||||
</Typography.Text>
|
||||
<Tag color={member.is_superadmin ? 'purple' : 'cyan'}>{roleLabel}</Tag>
|
||||
</div>
|
||||
<Button
|
||||
type="text"
|
||||
danger
|
||||
icon={<LogoutOutlined />}
|
||||
onClick={onLogout}
|
||||
size="small"
|
||||
>
|
||||
退出登录
|
||||
</Button>
|
||||
</Space>
|
||||
</div>
|
||||
</Layout.Header>
|
||||
<Layout.Content className="app-content">
|
||||
<Routes>
|
||||
<Route path="/" element={<Dashboard />} />
|
||||
{member.is_superadmin && <Route path="/sites" element={<Sites isSuperadmin={true} />} />}
|
||||
<Route path="/rules" element={<Rules />} />
|
||||
<Route path="/payments" element={<Payments />} />
|
||||
<Route path="/accounts" element={<Accounts />} />
|
||||
<Route path="/wallet" element={<Wallet />} />
|
||||
<Route path="/settings" element={<SiteSettings />} />
|
||||
<Route path="/settlements" element={<Settlements />} />
|
||||
<Route path="/sold" element={<Orders kind="sold" />} />
|
||||
<Route path="/receive" element={<Orders kind="receive" />} />
|
||||
<Route path="/orders" element={<Orders kind="all" />} />
|
||||
<Route path="*" element={<Navigate to="/" replace />} />
|
||||
</Routes>
|
||||
</Layout.Content>
|
||||
</Layout>
|
||||
</Layout>
|
||||
</Layout>
|
||||
</MemberContext.Provider>
|
||||
)
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user