基于海南自貿港建設背景的房屋租賃管理系統(tǒng)設計

基于海南自貿港建設背景的房屋租賃管理系統(tǒng)設計目錄1、緒論11.1研究背景11.2研究意義21.3國外研究現(xiàn)狀31.4國內研究現(xiàn)狀32、系統(tǒng)關鍵技術概述42.1VisualStudioCode編輯器42.2B/S架構42.3MySQL數(shù)據(jù)庫42.4Node.js53、系統(tǒng)需求分析53.1系統(tǒng)總體功能需求53.2管理員功能需求63.3房東功能需求63.4租客功能需求74、系統(tǒng)設計74.1系統(tǒng)總體功能設計84.2管理員功能設計94.3房東功能設計94.4租客功能設計104.5數(shù)據(jù)庫設計104.6系統(tǒng)安全性設計135、系統(tǒng)的實現(xiàn)135.1系統(tǒng)總體功能實現(xiàn)135.2管理員功能實現(xiàn)175.3房東功能實現(xiàn)205.4租客功能實現(xiàn)206、系統(tǒng)的測試21參考文獻22致謝23———流動的背后少不了民生問題，特別是人們對住房的要求?，F(xiàn)如今，經濟飛速發(fā)展，各行各業(yè)都在因此欣欣向榮，其中房地產行業(yè)也是飛速發(fā)展[1]，而房屋租賃是房地產眾多構成部分中最為常見的一種方式，隨之而來的是市場需要更多的房屋租賃平臺供人們選擇。海南因此吃到額紅利也不少，特別是在《海南自由貿易港建設總體方案》后，海南迎來了巨大的機遇。方案明確，中央支持海南建設全島自由港，海南也會吸引不計其數(shù)的人才落戶。那么，住房就成了首要問題。據(jù)不完全統(tǒng)計，我國房屋租賃市場在3萬億元以上，這個數(shù)據(jù)可以說是非常龐大了。對中低收入者來說高額的房價難以承擔，退而求其次的選擇就是租房，房屋租賃就有更大的市場。但是就我國目前的租賃市場而言，還存在著諸多問題，例如房價一直居高不下。通過政府頒布的各種法律規(guī)范及文件,不難看出住房買賣市場比租賃市場更受看中[2]。在房價一路攀升的背景下，租賃市場相較而言有更強的包容性，能解決很多家庭住房難的問題[3]?？梢?，設計房屋租賃管理系統(tǒng)有重要的現(xiàn)實意義。租賃市場存在的這些問題是可以用現(xiàn)在的技術手段實現(xiàn)的，讓房屋租賃市場規(guī)范化、流程化、數(shù)據(jù)化[4]。1.2研究意義互聯(lián)網(wǎng)技術蓬勃發(fā)展，我們的日常生活、學習工作也與之越來越密切，與我們生活息息相關的住房問題自然也要與互聯(lián)網(wǎng)掛鉤。在此背景下，利用先進的互聯(lián)網(wǎng)技術設計一個房屋租賃管理系統(tǒng)有著重要意義。房屋的買賣、租賃是我國房地產市場的兩個組成部分。而自98年改房以來，房屋買賣市場發(fā)展勢頭強勁，市場份額趨于飽和。而租賃市場發(fā)展緩慢，還有很大上升空間。在解決民眾住房問題上，房屋租賃的重要程度不容小覷，完善和發(fā)展房屋租賃市場就是眼下必須要重視的問題，這對我國的經濟發(fā)展也有著重大意義[5]。無論是以前找中介的租房方式，還是現(xiàn)在網(wǎng)絡租房，都有各自的不足，需要通過政府、中介機構等各方人員的合作能之得到更全面的發(fā)展[6]。本文的重點是在網(wǎng)絡租房方面。1.3國外研究現(xiàn)狀城鎮(zhèn)化加速的現(xiàn)在，穩(wěn)定的住房是大部分普通人能有一個安穩(wěn)有序生活的必要前提。在很多經濟發(fā)達地區(qū)，有40%到60%的人沒有自己的房子，他們無法負擔昂貴的房價。在此背景下，房屋租賃自然而然成為了最合適的選擇[7]。以紐約為例。紐約的租房市場大概分三種：政府補貼租房、市場價租房、政府調控價格租房。房屋租賃的主要組成部分是房東和租客，在以前，是手里有空閑房屋的房東和想租房的人直接交易，這種方式的弊端也不少，一方面，租客或許無法在短時間內找到自己滿意的房屋，另一方面房東對接不到租客而導致手里的房屋空置，造成經濟損失。再這樣的背景下，第三方的中介由此應運而生，他們一面收集房東的房屋信息，一面尋找租客。中介要面臨一個難題：房源的收集工作量巨大，需要耗費大量的人力物力。隨著經濟與科技迅速發(fā)展，以前人工收集與記錄的方式無法應對現(xiàn)在信息爆炸的市場，且極易出差錯，效率越來越低，弊端越來越明顯，隨之而來的是租賃市場的現(xiàn)代化、信息化、科技化，效率相對以前的傳統(tǒng)方式有著絕對的優(yōu)勢[8]。1.4國內研究現(xiàn)狀不平衡的城鄉(xiāng)經濟發(fā)展，導致大量農村及小城市的人員流入大城市工作和生活，特別是去往北京、上海、深圳等一線城市[9]。現(xiàn)在越來越多的大學生也選擇留在大城市，這些都為大城市的房屋租賃市場帶來了更多的機遇，促進了我國房屋租賃系統(tǒng)的發(fā)展與升級。我國的房屋發(fā)展有三個階段。一階段：20世紀90年代時期，房地產行業(yè)蓬勃發(fā)展，但是落后的行業(yè)信息水平阻礙了市場發(fā)展。房屋價格一路上漲，租房成了很多買不起房的人的選擇。二階段：我國加入WTO后，我國市場受到國外市場的沖擊，加快了我國的房屋租賃管理系統(tǒng)的發(fā)展。三階段：進入21世紀后，互聯(lián)網(wǎng)技術進步，各種系統(tǒng)也在逐步完善。我國的許多學者都為此努力過，現(xiàn)在還有更多的學者在努力研發(fā)。例如：施磊設計的房屋租賃管理系統(tǒng)設是基于B/S架構，使用net技術[10]。盡管如此，我國現(xiàn)在的房屋租賃市場仍然存在許多問題：有房屋信息與實際對不上的情況，給租客的挑選工作加大了難度，大量難以分辨的房源信息讓求租者無從下手?，F(xiàn)在的市場依然缺少專業(yè)的管理人才。系統(tǒng)的信息化、規(guī)范化、專業(yè)化、數(shù)據(jù)化仍需進步。2.系統(tǒng)關鍵技術概述2.1VisualStudioCode編輯器VisualStudioCode是一款由微軟開發(fā)且跨平臺的免費源代碼編輯器，簡稱VScode。VScode的代碼和筆記都有高亮，而且支持終端和編輯器同框運行。它還有對Node.js的內置支持。同時它還有強大的搜索功能。VScode編輯器還支持多種語言的編寫。2.2B/S架構B/S架構是指瀏覽器/服務器結構。B/S架構可分為三層：表現(xiàn)層，邏輯層，數(shù)據(jù)層。B/S架構統(tǒng)一了客戶端，將核心部分集中在服務器，瀏覽器只處理一些小問題，節(jié)約了開發(fā)成本。數(shù)據(jù)都集中存放在數(shù)據(jù)庫服務器，不會出現(xiàn)數(shù)據(jù)不一致的情況。而且更新很方便，只需要更新服務器端。2.3MySQL數(shù)據(jù)庫MySQL是一個關系型數(shù)據(jù)庫管理系統(tǒng)，它采用表的形式來儲數(shù)據(jù)。MySQL是開源的，這意味著我們都能看到源代碼，去研究它的原理，就能更快的發(fā)現(xiàn)并解決問題。而且MySQL是免費的，所以即使在某些功能方面MySQL還有不足，但是一般情況下已經夠用了。2.4Node.jsNode.js是一個基于JavaScript運行時的開源、跨平臺的軟件平臺。它的核心是基于GoogleChrome瀏覽器所采用的V8JavaScript引擎，它是?個??？焖俸?效的引擎,能夠快速解析和執(zhí)?JavaScript代碼。。Node.js的生態(tài)系統(tǒng)非常豐富，擁有大量的開源模塊。開發(fā)人員可以通過npm快速安裝和使用各種功能豐富的模塊，從而提高開發(fā)效率。3.系統(tǒng)需求分析3.1系統(tǒng)總體功能需求通過對圖3.1的梳理，明確系統(tǒng)的主要功能需求：用戶管理，房屋管理，賬單管理，信息審核，房屋管理下還分為三個小模塊，出租，租房，租約。這幾個模塊是需要全部實現(xiàn)的。圖3.1系統(tǒng)總體功能需求圖3.2管理員功能需求通過圖3.2可以看到，管理員的權限有四個大功能：用戶管理，房屋管理，賬單管理，信息審核。圖3.2管理員功能需求圖3.3房東功能需求通過圖3.3，可以發(fā)現(xiàn)，房東的功能房屋管理和賬單管理。房屋管理有:出租（上傳房屋信息），租房，租約（查看合約）。賬單管理有：查看自己的賬單，刪除自己的賬單。圖3.3房東功能需求圖3.4租客功能需求通過圖3.4，可以發(fā)現(xiàn)，租客擁有的權限最少，只能租房，查看合約，查看自己的賬單，刪除自己的賬單。圖3.4租客功能需求圖4.系統(tǒng)設計4.1系統(tǒng)總體功能設計系統(tǒng)的需求分析是基于這個系統(tǒng)要實現(xiàn)什么樣的功而能提出的解決方案，系統(tǒng)設計就是把前面提出的需求轉為具體的實施過程，所以在此階段我們需要確定系統(tǒng)的總體框架。本系統(tǒng)采用的是三層體系架構設計模式。系統(tǒng)從用戶操作，邏輯處理和信息存儲這三個方面進行設計。圖4.1系統(tǒng)體系架構表示層：即用戶操作層，用來展示用戶界面，不同身份的用戶擁有的權限不一樣。它負責接收客戶端的請求，提供不同的功能。業(yè)務邏輯層：是整個管理系統(tǒng)的中心，負責處理各種請求，響應用戶操作。信息存儲：即數(shù)據(jù)訪問層，負責存儲、管理所有的業(yè)務數(shù)據(jù)，這也是系統(tǒng)的底層業(yè)務架構。4.2管理員功能設計系統(tǒng)的管理功能在整個設計中是不可或缺的?？刂破髫撠熃邮照埱螅绻脩舭l(fā)來的請求為被接受到，那么后面的工作也將無法進行。而用戶管理、權限處理、信息刪改等都需要向數(shù)據(jù)處理器發(fā)送請求信號。本系統(tǒng)對不同的人員有不同的權限，這里針對管理員列了一個時序圖。圖4.2權限信息時序圖4.3房東功能設計房東擁有上傳房源信息的權限。房東先登錄系統(tǒng)，驗明身份后進入系統(tǒng)，打開上傳頁面，輸入自己的房源信息，點擊提交。然后管理員會接收到這個申請，可以選擇同意或者拒絕，這個結果也會同步在數(shù)據(jù)庫更新，隨后反饋給房東。同理，在房東進行租房、查看合約等操作時，系統(tǒng)的流程也是如此。圖4.3房東權限時序圖4.4租客功能設計租客的功能時序圖與房東大致一樣，只是沒有上傳房源信息的權限。在租客先登錄系統(tǒng)，驗證身份，成功后進入系統(tǒng)首頁，在租房界面查看房屋信息，也可以通過位置查詢挑選自己想租的地方附近的房屋。4.5數(shù)據(jù)庫設計數(shù)據(jù)庫的作用在保護、存儲和管理系統(tǒng)信息方面。基于系統(tǒng)各項業(yè)務內容的安全性考慮，對數(shù)據(jù)庫有著嚴格要求，要保證系統(tǒng)能及時、有效的處理各種信息。所以除整體構架外，數(shù)據(jù)庫的設計工作也十分的重要。在整個過程中，重點在數(shù)據(jù)庫實體方面。實體之間的聯(lián)系可能是一對一，也可能是一對多，多對多。就比如一個用戶，它對應著這個用戶的用戶名、ID等信息，一個房屋的背后對應著這個房屋的簡介、價格、面積、圖片、位置等等信息。如圖所示。圖4.5.1系統(tǒng)數(shù)據(jù)庫E-R圖數(shù)據(jù)庫的表格也很重要。我們需要思考很多問題，例如不同屬性的數(shù)據(jù)類型，數(shù)據(jù)的存儲長度等。下面列了四個表。管理員信息表：在數(shù)據(jù)形式上包括了字段名稱，數(shù)據(jù)類型；在數(shù)據(jù)內容上，包括了用戶昵稱，用戶ID，用戶身份。表4.5.2管理員信息表序號字段名稱數(shù)據(jù)類型是否為空備注1UserNicknameNvarchar否用戶昵稱2UserIDNvarchar否用戶ID3UserIdentityNvarchar否用戶身份房東信息表：在數(shù)據(jù)形式上包括了字段名稱，數(shù)據(jù)類型；在數(shù)據(jù)內容上，包括了用戶昵稱，用戶ID，用戶身份和聯(lián)系方式。由于房東要提供房屋信息，方便租客聯(lián)系，雙方進行溝通，所以房東的信息表多了一欄聯(lián)系方式。表4.5.3房東信息表序號字段名稱數(shù)據(jù)類型是否為空備注1UserNicknameNvarchar否用戶昵稱2UserIDNvarchar否用戶ID3UserIdentityNvarchar否用戶身份4ContactInformationInteger否聯(lián)系方式租客信息表：在數(shù)據(jù)形式上包括了字段名稱，數(shù)據(jù)類型；在數(shù)據(jù)內容上，包括了用戶昵稱，用戶ID，用戶身份。表4.5.4租客信息表序號字段名稱數(shù)據(jù)類型是否為空備注1UserNicknameNvarchar否用戶昵稱2UserIDNvarchar否用戶ID3UserIdentityNvarchar否用戶身份租客信息表：在數(shù)據(jù)形式上包括了字段名稱，數(shù)據(jù)類型；在數(shù)據(jù)內容上，包括了房屋簡介，圖片，位置，價格，面積。表4.5.5房屋信息表序號字段名稱數(shù)據(jù)類型是否為空備注1HouseDescriptionNvarchar否房屋簡介2PictureNvarchar否圖片3LocalNvarchar否位置4PriceBool否價格5AreaBool否面積4.6系統(tǒng)安全性設計系統(tǒng)的安全性分為程序安全性和數(shù)據(jù)安全性。程序安全性：重點在用戶的密碼，系統(tǒng)的權限管理方面。密碼只有本人及管理員能看到，大大保障了用戶的安全。系統(tǒng)的各方管理權限嚴格分明。數(shù)據(jù)安全性：本系統(tǒng)使用的是MySQL數(shù)據(jù)庫，該數(shù)據(jù)庫擁有多種數(shù)據(jù)保護機制，能有效的防止信息泄露。比如MySQL數(shù)據(jù)備份功能，可以對數(shù)據(jù)進行備份，防止意外的數(shù)據(jù)丟失，保障正常的工作。5.系統(tǒng)的實現(xiàn)5.1系統(tǒng)總體功能實現(xiàn)打開網(wǎng)站，是一個簡潔的登錄頁面。圖5.1.1系統(tǒng)登錄頁面代碼方面：<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用戶登錄流程圖進入系統(tǒng)后，先看到的是系統(tǒng)首頁，首頁能看到用戶數(shù)量，成交量，待出租房源等信息。<divclass="card-panel-description">

<divclass="card-panel-text">

用戶數(shù)量

</div>

<count-to:start-val="0":end-val="102400":duration="2600"class="card-panel-num"/>這一段表現(xiàn)的是主頁出現(xiàn)的用戶數(shù)量。主頁展示的用戶數(shù)量、留言量、平均租金、成交量，在邏輯上都是一樣的，只需要更改其中的文字和數(shù)字就行。左邊是總體功能模塊：用戶管理，我的出租，我的租約，我要租房，賬單管理，信息審核。當然，不同的身份角色擁有的權限也不一樣。在每個模塊的代碼編輯時就明確了可以使用這個模塊的角色。

path:'/home',

name:'home',

show:true,

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

meta:{title:'首頁',roles:['房東','租客','管理員'],icon:'el-icon-menu'}這部分體現(xiàn)的左側的“首頁”，“roles”里的角色表示的是能使用該模塊的用戶身份，顯然，“房東，租客，管理員”都可以使用首頁。path:'/uermanage',

name:'uermanage',

show:true,

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

meta:{title:'用戶管理',roles:['管理員'],icon:'el-icon-s-tools'}這一段體現(xiàn)的系統(tǒng)的用戶管理模塊，“roles”里只包含管理員，顯而易見，這個模塊的功能僅管理員可用。其他模塊：我的出租，我的租約，我要租房，賬單管理，信息審核的代碼的邏輯與上面一致，只需要更改“title”和“roles”里的文字即可實現(xiàn)。

圖5.1.4系統(tǒng)首頁5.2管理員功能實現(xiàn)在用戶管理模塊，管理員能新增用戶，刪除用戶，修改用戶信息，通過昵稱查找用戶。修改里包括用戶的昵稱，密碼，權限。以下是用戶管理界面的部分代碼：<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用戶管理頁面在我的出租模塊里，管理員與房東一樣能上傳房屋資料，包括：房屋簡介，面積，標簽，圖片，價格，位置，聯(lián)系電話，聯(lián)系人。以下是上傳房屋信息的部分代碼：<el-formref="addForm":rules="addForm":model="addForm"class="addForm"id="form">

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

<el-inputv-model="addF"></el-input>這里體現(xiàn)的是“房屋簡介”，要體現(xiàn)后面的面積、價格等，只需要將“l(fā)abel”、“prop”、“v-model”更改為對應的中英文即可。圖5.2.3我的出租頁面在我的租約界面，管理員可以看到所有的租約，還能進行租約的增添、修改、刪除、查找。要新增租約就要填寫該房屋的基本信息，這里的代碼與前面新增房屋一致，但是新增租約可以上傳一份合同文件，只需要加上下面這段代碼，就可實現(xiàn)：<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>在我要租房界面，會顯示所有的待出租房源，可以通過位置查詢自己想租住的地方附近的房屋，然后挑選滿意的房屋并與房東聯(lián)系。在賬單管理界面，管理員能看到交易的所有賬單，會顯示這筆賬單是收入還是支出，可以查詢，修改和刪除。在信息審核界面，管理員需要處理房東申請的房源信息，選擇通過或者拒絕。5.3房東功能實現(xiàn)房東進入系統(tǒng)后，雖然也能看到所有的功能模塊，但是點開用戶管理或是信息審核，就會提示你的權限不足。房東能正常操作的就是首頁，我的出租，我的租約，我要租房，賬單管理。這些在上一節(jié)已經敘述過。圖5.3房東打開用戶管理顯示權限不足5.4租客功能實現(xiàn)租客可以使用的功能有：我的租約，我要租房，賬單管理，這些模塊，租客都有權限。而點開我的出租時，系統(tǒng)會提示權限不足。圖5.4.1租客打開我的出租顯示權限不足如果根據(jù)房源信息上提供的房東的聯(lián)系方式，房東和租客達成了交易，租客就可以在我的租約界面添加交易的信息，并上傳合同文件。圖5.4.2租約填寫頁面6.系統(tǒng)的測試測試是為了檢測系統(tǒng)的功能是否符合預期的效果。檢查系統(tǒng)是否還有未解決的問題。以房東身份進行房屋信息測試:表6.1房屋管理測試表測試數(shù)量測試操作是否需要管理員審核管理員是否通過信息是否回饋是否符合預期結果1上傳房屋信息是是是符合2上傳房屋信息是否是符合3修改房屋信息否/是符合4回收房屋信息否/