微信扫码点餐小程序 云开发cms网页管理后台后厨端订单数据库折线趋势图

微信扫码点餐小程序 云开发cms网页管理后台后厨端订单数据库折线趋势图
共200节 6176人在学 课程详情
课程目录
讨论留言
  • 项目演示

    • 2024年新加折线图柱状图销量趋势图功能
    • 2024最新知识点翻新提示
    • 1-1点餐小程序技术选型和首页演示
    • 1-2菜品列表页带分类和不带分类的演示
    • 1-3点餐小程序购物车页面的演示
    • 1-4扫码点餐下单并模拟支付
    • 1-5我的订单页效果演示
    • 1-6对饭店进行评价并查看评价列表
    • 1-7客户端排号等位和管理端叫号功能演示
    • 1-8个人中心和在线客服功能的演示
    • 1-9手机扫码下单和后厨管理员登录
    • 1-10用户新下单厨师端有语音提示
    • 1-11支付成功后增加菜品销量
    • 1-12CMS可视化网页管理后台演示
    • 1-13新加首页热门菜品推荐和饭店地址地图显示功能
    • 1-14新加购物车页面和继续选菜功能
  • 源码的下载与部署

    • 2-1下载模拟支付源码并导入到开发者工具
    • 2-2小程序云开发环境的初始化
    • 2-3云函数的部署
    • 2-4下单提示音上传到云存储
  • cms可视化后台

    • 3-1在云开发控制台开通cms内容管理功能
    • 3-2熟悉cms可视化内容管理后台
    • 3-3内容管理cms的深入学习
    • 3-4请求cms创建的新闻列表
    • 3-5列表跳详情页并携带数据
    • 3-6在详情页请求详情数据并展示到页面
    • 3-7数据表(内容模型)的导入
    • 3-8导入菜品数据遇到问题
    • 3-9导入菜品和轮播图数据并修改集合权限
    • 3-10管理员和订单表的权限修改
    • 3-11创建新的菜品类目并添加新菜
  • 源码的速览(选学)

    • 4-1点餐小程序首页代码快速讲解
    • 4-2个人中心页代码的快速讲解
    • 4-3管理页登录页的快速讲解
    • 4-4后厨管理端代码的快速讲解
    • 4-5排号管理端代码的快速讲解
    • 4-6不带分类菜品列表代码的快速讲解
    • 4-7带分类菜品列表代码的快速讲解
    • 4-8我的订单和评价列表代码的快速讲解
    • 4-9用户端排号等位代码的快速讲解
    • 4-10确认订单和模拟支付代码的快速讲解
  • 创建新项目

    • 5-1注册并创建属于自己的第一个小程序
    • 5-2创建项目时最好勾选不使用云服务
    • 5-3改造项目把一些无用的文件删除掉
    • 5-4创建项目所需页面改造主题样式
    • 5-5通过tabBar设置小程序多页面
  • 首页的开发

    • 6-1首页轮播图swiper和image组件的使用
    • 6-2请求网络数据并渲染到首页轮播图
    • 6-3在cms后台动态增删轮播图
    • 6-4编写搜索框的页面
    • 6-5搜索区域页面美化
    • 6-6获取用户的输入内容
    • 6-7搜索词为空的时候给用户一个提示
    • 6-8模糊搜索实现的关键代码编写
    • 6-9通过手机键盘触发搜索事件
    • 6-10跳到菜品页并携带搜索词
  • 九宫格分类的开发

    • 7-1下载所需的图片资源
    • 7-2学习flex弹性布局来实现九宫格
    • 7-3九宫格布局的美化
    • 7-4定义九宫格的点击事件实现页面跳转
    • 7-5修改每个页面的顶部标题
  • 热门菜品推荐

    • 8-1首页热门菜品标题区域的编写
    • 8-2获取首页热门菜品的数据
    • 8-3通过云函数获取热门菜品
    • 8-4把热门菜品数据渲染到页面上
    • 8-5首页热门菜品列表样式的美化
    • 8-6标题字数过多时问题的解决
  • 商家地址与地图导航

    • 9-1小程序地图组件map的讲解
    • 9-2在地图上通过标记点显示饭店地址
    • 9-3点击地图上的标记点并携带数据
    • 9-4在地图上获取自己的当前位置和目的地经纬度
    • 9-5小程序里调起手机地图实现导航功能
    • 9-6解决用户拒绝位置授权没法导航的问题
    • 9-7实现电话拨打和微信复制的功能
  • 登录退出和缓存的学习

    • 翻新10-1-新版授权登录获取微信头像和昵称
    • 10-2-美化头像和昵称的布局
    • 10-3-退出登录功能的实现
    • 10-4-授权登录弹窗的实现
    • 10-5-实现授权弹窗里的布局
    • 10-6-新版授权登录和退出的功能实现
    • 10-7-借助缓存保持用户登录状态
    • 10-8-学习的一些注意事项
    • 10-9-上传头像添加用户到数据库
    • 10-10-解决注册用户时的问题
    • 10-11获取本地缓存和清空本地缓存
  • 个人中心的编写

    • 11-1源码的下载与导入注意事项
    • 11-2个人中心接入登录和退出的代码
    • 11-3个人中心条目布局的实现
    • 11-4图片箭头和css画的箭头对比
    • 11-5登录和退出显示不同的布局
    • 11-6在线客服和意见反馈
    • 11-7消除button按钮默认样式
    • 11-8手机上演示在线客服和意见反馈
  • 搜索页的编写

    • 12-1搜索页需求拆解
    • 12-2搜索页顶部搜索框的编写
    • 12-3搜索结果列表的编写
    • 12-4首页搜索词传递到搜索页并进行搜索
    • 12-5编写加减菜品的布局
    • 12-6加减菜品数量原理讲解
    • 12-7实现菜品购买数量的减少
  • 弹窗和总价

    • 13-1菜品列表页的实现
    • 13-2让购物车固定在底部
    • 13-3底部区域的布局编写
    • 13-4购物车按钮位置的摆放
    • 13-5实时的统计购物车的总价格和总数量
    • 13-6定义购物车数组存放购物车数据
    • 13-7添加购物车菜品数据到购物车里
    • 13-8减少购买菜品数量并同步到购物车数组
    • 13-9减少菜品的问题修复和灰色蒙层的实现
    • 13-10点餐小程序里实现购物车列表
    • 13-11点餐小程序里实现购物车的显示和隐藏
    • 13-12购物车列表里菜品样式的实现
    • 13-13把缓存里取到的购物车菜品数量同步到菜品列表
    • 13-14解决购物车添加数量不能同步的问题
    • 13-15解决删除某个菜品时数据错乱问题
    • 13-16解决总价和总数量没法同步的问题
    • 13-17实现清空购物车功能
    • 13-18删除购物车里的某一条菜品
  • 购物车页面的学习

    • 14-1新加购物车页面的准备工作
    • 14-2在底部导航栏里增加购物车页面
    • 14-3把菜品列表页改造成购物车列表页
    • 14-4改造加减菜品的代码
    • 14-5求总价和删除某条菜品
    • 14-6购物车为空时的页面显示
  • 确认订单页的学习

    • 15-1熟悉确认订单页里都有哪些内容
    • 15-2页面跳转和顶部标题的修改
    • 15-3从缓存里读取购物车菜品数据
    • 15-4把购买菜品数据显示到列表上
    • 15-5计算购买菜品的总价格和总件数
    • 15-6扫描桌号二维码的准备工作
    • 15-7调取扫一扫功能识别桌号二维码
    • 15-8用全局变量存扫描识别出的桌号
    • 15-9编写就餐人数的布局
    • 15-10就餐人数选择列表的样式美化
    • 15-11点击选中就餐人数的代码编写
    • 15-12提交订单前的校验工作
    • 15-13提交订单数据到订单数据库
    • 15-14获取用户点餐时的备注信息
    • 15-15提交订单后跳转页面和清空购物车
  • 我的订单页

    • 16-1添加我的订单页的入口
    • 16-2编写顶部导航栏的页面布局
    • 16-3顶部导航栏的点击选中
    • 16-4根据导航栏的不同请求不同状态的订单
    • 16-5把请求到的订单列表显示到页面上
    • 16-6订单列表里显示点了那些菜品
    • 16-7获取当前的下单时间并格式化
    • 16-8取消订单的页面布局和功能编写
    • 16-9编写去评价菜品的按钮样式
    • 16-10提交评价的准备工作
    • 16-11调取带输入框的弹窗
    • 16-12添加评价到数据库
  • 评价列表页

    • 17-1跳转到评价列表页
    • 17-2实现评价列表的顶部导航栏
    • 17-3获取我的评价数据和表权限讲解
    • 17-4编写云函数获取全部评价列表
    • 17-5编写评价列表的布局和样式
    • 17-6添加评价时间并显示在列表上
  • 管理员登陆和订单管理

    • 18-1创建管理员页面并添加入口
    • 18-2编写登陆页面的布局和样式
    • 18-3获取用户输入的账号和密码
    • 18-4管理员登陆功能的编写
    • 18-5登陆页面的代码优化
    • 18-6登陆成功以后切换到成功的页面
    • 18-7记录管理登陆状态方便管理订单
    • 18-8退出登陆功能的讲解
    • 18-9创建管理订单页面
    • 18-10通过云函数请求菜品订单数据
    • 18-11后厨人员管理订单功能的开发
  • 排号等位功能

    • 19-1选择就餐人数
    • 19-2实现客户端排号的页面
    • 19-3根据人数判断排号大桌或者小桌
    • 19-4排号等位原理的讲解
    • 19-5添加排号等位数据和更新数据
    • 19-6用当前的年月日作为排号数据的唯一标识
    • 19-7对代码进行优化减少冗余代码
    • 19-8获取当前用户排号的号码
    • 19-9大桌排号等位功能的实现
    • 19-10模拟管理员叫号
    • 19-11前情回顾和跳转到排号管理页
    • 19-12编写排号管理员页
    • 19-13请求排号数据并显示排号信息
    • 19-14小程序管理员端实现排号管理功能
    • 19-15用户排号更新数据时的问题解决
    • 19-16代码优化和用户openid的获取
  • 分类菜单

    • 20-1添加菜品分类页到导航栏
    • 20-2添加新的菜品分类和菜品
    • 20-3对菜品进行分类
    • 20-4改造菜品列表快速实现分类页的编写
    • 20-5修整分类页的布局样式
    • 20-6实现左侧分类和右侧菜品列表的联动
    • 20-7左侧分类变化时顶部标题跟着变
    • 20-8左右联动问题修复
  • 增加销量和模拟支付

    • 21-1新增知识点的前情提要
    • 21-2创建添加销量的云函数
    • 21-3增加单个菜品的销量
    • 21-4增加多个菜品的销量
    • 21-5模拟支付选择支付方式弹窗
    • 21-6打开和关闭弹窗的实现
    • 21-7模拟支付选择支付方式代码编写
    • 21-8完整实现模拟支付流程
播放页问题反馈
视频学习中有任何产品建议都可由此反
馈,我们将及时处理!

课时介绍

1-3点餐小程序购物车页面的演示

课程介绍

技术选型

1,前端

微信小程序原生框架

css

JavaScript

2,管理后台

云开发Cms内容管理系统

web网页

3,数据后台

小程序云开发

云函数

云数据库

云存储

 

1,小程序端

1-1,首页

首页有以下几个功能点

  1. 点餐
  2. 菜单浏览
  3. 排号等位
  4. 拨打电话
  5. 顶部轮播图
  6. 搜索菜品

这里点餐分两种

1,可以设置直接点餐

直接点餐:适合小型饭店,或者奶茶类的快餐店。直接就可以下单,不用识别桌号

2,也可设置扫码点餐

扫码点餐适合中大型饭店,可以区分桌号,方便管理

我后面会教大家如何生成桌号二维码,只需要把对应桌号的二维码贴在餐桌上,用户点击 扫码点餐 识别二维码,即可获取到桌号信息。

1-2,菜品浏览页

菜品浏览分两种

1,不带分类

适合菜品少的时候

2,带分类

菜品多的时候,带分类更方便客户选择

不带分类

 

带分类

 

1-3,搜索功能

我们这里搜索有两个触发方式

1,直接点击搜索图标

2,点击键盘上的搜索键

1-4,搜索结果,支持模糊查询

如我这里只搜‘鱼’,那么菜品中所有包含鱼的都可以搜索到

 

1-5,购物车

首先菜品列表页可以直接添加商品到购物车

购物车弹起后可以做如下操作

1,增删单个菜品

2,清空购物车

3,删除菜品

这些操作都和菜品列表是联动的,也就是菜品列表和购物车里增删个数,都是可以同步的。我会在项目预览章节的视频里做具体演示。

1-6,下单页

下单页就是确认订单后进行下单支付的。有以下功能

  • 1,点餐明细
  • 2,价格计算
  • 3,桌号地址
  • 4,就餐人数
  • 5,添加备注
  • 6,点击下单

1-7,支付页

支付页分两种方式

  • 1,模拟支付

适合前期学习,毕业设计等演示类的场景。

  • 2,真实微信支付

适合商用,但是使用微信支付必须要有营业执照,所以前期如果只是学习的话,建议使用模拟支付。

 

1-8,我的订单页

我的订单页分以下几个状态

  • 1,新下单待上餐
  • 2,已上餐待评价
  • 3,订单完成
  • 4,订单取消

1-9,提交评论页

我们可以对店家进行评论。

 

1-10,评价列表页

可以查看所有评价和自己的评价

 

1-11,排号等位

可以看出,我们可以选择就餐人数,排大桌或者小桌。我这里已排小桌为例

通过上图可以看出

  • 1,当前排号情况
  • 2,我的排号
  • 3,可以重新排号
  • 4,到号时会有到号提示

后面我会把订阅消息功能加进来,这样到号后会有订阅消息提示。

 

1-12,个人中心

个人中心分登录和未登录两种状态

未登录

已登录

 

1-13,微信授权登录小程序

 

2,后厨端和排号管理端

2-1,后厨端主要供后厨的厨师使用

  • 1,可以查看当前新下单
  • 2,完成后可以操作菜品完成
  • 3,可以监听用户新下单
  • 4,有新订单时会有语音提示
  • 5,厨师登录页

语音提示我会在视频课里具体演示

厨师登录页

 

厨师管理页

可以查看待制作订单

用户新下单后,会有语音提示

 

2-2,排号管理页

同样也有登录页,和上面厨师登录一样,这里重点看下排号管理页

管理员可以查看当前排号情况,可以叫号。

3,cms管理后台

我们这里的可视化网页后台使用的时云开发自带的cms(内容管理)

3-1,登录页

 

3-2,管理后台

我们可以在这里

 

  • 1,添加轮播图,删除轮播图,修改轮播图
  • 2,添加菜品,删除菜品,修改菜品,上架下架菜品
  • 3,管理订单
  • 4,查看评价
  • 5,管理后厨和排号管理员
  • 6,查看排号数据

 

 

比如我查询某个用户的所有订单

 

查询所有新下单还未上菜的订单

 

还有更多的功能,我会在视频课里给大家用视频来演示,这样更直观。

 

4,数据库

数据库我们这里用云开发自带的云数据库

餐厅管理员查看趋势图

推荐课程

信息系统项目管理师自考笔记

李明 · 710人在学

python从0到1:期货量化交易系统(CTP实战,高频及合成K线数据

王先生 · 22071人在学

手把手搭建Java超市管理系统【附源码】(毕设)

汤小洋 · 4198人在学

Java毕设springboot外卖点餐系统 毕业设计毕设源码 使用教

黄菊华 · 786人在学

基于SSM酒店管理系统(毕设)

小尼老师 · 837人在学

java项目实战之购物商城(java毕业设计)

Long · 5151人在学

手把手搭建Java求职招聘系统【附源码】(毕设)

汤小洋 · 1504人在学

Python Django 深度学习 小程序

钟翔 · 2315人在学

城管局门前三包管理系统+微信小程序(vue+springboot)

赖国荣 · 597人在学

Vue+Uni-app(uniapp)入门与实战+赠送仿美团点餐小程序

李杰 · 3979人在学

正在试验
后自动删除环境
课程实验
本次实验时间已到期 00:00:00

    订阅失败

    微信扫码点餐小程序 云开发cms网页管理后台后厨端订单数据库折线趋势图
    微信扫码点餐小程序 云开发cms网页管理后台后厨端订单数据库折线趋势图 ...

    订阅列表已满,请先移出部分订阅内容。

    当前章节需购买后观看
    开通超级会员免费看!专家精选系列课程,满足你从入门到精通!更有问答月卡免费送,你的问题有问必答!
    提交答案

    购买课程

    扫码完成付费,可继续学习全部课程内容

    加载中...
    课件正在飞速打包中,请耐心等待几秒钟~