权限

src/components/Header/HeaderUserInfo.tsx

@@ -1,4 +1,5 @@
-import { Button, Popconfirm } from 'antd';
+import { DownOutlined } from '@ant-design/icons';
+import { Button, Dropdown, Popconfirm, Space } from 'antd';
 import { useUserStore } from '@/store/UserStore';
 import { GapBox } from '../GapBox';
 
@@ -7,7 +8,51 @@ export const HeaderUserInfo: React.FC = () => {
 
   return (
     <GapBox>
-      <div>{userInfo.login_name}</div>
+      {/* 用户信息 Dropdown */}
+      <Dropdown
+        trigger={['click']}
+        placement='bottomRight'
+        arrow
+        menu={{
+          items: [
+            {
+              key: 'user-info',
+              disabled: true, // 只展示，不可操作
+              label: (
+                <Space size={8} style={{ color: 'rgba(0,0,0,0.88)' }}>
+                  <span>{userInfo.username}</span>
+                  <span>({userInfo.nickname})</span>
+                </Space>
+              ),
+            },
+          ],
+        }}
+      >
+        <div style={{ cursor: 'pointer' }}>
+          <Space size={4}>
+            <span>欢迎您，</span>
+            <span
+              style={{
+                maxWidth: 120,
+                whiteSpace: 'nowrap',
+                textOverflow: 'ellipsis',
+                overflow: 'hidden',
+              }}
+            >
+              {userInfo.username}
+            </span>
+            <DownOutlined
+              style={{
+                fontSize: 10,
+                marginTop: 2,
+                color: '#666',
+              }}
+            />
+          </Space>
+        </div>
+      </Dropdown>
+
+      {/* 退出登录 */}
       <Popconfirm
         title='确定要退出登录吗？'
         onConfirm={() => {