1摘要對(duì)于校園內(nèi)公共資源有限，學(xué)生數(shù)量增多等問(wèn)題，該文設(shè)計(jì)了基于微信小程序的學(xué)生預(yù)約系統(tǒng)，用戶使用該小程序可以查看預(yù)約項(xiàng)目、及時(shí)預(yù)約并查看自己的預(yù)約情況。管理員可以在后臺(tái)進(jìn)行預(yù)約項(xiàng)目的管理和預(yù)約記錄的查看。本系統(tǒng)共實(shí)現(xiàn)以下功能：注冊(cè)登陸、通知公告、生活繳費(fèi)、預(yù)約功能、預(yù)約記錄、繳費(fèi)記錄以及后臺(tái)管理。本系統(tǒng)的客戶端使用微信開(kāi)發(fā)者工具進(jìn)行開(kāi)發(fā)，使用微信的標(biāo)簽語(yǔ)言WXML和樣式語(yǔ)言WXSS、JavaScript等前端技術(shù)使用戶界面更加美觀；服務(wù)端則是基于SSM框架開(kāi)發(fā)，將MySQL作為數(shù)據(jù)源，使得開(kāi)發(fā)效率更加高效。[關(guān)鍵詞]：微信小程序；SSM框架；JavaScript;第一章緒論1.1選題研究背景國(guó)家近幾年一直在呼吁各個(gè)高校開(kāi)展智慧校園的計(jì)劃。同時(shí)，現(xiàn)在智能手機(jī)的普及和城市網(wǎng)絡(luò)基礎(chǔ)建設(shè)的逐步覆蓋，推動(dòng)了微信小程序的誕生。2017年，騰訊在微信內(nèi)上線微信小程序，其自身特有的無(wú)需安裝、加載迅速、用完即走、操作簡(jiǎn)單的優(yōu)點(diǎn)在上線之初就廣大用戶的喜愛(ài)，結(jié)合當(dāng)今的移動(dòng)支付技術(shù)的發(fā)展，衍生出許多不同的預(yù)約系統(tǒng)，比如醫(yī)院的網(wǎng)上預(yù)約掛號(hào)、機(jī)場(chǎng)車站的網(wǎng)上預(yù)約，都給人們的生活帶來(lái)了極大的便利。隨著使用人數(shù)的增多，微信小程序已經(jīng)由當(dāng)初的開(kāi)發(fā)工具演變?yōu)橐粋€(gè)獨(dú)立的生態(tài)系統(tǒng)，用戶可以在此生態(tài)內(nèi)體驗(yàn)到各種各樣的生活服務(wù)。1.2選題目的在信息化的時(shí)代，人們對(duì)環(huán)境的碎片化使用需求愈來(lái)愈大，傳統(tǒng)App需要用戶自行下載，且開(kāi)發(fā)周期較長(zhǎng)，成本較高。于是輕量化的微信小程序隨之產(chǎn)生，其簡(jiǎn)潔的使用方式，良好的使用體驗(yàn)、豐富的使用場(chǎng)景讓人們的生活更加的方便快捷。本課題的目的是將微信小程序和學(xué)生預(yù)約結(jié)合起來(lái)，設(shè)計(jì)并實(shí)現(xiàn)一個(gè)學(xué)生預(yù)約系統(tǒng)，緩解校園內(nèi)公共資源緊張的問(wèn)題，提高資源使用率，提升管理效率。1.3選題主要內(nèi)容基于目前社會(huì)大環(huán)境和人們生活發(fā)展水平，這次研究選擇的主要內(nèi)容和方向?yàn)椋何⑿判〕绦蚯岸私缑娴脑O(shè)計(jì)，后端基于SSM框架的搭建，前后端數(shù)據(jù)的交互。在系統(tǒng)開(kāi)發(fā)之前，本人做了一些相關(guān)的研究和調(diào)查：查閱相關(guān)資料、了解類似系統(tǒng)的設(shè)計(jì)方式、了解相關(guān)的業(yè)務(wù)流程、調(diào)查用戶的實(shí)際需求、了解目前主流的JavaWeb開(kāi)發(fā)技術(shù)、查閱數(shù)據(jù)庫(kù)設(shè)計(jì)相關(guān)資料。而后確立了系統(tǒng)的整體需求和需求分析。本次開(kāi)發(fā)遵守軟件工程的開(kāi)發(fā)模式，使用敏捷軟件開(kāi)發(fā)思想，實(shí)行周期性交付機(jī)制。在本系統(tǒng)中，核心模塊主要有：用戶在前端在已有的預(yù)約功能內(nèi)實(shí)現(xiàn)預(yù)約；用戶在前端進(jìn)行預(yù)約項(xiàng)目的繳費(fèi)；用戶在查看自己的預(yù)約記錄；管理員在后端實(shí)現(xiàn)預(yù)約功能的添加、查看用戶預(yù)約記錄和繳費(fèi)記錄。1.4本文組織結(jié)構(gòu)第一章緒論。本章主要介紹了學(xué)生預(yù)約系統(tǒng)這一選題的研究背景、研究目的和主要內(nèi)容。第二章相關(guān)概念和技術(shù)基礎(chǔ)。本章介紹了課題的相關(guān)概念，系統(tǒng)在前端開(kāi)發(fā)過(guò)程中用到的MINA框架和后端開(kāi)發(fā)中用到的SSM框架。第三章系統(tǒng)需求分析。本章敘述了用戶和管理員的功能需求分析；將各個(gè)功能模塊的操作流程用流程圖展示出來(lái)。第四章系統(tǒng)的設(shè)計(jì)。本章介紹了系統(tǒng)的幾個(gè)核心模塊的功能模塊設(shè)計(jì)和數(shù)據(jù)庫(kù)設(shè)計(jì)。第五章系統(tǒng)實(shí)現(xiàn)與測(cè)試。使用了軟件測(cè)試中的一種常見(jiàn)方法——黑盒測(cè)試，并設(shè)計(jì)了測(cè)試用例來(lái)測(cè)試系統(tǒng)的功能。第六章總結(jié)與展望，主要介紹了在設(shè)計(jì)結(jié)束后的個(gè)人總結(jié)與改進(jìn)之處，展望以后所研究的工作。

第二章相關(guān)概念和技術(shù)基礎(chǔ)2.1課題的相關(guān)概念近幾年來(lái)，隨著國(guó)家的發(fā)展使得愈來(lái)愈多的學(xué)生能夠踏入大學(xué)，繼續(xù)接受深造。大學(xué)校園不僅僅是一塊用來(lái)學(xué)習(xí)的地方，逐步演變成一個(gè)多元、豐富的社區(qū)。大學(xué)校園是一個(gè)培養(yǎng)學(xué)生健康體魄和個(gè)性的場(chǎng)所，作為管理人員應(yīng)當(dāng)充分利用校園內(nèi)已有的資源來(lái)盡最大的可能滿足大學(xué)生的需求。在中學(xué)時(shí)往往是通過(guò)老師的組織去參加學(xué)校的某項(xiàng)活動(dòng)，但大學(xué)校園的人口數(shù)量多、校園資源有限，這時(shí)候就需要結(jié)合當(dāng)今較為熱門的科學(xué)技術(shù)來(lái)解決這些問(wèn)題，使用微信小程序結(jié)合SSM框架來(lái)進(jìn)行相關(guān)的服務(wù)預(yù)約就是一個(gè)不錯(cuò)的想法。主要的優(yōu)勢(shì)在：（1）微信小程序作為當(dāng)今熱度較高的技術(shù)，其用完即走、快速加載的優(yōu)勢(shì)，讓廣大的用戶感受到科技帶來(lái)的便利。（2）傳統(tǒng)的組織形式在大學(xué)校園中顯得有點(diǎn)力不從心，因?yàn)榘嗉?jí)數(shù)量和學(xué)生數(shù)量的增多使得傳統(tǒng)的管理模式費(fèi)時(shí)又費(fèi)力，所以使用數(shù)據(jù)庫(kù)和后端管理就讓管理者的效率大大提高。（3）當(dāng)小程序真正帶給學(xué)生便利時(shí)，一些對(duì)新技術(shù)有著興趣的學(xué)生就會(huì)開(kāi)始研究，想去開(kāi)發(fā)一個(gè)屬于自己的微信小程序，這對(duì)學(xué)生個(gè)人拓展實(shí)踐能力有著一定的幫助。2.2相關(guān)技術(shù)基礎(chǔ)2.2.1MINA框架小程序使用的MINA框架，核心是響應(yīng)數(shù)據(jù)綁定，目的是讓開(kāi)發(fā)者能用簡(jiǎn)單、高效的方式進(jìn)行設(shè)計(jì)開(kāi)發(fā)。整個(gè)框架由視圖層（View）和邏輯層（AppSerivce）這兩部分組成,這樣使得數(shù)據(jù)和視圖實(shí)現(xiàn)簡(jiǎn)單同步。只要開(kāi)發(fā)者在邏輯層內(nèi)修改數(shù)據(jù)，相應(yīng)的視圖層就能做出響應(yīng)并及時(shí)更新。圖2-1MINA框架圖如圖2-1所示，MINA框架封裝微信客戶端提供的一些基礎(chǔ)功能，使用JSBridge將Native系統(tǒng)層與上層連接，提供JSAPI,讓開(kāi)發(fā)者能通過(guò)API使用原生功能，快速搭建小程序。框架程序通過(guò)一個(gè)app來(lái)描述整體程序和多個(gè)page來(lái)描述頁(yè)面。一個(gè)框架程序主體由3個(gè)文件構(gòu)成，放在項(xiàng)目的根目錄下，如表2-1所示：表2-1程序主體結(jié)構(gòu)表文件是否必需意義app.js是小程序邏輯app.json是小程序公共配置app.wxss否小程序公共樣式一個(gè)框架頁(yè)面由4個(gè)文件組成，如表2-2所示：表2-2程序頁(yè)面結(jié)構(gòu)表文件類型是否必需意義js是頁(yè)面邏輯wxml是頁(yè)面結(jié)構(gòu)wxss否頁(yè)面樣式表json否頁(yè)面配置2.2.2SSM框架SSM框架是標(biāo)準(zhǔn)的MVC模式，經(jīng)常用來(lái)開(kāi)發(fā)數(shù)據(jù)源簡(jiǎn)單的Web項(xiàng)目，對(duì)比之前的SSH框架更加靈活，是當(dāng)今較主流的JavaWeb開(kāi)發(fā)項(xiàng)。其框架圖，如圖2-2所示。圖2-2SSM框架圖Spring框架一種以IoC和AOP為核心的輕量級(jí)開(kāi)放源代碼框架，為SpringMVC提供了集成功能；在持久層可以將MyBatis整合；在業(yè)務(wù)層可以處理事務(wù)?？梢哉f(shuō)Spring貫穿各層并將它們整合。SpringMVC框架一個(gè)實(shí)現(xiàn)MVC設(shè)計(jì)思想的輕量級(jí)Web框架，難度相比于Struts2更加簡(jiǎn)單。它將控制器、模型對(duì)象、分配器這三者分開(kāi)，使每一部分都更容易定制，從而靈活組合為一個(gè)系統(tǒng)。MyBatis框架持久層使用的MyBatis采取ORM的思想，通過(guò)封裝JDBC,使用XML或注解來(lái)配置相關(guān)文件等方式，讓開(kāi)發(fā)人員更容易對(duì)數(shù)據(jù)庫(kù)進(jìn)行持久化操作。2.2.3數(shù)據(jù)庫(kù)MySQL是一種關(guān)系型數(shù)據(jù)庫(kù)管理系統(tǒng)，它是當(dāng)今數(shù)據(jù)庫(kù)管理的主流。為加快處理數(shù)據(jù)的速度，它在不同的表中有計(jì)劃地存儲(chǔ)數(shù)據(jù)。因?yàn)槠鋵?duì)外開(kāi)源的優(yōu)點(diǎn)，所以開(kāi)發(fā)成本低，許多中小企業(yè)及個(gè)人都會(huì)選擇MySQL。同時(shí)，MySQL還支持SQL規(guī)范數(shù)據(jù)語(yǔ)言形式，支持JDBC等多種數(shù)據(jù)庫(kù)連接方式，支持多種Java、Python、C等多種編程語(yǔ)言。第三章系統(tǒng)需求分析3.1系統(tǒng)用戶定義本系統(tǒng)作為一個(gè)在線預(yù)約的平臺(tái)，用戶主要被分類為兩種：學(xué)生：作為系統(tǒng)使用的主體，在系統(tǒng)中可以查看管理者發(fā)布的通知公告，可以對(duì)系統(tǒng)已有的預(yù)約項(xiàng)目進(jìn)行預(yù)約，并且能夠隨時(shí)查看自己的預(yù)約記錄，對(duì)已結(jié)束、需要繳費(fèi)的預(yù)約項(xiàng)目可以進(jìn)行繳費(fèi)。管理員：作為預(yù)約的管理者，可以在后端發(fā)布新的預(yù)約項(xiàng)目：設(shè)定數(shù)量、預(yù)約價(jià)格、預(yù)約描述；上傳相關(guān)的圖片和文字用來(lái)更新首頁(yè)公告，也可以查看已有項(xiàng)目的預(yù)約情況、繳費(fèi)情況、用戶預(yù)約記錄。3.2系統(tǒng)功能模塊3.2.1學(xué)生功能模塊游客進(jìn)入微信小程序預(yù)約系統(tǒng)后，可以瀏覽主頁(yè)內(nèi)容。若要點(diǎn)擊主頁(yè)中的任一功能模塊時(shí)，系統(tǒng)提示用戶先注冊(cè)或登錄：學(xué)生注冊(cè)后，可以使用注冊(cè)時(shí)所登記的手機(jī)號(hào)碼、密碼進(jìn)行登錄。注冊(cè)登錄后，可以進(jìn)行通知公告的查看、進(jìn)行已有預(yù)約項(xiàng)目的預(yù)約、預(yù)約記錄的查看、預(yù)約之后的繳費(fèi)和自己的繳費(fèi)記錄。圖3-1學(xué)生在系統(tǒng)中的用例圖1.用戶注冊(cè)功能（1）功能說(shuō)明游客打開(kāi)微信小程序后，當(dāng)點(diǎn)擊任一功能時(shí)，頁(yè)面提示用戶需要注冊(cè)賬戶。填寫學(xué)生的手機(jī)號(hào)、姓名、性別、宿舍號(hào)、密碼等信息。（2）流程圖圖3-2用戶注冊(cè)流程圖2.用戶登錄功能（1）功能說(shuō)明進(jìn)入登錄界面，輸入用戶的手機(jī)號(hào)和密碼后，點(diǎn)擊登錄按鈕。驗(yàn)證成功則系統(tǒng)會(huì)彈出“登陸成功”，驗(yàn)證失敗則彈出“登錄失敗”。（2）流程圖圖3-3用戶登錄流程圖3.用戶預(yù)約功能（1）功能說(shuō)明用戶點(diǎn)擊“校園預(yù)約”按鈕，可以查看所有的預(yù)約功能，點(diǎn)擊其中的預(yù)約項(xiàng)目，可以查看詳情、剩余數(shù)量、價(jià)格等信息。（2）流程圖圖3-4用戶預(yù)約流程圖4.用戶繳費(fèi)功能（1）功能說(shuō)明用戶點(diǎn)擊“生活繳費(fèi)”，小程序跳轉(zhuǎn)到二級(jí)頁(yè)面，選擇繳費(fèi)項(xiàng)，輸入繳費(fèi)金額，再點(diǎn)擊“繳費(fèi)”按鈕，彈出“繳費(fèi)成功”即表示繳納費(fèi)用成功。（2）流程圖圖3-5用戶繳費(fèi)流程圖3.2.2管理員功能模塊管理員在后端使用已有的賬號(hào)、密碼登陸成功后，可以在賬戶設(shè)置里查看個(gè)人信息并修改；然后管理員可以在小程序管理中進(jìn)行通知公告的管理和預(yù)約項(xiàng)目的管理；最后可以在小程序數(shù)據(jù)查詢中查看用戶的繳費(fèi)記錄和用戶的預(yù)約記錄。圖3-6管理員在系統(tǒng)中的用例圖1.管理員登陸功能（1）功能說(shuō)明管理員根據(jù)現(xiàn)有賬號(hào)登陸到后臺(tái)管理界面。（2）流程圖圖3-7管理員登錄流程圖2.管理員發(fā)布通知（1）功能說(shuō)明管理員根據(jù)現(xiàn)有賬號(hào)登陸到后臺(tái)管理界面后。選擇通知公告管理，并點(diǎn)擊“增加”按鈕，填寫公告的相關(guān)信息，上傳相應(yīng)的內(nèi)容和圖片后。點(diǎn)擊“提交”按鈕，即發(fā)布了一篇新的通知公告。（2）流程圖圖3-8管理員發(fā)布通知流程圖3.管理員修改通知（1）功能說(shuō)明管理員根據(jù)現(xiàn)有賬號(hào)登陸到后臺(tái)管理界面后，點(diǎn)擊通知公告管理并選擇某一通知公告，點(diǎn)擊“修改”按鈕，選擇指定的公告信息，就可對(duì)該項(xiàng)通知公告進(jìn)行修改并發(fā)布。（2）流程圖圖3-9管理員修改通知流程圖4.管理員刪除通知（1）功能說(shuō)明管理員根據(jù)現(xiàn)有賬號(hào)登陸到后臺(tái)管理界面后，點(diǎn)擊通知公告管理并選擇某一通知公告，點(diǎn)擊“刪除”按鈕，選擇指定的公告信息，就可對(duì)該項(xiàng)通知公告進(jìn)行刪除。（2）流程圖圖3-10管理員刪除通知流程圖5.管理員發(fā)布預(yù)約（1）功能說(shuō)明管理員根據(jù)現(xiàn)有賬號(hào)登陸到后臺(tái)管理界面后，選擇預(yù)約項(xiàng)目管理并點(diǎn)擊“添加”按鈕，填寫相應(yīng)的信息，上傳相應(yīng)的內(nèi)容和圖片后點(diǎn)擊“提交”按鈕，即增加了一個(gè)新的預(yù)約項(xiàng)目。（2）流程圖圖3-11管理員發(fā)布預(yù)約流程圖6.管理員修改預(yù)約（1）功能說(shuō)明管理員根據(jù)現(xiàn)有賬號(hào)登陸到后臺(tái)管理界面后，點(diǎn)擊預(yù)約項(xiàng)目管理并選擇某一預(yù)約，點(diǎn)擊“修改”按鈕，選擇指定的預(yù)約項(xiàng)目，就可對(duì)該預(yù)約項(xiàng)目進(jìn)行修改并發(fā)布。（2）流程圖圖3-12管理員修改預(yù)約流程圖7.管理員刪除預(yù)約（1）功能說(shuō)明管理員根據(jù)現(xiàn)有賬號(hào)登陸到后臺(tái)管理界面后，點(diǎn)擊預(yù)約項(xiàng)目管理并選擇某一預(yù)約，點(diǎn)擊“刪除”按鈕，選擇指定的預(yù)約項(xiàng)目，就可對(duì)該預(yù)約項(xiàng)目進(jìn)行刪除。（2）流程圖圖3-13管理員刪除預(yù)約流程圖8.管理員查詢繳費(fèi)（1）功能說(shuō)明管理員根據(jù)現(xiàn)有賬號(hào)登陸到后臺(tái)管理界面后，點(diǎn)擊繳費(fèi)查詢就可看見(jiàn)所有用戶的繳費(fèi)項(xiàng)目、繳費(fèi)金額、繳費(fèi)時(shí)間等信息，點(diǎn)擊“刷新”按鈕即可刷新當(dāng)前頁(yè)面數(shù)據(jù)。（2）流程圖圖3-14管理員查詢繳費(fèi)流程圖9.管理員查詢預(yù)約（1）功能說(shuō)明管理員根據(jù)現(xiàn)有賬號(hào)登陸到后臺(tái)管理界面后，點(diǎn)擊預(yù)約查詢就可看見(jiàn)所有用戶的預(yù)約項(xiàng)目、預(yù)約時(shí)間、預(yù)約人姓名等信息，點(diǎn)擊“刷新”按鈕即可刷新當(dāng)前頁(yè)面數(shù)據(jù)。（2）流程圖圖3-15管理員查詢預(yù)約流程圖3.3非功能需求3.3.1響應(yīng)速度要求系統(tǒng)能對(duì)用戶的不同操作做出快速響應(yīng)，不該讓用戶等待太多的時(shí)間。3.3.2出錯(cuò)處理當(dāng)用戶操作不當(dāng)時(shí)或系統(tǒng)出現(xiàn)錯(cuò)誤時(shí)，系統(tǒng)能給出友好、簡(jiǎn)明的提示并提供相應(yīng)正確的指引。3.3.3用戶界面用戶界面是用戶與機(jī)器之間溝通交流的層面，好的用戶界面應(yīng)該有實(shí)用、美觀、易用等特點(diǎn)。所以在開(kāi)發(fā)過(guò)程中無(wú)論是小程序端還是后臺(tái)管理端，都應(yīng)該遵循相關(guān)的設(shè)計(jì)規(guī)范，讓用戶體會(huì)到樂(lè)趣，減少因?yàn)榻缑鎲?wèn)題所帶來(lái)的投訴、咨詢等不必要的麻煩，讓軟件的操作變得簡(jiǎn)單、舒適。3.3.4性能需求并發(fā)要求：要求支持較高級(jí)的并發(fā)量，在最高負(fù)載的狀態(tài)下系統(tǒng)不能出現(xiàn)異常情況。事務(wù)并發(fā)：允許多地、多用戶、多事務(wù)并發(fā)，在系統(tǒng)高壓時(shí)不能響應(yīng)過(guò)長(zhǎng)的時(shí)間。數(shù)據(jù)庫(kù)操作：用戶在瀏覽器發(fā)起的每次請(qǐng)求所觸發(fā)的相應(yīng)SQL操作不能大于4條。3.3.5硬件的限制1.支持目前普遍使用的Android、iOS系統(tǒng)和PC操作系統(tǒng)。2.支持最低手機(jī)配置：Android：Android4.0以上iPhone、iPad：iOS6.1以上CPU:1000MHzROM:1024MBRAM:1000MHz3.支持最低PC配置：處理器：1GHz32/64位雙核內(nèi)存：1GB(32位)/2GB(32位)硬盤：16G顯卡：帶WDDM驅(qū)動(dòng)的DirectX9圖形設(shè)備3.3.6安全性1.當(dāng)數(shù)據(jù)庫(kù)數(shù)據(jù)泄露時(shí)，不該暴露用戶、管理員的賬戶和密碼。2.當(dāng)后端上傳文件時(shí)，若遇到木馬和病毒問(wèn)題時(shí)，系統(tǒng)應(yīng)當(dāng)拒絕進(jìn)行上傳。3.當(dāng)使用API調(diào)用數(shù)據(jù)時(shí)，通信應(yīng)用HTTPS來(lái)確保其安全性。3.3.7可維護(hù)性系統(tǒng)設(shè)計(jì)結(jié)構(gòu)要清楚簡(jiǎn)明，方便開(kāi)發(fā)人員在后期對(duì)系統(tǒng)進(jìn)行維護(hù)、修復(fù)系統(tǒng)故障等操作。避免大段的代碼，滿足高內(nèi)聚、低耦合的要求編程風(fēng)格保持一致，代碼能夠清晰表達(dá)意圖，能夠讓開(kāi)發(fā)人員快速看懂。3.3.8其他需求用戶操作需求，具體如下：（1）要求操作簡(jiǎn)單明了，適用人群廣。（2）用戶可以清晰的看到系統(tǒng)處理后的結(jié)果。3.4本章小結(jié)本章主要介紹了預(yù)約系統(tǒng)的需求分析，對(duì)不同角色的功能需求進(jìn)行了詳細(xì)的分析，同時(shí)結(jié)合流程圖對(duì)各個(gè)功能模塊進(jìn)行了流程演示。第四章系統(tǒng)設(shè)計(jì)4.1總體功能設(shè)計(jì) 本系統(tǒng)的用戶端主要功能模塊包括：查看首頁(yè)、預(yù)約功能、查看個(gè)人中心，如圖4-1所示：圖4-1用戶端的系統(tǒng)功能圖管理員端的主要功能模塊包含公告管理、預(yù)訂管理、查看預(yù)約、查看賬單，如圖4-2所示：圖4-2管理員端的系統(tǒng)功能圖4.2系統(tǒng)架構(gòu)設(shè)計(jì)該系統(tǒng)后臺(tái)的架構(gòu)圖，如下圖所示：圖4-3系統(tǒng)架構(gòu)圖4.3數(shù)據(jù)庫(kù)設(shè)計(jì)4.3.1設(shè)計(jì)簡(jiǎn)介本系統(tǒng)采用是MySQL數(shù)據(jù)庫(kù)，使用NavicatforMySQL作為數(shù)據(jù)庫(kù)可視化工具，在分析用戶端的功能模塊后，確定主要實(shí)體及其屬性和關(guān)系，并使用E-R圖體現(xiàn)出來(lái)。本系統(tǒng)的實(shí)體包括大學(xué)生、管理員、預(yù)約項(xiàng)目、繳費(fèi)情況、公告，如圖4-4到圖4-8所示。圖4-4學(xué)生實(shí)體屬性圖4-5管理員實(shí)體屬性圖4-6項(xiàng)目實(shí)體屬性圖4-7通知實(shí)體屬性圖4-8繳費(fèi)實(shí)體屬性4.3.2數(shù)據(jù)庫(kù)E-R模型 根據(jù)實(shí)體之間的關(guān)系：（1）每個(gè)學(xué)生可預(yù)約多個(gè)項(xiàng)目，每個(gè)項(xiàng)目可以讓多個(gè)學(xué)生報(bào)名預(yù)約，二者是n:m的關(guān)系；（2）每個(gè)學(xué)生查看多個(gè)通知，每個(gè)通知可讓多個(gè)學(xué)生查看，兩者是n:m的關(guān)系。可以獲得系統(tǒng)的E-R圖，如圖4-9所示：圖4-9數(shù)據(jù)庫(kù)E-R模型圖4.3.3數(shù)據(jù)表物理視圖 根據(jù)學(xué)生預(yù)約系統(tǒng)的功能需求并結(jié)合圖4-9的數(shù)據(jù)庫(kù)E-R模型，采用數(shù)據(jù)表的格式展現(xiàn)其部分關(guān)系表。1.預(yù)約項(xiàng)目信息表如表4-1所示，id為該表的唯一主鍵。表4-1預(yù)約項(xiàng)目信息表字段名稱字段含義數(shù)據(jù)類型id項(xiàng)目idintgoods_title項(xiàng)目名稱varchargoods_desc項(xiàng)目描述varchargoods_img相關(guān)圖片varchargoods_price金額doubletime發(fā)布時(shí)間datatime2.通知公告信息表如表4-2所示：表4-2通知公告信息表字段名稱字段含義數(shù)據(jù)類型id公告idintauthor作者varcharcontent內(nèi)容varcharimg相關(guān)圖片varchartitle標(biāo)題varchartime發(fā)布時(shí)間datatime4.5本章小結(jié)本章主要對(duì)學(xué)生預(yù)約系統(tǒng)的系統(tǒng)結(jié)構(gòu)、數(shù)據(jù)庫(kù)進(jìn)行介紹，并用E-R圖展示系統(tǒng)中部分實(shí)體間的關(guān)系。第五章系統(tǒng)實(shí)現(xiàn)與測(cè)試5.1系統(tǒng)總體框架本系統(tǒng)的客戶端是基于微信的MINA框架開(kāi)發(fā)，使用微信標(biāo)簽語(yǔ)言WXML、樣式語(yǔ)言WXSS、JavaScript和有關(guān)API實(shí)現(xiàn)界面設(shè)計(jì)和有關(guān)功能。在服務(wù)器端使用SSM框架開(kāi)發(fā)。數(shù)據(jù)庫(kù)使用MySQL，通過(guò)本地通信即本機(jī)IP地址來(lái)實(shí)現(xiàn)前后端數(shù)據(jù)的交互，通過(guò)預(yù)約項(xiàng)目、項(xiàng)目繳費(fèi)等業(yè)務(wù)邏輯操作，實(shí)現(xiàn)客戶端和服務(wù)端的數(shù)據(jù)請(qǐng)求和處理。5.2搭建項(xiàng)目框架小程序項(xiàng)目的目錄框架圖，如圖5-1所示：圖5-1小程序項(xiàng)目目錄后臺(tái)管理項(xiàng)目的目錄框架圖，如圖5-2所示：圖5-2后臺(tái)管理項(xiàng)目目錄系統(tǒng)數(shù)據(jù)庫(kù)的結(jié)構(gòu)，如圖5-3所示：圖5-3數(shù)據(jù)庫(kù)結(jié)構(gòu)圖5.3小程序端系統(tǒng)實(shí)現(xiàn)5.3.1用戶注冊(cè)實(shí)現(xiàn)（1）功能實(shí)現(xiàn)分析小程序端與管理員端的數(shù)據(jù)傳遞是通過(guò)后臺(tái)接口實(shí)現(xiàn)的。當(dāng)小程序端需要存儲(chǔ)用戶信息的數(shù)據(jù)時(shí)，請(qǐng)求被發(fā)送到服務(wù)器端，調(diào)用UserApi接口獲取數(shù)據(jù)，然后根據(jù)返回的結(jié)果進(jìn)行響應(yīng)。（2）代碼實(shí)現(xiàn)微信小程序端觸發(fā)JS事務(wù)，JS事務(wù)觸發(fā)后調(diào)用RegisterUser方法，并傳遞參數(shù)，相關(guān)代碼如下：RegisterInfo:function(e){e.detail.value.roomId=e.detail.value.buildingNumber+e.detail.value.unitNumber+e.detail.value.roomNumberconsole.log(e.detail.value);varjson=JSON.stringify(e.detail.value)console.log("RegisterInfojson:"+json)console.log("url:"+app.getHeader()+'/SheQu/RegisterUser')wx.request({url:app.getHeader()+'/SheQu/registerUser',//拼接接口地址method:'post',data:json,contentType:'application/json',success(res){console.log('res:'+res)if(res.data=="success"){wx.showToast({title:'注冊(cè)成功',icon:'success',duration:2000})}else{wx.showToast({title:'注冊(cè)失敗',duration:1000,icon:'none'})}}})},在方法調(diào)用之后，調(diào)用服務(wù)器上的UserApi接口請(qǐng)求，并將請(qǐng)求地址拼接，根據(jù)地址調(diào)用后臺(tái)接口。request請(qǐng)求接口向該地址發(fā)起，服務(wù)器根據(jù)請(qǐng)求地址和數(shù)據(jù)做出響應(yīng)，這里調(diào)用了RegisterUser方法，從而進(jìn)行用戶的注冊(cè)功能，此處的請(qǐng)求地址為72:8080/SheQu/registerUser。服務(wù)端的相應(yīng)API代碼如下：@ResponseBody@RequestMapping(value="/registerUser",method=RequestMethod.POST)publicStringRegisterUser(@RequestBodyMapmap){System.out.println(map.toString());map.put("uid",RandNum.getGUID());intn=userService.insertUser(map);if(n>0){return"success";}return"failure";}相應(yīng)XML文件代碼如下：<insertid="insertUser">insertintouser(uid,name,gender,buildingNumber,unitNumber,roomNumber,phone_number,pwd,roomId) values(#{uid},#{name},#{gender},#{buildingNumber},#{unitNumber},#{roomNumber},#{phone_number},#{pwd},#{roomId})</insert>（3）運(yùn)行結(jié)果注冊(cè)成功的運(yùn)行結(jié)果，如圖5-4所示：圖5-4注冊(cè)運(yùn)行結(jié)果圖 5.3.2用戶登陸實(shí)現(xiàn)（1）功能實(shí)現(xiàn)分析小程序端與管理員端的數(shù)據(jù)傳遞是通過(guò)后臺(tái)接口實(shí)現(xiàn)的，當(dāng)小程序端需要驗(yàn)證用戶信息時(shí)，請(qǐng)求被發(fā)送到服務(wù)器端，調(diào)用UserApi接口獲取數(shù)據(jù)，然后根據(jù)返回的結(jié)果進(jìn)行響應(yīng)。（2）代碼實(shí)現(xiàn)微信小程序端觸發(fā)JS事務(wù)，JS事務(wù)后調(diào)用userLogin方法，并傳遞參數(shù)，相關(guān)代碼如下：UserLogin:function(e){varjson=JSON.stringify(e.detail.value)console.log("userlogin:"+json)wx.request({url:app.getHeader()+'/SheQu/userLogin',//拼接接口地址method:'post',data:json,contentType:'application/json',success(res){console.log('res.data:'+res.data)app.globalData.uid=res.dataif(res.data!="failure"){wx.showToast({title:'登錄成功',icon:'success',duration:2000})}else{wx.showToast({title:'登錄失敗',duration:1000,icon:'none'})}}})},在方法調(diào)用后，調(diào)用服務(wù)器上的UserApi接口請(qǐng)求，并將請(qǐng)求地址拼接，根據(jù)地址調(diào)用后臺(tái)接口。request請(qǐng)求接口向該地址發(fā)起，服務(wù)器根據(jù)請(qǐng)求地址和數(shù)據(jù)做出響應(yīng)，這里調(diào)用了userLogin方法，從而進(jìn)行用戶的登陸功能，服務(wù)端的相應(yīng)API代碼如下：@ResponseBody@RequestMapping(value="/userLogin",method=RequestMethod.POST)publicStringuserLogin(@RequestBodyMapmap){System.out.println(map.toString());Stringuid=userService.findUidByPNumAndPwd(map);if(uid!=null){returnuid;}return"failure";}相應(yīng)XML文件代碼如下：<selectid="findUidByPNumAndPwd"resultType="String">selectuidfromuserwherephone_number=#{phone_number}andpwd=#{pwd}</select>（3）運(yùn)行結(jié)果登錄成功的運(yùn)行結(jié)果，如圖5-5所示：圖5-5登錄運(yùn)行結(jié)果圖5.3.3用戶預(yù)約實(shí)現(xiàn)（1）功能實(shí)現(xiàn)分析用戶在小程序端點(diǎn)擊校園預(yù)約后，跳轉(zhuǎn)到二級(jí)頁(yè)面可看到所有的預(yù)約項(xiàng)目，點(diǎn)擊詳情后即可進(jìn)行預(yù)約。此過(guò)程調(diào)用服務(wù)端的GoodsApi和GoodsPayApi兩個(gè)接口。（2）代碼實(shí)現(xiàn)微信小程序端觸發(fā)JS事務(wù)，JS事務(wù)觸發(fā)后調(diào)用findAllGoods、insertBuyGoods方法，并傳遞參數(shù)。相應(yīng)代碼如下：wx.request({url:app.getHeader()+'/SheQu/findMyGoods',method:'GET',header:{'content-type':'application/json;charset=UTF-8'},data:{"uid":app.globalData.uid},success:function(res){that.setData({list:res.data,gl:app.getHeader()+'/SheQu/img'})},fail(){console.log('xxsad')}})}wx.request({url:app.getHeader()+'/SheQu/findPayByUid',method:'POST',header:{'content-type':'charset=utf-8'},data:{"uid":app.globalData.uid},success:function(res){that.setData({list:res.data})},fail(){console.log('xxsad')}})}方法調(diào)用后，調(diào)用服務(wù)器接口請(qǐng)求，并將請(qǐng)求地址拼接，根據(jù)地址調(diào)用后臺(tái)接口。request請(qǐng)求接口向該地址發(fā)起，服務(wù)器根據(jù)請(qǐng)求地址和數(shù)據(jù)做出響應(yīng)，這里調(diào)用了findAllGoods方法和insertBuyGoods方法，從而進(jìn)行用戶的預(yù)約功能。服務(wù)端的相應(yīng)API代碼如下：@ResponseBody@RequestMapping(value="/insertBuyGoods")publicStringinsertBuyGoods(@RequestBodyMapmap){intn=goodsPayService.insertBuyGoods(map);if(n>0){return"success";}return"failure";}@ResponseBody@RequestMapping(value="/findAllGoods",produces="application/json;charset=UTF-8")publicStringfindAllGoods(){List<Goods>goods=goodsService.findAllGoods();Stringresult=JSON.toJSONString(goods);System.out.println(result);returnresult;}相應(yīng)的XML文件代碼如下：<insertid="insertBuyGoods">insertintogoodspay(goods_id,uid)values(#{goods_id},#{uid})</insert><selectid="findAllGoods"resultType="com.shequ.pojo.Goods">select,g.*fromgoodsginnerjoinadminaong.publisher_id=a.account</select>（3）運(yùn)行結(jié)果注冊(cè)成功的運(yùn)行結(jié)果，如圖5-6所示：：圖5-6預(yù)約運(yùn)行結(jié)果圖5.4服務(wù)端系統(tǒng)實(shí)現(xiàn)5.3.1預(yù)約管理實(shí)現(xiàn)（1）功能實(shí)現(xiàn)分析管理員登陸后可管理小程序端中的功能模塊，如預(yù)約項(xiàng)目管理。（2）代碼實(shí)現(xiàn) GoodController控制層：添加預(yù)約項(xiàng)目代碼如下：@ResponseBody@RequestMapping(value="/insertGoods")publicStringinsertGoods(@RequestBodyMapmap){Datedate=newDate();map.put("publish_time",date);Stringgoods_id=RandNum.getGUID();map.put("goods_id",goods_id);System.out.println("map:"+map.toString());intn=goodsService.insertGoods(map);if(n>0){return"success";}return"failure";}GoodService服務(wù)層：添加預(yù)約項(xiàng)目代碼如下：publicinterfaceGoodsService{List<Goods>findAllGoods();GoodsfindGoodsById(Stringid);List<Goods>findAllGoodsByPages(intsatrt,intpagesize);intdeleteGoodsById(Stringgoods_id);intupdateGoodsById(Mapmap);intinsertGoods(Mapmap);}GoodsServiceImpl實(shí)現(xiàn)層：添加預(yù)約項(xiàng)目代碼如下：@OverridepublicintinsertGoods(Mapmap){returngoodsMapper.insertGoods(map);} GoodsMapper映射層：添加預(yù)約項(xiàng)目代碼如下：<insertid="insertGoods">insertintogoods(goods_id,goods_title,goods_desc,goods_img,goods_price,publisher_id,publish_time)values(#{goods_id},#{goods_title},#{goods_desc},#{goods_img},#{goods_price},#{publisher_id},#{publish_time})</insert>（3）運(yùn)行結(jié)果預(yù)約添加成功的運(yùn)行結(jié)果，如圖5-7所示：圖5-7添加預(yù)約運(yùn)行結(jié)果圖5.3.2查詢管理實(shí)現(xiàn)（1）功能實(shí)現(xiàn)分析管理員登陸后查看小程序端中的數(shù)據(jù)記錄，如預(yù)約查詢。（2）代碼實(shí)現(xiàn) GoodPayController控制層，代碼如下：@ControllerpublicclassGoodsPayController{@AutowiredGoodsPayServicegoodsPayService;@ResponseBody@RequestMapping(value="/findAllGoodsPayByPage",produces="application/json;charset=UTF-8")publicStringfindAllGoodsPayByPage(@RequestParam("limit")Stringlimit,@RequestParam("page")Stringpage){intstart=(Integer.parseInt(page)-1)*Integer.parseInt(limit);intpageSize=Integer.parseInt(limit);List<Goods>goods=goodsPayService.findAllGoodsPayByPage(start,pageSize); List<Goods>goodsAll=goodsPayService.findAllGoodsPay();Layuil=Layui.data(goodsAll.size(),goods);Stringresult=JSON.toJSONString(l);System.out.println(result);returnresult;}} GoodPayService服務(wù)層，代碼如下：publicinterfaceGoodsPayService{publicintinsertBuyGoods(Mapmap);List<Goods>findMyGoods(Stringuid);List<Goods>findAllGoodsPay();List<Goods>findAllGoodsPayByPage(intsatrt,intpagesize);} GoodPayServiceImpl實(shí)現(xiàn)層，代碼如下：@ServicepublicclassGoodsPayServiceImplimplementsGoodsPayService{@AutowiredGoodsPayMappergoodsPayMapper;@OverridepublicintinsertBuyGoods(Mapmap){returngoodsPayMapper.insertBuyGoods(map);}@OverridepublicList<Goods>findMyGoods(Stringuid){returngoodsPayMapper.findMyGoods(uid);}@OverridepublicList<Goods>findAllGoodsPay(){returngoodsPayMapper.findAllGoodsPay();}GoodPayMapper映射層，代碼如下：<selectid="findAllGoodsPay"resultType="com.shequ.pojo.Goods">selectg.goods_id,g.goods_title,g.goods_desc,g.goods_img,g.goods_price,fromgoodsginnerjoingoodspaygpongp.goods_id=g.goods_idinnerjoinuseru ongp.uid=u.uid</select><selectid="findAllGoodsPayByPage"resultType="com.shequ.pojo.Goods">selectg.goods_id,g.goods_title,g.goods_desc,g.goods_img,g.goods_price,fromgoodsginnerjoingoodspaygpongp.goods_id=g.goods_id innerjoinuseru ongp.uid=u.uid limit#{arg0},#{arg1}</select>（3）運(yùn)行結(jié)果查看預(yù)約的運(yùn)行結(jié)果，如圖5-8所示：圖5-8查看預(yù)約運(yùn)行結(jié)果圖5.5系統(tǒng)測(cè)試5.5.1黑盒測(cè)試本測(cè)試中，主要對(duì)系統(tǒng)的用戶注冊(cè)登陸、用戶預(yù)約、用戶查看預(yù)約記錄、管理員管理預(yù)約、管理員查看預(yù)約表5-1黑盒測(cè)試用例測(cè)試功能操作步驟預(yù)期目標(biāo)測(cè)試結(jié)果登錄與注冊(cè)輸入正確手機(jī)號(hào)和密碼點(diǎn)擊登陸按鈕輸入錯(cuò)誤用戶名或密碼點(diǎn)擊登陸按鈕輸入手機(jī)號(hào)和密碼點(diǎn)擊注冊(cè)按鈕第2步顯示登陸成功第4步顯示手機(jī)號(hào)或密碼