feat: 优化Header

2026-01-06 17:14:03 +08:00
parent 76c22429ad
commit 712f66b725
4 changed files with 41 additions and 9 deletions
--- a/apps/web/index.html
+++ b/apps/web/index.html
@@ -1,13 +1,16 @@
 <!doctype html>
 <html lang="en">
+
 <head>
    <meta charset="UTF-8" />
    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>web</title>
+    <title>投小记</title>
 </head>
+
 <body>
    <div id="root"></div>
    <script type="module" src="/src/main.tsx"></script>
 </body>
+
 </html>
--- a/apps/web/src/layouts/MainLayout.css
+++ b/apps/web/src/layouts/MainLayout.css
@@ -60,7 +60,7 @@
    top: 0;
    z-index: 100;
    height: 64px;
-    line-height: 64px;
+    line-height: 1;
 }

 .header-left {
@@ -74,9 +74,15 @@
    font-size: 18px;
    cursor: pointer;
    color: #1f2937;
-    padding: 8px;
+    padding: 0;
    border-radius: 4px;
    transition: background 0.2s;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 32px;
+    height: 32px;
+    flex-shrink: 0;
 }

 .collapse-trigger:hover,
@@ -96,6 +102,7 @@
    font-weight: 600;
    color: #1f2937;
    line-height: 1.2;
+    margin-bottom: 4px;
 }

 .page-subtitle {
@@ -119,6 +126,7 @@
    padding: 8px 12px;
    border-radius: 8px;
    transition: background 0.2s;
+    height: 100%;
 }

 .user-info:hover {
@@ -129,17 +137,31 @@
    display: flex;
    flex-direction: column;
    gap: 2px;
+    justify-content: center;
+    line-height: 1.2;
 }

 .user-name {
    font-size: 14px;
    font-weight: 500;
    color: #1f2937;
+    line-height: 1.2;
+    white-space: nowrap;
 }

 .user-role {
    font-size: 12px;
    color: #6b7280;
+    line-height: 1.2;
+}
+
+.user-details .ant-badge {
+    line-height: 1.2;
+}
+
+.user-details .ant-badge-status-text {
+    font-size: 12px;
+    line-height: 1.2;
 }

 /* 内容区域 */
--- a/apps/web/src/layouts/MainLayout.tsx
+++ b/apps/web/src/layouts/MainLayout.tsx
@@ -11,7 +11,8 @@ import {
    UserOutlined,
 } from '@ant-design/icons';
 import type { MenuProps } from 'antd';
-import { authService } from '../services/auth';
+import { authService } from '@/services/auth';
+import type { UserInfo } from '@/types/user';
 import './MainLayout.css';

 const { Header, Sider, Content } = Layout;
--- a/apps/web/vite.config.ts
+++ b/apps/web/vite.config.ts
@@ -1,5 +1,6 @@
 import { defineConfig, loadEnv } from 'vite';
 import react from '@vitejs/plugin-react-swc';
+import path from 'path';

 // https://vite.dev/config/
 export default defineConfig(({ mode }) => {
@@ -8,6 +9,11 @@ export default defineConfig(({ mode }) => {

    return {
        plugins: [react()],
+        resolve: {
+            alias: {
+                '@': path.resolve(__dirname, './src'),
+            },
+        },
        server: {
            port: parseInt(env.VITE_PORT || '5173', 10),
            host: true, // 允许外部访问