基于springboot的订餐管理系统 3、开发语言：java语言 后台：springboot框架 前端vue框架 4、开发软件：idea或eclpise， HBuilder X 5、数据库：mysql 6、软件还是网页：网页 7 、实现功能: 功能如下（常规需求）： 后台： 1.登录 注册（相当于员工账号注册） 2.菜品管理：菜品新增 修改 删除 下架 3.桌位管理：添加新桌 信息修改 删除 查询 4.销售热榜管理：菜品新增 修改 删除 下架 查询 5.店家推荐管理：菜品新增 修改 删除 下架 查询 6.类别管理：菜品新增 修改 删除 下架 店家推荐和销售热榜也相当于类别管理 7.订单管理：可以操作用户下的订单进行修改状态，以及根据消息提醒对菜品进行操作（如删除 或修改）。可以查看以往订单

前台： 订单查看 能查看到自己都点了哪些菜 可以像后台发起退菜申请 换菜申请 最后实现结算 3.菜品搜索：名字搜，模糊查询 4.菜品一览： 展示菜品的基本信息（名字 图片 价格 销售量 大小规格可选择） 能将需要的菜加入购物车 5.销售热榜 ：展示菜品的基本信息（名字 图片 价格 销售量 大小规格可选择） 能将需要的菜加入购物车 6.店家推荐 ：展示菜品的基本信息（名字 图片 价格 销售量 大小规格可选择） 能将需要的菜加入购物车 7.菜品分类： 展示菜品的基本信息（名字 图片 价格 销售量 大小规格可选择） 能将需要的菜加入购物车。

管理员端

开发语言：Java；数据库：MySQL8；系统架构：B/S；后端：SpringBoot；前端：Vue；工具：IDEA，JDK1.8，Maven

登录在线 选课系统需要输入账号 和密码 并且选用登录角色,验证通过才能成功进入系统;系统前台根据返回结果匹配显示到对应角色可操作的菜单.

图1 登录页面

开发语言：登录页面为login.vue;管理员角色为系统初始化角色;用来管理维护系统;输入账号密码选择对应角色;点击登录;触发点击事件;根据url: `${this.tableName}/login?username=${this.rulesForm.username}&password=${this.rulesForm.password}携带参数访问到usercontroller的login方法执行登录验证;验证通过code值为0;页面跳转到index

1,用户管理实现

图1 用户管理

功能实现：Yonghu文件夹下的list.vue页面;管理员可以在此功能进行修改,增加,删除等操作;点击创建按钮弹出编辑窗口填写信息点击确定; add-or-update.vue为新增用户和修改用户的页面；前端会根据访问路径url: "yonghu/page"访问到YonghuController类的page方法查询到所有的用户信息；通过工具类PageUtils进行分页处理，以R.ok().put("data", page)的形式返回到页面 进行赋值遍历显示；新增则会访问到YonghuController类的save方法经行数据持久化操作到yonghu数据表；修改则会访问到update方法进行修改保存逻辑；删除会访问到delete方法进行物理删除。

2,菜品分类管理

图2 菜品分类管理

功能实现：caipinfenlei文件夹下的list.vue页面;管理员可以在此功能进行修改,增加,删除等操作; add-or-update.vue为新增菜品分类和修改菜品分类的页面；前端会根据访问路径url: " caipinfenlei/page"访问到CaipinfenleiController类的page方法查询到所有的商品分类信息；通过工具类PageUtils进行分页处理，以R.ok().put("data", page)的形式返回到页面 进行赋值遍历显示；新增则会访问到CaipinfenleiController类的save方法经行数据持久化操作到Caipinfenlei数据表；修改则会访问到update方法进行修改保存逻辑; ；删除会访问到delete方法进行物理删除。

3,菜品信息管理

图3 菜品信息管理

功能实现：caipinxinxi文件夹下的list.vue页面;管理员可以在此功能进行修改,增加,删除等操作; add-or-update.vue为新增菜品和修改菜品信息的页面；前端会根据访问路径url: "caipinxinxi/page"访问到CaipinxinxiController类的page方法查询到所有的商品信息；通过工具类PageUtils进行分页处理，以R.ok().put("data", page)的形式返回到页面 进行赋值遍历显示；新增则会访问到CaipinxinxiController类的save方法经行数据持久化操作到caipinxinxi数据表；修改则会访问到update方法进行修改保存逻辑; ；删除会访问到delete方法进行物理删除。

4,餐桌管理

图4 餐桌管理

功能实现：canzhuo文件夹下的list.vue页面;管理员可以在此功能进行修改,增加,删除等操作; add-or-update.vue为新增餐桌和修改餐桌的页面；前端会根据访问路径url: " canzhuo/page"访问到CanzhuoController类的page方法查询到所有的餐桌信息；通过工具类PageUtils进行分页处理，以R.ok().put("data", page)的形式返回到页面 进行赋值遍历显示；新增则会访问到CanzhuoController类的save方法经行数据持久化操作到canzhuo数据表；修改则会访问到update方法进行修改保存逻辑; ；删除会访问到delete方法进行物理删除。

5,菜品订单管理

图5 菜品订单

功能实现：caipindingdan文件夹下的list.vue页面;管理员可以在此功能进行修改,增加,删除等操作; add-or-update.vue为修改订单的页面；前端会根据访问路径url: " caipindingdan/page"访问到CaipindingdanController类的page方法查询到所有的菜品订单信息；通过工具类PageUtils进行分页处理，以R.ok().put("data", page)的形式返回到页面 进行赋值遍历显示；新增则会访问到修改则会访问到update方法进行修改保存逻辑; ；删除会访问到delete方法进行物理删除。

6,菜品评价管理

图6 菜品评价

功能实现：caipinpingjia文件夹下的list.vue页面;管理员可以在此功能进行修改,增加,删除等操作;前端会根据访问路径url: " caipinpingjia/page"访问到CaipinpingjiaController类的page方法查询到所有的菜品评价信息；通过工具类PageUtils进行分页处理，以R.ok().put("data", page)的形式返回到页面 进行赋值遍历显示。

7,菜品资讯

图7 菜品资讯

功能实现news文件夹下的list.vue页面;管理员可以在此功能进行修改,增加,删除等操作; add-or-update.vue为新增新增菜品资讯和修改菜品资讯的页面；前端会根据访问路径url: " news/page"访问到newsController类的page方法查询到所有的菜品资讯信息。

7,轮播图管理

图8 轮播图管理

功能实现config文件夹下的list.vue页面;管理员可以在此功能进行修改,增加,删除等操作; add-or-update.vue为新增新增轮播图和修改轮播图信息的页面；前端会根据访问路径url: " config/page"访问到configController类的page方法查询到所有的菜品资讯信息；通过工具类PageUtils进行分页处理，以R.ok().put("data", page)的形式返回到页面 进行赋值遍历显示；新增则会访问到configController类的save方法经行数据持久化操作到config数据表；修改则会访问到update方法进行修改保存逻辑; ；删除会访问到delete方法进行物理删除。

4.6 用户页面实现

1,前端登录页面

图1登录页面

图2注册页面

功能实现：login.html为前台用户登录页面; register.html为新用户注册页面;当新用户需要进行下单点餐时需要注册账号;输入注册信息点击注册;触发点击事件通过http.requestJson(tablename + '/register', 'post', data, function(res)访问到yonghuController的register方法;进行数据保存时会先根据用户名查询是否存在相同用户,反之则注册成功;code状态返回为0;

登录时需要输入账号密码,点击登录通过http.request(data.role + '/login', 'get', data, function(res)访问到yonghuController的login方法;根据参数账号和密码查询数据库是否存在该用户;登录成功code返回为0,跳转到index.html页面;用户可以进行下单购买操作。

2.菜品信息预览及下单

图3前台菜品信息页面

图4详情页面

功能实现：caipinxinxi文件夹下的list.html为前台菜品详情页;进入会默认通过http.request('caipinxinxi/list','get',param,function(res)访问到CaipinxinxiController的list的方法查询上架的所有的菜品信息;以return R.ok().put("data", page);形式返回到页面进行遍历显示菜品信息;当用户点击 菜品是通过@click="jump('../caipinxinxi/detail.html?id='+item.id)携带菜品id跳转到详情detail.html页面;访问caipinxinxiController的info方法根据参数id查询菜品详情信息返回给页面进行显示。

在详情页面用户点击下单进行跨表操作; 通过http.requestJson('caipinxinxi' + '/add', 'post', data, function(res) 访问到caipindingdanController的add方法把用户信息和 订单信息持久化保存到caipindingdan数据表中; caipindingdan.setStatus("已下单")代表下单操作;code返回为0代表下单成功;

在详情页面用户点击加入购物车进行跨表操作; 通过http.requestJson('caipinxinxi' + '/add', 'post', data, function(res) 访问到caipindingdanController的add方法把用户信息和订单信息持久化保存到caipindingdan数据表中; caipindingdan.setStatus("加入购物车")表示加入购车;code返回为0加入购车成功;

3,菜品资讯

图3 菜品资讯

功能实现：功能实现：news文件夹下的list.html为前台菜品详情页;进入会默认通过http.request(news/list','get',param,function(res)访问到CaipinxinxiController的list的方法查询发布的所有的菜品资讯信息;以return R.ok().put("data", page);形式返回到页面进行遍历显示菜品信息;当用户点击 菜品是通过@click="jump('../news/detail.html?id='+item.id)携带菜品id跳转到详情detail.html页面;访问newsController的info方法根据参数id查询菜品资讯详情信息返回给页面进行显示。

4,个人中心

图4 个人中心

功能实现：点击个人中心会根据url: '../' + localStorage.getItem('userTable') + '/center.html'跳转到/center.html页面,用户可以在此功能修改个人信息，编辑信息后点击更新信息通过http.requestJson(table + '/update', 'post', data, function(res) 携带参数访问到YonghuController的update方法根据 id进行用户信息更新保存操作；保存成功 code值为0。