1、第 1 页 (共 53 页)本科毕业论文（20 届）房屋租赁管理系统整体界面设计与实现所在学院专业班级 信息与计算科学学生姓名指导教师完成日期第 2 页 (共 53 页)房屋租赁管理系统整体界面设计与实现摘要：现今随着科技的发展与进步、信息需求的增加，许多都已经进入计算机办公了，为广大网络用户提供更加周到和人性化的服务，是当前最重要的任务。但是随着人们对美好事物的追求，对系统界面要求也相应的提高。界面是软件与用户交互的最直接层，界面的好坏决定用户对软件的第一印象。而且设计良好的界面能够引导用户自己完成相应的操作，起到向导的作用。同时界面如同人的面孔，具有吸引用户的直接优势。本系统将采用能到达到
2、要求的 jQuery EasyUI 框架来完成界面设计。关键字：房屋租赁管理；jQuery EasyUIAbstract: Nowadays with the development and progress of science and technology, the growing demand for the information,many are already in the computer business, for the majority of Internet users to provide more thoughtful and personalized service
3、, is the most important task.But as people in the pursuit of good things, to improve the system interface requirements accordingly. Interface is the most direct software and user interaction layer, the stand or fall of interface decided to users first impression of the software. And well designed in
4、terface can guide the user to complete the corresponding operations, have the effect of the wizard. Interface as a mans face at the same time, the advantages to attract users directly. Can is adopted in this system to meet the requirements of the jQuery EasyUI framework to complete the interface des
5、ign.Key woeds: Housing rental management; jQuery EasyUI第 3 页 (共 53 页)随着社会经济的发展，城市现代化建设步伐不断加快，城市规模不断扩大，人员的流动也不断加大，房屋出租逐渐成为社会生活的重要组成部分。无论是房屋出租还是房屋求租，都面临着大量需求，再这样的要求下，就逐渐的出现了很多房屋租赁管理的软件，而每一种软件都有自己界面设计风格。现如今人们对美好事物的追求也越来越强，越是美好的事物，都会第一吸引人们的眼球。而最重要的是界面是软件与用户交互的最直接层，界面的好坏决定用户对软件的第一印象。而且设计良好的界面能够引导用户自己完成相应
6、的操作，起到向导的作用。同时界面如同人的面孔，具有吸引用户的直接优势。那我们要为自己的系统设计一个怎样的界面风格来吸引人们呢？1 引言1.1 课题研究的背景介绍随着社会经济的发展，城市现代化建设步伐不断加快，城市规模不断扩大，人员的流动也不断加大，房屋出租逐渐成为社会生活的重要组成部分。无论是房屋出租还是房屋求租，都面临着大量需求，再这样的要求下，就逐渐的出现了很多房屋租赁管理的软件，而每一种软件都有自己界面设计风格。现如今人们对美好事物的追求也越来越强，越是美好的事物，都会第一吸引人们的眼球。而最重要的是界面是软件与用户交互的最直接层，界面的好坏决定用户对软件的第一印象。而且设计良好的界面能
7、够引导用户自己完成相应的操作，起到向导的作用。同时界面如同人的面孔，具有吸引用户的直接优势。那我们要为自己的系统设计一个怎样的界面风格来吸引人们呢？完成一个这样的界面，不仅能为我们的系统增加人量。并且能够培养我对界面设计的能力，同时提高动手实践的能力。1.2 界面开发工具及工具介绍1.2.1 界面开发工具Html5、jQuery EasyUI 框架。1.2.2 工具介绍一、html5 介绍第 4 页 (共 53 页)1、背景信息HTML 超文本标记语言的开发到 1999 年推出 HTML4 就停止了。万维网联盟（W3C ）把重点转向将 HTML 的底层语法从标准通用标记语言（SGML）改为可扩
8、展标记语言（XML），以及可缩放向量图型（ SVG）、XForms 和 MathML 这些全新的标记语言。而浏览器厂商则把精力放到选项卡和丰富站点摘要（RSS）阅读器这类浏览器特性上。Web 设计人员开始学习使用异步 JavaScript + XML（Ajax），在现有的框架下通过层叠样式表（CSS）和 JavaScript 语言建立自己的应用程序。但是在接下来的数年时间中，HTML 本身没有任何变化。人们从 1999 年起就一直期待 HTML 的新版本，而为了推动 Web 标准化运动的发展，一些公司联合起来(主要是 Apple、Opera 和 Mozilla Foundation)，他们成立
9、了一个叫做 Web Hypertext Application Technology Working Group （Web 超文本应用技术工作组 -WHATWG） 的组织。WHATWG 致力于 Web 表单和应用程序，而 W3C（World Wide Web Consortium，万维网联盟）专注于 XHTML 2.0。在 2006 年，双方决定进行合作，来创建一个新版本的 HTML。HTML5 草案的前身名为 Web Applications 1.0，于 2004 年提出，于 2007年被 W3C 接纳，并成立了新的 HTML 工作团队。 HTML5 的第一份正式草案已于 2008 年 1
10、月 22 日公布。HTML5 仍处于完善之中。但大部分现代浏览器已经具备了某些 HTML5 支持。W3C 已经提出新计划，将 HTML5 定位为“ 推荐标准 ”。按照 W3C 的话来说，这意味着到 2014 年底，HTML5 将成为一种完整的成品标准。W3C 还计划到2016 年底发布后续版本 HTML 5.1。根据新计划，HTML 工作团队将在 2012 年底发布一个 HTML 5.0 候选推荐标准，这个候选推荐标准将是 5.0 标准的基础。之后，HTML 5.1 的草案也会被制定，其中将包括 HTML 5.0 的候选推荐标准，再加上任何被排除在外的不稳定功能。到 2014 年，HTML 5
11、.1 规范的出炉将经历类似步骤。任何不稳定功能将被剔除，产生 HTML 5.1 候选推荐标准，此后会制定HTML 5.2 的草案，加入不稳定功能。之后 HTML 5.3、5.4标准会一直升级下去。此前， HTML 5 标准计划将在 2022 年完成。2、HTML5 的优势a.提高可用性和改进用户的友好体验；b.新标签这将有助于开发人员定义重要的内容；第 5 页 (共 53 页)c.可以给站点带来更多的多媒体元素(视频和音频 )；d.可以很好的替代 FLASH 和 Silverlight；e.当涉及到网站的抓取和索引的时候，对于 SEO 很友好；f.大量应用于移动应用程序和游戏。3、HTML5
12、的不足a.HTML5 本身还在发展中，它不是用户应用的最迫切需求，更多是厂商试图改变软件生态格局的战略需求。b.HTML5 的兼容性受限于各大浏览器表现，例如微软的 IE 和 fireforx 之间存在很多差别。c.HTML5 需要一个成熟完整的开发环境，目前还缺少。d.HTML5 功能的暴增，浏览器必须有一个高效的图形引擎和脚本引擎。e.HTML5 需要杀手级应用来吸引和引导用户升级浏览器，最终完成 HTML5终端的部署。4、未来前景从 2012 年 1 月的数据来看，全球已有超过 34%的网站使用了 HTML5 技术。除去 IE6-8 浏览器外，其他主流浏览器都支持 HTML5，其中仅有
13、iPhone/iPad 不支持 Flash。据 IDC 调查研究显示，2013 年全球各地将有 10 亿人使用 HTML5 浏览器，将有 200 万开发人员为 HTML5 浏览器开发应用。HTML5 在未来的 5-10 年中，将成为移动发展的一个重要因素。二、jquery easyUI 框架介绍easyui 是一种基于 jQuery 的用户界面插件集合。easyui 为创建现代化，互动，JavaScript 应用程序，提供必要的功能。使用 easyui 你不需要写很多代码，你只需要通过编写一些简单 HTML 标记，就可以定义用户界面。easyui 是个完美支持 HTML5 网页的完整框架。ea
14、syui 节省您网页开发的时间和规模。easyui 很简单但功能强大的。第 6 页 (共 53 页)2 房屋租赁管理系统界面需求分析2.1 房屋租赁管理系统界面可行性分析可行性研究的目的就是用最小的代价在尽可能短的时间内确定问题是否能够解决、是否值得去解。下面从四个方面分析本系统界面的可行性：2.1.1 房屋租赁管理系统界面技术可行性本系统采用 jQuery EasyUI 进行前台界面设计、与后台数据库的链接、数据的录入、查询、在 web 中参数的传递和数据绑定等功能。jQuery EasyUI 可以方便地创建动态、快速、交互性强的系统。减少了类与类之间的命名冲突，充分说明本系统界面在技术方面
15、可行。2.1.2 房屋租赁管理系统界面经济可行性由于目前我国房地产事业蓬勃发展，房地产的租赁在国内呈现越演越烈之势，企业的想以最低的投入成本获得更高的管理利润，必须开发一个易于管理、维护费用低廉、界面友好、安全可靠的商务系统。因此 jQuery EasyUI 的开发简易性、灵活性尤其是经济方面可行迎合了这一开发前景，并且 jQuery EasyUI 是免费的。2.1.3 房屋租赁管理系统界面操作可行性该系统界面设计清晰，操作简洁，有完善的异常处理机制和提示信息机制，用户会感到所见即所得，因此操作方面可行。2.1.4 房屋租赁管理系统界面法律可行性本系统界面没有违反国家相关法律规定，法律方面可行
16、。2.2 房屋租赁管理系统界面显示功能分析本系统应具有如下界面显示功能：1.登录：由于在用户和相应的管理者在管理房源时，需要房源的详细信息或其他操作，所以需要客户和管理者先登录才可以对房源进行操作。在进入系统时进行确认时，系统会判断是不是本系统数据库内存在的用户，若不是本站客户，必须建立新帐号。2.主题：由于用户对界面的审视观点不同，喜欢的颜色也不同。在这里增加第 7 页 (共 53 页)主题更换，会使用户体验更好。3.导航目录浏览：若房屋租赁管理系统商品书目很多，这样就必须分类构建商品目录了，这样使用者就可以直观而又快速地浏览商品及进行相关操作。4.系统维护：系统维护主要是针对超级管理员设计
17、的，他可以管理整个软件，增加系统选项、系统操作维护、模块维护和菜单维护。将前台与后台写在同一个系统中，有利于管理维护。5.用户管理：可以管理用户。可对系统整个用户进行管理，很分配权限。6.房源的增删改查：本系统提供直观的对房源进行四大操作，不同身份的使用者可进行的操作有限。使用者可键入所要查询的房间名和房间编号。这样设计是为了用户能精确快速的找到自己所需的房源。7.房屋租赁：主要管理租退续方做处理。8.收费管理：是整个房源的费用处理位置。9.合同管理：合同是为了打印并给客户的，所以用列表显示。2.3 房屋租赁管理系统界面系统整体结构本系统界面整体结构如图 2-1 所示：图 2-1 系统界面整体
18、结构图2.4 房屋租赁管理系统界面开发环境1.本系统界面的硬件环境如下： 客户机：普通 PC第 8 页 (共 53 页) CPU：P4 1.8GHz 内存：256MB 以上 分辨率：推荐使用 1024*768 像素 WEB 服务器 CPU：P4 1.8GHz 内存：256MB 以上 数据库服务器 CPU：P4 1.8GHz 内存：256MB 以上2.本系统界面的硬件环境如下： 操作系统：WindowsXP/WIN7/WIN8 数据库：Mysql6.0 浏览器：IE9.0, 火狐浏览器2.5 房屋租赁管理系统界面业务流程图1、本系统界面业务操作员流程图如图 2-2 所示：第 9 页 (共 53
19、页)图 2-2 系统界面业务操作员业务流程图2、本系统界面管理员流程图如图 2-3 所示：第 10 页 (共 53 页)图 2-3 系统界面管理员业务流程图2.6 房屋租赁管理系统界面响应时间需求无论是客户端和管理端，当用户登录，进行任何操作的时候，系统应该及时的进行反应，反应的时间在 5 秒以内。系统应能监测出各种非正常情况，如与设备的通信中断，无法连接数据库服务器等，避免出现长时间等待甚至无响应。3 房屋租赁管理系统界面概要设计3.1 引言3.1.1 编写目的在房屋租售管理系统项目的前一阶段，也就是房屋租赁管理系统界面需求分析阶段中，已经将系统用户对本系统的界面需求做了详细的阐述，这些用户需求已经在房屋租赁管理系统界面需求分析中获得，并在需求分析中得到详尽得叙述及阐明。 本阶段已在系统界面的需求分析的基础上，对房屋租售管理系统做界面的概要设计。该部分是概要实际阶段的工作成果，它应说明界面对系统功能是如何展
