docs: 更新 phase1_log.md 前端骨架完工记录

This commit is contained in:
simonkoson
2026-05-15 09:48:39 +08:00
parent d29b1bb394
commit 3e3f673080
+83 -2
View File
@@ -201,5 +201,86 @@ uvicorn app.main:app --reload
--- ---
*本日志由 Claude Opus 4.7 基于 Sonnet 4.6 完工报告 + chat 关键决策整理生成。* ## 九、前端骨架完工记录(2026-05-15)
*下一次 Phase 收尾时,沿用本格式继续写 phase2_log.md。*
### 9.1 完成时间
- **前端骨架开发日期**:2026-05-15
- **前端骨架状态**:✅ 已完成
### 9.2 完成内容
1. **Vite + React 项目初始化**:`npm create vite@latest frontend -- --template react`
2. **核心依赖安装**:
- `antd` (UI 库)
- `@ant-design/icons`
- `zustand` (状态管理)
- `react-router-dom` v6
- `axios`
- `dayjs`
3. **Vite 代理配置**:`vite.config.js``/api``http://localhost:8000`
4. **AntD 中文 locale + 主题**:主色 `#6b8e6b`(深绿),圆角 12px/16px
5. **CSS 变量定义**:`src/index.css` 中定义奶油底 `#fbf9f1`、深绿 `#6b8e6b`、浅绿 `#c8d9b0`
6. **Auth 体系**:
- `services/http.js`:axios 实例,`withCredentials: true`
- `services/authService.js`:login/logout/me 三接口
- `stores/authStore.js`:Zustand,含 user/isLoading/login/logout/fetchMe
7. **路由守卫**:`components/AuthGuard/AuthGuard.jsx`,挂载时调用 me() 一次,401 跳转登录
8. **主布局**:`components/Layout/AppLayout.jsx` (侧边栏 + 顶栏 + 内容区 Outlet)
9. **侧边栏**:`SideNav.jsx`,6 项菜单(含 doco 占位),图标用 AntD icons
10. **顶栏**:`TopBar.jsx`,搜索框 + 通知 + 头像下拉(退出)
11. **登录页**:`pages/Login/Login.jsx`,AntD Form,用户名 + 密码,提交后调用 store.login()
12. **仪表盘**:`pages/Dashboard/Dashboard.jsx`:
- 顶部 Banner(题图占位)
- 3 个 KPI 卡(平均收视/完成率/待排期)
- 热点雷达占位(模块 H,Phase 4c)
- **近 9 期收视柱图**(假数据,三种颜色都有)
- 排播计划占位(模块 F,Phase 4b)
- 柱图下方:期次标题 + 编导头像 + 姓名
- 左下角颜色规则注释:红=优秀/蓝=达标/绿=待提升
13. **空页占位**:TPS / 知识库 / 编导首页 / 用户管理 / 文稿对齐(Doco 用 Result 组件)
14. **路由配置**:`App.jsx` 中 Routes 嵌套,AuthGuard 包裹,共 7 个路由
### 9.3 技术决策
- **角色拼音值**:前端代码中所有角色判断用 `zhipianren/zebian/biandao`,不得用英文别名
- **收视颜色判定(反直觉)**:红=优秀(>摸高)/蓝=达标(基础~摸高)/绿=待提升(<基础)
- **Session + Cookie**:axios `withCredentials: true`,Vite 代理 `/api`
- **刷新登录态保持**:Zustand 初始 user=null,AuthGuard 挂载时调用 me() 补全
### 9.4 文档修正(同期完成)
- `README.md`:近 4 期 → 近 9 期
- `dev_plan.md`:近 4 期 → 近 9 期
- `docs/git_workflow.md`:Z:\AIworks\ 路径残留 → E:\tps-dashboard\
### 9.5 Git commit 记录
| commit | 内容 |
|---|---|
| b39b7c8 | chore: 清理 indexUI 中文文件名空格与重复字符 |
| e907876 | docs: 仪表盘收视柱图统一为近 9 期(制片人 2026-05-15 拍板) |
| 233cb85 | docs: git_workflow.md 第 2/3 章路径残留 Z:\AIworks → E:\tps-dashboard 修正 |
| fef9e81 | feat: frontend skeleton done |
### 9.6 遗留事项
- `frontend/src/App.css``frontend/src/assets/` 是 Vite 模板自带,未使用但已 commit(不影响功能)
- Phase 2 需接入真实后端 API 数据
- Phase 2 仪表盘真实柱图需替换假数据
---
*本日志由 MiniMax M2.7(Cline Act 模式)于 2026-05-15 前端骨架完工后追加。*