# 前端集成蓝图：智能动态调价建议 (Dynamic Pricing)

> **[AI-1 @ 2026-03-14]**：基于 `DynamicPricingService.ts` 产出。

## 1. 业务意图 (Business Intent)
- **核心价值**：帮助运营人员在保护利润红线的前提下，快速响应市场竞争，通过 AGI 叙述消除“为何改价”的疑虑。
- **关联后端 Service**：[DynamicPricingService.ts](file:///d:/trae_projects/crawlful-hub/server/src/services/DynamicPricingService.ts)

## 2. UI/UX 布局方案 (Layout Design)
- **页面入口**：Console -> 商品管理 -> 价格竞争看板
- **展示组件**：
    - **决策因果流 (Narrative Timeline)**：左侧展示商品现状，右侧展示 AGI 模拟出的调价后利润曲线。
    - **风险预警色**：如果调价后利润率接近 15% (B2B) 或 20% (B2C) 红线，组件背景需变为浅黄色。
- **交互草图**：
    ```text
    +-----------------------------------------------------------+
    | SKU: SKU-12345 | 当前价: $25.00 | 建议价: $22.99 (-$2.01) |
    +-----------------------------------------------------------+
    | [AGI 分析报告]                                            |
    | 1. 监测到 AliExpress 竞品降价 12%。                       |
    | 2. 调价后预计销量提升 40%，月利润提升 $450。              |
    | 3. 调价后净利润率为 21.5% (高于 20% 预警线)。             |
    +-----------------------------------------------------------+
    | [ 查看证据链 (XAI) ] | [ 忽略 ] | [ 一键执行调价建议 ]    |
    +-----------------------------------------------------------+
    ```

## 3. API 交互契约 (API Integration)
- **数据获取**：`GET /api/v1/pricing/suggestions?status=PENDING_REVIEW`
- **核心逻辑映射**：
    - 后端 `suggested_price` -> 前端输入框默认值。
    - 后端 `causalChain` -> 前端“AGI 分析报告”文案。
- **状态流转**：
    - 点击 [一键执行] -> 调用 `POST /api/v1/pricing/batch-approve`。
    - 按钮状态切换：`Normal` -> `Processing` -> `Completed` (Green Check)。

## 4. 生产校验项 (FE Readiness)
- [x] 价格输入框需支持“低于成本价”二次确认弹窗。
- [x] 需联动 `DecisionExplainabilityEngine` 展示热力图。
- [x] 确保在不同屏幕分辨率下，AGI 叙述长文本能优雅折叠。