对接知识库、租户管理API,侧边栏加入用户信息和退出登录

This commit is contained in:
yml2213
2026-07-14 11:33:51 +08:00
parent 1f9915ff5a
commit e4628fee7b
4 changed files with 142 additions and 213 deletions
+26 -10
View File
@@ -1,14 +1,10 @@
import { useLocation, useNavigate } from 'react-router-dom'
import { Layout, Menu } from 'antd'
import { Layout, Menu, Dropdown, Avatar } from 'antd'
import {
AppstoreOutlined,
MessageOutlined,
HistoryOutlined,
TeamOutlined,
FileTextOutlined,
BarChartOutlined,
SettingOutlined,
AppstoreOutlined, MessageOutlined, HistoryOutlined, TeamOutlined,
FileTextOutlined, BarChartOutlined, SettingOutlined, LogoutOutlined, UserOutlined,
} from '@ant-design/icons'
import { useAuth } from '@/stores/auth'
const { Sider } = Layout
@@ -24,11 +20,17 @@ const menuItems = [
const AgentSidebar = () => {
const location = useLocation()
const navigate = useNavigate()
const { user, logout } = useAuth()
const selectedKey = menuItems.find(item => location.pathname.startsWith(item.key))?.key || '/agent/dashboard'
const handleLogout = () => {
logout()
navigate('/login', { replace: true })
}
return (
<Sider width={220} className="!bg-white border-r border-neutral-200">
<Sider width={220} className="!bg-white border-r border-neutral-200 flex flex-col">
<div className="h-14 flex items-center px-5 border-b border-neutral-100">
<MessageOutlined className="text-lg text-[#2563eb] mr-2.5" />
<span className="text-base font-semibold text-neutral-900"></span>
@@ -38,8 +40,22 @@ const AgentSidebar = () => {
selectedKeys={[selectedKey]}
items={menuItems}
onClick={({ key }) => navigate(key)}
className="border-e-0 mt-2"
className="border-e-0 mt-2 flex-1"
/>
<div className="border-t border-neutral-100 p-3">
<Dropdown
menu={{ items: [{ key: 'logout', icon: <LogoutOutlined />, label: '退出登录', onClick: handleLogout }] }}
trigger={['click']}
>
<div className="flex items-center gap-2 cursor-pointer hover:bg-neutral-50 rounded p-1.5">
<Avatar size={28} icon={<UserOutlined />} className="!bg-blue-100 !text-blue-500" />
<div className="min-w-0">
<div className="text-xs font-medium text-neutral-700 truncate">{user?.nickname || '客服'}</div>
<div className="text-xs text-neutral-400">线</div>
</div>
</div>
</Dropdown>
</div>
</Sider>
)
}