# YShop Drink UniApp 用户端 - Claude Code 配置

## 项目信息

| 属性 | 值 |
|------|-----|
| 项目名称 | yshop-miniapp |
| 项目类型 | mobile (用户端小程序/H5) |
| 版本 | 3.2.2 |
| 框架 | UniApp |

## 技术栈

| 技术 | 版本 | 用途 |
|------|------|------|
| UniApp | - | 跨端框架 |
| Vue 3 | - | 核心框架 |
| Vant | 4.6.2 | 移动端 UI |
| Pinia | 2.1.6 | 状态管理 |
| 微信 JSSDK | 1.6.3 | 微信 API |

## 支持平台

- 微信小程序
- H5

## 项目结构

```
yshop-drink-uniapp/
├── api/                       # API 接口
├── components/                # 公共组件
├── config/                    # 配置文件
├── hooks/                     # 组合式函数
├── pages/                     # 页面
│   ├── index/                 # 首页 (点餐)
│   ├── menu/                  # 菜单
│   ├── order/                 # 订单
│   ├── mine/                  # 我的
│   └── components/            # 页面级组件
├── static/                    # 静态资源
├── store/                     # Pinia 状态
├── uni_modules/               # uni_modules 组件
├── utils/                     # 工具函数
├── App.vue                    # 根组件
├── main.js                    # 入口文件
├── manifest.json              # 应用配置
├── pages.json                 # 页面配置
├── uni.scss                   # 全局样式
└── package.json
```

## 页面说明

| 页面 | 路径 | 功能 |
|------|------|------|
| 首页 | `/pages/index/` | 门店选择、扫码点餐 |
| 菜单 | `/pages/menu/` | 商品列表、加购物车 |
| 订单 | `/pages/order/` | 订单列表、订单详情 |
| 我的 | `/pages/mine/` | 个人中心、余额、优惠券 |

## 开发命令

```bash
# 安装依赖
npm install

# 开发 (使用 HBuilderX)
# 运行 → 运行到小程序模拟器 → 微信开发者工具
# 运行 → 运行到浏览器 → Chrome

# 发布 (使用 HBuilderX)
# 发行 → 小程序-微信
# 发行 → 网站-H5
```

## 配置文件

### manifest.json
```json
{
  "mp-weixin": {
    "appid": "wx...",
    "setting": {
      "urlCheck": false
    }
  },
  "h5": {
    "router": {
      "mode": "hash"
    }
  }
}
```

### pages.json
```json
{
  "pages": [
    { "path": "pages/index/index" },
    { "path": "pages/menu/index" },
    { "path": "pages/order/index" },
    { "path": "pages/mine/index" }
  ],
  "tabBar": {
    "list": [...]
  }
}
```

## API 规范

```javascript
// api/order.js
import request from '@/utils/request'

// 获取订单列表
export function getOrderList(data) {
  return request({
    url: '/app/order/list',
    method: 'get',
    data
  })
}

// 创建订单
export function createOrder(data) {
  return request({
    url: '/app/order/create',
    method: 'post',
    data
  })
}
```

## 状态管理

```javascript
// store/modules/cart.js
import { defineStore } from 'pinia'

export const useCartStore = defineStore('cart', {
  state: () => ({
    items: [],
    shopId: null
  }),

  getters: {
    totalCount: (state) => state.items.reduce((sum, item) => sum + item.count, 0),
    totalPrice: (state) => state.items.reduce((sum, item) => sum + item.price * item.count, 0)
  },

  actions: {
    addItem(product) {
      // ...
    }
  },

  persist: true
})
```

## UV 组件

项目使用 `uv-ui` 组件库，通过 `uni_modules` 方式引入:

| 组件 | 用途 |
|------|------|
| uv-button | 按钮 |
| uv-cell | 单元格 |
| uv-popup | 弹出层 |
| uv-tabs | 标签页 |
| uv-icon | 图标 |
| uv-loading-icon | 加载 |
| uv-navbar | 导航栏 |
| uv-skeleton | 骨架屏 |

## 核心功能

| 功能 | 说明 |
|------|------|
| 扫码点餐 | 扫桌号二维码进入点餐 |
| 商品浏览 | 按分类查看商品 |
| 购物车 | 加购、改数量、规格选择 |
| 下单支付 | 微信支付/余额支付 |
| 订单查询 | 订单列表、状态跟踪 |
| 会员中心 | 余额、优惠券、地址 |
| 充值 | 余额充值 |

## 微信相关

```javascript
// 微信登录
uni.login({
  provider: 'weixin',
  success: (res) => {
    // res.code
  }
})

// 微信支付
uni.requestPayment({
  provider: 'wxpay',
  orderInfo: payInfo,
  success: () => {},
  fail: () => {}
})
```

## 注意事项

1. 小程序需要在微信公众平台配置域名白名单
2. 支付功能需要商户号配置
3. H5 需要配置 CORS