feat: 添加货币和汇率管理功能

refactor: 重构前端路由和登录逻辑

docs: 更新业务闭环、任务和架构文档

style: 调整代码格式和文件结构

chore: 更新依赖项和配置文件
This commit is contained in:
2026-03-19 19:08:15 +08:00
parent 8de9ea0aaa
commit eafa1bbe94
203 changed files with 20240 additions and 39580 deletions

View 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: 重构前端文档结构,统一命名规范

View File

@@ -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)