物业管理系统论文
內容摘要
近年來,隨著網絡技術的迅猛發展,高速流通的時代,計算機的普及以及計算機網絡技術的應用,讓大量普通人能夠有機會接觸到比以往更多的知識。作為一個以傳播知識為主要職能的機構——學校,建立一個網校管理系統是十分必要的事情,這不僅能使更多的人享用寶貴的教育資料源,同時也對于提升學校自身的知名度,提高學生自學能力,有相當大的幫助。
隨著互聯網技術的飛速發展,利用網絡進行輔助教學已經成為時代發展的必然趨勢,建立網校管理系統,盡可能提高優質教學的利用率,對實現人才培養,促進社會經濟發展都能起到十分重要的作用。也可以引導用戶主動年該學習,提高學習效率,更為教學雙方提供一個信息共享與信息交流的平臺。
針對以上問題,前臺主要使用JavaScript作為開發語言,后臺使用MySQL作為數據庫管理系統,設計開發了物業管理系統。
關鍵詞: 物業管理,WEB,數據庫,vue
一、緒論
(一)選題背景簡介
隨著互聯網技術的飛速發展,利用網絡進行輔助教學已經成為時代發展的必然趨勢,建立網校管理系統,盡可能提高優質教學的利用率,對實現人才培養,促進社會經濟發展都能起到十分重要的作用。也可以引導用戶主動年該學習,提高學習效率,更為教學雙方提供一個進行寫作學習和交流的平臺。
人口多而教育資源缺乏影響著我國受過高等教育的人在人口比例中所占的比重,這嚴重的制約了我國社會的發展與進步,這對于提高我國國民的文化科學素養十分不利。怎樣才能讓更多的人享有少部分人擁有的精品教育資源呢?對于這個問題,前人已經做了大量的研究。隨著計算機技術以及計算機網絡技術的飛速發展,人們終于找到了一條實現這種夢想的捷徑,那就是寄希望于把各種教育資源移置到互聯網上去,使得各地方的人都能夠方便的獲取到各種自己想要的知識,打破傳統教育資源分配不均的限制,使得更多的人能夠有機會獲取到知識。
近年來,學校學生的數量逐漸增加,人工書寫教學的方式已經不能滿足如此龐大的數據。為了更好的適應信息時代的高效性,一個利用計算機來實現網校管理工作的系統將必然誕生。基于這一點,設計了一個網校管理系統以便在最短的時間內,高效準確的完成整個教學過程。
(二)目的和意義
與傳統的教育相比,網校管理系統是一種全新的教育模式,它可以突破時間和空間的限制,讓更多的學習者共享優秀的教育資源。網校管理系統既具有開放性、交互性、協作性和自主性等特點,有具有異步性、實時性、生動性、集成性和大容量等優勢。因此在網校管理系統的建設中,單純地構建各種功能單一的系統并不能完全滿足網校管理系統建設的要求,只有那些對數據和信息進行有效組織,整合了多種業務,為用戶提供個性化服務的系統才能充分地發揮網校管理系統的作用。
建設網校管理系統的根本目的是利用現代化的教育信息技術手段將網校管理系統的相關內容上網并免費開放,以實現優質教學資源共享,提高高等學校教學質量和人才培養質量。
二 技術簡介
(一) HTML5技術簡介
HTML5 將成為 HTML、XHTML 以及 HTML DOM 的新標準。HTML 的上一個版本誕生于 1999
年。自從那以后,Web 世界已經經歷了巨變。HTML5
仍處于完善之中。然而,大部分現代瀏覽器已經具備了某些 HTML5 支持。
(二)ES6簡介
ECMAScript
6(以下簡稱ES6)是JavaScript語言的下一代標準,于2015年6月批準通過。ECMAScript6的目標,是使得JavaScript語言可以用來編寫復雜的大型應用程序,成為企業級開發語言。讓代碼更加準確,更易于閱讀。
ECMAScript是JavaScript語言的國際標準,JavaScript是ECMAScript的實現(ES是規范,JS是實現)。在日常場合,這兩個詞是可以互換的。
(三)Vue-cli 3.0
Vue CLI 是一個基于 Vue.js 進行快速開發的完整系統
(四)Koa2
Koa 是一個新的 web 框架,由 Express 幕后的原班人馬打造, 致力于成為 web 應用和
API 開發領域中的一個更小、更富有表現力、更健壯的基石。 通過利用 async 函數,Koa
幫你丟棄回調函數,并有力地增強錯誤處理。 Koa 并沒有捆綁任何中間件,
而是提供了一套優雅的方法,幫助您快速而愉快地編寫服務端應用程序。
(五)Vuex
Vuex 是一個專為 Vue.js
應用程序開發的狀態管理模式。它采用集中式存儲管理應用的所有組件的狀態,并以相應的規則保證狀態以一種可預測的方式發生變化。Vuex
也集成到 Vue 的官方調試工具 devtools extension,提供了諸如零配置的 time-travel
調試、狀態快照導入導出等高級調試功能。
(六)iView
iView 是一套基于 Vue.js 的開源 UI 組件庫,主要服務于 PC 界面的中后臺產品。
(七)MySQL
Mysql是最流行的關系型數據庫管理系統,在WEB應用方面MySQL是最好的RDBMS(Relational
Database Management System:關系數據庫管理系統)應用軟件之一。
在本教程中,會讓大家快速掌握Mysql的基本知識,并輕松使用Mysql數據庫。
(八)Navicat
Navicat
是一套能幫助你快速直觀地構建精確模型的圖形化工具,使各個層面的用戶都能輕松地創建高品質的數據模型。它能為專業人士提供適合其特殊需要的復雜功能,但是對數據模型的新手來說又相當容易上手。
創建一個優良的數據模型可以是很困難的。我們將一切保持簡單方便,讓你專注于你的數據庫設計,而不會令得它變得更復雜。
為了讓你無需花費時間學習,便能對你的模型有一個簡單而精確的了解,Navicat
擁有難以置信的迅速反應和簡潔美觀的設計,大大增強了其性能和可用性。
再加上準確的字段類型預測功能和無限次的撤消或重做功能,它就能減省開發所需的時間并提供一個快捷高效的方式來創建和編輯你的表或視圖結構。
無論你是想從一個數據模型創建新的數據庫,或者從現有數據庫導入數據模型。Navicat
Data Modeler 就是你所需要的工具。
(九)VScode
Visual Studio
Code(以下簡稱vscode)是一個輕量且強大的代碼編輯器,支持Windows,OS
X和Linux。內置JavaScript、TypeScript和Node.js支持,而且擁有豐富的插件生態系統,可通過安裝插件來支持C++、C#、Python、PHP等其他語言。
據vscode的作者介紹,這款產品可能是微軟第一款支持Linux的產品。
微軟對于vscode的定位如下圖,位于編輯器與IDE之間,但是更像一個編輯器。有人說是披著編輯器外衣的IDE,我覺得是披著IDE外衣的編輯器。
深入了解了vscode之后發現了vscode很貼心地內置了很多功能,讓我覺得我可以很快適應到vscode的使用。
三、系統概要設計
系統的設計主要前臺和后臺兩個部分
前臺客戶端是展現給用戶的,包括登錄注冊、查看個人房間信息、查看家庭報修信息、報修故障、撤銷報修、在線繳費、查看家庭成員、審核家庭成員、刪除家庭成員、查看與編輯個人信息。
后臺管理端是物業管理人員使用的,包括管理員登入與登出、修改個人信息、查看與篩選房間信息、新增業主、
系統需求分析
物業管理端
1. 登錄/登出
2. 房間管理
(1) 為房間添加業主信息
(2) 條件篩選房間
3. 業主管理
(1) 編輯/刪除業主信息
(2) 編輯/刪除家庭成員信息
4. 報修管理
(1) 查看報修列表
(2) 報修狀態篩選
(3) 查看具體報修內容
(4) 更改報修進度:已聯系、已派修、已維修(更改為已維修時錄入維修費用)、已繳費
5. 零件管理
(1) 對零件增刪改查,出庫
(2) 對零件類型增刪改查
6. 管理員管理
(1) 新增/查看管理員
業主端
1. 登錄/登出(判斷是否為業主,若為業主添加審核家庭成員權限)
2. 注冊(注冊成功后須業主審核后才可登錄)
3. 修改個人信息
4. 業主查看家庭報修列表
5. 普通用戶查看個人報修列表
6. 支付維修費用
(二)可行性分析
這里講的可行性分析的任務是從技術上、經濟上分析需解決的問題是否存在可行性。其目的是在盡可能短的時間內用盡可能小的代價確定問題是否有解。
1.技術可行性
技術上的可行性分析主要分析技術條件能否順利完成開發工作,硬、軟件能否滿足開發者的需要等。
本系統前端設計主要由Vue.js實現,vue
的開發體驗是非常令人感到愉悅的。Vue在數據交互,組件化開發方面有非常大的優勢,每個組件都是一個.vue文件,可以把頁面拆成很多組件,方便開發與維護,使用時只需引入組件即可,通過vue-router實現路由跳轉,可以很容易地創建單頁面應用程序,只需要把vue-router添加到vue工程中,將組件(components)映射到路由(routes),然后告訴
vue-router 在哪里渲染它們。
本系統數據庫使用的MySQL,MySQL是最流行的關系型數據庫管理系統,在WEB應用方面MySQL是最好的關系型數據庫,輕量、開源、簡便易用,使用Navicat
Premium 12做數據庫圖形化管理更高效率進行前后端開發
2.經濟可行性
如今是信息化時代,信息化管理可以使物業的管理工作更加系統化、快速化、全面化。這樣可以為社會帶來較高的工作效益和經濟效益,本系統對計算機配置的要求不高,普通私人電腦都可以完全滿足需要,本系統作為一個設計,其開發目的是為鞏固所學知識,無需開發經費,因此在經濟上也是可行的。
綜上所述,本系統的開發目標已經明確,且在技術和經濟上都是可行的,因此系統的開發是完全可行的。
3.操作可行性
該系統如投入使用,預期作到界面友好,管理方便,使用簡單,管理人員經過培訓,也是完全能夠使用本系統管理相關信息的。
綜上所述,本系統的開發目標已經明確,且在技術和經濟上都是可行的,因此系統的開發是完全可行的。
(五) 網站模型
(六)Server端模型
請求數據庫操作
數據庫
請求數據
Koa服務器
客戶端
返回數據
返回數據庫操作結果
圖3.1系統基本結構
利用Koa服務器,用于連接客戶端和數據庫服務器。對于客戶端發出的需要對數據庫進行訪問的請求,Koa服務器負責客戶端與數據庫服務器的網絡通信,并將相關數據嵌入返回給客戶端的頁面;對于客戶端發出的不需要對數據庫進行訪問的請求,Koa服務器將直接處理這些請求,并將最終生成的數據發往客戶端瀏覽器。
四、數據庫設計
(一)數據概念結構設計
E-R模型是數據進行第一層抽象的表示方法。它的主要成分包括:實體、聯系和屬性。我們可以用E-R圖將內容表達出來,輔助設計的實現[6]。
(二)數據庫關系設計
該網絡學校系統數據庫關系圖如下所示:
圖4.14數據庫前端關系
圖4.15數據庫后臺關系圖
(三)數據字典
| id | int(11) | P | 否 | 自動遞增 |
| name | varchar(255) | 否 | ||
| password | varchar(255) | 否 | ||
| role | int(1) | 否 | 1:超級管理員 2:管理員 | |
| isDel | int(1) | 否 | 默認0 |
管理員表(admin_user)
| id | int(11) | P | 否 | 自動遞增 |
| token | varchar(255) | 否 | ||
| deadline | bigint(13) | 否 | 時間戳 | |
| admin_id | int(11) | 否 |
管理員token表(admin_token)
| id | int(11) | P | 否 | 自動遞增 |
| name | varchar(255) | 否 | ||
| nick_name | varchar(255) | 是 | ||
| password | varchar(255) | 否 | ||
| sex | int(1) | 否 | 0:男 1:女 | |
| room_id | int(11) | |||
| role | int(1) | 否 | 0:未審核 1:家庭成員 2:業主 | |
| isDel | int(1) | 否 | 默認0 | |
| tel | varchar(255) |
用戶表(user)
| id | int(11) | P | 否 | 自動遞增 |
| token | varchar(255) | 否 | ||
| deadline | bigint(13) | 否 | 時間戳 | |
| user_id | int(11) | 否 |
用戶token表(user_token)
| id | int(11) | P | 否 | 自動遞增 |
| title | varchar(255) | 否 | ||
| status | int(1) | 否 | 0:已撤消 1:已報修 2:已聯系 3:已派修 4:已維修 5:已繳費 | |
| photo | text | 是 | JSON字符串 | |
| price | float(10, 2) | 是 | ||
| user_id | int(11) | 否 | ||
| create_time | varchar(13) | 否 | 創建時間的時間戳 | |
| appointment_time | varchar(13) | 否 | 派修時間的時間戳 | |
| pay_time | varchar(13) | 否 | 支付時間的時間戳 |
報修表(repair_list)
| id | int(11) | P | 否 | 自動遞增 |
| room_num | varchar(255) | 否 | ||
| building | varchar(255) | 否 | ||
| area | float(255, 0) | 否 |
房間表(room)
| id | int(11) | P | 否 | 自動遞增 |
| part_name | varchar(255) | 否 | ||
| price | float(10, 2) | 否 | ||
| type_id | int(11) | 否 | ||
| isDel | int(11) | 否 | 默認0 | |
| count | int(11) | 否 |
零件表(part)
| id | int(11) | P | 否 | 自動遞增 |
| type_name | varchar(255) | 否 | ||
| isDel | int(11) | 否 | 默認0 |
零件類型表(part_type)
| id | int(11) | P | 否 | 自動遞增 |
| repair_id | int(11) | 否 | ||
| part_id | int(11) | 否 | ||
| count | int(11) |
零件出庫表(part_order)
五、 前端部分
(一)管理端部分
1. 登錄部分
登錄頁面
用戶輸入用戶名密碼,密碼使用md5加密,點擊登錄向后臺發送,若匹配失敗,返回’用戶名或密碼錯誤’并彈出提示消息;若匹配成功,向前端返回一個token令牌,前端儲存在cookie中,并彈出登錄成功的提示,后跳轉入main路由。
登錄成功后,進入main路由,此時將cookie中的token取出并發送給后臺,后臺匹配token是否存在且未過期(七天),若匹配失敗,則跳轉回login路由;若成功,則將用戶信息發送至前端,前端將信息存在vuex的state中。
當用戶點擊退出登錄時,清除cookie中的token并跳轉回login路由。
2. 管理員個人信息
個人信息頁面顯示管理員的用戶名、角色、密碼,點擊密碼顯示修改密碼對話框
若要修改密碼,需要在原密碼處輸入正確密碼并點擊驗證,驗證通過后,可在后兩個輸入框中輸入新密碼
重置密碼部分均做了正則表達式校驗
3. 房間管理
房間管理頁面獲取管轄內所有房間數據,可根據樓號進行篩選
每個房間顯示對應的業主和電話號碼,沒有業主的房間可點擊新增按鈕新增業主
新增業主處也均做了正則表達式的表單校驗
4. 業主管理
業主管理可以查看轄區內所有業主信息,并做了分頁處理,減少瀏覽器和服務器壓力
刪除業主時,會聯動刪除此業主所在家庭的所有家庭成員
5. 家庭成員管理
家庭成員管理中可以查看所有家庭成員,并可將某一普通家庭成員設置為業主,同時原業主將變為家庭成員
5. 報修管理
報修管理部分,可以通過關鍵詞檢索標題搜索對應數據
由于該部分字段過多,這里將報修編號和標題這兩列固定,方便查看表格內容
可以根據不同的狀態對數據進行篩選
可以根據創建時間、派修時間、支付時間對數據進行排序
點擊圖片按鈕可以查看報修照片
點擊后面操作按鈕,可以將報修流程進行至下一步,狀態為已撤銷、已維修與已繳費時無法點擊,狀態為已報修時,點擊變為已維修須輸入報價
當前端用戶支付成功后,此處可以顯示支付時間
6. 零件類型管理
此處編輯,新增,刪除零件類型
新增與編輯時須輸入類型名稱
刪除類型時,會聯動刪除類型下所有零件
7. 零件管理
此處顯示零件列表,可根據單價與剩余量排序,可根據類型篩選。
可編輯,新增與刪除,并在獲取列表時做了分頁處理。
點擊出庫,可對庫存不為0的零件進行出庫,輸入標題關鍵字選擇為哪個報修進行出庫。
由于零件的消耗量不與報修成絕對關系,在此處做手動出庫處理。
8. 管理員管理
此處可對管理員進行增刪改,僅有超級管理員可進入此路由,并且只可編輯與刪除普通管理員
而普通管理員是看不到此tab頁的,若在url上輸入此路由地址,則跳轉入401頁面
9. 404
當用戶訪問不存在的頁面時,跳轉入404 no found頁面
客戶端部分
客戶端部分為H5應用通過Hbuilder打包成的APP應用
登錄
點擊登錄按鈕匹配數據庫,若匹配失敗,返回用戶名或密碼錯誤,若成功,返回token令牌,將token存入cookie并跳轉入main路由,之后將token發送至后臺驗證是否有效,若無效則跳轉入login,若有效,則返回用戶信息并在頁面回顯
注冊
用戶注冊頁面,選項均做了表單校驗,用戶名、密碼與手機號做了正則表達式的校驗,剛剛注冊的用戶在后臺存角色為0,只有當選擇房間的業主審核后才可變為1(家庭成員)
房屋信息
進入此路由頁,請求當前用戶所在的room信息,返回后回顯到頁面
報修信息
此路由頁顯示報修列表,做了分頁處理,每頁10條數據,當滾動到底部時會自動加載下一頁的數據,若報修未上傳照片,則會用默認照片替代。
輸入標題,可選擇是否上傳照片,提交后,將圖片轉為base64代碼發送給后臺,后臺重命名處理存為png文件后,將地址發送至前端,前端將圖片地址與標題發送給后臺并存庫。
點擊繳費,會提示是否進行繳費,點擊確認,此處可添加支付寶與微信的接口,跳轉入對應應用,支付成功后回調,發送支付成功的請求,完成繳費
上部搜索框可以進行關鍵字檢索,搜索無結果時會顯示無數據頁面
家庭成員信息
這里可以查看家庭成員列表,后面顯示家庭成員的角色,點擊他人信息進入詳情,點擊自己信息進入個人信息tab頁
點擊用戶可以查看用戶詳情,業主可刪除其他家庭成員,而普通家庭成員無此權限
業主可審核新注冊的用戶,通過審核的用戶會變為當前家庭的家庭成員
個人信息
此處可以編輯個人信息,僅可直接修改昵稱及手機號,點擊右上角更改按鈕提交更改
修改密碼須輸入原密碼,驗證通過后輸入新密碼
六、后臺部分
(一)路由
RESTful架構遵循統一接口原則,訪問同一資源時均使用相同路由,根據不同請求方式進行數據操作。
使用koa-router中間件對路由進行處理。
(二) 數據庫操作
首先根據配置文件(數據庫用戶名、端口號、密碼等)建立數據庫連接池
連接池創建好后,當請求發送至后臺,為這一請求建立數據庫連接成功后,進行數據庫操作,再將結果返回出去,之后釋放資源,斷開連接。
跨域
跨域是前后端聯調開發中經常會遇到的問題,由于瀏覽器有同源策略,用來防止CSRF攻擊,當前端發出請求的時候,請求的協議名,地址,端口號與當前的有一個不同,就會引發瀏覽器拒絕跨域請求,解決跨域問題的方法有很多,比如jsonp,服務器代理,document.domain
+ iframe等等方式解決跨域問題,我選擇了在服務端,允許前端跨域發出PUT, POST, GET,
DELETE, OPTIONS請求,成功地解決了ajax跨域問題
koa2中提供了cors中間件,允許接受跨域請求,直接use即可。
圖片處理
首先使用nodejs中的os.networkInterfaces()獲取到網絡(Windows系統中為WLAN,MAC中為en0),將本機ip+3000端口號作為主機名。
在接收到前端傳的base64圖片后,先將url的頭過濾掉,將其轉換為buffer對象,使用隨機字符串算法進行重命名,保證存儲中不會有重名文件,再將其寫入文件,將路徑發送至前端。
結論
1) 系統的特點
本系統是一個網校管理系統,采用ASP.NET+SQL的模式來開發。本系統從功能上來說,比較完備。系統以Web界面與用戶交互,為用戶提供信息并接受其操作,同時通過數據庫管理系統來存儲信息數據。系統實現了對信息數據的瀏覽、查詢、編輯和管理等基本數據庫操作,系統采用了模塊化設計方法,根據用戶的需求及程序的應用與維護的易用性,將各個部分置于不同的模塊當中,方便了程序的擴展與維護,同時建立了程序功能復用的基礎。
2) 系統的不足和改進
本系統基本上滿足了網校管理系統關于信息管理方面的需要。實現了網校管理系統所需的功能。在界面上力求做到美觀、在操作方面盡量避免由于用戶操作不當帶來系統的出錯現象。但由于時間倉促,本系統還存在一些不足之處,界面不夠美觀,需要進一步修飾和美化;對數據庫操作的性能有待進一步優化,雖然本系統優化了不少,但要達到理想狀態還有一段距離,如部分功能程序代碼過長,如果后臺數據庫過大將會影響運行速度;部分數據庫表的設計存在一定的冗余,有待進一步優化。根據系統的不足,繼續改進和完善本系統。提高審美觀點,可使用photoshop、fireworks等圖片處理工具修飾圖片,力求給用戶提供美觀友好的界面;簡化程序代碼,可使不同界面之間能共享一些方法、函數和變量,對于相同的功能模塊可生成程序包供其它界面引用,這樣就會提高系統的運行速度;使用數據庫連接池技術提高數據庫操作的性能;數據庫的關系模式可以進一步規范化,減少冗余現象。
3) 設計收獲與心得
畢業設計是最能體現我們所學知識的時候,是對我們大學四年所學理論知識的一次鞏固和提高。設計本系統的過程不僅是對我學過的知識的一次應用,更是對我綜合處理問題、解決實際問題能力的培養和鍛煉。通過本次畢業設計使我對系統開發有了深入的了解,我的編程能力也有了較大的提高。我在設計過程中也遇到了很多困難,但是通過指導老師和同學的幫助以及自己的努力,最終還是順利地完成了畢業設計。
雖然,畢業設計只有短暫的幾個月,但卻使我充分認識到自身還存在很多不足的地方,還需要不斷的努力來充實自己、完善自己,只有這樣才能學無止境,以求得更大的發展。
參 考 文 獻
[1] Jeff Atwood, 《The Principle of Least Power》 ,2007年7月17日。
[2]
[3]
[4]
[5]
致 謝
首先非常感謝老師能給我一次重新學習開發工具的機會,也感謝老師的指導和鼓勵!給了我更快更好地完成設計任務以無窮的動力,使我通過這次論文的設計,才真正感受到了這幾年學習生涯中最大的收獲。在此次論文的設計中,我閱讀了大量有關ASP.NET以及SQL-Server相關的書籍。從開題的論證到軟件系統功能的實現,直至最后的論文撰寫,整個過程使我逐漸學到了很多,受益匪淺。
經過將近四個月的學習、設計和開發,系統基本開發完成。有些時候會出現很多問題,在老師與同學們的幫助下,已逐步完善。但是該系統還有許多不盡如人意的地方,如用戶界面不夠美觀,系統缺乏防病毒侵襲功能,用戶登錄安全性驗證不很完善等多方面問題。這些都有待進一步改善。
在即將結束的大學生活之際,我要感謝某某系的老師們。從他們身上我學到了許多寶貴的知識和做人的道理。他們在學業上對我的悉心指導,以及孜孜不倦、嚴謹細致的科研態度,更令我受益非淺。
同時還要感謝某某系的領導對我的培養和支持,是他們為我提供了良好的學習環境和機會。
再次感謝所有給予我幫助和支持的人們,最后,向各位評審的老師們致意。我會繼續學習,不斷提升!
感謝各位專家和評委耐心審閱我的論文,他們提出了許多寶貴的意見和建議。
懇請老師不吝賜教、批評指正!
總結
- 上一篇: python爬取豆瓣小组_Python爬
- 下一篇: cmd命令查看服务器硬盘序列号,硬盘序列