(微信小程序)微信小程序-毕设级项目搭建-扫码点餐微信小程序(微信小程序+java逻辑后台+html管理系统)

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接: https://blog.csdn.net/u012888052/article/details/101530460

作者(转载请注明出处):Happy王子乐
个人网站(整理了部分学习资源,以及个人项目):http://www.ilearn1234.com/#/
个人GitHub(喜欢的还请点个Star、flow一下):https://github.com/HappyWjl
相关文章:
(微信小程序)微信小程序-毕设级项目搭建-微信阅读小程序(内含源码,微信小程序+java逻辑后台+vue管理系统)~不求完美,实现就好
(JAVA后端)微信小程序-毕设级项目搭建-微信阅读小程序(内含源码,微信小程序+java逻辑后台+vue管理系统)~不求完美,实现就好
(vue管理系统)微信小程序-毕设级项目搭建-微信阅读小程序(内含源码,微信小程序+java逻辑后台+vue管理系统)~不求完美,实现就好
(微信小程序)微信小程序-毕设级项目搭建-微信小程序商城(内含源码,微信小程序+java逻辑后台+vue管理系统)
(JAVA后端)微信小程序-毕设级项目搭建-微信小程序商城(内含源码,微信小程序+java逻辑后台+vue管理系统)
(vue管理系统)微信小程序-毕设级项目搭建-微信小程序商城(内含源码,微信小程序+java逻辑后台+vue管理系统)~不求完美,实现就好
(vue博客前台)vue系统-毕设级项目搭建-vue博客系统(内含源码,vue博客前台+java逻辑后台+vue管理系统)
(java逻辑后台)vue系统-毕设级项目搭建-vue博客系统(内含源码,vue博客前台+java逻辑后台+vue管理系统)
(vue管理系统)vue系统-毕设级项目搭建-vue博客系统(内含源码,vue博客前台+java逻辑后台+vue管理系统)

一、环境搭建

  • 参考教程:https://blog.csdn.net/u012888052/article/details/79623229

  • 另外,因为程序涉及微信登录功能,还需要自己注册个测试账号,相关地址:https://developers.weixin.qq.com/sandbox
    里面的AppID、AppSecret,后面需要配置到java后台配置文件中。

  • 此项目,代码样式为网上搜集,如有雷同,纯属巧合。

二、相关技术栈

css:略
javascript:略
weui:微信官方设计团队为微信 Web 开发量身打造的一个 UI 样式库,各种官方组件,好用简洁。

三、项目简单介绍

  • 当用户扫描小程序二维码后,即可进入小程序首页,目前此项目未发布到线上,所以还没有公开的二维码。

  • 小程序首页
    在这里插入图片描述
    主页面提供美食轮播图,可在后台自定义图片;
    下方展示了店铺名称、店铺地址信息,可在后台自定义文案;
    用户进行授权时,会调用微信小程序api,获取openid等值,并通过后端接口将用户信息保存到数据库中。

  • 点餐页
    在这里插入图片描述
    当点击中间“点餐”按钮后,进入到点餐页,通过左侧的列表,展示了菜品的各种类目。点击类目,可以看到右侧详细的商品列表了,包括商品名称、商品描述、库存、价格,这些信息都可以在管理后台进行修改。
    在这里插入图片描述
    当点击商品右下角的“➕”时,商品会加入到购物车
    在这里插入图片描述
    点击购物车图标时,可以显示购物车内商品详情,并且可以一键清空购物车。

  • 确认订单页
    在这里插入图片描述
    确认订单页可以选择就餐人数,方便上菜时,提供适合的餐筷。
    在这里插入图片描述
    点击下方按钮时,可以选择支付方式,分别为:会员卡、微信支付、银行卡。
    当选择完支付方式后,订单即为"已支付"状态。

  • 我的页
    在这里插入图片描述
    我的页可以修改个人信息,查看刚刚下过的订单,查看发表过的评价,并且可以直接拨打商家电话。
    在这里插入图片描述
    点击头像时,修改信息页弹出,可自行修改用户信息。
    在这里插入图片描述
    点击上方状态菜单,可查看不同状态下的订单信息。
    在这里插入图片描述
    当上菜后,后台管理系统可以完结订单,用户端即显示为“待评价”状态。
    在这里插入图片描述
    评价订单可以输入文字,进行美味的描述。。
    在这里插入图片描述
    评价完成后,订单为真正的完成状态,此时可以查看评价内容
    在这里插入图片描述
    评价内容可以选择查看全部或者自己的评价内容

四、项目注意点

  • 项目采用了微信小程序 云开发,所以需要开启云开发权限
    在这里插入图片描述
    点击微信开发工具上方的云开发菜单
    在这里插入图片描述
    在云函数中配置上云函数名称

以上

小程序前端讲解地址:https://blog.csdn.net/u012888052/article/details/101530460

java后台、html管理后台 项目讲解地址:https://blog.csdn.net/u012888052/article/details/101768315


作者:Happy王子乐

QQ:820155406

猜你喜欢

转载自blog.csdn.net/u012888052/article/details/101530460
今日推荐