49 lines
5.3 KiB
Markdown
49 lines
5.3 KiB
Markdown
# MiragenFlow-front 用户控制台迁移说明
|
|
|
|
## 结论
|
|
|
|
`/Users/qiu/Desktop/Task/MiragenFlow-front/` 是一个独立的 Vite 视觉原型，不是完整用户端：路由使用 hash，作品数据是本地静态数组，登录、通知、搜索和生成确认没有接入 API。迁移采用“视觉组件直接复用、业务状态沿用 MiragenFlow、未实现能力保留占位”的方式，避免把演示数据当作真实业务。
|
|
|
|
## 已迁移并接入
|
|
|
|
| 原型模块 | 迁移位置 | 接入方式 |
|
|
| ------------------------------------------------- | ---------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------ |
|
|
| 深色工作台壳层、侧栏、移动导航 | `web/src/user-console/components/layout/` | `UserLayout` 使用 React Router 路径，登录/注册和画布项目保留沉浸式页面；搜索框和模型广场入口已按产品边界移除 |
|
|
| 设计 token、Alimama 字体、按钮/输入/筛选/反馈组件 | `web/src/user-console/styles/`、`components/primitives/` | token 作用域限定在 `.mf-console`，不覆盖现有 Tailwind/Ant Design 全局主题 |
|
|
| Hero 轮播、侧栏活动卡、画布/创作入口 | `web/src/user-console/components/content/HeroCarousel.tsx` | 入口连接 `/canvas` 和 `/tools/image`，宣传图只承担视觉，不伪造服务状态 |
|
|
| 作品灵感瀑布流、作品卡片、同款弹窗 | `web/src/user-console/components/content/`、`pages/HomePage.tsx` | 数据改为读取真实本地资产库图片；空库展示真实空状态 |
|
|
| 组件中心 | `web/src/user-console/pages/ComponentsPage.tsx` | 作为内部视觉参考 `/components`，不进入用户侧导航、不参与真实业务流程 |
|
|
| 登录、注册、验证、重置密码 | `web/src/pages/auth/` | 改用组件中心的 Field、Tabs、Button、Badge、Alert 视觉语言，认证策略仍读取真实 API |
|
|
| AI 图片/音频创作 | `web/src/pages/tools/` | 改用组件中心的 Field、Select、Button、反馈和结果卡，任务提交/下载/资产保存仍走真实 API |
|
|
| 原型静态资源 | `web/src/assets/reference/` | 复制到项目内并由迁移组件静态引用；不作为用户生成结果或 provider 数据 |
|
|
|
|
## 保留现有真实能力
|
|
|
|
- 图片/音频创作、任务队列、WebSocket、取消/重试和结果保存继续使用 `web/src/services/api/` 与现有 Zustand stores。
|
|
- 无限画布、画布项目、资产库、账户、套餐、设置和认证流程继续使用现有实现；新壳层只负责视觉和导航，不替换这些业务状态。
|
|
- `/api`、运行时配置、同源代理、主题持久化、国际化和 AuthGuard 不从原型项目复制。
|
|
|
|
## 延后或不直接迁移
|
|
|
|
| 原型内容 | 处理 |
|
|
| --------------------------------------------------------- | --------------------------------------------------------------- |
|
|
| hash 路由 `#/...`、独立 `App.tsx`、Vite/TS 配置 | 不迁移，避免破坏当前 BrowserRouter、`/api` 代理和 `/admin` base |
|
|
| 原型静态 `artworks.ts` | 不作为真实列表使用；首页改读用户资产库 |
|
|
| 模型广场、模型详情画廊、AI 学院、模型定制、社群、通知中心 | 不进入当前用户侧导航；待产品确认和真实能力接入后再配置 |
|
|
| 视频、动画、真实 3D、远程 provider 配置 | 不新增业务入口，符合当前产品边界 |
|
|
| 原型中的游客登录奖励和无动作按钮 | 改为真实登录、账户、任务和退出动作；未支持的操作不显示成功状态 |
|
|
|
|
## 验收路径
|
|
|
|
```text
|
|
/ 新迁移首页：Hero + 作品灵感 + 资产空态
|
|
/tools/image 真实图片创作
|
|
/canvas 真实画布项目库
|
|
/assets 真实资产库
|
|
/login 组件中心风格的登录
|
|
/register 组件中心风格的注册与验证
|
|
/components 内部视觉组件验收页（不进入用户导航）
|
|
```
|
|
|
|
验收重点：壳层在窄窗口不横向溢出且不显示搜索框/模型广场；首页空资产不出现演示卡；AI 创作页可提交真实任务、下载并保存资产；登录/注册不被用户控制台壳层遮挡且关闭策略时不渲染 CAPTCHA/MFA/恢复码；画布项目仍使用现有全屏编辑器。
|