docs: confirm frontend refactor decisions

This commit is contained in:
2025-12-13 22:32:27 +08:00
parent 56d2cadd81
commit 39153cc946

View File

@@ -2,7 +2,7 @@
> 目标:重构“用户前台界面”(优先 `/app`,可选包含 `/login`、`/register`、`/reset_password` 等页面)的视觉与交互,使其更现代、美观、易用、可维护;**后端接口与业务流程保持不变**。
>
> 实现方式:前台前端改为 **Vue3(含暗色模式)**Vite 构建产物部署到 `static/app/`),所有接口继续使用现有 `/api/...`,不改后端功能。
> 实现方式:前台前端改为 **Vue3 单页应用**Vite 构建产物部署到 `static/app/`),所有接口继续使用现有 `/api/...`,不改后端功能。
---
@@ -181,7 +181,6 @@
- 请求Axios统一错误处理不改变接口
- 状态Pinia推荐用于账号/定时/截图/用户信息等全局状态)
- 实时socket.io-client对齐现有 Socket 事件)
- 主题暗色模式Element Plus 暗色变量 + 自定义 design tokens支持“跟随系统/手动切换/记忆”
### 4.2 构建与部署方式(与后台一致)
@@ -226,10 +225,9 @@
> 你之前希望“每个阶段提交到 git 方便回滚”,前台我也按同样方式推进。
阶段 1工程搭建 + 新布局 + 暗色模式底座(可访问可导航)
阶段 1工程搭建 + 新布局(可访问可导航)
- 新建 `app-frontend/`,跑通 Vue3 + 路由 + 基础布局Header/Sidebar/Drawer
- 落地暗色模式(跟随系统 + 手动切换 + 本地记忆
- Flask 接入 manifest先做“v2 预览入口”,不影响原 `/app``/login` 等)
- Flask 接入 manifest按你的选择开发完成后直接替换原路由开发过程中可先保留旧版模板不切换
- 页面壳子可切换:账号/定时/截图;并提供登录/注册/重置/验证页的新版壳子
阶段 2认证相关页面全量迁移确保可登录可注册可找回
@@ -288,7 +286,7 @@
- 3移动端导航A抽屉菜单
- 4视觉风格A与后台一致克制、浅色、卡片化
- 5VIP 展示A保留升级 VIP 弹窗与入口,仍走反馈/联系管理员)
- 6暗色模式B需要
- 6暗色模式不开发(按你最新回复
- 7部署方式与后台一致构建产物提交到仓库运行时不依赖 Node
## 9. 仍需你确认的小问题(避免返工)
@@ -296,17 +294,9 @@
1) **新版上线切换策略**(推荐 A更稳
- A. 先加“v2 预览入口”(例如 `/app/v2``/login/v2`…),原路由保持旧版;最终验收后再切换原路由到新版
- B. 开发过程中直接替换原路由(出现问题用 git 回滚)
2) **暗色模式默认行为**
- A. 默认跟随系统(`prefers-color-scheme`),并提供手动切换(记忆)
- B. 默认浅色,并提供手动切换(记忆)
3) **暗色模式开关放哪**(二选一即可):
- A. 放在 Header 右侧(全局随时可切)
- B. 放在“设置”里(不占 Header 空间)
4) **VIP 升级弹窗的联系信息**
2) **VIP 升级弹窗的联系信息**
- A. 保持现状(只提示“通过反馈联系管理员”)
- B. 你提供一个固定联系方式(例如微信/QQ/群号),我放到弹窗里
> 你回复第 9 节的选项后,我就从阶段 1 开始开发,并按阶段提交/推送(方便你随时回滚)。
> 回复:上线切换策略选 BVIP 联系信息选 A。接下来我按阶段 1 开始开发,并按阶段提交/推送(方便你随时回滚)。