1. 会员体系(核心)
静默登录:小程序启动即通过 wx.login + 后端换取 openId/token,无需用户操作(app.js)
注册/绑定:手机号快速绑定(微信授权免验证码)、自主注册生成电子会员卡号、绑定实体 IC 卡(短信验证码)
会员卡:查看卡号、余额,会员身份标记(isVip)、个人资料(昵称/头像/生日)维护
注销退款:用户可申请注销会员卡并退款(refund-apply 页面 + RefundApply 接口)
2. 付款码(线下消费)
生成消费条码 + 二维码(wxbarcode 渲染),供门店扫码扣款
30 秒倒计时自动刷新付款码;进入页面自动将屏幕调至最亮(方便收银台扫码),离开恢复
3. 充值
微信余额充值(PaymentRequestSec 拉起微信支付)
充值方案从后端系统配置动态获取(GetConfigByKey)
支持扫门店码/店员码进入时携带场景参数,充值时归属对应门店
4. 蛋糕预订商城
商品分类(左侧标签)+ 产品列表 + 商品详情
多规格选择(spec-popup 组件:尺寸/口味等)、定制提货日期(pickDate)
购物车(cart 组件 + 步进器 stepper)、立即购买、订单预览、创建订单
优惠券:下单时查询可用券(GetMyTickets)、领券、券包列表、券规则详情
5. 订单中心
订单列表、订单详情、退货申请(Refund)、取消/退款流程
6. 门店与定位
获取用户定位(gcj02),按距离展示就近门店列表
门店选择、门店详情(电话/导航)、扫门店场景码识别门店
1. 技术栈
微信小程序原生(glass-easel 组件框架,按需注入 lazyCodeLoading)
UI 库 Vant Weapp 1.11(构建 npm 至 miniprogram_npm)
状态管理 mobx-miniprogram + mobx-miniprogram-bindings
日期 dayjs;精确金额计算用 vendor/decimal
条码/二维码 wxbarcode
其他 wx-minicomponent(含转盘等)、自研网络监测
2. 目录与分包架构
主包 5 个 tabBar 页:首页 / 蛋糕预订 / 付款码 / 订单 / 我的(app.json)
自定义 tabBar(custom: true + custom-tab-bar/),选中态索引存在全局 store 中,页面切换时用 updateTabbarIndexWhenPageToggle 同步
分包 subpkgs:16 个低频页面(充值、优惠券、门店、福利、协议、退款申请等),降低主包体积
3. 全局状态(MobX store)
store.js 用 observable + action 集中管理:token / uToken / sessionId、会员信息、isBind/isVip、scene 场景码、当前门店与门店列表、定位坐标、蛋糕购物车订单、提货日期等。页面通过 createStoreBindings 绑定,组件通过 storeBindingsBehavior 绑定;welfare 页还用了 autorun 监听 token 就绪后再拉数据。