Vue订餐系统

生活消费外卖案例ID：149368

友人A

2 年经验· 某二线直播公司

微信扫码沟通，客服可协助直接对接工程师；如当前档期不合，也可继续推荐相似案例作者。

案例介绍

该食堂订餐系统使用B/S结构。前端使用Vue+element-UI+vant-UI实现，页面简约且美观，后台管理端使用Node的express框架搭建，前端通过Axios请求后端的数据，后端使用Mongoose驱动连接MongoDB数据库。本人负责前后端所有开发。

（1）注册登录功能
用户输入账号和密码，通过与数据库的用户信息进行比对即可验证账号的真实性，登录后才能使用浏览店铺菜品，加入购物车等其他功能。
（2）收货地址管理
用户能够新增地址，通过输入收货人的名称、联系方式和收货地址完成新地址的添加，也可删除旧的收货地址信息。
（3）浏览店铺
用户登录后即可在首页查看所有接入的店铺，店铺按品种依次分类，并可根据综合、好评优先、销量优先查看排序后的店铺，进入店铺后可以浏览相应店铺的菜品信息。
（4）搜索店铺
可以根据自己的喜好，在首页搜索框输入店铺名称搜索自己心仪的店铺。
（5）加入购物车
在店铺查看到感兴趣有意愿的菜品，即可点击加入购物车，购物车中存放用户在当前店铺所选中的菜品，在购物车中可以更改数量，显示所有菜品的总金额，点击支付按钮即可进入支付操作。
（6）支付功能
对购物车中所选的菜品进行支付操作，支付前用户需要完善收货人信息，选择支付方式，完成支付操作，生成订单，最后跳转到订单页面。
（7）查看订单
在订单页面可以显示以往的订单信息，在订单数据中包含着订单的收货信息，订单的状态以及下单时间。
（8）取消订单
用户在规定时间内可以申请取消订单，规定时间之外不可进行取消申请。
（9）评论功能
用户可以对已到达的订单进行评论和打分操作，数据将会同步到所在店铺。