feat: 接入旧站管理端并完整迁移后台能力
This commit is contained in:
yml
+3
-2
@@ -2,7 +2,7 @@
|
||||
|
||||
> 版本：v1.0
|
||||
> 日期：2026-10-30
|
||||
> 适用：PC 前台、移动端 `/m`、管理后台、分销后台、营销物料
|
||||
> 适用：PC 前台、移动端 `/m`、分销后台、营销物料。主站管理端沿用旧站 Element Plus 视觉。
|
||||
> 目标：建立一套与旧站 hfb_sys 明显区隔、可长期扩展的「新中式现代商行」视觉系统
|
||||
|
||||
---
|
||||
@@ -77,7 +77,6 @@
|
||||
### 2.3 禁止出现的旧站元素
|
||||
|
||||
- 橙色 `#ff6a00` 作为主色。
|
||||
- 深蓝黑后台侧栏 `#1a1f36 / #101428`。
|
||||
- 蓝紫渐变 `#4f7cff → #6c5ce7`。
|
||||
- 大面积浅橙背景 `#fff7ed`。
|
||||
- 金色游戏质感 `#fbbf24`。
|
||||
@@ -398,6 +397,8 @@
|
||||
|
||||
## 12. 管理后台蓝图
|
||||
|
||||
> 2026-11-12 产品决策：主站管理端完整沿用旧站 `hfb_sys` 的 Vue + Element Plus 后台，本节视觉蓝图不再适用于主站管理端，仅保留作历史设计记录。
|
||||
|
||||
### 12.1 Shell
|
||||
|
||||
- 浅暖白侧栏，墨绿 active 状态。
|
||||
|
||||
+14
-11
@@ -1,11 +1,12 @@
|
||||
# 解忧商行 · 项目实施计划
|
||||
|
||||
> 版本：v1.0
|
||||
> 版本：v1.1
|
||||
> 日期：2026-10-30
|
||||
> 基线项目：`/Users/yml/codes/hfb_sys`
|
||||
> 目标项目：`/Users/yml/codes/hfb_jysh`
|
||||
> 前端技术栈：React 19 + TypeScript + Vite + Ant Design 5
|
||||
> 后端策略：Go 后端业务逻辑整体复用，前端重写，品牌与界面彻底重构
|
||||
> 用户端技术栈：React 19 + TypeScript + Vite + Ant Design 5
|
||||
> 管理端技术栈：Vue 3 + Element Plus（完整沿用旧站后台）
|
||||
> 后端策略：Go 后端按功能增量融合旧站能力，用户端重写，管理端保持旧站布局与交互
|
||||
|
||||
---
|
||||
|
||||
@@ -16,7 +17,8 @@
|
||||
以 `hfb_sys` 的后端能力为基座，重建一套属于「解忧商行」的前端产品：
|
||||
|
||||
- 后端保留订单、商品、支付、钱包、提现、分销、邀请、聊天、申诉、实名等完整业务能力。
|
||||
- 前端从 Vue + Element Plus + Vant 整体迁移到 React + Ant Design + Ant Design Mobile。
|
||||
- 用户端从 Vue + Element Plus + Vant 迁移到 React + Ant Design + Ant Design Mobile。
|
||||
- 管理端保留旧站 Vue + Element Plus 应用，作为独立 `admin-web` 构建并按当前后台路径部署。
|
||||
- 不是换皮，而是重新设计信息架构、页面布局、组件语言、文案语气和后台工作流。
|
||||
- 让熟悉旧站的人在不看代码、不看域名的情况下，无法从界面上判断两个项目同源。
|
||||
|
||||
@@ -24,7 +26,7 @@
|
||||
|
||||
1. 后端业务逻辑不重写，接口协议保持不变。
|
||||
2. 新项目名称统一为「解忧商行」，英文辅助名 `JIEYOU TRADING HOUSE`。
|
||||
3. 前端统一使用 Ant Design 体系，不混用 Material UI。
|
||||
3. 用户端统一使用 Ant Design 体系；管理端使用旧站 Element Plus 体系。
|
||||
4. 新视觉不得复用旧站的橙色、深蓝后台、蓝紫渐变、胶囊筛选、海报式轮播等标志性元素。
|
||||
5. 生产部署仍采用 Caddy + Docker Compose + MySQL + Redis 的成熟结构。
|
||||
6. 所有金额、状态、权限、分账、结算规则以后端返回为准，前端不得重新计算业务结果。
|
||||
@@ -83,7 +85,7 @@
|
||||
| 框架 | React 19 + TypeScript | 与现有 `distribution-admin` 技术栈一致 |
|
||||
| 构建 | Vite 7 | 保留 SPA 部署方式，改造成本最低 |
|
||||
| 路由 | React Router 7 | 三套路由树：PC 前台、移动端、管理后台 |
|
||||
| 后台 UI | Ant Design 5 | 复杂表格、表单、弹窗、描述列表 |
|
||||
| 主站管理端 UI | Vue 3 + Element Plus | 完整沿用旧站后台布局、按钮和交互 |
|
||||
| 后台增强 | ProComponents（按需） | ProTable / ProForm / ProLayout，减少重复代码 |
|
||||
| 移动 UI | Ant Design Mobile 5 | 对齐现有 Vant 组件概念 |
|
||||
| 服务端状态 | TanStack Query | 缓存、失效、轮询、并发请求管理 |
|
||||
@@ -117,6 +119,7 @@ hfb_jysh/
|
||||
│ └── Dockerfile
|
||||
├── deploy/ # Caddy / Compose / MySQL 配置，改域名与路径
|
||||
├── distribution-admin/ # 独立分销后台，React + AntD，按新品牌改造
|
||||
├── admin-web/ # 独立主站管理端，Vue + Element Plus，沿用旧站后台
|
||||
├── frontend/ # 新建 React 主前端
|
||||
│ ├── src/
|
||||
│ │ ├── app/ # 启动、Provider、路由、权限守卫
|
||||
@@ -147,12 +150,12 @@ hfb_jysh/
|
||||
|
||||
### 4.1 单应用还是多应用
|
||||
|
||||
**默认采用一个 Vite 主应用 + 一个独立分销后台。**
|
||||
**采用 React 用户端 + Vue 主站管理端 + React 分销后台。**
|
||||
|
||||
- 主应用内部用三套路由树区分 PC 前台、`/m` 移动端、隐藏路径管理后台。
|
||||
- 所有页面按路由懒加载，后台代码不会进入 C 端首包。
|
||||
- 分销后台继续独立构建，沿用现有 `distribution-admin` 的 React + AntD 资产，减少重复开发。
|
||||
- 生产仍由 Caddy 分别托管 `/srv/dist` 和 `/srv/distribution-admin`，部署方式不变。
|
||||
- React 主应用只负责 PC 前台和 `/m` 移动端。
|
||||
- Vue 管理端完整沿用旧站后台，独立构建到 `admin-web`，保留旧站布局、按钮、弹窗和表格交互。
|
||||
- 分销后台继续独立构建，沿用现有 `distribution-admin` 的 React + AntD 资产。
|
||||
- 生产由 Caddy 分别托管 `/srv/dist`、`/srv/admin` 和 `/srv/distribution-admin`。
|
||||
|
||||
---
|
||||
|
||||
|
||||
Reference in New Issue
Block a user