基于海南自贸港建设背景的房屋租赁管理系统设计

基于海南自贸港建设背景的房屋租赁管理系统设计目录1、绪论11.1研究背景11.2研究意义21.3国外研究现状31.4国内研究现状32、系统关键技术概述42.1VisualStudioCode编辑器42.2B/S架构42.3MySQL数据库42.4Node.js53、系统需求分析53.1系统总体功能需求53.2管理员功能需求63.3房东功能需求63.4租客功能需求74、系统设计74.1系统总体功能设计84.2管理员功能设计94.3房东功能设计94.4租客功能设计104.5数据库设计104.6系统安全性设计135、系统的实现135.1系统总体功能实现135.2管理员功能实现175.3房东功能实现205.4租客功能实现206、系统的测试21参考文献22致谢23———流动的背后少不了民生问题，特别是人们对住房的要求。现如今，经济飞速发展，各行各业都在因此欣欣向荣，其中房地产行业也是飞速发展[1]，而房屋租赁是房地产众多构成部分中最为常见的一种方式，随之而来的是市场需要更多的房屋租赁平台供人们选择。海南因此吃到额红利也不少，特别是在《海南自由贸易港建设总体方案》后，海南迎来了巨大的机遇。方案明确，中央支持海南建设全岛自由港，海南也会吸引不计其数的人才落户。那么，住房就成了首要问题。据不完全统计，我国房屋租赁市场在3万亿元以上，这个数据可以说是非常庞大了。对中低收入者来说高额的房价难以承担，退而求其次的选择就是租房，房屋租赁就有更大的市场。但是就我国目前的租赁市场而言，还存在着诸多问题，例如房价一直居高不下。通过政府颁布的各种法律规范及文件,不难看出住房买卖市场比租赁市场更受看中[2]。在房价一路攀升的背景下，租赁市场相较而言有更强的包容性，能解决很多家庭住房难的问题[3]。可见，设计房屋租赁管理系统有重要的现实意义。租赁市场存在的这些问题是可以用现在的技术手段实现的，让房屋租赁市场规范化、流程化、数据化[4]。1.2研究意义互联网技术蓬勃发展，我们的日常生活、学习工作也与之越来越密切，与我们生活息息相关的住房问题自然也要与互联网挂钩。在此背景下，利用先进的互联网技术设计一个房屋租赁管理系统有着重要意义。房屋的买卖、租赁是我国房地产市场的两个组成部分。而自98年改房以来，房屋买卖市场发展势头强劲，市场份额趋于饱和。而租赁市场发展缓慢，还有很大上升空间。在解决民众住房问题上，房屋租赁的重要程度不容小觑，完善和发展房屋租赁市场就是眼下必须要重视的问题，这对我国的经济发展也有着重大意义[5]。无论是以前找中介的租房方式，还是现在网络租房，都有各自的不足，需要通过政府、中介机构等各方人员的合作能之得到更全面的发展[6]。本文的重点是在网络租房方面。1.3国外研究现状城镇化加速的现在，稳定的住房是大部分普通人能有一个安稳有序生活的必要前提。在很多经济发达地区，有40%到60%的人没有自己的房子，他们无法负担昂贵的房价。在此背景下，房屋租赁自然而然成为了最合适的选择[7]。以纽约为例。纽约的租房市场大概分三种：政府补贴租房、市场价租房、政府调控价格租房。房屋租赁的主要组成部分是房东和租客，在以前，是手里有空闲房屋的房东和想租房的人直接交易，这种方式的弊端也不少，一方面，租客或许无法在短时间内找到自己满意的房屋，另一方面房东对接不到租客而导致手里的房屋空置，造成经济损失。再这样的背景下，第三方的中介由此应运而生，他们一面收集房东的房屋信息，一面寻找租客。中介要面临一个难题：房源的收集工作量巨大，需要耗费大量的人力物力。随着经济与科技迅速发展，以前人工收集与记录的方式无法应对现在信息爆炸的市场，且极易出差错，效率越来越低，弊端越来越明显，随之而来的是租赁市场的现代化、信息化、科技化，效率相对以前的传统方式有着绝对的优势[8]。1.4国内研究现状不平衡的城乡经济发展，导致大量农村及小城市的人员流入大城市工作和生活，特别是去往北京、上海、深圳等一线城市[9]。现在越来越多的大学生也选择留在大城市，这些都为大城市的房屋租赁市场带来了更多的机遇，促进了我国房屋租赁系统的发展与升级。我国的房屋发展有三个阶段。一阶段：20世纪90年代时期，房地产行业蓬勃发展，但是落后的行业信息水平阻碍了市场发展。房屋价格一路上涨，租房成了很多买不起房的人的选择。二阶段：我国加入WTO后，我国市场受到国外市场的冲击，加快了我国的房屋租赁管理系统的发展。三阶段：进入21世纪后，互联网技术进步，各种系统也在逐步完善。我国的许多学者都为此努力过，现在还有更多的学者在努力研发。例如：施磊设计的房屋租赁管理系统设是基于B/S架构，使用net技术[10]。尽管如此，我国现在的房屋租赁市场仍然存在许多问题：有房屋信息与实际对不上的情况，给租客的挑选工作加大了难度，大量难以分辨的房源信息让求租者无从下手。现在的市场依然缺少专业的管理人才。系统的信息化、规范化、专业化、数据化仍需进步。2.系统关键技术概述2.1VisualStudioCode编辑器VisualStudioCode是一款由微软开发且跨平台的免费源代码编辑器，简称VScode。VScode的代码和笔记都有高亮，而且支持终端和编辑器同框运行。它还有对Node.js的内置支持。同时它还有强大的搜索功能。VScode编辑器还支持多种语言的编写。2.2B/S架构B/S架构是指浏览器/服务器结构。B/S架构可分为三层：表现层，逻辑层，数据层。B/S架构统一了客户端，将核心部分集中在服务器，浏览器只处理一些小问题，节约了开发成本。数据都集中存放在数据库服务器，不会出现数据不一致的情况。而且更新很方便，只需要更新服务器端。2.3MySQL数据库MySQL是一个关系型数据库管理系统，它采用表的形式来储数据。MySQL是开源的，这意味着我们都能看到源代码，去研究它的原理，就能更快的发现并解决问题。而且MySQL是免费的，所以即使在某些功能方面MySQL还有不足，但是一般情况下已经够用了。2.4Node.jsNode.js是一个基于JavaScript运行时的开源、跨平台的软件平台。它的核心是基于GoogleChrome浏览器所采用的V8JavaScript引擎，它是⼀个⾮常快速和⾼效的引擎,能够快速解析和执⾏JavaScript代码。。Node.js的生态系统非常丰富，拥有大量的开源模块。开发人员可以通过npm快速安装和使用各种功能丰富的模块，从而提高开发效率。3.系统需求分析3.1系统总体功能需求通过对图3.1的梳理，明确系统的主要功能需求：用户管理，房屋管理，账单管理，信息审核，房屋管理下还分为三个小模块，出租，租房，租约。这几个模块是需要全部实现的。图3.1系统总体功能需求图3.2管理员功能需求通过图3.2可以看到，管理员的权限有四个大功能：用户管理，房屋管理，账单管理，信息审核。图3.2管理员功能需求图3.3房东功能需求通过图3.3，可以发现，房东的功能房屋管理和账单管理。房屋管理有:出租（上传房屋信息），租房，租约（查看合约）。账单管理有：查看自己的账单，删除自己的账单。图3.3房东功能需求图3.4租客功能需求通过图3.4，可以发现，租客拥有的权限最少，只能租房，查看合约，查看自己的账单，删除自己的账单。图3.4租客功能需求图4.系统设计4.1系统总体功能设计系统的需求分析是基于这个系统要实现什么样的功而能提出的解决方案，系统设计就是把前面提出的需求转为具体的实施过程，所以在此阶段我们需要确定系统的总体框架。本系统采用的是三层体系架构设计模式。系统从用户操作，逻辑处理和信息存储这三个方面进行设计。图4.1系统体系架构表示层：即用户操作层，用来展示用户界面，不同身份的用户拥有的权限不一样。它负责接收客户端的请求，提供不同的功能。业务逻辑层：是整个管理系统的中心，负责处理各种请求，响应用户操作。信息存储：即数据访问层，负责存储、管理所有的业务数据，这也是系统的底层业务架构。4.2管理员功能设计系统的管理功能在整个设计中是不可或缺的。控制器负责接收请求，如果用户发来的请求为被接受到，那么后面的工作也将无法进行。而用户管理、权限处理、信息删改等都需要向数据处理器发送请求信号。本系统对不同的人员有不同的权限，这里针对管理员列了一个时序图。图4.2权限信息时序图4.3房东功能设计房东拥有上传房源信息的权限。房东先登录系统，验明身份后进入系统，打开上传页面，输入自己的房源信息，点击提交。然后管理员会接收到这个申请，可以选择同意或者拒绝，这个结果也会同步在数据库更新，随后反馈给房东。同理，在房东进行租房、查看合约等操作时，系统的流程也是如此。图4.3房东权限时序图4.4租客功能设计租客的功能时序图与房东大致一样，只是没有上传房源信息的权限。在租客先登录系统，验证身份，成功后进入系统首页，在租房界面查看房屋信息，也可以通过位置查询挑选自己想租的地方附近的房屋。4.5数据库设计数据库的作用在保护、存储和管理系统信息方面。基于系统各项业务内容的安全性考虑，对数据库有着严格要求，要保证系统能及时、有效的处理各种信息。所以除整体构架外，数据库的设计工作也十分的重要。在整个过程中，重点在数据库实体方面。实体之间的联系可能是一对一，也可能是一对多，多对多。就比如一个用户，它对应着这个用户的用户名、ID等信息，一个房屋的背后对应着这个房屋的简介、价格、面积、图片、位置等等信息。如图所示。图4.5.1系统数据库E-R图数据库的表格也很重要。我们需要思考很多问题，例如不同属性的数据类型，数据的存储长度等。下面列了四个表。管理员信息表：在数据形式上包括了字段名称，数据类型；在数据内容上，包括了用户昵称，用户ID，用户身份。表4.5.2管理员信息表序号字段名称数据类型是否为空备注1UserNicknameNvarchar否用户昵称2UserIDNvarchar否用户ID3UserIdentityNvarchar否用户身份房东信息表：在数据形式上包括了字段名称，数据类型；在数据内容上，包括了用户昵称，用户ID，用户身份和联系方式。由于房东要提供房屋信息，方便租客联系，双方进行沟通，所以房东的信息表多了一栏联系方式。表4.5.3房东信息表序号字段名称数据类型是否为空备注1UserNicknameNvarchar否用户昵称2UserIDNvarchar否用户ID3UserIdentityNvarchar否用户身份4ContactInformationInteger否联系方式租客信息表：在数据形式上包括了字段名称，数据类型；在数据内容上，包括了用户昵称，用户ID，用户身份。表4.5.4租客信息表序号字段名称数据类型是否为空备注1UserNicknameNvarchar否用户昵称2UserIDNvarchar否用户ID3UserIdentityNvarchar否用户身份租客信息表：在数据形式上包括了字段名称，数据类型；在数据内容上，包括了房屋简介，图片，位置，价格，面积。表4.5.5房屋信息表序号字段名称数据类型是否为空备注1HouseDescriptionNvarchar否房屋简介2PictureNvarchar否图片3LocalNvarchar否位置4PriceBool否价格5AreaBool否面积4.6系统安全性设计系统的安全性分为程序安全性和数据安全性。程序安全性：重点在用户的密码，系统的权限管理方面。密码只有本人及管理员能看到，大大保障了用户的安全。系统的各方管理权限严格分明。数据安全性：本系统使用的是MySQL数据库，该数据库拥有多种数据保护机制，能有效的防止信息泄露。比如MySQL数据备份功能，可以对数据进行备份，防止意外的数据丢失，保障正常的工作。5.系统的实现5.1系统总体功能实现打开网站，是一个简洁的登录页面。图5.1.1系统登录页面代码方面：<el-form-itemlabel="user:"prop="username"><el-inputv-model="loginForm.username"placeholder="pleaseenterusername"></el-input>

</el-form-item>

<el-form-itemlabel="pass:"prop="password">

<el-inputv-model="loginForm.password"type="password"placeholder="pleaseenterpassword">这一段对应的是登录界面的“输入用户名和密码”。<el-buttontype="primary"class="loginBtn"@click="loginVaild">登录这一句对应的是输入完账号密码后的“登录”。<el-buttontype="text"@click="registDialogVisible=true">没有账号？>这一句是为了解决新用户没有账号的问题。以下是注册账号的代码：

<el-formref="registForm":rules="registForm":model="registForm"class="registForm"id="form">

<el-form-itemlabel="用户名称:"prop="username">

<el-inputv-model="registForm.username"></el-input>这一句是注册账号时要填写的用户名称（相当于账号名）。设定密码和填写用户名（用户昵称）的代码逻辑基本一致，稍作更改即可。

<el-form-itemlabel="身份:">

<el-radio-groupv-model="registForm.identity">

<el-radiolabel="租客"></el-radio>

<el-radiolabel="房东"></el-radio>

选择自己的身份，房东或是租客。

<el-button@click="registDialogVisible=false">取消</el-button>

<el-buttontype="primary"@click="submit">提交</el-button>

所有信息填完之后，不想注册可以点击取消，确认要注册就提交。提交后会返回登录界面，这时就能用刚注册的账号了。图5.1.2账号注册图图5.1.3用户登录流程图进入系统后，先看到的是系统首页，首页能看到用户数量，成交量，待出租房源等信息。<divclass="card-panel-description">

<divclass="card-panel-text">

用户数量

</div>

<count-to:start-val="0":end-val="102400":duration="2600"class="card-panel-num"/>这一段表现的是主页出现的用户数量。主页展示的用户数量、留言量、平均租金、成交量，在逻辑上都是一样的，只需要更改其中的文字和数字就行。左边是总体功能模块：用户管理，我的出租，我的租约，我要租房，账单管理，信息审核。当然，不同的身份角色拥有的权限也不一样。在每个模块的代码编辑时就明确了可以使用这个模块的角色。

path:'/home',

name:'home',

show:true,

component:()=>import('../views/home/index.vue'),

meta:{title:'首页',roles:['房东','租客','管理员'],icon:'el-icon-menu'}这部分体现的左侧的“首页”，“roles”里的角色表示的是能使用该模块的用户身份，显然，“房东，租客，管理员”都可以使用首页。path:'/uermanage',

name:'uermanage',

show:true,

component:()=>import('../views/uermanage/index.vue'),

meta:{title:'用户管理',roles:['管理员'],icon:'el-icon-s-tools'}这一段体现的系统的用户管理模块，“roles”里只包含管理员，显而易见，这个模块的功能仅管理员可用。其他模块：我的出租，我的租约，我要租房，账单管理，信息审核的代码的逻辑与上面一致，只需要更改“title”和“roles”里的文字即可实现。

图5.1.4系统首页5.2管理员功能实现在用户管理模块，管理员能新增用户，删除用户，修改用户信息，通过昵称查找用户。修改里包括用户的昵称，密码，权限。以下是用户管理界面的部分代码：<el-dialog

title="新增"

:visible.sync="registDialogVisible"

width="30%">管理员新增用户，要填写用户的信息，这里的代码与前面注册账号时的代码基本一致，就不列出来了。将title="新增":visible.sync="registDialogVisible"更改为title="修改":visible.sync="editDialogVisible"，就是管理员修改用户信息的代码，但是这里的修改可以将用户的权限修改为管理员，加了一行代码“<el-radiolabel="管理员"></el-radio>”。图5.2.1用户管理流程图图5.2.2用户管理页面在我的出租模块里，管理员与房东一样能上传房屋资料，包括：房屋简介，面积，标签，图片，价格，位置，联系电话，联系人。以下是上传房屋信息的部分代码：<el-formref="addForm":rules="addForm":model="addForm"class="addForm"id="form">

<el-form-itemlabel="房屋简介:"prop="name">

<el-inputv-model="addF"></el-input>这里体现的是“房屋简介”，要体现后面的面积、价格等，只需要将“label”、“prop”、“v-model”更改为对应的中英文即可。图5.2.3我的出租页面在我的租约界面，管理员可以看到所有的租约，还能进行租约的增添、修改、删除、查找。要新增租约就要填写该房屋的基本信息，这里的代码与前面新增房屋一致，但是新增租约可以上传一份合同文件，只需要加上下面这段代码，就可实现：<el-form-itemlabel="添加合同文件:">

<el-upload

class="upload-demo"

action="http://localhost:3333/api/sys_rental/upload-pdf"

:limit="1"

accept=".pdf"

:on-exceed="handleExceed">

<el-buttonsize="small"type="primary">点击上传</el-button>

<divslot="tip"class="el-upload__tip">只能上传pdf文件，且不超过500kb</div>在我要租房界面，会显示所有的待出租房源，可以通过位置查询自己想租住的地方附近的房屋，然后挑选满意的房屋并与房东联系。在账单管理界面，管理员能看到交易的所有账单，会显示这笔账单是收入还是支出，可以查询，修改和删除。在信息审核界面，管理员需要处理房东申请的房源信息，选择通过或者拒绝。5.3房东功能实现房东进入系统后，虽然也能看到所有的功能模块，但是点开用户管理或是信息审核，就会提示你的权限不足。房东能正常操作的就是首页，我的出租，我的租约，我要租房，账单管理。这些在上一节已经叙述过。图5.3房东打开用户管理显示权限不足5.4租客功能实现租客可以使用的功能有：我的租约，我要租房，账单管理，这些模块，租客都有权限。而点开我的出租时，系统会提示权限不足。图5.4.1租客打开我的出租显示权限不足如果根据房源信息上提供的房东的联系方式，房东和租客达成了交易，租客就可以在我的租约界面添加交易的信息，并上传合同文件。图5.4.2租约填写页面6.系统的测试测试是为了检测系统的功能是否符合预期的效果。检查系统是否还有未解决的问题。以房东身份进行房屋信息测试:表6.1房屋管理测试表测试数量测试操作是否需要管理员审核管理员是否通过信息是否回馈是否符合预期结果1上传房屋信息是是是符合2上传房屋信息是否是符合3修改房屋信息否/是符合4回收房屋信息否/