基于微信小程序云开发的鲜花电商系统,覆盖鲜花展示、分类浏览、搜索、购物车、在线下单、配送跟踪等完整流程。用户可一键授权登录、管理地址、支付订单;管理者通过云开发控制台完成鲜花上下架、订单处理与数据统计。界面清新,可直接商用部署。
🌸 花坊鲜花售卖商店 · 微信小程序源码
前端源码 | 基于微信云开发 | 可直接商用
一、项目概述
专注为用户提供鲜花选购、花束定制、在线下单、配送查询等一站式购花体验。系统覆盖鲜花展示、分类、详情、购物车、订单支付、订单跟踪、个人中心等完整电商流程,依托微信云开发实现无服务器部署,数据安全、上线快速、维护简便。
适用场景: 节日送礼、日常表达、生日祝贺等多种购花场景。
面向角色: 普通用户 + 后台管理者
| 角色 | 核心操作 |
|---|---|
| 用户 | 挑选鲜花 → 加入购物车 → 提交订单 → 选择配送时间与地址 |
| 管理者 | 鲜花上下架 → 订单处理 → 配送管理 → 数据统计(云开发控制台) |
二、技术框架
3.1 核心底层框架
- 微信小程序原生: WXML + WXSS + JavaScript + 本地Storage缓存
- 前端Base64自定义加密
- 采用 Serverless 云开发架构,无需服务器、域名与备案
- 前后端分离:前端负责页面渲染与交互,后端通过云函数与云数据库处理业务逻辑
3.2 后端技术栈
| 项 | 内容 |
|---|---|
| 开发环境 | 微信开发者工具 |
| 服务架构 | 小程序云开发(Serverless) |
| 数据库 | 云数据库(鲜花、订单、用户、地址等) |
| 业务处理 | 云函数 |
| 文件存储 | 云存储(鲜花图片、宣传图) |
| 认证体系 | 微信用户一键授权登录 |
3.3 前端技术栈
| 项 | 内容 |
|---|---|
| 基础框架 | 微信小程序原生 |
| 页面技术 | WXML + WXSS + JavaScript |
| 布局方式 | Flex 弹性布局 |
| UI 风格 | 简约清新、鲜花主题配色 |
| 核心模块 | 首页、鲜花分类、鲜花详情、购物车、订单、个人中心、地址管理 |
| 交互能力 | 搜索、筛选、加入购物车、下单、支付、订单跟踪 |
3.4 数据库(云数据库核心集合)
| 集合 | 存储内容 |
|---|---|
flowers |
鲜花信息:名称、图片、价格、分类、详情、库存 |
category |
鲜花分类:玫瑰、百合、康乃馨、礼盒、永生花等 |
cart |
购物车数据 |
order |
订单数据:状态、配送时间、地址、费用 |
user |
用户信息 |
address |
用户收货地址 |
3.5 开发及生产环境
| 项 | 内容 |
|---|---|
| 系统环境 | Windows 10 |
| 开发工具 | VSCode / 微信开发者工具 |
| 运行环境 | 微信客户端(小程序模式) |
| 部署方式 | 微信小程序后台上传发布 |
三、功能模块
4.1 用户功能模块
| 功能 | 说明 |
|---|---|
| 微信授权登录 | 一键获取微信信息,快速登录 |
| 首页展示 | 轮播广告、推荐鲜花、热销花束、节日专题 |
| 鲜花分类 | 按花材、用途、价格、节日分类浏览 |
| 鲜花搜索 | 关键词快速查找目标花束 |
| 鲜花详情 | 图片、介绍、包装、花语、价格、规格选择 |
| 购物车 | 添加、删除、修改数量、合计价格 |
| 收货地址 | 新增、编辑、删除、默认地址 |
| 在线下单 | 选择配送时间、提交订单、支付 |
| 订单管理 | 待支付、待配送、待收货、已完成、退款/售后 |
| 个人中心 | 个人信息、订单入口、收藏、地址管理 |
4.2 后台管理模块(云开发控制台)
| 功能 | 说明 |
|---|---|
| 鲜花管理 | 上架、下架、编辑、删除鲜花 |
| 分类管理 | 添加、修改鲜花分类 |
| 订单管理 | 查看订单、修改订单状态、配货、发货、完成 |
| 用户管理 | 查看用户信息、购买记录 |
| 数据统计 | 销量、订单量、热门鲜花统计 |
| 轮播图管理 | 上传首页广告图片 |
四、安装与部署
| 步骤 | 操作 |
|---|---|
| ① 开发环境准备 | 安装微信开发者工具,配置项目基础文件与目录结构 |
| ② 项目导入 | 打开微信开发者工具 → 导入项目 → 选择源码目录 → 填写小程序 AppID(可使用测试号) |
| ③ 运行与预览 | 点击编译 → 模拟器实时展示 → 可真机扫码预览 |
| ④ 发布部署 | 调试无误后点击上传 → 登录微信公众平台提交代码审核 → 审核通过后发布上线 |
五、适合人群
该框架源码工程化程度高、代码结构清晰、无过度封装,适合以下人群:
- 初级 / 中级开发工程师
- 后端服务架构学习者
- 计算机专业在校学生
- 微信小程序开发 / 前端开发爱好者
- 个人开源项目实践者
关键字: 鲜花 · 小程序 · 电商 · 订购 · 配送 · 微信 · 云开发 · 商城 · 花艺 · 订单
项目名称: 520鲜花售卖商店微信小程序



