摘 要

大数据时代下，数据呈爆炸式地增长。为了迎合信息化时代的潮流和信息化安全的要求，利用互联网服务于其他行业，促进生产，已经是成为一种势不可挡的趋势。在球馆计费管理的要求下，开发一款整体式结构的球场计费管理系统，将复杂的系统进行拆分，能够实现对需求的变化快速响应、系统稳定性的保障，能保证平台可持续、规模化发展的要求。

球场计费管理系统采取面对对象的开发模式进行软件的开发和硬体的架设，能很好的满足实际使用的需求，完善了对应的软体架设以及程序编码的工作，采取MySQL作为后台数据的主要存储单元，采用SSM框架、JSP技术、Ajax技术进行业务系统的编码及其开发，实现了本系统的全部功能。球场计费管理系统解决了传统管理方式所带来的人力、物力和时间上的虚耗和交流深度的限定，这让交流的过程更快捷、准确、便利，同时完成球场计费管理系统的基本功能：用户注册管理、新闻资讯管理、场地中心管理、预约记录管理、场地预约管理等。

关键词：球场计费管理；SSM框架；MySQL数据库

SSM Stadium Billing Management System

Abstract

In the era of big data, data is growing explosively. In order to meet the trend of the information age and the requirements of information security, using the Internet to serve other industries and promote production has become an irresistible trend. Under the requirements of stadium billing management, develop an integrated structure of the stadium billing management system, which can split complex systems, achieve rapid response to changes in demand, ensure system stability, and ensure the requirements of sustainable and large-scale development of the platform.

The golf course billing management system adopts an object-oriented development model for software development and hardware installation, which can well meet the actual use needs, improving the corresponding software installation and program coding work. It adopts MySQL as the main storage unit for background data, and uses SSM framework, JSP technology, and Ajax technology for business system coding and development, achieving all the functions of the system. The stadium billing management system solves the waste of manpower, material resources, and time brought about by traditional management methods, and limits the depth of communication. This makes the communication process faster, accurate, and convenient. At the same time, it completes the basic functions of the stadium billing management system: user registration management, news information management, venue center management, reservation record management, venue reservation management, and so on.

Key words: Course billing management; SSM framework; MySQL database

目  录

第1章 绪论

1.1 研究背景与意义

1.2 研究内容

1.3 论文组成结构

第2章 相关技术介绍

2.1 Vue.js 主要功能

2.2 Vue.js 语言特点

2.3 B/S体系工作原理

2.4  MVVM模式介绍

2.5 MySQL数据库

2.6 企业级架构

第3章 系统分析

3.1 可行性分析

3.1.1 经济可行性

3.1.2 操作可行性

3.1.3 需求可行性

3.2 需求分析

3.3 系统业务流程分析

3.4 系统数据流程分析

第4章 系统设计

4.1 系统架构设计

4.2 系统功能结构

4.3 功能模块设计

4.4 数据库设计

4.4.1 概念模型设计

4.4.2 逻辑结构设计

4.4.3 数据库连接设计

第5章 系统实现

5.1 登录模块的实现

5.2 用户子系统模块的实现

5.3 管理员子系统模块的实现

第6章 系统测试

6.1 测试目的

6.2 测试用例

6.3 测试结果

第7章 总结与展望

参考文献

致谢

1. 绪论
   1. 研究背景与意义

在计算机与网络飞速发展的今天，计算机应用变得非常普及，社会变得越来越信息化，信息系统变得尤为重要。如今部分球场虽然已经采用相关的计费管理系统，但其功能仍存在诸多不便。甚至，在-些场所还在采用纯人工计费操作收费业务，业务缺点是显而易见的。所以现如今研究开发一款出错率低、效率高的球场计费管理系统是必不可少的。在我国的一些球场、体育馆采用相关的计费管理系统功能单一,不能满足相关业务需求，且操作繁琐、界面复杂。同时其系统大多不与互联网络连接，计费信息、消费情况以及营业数据只能在单个主机上查看。这样的管理系统有着诸多问题，例如：消费者不能实时查看到当前消费情况；管理者也不能随时随地查看当前营业情况与营业记录；系统功能单一不能有效满足相关需求；在收银操作上，相关操作不够简易，对于人工培训成本较大。

1. 1. 研究内容

球场计费管理系统的开发及实现，所需要的工作内容：

（1）首先是确定选题，确定好所要做的系统，并对系统的背景及现在面临的一些问题等进行系统的初步确认。

（2）系统确认完成后，结合系统开发的需求进行确认系统开发所使用的技术，球场计费管理系统的开发使用SSM框架，数据库进行平台的搭建开发，确认好使用的技术进行技术分析，所使用的技术是否可以完成系统的实现。

（3）确定好系统使用的技术，进行在线确认系统所划分的用户角色，并且根据用户角色划分确定所要设计的功能模块，对球场计费管理系统的设计主要划分别为管理员和司机角色，并所使用的功能模块也相应不同，但是系统的数据库实现的内容是交互的，司机可以随时根据自己的需求进行信息查看，对于系统工作人员可以根据自己的分管内容进行在线信息的处理及操作，管理员获取到所有用户的详细数据信息，并根据需求进行第一时间处理解决。

（4）系统的功能模块确认完成后进行程序及界面的设计，设计完成后，并且通过测试来判断程序是否完善，对于系统测试，需要不同的用户进行不同的内容编辑及提交，及使用不同的测试方式找出程序中存在的漏洞，并对程序出现的漏洞问题进行在线解决处理，如果测试系统没有任何问题时，可以将系统上传进行正式操作使用。

1. 1. 论文组成结构

根据市场调研得到的信息数据，结合国内外前沿研究，利用相关系统开发和设计方法，最终设计出球场计费管理系统。

本文共有七章，如下所示。

第一章概述了球场计费管理系统的研究目的和意义；精炼地总结了国内外在仓储领域的研究情况和未来的研究趋势，最后给出了论文的组成结构。

第二章简要概述了本文所用的开发技术和工具。

第三章简要对系统各业务流程进行需求分析、可行性分析。

第四章对球场计费管理系统进行设计。

第五章对球场计费管理系统进行实现，并贴出相关页面截图，语言描述出具体功能实现的操作方法。

第六章对球场计费管理系统采用测试用例的方式来对一些主要功能模块测试，最后得出测试结果。

第七章总结全文并对未来的研究做出展望。

1. 相关技术介绍
   1. Vue.js 主要功能

Vue.js是一套构建用户界面的渐进式框架。与其他重量级框架不同的是，Vue采用自底向上增量开发的设计。Vue 的核心库只关注视图层，并且非常容易学习，非常容易与其它库或已有项目整合。另一方面，Vue 完全有能力驱动采用单文件组件和Vue生态系统支持的库开发的复杂单页应用。

Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。

Vue.js 自身不是一个全能框架——它只聚焦于视图层。因此它非常容易学习，非常容易与其它库或已有项目整合。另一方面，在与相关工具和支持库一起使用时，Vue.js 也能驱动复杂的单页应用。

1. 1. Vue.js 语言特点 

易用：在有HTML，CSS，JavaScript的基础上，快速上手；Vue.js 的 API 是参考了AngularJS、KnockoutJS、Ractive.js、Rivets.js；Vue.js 的 API 的对于其他框架的参考不仅是参考，其中也包含了许多 Vue.js 的独特功能。

灵活：简单小巧的核心，渐进式技术栈，足以应付任何规模的应用。

1. 1. B/S体系工作原理

B/S架构采取浏览器请求，服务器响应的工作模式。

用户可以通过浏览器去访问Internet上由Web服务器产生的文本、数据、图片、动画、视频点播和声音等信息；

而每一个Web服务器又可以通过各种方式与数据库服务器连接，大量的数据实际存放在数据库服务器中；

从Web服务器上下载程序到本地来执行，在下载过程中若遇到与数据库有关的指令，由Web服务器交给数据库服务器来解释执行，并返回给Web服务器，Web服务器又返回给用户。在这种结构中，将许许多多的网连接到一块，形成一个巨大的网，即全球网。而各个企业可以在此结构的基础上建立自己的Internet。

在 B/S 模式中，用户是通过浏览器针对许多分布于网络上的服务器进行请求访问的，浏览器的请求通过服务器进行处理，并将处理结果以及相应的信息返回给浏览器，其他的数据加工、请求全部都是由Web Server完成的。通过该框架结构以及植入于操作系统内部的浏览器，该结构已经成为了当今软件应用的主流结构模式。

1. 1.  MVVM模式介绍

MVVM是Model-View-ViewModel的简写。它本质上就是MVC 的改进版。MVVM 就是将其中的View 的状态和行为抽象化，让我们将视图 UI 和业务逻辑分开。当然这些事 ViewModel 已经帮我们做了，它可以取出 Model 的数据同时帮忙处理 View 中由于需要展示内容而涉及的业务逻辑。微软的WPF带来了新的技术体验，如Silverlight、音频、视频、3D、动画……，这导致了软件UI层更加细节化、可定制化。同时，在技术层面，WPF也带来了 诸如Binding、Dependency Property、Routed Events、Command、DataTemplate、ControlTemplate等新特性。MVVM（Model-View-ViewModel）框架的由来便是MVP（Model-View-Presenter）模式与WPF结合的应用方式时发展演变过来的一种新型架构框架。它立足于原有MVP框架并且把WPF的新特性糅合进去，以应对客户日益复杂的需求变化。

1. 1. MySQL数据库

MySQL 经过多次的更新，功能层面已经非常的丰富和完善了，从MySQL4版本到5版本进行了比较大的更新，在商业的实际使用中取得了很好的实际应用效果。最新版本的MySQL支持对信息的压缩，同时还能进行加密能更好的满足对信息安全性的需求。同时经过系统的多次更新，数据库自身的镜像功能也得到了很大的增强，运行的流畅度和易用性方面有了不小的进步，驱动的使用和创建也更加的高效快捷。最大的变动还是进行了空间信息的显示优化，能更加方便的在应用地图上进行坐标的标注和运算。强大的备份功能也保证了用户使用的过程会更加安心，同时支持的Office特性还支持用户的自行安装和使用。在信息的显示形式上也进行了不小的更新，增加了两个非常使用的显示区，一个是信息区，对表格和文字进行了分类处理，界面的显示更加清爽和具体。第二是仪表的信息控件，能在仪表信息区进行信息的显示，同时还能进行多个信息的比对，为用户的实际使用带来了很大的便捷。

针对本文中设计的球场计费管理系统在实际的实现过程中，最终选择MySQL数据库的主要原因在于在企业的应用系统应用及开发的过程中会存在大量的数据库比较频繁的操作，而且数据的安全性要求也是非常的高。综合这些因素，最终选择安全性系数比较高的MySQL来对球场计费管理系统后台数据进行存储操作。

1. 1. 企业级架构

SpringMVC属于MVC架构，它将SSM当做前提，借助JSP及Servlet技术达成。且其渐趋呈现的良好性能，获得研发者的青睐及重视，其运用相当简易，且回应迅速灵敏。因为其把JSP、message resource、Servlet还有自界定标签加以有机结合起来，让编程者用不着再编制代码就能够达到MVC形式，提升了编写程序实效。

Spring却属于SSM框架里相当强大的某一架构。它既对监管项目主体措施加以规范化整体化，且借助其本身的设计指引编程者侧重编订接口流程，而并非对类加以编程。其运用的核心是靠着JavaBean里的Inversion of Control容器。它供应了元件框架层的整体预案，且它达到对信息拜访的唯一抽象，供应了合理的JDBC架构，这一形式有效地缩减了出现失误的概率，提升了实效。另外其还交融了Hibernate等许多信息访问框架。

Mybatis属于某一放开源代码的主体关系映射架构，其达到了基于JDBC的超轻量级封装目的，如此能够便于程序员依照本身的想法借助针对主体的措施对资料库加以运作。它能够跟任一JDBC融合，另外能够在用户端运用，也能够在Web端运用，它可以实现信息的长久化。

1. 系统分析
   1. 可行性分析

在软件开发的过程中系统的可行性分析是必不可少的，可行性的研究就是评估问题是否能得到解决并且是要以最少的时间和最少的代价来解决。为实现上面的目标还要必须考虑到解决这些问题的方法的优点和缺点，还要考虑到实现了这些系统规模的开发带来的经济效益。这里可以用技术的可行性，操作的可行性，经济的可行性对我们的系统进行可行性的研究。球场计费管理系统的可行性分析如下所示：

1. 1. 1. 经济可行性

球场计费管理系统是在SSM和MySQL的环境中运行的，而系统的成本也只是主要分布在软件的开发和维护上。但如果系统上线投入使用之后，不仅可以方便人们，还节省了用户的时间和精力，而且还极大限度的方便了运营者，减少了运营者的工作强度。球场计费管理系统其实也不太复杂，在开发的时候经济支出也不大，在开发系统时时间用的也不多，从时间的优势和对经济利益方面产生的好处远超过维护和管理的成本，所以开发此系统是可行合适的。

1. 1. 1. 操作可行性

本系统是基于浏览器和服务器的球场计费管理系统，系统开发完成之后用户只需要在浏览器中输入正确的URL地址即可进行访问。本系统的前台页面简单明了，在没有操作指导的情况下也可以进行操作，无论是系统管理员还是普通用户在页面中所有的操作都是在浏览器中完成的，因此只要电脑在有网络的情况下，打开浏览器都能操作。而且在使用之前也不用进行相关的环境配置，因此本系统方便、简单、易于使用，所以该系统是容易并且可操作的。

1. 1. 需求分析

根据用户对系统的需求，要求系统简单操作，能够准确，完整的对信息进行管理。西安酷跑球场计费管理系统在对需求做解析后，整个系统主要分为两个部分：管理员和会员，每个模块下的分支功能不一样。对功能做出如下说明：

用户用例图如下所示。

图3-1 用户用例图

管理员用例图如下所示。

图3-2 管理员用例图

场地管理员用例图如下所示。

图3-3 场地管理员用例图

根据用例图，对一些重要的用例进行描述。

注册用例描述如下表所示。

表3-1 注册用例描述

用例名称	注册
参与者	用户
描述	用户填写相关注册数据完成注册成为系统的用户
前置条件	无
后置条件	用户填写相关注册数据并且要注册的账号不存在与系统中
事件流	用户点击注册按钮 用户填写相关注册数据 用户确认并提交注册数据 系统提示注册成功
补充说明	系统检测用户所输注册数据如不符合要求则提示并返回注册界面 系统检测用户所输账号不可用或已存在与系统中则提示并返回注册界面

登录用例描述如下表所示。

表3-1 登录用例描述

用例名称	登录
参与者	用户
描述	用户填写用户名和密码登录系统
前置条件	用户拥有账号和密码
后置条件	用户名和密码都正确
事件流	（1）用户在登录页面输入用户名和密码 （2）系统检测用户输入的用户名和密码是否正确 （3）用户名和密码正确的话，显示登录成功并返回主页面
补充说明	（a）系统检查除密码不正确，返回登录页面

个人信息管理用例描述如下表所示。

表3-1 个人信息管理用例描述

用例名称	管理和修改个人信息
参与者	用户
描述	用户查看、修改个人信息
前置条件	用户已登录到系统中
后置条件	无
事件流	（1）用户查看个人信息 （2）用户修改个人信息
补充说明	（a）用户可修改密码 （b）用户可修改个人资料，例如姓名，头像等

充值用例描述如下表所示。

表3-1 充值用例描述

用例名称	充值
参与者	用户
描述	用户发表充值
前置条件	用户已登录
后置条件	充值内容不违规
事件流	（1）在充值页输入充值金额，提交充值 （2）更新并显示充值板
补充说明	（a）充值内容不能为空

场地中心用例描述如下表所示。

表3-1 场地中心用例描述

用例名称	场地中心
参与者	用户
描述	用户查看场地中心信息以及场地预约操作
前置条件	用户已登录
后置条件	该场地存在，并且能被预约
事件流	（1）在场地页点击要预约的某个场地 （2）填写预约表单
补充说明	（a）场地预约表单数据不能为空

1. 1. 系统业务流程分析

球场计费管理系统的业务流程如下图所示。

图3-3 系统业务流程图

管理员拥有最高权限，在对各项信息进行增加、删除、修改后会更新后台数据库的内容，管理员在登录进行场地信息录入，预约信息管理等指令动作同样会更新后台数据。

1. 1. 系统数据流程分析

与强调控制逻辑的程序流程图不同，它更关心的是整个系统中数据的具体流动以及数据的加工处理的整个客观过程，是对数据规格的说明。也正因如此，系统数据流图作为系统结构化分析方法中极为重要的一种描述工具备受青睐。

球场计费管理系统的顶层数据流如下图所示。

图3-4系统顶层数据流图

系统顶层数据流：外部实体为系统用户，第一个流程为登录验证，用户信息表返回密码验证，是否正确，正确则登录系统，错误则反馈信息，登录系统后，根据不同用户的功能选择，来读写数据库。

系统底层数据流如下图所示。

图3-5系统底层数据流图

系统底层数据流：外部实体为管理员和会员，数据表提供数据支持，来完成逻辑操作。

1. 系统设计
   1. 系统架构设计

由于本系统在逻辑事务处理方面对数据库的操作比较频繁所以系统在底层连接数据库时并没有使用原生的JDBC，而是把JDBC进行了封装，封装之后相当于一个连接数据库的工具DB UTIL，这样使用起来会更加方便而且这样进行封装还可以降低系统中代码的冗余，当我们需要连接和使用数据库时只需要调用这个工具里面的一个方法就可以了。而且通过封装可以把对数据库的操作独立起来，当需要连接不同种类的数据库时只需要加以修改就可以达到目的。

系统架构如下图所示。

图4-1系统架构图

1. 1. 系统功能结构

进入系统后首先要进行登录，验证你的身份，赋予你不同的权限。当你成功登录后，页面会有多个板块，里面界面简单易懂，根据标示可以直接进行方便快捷的操作。

系统功能结构图如下所示。

图4-2系统功能结构图

1. 1. 功能模块设计

管理员账户的基本信息管理。主要提供管理员账户的基本信息录入、删除、维护和查询等功能，包括：

管理员录入管理员账户基本信息；

管理员更新、增加及删除管理员账户基本信息；

用户根据管理员账户 ID 查询基本信息；

系统管理员更改个人密码；

用户的基本信息管理。主要提供用户的基本信息录入、修改和查询功能，包括：

员工录入用户基本信息；

管理员更新、增加及删除用户基本信息；

场地预约的基本信息管理。主要是提供场地预约的基本信息录入、维护和查询功能，包括：

管理员录入场地预约基本信息；

管理员新增及删除场地预约基本信息；

管理员根据场地预约 ID 查询用户的场地预约基本信息；

1. 1. 数据库设计

一个好的系统它的后台数据库一定要考虑的全面，这和我们建造房子一个概念，房子不是随心所欲建起来的，一切都是在合理设计的基础是实现的，地基打牢固了房子才能建的更高。数据库如果设计的很合理，而且每个方面都能考虑到了那么这个系统才能不会出现大的问题。

1. 1. 1. 概念模型设计

本系统在数据库中存放了多张表，分别是场地信息表、用户信息表、预约信息表、充值信息表。

系统的主要实体间关系E-R图如下图所示。

图4-7系统E-R图

1. 1. 1. 逻辑结构设计

此环节把概念转变成数据。由于整个数据库所处理的信息过多，就只展示几个表。

1. 1. 表ball_games (球类项目)

编号	名称	数据类型	长度	小数位	允许空值	主键	默认值	说明
1	ball_games_id	int	10	0	N	Y		球类项目ID
2	ball_games	varchar	64	0	Y	N		球类项目
3	recommend	int	10	0	N	N	0	智能推荐
4	create_time	datetime	19	0	N	N	CURRENT_TIMESTAMP	创建时间
5	update_time	timestamp	19	0	N	N	CURRENT_TIMESTAMP	更新时间

1. 1. 表collect (收藏)

编号	名称	数据类型	长度	小数位	允许空值	主键	默认值	说明
1	collect_id	int	10	0	N	Y		收藏ID：
2	user_id	int	10	0	N	N	0	收藏人ID：
3	source_table	varchar	255	0	Y	N		来源表：
4	source_field	varchar	255	0	Y	N		来源字段：
5	source_id	int	10	0	N	N	0	来源ID：
6	title	varchar	255	0	Y	N		标题：
7	img	varchar	255	0	Y	N		封面：
8	create_time	timestamp	19	0	N	N	CURRENT_TIMESTAMP	创建时间：
9	update_time	timestamp	19	0	N	N	CURRENT_TIMESTAMP	更新时间：

1. 1. 表comment (评论)

编号	名称	数据类型	长度	小数位	允许空值	主键	默认值	说明
1	comment_id	int	10	0	N	Y		评论ID：
2	user_id	int	10	0	N	N	0	评论人ID：
3	reply_to_id	int	10	0	N	N	0	回复评论ID：空为0
4	content	longtext	2147483647	0	Y	N		内容：
5	nickname	varchar	255	0	Y	N		昵称：
6	avatar	varchar	255	0	Y	N		头像地址：[0,255]
7	create_time	timestamp	19	0	N	N	CURRENT_TIMESTAMP	创建时间：
8	update_time	timestamp	19	0	N	N	CURRENT_TIMESTAMP	更新时间：
9	source_table	varchar	255	0	Y	N		来源表：
10	source_field	varchar	255	0	Y	N		来源字段：
11	source_id	int	10	0	N	N	0	来源ID：

1. 1. 表hits (用户点击)

编号	名称	数据类型	长度	小数位	允许空值	主键	默认值	说明
1	hits_id	int	10	0	N	Y		点赞ID：
2	user_id	int	10	0	N	N	0	点赞人：
3	create_time	timestamp	19	0	N	N	CURRENT_TIMESTAMP	创建时间：
4	update_time	timestamp	19	0	N	N	CURRENT_TIMESTAMP	更新时间：
5	source_table	varchar	255	0	Y	N		来源表：
6	source_field	varchar	255	0	Y	N		来源字段：
7	source_id	int	10	0	N	N	0	来源ID：

1. 1. 表notice (公告)

编号	名称	数据类型	长度	小数位	允许空值	主键	默认值	说明
1	notice_id	mediumint	8	0	N	Y		公告id：
2	title	varchar	125	0	N	N		标题：
3	content	longtext	2147483647	0	Y	N		正文：
4	create_time	timestamp	19	0	N	N	CURRENT_TIMESTAMP	创建时间：
5	update_time	timestamp	19	0	N	N	CURRENT_TIMESTAMP	更新时间：

1. 1. 表praise (点赞)

编号	名称	数据类型	长度	小数位	允许空值	主键	默认值	说明
1	praise_id	int	10	0	N	Y		点赞ID：
2	user_id	int	10	0	N	N	0	点赞人：
3	create_time	timestamp	19	0	N	N	CURRENT_TIMESTAMP	创建时间：
4	update_time	timestamp	19	0	N	N	CURRENT_TIMESTAMP	更新时间：
5	source_table	varchar	255	0	Y	N		来源表：
6	source_field	varchar	255	0	Y	N		来源字段：
7	source_id	int	10	0	N	N	0	来源ID：
8	status	bit	1	0	N	N	1	点赞状态:1为点赞，0已取消

1. 1. 表ranking_information (排行信息)

编号	名称	数据类型	长度	小数位	允许空值	主键	默认值	说明
1	ranking_information_id	int	10	0	N	Y		排行信息ID
2	appointment_no	varchar	64	0	N	N		预约号
3	management_no	varchar	64	0	Y	N		管理编号
4	ball_games	varchar	64	0	Y	N		球类项目
5	site_name	varchar	64	0	Y	N		场地名称
6	session	varchar	64	0	Y	N		场次
7	parcel_amount	int	10	0	Y	N	0	包场金额
8	person_in_charge	int	10	0	Y	N	0	负责人员
9	order_date	date	10	0	Y	N		下单日期
10	user_name	varchar	64	0	Y	N		用户姓名
11	recommend	int	10	0	N	N	0	智能推荐
12	create_time	datetime	19	0	N	N	CURRENT_TIMESTAMP	创建时间
13	update_time	timestamp	19	0	N	N	CURRENT_TIMESTAMP	更新时间

1. 1. 表recharge_record (充值记录)

编号	名称	数据类型	长度	小数位	允许空值	主键	默认值	说明
1	recharge_record_id	int	10	0	N	Y		充值记录ID
2	recharge_no	varchar	64	0	Y	N		充值编号
3	collection_code	varchar	255	0	Y	N		收款码
4	person_in_charge	int	10	0	Y	N	0	负责人员
5	recharge_date	date	10	0	Y	N		充值日期
6	system_user	int	10	0	Y	N	0	系统用户
7	user_no	varchar	64	0	Y	N		用户编号
8	recharge_amount	int	10	0	Y	N	0	充值金额
9	recommend	int	10	0	N	N	0	智能推荐
10	create_time	datetime	19	0	N	N	CURRENT_TIMESTAMP	创建时间
11	update_time	timestamp	19	0	N	N	CURRENT_TIMESTAMP	更新时间

1. 1. 表site_center (场地中心)

编号	名称	数据类型	长度	小数位	允许空值	主键	默认值	说明
1	site_center_id	int	10	0	N	Y		场地中心ID
2	management_no	varchar	64	0	Y	N		管理编号
3	ball_games	varchar	64	0	Y	N		球类项目
4	site_name	varchar	64	0	Y	N		场地名称
5	session	varchar	64	0	N	N		场次
6	site_cover	varchar	255	0	Y	N		场地封面
7	parcel_amount	int	10	0	Y	N	0	包场金额
8	collection_code	varchar	255	0	Y	N		收款码
9	person_in_charge	int	10	0	Y	N	0	负责人员
10	site_details	longtext	2147483647	0	Y	N		场地详情
11	recommend	int	10	0	N	N	0	智能推荐
12	create_time	datetime	19	0	N	N	CURRENT_TIMESTAMP	创建时间
13	update_time	timestamp	19	0	N	N	CURRENT_TIMESTAMP	更新时间

1. 1. 表site_manager (场地管理者)

编号	名称	数据类型	长度	小数位	允许空值	主键	默认值	说明
1	site_manager_id	int	10	0	N	Y		场地管理者ID
2	manager_name	varchar	64	0	Y	N		管理者姓名
3	examine_state	varchar	16	0	N	N	已通过	审核状态
4	recommend	int	10	0	N	N	0	智能推荐
5	user_id	int	10	0	N	N	0	用户ID
6	create_time	datetime	19	0	N	N	CURRENT_TIMESTAMP	创建时间
7	update_time	timestamp	19	0	N	N	CURRENT_TIMESTAMP	更新时间

1. 1. 表site_reservation (场地预约)

编号	名称	数据类型	长度	小数位	允许空值	主键	默认值	说明
1	site_reservation_id	int	10	0	N	Y		场地预约ID
2	appointment_no	varchar	64	0	Y	N		预约号
3	management_no	varchar	64	0	Y	N		管理编号
4	ball_games	varchar	64	0	Y	N		球类项目
5	site_name	varchar	64	0	Y	N		场地名称
6	session	varchar	64	0	N	N		场次
7	person_in_charge	int	10	0	Y	N	0	负责人员
8	order_date	date	10	0	Y	N		下单日期
9	system_user	int	10	0	Y	N	0	系统用户
10	user_name	varchar	64	0	Y	N		用户姓名
11	user_no	varchar	64	0	Y	N		用户编号
12	parcel_amount	int	10	0	Y	N	0	包场金额
13	account_balance	varchar	64	0	Y	N		账户余额
14	recommend	int	10	0	N	N	0	智能推荐
15	create_time	datetime	19	0	N	N	CURRENT_TIMESTAMP	创建时间
16	update_time	timestamp	19	0	N	N	CURRENT_TIMESTAMP	更新时间

1. 1. 表slides (轮播图)

编号	名称	数据类型	长度	小数位	允许空值	主键	默认值	说明
1	slides_id	int	10	0	N	Y		轮播图ID：
2	title	varchar	64	0	Y	N		标题：
3	content	varchar	255	0	Y	N		内容：
4	url	varchar	255	0	Y	N		链接：
5	img	varchar	255	0	Y	N		轮播图：
6	hits	int	10	0	N	N	0	点击量：
7	create_time	timestamp	19	0	N	N	CURRENT_TIMESTAMP	创建时间：
8	update_time	timestamp	19	0	N	N	CURRENT_TIMESTAMP	更新时间：

1. 1. 表system_user (系统用户)

编号	名称	数据类型	长度	小数位	允许空值	主键	默认值	说明
1	system_user_id	int	10	0	N	Y		系统用户ID
2	user_no	varchar	64	0	N	N		用户编号
3	user_name	varchar	64	0	Y	N		用户姓名
4	gender	varchar	64	0	Y	N		性别
5	account_balance	int	10	0	Y	N	0	账户余额
6	examine_state	varchar	16	0	N	N	已通过	审核状态
7	recommend	int	10	0	N	N	0	智能推荐
8	user_id	int	10	0	N	N	0	用户ID
9	create_time	datetime	19	0	N	N	CURRENT_TIMESTAMP	创建时间
10	update_time	timestamp	19	0	N	N	CURRENT_TIMESTAMP	更新时

1. 系统实现
   1. 登录模块的实现

该登录模块利用js进行设计，JavaScript函数CheckSubmit()对输入框是否为空进行验证，使用js的技术结合MySQL 2012数据库的查询语句进行登录信息的验证。首先从文本框中分别获得账号user_name和密码user_pw，使用Sql语句“select * from t_user where user_name=‘”+user_name+“’ and user_pw=‘”+user_pw+“’”将查询结果赋给rs结果集，若rs.next()返回值为空，表示数据库找不到该用户数据，若rs.next()返回值不为空，则显示登录成功，进入主界面。

用户登录流程图如下所示。

图5-1用户登录流程

用户登录流程：用户只有输入正确的用户名和密码才会成功进入系统，用户输入用户名密码后点击登录按钮，系统会进行校验该用户名是否存在，如果用户名与密码不匹配或者用户名不存在，则返回主界面。

系统登录界面如下图所示。

图5-2系统登录界面

登录功能的逻辑代码如下所示。

 /**

     * 登录

     * @param data

     * @param httpServletRequest

     * @return

     */

    @PostMapping("login")

    public Map<String, Object> login(@RequestBody Map<String, String> data, HttpServletRequest httpServletRequest) {

        log.info("[执行登录接口]");

        String username = data.get("username");

        String email = data.get("email");

        String phone = data.get("phone");

        String password = data.get("password");

        List resultList = null;

        QueryWrapper wrapper = new QueryWrapper<User>();

        Map<String, String> map = new HashMap<>();

        if(username != null && "".equals(username) == false){

            map.put("username", username);

            resultList = service.selectBaseList(service.select(map, new HashMap<>()));

        }

        else if(email != null && "".equals(email) == false){

            map.put("email", email);

            resultList = service.selectBaseList(service.select(map, new HashMap<>()));

        }

        else if(phone != null && "".equals(phone) == false){

            map.put("phone", phone);

            resultList = service.selectBaseList(service.select(map, new HashMap<>()));

        }else{

            return error(30000, "账号或密码不能为空");

        }

        if (resultList == null || password == null) {

            return error(30000, "账号或密码不能为空");

        }

        //判断是否有这个用户

        if (resultList.size()<=0){

            return error(30000,"用户不存在");

        }

        User byUsername = (User) resultList.get(0);

        Map<String, String> groupMap = new HashMap<>();

        groupMap.put("name",byUsername.getUserGroup());

        List groupList = userGroupService.selectBaseList(userGroupService.select(groupMap, new HashMap<>()));

        if (groupList.size()<1){

            return error(30000,"用户组不存在");

        }

        UserGroup userGroup = (UserGroup) groupList.get(0);

        //查询用户审核状态

        if (!StringUtils.isEmpty(userGroup.getSourceTable())){

            String res = service.selectExamineState(userGroup.getSourceTable(),byUsername.getUserId());

            if (res==null){

                return error(30000,"用户不存在");

            }

            if (!res.equals("已通过")){

                return error(30000,"该用户审核未通过");

            }

        }

        //查询用户状态

        if (byUsername.getState()!=1){

            return error(30000,"用户非可用状态，不能登录");

        }

        String md5password = service.encryption(password);

        if (byUsername.getPassword().equals(md5password)) {

            // 存储Token到数据库

            AccessToken accessToken = new AccessToken();

            accessToken.setToken(UUID.randomUUID().toString().replaceAll("-", ""));

            accessToken.setUser_id(byUsername.getUserId());

            tokenService.save(accessToken);

            // 返回用户信息

            JSONObject user = JSONObject.parseObject(JSONObject.toJSONString(byUsername));

            user.put("token", accessToken.getToken());

            JSONObject ret = new JSONObject();

            ret.put("obj",user);

            return success(ret);

        } else {

            return error(30000, "账号或密码不正确");

        }

}

    public String select(Map<String,String> query,Map<String,String> config){

        StringBuffer sql = new StringBuffer("select ");

        sql.append(config.get(FindConfig.FIELD) == null || "".equals(config.get(FindConfig.FIELD)) ? "*" : config.get(FindConfig.FIELD)).append(" ");

        sql.append("from ").append("`").append(table).append("`").append(toWhereSql(query, "0".equals(config.get(FindConfig.LIKE))));

        if (config.get(FindConfig.GROUP_BY) != null && !"".equals(config.get(FindConfig.GROUP_BY))){

            sql.append("group by ").append(config.get(FindConfig.GROUP_BY)).append(" ");

        }

        if (config.get(FindConfig.ORDER_BY) != null && !"".equals(config.get(FindConfig.ORDER_BY))){

            sql.append("order by ").append(config.get(FindConfig.ORDER_BY)).append(" ");

        }

        if (config.get(FindConfig.PAGE) != null && !"".equals(config.get(FindConfig.PAGE))){

            int page = config.get(FindConfig.PAGE) != null && !"".equals(config.get(FindConfig.PAGE)) ? Integer.parseInt(config.get(FindConfig.PAGE)) : 1;

            int limit = config.get(FindConfig.SIZE) != null && !"".equals(config.get(FindConfig.SIZE)) ? Integer.parseInt(config.get(FindConfig.SIZE)) : 10;

            sql.append(" limit ").append( (page-1)*limit ).append(" , ").append(limit);

        }

        log.info("[{}] - 查询操作，sql: {}",table,sql);

        return sql.toString();

}

    public List selectBaseList(String select) {

        List<Map<String,Object>> mapList = baseMapper.selectBaseList(select);

        List<E> list = new ArrayList<>();

        for (Map<String,Object> map:mapList) {

            list.add(JSON.parseObject(JSON.toJSONString(map),eClass));

        }

        return list;

}

1. 1. 用户子系统模块的实现
      1. 用户首页模块

在浏览器的地址栏里输入http://localhost:8080/index.jsp 地址，就可以跳转到球场计费管理系统的首页，首页是由4个页面组成的，包括top、left、down和center等页面，这里也是浏览者访问系统的入口，通过@ include引入。

首页载入流程图如下所示。

图5-3首页载入流程

首页载入流程：系统先连接数据库，显示界面参数初始化，读取数据库的数据表，读取html显示模板，对数据按添加时间排序，按照模板设计位置显示数据，刷新显示界面，断开数据库连接。

首页如下图所示。

图5-4首页界面

其中载入首页的主要代码如下。

 @PostMapping("/add")

    @Transactional

    public Map<String, Object> add(HttpServletRequest request) throws IOException {

        service.insert(service.readBody(request.getReader()));

        return success(1);

    }

    @Transactional

    public Map<String, Object> addMap(Map<String,Object> map){

        service.insert(map);

        return success(1);

}

1. 1. 1. 用户注册模块

系统的用户通过自行注册生成，在系统首页点击用户注册菜单，系统跳转到对应的注册页面。点击重置按钮，清空所填数据，点击注册按钮完成注册。

用户注册流程图如下所示。

图5-5用户注册流程

注册个人信息实现流程为：填写个人信息，系统使用JQuery选择器获取在网页中输入的注册信息，再对联系方式、登录密码等信息进行验证，验证通过后用Ajax异步请求方式向服务器发送请求并把数据传送到后台，然后验证用户名是否已存在，如果已存在则注册失败提示“用户名已存在”；如果用户表中没有该用户名则把用户信息加入数据库，把操作状态以json字符串方式返回到前台。Ajax请求成功接收到返回的数据时会触发成功回调函数，然后解析返回的json字符串，系统根据返回信息弹出提示框，注册成功后返回登录页。

用户注册页面的逻辑代码如下。

    /**

     * 注册

     * @return

     */

    @PostMapping("register")

    public Map<String, Object> signUp(HttpServletRequest request) throws IOException {

        // 查询用户

        Map<String, String> query = new HashMap<>();

        Map<String,Object> map = service.readBody(request.getReader());

        query.put("username",String.valueOf(map.get("username")));

        List list = service.selectBaseList(service.select(query, new HashMap<>()));

        if (list.size()>0){

            return error(30000, "用户已存在");

        }

        map.put("password",service.encryption(String.valueOf(map.get("password"))));

        service.insert(map);

        return success(1);

}

    public Map<String,Object> readBody(BufferedReader reader){

        BufferedReader br = null;

        StringBuilder sb = new StringBuilder("");

        try{

            br = reader;

            String str;

            while ((str = br.readLine()) != null){

                sb.append(str);

            }

            br.close();

            String json = sb.toString();

            return JSONObject.parseObject(json, Map.class);

        }catch (IOException e){

            e.printStackTrace();

        }finally{

            if (null != br){

                try{

                    br.close();

                }catch (IOException e){

                    e.printStackTrace();

                }

            }

        }

        return null;

    }

    public void insert(Map<String,Object> body){

        E entity = JSON.parseObject(JSON.toJSONString(body),eClass);

        baseMapper.insert(entity);

        log.info("[{}] - 插入操作：{}",entity);

}

1. 1. 1. 场地信息展示模块

管理员对场地信息进行录入，包括球类项目、场地名称，场次、包场金额等，管理员可以对其进行维护管理。

场地信息展示流程如下图所示。

图5-6场地信息展示流程

场地信息展示界面如下图所示。

图5-7场地信息展示界面

场地信息展示的主要逻辑代码:

  @RequestMapping("/get_obj")

    public Map<String, Object> obj(HttpServletRequest request) {

        List resultList = service.selectBaseList(service.select(service.readQuery(request), service.readConfig(request)));

        if (resultList.size() > 0) {

            JSONObject jsonObject = new JSONObject();

            jsonObject.put("obj",resultList.get(0));

            return success(jsonObject);

        } else {

            return success(null);

        }

}

1. 1. 管理员子系统模块的实现
      1. 用户信息管理模块

管理员在yonghuxinxi_list.jsp录入，对用户信息进行管理。

用户信息管理如下图所示。

图5-8用户信息管理界面

用户信息管理主要逻辑代码如下所示。

public Map<String, Object> success(Object o) {

        Map<String, Object> map = new HashMap<>();

        if (o == null) {

            map.put("result", null);

            return map;

        }

        if (o instanceof List) {

            if (((List) o).size() == 1) {

               o =  ((List) o).get(0);

                map.put("result", o);

            }else {

                String jsonString = JSONObject.toJSONString(o);

                JSONArray objects = service.covertArray(JSONObject.parseArray(jsonString));

                map.put("result", objects);

            }

        } else if (o instanceof Integer || o instanceof String) {

            map.put("result", o);

        } else {

            String jsonString = JSONObject.toJSONString(o);

            JSONObject jsonObject = JSONObject.parseObject(jsonString);

            JSONObject j = service.covertObject(jsonObject);

            map.put("result", j);

        }

        return map;

}

1. 1. 1. 场地预约管理模块

管理员在yuyuexinxi_add.jsp发布商品信息，跳转至预约信息添加表单，提交预约信息表，包括预约编号、球馆名称、房间分类、会员小时价、预约时间等提交后，数据库的预约信息表刷新数据，系统将预约信息展示出来。

预约信息管理界面如所示。

图5-9预约信息管理界面

预约信息管理的逻辑代码如下。

 package com.project.demo.constant;

/**

 */

public class FindConfig {

    public static String PAGE = "page";

    public static String SIZE = "size";

    public static String LIKE = "like";

    public static String ORDER_BY = "orderby";

    public static String FIELD = "field";

    public static String GROUP_BY = "groupby";

    public static String MIN_ = "_min";

    public static String MAX_ = "_max";

}

1. 系统测试
   1. 测试目的

在这个产品被投入使用前，首先需要进行试用，这是重要的环节。考虑到某个部分的开发没有缺陷情况下，把各种模块拼接，也有一定概率就存在矛盾。这就好比每个人都很独特，但聚在一起就显得杂乱无章，需要保证有默契的配合。对于测试，要看它的各项内容是否契合的原则。若与最初定下的标准有一定程度上的出入，那么就需要做出一些调整，让最终的大方向朝着目标前进。

1. 1. 测试用例
      1. 登录测试 

登录测试用例如下表所示。

表6-1登录测试用例

输入		输出
用户名	密码
空	空	用户名或密码不能为空
蔡徐坤	123	用户名不能为汉字，请重新输入
789	789	用户名或密码错误
678	123456	登录成功

1. 1. 1. 注册测试 

注册测试用例如下表所示。

表6-2注册测试用例

输入				输出
用户名	密码	确认密码	邮箱
空	空	空	空	请输入完整
001	001	001	001@qq.com	注册成功
002	002	003	002@qq.com	注册失败，两次密码不一致
003	003	003	003.com	注册失败，邮箱格式不正确

1. 1. 1. 新闻资讯信息测试

新闻资讯信息测试用例如下表所示。

表6-3新闻资讯信息测试用例

功能	测试数据	预期结果	测试结果
新闻资讯信息添加	新闻资讯信息内容添加	在新闻资讯信息列表中显示新闻资讯信息内容，新闻资讯信息显示添加成功	和预期一致
新闻资讯信息修改	新闻资讯信息内容修改	新闻资讯信息列表中的新闻资讯信息修改成功	和预期一致
删除新闻资讯信息	删除新闻资讯信息	新闻资讯信息成功删除	和预期一致

1. 1. 1. 场地信息管理测试 

场地信息测试用例如下表所示。

表6-4添加场地信息测试用例

输入				输出
标题	类别	内容	备注
空	空	空	空	添加失败
场地信息1	A	1		添加成功
空	A	1		添加失败，标题不能为空
场地信息2	空	1		添加失败，请选择类别

1. 1. 1. 充值信息测试 

充值信息测试用例如下表所示。

表6-4添加充值信息测试用例

输入				输出
名称	用户	价格	备注
空	空	空	空	添加失败
充值1	A	100		添加成功
空	A	100		添加失败，名称不能为空
充值2	空	100		添加失败，请选择类别

1. 1. 测试结果

经过测试，得到测试结果如下表所示。

表6-6测试结果

测试项目	内容和目的	测试结果
用户登录	输入正确用户名与密码	可以登录
	输入错误用户名与密码	提示错误的信息
资讯信息管理（添加，修改，删除）	输入正确信息	成功完成
	输入错误信息	操作失败
修改登录密码	修改新的密码	成功完成
用户管理（添加，修改，删除）	输入正确信息	成功完成
	输入错误信息	操作失败
项目类型管理（添加，修改，删除）	输入正确信息	成功完成
	输入错误信息	操作失败
场地预约管理（添加，修改，删除）	输入正确信息	成功完成
	输入错误信息	操作失败
充值记录管理（添加，修改，删除）	输入正确信息	成功完成
	输入错误信息	操作失败

1. 总结与展望

本次毕业论文的主要是开发一个安全可靠，操作简易，同时具备业务可扩展的球场计费管理系统。本文详细的论述了球场计费管理系统的设计和开发，本系统的所有事务逻辑都是按照系统的需求分析进行设计的，系统有普通用户和系统管理员两种角色，系统大大增加了客户的体验程度，由于是对局部进行操作那么就减少了一些繁琐而又不必要的操作，减轻了服务器对页面解析的负担。

与其他系统相比，本系统有自身的优点，

例如：

（1）创新性强；

（2）业务逻辑性强，安全性高，在一些重要的功能模块需要通过审查之后才可使用；

（3）移植性高，在所有Window平台都可使用。

当然也还有很多需要进一步改进的地方：

（1）系统大多数页面都是全局刷新，缺乏局部刷新，这将增加服务器的压力，如果有大量用户在同一时间段操作同一个功能模块，可能会导致查询缓慢；

（2）页面没有经过专业的UI设计，美观程度不及其他市场其他网站系统，有待改善。