# 独立站 页面前端业务说明书

## 1️⃣ 页面定义

### 页面目标
帮助商户：
- 创建和管理独立站
- 配置独立站的基本信息和设置
- 管理独立站的商品和订单
- 分析独立站的运营数据
- 优化独立站的运营策略

### 页面类型
- 业务核心页（直接影响独立站运营）

## 2️⃣ 页面核心数据

### 核心数据字段
- siteId（站点ID）：唯一标识独立站
- siteName（站点名称）：独立站的名称
- domain（域名）：独立站的域名
- status（站点状态）：活跃、暂停、关闭等
- template（模板）：独立站使用的模板
- theme（主题）：独立站的主题设置
- products（商品）：独立站内的商品列表
- orders（订单）：独立站的订单列表
- traffic（流量）：独立站的访问流量
- sales（销售额）：独立站的销售数据
- createdAt（创建时间）：独立站的创建时间
- updatedAt（更新时间）：独立站的更新时间

## 3️⃣ 页面核心操作

### 用户操作
- 创建独立站：创建新的独立站
- 配置独立站：设置独立站的基本信息和参数
- 管理商品：添加、编辑和删除独立站内的商品
- 管理订单：处理独立站的订单
- 分析数据：查看独立站的运营数据和分析报告
- 优化设置：调整独立站的设置以提高运营效果

## 4️⃣ 操作 → 业务结果

### 操作闭环
1. **创建独立站**
   - 触发：用户点击"创建独立站"按钮
   - 服务：IndependentSiteService.createSite
   - 结果：创建新的独立站，生成站点ID和默认配置
   - 反馈：显示创建成功提示，跳转到独立站配置页面

2. **配置独立站**
   - 触发：用户修改独立站的配置
   - 服务：IndependentSiteService.updateConfig
   - 结果：更新独立站的配置信息
   - 反馈：显示配置更新成功提示

3. **管理商品**
   - 触发：用户在独立站内添加、编辑或删除商品
   - 服务：IndependentSiteService.manageProducts
   - 结果：更新独立站的商品列表
   - 反馈：显示商品操作成功提示

4. **分析数据**
   - 触发：用户点击"分析数据"按钮
   - 服务：AnalyticsService.analyzeSiteData
   - 结果：生成独立站的运营分析报告
   - 反馈：显示分析结果和图表

## 5️⃣ 页面状态

### 状态定义
- loading：数据加载中
- empty：无独立站数据
- error：操作错误
- success：操作成功
- creating：独立站创建中
- configuring：独立站配置中
- analyzing：数据分析中

## 6️⃣ 收费点

### 收费触发点
- 独立站创建：按站点数量收费
- 高级模板：按模板类型收费
- 数据分析：按功能使用时间收费
- 流量优化：按优化效果收费

## 7️⃣ 页面结构

### 主要区域
1. **独立站列表区**：显示所有独立站，包含核心数据字段
2. **独立站详情区**：显示单个独立站的详细信息
3. **站点配置区**：配置独立站的基本信息和设置
4. **商品管理区**：管理独立站内的商品
5. **订单管理区**：管理独立站的订单
6. **数据分析区**：显示独立站的运营数据和分析报告

## 8️⃣ 业务价值

### 核心价值
- 帮助商户快速创建和管理独立站
- 提供个性化的独立站配置选项
- 实现商品和订单的统一管理
- 提供数据驱动的运营分析
- 优化独立站的运营效果，提高销售额

### 商业闭环
独立站创建 → 配置设置 → 商品上传 → 订单处理 → 数据分析 → 优化调整 → 销售增长

## 9️⃣ 前端实现要点

### 技术实现
- 使用React组件化开发
- 集成Ant Design表格和表单组件
- 实现虚拟列表，优化大数据量渲染
- 使用Umi Model管理全局状态
- 实现实时数据更新和WebSocket连接
- 集成第三方模板和主题选择器

### 用户体验
- 响应式设计，支持多终端访问
- 操作反馈及时，显示loading和success/error提示
- 数据可视化，使用图表展示运营数据和分析结果
- 批量操作支持，提高工作效率
- 拖拽式页面构建器，方便用户自定义独立站页面

## 🔟 后端服务依赖

### 核心服务
- IndependentSiteService：独立站管理和配置
- ProductService：商品管理
- OrderService：订单管理
- AnalyticsService：数据分析
- TemplateService：模板管理

### 数据接口
- GET /api/v1/sites：获取独立站列表
- POST /api/v1/sites：创建独立站
- GET /api/v1/sites/:id：获取独立站详情
- PUT /api/v1/sites/:id：更新独立站配置
- DELETE /api/v1/sites/:id：删除独立站
- GET /api/v1/sites/:id/products：获取独立站商品列表
- GET /api/v1/sites/:id/orders：获取独立站订单列表
- GET /api/v1/sites/:id/analytics：获取独立站分析数据
- GET /api/v1/templates：获取可用模板列表