基于JavaScript的餐厅点餐系统微信小程序的设计与实现

Posted 2022-03-08 XiaoLin__Java

摘要

随着都市的快速发展，人们的生活节奏在不断加快，时间观念在不断增强，对效率也有了更高追求。类似的，人们在就餐方面也希望能够节省时间，将大家对新式就餐概念和微信小程序这个新发展事物结合在一起就产生了餐厅点餐小程序。
该系统主要由两个部分组成，分别是前端的点餐小程序和后台的点餐管理系统。前端主要使用的技术有javascript和css3以及微信小程序自带框架，后台管理主要用到Spring-boot框架技术。
其中小程序中的排队预约座位功能相较于传统的点餐小程序是一个较新的功能，可以实现预约座位的功能，有了这个功能，顾客到店可以直接入座，有更好的就餐体验。结构分明，功能实用，界面简介是这个点餐系统的主要优点。

需求分析

系统功能需求分析

点餐小程序部分

登录功能

顾客进入小程序我的页面，点击微信授权登录。

个人信息功能

完成登录后顾客填写个人信息，首次填写个人信息并提交后，第二次进入可进行个人信息修改操作；本信息栏为顾客必填选项，以方便后续使用小程序进行点餐操作。

首页轮播图功能

进入点餐程序首页，映入眼帘的是本餐厅后台系统操作的宣传轮播图。

搜索菜品功能

顾客可以用首页的搜索框搜索相关菜品，只需要输入关键字就可以达到操作目的。

扫码功能

顾客来到餐厅就餐，可以扫空座位桌角的二维码就座点餐。

排号等位功能

可以用此功能向餐厅预订座位，在可以就座时后台系统会传递信息到小程序端提醒客人就座。

菜品分类功能

对菜品进行早中晚餐招牌菜等等的分类。

购物车菜品的增减功能

顾客在购物车模块，可以对购物车内的菜品进行增减和清空等操作。

催单功能

顾客可以通过小程序向餐厅后台传递催单信息。

评论功能

顾客就餐后可以对菜品进行评论。

餐厅后台管理系统部分

登录功能

管理员登录：使用系统初始设置的账号密码，登录到餐厅后台管理系统；
非管理员登录：使用管理员设置的专属账号密码，登录进系统。

设置餐厅管理系统人员

管理员可以在这里修改或设置新的系统管理人员，有两种角色设置，分别是管理员角色和员工角色，新设置的角色有自己全新独立的账户密码，均可登录系统，唯一区别在于登录系统后，员工角色没有权限访问此页面。

排号管理功能

在接收到顾客小程序端传输的排号请求时，可以在此响应请求，邀请顾客就座。

菜品订单功能

这里记录所有通过小程序点餐的顾客订单，查看订单详情，接受或者取消订单，已取消的订单可进行删除，还可以将所以订单导出到Excel表格。

菜品管理功能

管理员可以跟据厨房库存对菜品进行管理操作，修改菜品信息，下架、删除菜品，添加单个或者批量导入菜品，也可以将菜品信息导出到Excel表格。

菜品分类管理功能

将菜品分为几个不同的类别，早中晚餐，招牌菜等，与小程序端相对应，也可对菜品类别进行添加或删除的操作。

轮播图页管理功能

这里可以将所选图片在小程序端轮播。

退出登录功能

完成一系列操作后，管理员可以退出点餐系统后台。

系统用户需求

管理员

管理员进入点餐后台管理系统，在统计信息模块可以看到店铺的月收入及年收入；在餐厅人员模块，可以修改管理员登录信息，添加管理员或者员工，当以员工身份登录后台系统时，将没有权限访问此页面；在排号管理模块可以安排预约座位的顾客就座；在菜品订单模块，可以看到所有顾客的订单请求，进行确认或者取消订单的操作，已取消的订单可将其从列表中移除，还能将所有订单导出到Excel表格中，在菜品管理模块，可以单个或批量添加菜品，修改菜品的信息，对菜品进行下架、删除等操作；在菜品类目模块，可以对菜品进行分类；在轮播图模块，可以设置展示在小程序端首页的轮播图，用于菜品推广宣传等；以及最后的退出系统操作。

顾客

顾客进入点餐小程序，先微信授权登录；扫桌角二维码就座；排号等位预约座位；点击首页的菜单浏览，进入菜单，浏览搜寻自己想要的菜品；根据菜品分类，挑选想要的类别菜品；搜索框快速找到菜品；购物车模块，对购物车中菜品进行增减处理，对购物车的菜品进行提交订单和结算操作；我的模块，可以查看、修改个人信息；点击我的订单可以查看待上餐、已取消、待评价和已完成的订单；查看我的排号状态。

部分运行截图

获取方式

Gitee仓库