wurenzhi
136c2fa579
- 新增文档模板和导航结构 - 实现服务器基础API路由和控制器 - 添加扩展插件配置和前端框架 - 引入多租户和权限管理模块 - 集成日志和数据库配置 - 添加核心业务模型和类型定义
2.2 KiB
2.2 KiB
前端集成蓝图：[功能名称]
[Date: YYYY-MM-DD]：由后端开发在完成功能逻辑后产出，用于指导 Console 端全栈实现。
1. 业务意图 (Business Intent)
- 核心价值：描述前端如何呈现后端功能，以及如何通过交互提升业务效率。
- 关联后端 Service：
[ServiceName].ts
2. UI/UX 布局方案 (Layout Design)
- 页面入口：(例如：Console -> 订单管理 -> 订单工作台)
- 展示组件：
- 数据卡片：展示关键指标和汇总信息。
- 表格视图：展示详细数据列表，支持排序和筛选。
- 表单组件：用于数据录入和编辑。
- 交互流程：
+-----------------------------------------------------------+ | [Icon] 功能名称 | +-----------------------------------------------------------+ | 关键指标 1: 值 | 关键指标 2: 值 | 关键指标 3: 值 | +-----------------------------------------------------------+ | [ 按钮 1 ] [ 按钮 2 ] | +-----------------------------------------------------------+ | 表格标题 1 | 表格标题 2 | 表格标题 3 | 操作 | +-----------------------------------------------------------+ | 数据 1 | 数据 2 | 数据 3 | [编辑] [删除] | +-----------------------------------------------------------+
3. API 交互契约 (API Integration)
- 数据获取：
GET /api/v1/[resource] - 数据创建：
POST /api/v1/[resource] - 数据更新：
PUT /api/v1/[resource]/:id - 数据删除：
DELETE /api/v1/[resource]/:id - 关键字段映射：
- 后端字段 -> 前端展示字段
- 状态流转：
- 点击操作按钮 -> 发送 API 请求 -> 按钮进入
Loading状态 -> 成功后 Toast 提示并刷新数据。
- 点击操作按钮 -> 发送 API 请求 -> 按钮进入
4. 生产校验项 (FE Readiness)
- 移动端适配性校验。
- 关键数据脱敏展示。
- 错误边界处理（API 500 时的 Fallback 视图）。
- 性能优化（大数据量下的渲染性能）。
- 可访问性校验（符合 WCAG 标准）。