1 项目介绍
奥博羽毛球俱乐部管理系统本质上是一个羽毛球俱乐部教学培训浏览和在线预约的平台,从用户角度,系统包括会员、教练和管理员。
2、项目技术
项目后端框架:Java+ssm
项目前端框架:vue2,ssm
3、开发环境
springboot环境说明:
环境说明:
开发语言:java
框架: springboot, vue
JDK版本:JDK1.8
数据库:mysql 5.7+ (推荐5.7,8.0也可以)
数据库工具:Navicat11+
开发软件:idea/eclipse (推荐idea)
Maven包:Maven3.3.9+
4 系统特点
在这个高速开展的互联网时代,任何事物都追求效率。相比较传统管理来说,奥博羽毛球俱乐部管理系统的操作快捷易懂。简化了用户消费的步骤,尤其是能够在线上预定,减少用户等候、查找场地的时间,提高用户的使用感受,为羽毛球俱乐部教学培训节约人力资源和工作效率,也便是能够服务更多的客户取得利润。
5.2 后台功能实现
5.2.1管理员登录
使用脚本把数据库导入到mysql中,配置tomcat服务器,运行程序。其中用户登录的界面如下所示。
图5.1 管理员登录
用户密码是通过MD5进行加密的。MD5本身是一个不可逆的加密方法,所以在查询前需要对密码进行MD5加密,把加密后的字符串和数据库中的密码进行比对,通过比对后才能进行查询。最终,最终查询成功后把信息保存在session中,Session是存储在服务器端的对象,是比较安全的一种技术,在管理端通过判断session中的十来获取用户操作权限。
5.2.2管理主界面
主界面主要包括了系统管理菜单,通过菜单对系统功能进行管理。每一个功能包括基本的查询、添加等操作。其中主界面如下所示。
图5.2 管理主界面
5.2.3场地信息管理
管理员登录后,对场地进行管理。包括场地编号、名称、类别、内容信息。其中场地管理如下所示。
图5.3 场地管理界面
创建一个信息录入的form表单,在form中设计场地基本信息收集栏,点击提交的时候,通过form的POST方法传递到场地Action方法中。在Action中定义插入的方法,先实例化场地实体类,将场地信息通过实体类进行设置,然后调用场地数据库操作方法,保存场地信息到数据库,然后返回成功消息。
5.2.4教练管理
教练管理包括教练信息查看和教练删除功能,管理员对过期的教练进行删除。其中教练管理如下所示。
图5.5 教练管理界面
创建一个信息录入的form表单,在form中设计教练基本信息收集栏,点击提交的时候,通过form的POST方法传递到教练Action方法中。在Action中定义插入的方法,先实例化教练实体类,将教练信息通过实体类进行设置,然后调用教练数据库操作方法,保存教练信息到数据库,然后返回成功消息。
在教练信息管理页面先通过查询条件,获取对应的教练列表,然后在教练管理页面通过标签,把所有的教练信息绑定到列表中。
5.2.5场地预约订单管理
场地预约订单管理包括预约订单信息查看和预约订单删除审核功能,管理员对过期的信息进行删除。其中场地预约订单管理如下所示。
图5.5 场地预约订单管理界面
在场地预约订单信息管理页面先通过查询条件,获取对应的预约订单列表,然后在预约订单管理页面通过标签,把所有的预约订单信息绑定到列表中。
5.2.6教学视频管理
教学视频管理包括教学视频信息查看和教学视频删除功能,教练对过期的教学视频进行删除。其中教学视频管理如下所示。
图5.6 教学视频管理界面
创建一个信息录入的form表单,在form中设计教学视频基本信息收集栏,点击提交的时候,通过form的POST方法传递到教学视频Action方法中。在Action中定义插入的方法,先实例化教学视频实体类,将教学视频信息通过实体类进行设置,然后调用教学视频数据库操作方法,保存教学视频信息到数据库,然后返回成功消息。
5.2.7学员学习管理
学员学习管理包括学员发布学习视频,教练审核信息,学习指导功能,学生对过期的信息进行删除。其中学员学习管理如下所示。
图5.5 学员学习管理界面
创建一个信息录入的form表单,在form中设计学员学习基本信息收集栏,点击提交的时候,通过form的POST方法传递到学员学习Action方法中。在Action中定义插入的方法,先实例化学员学习实体类,将学员学习信息通过实体类进行设置,然后调用学员学习数据库操作方法,保存学员学习信息到数据库,然后返回成功消息。
5.3 前台用户功能实现
5.3.1会员注册
奥博羽毛球俱乐部管理系统的用户,必须得进行注册。如下所示:
图5.6 会员注册界面
使用奥博羽毛球俱乐部管理系统的客户端时,先要进行注册,打开会员注册的页面,用户填写所有的注册信息后,点击注册,在注册中调用JS的AJAX方法。方法中接收用户实体信息,调用服务器端的用户注册方法。在服务器端获取用户实体信息,对实体进行序列化处理,然后调用用户信息保存的service数据库操作方法,将实体内的会员信息通过SQL语句插入到数据库,并返回一个成功标识的Json对象,在客户端解析Json。判断返回的信息是否注册成功并提供给用户,这样就实现了用户注册的完整流程。
5.3.2会员登录
用户填写用户名及密码,正确后才能登入系统,不正确则重新登录。
图5.7 会员登录
打开会员登录的页面,用户填写所有的登录信息后,点击登录,在登录中调用JS的AJAX方法。方法中接收用户实体信息,调用服务器端的用户登录方法。在服务器端获取用户实体信息,对实体进行序列化处理,然后调用用户信息查询的service数据库操作方法,将查询结果通过Json对象进行返回,在客户端解析Json,判断返回的信息是否登录成功。
5.3.3教练查看
用户登录后,进入系统的主界面,能够看到所有教练信息,包括成教练分类信息,教练信息。其中教练主界面如5.8所示:
图5.8 教练主界面
点击教练列表,跳转到教练详情的界面,用户可选择进行查看。在教练详情界面,点击首页,返回到主界面。
图5.9 教练信息查询界面
在教练页面加载时,初始化方法中,调用JS的AJAX方法。方法中接收教练实体信息,调用服务器端的教练查询方法。在服务器端获取教练实体,对实体进行序列化处理,判断查询条件,然后调用教练查询的service数据库操作方法,将查询结果通过Json对象进行返回,在客户端解析Json,把结果存储在临时集合变量中,对变量进行数据显示绑定到界面。
5.3.4用户预约教练
选择相关的教练后,在线预约,预约后在我的订单列表中,可以提交到后台。预约界面如5.10所示:
图5.10 预约界面