# 商城消费者端 (Consumer) 开发文档

本文档包含了商城消费者前端模块的详细开发指南和状态说明。

## 📂 项目结构

消费者端模块位于 `pages/mall/consumer/` 目录下，基于 UniApp x (UTS/UVUE) 开发。

### 核心页面清单

| 页面文件 | 描述 | 当前状态 |
|-----------|-------------|--------|
| `index.uvue` | 首页 (商城门面) | ✅ 正常 |
| `category.uvue` | 商品分类浏览 | ✅ 正常 |
| `cart.uvue` | 购物车 | ✅ 正常 |
| `profile.uvue` | 个人中心 (用户主页) | ✅ 正常 |
| `orders.uvue` | 订单列表管理 | ✅ 正常 |
| `order-detail.uvue` | 订单详情页 | ✅ 正常 |
| `apply-refund.uvue` | 申请售后 (退款/退货) | ✅ 正常 |
| `refund.uvue` | 售后记录列表 | ✅ 正常 |
| `chat.uvue` | 在线客服 | ✅ 正常 |
| `messages.uvue` | 消息通知中心 | ✅ 正常 |

### 关键功能实现

1.  **用户个人中心**:
    *   可视化展示用户状态（积分、余额）。
    *   订单状态快捷入口（待支付、待发货、待收货等）。
    *   **我的服务**: 优惠券、地址、收藏夹。
    *   **新功能**: 已集成“评价”入口（跳转至待评价订单）和“退款/售后”入口（跳转至售后记录页）。

2.  **订单管理**:
    *   多状态标签页切换（全部、待支付、待收货、已完成）。
    *   **操作**: 支付、取消、提醒发货、确认收货、评价、**申请售后**。
    *   与 `supabaseService` 后端服务实时交互。

3.  **售后系统**:
    *   独立页面 `apply-refund.uvue`：支持仅退款/退货退款，关联原订单金额。
    *   售后列表 `refund.uvue`：查看历史退款记录及进度。

4.  **客服与消息**:
    *   在线客服 `chat.uvue`：支持文本/表情发送，消息持久化存储。
    *   消息中心 `messages.uvue`：聚合系统通知与客服消息。

## 🛠 技术栈

*   **框架**: UniApp x (Vue 3 + UTS)
*   **后端**: Supabase (PostgreSQL)
*   **语言**: UTS (TypeScript 方言)
*   **样式**: SCSS / UVUE Styles

## 🚀 快速开始

1.  **环境准备**: 确保已安装 HBuilderX 并配置好 UniApp x 插件。
2.  **数据库**: 运行 `doc_mall/consumer/sql/` 下的 SQL 脚本初始测试数据。
3.  **运行**: 在 HBuilderX 中打开项目，运行到 Web 浏览器或 App 模拟器。

## 📚 文档索引

*   [功能与页面状态详解](./FEATURES_&_PAGES.md)
*   [Supabase 集成与数据库架构](./SUPABASE_INTEGRATION.md)
*   [测试数据生成指南](./MOCK_DATA_GUIDE.md)