计算机毕业设计 297的vue前台美食点菜订餐系统vue 毕设

5系统界面实现

一、技术路线：

开发语言：Java

前端技术：JavaScript、VUE.js（2.X）、css3

数据库：MySQL 5.7

数据库管理工具：Navicat或sqlyog

开发工具：IDEA或Ecplise

二、项目介绍：

https://www.bilibili.com/video/BV1hG411i7Nz/

三、运行截图：

3.1 登录

管理员输入个人的账号、密码和角色登录系统，这时候系统的数据库就会在进行查找相关的信息，如果我们输入的账号、密码和角色不正确，数据库就会提示出错误的信息提示，同时会提示管理员重新输入自己的账号、密码、角色，直到账号密码输入成功后，会提登录成功的信息。网站管理员登录效果图如图3-1所示：

图3-1管理员登录界面

3.2 管理员功能模块

3.2.1 用户管理

管理员对用户管理进行编辑填写账号、密码、姓名、性别、年龄、手机、邮箱、照片并进行详情、删除、修改等操作。用户管理界面图如下图3-2所示:

图3-2用户管理界面图

3.2.2 美食菜系管理

管理员对美食菜系管理进行菜系等操作并可以进行详情、删除、修改操作。美食菜系管理界面如下图3-3所示：

图3-3美食菜系管理界面

3.2.3 美食菜品管理

管理员对美食菜品管理进行美食、菜系、图片、分量、食材、价格、单限、库存等信息操作并可以进行详情、删除、修改操作。美食菜品管理界面如下图3-4所示：

图3-4美食菜品管理界面

3.2.4 美食评分管理

美食评分管理；管理员对图书入库管理进行填写账号、姓名、订单号、配送费、包装分、菜品分、日期等进行详情、删除、修改操作。美食评分管理图如下图3-5所示：

图3-5美食评分管理界面

3.2.5轮播图管理

轮播图；该页面为轮播图管理界面。管理员可以在此页面进行首页轮播图的管理，通过新建操作可在轮播图中加入新的图片，还可以对以上传的图片进行修改操作，以及图片的删除操作。轮播图管理界面如下图3-6所示：

图3-6轮播图管理界面

3.2.6美食资讯管理

管理员对美食资讯管理进行标题、简介、图片、内容信息等操作。美食资讯界面如下图3-7所示：

图3-7美食资讯管理界面

3.3 前台首页功能模块

前台首页详情页面：首页、美食菜品、美食资讯、个人中心、后台管理、购物车、在线客服功能操作。效果图如下图3-9所示：

图3-9前台首页功能界面

3.3.1 登录、用户注册

用户在线填写账号、密码、姓名、性别、年龄、手机、邮箱、等信息进行注册、登录操作。效果图如下图3-10所示：

图3-10登录、用户注册界面

3.3.2菜品信息

用户进入菜品信息可以填写价格、单次购买、库存、菜系、分量、食材、点击次数等信息，并可以进行添加购物车、立即购买操作。程序效果图如下图3-11所示：

图3-11菜品信息界面

3.4 用户功能模块

3.3.1美食评分管理

用户进入美食评分管理可以查看账号、姓名、订单号、配送费、包装分、菜品分、日期等操作。程序效果图如下图3-13所示：

图3-13美食评分管理界面

3.3.2订单管理

用户进入订单管理可以填写订单编号、商品名称、商品图片、购买数量、价格/积分、折扣价格、总价格/总积分、折扣总价格、支付类型、状态、地址并可以进行详情等操作。程序效果图如下图3-14所示：

图3-14订单管理界面