java车辆充电桩springbootvueweb

第四章 系统功能的具体实现

一、技术路线：

开发语言：Java

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

数据库：MySQL 5.7

数据库管理工具：Navicat或sqlyog

开发工具：IDEA或Ecplise

二、项目介绍：

三、运行截图：

3.1 前台功能模块

3.1.1 首页功能

车辆充电桩管理系统，用户进入到系统首页，可以查看首页、充电桩、充电常识、个人中心、后台管理等内容进行操作，如图3-1所示。

图3-1系统首页界面图

用户注册；在用户注册页面中输入用户账号、用户姓名、密码、确认密码、年龄、联系电话等内容进行用户注册操作；如图3-2所示。

图3-2用户注册界面图

充电桩；在充电桩页面中可以查看电桩编号、充电桩类别、输入电压、输出功率、使用方式、所处位置、每时单价、注意事项、图片、地图等内容；并进行报修或收藏操作；如图3-3所示。

图3-3充电桩界面图

个人中心；在个人中心页面中输入用户账号、用户姓名、密码、性别、年龄、联系电话等内容进行更新信息，并可以根据需要对我的收藏进行详细的操作管理，如图3-4所示。

图3-4个人中心界面图

3.1.2 用户后台管理

用户登录进入车辆充电桩管理系统可以对首页、个人中心、充电桩报修管理、维修回复管理等功能进行详细操作，如图3-5所示。

图3-5用户功能界面图

充电桩报修管理；在充电桩报修管理页面中可以查看索引、电桩编号、电桩类别、图片、气息位置、用户账号、用户姓名、报修时间等内容，并进行详情，修改和删除等操作；如图3-6所示。

图3-6充电桩报修管理界面图

3.2 后台功能模块

管理员和维修员登录，通过填写注册时输入的用户名、密码、选择角色等信息进行登录操作，如图3-7所示。

图3-7后台登录界面图

3.2.1 管理员功能

管理员登录进入车辆充电桩管理系统可以查看首页、个人中心、维修员管理、用户管理、电桩类别管理、充电桩管理、充电桩报修管理、维修回复管理、系统管理等功能进行详细操作，如图3-8所示。

图3-8管理员功能界面图

维修员管理；在维修员管理页面中可以查看索索引、维修工号、维修姓名、性别、联系电话、身份证、家庭住址等内容，并进行详情，修改和删除等操作；如图3-9所示。

图3-9维修员管理界面图

用户管理；在用户管理页面中可以查看索引、用户账号、用户姓名、性别、年龄、联系电话等内容，并进行详情，修改和删除等操作；如图3-10所示。

图3-10用户管理界面图

电桩类别管理；在电桩类别管理页面中可以查看索引、电桩类别等内容，并进行详情，修改和删除等操作；如图3-11所示。

图3-11电桩类别管理界面图

充电桩管理；在充电桩管理页面中可以查看索引、电桩编号、电桩类别、图片、输入电压、输出功率、所处位置、每时单价等内容，并进行详情，修改和删除等操作；如图3-12所示。

图3-12充电桩管理界面图

充电桩报修管理；在充电桩报修管理页面中可以查看索引、电桩编号、电桩类别、图片、所处位置、用户账号、用户姓名、报修时间等内容，并进行详情，修改和删除等操作；如图3-13所示。

图3-13充电桩报修管理界面图

维修回复管理；在维修回复管理页面中可以查看索引、电桩编号、电桩类别、图片、所处位置、用户账号、用户姓名、登记时间、维修工号、维修姓名、维修状态等内容，并进行详情，修改和删除等操作；如图3-14所示。

图3-14维修回复管理界面图

系统管理；在充电常识页面中可以查看索引，标题，图片等内容，并进行详情，修改和删除等操作；还可以对轮播图管理进行详细操作；如图3-15所示。

图3-15系统管理界面图

3.2.2 维修员功能

维修员登录进入车辆充电桩管理系统可以查看首页、个人中心、充电桩报修管理、维修回复管理等功能进行详细操作，如图3-16所示。

图3-16维修员功能界面图

充电桩报修管理；在充电桩报修管理页面中可以查看索引、电桩编号、电桩类别、图片、所处位置、用户账号、用户姓名、报修时间等内容，并进行详情或维修回复等操作；如图3-17所示。

图3-17充电桩报修管理界面图

维修回复管理；在维修回复管理页面中可以查看索引、电桩编号、电桩类别、图片、所处位置、用户账号、用户姓名、登记时间、维修工号、维修姓名、维修状态等内容，并进行详情，修改和删除等操作；如图3-18所示。

图3-18维修回复管理界面图