feat: 添加货币和汇率管理功能
refactor: 重构前端路由和登录逻辑 docs: 更新业务闭环、任务和架构文档 style: 调整代码格式和文件结构 chore: 更新依赖项和配置文件
This commit is contained in:
30
docs/03_Frontend/00_Frontend_Index.md
Normal file
30
docs/03_Frontend/00_Frontend_Index.md
Normal file
@@ -0,0 +1,30 @@
|
||||
# 前端文档索引
|
||||
|
||||
> **模块**: 03_Frontend - 前端设计与开发
|
||||
> **更新日期**: 2026-03-19
|
||||
|
||||
---
|
||||
|
||||
## 核心设计
|
||||
|
||||
| 文档 | 描述 | 状态 |
|
||||
|------|------|------|
|
||||
| [01_Design](01_Design.md) | 前端设计总览 | ✅ |
|
||||
| [02_Development_Guide](02_Development_Guide.md) | 前端开发指南 | ✅ |
|
||||
| [03_Optimization_Guide](03_Optimization_Guide.md) | 前端优化指南 | ✅ |
|
||||
| [04_Interaction_Guidelines](04_Interaction_Guidelines.md) | 交互设计规范 | ✅ |
|
||||
| [05_UI_Components](05_UI_Components.md) | UI组件规范 | ✅ |
|
||||
| [06_Pages_Flow](06_Pages_Flow.md) | 页面流程设计 | ✅ |
|
||||
|
||||
---
|
||||
|
||||
## 关联模块
|
||||
|
||||
- [架构模块](../01_Architecture/00_Architecture_Index.md)
|
||||
- [后端模块](../02_Backend/00_Backend_Index.md)
|
||||
|
||||
---
|
||||
|
||||
## 最近更新
|
||||
|
||||
- 2026-03-19: 重构前端文档结构,统一命名规范
|
||||
@@ -8,6 +8,8 @@
|
||||
|
||||
## 1. 技术栈 (Tech Stack)
|
||||
|
||||
### 1.1 当前技术栈
|
||||
|
||||
| 层级 | 技术 | 版本 | 用途 |
|
||||
|------|------|------|------|
|
||||
| **Framework** | React | 18.x | UI 框架 |
|
||||
@@ -18,6 +20,19 @@
|
||||
| **Router** | Umi Router | 4.x | 路由管理 |
|
||||
| **Testing** | Jest | 29.x | 单元测试 |
|
||||
|
||||
### 1.2 技术栈演进 (2026 Q4 目标)
|
||||
|
||||
| 层级 | 技术 | 版本 | 用途 |
|
||||
|------|------|------|------|
|
||||
| **Framework** | React | 19 (或 Next.js 15) | UI 框架 |
|
||||
| **Language** | TypeScript | 5.x | 开发语言 |
|
||||
| **Build Tool** | Vite (开发) + Rspack (生产) | - | 构建工具 |
|
||||
| **UI Library** | Ant Design 5.x + 自定义组件库 | - | 组件库 |
|
||||
| **State** | Zustand + TanStack Query | - | 状态管理 |
|
||||
| **Router** | Umi Router 4.x | - | 路由管理 |
|
||||
| **Testing** | Jest | 29.x | 单元测试 |
|
||||
| **微前端** | qiankun | - | 大型模块独立部署 |
|
||||
|
||||
---
|
||||
|
||||
## 2. 目录结构 (Directory Structure)
|
||||
@@ -48,6 +63,20 @@ dashboard/src/
|
||||
│ ├─ StateManagement.ts # 状态管理主文件
|
||||
│ ├─ global.ts # 全局状态
|
||||
│ ├─ order.ts # 订单状态
|
||||
│ ├─ crossBorder.ts # 跨境电商状态
|
||||
|
||||
├─ pages/
|
||||
│ ├─ CrossBorder/
|
||||
│ │ ├─ ProductManagement.tsx # 跨境商品管理
|
||||
│ │ ├─ CustomsDeclaration.tsx # 清关申报
|
||||
│ │ ├─ LogisticsManagement.tsx # 物流管理
|
||||
│ │ ├─ PaymentManagement.tsx # 支付管理
|
||||
│ │ ├─ PlatformIntegration.tsx # 平台集成
|
||||
│ │ └─ index.tsx
|
||||
|
||||
├─ services/
|
||||
│ ├─ crossBorderDataSource.ts # 跨境电商数据源
|
||||
│ ├─ platformIntegrationService.ts # 平台集成服务
|
||||
│ ├─ product.ts # 商品状态
|
||||
│ └── index.ts
|
||||
│
|
||||
@@ -413,6 +442,20 @@ const roleRoutes = {
|
||||
- `UserAsset/PointsManage.tsx` - 积分管理
|
||||
- `UserAsset/UserAssets.tsx` - 用户资产
|
||||
|
||||
### 4.13 多语言管理模块
|
||||
|
||||
**功能列表**
|
||||
- 语言切换
|
||||
- 翻译管理
|
||||
- 多语言内容发布
|
||||
- 语言资源管理
|
||||
|
||||
**页面组件**
|
||||
- `I18n/index.tsx` - 多语言管理入口
|
||||
- `I18n/LanguageSwitcher.tsx` - 语言切换组件
|
||||
- `I18n/TranslationManage.tsx` - 翻译管理
|
||||
- `I18n/ContentPublish.tsx` - 多语言内容发布
|
||||
|
||||
---
|
||||
|
||||
## 5. 组件规范
|
||||
@@ -631,7 +674,53 @@ npm run test # 运行测试
|
||||
|
||||
---
|
||||
|
||||
## 9. 相关文档
|
||||
## 9. 前端发展规划
|
||||
|
||||
### 9.1 前端架构规划
|
||||
|
||||
- **微前端架构**: 采用 qiankun 实现大型模块独立部署,解决大型应用构建慢、维护难的问题
|
||||
- **BFF 层**: 引入 Backend for Frontend 模式,统一接口管理,减少前端复杂度
|
||||
- **多端适配**: 支持桌面端、平板端和移动端的响应式布局
|
||||
- **离线能力**: 实现 PWA,支持离线访问核心功能
|
||||
|
||||
### 9.2 页面功能扩展计划
|
||||
|
||||
| 模块 | 现有功能 | 计划扩展 |
|
||||
|------|---------|---------|
|
||||
| 商品管理 | 基础商品管理、套利分析 | 智能选品推荐、商品生命周期管理、多平台批量操作 |
|
||||
| 订单管理 | 订单列表、状态流转 | 智能审单、异常订单自动处理、多渠道订单聚合 |
|
||||
| 财务管理 | 基础财务概览 | 智能对账、多币种自动换算、税务报表自动生成 |
|
||||
| 营销管理 | 广告投放管理 | 智能广告优化、竞品分析、多平台营销协同 |
|
||||
| 库存管理 | 基础库存管理 | 智能补货建议、库存预测、多仓协同 |
|
||||
| 物流管理 | 基础物流选择 | 智能物流路径规划、运费优化、实时轨迹监控 |
|
||||
| 平台集成 | 基础平台连接 | 更多平台集成、API 自动同步、无 API 平台支持 |
|
||||
|
||||
### 9.3 组件库规划
|
||||
|
||||
- **基础组件**: 基于 Ant Design 5.x 扩展,统一设计规范
|
||||
- **业务组件**: 封装商品、订单、财务等核心业务组件
|
||||
- **智能组件**: 集成 AI 能力的智能推荐、智能分析组件
|
||||
- **可视化组件**: 基于 ECharts 的数据可视化组件库
|
||||
- **表单组件**: 智能表单验证、动态表单生成
|
||||
|
||||
### 9.4 性能优化规划
|
||||
|
||||
- **构建优化**: 使用 Vite + Rspack,提升构建速度
|
||||
- **渲染优化**: 虚拟滚动、懒加载、代码分割
|
||||
- **缓存策略**: 合理使用浏览器缓存、Service Worker 缓存
|
||||
- **网络优化**: HTTP/2、HTTP/3 支持,减少请求体积
|
||||
- **监控体系**: 集成前端性能监控,实时预警性能问题
|
||||
|
||||
### 9.5 开发体验优化
|
||||
|
||||
- **代码生成**: 基于模板自动生成页面、组件代码
|
||||
- **Mock 系统**: 完善的 Mock 数据体系,支持离线开发
|
||||
- **开发工具**: 定制化 VS Code 插件,提升开发效率
|
||||
- **文档体系**: 自动生成 API 文档、组件文档
|
||||
|
||||
---
|
||||
|
||||
## 10. 相关文档
|
||||
|
||||
- [UI Components](./UI_Components.md)
|
||||
- [Pages Flow](./Pages_Flow.md)
|
||||
Reference in New Issue
Block a user