haha/haha-mp/CLAUDE.md

AI零售柜 - 智能视觉零售小程序

项目概述

一个基于 uni-app 3 + Vue 3 + TypeScript + Pinia 的跨平台小程序，实现"AI智能零售柜 · 即拿即走"的无人零售体验。用户扫码开门 -> 取走商品 -> 关门 -> AI自动识别 -> 微信支付分扣款。

技术栈

• 框架: uni-app 3.0 (DCloud)
• 核心: Vue 3.5 + TypeScript + Vite 5
• 状态管理: Pinia
• 样式: SCSS (自定义设计系统)
• 目标平台: 微信小程序 (主)、H5、支付宝小程序等

目录结构

haha-mp/
├── src/
│   ├── api/           # API 接口层
│   │   ├── device.ts       # 设备相关
│   │   ├── order.ts        # 订单相关
│   │   ├── user.ts         # 用户/登录
│   │   ├── payscore.ts     # 微信支付分
│   │   ├── coupon.ts       # 优惠券
│   │   ├── announcement.ts # 公告
│   │   ├── status.ts       # 状态轮询
│   │   └── replenish.ts    # 补货员
│   ├── pages/         # 页面
│   │   ├── index/          # 首页 (扫码入口)
│   │   ├── shopping/       # 购物流程页
│   │   ├── products/       # 柜内商品陈列
│   │   ├── login/          # 登录
│   │   ├── my/             # 个人中心
│   │   ├── orders/         # 订单列表
│   │   ├── orderDetail/    # 订单详情
│   │   ├── refund/         # 退款
│   │   ├── payscore/       # 开通微信支付分
│   │   ├── coupons/        # 我的优惠券
│   │   ├── couponCenter/   # 领券中心
│   │   ├── announcement/   # 系统公告
│   │   ├── announcementDetail/ # 公告详情
│   │   ├── agreement/      # 用户协议/privacy
│   │   └── replenish/      # 补货员绑定
│   ├── utils/         # 工具类
│   │   ├── config.ts       # API配置 & 路径常量
│   │   ├── request.ts      # HTTP请求封装
│   │   ├── auth.ts         # 认证/token管理
│   │   ├── order.ts        # 订单工具函数
│   │   ├── coupon.ts       # 优惠券工具函数
│   │   └── logger.ts       # 日志工具
│   ├── components/    # 公共组件
│   ├── styles/        # 样式
│   ├── static/        # 静态资源
│   ├── App.vue        # 应用入口（启动逻辑/登录守卫）
│   ├── main.ts        # 入口文件
│   ├── pages.json     # 页面路由配置
│   ├── manifest.json  # 应用配置
│   └── uni.scss       # 设计系统变量
├── package.json
├── tsconfig.json
└── index.html

业务架构

核心业务流程

1. 扫码开门: 用户扫码 -> 检查登录 -> 检查微信支付分(需550+) -> 后端开门 -> 进入购物页
2. 选购过程: 开门后60秒倒计时 -> 轮询设备状态等待关门
3. 关门结算: 门关 -> 轮询AI识别结果 -> 轮询订单信息 -> 展示结算结果
4. 查看订单: 订单列表(待支付/已完成/已取消) -> 订单详情 -> 退款(7天内)

页面路由

路径	功能	导航栏标题	免登录?
/pages/index/index	首页(扫码入口)	AI零售柜	否(扫码时校验)
/pages/login/login	微信手机号登录	登录	是
/pages/my/my	个人中心	(空)	否
/pages/shopping/shopping	购物流程	购物进行中	否
/pages/products/products	柜内商品陈列	柜内商品	是
/pages/orders/orders	订单列表	订单	否
/pages/orderDetail/orderDetail	订单详情	订单详情	否
/pages/refund/refund	退款	退款商品	否
/pages/payscore/enable	开通微信支付分	开通微信支付分	否
/pages/coupons/coupons	我的优惠券	我的优惠券	否
/pages/couponCenter/couponCenter	领券中心	领券中心	否
/pages/announcement/announcement	系统公告	系统公告	否
/pages/announcementDetail/announcementDetail	公告详情	公告详情	否
/pages/agreement/serviceAgreement	用户服务协议	用户服务协议	是
/pages/agreement/privacyPolicy	隐私政策	隐私政策	是
/pages/replenish/bind	补货员绑定	上货员绑定	是

后端API (dev环境)

• Base URL: https://dev-haha.kuaiyuman.cn/api
• 统一返回格式: { code: number, message: string, data?: T }
• 认证方式: header accessToken
• 业务码: 200/0=成功, 401=未授权

API 模块

模块	主要接口	说明
用户	miniapp-phone, user-info, logout	微信手机号一键登录
设备	scan-open, status, products/{id}	扫码开门&商品陈列
订单	list, detail, cancel	订单CRUD
支付分	check-enable, enable, create, confirm-enable	微信支付分开通&下单
优惠券	my, receive/{id}, available, usable, count	优惠券领取&使用
状态轮询	device, recognize, order, all	实时状态查询(轮询)
公告	list, detail	系统公告
补货员	login/wechat, login/bind, my-info	补货员身份绑定

状态轮询机制

核心购物流程依赖轮询:

• 设备状态: 2秒间隔, 120秒超时 -> 等待关门
• 识别结果: 1秒间隔, 60秒超时 -> AI识别商品
• 订单信息: 1秒间隔, 60秒超时 -> 生成订单

设计系统(uni.scss)

• 主色: #FFC107 (暖黄)
• 风格: 极简留白 · 优雅动效 · 微交互
• 功能已开发占位: 会员卡、卡片、发票管理、常见问题、公众号信息

辅助角色

• 补货员(Replenisher): 通过管理后台二维码绑定身份，独立登录体系
• 客服: 400-0755-315