拾光咖啡·点单产品系统Vibe Coding

中小咖啡门店在高峰期依赖店员手写单与口头确认，容易出现错单漏单，顾客排队时间长，也无法提前安排取餐。本项目的立项目标是验证一套轻量自提点单流程：顾客在进店前完成选品与结算，门店按单制作，减少前台沟通成本。场景覆盖单店自提、菜单频繁调整、商品按时段上下架等典型门店经营情况，分类结构与商品字段按真实咖啡门店的品类组织方式设计。

项目包含门店信息展示、商品分类切换、商品列表、购物车、结算确认五个功能模块。首页卡片展示门店名称、距离、营业时间与自提标识；左侧分类栏支持热销、咖啡、茶饮、轻食四类切换，右侧商品列表随分类联动刷新；每个商品卡片包含封面、名称、规格描述、价格与加入按钮，点击后购物车件数与合计金额实时更新，并通过本地存储持久化，冷启动后可恢复；底部购物车条汇总已选件数、金额与配送信息，点击去结算弹出订单确认弹窗，空购物车时给出明确提示。全部交互均可在微信开发者工具中独立运行，无需后端服务。

本人独立完成需求梳理、原型设计、界面开发、交互逻辑与功能自测，未使用第三方 UI 框架。项目采用原生微信小程序 WXML、WXSS、JavaScript，页面状态统一由 Page.data 驱动，分类与商品数据以结构化数组维护，通过 wx:for 渲染列表；购物车增减、金额汇总与选中态计算集中在页面 JS，使用 wx.setStorageSync 做本地持久化。实现重点是双 scroll-view 左右分栏联动与购物车状态的即时同步，难点在于不同屏宽下分栏高度自适应与列表滚动互不干扰。项目为自主发起的能力验证项目，源码完整可运行。