摘 要

界面是系统与用户进行直接接触的可视化部分。一个好的界面应该综合考虑功能的需求、人性化、审美以及意境。从某种程度上说，它往往能够直接影响到用户对系统的喜爱程度。优秀的界面不仅可以吸引到浏览的用户，而且还能够让用户产生探索的欲望，收获一批忠诚的拥护者。

本文基于MVC思想设计出一个简单多任务的管理系统架构及人机交互界面，整个系统分为四层。其中第一层为页面设计，主要使用HTML 5、Bootstrap设计页面的静态显示部分，然后使用CSS对页面进行渲染、美化，而Javascript与JQuery用于对页面的动态控制。第二层为控制层，这部分主要由两部分共同组成：一是阻止所有用户的请求，二是将截获到的请求呈交给核心控制器与实际的业务控制（如采用Model,返回处理的结果等）。第三层为业务逻辑组件层，在这一层将进行实际的逻辑处理，包括更新数据、调用Dao层等等。最后一层为数据库开发层（即Dao层），在这一层可采用JDBC、Hibernate等方式与MySQL数据库建立连接，以便能对关系数据库进行各种处理。

整个系统的代码采用Spring容器配置管理，包括Struts2、Hibernate的配置都配置在Spring大容器中进行管理，这样减少了代码之间的高度耦合。另外，为了后期维护和升级的需要，代码之间采用面向接口编程的方式，这样每个部分基本都能独立出来，而相互之间又能以最少的耦合协同工作，这样不仅提高了代码的可阅读性，而且缩短了后期的维护以及扩展所需要的时间。

关键词：MVC思想；前端设计；Struts2；Spring；Hibernate；解耦合；面向接口编程

ABSTRACT

The interface is a visual part of the system that is directly contact with the user. A good interface should take into account the functional needs, humanity, aesthetic and mood. To a certain extent, it can often directly affect the user's degree of love of the system. Excellent interface not only attract users to browse, but also allows users to explore the desire to harvest a group of loyal supporters.

In this thesis, we design a simple multi - task management system architecture and human - computer interaction interface based on MVC thought. The system is divided into four layers. The first layer is being the page design, mainly utilizing HTML 5, Bootstrap design page static display part, and employing CSS to render the page, landscaping, and Javascript and JQuery for the dynamic control of the page. The second layer is the control layer. This part is composed of two parts: intercept all user requests, and hand over the requests to the core controller to deal with the actual business control (such as calling Model, return processing results, etc.). The third layer is the business logic component layer, where the actual logic will be processed, including updating the data, calling the Dao layer, and so on. The last layer perform the database development layer (that is, Dao layer). In this layer can use JDBC, Hibernate and other ways to establish a connection with the MySQL database, and implement various processing to the relational database.

We employ Spring container to manage and configure the system code, (including Struts2,and Hibernate). The benefit of this code manage structure is to reduce the high degree of coupling between the code. In addition, in order to satisfy the requirement of future maintenance and upgrade, we select the interface-oriented coding. So that every fundamental part of the proposed system can be independent, and each of them among with minima coupling. This strategy improves the code readability, and reduces the burden of future maintenance and expansion.

Key Words：the thought of MVC ；front-end design；Struts 2 ;Spring; Hibernate；decoupling；oriented interface programming

目 录

摘 要 I

ABSTRACT II

第1章 绪论 1

1.1课题研究背景及意义 1

1.2 国内外研究现状分析 2

1.3本文的主要内容和结构安排 2

第2章 管理系统架构 4

2.1 MVC思想概述 4

2.2 Spring整合Struts 2 6

2.2.1 Struts 2作为系统的控制器 6

2.2.2 MVC框架与Spring整合的思考 7

2.2.3 Spring管理控制器 8

2.3 Spring整合Hibernate 9

2.3.1 Spring提供的Dao支持 9

2.3.2 Hibernate的SessionFactory的获取 10

2.3.3 Spring容器组合各层组件 11

2.3 本章小结 12

第3章 人机交互界面设计 13

3.1 系统分析 13

3.1.1 需求分析 13

3.1.2 可行性分析 14

3.2 系统设计 14

3.2.1 系统目标 14

3.2.2 系统功能结构 15

3.2.3 系统业务流程图 15

3.3 开发环境 16

3.3.1 Tomcat服务器 16

3.3.2 Eclipse的安装和使用 18

3.4 本章小结 19

第4章 系统主窗体设计 20

4.1 主窗体设计应用的相关技术 20

4.1.1 JSP、Servlet技术的应用 20

4.1.2 HTML5语言的应用 21

4.1.3 CSS、Javascript的应用 21

4.2系统登录模块设计 22

4.2.1设计登陆窗体 22

4.2.2 密码验证与注册用户 23

4.2.3 记住密码的Cookie 25

4.3 系统管理模块设计 28

4.3.1 设计菜单栏 28

4.3.2 设计选项卡 30

4.3.3 设计内联框架 31

4.4 系统维护的菜单功能实现 32

4.4.1 查看用户 32

4.4.2修改密码 33

4.4.3注销功能 35

4.5本章小结 36

第5章 总结与展望 37

参考文献 38

致 谢 40

第1章 绪论

1.1课题研究背景及意义

随着网络时代的发展，人们每天都要接受各种各样的数据。面对各种复杂的数据，通过人力的整理、归纳、总结起来会显得力不从心，效率低下。我们可能需要花费几天甚至几月的时间去处理一些杂乱无章的数据，而令人沮丧的是在我们投入了大量的时间和精力之后得到的结果可能还不令人满意。这个时候我们就需要一个高效、稳定的管理系统来为我们完成那些冗杂、无趣的事情，而一个简单、好用的人机交互界面就成为了判断一个系统好坏的重要标志。一个简洁、大方的人机交互界面可以帮助使用者从晦涩的数据中释放出来，让他们能快速完成相应的操作，节省大量的时间和精力。

但是在实际的项目开发中，不可能由个人完成一个大项目的开发，在企业、团队中都会采用分工合作的策略。这就像工厂车间的生产模式一样，汽车的框架、轮胎、引擎都零器件都是由不同的部门或者公司生产，这就是典型的合作模式。在软件开发时也是一样的，为软件开发设计出一个完整的框架，可以很好的指导后续的各个程序设计开发。