更新记录

1.0.0（2026-03-29）

v1.0.0 (2026-03-29)

星云咖啡

• 项目初始化：创建星云咖啡项目基础结构
• 页面开发：完成首页、购物车、订单、我的等核心页面
• 功能实现：商品浏览、购物车管理、订单管理、优惠券系统
• UI设计：参考瑞幸咖啡风格，蓝色主题
• 图标设计：创建底部导航SVG图标

项目介绍

星云咖啡是一个基于uni-app和uniCloud开发的咖啡点单小程序，参考瑞幸咖啡风格设计。支持微信小程序、H5、APP多平台部署，提供完整的咖啡点单流程，包括商品浏览、购物车管理、订单管理、优惠券、门店导航等功能。

主要功能

核心功能

• 商品浏览：分类展示咖啡、茶饮、果汁、甜点等商品
• 购物车管理：添加商品、修改数量、规格选择、结算
• 订单管理：订单列表、订单状态跟踪、取餐码展示
• 优惠券系统：优惠券领取、使用、管理
• 门店导航：附近门店查询、地图导航
• 用户中心：个人信息、会员等级、积分、钱包

页面结构

底部导航页面

子页面

技术栈

前端技术

• 框架：uni-app (Vue.js跨平台框架)
• UI组件库：vk-uview-ui
• 状态管理：Vuex
• 样式预处理：SCSS

后端技术

• 云开发：uniCloud (阿里云)
• 数据库：NoSQL数据库
• 用户系统：uni-id
• 云函数框架：vk-unicloud-router

项目结构

├── App.vue                    # 应用入口文件
├── main.js                    # 应用入口JS
├── pages.json                 # 页面路由配置
├── manifest.json              # 应用配置文件
├── app.config.js              # 应用配置
├── common/                    # 公共资源
│   ├── css/                   # 公共样式
│   └── function/              # 公共函数
├── pages/                     # 页面文件
│   ├── index/                 # 首页
│   ├── cart/                  # 购物车
│   ├── order/                 # 订单
│   ├── mine/                  # 我的
│   ├── goods/                 # 商品详情
│   ├── store/                 # 门店
│   ├── coupon/                # 优惠券
│   ├── login/                 # 登录相关
│   └── user/                  # 用户中心
├── static/                    # 静态资源
│   └── tabbar/                # 底部导航图标
├── store/                     # Vuex状态管理
├── uni_modules/               # uni-app模块
│   ├── vk-unicloud/           # 云开发框架
│   └── vk-uview-ui/           # UI组件库
└── uniCloud-aliyun/           # 云开发资源
    ├── cloudfunctions/        # 云函数
    └── database/              # 数据库配置

安装指南

前置条件

• 安装HBuilderX编辑器
• 注册DCloud开发者账号
• 创建uniCloud云服务空间

项目导入

1. 在HBuilderX中导入项目
2. 关联uniCloud云服务空间
3. 上传云函数和数据库

运行项目

1. 选择运行平台（微信小程序/H5/App）
2. 点击运行按钮启动项目

设计特点

UI风格

• 主题色：蓝色 #0066CC
• 设计风格：参考瑞幸咖啡，简洁现代
• 图片资源：使用 Unsplash 高质量图片

底部导航

使用SVG图标，包含：

• 首页（home）
• 购物车（cart）
• 订单（order）
• 我的（mine）

License

Apache 2.0

平台兼容性

云端兼容性

uni-app(4.85)

uni-app x(4.83)

云函数类插件通用教程

使用云函数类插件的前提是：使用HBuilderX 2.9+