refactor: 侧边栏折叠按钮从 Header 移至侧边栏底部

- 移除 Header 左侧折叠按钮,改用 TDesign Menu operations 渲染底部折叠按钮
- Header 品牌名与版本号使用 brand-group 基线对齐
- 侧边栏折叠宽度从 80px 对齐 TDesign 默认 64px
- 更新相关测试和 DEVELOPMENT.md 文档
This commit is contained in:
2026-05-25 00:00:58 +08:00
parent 7dc3a270ae
commit 13d1fea5fb
6 changed files with 93 additions and 23 deletions

View File

@@ -38,7 +38,7 @@ src/
app.ts 应用全局常量name、title、subtitle、description
web/ React 前端(通过 Vite 构建)
index.html HTML 入口
app.tsx 根组件Admin 布局Header + Sidebar + Content
app.tsx 根组件Admin 布局Header + Sidebar + Content + 版本号展示
main.tsx 入口BrowserRouter + QueryClient 挂载 + ErrorBoundary + ReactQueryDevtools + TDesign CSS 导入)
routes.tsx 路由配置(定义所有页面路由)
styles.css 全局样式与自定义 CSS 变量
@@ -55,7 +55,7 @@ src/
components/ UI 组件
ErrorBoundary.tsx React 错误边界,捕获渲染异常并展示降级 UI
Sidebar/
index.tsx 侧边栏菜单组件TDesign Menu + 折叠控制
index.tsx 侧边栏菜单组件TDesign Menu + 底部折叠按钮
hooks/ React hooks
use-theme-preference.ts 主题偏好 hooksystem/light/darklocalStorage 记忆 + matchMedia 监听)
use-sidebar-collapsed.ts 侧边栏折叠状态 hooklocalStorage 记忆)
@@ -268,10 +268,10 @@ main.tsx
│ ├── useThemePreference() ── Header 主题模式 RadioGroup系统/明亮/黑暗)
│ ├── useSidebarCollapsed() ── 侧边栏折叠状态localStorage 记忆)
│ ├── Layout
│ │ ├── Header折叠按钮 + 品牌名 + 页标题 + 主题切换)
│ │ ├── Header品牌名 + 版本号 + 页标题 + 主题切换)
│ │ └── Layout嵌套
│ │ ├── Aside
│ │ │ └── SidebarTDesign Menu菜单项点击导航
│ │ │ └── SidebarTDesign Menu + 底部折叠按钮,菜单项点击导航)
│ │ └── Content
│ │ └── AppRoutes路由配置
│ │ ├── / → DashboardPage欢迎语 + /api/meta 联调)