feat: 重构前端为企业 Admin 后台布局，引入 React Router 路由

- 引入 React Router v7 (Declarative mode) 实现 SPA 路由
- 重构 Layout 为 Header + 侧边栏 + 内容区的企业 Admin 布局
- 新增侧边栏菜单组件，支持折叠/展开，状态持久化到 localStorage
- 新增示例页面：仪表盘、用户管理、系统设置、404
- 菜单配置与路由统一为单一数据源 (menu.tsx)
- Vite code splitting 新增 vendor-router 组
- 更新 DEVELOPMENT.md 和 README.md 文档

openspec/changes/refactor-frontend-layout/proposal.md

@@ -0,0 +1,36 @@
+## Why
+
+当前前端为单页面应用，仅有 Header + Content 的简单布局，无路由、无侧边栏，页面结构单一，无法支撑企业级 Admin 后台的多页面导航需求。作为 Bun 全栈应用模板，需要提供更完善的前端布局范例，便于使用者在此基础上扩展业务页面。
+
+## What Changes
+
+- 引入 React Router v7 (Declarative mode) 实现前端 SPA 路由
+- 重构 Layout 为经典企业 Admin 后台布局：Header + 侧边栏 + 内容区
+- 新增侧边栏菜单组件，支持折叠/展开，折叠状态持久化到 localStorage
+- 新增多个示例页面（仪表盘、用户管理、系统设置、404）
+- 将路由定义与菜单配置统一为单一数据源，保证两者同步
+- 新增 `react-router` 依赖，Vite code splitting 单独分组
+
+**BREAKING**: 原 `app.tsx` 的 Content 内容迁移至 Dashboard 页面；CSS 类名 `.dashboard-*` 变更为 `.app-*`
+
+## Capabilities
+
+### New Capabilities
+
+- `frontend-routing`: 前端 SPA 路由能力，基于 React Router v7，支持多页面导航、路由匹配、404 处理
+- `admin-layout`: 企业 Admin 后台布局能力，Header + 侧边栏 + 内容区，侧边栏可折叠
+
+### Modified Capabilities
+
+- `app-constants`: 新增 localStorage key `"sidebar.collapsed"` 用于持久化侧边栏折叠状态
+
+## Impact
+
+- 新增依赖：`react-router`
+- 新增目录：`src/web/pages/`、`src/web/components/Sidebar/`
+- 新增文件：`src/web/routes.tsx`、`src/web/menu.tsx`、`src/web/hooks/use-sidebar-collapsed.ts`
+- 修改文件：`src/web/app.tsx`（重构 Layout）、`src/web/main.tsx`（+ BrowserRouter）、`src/web/styles.css`（布局样式重写）
+- 修改配置：`vite.config.ts`（code splitting 新增 vendor-router 组）
+- 更新文档：`DEVELOPMENT.md`、`README.md`
+- 新增测试：Sidebar 组件测试、各页面测试、test-utils 增强
+- 后端无需改动（SPA fallback 已支持）