计算机毕业设计 257的共享充电宝管理系统vue 毕设

第5章系统详细设计

一、技术路线：

开发语言：Java

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

数据库：MySQL 5.7

数据库管理工具：Navicat或sqlyog

开发工具：IDEA或Ecplise

二、项目介绍：

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

三、运行截图：

5.1管理员功能模块

管理员登录，通过填写用户名、密码、角色等信息，输入完成后选择登录即可进入共享充电宝管理系统，如图5-1所示。

图5-1管理员登录界面图

管理员登录进入共享充电宝管理系统可以查看首页、个人中心、用户管理、维护人员管理、区域信息管理、合作商户管理、充电宝投放管理、租赁订单管理、归还订单管理、费用订单管理、充电宝维护管理、公告栏管理、系统管理等内容，如图5-2所示。

图5-2管理员功能界面图

用户管理，在用户管理页面可以查看用户账号、密码、用户姓名、性别、年龄、头像、用户手机等信息，并可根据需要对用户管理进行详情，修改，删除或查看详细内容等操作，如图5-3所示。

图5-3用户管理界面图

维护人员管理，在维护人员管理页面可以查看人员账号、人员姓名、性别、年龄、照片、联系方式、维护区域等信息，并可根据需要对维护人员管理进行详情，修改、删除或查看详细内容等操作，如图5-4所示。

图5-4维护人员管理界面图

合作商户管理，在合作商户管理页面可以查看商户编号、商户名称、区域、详细地址、联系人、联系方式、商户图片等信息，并可根据需要对合作商户管理进行详情，修改、删除或查看详细内容操作，如图5-5所示。

图5-5合作商户管理界面图

租赁订单管理，在租赁订单管理页面可以查看租赁编号、充电宝编号、图片、区域、商户编号、商户名称、每小时费用、开始时间、用户账号、用户姓名、用户手机等内容，并可根据需要对租赁订单管理进行查看详情，修改，删除或查看详细内容等操作，如图5-6所示。

图5-6租赁订单管理界面图

充电宝维护管理，在充电宝维护管理页面可以查看充电宝编号、商户编号、商户名称、图片、区域、品牌、故障描述、处理结果、处理时间、人员账号、人员姓名等信息，并可根据需要对充电宝维护管理进行详情，修改、删除或查看详细内容等操作，如图5-7所示。

图5-7充电宝维护管理界面图

公告栏管理，在公告栏管理页面可以查看公告标题、封面图片、发布日期、发布人等内容，并可根据需要对公告栏管理进行详情，修改，删除和查看详细内容等操作，如图5-8所示。

图5-8公告栏管理界面图

5.2用户功能模块

用户登录，用户通过填写用户名、密码、角色等信息，输入完成后选择登录即可进入共享充电宝管理系统，如图5-9所示。

图5-9用户登录界面图

用户登录进入共享充电宝管理系统可以查看首页、个人中心、租赁订单管理、归还订单管理、费用订单管理等内容，如图5-10所示。

图5-10用户功能界面图

租赁订单管理，在租赁订单管理页面可以查看租赁编号、充电宝编号、图片、区域、商户编号、商户名称、每小时费用、开始时间、用户账号、用户姓名、用户手机等详细进行详情、删除，如图5-11所示。

图5-11租赁订单管理界面图

5.3维护人员功能模块

维护人员登录，维护人员通过填写用户名、密码、角色等信息，输入完成后选择登录即可进入共享充电宝管理系统，如图5-12所示。

图5-12维护人员登录界面图

维护人员登录进入共享充电宝管理系统可以查看首页、个人中心、充电宝投放管理、租赁订单管理、归还订单管理、费用订单管理、充电宝维护管理等内容，如图5-13所示。

图5-13维护人员功能界面图

充电宝维护管理，在充电宝维护管理页面通过查看充电宝编号、商户编号、商户名称、图片、区域、品牌、故障描述、处理结果、处理时间、人员账号、人员姓名等信息，并可根据需要对充电宝维护管理进行详情、修改、删除，如图5-14所示。

图5-14充电宝维护管理界面图

5.4前台首页功能模块

共享充电宝管理系统，在系统首页可以查看首页、合作商户、充电宝投放、公告栏、个人中心、后台管理等内容，如图5-15所示。

图5-15系统功能界面图

用户登录、用户注册，通过输入用户账号、密码、用户姓名、性别、手机号码等信息进行登录、注册，如图5-16所示。

图5-16用户登录、用户注册界面图

充电宝投放，在充电宝投放进行查看充电宝编号、商户编号、详细地址、品牌、区域、每小时费用、剩余电量、投放时间等信息进行租赁如图5-17所示。

图5-17充电宝投放界面图

公告栏，在公告栏页面可以查看公告标题、发布日期、发布人等内容进行评论，如图5-18所示。

图5-18公告栏界面图