# 页面设计: 订单流程 (Order Flow)

> **路由**:
> - 确认订单: `/checkout`
> - 支付: `/payment`
> - 详情: `/me/orders/:id`

## 1. 确认订单页 (Checkout)
- **步骤条**: 1.确认订单 -> 2.支付 -> 3.完成。
- **收货地址 (如需)**:
  - 卡片网格展示已有地址。
  - [+ 新增地址] 虚线框按钮。
- **商品清单**:
  - 列表: 图片 | 标题 | 单价 | 数量 | 小计。
- **优惠/备注**:
  - 优惠券选择器。
  - 买家留言输入框。
- **底部结算栏 (Sticky Bottom)**:
  - 只有 "合计金额"。
  - [提交订单] 大按钮。

## 2. 收银台/支付页 (Cashier)
- **倒计时**: "请在 15:00 内完成支付，超时将取消"。
- **订单金额**: 大字体显示。
- **支付方式**:
  - Radio List: 微信支付、支付宝、余额支付。
  - 选中会有高亮边框。
- **扫码区**: (PC端) 展示二维码，轮询支付状态。

## 3. 订单详情页 (Order Detail)
- **状态栏**:
  - 顶部大卡片。
  - 当前状态 (如 "待发货") + 进度条 (下单 -> 付款 -> 发货 -> 完成)。
  - 对应操作按钮: [申请退款] [确认收货] [去评价]。
- **信息模块**:
  - **收货信息**: 人名、电话、地址。
  - **订单信息**: 订单号、创建时间、支付时间。
  - **商品列表**: 复用清单组件。
  - **费用明细**: 商品总价 - 优惠 + 运费 = 实付。