Java点餐系统和点餐小程序新加排号等位功能
最近忙着创业,好久没有写文章了。今天就抽空给点餐系统加一个排号等位功能,想加这个功能很久了,一直没有瞅到时间写。今天就把这个功能实现了,顺便写个文章出来。
老规矩,先给大家看效果图
只顾实现功能了,ui没怎么美化,后面有时间再做下ui美化吧。下面就来给大家讲解下。 讲之前,先给大家看一个简单的流程图。
流程其实很简单,就是客户端(小程序端)操作,点击排位。
然后Java后台,入库,并生成排位的号码,用户端可以看到自己当前排在第几号。
然后管理员在后台操作,排到位的客户可以入座。
等到号的用户,就会出现可入座的标识。后面会增加排到号的用户接受微信订阅消息通知的功能。敬请期待。
流程基本上讲完了,接下来就给大家讲解代码部分。这里只把重要的代码贴出来给到大家,顺便给大家讲下思路。后面也会录制完整的讲解视频:《点餐系统,java后台+点餐小程序》
一,小程序端代码
1,排号相关代码
我们先来讲讲排号相关的代码,从上图可以看出,我们排号的wxml文件里可以显示两种状态,未排号和已排号。上图展示的是未排号的状态,用户点击完取号以后,就可以展示已排号状态了。
其实排号的小程序端代码很简单。下面再把paihao.js的代码贴出来给到大家。
let app = getApp()
Page({
data: {
num: 1111, //当前排号
type: 1,
currentSmall: -1,
currentBig: -1
},
onShow: function () {
this.getNum()
},
//取号
quhao(event) {
let type = event.currentTarget.dataset.type
let that = this;
//如果openid不存在,就重新请求接口获取openid
var openid = app.globalData.openid;
if (openid === null || openid === undefined) {
app.getOpenid();
wx.showToast({ //这里提示失败原因
title: 'openid为空!',
duration: 1500
})
return;
}
wx.request({
url: app.globalData.baseUrl + '/paihao/quhao',
method: "POST",
header: {
"Content-Type": "application/x-www-form-urlencoded"
},
data: {
openid: openid,
type: type,
},
success(res) {
if (res && res.data && res.data.data) {
wx.showToast({
title: '排号成功',
})
console.log(res)
that.setData({
type: res.data.data.type,
num: res.data.data.num
})
}
},
fail(res) {
console.log("排号失败", res)
}
})
},
//查询我的排号
getNum() {
let that = this;
//如果openid不存在,就重新请求接口获取openid
var openid = app.globalData.openid;
if (openid === null || openid === undefined) {
app.getOpenid();
wx.showToast({ //这里提示失败原因
title: 'openid为空!',
duration: 1500
})
return;
}
wx.request({
url: app.globalData.baseUrl + '/paihao/getNum',
data: {
openid: openid
},
success: function (res) {
if (res && res.data && res.data.data) {
let dataList = res.data.data;
console.log("请求到的排号情况", dataList)
that.setData({
type: dataList.type,
num: dataList.num,
smallOkNum: dataList.smallOkNum,
bigOkNum: dataList.bigOkNum,
})
} else {
that.setData({
num: -1
})
}
},
fail(res) {
console.log("查询排号失败", res)
}
})
}
})
这里需要注意一点,就是一定要先获取用户的openid,因为openid是用户的唯一标识。每人每天只能排一次号。买我点餐系统这门课的同学,都知道如何获取openid,我课程配套的视频也有讲。
二,Java后台代码讲解
如果有仔细看上面第一步小程序端代码,应该可以看到wx.request网络请求部分,其实这个网络请求就是请求的我们Java后台。下面先把Java后台源码贴出来。
/**
* 小程序端排号相关接口
*/
@RestController
@RequestMapping("/paihao")
@Slf4j
public class WxPaihaoController {
@Autowired
PaihaoRepository repository;
/*
* 取号
* */
@PostMapping("/quhao")
public ResultVO quhao(@RequestParam(value = "type") Integer type,
@RequestParam("openid") String openid) {
int size = repository.findByDayAndType(TimeUtils.getYMD(), type).size();
log.info("当前排号数={}", size);
Paihao paihao = new Paihao();
paihao.setDay(TimeUtils.getYMD());
paihao.setNum(size + 1);
paihao.setType(type);
paihao.setOpenid(openid);
paihao.setRuzuo(false);
return ApiUtil.success(repository.save(paihao));
}
/*
* 查询当前排号
* */
@GetMapping("/getNum")
public ResultVO getNum(@RequestParam("openid") String openid) {
//获取当前小桌入座情况
List<Paihao> listSmall = repository.findByDayAndRuzuoAndTypeOrderByNum(TimeUtils.getYMD(), true, 0);
//获取当前大桌入座情况
List<Paihao> listBig = repository.findByDayAndRuzuoAndTypeOrderByNum(TimeUtils.getYMD(), true, 1);
//查询当前客户的排号情况
List<Paihao> listKeHu = repository.findByOpenidAndDay(openid,TimeUtils.getYMD());
//组装数据返回给小程序端
PaihaoVO paihao = new PaihaoVO();
if (listSmall != null && listSmall.size() > 0) {
paihao.setSmallOkNum(listSmall.get(listSmall.size() - 1).getNum());
} else {
paihao.setSmallOkNum(0);
}
if (listBig != null && listBig.size() > 0) {
paihao.setBigOkNum(listBig.get(listBig.size() - 1).getNum());
} else {
paihao.setBigOkNum(0);
}
if (listKeHu != null && listKeHu.size() > 0) {
paihao.setNum(listKeHu.get(listKeHu.size() - 1).getNum());
paihao.setType(listKeHu.get(listKeHu.size() - 1).getType());
} else {
paihao.setNum(0);
paihao.setType(0);
}
return ApiUtil.success(paihao);
}
}
可以看到我们一共给小程序前端提供两个接口,一个是取号,一个是查询当前排号状态。
1,先给大家讲讲取号
/*
* 取号
* */
@PostMapping("/quhao")
public ResultVO quhao(@RequestParam(value = "type") Integer type,
@RequestParam("openid") String openid) {
int size = repository.findByDayAndType(TimeUtils.getYMD(), type).size();
log.info("当前排号数={}", size);
Paihao paihao = new Paihao();
paihao.setDay(TimeUtils.getYMD());
paihao.setNum(size + 1);
paihao.setType(type);
paihao.setOpenid(openid);
paihao.setRuzuo(false);
return ApiUtil.success(repository.save(paihao));
}
取号其实很简单,就是先查询当前已经排到第几号,然后新排号的客户号码再前面排号的基础上加一。然后数据入库就可以了。
2,再给大家讲下排号状态查询。
@GetMapping("/getNum")
public ResultVO getNum(@RequestParam("openid") String openid) {
//获取当前小桌入座情况
List<Paihao> listSmall = repository.findByDayAndRuzuoAndTypeOrderByNum(TimeUtils.getYMD(), true, 0);
//获取当前大桌入座情况
List<Paihao> listBig = repository.findByDayAndRuzuoAndTypeOrderByNum(TimeUtils.getYMD(), true, 1);
//查询当前客户的排号情况
List<Paihao> listKeHu = repository.findByOpenidAndDay(openid,TimeUtils.getYMD());
//组装数据返回给小程序端
PaihaoVO paihao = new PaihaoVO();
if (listSmall != null && listSmall.size() > 0) {
paihao.setSmallOkNum(listSmall.get(listSmall.size() - 1).getNum());
} else {
paihao.setSmallOkNum(0);
}
if (listBig != null && listBig.size() > 0) {
paihao.setBigOkNum(listBig.get(listBig.size() - 1).getNum());
} else {
paihao.setBigOkNum(0);
}
if (listKeHu != null && listKeHu.size() > 0) {
paihao.setNum(listKeHu.get(listKeHu.size() - 1).getNum());
paihao.setType(listKeHu.get(listKeHu.size() - 1).getType());
} else {
paihao.setNum(0);
paihao.setType(0);
}
return ApiUtil.success(paihao);
}
这一步稍微复杂一点。这一步的主要就是给小程序端返回所需的数据,比如当前大桌排到了第几号,小桌排到了第几号,当前用户的排号,当前用户是否被叫到。代码里注释都很清楚了,感兴趣的同学仔细看下上面代码即可。
3,管理员端
管理员就是用来操作谁可以入座的。
这个页面主要是用freemarker写的前端页面。代码如下图。
对应的后台接口。
/**
* 排号相关
*/
@Controller
@RequestMapping("/adminPaihao")
@Slf4j
public class AdminPaihaoController {
@Autowired
PaihaoRepository repository;
/*
* 页面相关
* */
@GetMapping("/list")
public String list(ModelMap map) {
//获取小桌未入座的用户
List<Paihao> listSmall = repository.findByDayAndRuzuoAndTypeOrderByNum(TimeUtils.getYMD(), false, 0);
//获取大桌未入座的用户
List<Paihao> listBig = repository.findByDayAndRuzuoAndTypeOrderByNum(TimeUtils.getYMD(), false, 1);
map.put("listSmall", listSmall);
map.put("listBig", listBig);
return "paihao/list";
}
@GetMapping("/ruzhuo")
public String ruzhuo(@RequestParam("id") int id, ModelMap map) {
try {
Paihao paihao = repository.findById(id).orElse(null);
if (paihao == null) {
throw new DianCanException(ResultEnum.PAIHAO_NOT_EXIST);
}
if (paihao.getRuzuo()) {
throw new DianCanException(ResultEnum.PAIHAO_STATUS_ERROR);
}
paihao.setRuzuo(true);
repository.save(paihao);
} catch (DianCanException e) {
map.put("msg", e.getMessage());
map.put("url", "/diancan/adminPaihao/list");
return "zujian/error";
}
map.put("url", "/diancan/adminPaihao/list");
return "zujian/success";
}
}
管理页对应的代码很简单,就是一个显示当前排号数据列表,另外一个就是操作到号用户入座,后面还会添加到号后微信订阅消息通知相应用户的功能。
- 在silverlight中利用socket发送图片或文件
- 多线程中的ManualResetEvent
- 进程与线程
- ASP.NET TreeView相关问题
- 温故而知新:WinForm/Silverlight多线程编程中如何更新UI控件的值
- ASP.Net Web Page深入探讨
- 用Design+Blend轻松制作环形文字
- 对asp.net响应事件的试验
- 为服务器控件加入客户端事件处理的几种方法
- 温故而知新:Delegate,Action,Func,匿名方法,匿名委托,事件
- 如何在Silverlight4中使用摄像头
- Flask的集中控制
- 64位IIS(IIS6/IIS7)上跑Asp + Jet.Oledb的设置要点
- windows 2003 32位系统能支持的最大内存数
- java教程
- Java快速入门
- Java 开发环境配置
- Java基本语法
- Java 对象和类
- Java 基本数据类型
- Java 变量类型
- Java 修饰符
- Java 运算符
- Java 循环结构
- Java 分支结构
- Java Number类
- Java Character类
- Java String类
- Java StringBuffer和StringBuilder类
- Java 数组
- Java 日期时间
- Java 正则表达式
- Java 方法
- Java 流(Stream)、文件(File)和IO
- Java 异常处理
- Java 继承
- Java 重写(Override)与重载(Overload)
- Java 多态
- Java 抽象类
- Java 封装
- Java 接口
- Java 包(package)
- Java 数据结构
- Java 集合框架
- Java 泛型
- Java 序列化
- Java 网络编程
- Java 发送邮件
- Java 多线程编程
- Java Applet基础
- Java 文档注释
- 为什么 React Hooks useState 更新不符预期?
- 技术分享 | MySQL 使用 MariaDB 审计插件
- 第12期:压缩表性能监测
- 第05期:使用 prometheus 监控 clickhouse 集群
- 这 6 点知识让我对 JavaScript 的对象有了更进一步的了解
- Linux进程间通信(中)之信号、信号量实践
- Linux进程间通信(下)之共享内存实践
- 手把手教你快速使用Vmware虚拟机安装Linux操作系统实验环境
- 天啊!鹅厂都开始做开发板了?网红腾讯物联网开发板终极开箱评测,让我们一睹为快!
- 我用 React 和 Vue 构建了同款应用,来看看哪里不一样(2020 版)
- 大点干!早点散----------深入剖析Redis集群原理与实验
- 微信群总是有人发广告?看我用Python写一个自动化机器人消灭他!
- 苏宁基于 ClickHouse 的大数据全链路监控实践
- CORS Cross Origin Resource Sharing
- 从0开始做播放器-第二季-第2章-Android NDK 工程的建立和 JNI 的基本用法