摘?要

遠程預約是一種全新的網絡租用方式，它通過互聯網突破了時間和空間限制，實現了便捷快速的預約與管理功能。在對數據信息有效組織并整合了一定使用功能后，遠程預約系統可以方便地實現預約與取消，以及信息查詢等功能。經過本人的綜合考慮，自習室在線預約系統的設計是采取面對對象的開發模式進行軟件的開發和硬體的架設，能很好的滿足實際使用的需求，完善了對應的軟體架設以及程序編碼的工作，采取MySQL作為后臺數據的主要存儲單元，采用Springboot框架、JSP技術、Ajax技術進行業務系統的編碼及其開發，實現了系統的全部功能。本次報告，首先分析了研究的背景、作用、意義，為研究工作的合理性打下了基礎。針對自習室座位管理的各項需求以及技術問題進行分析，證明了自習室在線預約系統的必要性和技術可行性，然后對設計需要使用的技術軟件以及設計思想做了基本的介紹，最后來實現自習室在線預約系統的部署和運行。

關鍵詞：Springboot框架；Mysql數據庫；自習室在線預約

Springboot study room online reservation system

Abstract

Remote reservation is a new way of network rental. It breaks through the restrictions of time and space through the Internet and realizes convenient and fast reservation and management functions. After effectively organizing and integrating certain functions of data information, the remote reservation system can easily realize the functions of reservation, cancellation, information query and so on. After my comprehensive consideration, the design of the self-study room online reservation system adopts the object-oriented development mode for software development and hardware erection, which can well meet the needs of actual use, improve the corresponding software erection and program coding, take MySQL as the main storage unit of background data, and use springboot framework, JSP technology and Ajax technology for business system coding and development, All the functions of the system are realized. This report first analyzes the background, function and significance of the research, which lays a foundation for the rationality of the research work. This paper analyzes the various requirements and technical problems of self-study room seat management, proves the necessity and technical feasibility of self-study room online reservation system, and then makes a basic introduction to the technical software and design idea needed in the design. Finally, it realizes the deployment and operation of self-study room online reservation system.

Key words:Springboot framework; Mysql database; Self study room online reservation

目 ?錄

第1章 緒論

1.1?研究背景

1.2?研究內容

1.3?主要工作及論文結構

第2章 相關技術介紹

2.1 開發技術

2.2 Springboot框架介紹

2.3 MySQL數據庫

2.4 B/S結構

2.5 B/S體系工作原理

2.6?Springboot框架各層關系

2.7JavaScript 運行模式

第3章 系統分析

3.1?可行性分析

3.1.1?技術可行性

3.1.2?經濟可行性

3.1.3?社會可行性

3.2?系統功能需求

3.3?系統性能需求

3.4?業務流程分析

3.5?數據流程分析

第4章 系統設計

4.1?系統架構設計

4.2?總體結構設計

4.3?功能模塊設計

4.3.1?用戶模塊

4.3.2?管理員模塊

4.4?數據庫設計

4.4.1?概念設計

4.4.2?邏輯設計

第5章 系統實現

5.1?數據庫連接模塊的實現

5.2?登錄模塊的實現

5.3?用戶模塊的實現

5.3.1?注冊模塊的實現

5.3.2?自習教室管理模塊的實現

5.3.3?自習室預約模塊的實現

5.4?管理員模塊的實現

5.4.1?用戶管理模塊的實現

5.4.2?自習室分類管理模塊的實現 33

5.4.3?自習室預約管理模塊的實現 34

第6章 系統測試 35

6.2?測試目標 35

6.3?功能測試 37

6.4?測試結果 39

第7章 總結與展望 40

參考文獻 42

致謝 43

1. 緒論
   1. 研究背景

近年來，隨著辦學規模的逐漸擴大，大學生就業形勢日益嚴峻，就業壓力也逐年增大，為了應對激烈的社會競爭，越來越多的大學生加入考研和公務員考試的行列，各類職業資格考試也成為大學生進入相關行業工作的必備條件，從而造成自習室爆滿現象嚴重。目前，傳統的自習室預約管理方式為：學生通過電話或到自習室管理處進行自習室預約的申請，管理員用手工記錄自習室預約情況，管理員根據學生申請的具體條件和時間進行自習室分配，電話通知學生自習室預約成功或失敗。傳統的操作方式比較繁瑣，工作量大，操作也不規范。

為了提高實踐教學水平，規范自習室開放管理，迫切需要一套能夠替代傳統管理方式的自習室預約系統。因此，決定開發本系統，運用信息技術和計算機管理技術，建立自習室預約平臺，在網上公布自習室開放狀態，容納人數等信息，并采用網上預約的形式，方便學生學生通過網絡了解自習教室開放狀況。

1. 1. 研究內容

自習室在線預約系統的開發及實現，所需要的工作內容：

（1）首先是確定選題，確定好所要做的系統，并對系統的背景及現在面臨的一些問題等進行系統的初步確認。

（2）系統確認完成后，結合系統開發的需求進行確認系統開發所使用的技術，自習室在線預約系統的開發使用Springboot框架，數據庫進行平臺的搭建開發，確認好使用的技術進行技術分析，所使用的技術是否可以完成系統的實現。

（3）確定好系統使用的技術，進行在線確認系統所劃分的用戶角色，并且根據用戶角色劃分確定所要設計的功能模塊，對自習室在線預約系統的設計主要劃分別為管理員和用戶角色，并所使用的功能模塊也相應不同，但是系統的數據庫實現的內容是交互的，用戶可以隨時根據自己的需求進行信息查看，對于系統工作人員可以根據自己的分管內容進行在線信息的處理及操作，管理員獲取到所有用戶的詳細數據信息，并根據需求進行第一時間處理解決。

（4）系統的功能模塊確認完成后進行程序及界面的設計，設計完成后，并且通過測試來判斷程序是否完善，對于系統測試，需要不同的用戶進行不同的內容編輯及提交，及使用不同的測試方式找出程序中存在的漏洞，并對程序出現的漏洞問題進行在線解決處理，如果測試系統沒有任何問題時，可以將系統上傳進行正式操作使用。

1. 1. 主要工作及論文結構

本文的主要工作是研究如何將計算機和信息管理進行有機結合，從而利用Java語言以及Mysql數據庫技術在Dreamweaver中實現了系統的功能模塊，切實的開發出一套貼近￥新聞管理的實際，有效管理￥新聞的系統。

論文結構如下：

第一章緒論：主要對自習室在線預約系統的開發背景,研究現狀，目的,及意義進行了分析。

第二章開發技術及軟件：主要把系統開發工具進行介紹，另外講解開發系統所用到的一些特殊功能技術。

第三章系統分析：主要是對自習室在線預約系統進行需求分析，以及對其數據流程與功能進行分析。

第四章系統設計：主要根據系統需求對系統的設計進行介紹，以及對數據的開發與功能模塊設計的過程。

第五章系統實現：本章主要結合系統界面截圖，介紹了系統各個功能實現的結果。

第六章系統測試：本章系統進行功能模塊的測試，撰寫測試用例，確保系統各大功能準確無誤。

第七章總結與展望：對整個論文的研究內容進行總結，概括整個論文的特點，指出不足之處，為下步深究指明方向。

1. 相關技術介紹
   1. 開發技術

本系統前端部分基于MVVM模式進行開發，采用B/S模式，后端部分基于Java的Springboot框架進行開發。

前端部分：前端框架采用了比較流行的漸進式JavaScript框架Vue.js。使用Vue-Router和Vuex實現動態路由和全局狀態管理,Ajax實現前后端通信，Element UI組件庫使頁面快速成型，項目前端通過柵格布局實現響應式，可適應PC端、平板端、手機端等不同屏幕大小尺寸的完美布局展示。

后端部分：采用Springboot作為開發框架，同時集成MyBatis、Redis等相關技術。

1. 1. Springboot框架介紹

Springboot（Spring+SpringMVC+MyBatis）框架集由Spring、MyBatis兩個開源框架整合而成（SpringMVC是Spring中的部分內容）。常作為數據源較簡單的web項目的框架。

1.1 Spring

Spring就像是整個項目中裝配bean的大工廠，在配置文件中可以指定使用特定的參數去調用實體類的構造方法來實例化對象。也可以稱之為項目中的粘合劑。

Spring的核心思想是IoC（控制反轉），即不再需要程序員去顯式地`new`一個對象，而是讓Spring框架幫你來完成這一切。

1.2 SpringMVC

SpringMVC在項目中攔截用戶請求，它的核心Servlet即DispatcherServlet承擔中介或是前臺這樣的職責，將用戶請求通過HandlerMapping去匹配Controller，Controller就是具體對應請求所執行的操作。SpringMVC相當于SSH框架中struts。

1.3 mybatis

mybatis是對jdbc的封裝，它讓數據庫底層操作變的透明。mybatis的操作都是圍繞一個sqlSessionFactory實例展開的。mybatis通過配置文件關聯到各實體類的Mapper文件，Mapper文件中配置了每個類對數據庫所需進行的sql語句映射。在每次與數據庫交互時，通過sqlSessionFactory拿到一個sqlSession，再執行sql命令。

頁面發送請求給控制器，控制器調用業務層處理邏輯，邏輯層向持久層發送請求，持久層與數據庫交互，后將結果返回給業務層，業務層將處理邏輯發送給控制器，控制器再調用視圖展現數據。

?????????????

1. 1. MySQL數據庫

科技的進步，給日常帶來許多便利：教室的投影器用到了虛擬成像技術，數碼相機用到了光電檢測技術，比如超市貨物進出庫的記錄需要一個信息倉庫。這個信息倉庫就是數據庫，而這次的超市商品管理系統也需要這項技術的支持。

用MySQL這個軟件，是因為它能接受多個使用者訪問，而且里面存在Archive等。它會先把數據進行分類，然后分別保存在表里，這樣的特別操作就會提高數據管理系統自身的速度，讓數據庫能被靈活運用。MySQL的代碼是公開的，而且允許別人二次編譯升級。這個特點能夠降低使用者的成本，再搭配合適的軟件后形成一個良好的網站系統。雖然它有缺點，但是綜合各方面來說，它是使用者的主流運用的對象。

1. 1. B/S結構

B/S（Browser/Server）比前身架構更為省事的架構。它借助Web server完成數據的傳遞交流。只需要下載瀏覽器作為客戶端，那么工作就達到“瘦身”效果， 不需要考慮不停裝軟件的問題。

1. 1. B/S體系工作原理

B/S架構采取瀏覽器請求，服務器響應的工作模式。

用戶可以通過瀏覽器去訪問Internet上由Web服務器產生的文本、數據、圖片、動畫、視頻點播和聲音等信息；

而每一個Web服務器又可以通過各種方式與數據庫服務器連接，大量的數據實際存放在數據庫服務器中；

從Web服務器上下載程序到本地來執行，在下載過程中若遇到與數據庫有關的指令，由Web服務器交給數據庫服務器來解釋執行，并返回給Web服務器，Web服務器又返回給用戶。在這種結構中，將許許多多的網連接到一塊，形成一個巨大的網，即全球網。而各個企業可以在此結構的基礎上建立自己的Internet。

在 B/S 模式中，用戶是通過瀏覽器針對許多分布于網絡上的服務器進行請求訪問的，瀏覽器的請求通過服務器進行處理，并將處理結果以及相應的信息返回給瀏覽器，其他的數據加工、請求全部都是由Web Server完成的。通過該框架結構以及植入于操作系統內部的瀏覽器，該結構已經成為了當今軟件應用的主流結構模式。

1. 1. Springboot框架各層關系

DAO層、Service層這兩個層次都可以單獨開發，互相的耦合度很低，完全可以獨立進行，這樣的一種模式在開發大項目的過程中尤其有優勢。

Controller，View層因為耦合度比較高，因而要結合在一起開發，但是也可以看作一個整體獨立于前兩個層進行開發。這樣，在層與層之前只需要知道接口的定義，調用接口即可完成所需要的邏輯單元應用，一切顯得非常清晰簡單。

1. 1. JavaScript 運行模式

JavaScript是一種屬于網絡的高級腳本語言,已經被廣泛用于Web應用開發,常用來為網頁添加各式各樣的動態功能,為用戶提供更流暢美觀的瀏覽效果。通常JavaScript腳本是通過嵌入在HTML中來實現自身的功能的。

1.1是一種解釋性腳本語言（代碼不進行預編譯）。

1.2主要用來向HTML（標準通用標記語言下的一個應用）頁面添加交互行為。

1.3可以直接嵌入HTML頁面，但寫成單獨的js文件有利于結構和行為的分離。

1.4跨平臺特性，在絕大多數瀏覽器的支持下，可以在多種平臺下運行（如Windows、Linux、Mac、Android、iOS等）。

1.5 JavaScript腳本語言同其他語言一樣，有它自身的基本數據類型，表達式和算術運算符及程序的基本程序框架。JavaScript提供了四種基本的數據類型和兩種特殊數據類型用來處理數據和文字。而變量提供存放信息的地方，表達式則可以完成較復雜的信息處理。

1. 系統分析
   1. 可行性分析

開發任何一個系統，都要對其可行性進行分析，對其時間和資源上的限制進行考慮，這樣可以減少系統開發的風險。同時，分析之后不僅能夠合理的運用人力，還能在各方面資源的消耗上得到節省。下面就對技術、經濟和社會三個方面來介紹。

1. 1. 1. 技術可行性

技術可行性主要考慮當前項目所用的技術是否能夠符合，在設備上是否能夠滿足，及各種輔助工具是否提供幫助。本系統用的是Java開發語言，調試相對簡單，當前的計算機硬件配置也完全能滿足開發的需求，因此在技術上是絕對可行的。軟件方面：由于軟件的開發平臺成熟可行,它們速度快、容量大、可靠性能高、價格低，完全能滿足系統的需求。采用Java編程語言，已無技術上的問題。

1. 1. 1. 經濟可行性

系統所采用的主流的Springboot框架進行系統主體框架的搭建和Mysql后端數據庫均為免費開發工具。故開發成本主要集中在后期的推廣及系統維護上。相對于成本較高的C/S模式，也是選用了成本較低的B/S模式，所以經濟上幾乎沒任何問題。

1. 1. 1. 社會可行性

本系統是自行開發的系統，以方便自習室在線預約為出發點，是具有實際意義的系統，開發的環境軟件和用到的數據庫也都是開源代碼，不存在侵權等問題，所以在社會方面也是可行的。

1. 1. 系統功能需求

學生用例圖如下所示。

圖3-1 學生用例圖

管理員用例圖如下所示。

圖3-2 管理員用例圖

通過對用例圖的分析和調查，根據本系統的實際需要，從用戶角度提出需求功能如下：

1.管理員功能需求：

用戶管理模塊：管理員查看用戶基本信息，并實現對用戶信息的增加、刪除、修改等功能。

修改登錄密碼模塊：修改管理員用戶的登錄密碼。

注冊管理模塊：管理員查看用戶注冊信息，內容，審核。

自習教室管理模塊：管理員查看自習教室表，并且添加教室數據，也能夠刪除教室數據。

預約管理模塊：根據學生的實際預約，管理員對自習室信息的公布維護、預約處理等操作。

取消預約管理模塊：學生可以在線進行預約取消申請，管理員對學生的申請進行審核。

預約簽到管理模塊：對自習室預約簽到信息進行維護管理。

2.用戶功能需求：

用戶注冊模塊：將用戶信息錄入數據庫，用戶利用注冊的賬號以及密碼登錄系統，瀏覽查看各種信息，添加部分信息；

預約模塊：用戶提交自習室預約申請，等待審核。

取消預約模塊：用戶取消自習室預約，輸入具體取消信息，預約編號，自習室類型，自習室名稱等，提交取消申請，管理員對取消進行審核。

個人信息模塊：修改信息功能，用戶修改個人資料信息，但不能修改賬號；密碼修改功能，修改登錄密碼。

預約簽到模塊：從管理員發布的預約數據中選擇要預約的自習室，進行簽到記錄。

1. 1. 系統性能需求

評判一個系統好壞的一項重要指標就是性能，下面是對此系統的一些性能進行闡述。

1.系統的安全性和穩定性: 自習室在線預約系統在管理權限上有著嚴格的控制，即想登錄此平臺進行操作，則必須要有操作權限，沒有權限的用戶是不可能登錄平臺查看任何的信息和數據，從而確保了系統的安全性。

2.數據的完整性和準確性：第一個是各項記錄信息的完整性，信息記錄的內容可以為空；第二個是各項信息數據之間相互聯系的準確性；第三個是數據在不同記錄信息的一致性

3．用戶操作系統簡單方便

在系統開發中按照“簡單易用”的原則，能夠使用戶對系統的使用一目了然，既能保證用戶使用，同時又能保證維護人員方便維護。

1. 1. 業務流程分析

業務流程圖不僅能反映出內部業務之間的關系，而且能體現出作業順序及信息的流動。自習室在線預約系統必須支持整個組織在不同層次上的各種功能，各個功能模塊之間又有各種不同相關的信息進行聯系，構成了一個有機的整體，根據高校自習室座位管理的特點以及結合所面臨的實際情況，設計出了系統的業務流程圖。

系統的業務流程如下圖所示。

圖3-1系統業務流程圖

1. 1. 數據流程分析

在分析了系統的業務流程之后，就要分析系統的數據流，為后面設計系統的數據庫做好基礎。這里主要利用數據流程圖來說明數據流程。數據流程圖是一個圖示工具，容易理解，容易在開發和用戶方之間進行交流，以及在開發組織內部交流。因此數據流程圖作為一種模型工具已經廣泛使用在軟件工程的實踐中。

系統的頂層數據流圖如下圖所示。

圖3-2系統數據流圖（頂層）

根據系統的業務流程，用戶瀏覽所使用到的數據歸納為輸出信息。而用戶提交的數據則作為系統的輸入數據。相應的，根據系統管理員業務流程，管理員對系統內容的添加、更新和刪除等所操作的數據定義為輸入信息。

系統的底層數據流圖如下圖所示。

圖3-3系統數據流圖（底層）

1. 系統設計
   1. 系統架構設計

自習室在線預約系統架構設計主要分為可以3層，主要有Web層，業務層，Model層。其中web層還包括View層和Controller層，Model層包括元數據擴展層和數據訪問層。

圖4-1系統架構圖

視圖層視圖是指被用戶所看到的并且能夠與之進行交互的界面。視圖可以向用戶展示相關的數據，并接收用戶輸入的數據，但對用戶數據不進行任何實際業務操作處理。

模型層通過控制層來處理視圖層傳遞的數據，同一個模型可以給不同的視圖提供數據，也可以被不同的視圖重復使用。由于 Model 的主要內容是數據、方法和行為，其也是 MVVM?中邏輯最為復雜，代碼量最多的部分，其中包含了許多應用中需要用到的業務邏輯，因此模型層的開發也變得尤為重要，后期一般不會對模型層進行大規模改動，也是 MVVM最穩定的部分。

控制層主要負責視圖層和模型層之間的數據傳輸和處理請求操作。當用戶通過視圖發送數據和請求時，控制層可以接收請求和數據并決定調用哪些模型、通過模型的哪些操作來處理數據和請求，處理完成后，控制層再將數據返回給相應的視圖。

1. 1. 總體結構設計

根據對系統的功能進行分析可以總結自習室在線預約系統的具體功能模塊包括下面的幾個主要的功能模塊：該系統主要從兩大模塊進行設計的，首先就是用戶參與操作需要的模塊，此外還需要有管理員用到的模塊，兩者之間不是互相獨立的，他們之間有著密切的聯系，同數據庫表中的數據連接起來進行操作。每個模塊訪問相同的數據庫，但訪問的表不同。系統的各個功能模塊是根據所收集的資料研究得到的。在以上分析功能的基礎上，系統模塊分為多個模塊。用戶含有的功能有注冊登錄，自習室預約、預約簽到、預約取消、自習室分類、考勤信息等，退出登錄等功能，管理員含有的功能有修改密碼，用戶管理、自習室分類管理、預約管理、預約取消管理、考勤信息管理等功能。

系統的功能結構圖如下圖所示。

圖4-2系統功能結構圖

1. 1. 功能模塊設計
      1. 用戶模塊

用戶模塊主要實現用戶的注冊、登錄、自習教室搜索、自習室預約、預約簽到、取消預約、考勤信息等功能。

用戶注冊：用戶通過賬號注冊得到用戶名和密碼。

用戶登錄：用戶在被管理員添加成功后，通過管理員提供的用戶名、密碼和輸入驗證碼進行登錄，操作非常簡單。

個人資料管理：用戶根據用戶ID修改當前ID的一些屬性的值。

修改個人登錄密碼：用戶登錄高校自習室在線預約系統后可以自己修改自己的密碼。

自習教室搜索：用戶可以在線搜索并查看系統發布的自習教室信息。

預約中心：用戶提交自習室在線預約申請，等待審核。

取消預約管理：用戶取消自習室預約，輸入具體取消信息，預約編號，自習室類型，自習室名稱等，提交取消申請，管理員對取消進行審核。

預約簽到：用戶進行自習室預約登記。

1. 1. 1. 管理員模塊

管理員模塊是本系統重要開發部分，它的使用對象是系統管理員，在進入管理員模塊前，需要輸入正確的用戶姓名、密碼和驗證碼，才能進入管理員模塊。界面右上方有退出系統按鈕，點擊可退出管理員模塊界面。

系統用戶管理：管理員添加、管理、查詢管理員信息并有修改他們密碼的權限。

注冊用戶管理：管理員管理已注冊的用戶，審核剛注冊的用戶，修改用戶的基本信息。

自習室預約模塊：用戶提交自習室預約申請，等待審核。

個人信息模塊：修改信息功能，用戶修改個人資料信息，但不能修改賬號；密碼修改功能，修改登錄密碼。

預約簽到模塊：從管理員發布的預約數據中選擇要預約的自習教室，進行簽到記錄。

1. 1. 數據庫設計
      1. 概念設計

E-R圖一般是由實體、實體的屬性與聯系三個要素組成的。在規劃系統中所使用的數據庫實體對象及實體E-R圖，則需要通過對系統的需求分析、業務流程設計和系統功能結構來確定的。

總體ER圖如下圖所示。

圖4-3總體ER圖

1. 1. 1. 邏輯設計

將實體屬性模型轉換為關系數據庫應該遵循以下幾個原則：

1.一個實體轉換后要對應一個關系。

2.所有的主鍵必須要定義為非空（not null）。

3.針對二元聯系也應該按照一對多、弱對實、一對一和多對多等聯系來定義外鍵。

得到數據庫的關系后，設計如下表結構。

名稱	類型	長度	不是null	主鍵	注釋
group_id	mediumint	8	是	是	用戶組ID
display	smallint	4	是	否	顯示順序
name	varchar	16	是	否	名稱
description	varchar	255	否	否	描述
source_table	varchar	255	否	否	來源表：
source_field	varchar	255	否	否	來源字段：
source_id	int	10	是	否	來源ID：
register	smallint	1	否	否	注冊位置:
create_time	timestamp	0	是	否	創建時間：
update_time	timestamp	0	是	否	更新時間：

名稱	類型	長度	不是null	主鍵	注釋
study_room_seats_id	int	11	是	是	自習教室ID
study_room_no	varchar	64	否	否	自習室編號
name_of_study_room	varchar	64	否	否	自習室名稱
self_study_room_pictures	varchar	255	否	否	自習室圖片
position	varchar	64	否	否	位置
use_rules	text	0	否	否	使用規則
study_room_type	varchar	64	否	否	自習室類型
hits	int	11	是	否	點擊數
praise_len	int	11	是	否	點贊數
examine_state	varchar	16	是	否	審核狀態
recommend	int	11	是	否	智能推薦

名稱	類型	長度	不是null	主鍵	注釋
study_room_reservation_id	int	11	是	是	預約ID
reservation_number	varchar	64	否	否	預約編號
study_room_no	varchar	64	否	否	自習室編號
name_of_study_room	varchar	64	否	否	自習室名稱
student_number	int	11	否	否	學號
full_name	varchar	64	否	否	姓名

名稱	類型	長度	不是null	主鍵	注釋
Retreat management_id	int	11	是	是	取消預約管理ID
reservation_number	varchar	64	否	否	預約編號
study_room_no	varchar	64	否	否	自習室編號
name_of_study_room	varchar	64	否	否	自習室名稱
student_number	int	11	否	否	學號
time_of_appointment	varchar	64	否	否	取消時間
cancellation_reason	text	0	否	否	取消原因
examine_state	varchar	16	是	否	審核狀態
recommend	int	11	是	否	智能推薦
create_time	datetime	0	是	否	創建時間
update_time	timestamp	0	是	否	更新時間

名稱	類型	長度	不是null	主鍵	注釋
check_in_id	int	11	是	是	預約簽到ID
reservation_number	varchar	64	否	否	預約編號
study_room_no	varchar	64	否	否	自習室編號
name_of_study_room	varchar	64	否	否	自習室名稱
student_number	int	11	否	否	學號
full_name	varchar	64	否	否	姓名
examine_state	varchar	16	是	否	審核狀態
recommend	int	11	是	否	智能推薦
create_time	datetime	0	是	否	創建時間
update_time	timestamp	0	是	否	更新時間
名稱	類型	長度	不是null	主鍵	注釋
appointment_check_in_id	int	11	是	是	簽到ID
reservation_number	varchar	64	否	否	編號
study_room_no	varchar	64	否	否	自習室編號
name_of_study_room	varchar	64	否	否	自習室名稱

1. 系統實現
   1. 數據庫連接模塊的實現

從web系統查詢數據的根本的查詢步驟：

Step1: 進行檢查并且過濾來自用戶的系統數據；

Step2: 成立起一個合適的數據庫進行連接；

Step3: 進行查詢系統數據庫；

Step4: 獲得查詢的結構；

Step5: 把查詢的結果展示給用戶。

Step6: 數據庫連接斷開，釋放資源。

數據庫連接原理如下圖所示。

圖5-1數據庫連接原理

數據庫連接關鍵代碼如下所示。

server:

??port: 5000

??servlet:

????context-path: /api

spring:

??datasource:

????url: jdbc:mysql://127.0.0.1:3306/CS725260_20211101091736?serverTimezone=GMT%2B8&useSSL=false&characterEncoding=utf-8

????username: root

????password: root

????driver-class-name: com.mysql.cj.jdbc.Driver

??jackson:

????property-naming-strategy: CAMEL_CASE_TO_LOWER_CASE_WITH_UNDERSCORES

????default-property-inclusion: ALWAYS

????time-zone: GMT+8

????date-format: yyyy-MM-dd HH:mm:ss

??servlet:

????multipart:

??????max-file-size: 100MB

??????max-request-size: 100MB

1. 1. 登錄模塊的實現

為確保系統安全性，系統操作員只有在登錄界面輸入正確的用戶名、密碼、權限以及驗證碼，單擊“登錄”按鈕后才能夠進入本系統的主界面。

用戶登錄流程圖如下所示。

圖5-2用戶登錄流程圖

登錄界面如下圖所示。

圖5-3登錄界面

用戶登錄的邏輯代碼如下所示。

?/**

?????* 登錄

?????* @param data

?????* @param httpServletRequest

?????* @return

?????*/

????@PostMapping("login")

????public Map<String, Object> login(@RequestBody Map<String, String> data, HttpServletRequest httpServletRequest) {

????????log.info("[執行登錄接口]");

????????String username = data.get("username");

????????String email = data.get("email");

????????String phone = data.get("phone");

????????String password = data.get("password");

????????List resultList = null;

????????Map<String, String> map = new HashMap<>();

????????if(username != null && "".equals(username) == false){

????????????map.put("username", username);

????????????resultList = service.select(map, new HashMap<>()).getResultList();

????????}

????????else if(email != null && "".equals(email) == false){

????????????map.put("email", email);

????????????resultList = service.select(map, new HashMap<>()).getResultList();

????????}

????????else if(phone != null && "".equals(phone) == false){

????????????map.put("phone", phone);

????????????resultList = service.select(map, new HashMap<>()).getResultList();

????????}else{

????????????return error(30000, "賬號或密碼不能為空");

????????}

????????if (resultList == null || password == null) {

????????????return error(30000, "賬號或密碼不能為空");

????????}

????????//判斷是否有這個用戶

????????if (resultList.size()<=0){

????????????return error(30000,"用戶不存在");

????????}

????????User byUsername = (User) resultList.get(0);

????????Map<String, String> groupMap = new HashMap<>();

????????groupMap.put("name",byUsername.getUserGroup());

????????List groupList = userGroupService.select(groupMap, new HashMap<>()).getResultList();

????????if (groupList.size()<1){

????????????return error(30000,"用戶組不存在");

????????}

????????UserGroup userGroup = (UserGroup) groupList.get(0);

????????//查詢用戶審核狀態

????????if (!StringUtils.isEmpty(userGroup.getSourceTable())){

????????????String sql = "select examine_state from "+ userGroup.getSourceTable() +" WHERE user_id = " + byUsername.getUserId();

????????????String res = String.valueOf(service.runCountSql(sql).getSingleResult());

????????????if (res==null){

????????????????return error(30000,"用戶不存在");

????????????}

????????????if (!res.equals("已通過")){

????????????????return error(30000,"該用戶審核未通過");

????????????}

????????}

????????//查詢用戶狀態

????????if (byUsername.getState()!=1){

????????????return error(30000,"用戶非可用狀態，不能登錄");

????????}

????????String md5password = service.encryption(password);

????????if (byUsername.getPassword().equals(md5password)) {

????????????// 存儲Token到數據庫

????????????AccessToken accessToken = new AccessToken();

????????????accessToken.setToken(UUID.randomUUID().toString().replaceAll("-", ""));

????????????accessToken.setUser_id(byUsername.getUserId());

????????????tokenService.save(accessToken);

????????????// 返回用戶信息

????????????JSONObject user = JSONObject.parseObject(JSONObject.toJSONString(byUsername));

????????????user.put("token", accessToken.getToken());

????????????JSONObject ret = new JSONObject();

????????????ret.put("obj",user);

????????????return success(ret);

????????} else {

????????????return error(30000, "賬號或密碼不正確");

????????}

}

1. 1. 用戶模塊的實現
      1. 注冊模塊的實現

用戶輸入用戶名、密碼、電話、姓名等必填信息后，點擊注冊按鈕完成用戶的注冊。

用戶注冊流程圖如下所示。

圖5-4用戶注冊流程圖

用戶注冊邏輯代碼如下：

?/**

?????* 注冊

?????* @param user

?????* @return

?????*/

????@PostMapping("register")

????public Map<String, Object> signUp(@RequestBody User user) {

????????// 查詢用戶

????????Map<String, String> query = new HashMap<>();

????????query.put("username",user.getUsername());

????????List list = service.select(query, new HashMap<>()).getResultList();

????????if (list.size()>0){

????????????return error(30000, "用戶已存在");

????????}

????????user.setUserId(null);

????????user.setPassword(service.encryption(user.getPassword()));

????????service.save(user);

????????return success(1);

}

/**

?????* 用戶ID：[0,8388607]用戶獲取其他與用戶相關的數據

?????*/

????@Id

????@GeneratedValue(strategy = GenerationType.IDENTITY)

????@Column(name = "user_id")

????private Integer userId;

????/**

?????* 賬戶狀態：[0,10](1可用|2異常|3已凍結|4已注銷)

?????*/

????@Basic

????@Column(name = "state")

????private Integer state;

????/**

?????* 所在用戶組：[0,32767]決定用戶身份和權限

?????*/

????@Basic

????@Column(name = "user_group")

????private String userGroup;

????/**

?????* 上次登錄時間：

?????*/

????@Basic

????@Column(name = "login_time")

????private Timestamp loginTime;

????/**

?????* 手機號碼：[0,11]用戶的手機號碼，用于找回密碼時或登錄時

?????*/

????@Basic

????@Column(name = "phone")

????private String phone;

????/**

?????* 手機認證：[0,1](0未認證|1審核中|2已認證)

?????*/

????@Basic

????@Column(name = "phone_state")

????private Integer phoneState;

????/**

?????* 用戶名：[0,16]用戶登錄時所用的賬戶名稱

?????*/

????@Basic

????@Column(name = "username")

????private String username;

????/**

?????* 昵稱：[0,16]

?????*/

????@Basic

????@Column(name = "nickname")

????private String nickname;

????/**

?????* 密碼：[0,32]用戶登錄所需的密碼，由6-16位數字或英文組成

?????*/

????@Basic

????@Column(name = "password")

????private String password;

????/**

?????* 郵箱：[0,64]用戶的郵箱，用于找回密碼時或登錄時

?????*/

????@Basic

????@Column(name = "email")

????private String email;

????/**

?????* 郵箱認證：[0,1](0未認證|1審核中|2已認證)

?????*/

????@Basic

????@Column(name = "email_state")

????private Integer emailState;

????/**

?????* 頭像地址：[0,255]

?????*/

????@Basic

????@Column(name = "avatar")

????private String avatar;

????/**

?????* 創建時間：

?????*/

????@Basic

????@Column(name = "create_time")

????@JsonFormat(pattern = "yyyy-MM-dd HH:mm:ss")

????private Timestamp createTime;

????@Basic

????@Transient

????private String code;

}

1. 1. 1. 自習教室管理模塊的實現

用戶點擊某個自習教室進入自習教室信息詳細頁，點擊搜索按鈕進入教室列表頁，搜索具體信息。

自習教室管理流程圖如下所示。

圖5-5自習教室管理流程圖

自習教室管理界面如圖所示。

圖5-6自習教室管理界面

自習教室管理關鍵代碼如下所示。

?@PostMapping("/add")

????@Transactional

????public Map<String, Object> add(HttpServletRequest request) throws IOException {

????????service.insert(service.readBody(request.getReader()));

????????return success(1);

????}

????@Transactional

????public Map<String, Object> addMap(Map<String,Object> map){

????????service.insert(map);

????????return success(1);

}

????public Map<String,Object> readBody(BufferedReader reader){

????????BufferedReader br = null;

????????StringBuilder sb = new StringBuilder("");

????????try{

????????????br = reader;

????????????String str;

????????????while ((str = br.readLine()) != null){

????????????????sb.append(str);

????????????}

????????????br.close();

????????????String json = sb.toString();

????????????return JSONObject.parseObject(json, Map.class);

????????}catch (IOException e){

????????????e.printStackTrace();

????????}finally{

????????????if (null != br){

????????????????try{

????????????????????br.close();

????????????????}catch (IOException e){

????????????????????e.printStackTrace();

????????????????}

????????????}

????????}

????????return null;

}

????public void insert(Map<String,Object> body){

????????StringBuffer sql = new StringBuffer("INSERT INTO ");

????????sql.append("`").append(table).append("`").append(" (");

????????for (Map.Entry<String,Object> entry:body.entrySet()){

????????????sql.append("`"+humpToLine(entry.getKey())+"`").append(",");

????????}

????????sql.deleteCharAt(sql.length()-1);

????????sql.append(") VALUES (");

????????for (Map.Entry<String,Object> entry:body.entrySet()){

????????????Object value = entry.getValue();

????????????if (value instanceof String){

????????????????sql.append("'").append(entry.getValue()).append("'").append(",");

????????????}else {

????????????????sql.append(entry.getValue()).append(",");

????????????}

????????}

????????sql.deleteCharAt(sql.length() - 1);

????????sql.append(")");

????????log.info("[{}] - 插入操作：{}",table,sql);

????????Query query = runCountSql(sql.toString());

????????query.executeUpdate();

????}

1. 1. 1. 自習室預約模塊的實現

用戶點擊某個自習室進入預約詳細頁，點擊報名預約按鈕進入自習室信息頁，提交預約信息，管理員管理用戶的自習室預約信息，審核預約信息。

自習室預約流程圖如下所示。

圖5-7自習室預約流程圖

自習室座位預約如圖所示。

圖5-8自習室座位預約界面

自習室座位預約關鍵代碼如下所示。

??@RequestMapping("/get_list")

????public Map<String, Object> getList(HttpServletRequest request) {

????????Map<String, Object> map = service.selectToPage(service.readQuery(request), service.readConfig(request));

????????return success(map);

}

1. 1. 管理員模塊的實現
      1. 用戶管理模塊的實現

系統用戶管理主要是對新用戶的添加和舊用戶的刪除。新用戶的添加主要是指添加用戶名稱并確定其密碼；舊用戶的刪除也是從下拉菜單中找到對應的用戶名稱將其刪除。不論是新用戶添加還是舊用戶的刪除，這個權限只有管理員具有。

用戶管理流程圖如下所示。

圖5-9用戶管理流程圖

系統用戶管理關鍵代碼如下所示。

?@RequestMapping(value = {"/avg_group", "/avg"})

public Map<String, Object> avg(HttpServletRequest request) {

????????Query count = service.avg(service.readQuery(request), service.readConfig(request));

????????return success(count.getResultList());

}

1. 1. 1. 自習室分類管理模塊的實現

自習室分類管理功能主要指對其自習室類型、名稱等一些基本信息進行分類添加、刪除和修改。

自習室分類管理流程圖如下所示。

圖5-10自習室分類管理流程圖

自習室分類管理如下圖所示。

圖5-11自習室分類管理界面

自習室分類管理關鍵代碼如下所示。

?@RequestMapping("/get_list")

????public Map<String, Object> getList(HttpServletRequest request) {

????????Map<String, Object> map = service.selectToPage(service.readQuery(request), service.readConfig(request));

????????return success(map);

}

1. 1. 1. 自習室預約管理模塊的實現

用戶選擇自習室預約申請，管理員審核自習室預約信息，管理所有用戶的預約信息。

預約管理流程圖如下所示。

圖5-12預約管理流程圖

自習室預約管理界面如下所示。

圖5-13自習室預約管理界面

自習室預約管理關鍵代碼如下所示。

@RestController

@RequestMapping("auth")

public class AuthController extends BaseController<Auth, AuthService> {

????/**

?????* 服務對象

?????*/

????@Autowired

????public AuthController(AuthService service) {

????????setService(service);

????}

}

1. 系統測試
   1. 測試目標

系統測試是用于檢查軟件的質量、性能、可靠性等是否符合用戶需求。一套嚴謹的、規范的、完善的測試過程將大大提高軟件的質量、可信度、可靠性，降低軟件的出錯率，降低用戶風險系數。通過在計算機上對系統進行測試試驗并從中發現此系統中存在的問題和錯誤然后加以修改，使之更加符合用戶需求。

1.測試的目的是通過測試來發現程序在執行過程中的錯誤的過程。

2.好的測試方案是可以檢驗出還未被發現的錯誤的方案。

3.好的測試是發現了到目前為止還未被發現的錯誤的測試。

4.該系統能夠完成自習教室信息維護、用戶維護、系統維護等功能，做到所開發的系統操作簡單，盡量使系統操作不受用戶對電腦知識水平的限制。

1. 1. 功能測試

下表是自習室在線預約系統的測試用例，檢測了自習教室管理中對自習教室信息的增加，刪除，修改，查詢操作是否成功運行。觀察系統的響應情況，得出該功能也達到了設計目標，系統運行正確。

前置條件；用戶登錄系統。

表6-1 自習教室信息管理的測試用例

功能描述	用于自習教室信息管理
測試目的	檢測自習教室信息管理時的各種操作的運行情況
測試數據以及操作	預期結果	實際結果
點擊添加自習教室信息，必填項合法輸入，點擊保存	提示添加成功	與預期結果一致
點擊添加自習教室信息，必填項輸入不合法，點擊保存	提示必填項不能為空	與預期結果一致
點擊修改自習教室信息，必填項修改為空，點擊保存	提示必填項不能為空	與預期結果一致
點擊修改自習教室信息，必填項輸入不合法，點擊保存	提示必填項不能為空	與預期結果一致
點擊刪除自習教室信息，選擇自習教室信息刪除	提示刪除成功	與預期結果一致
點擊搜索自習教室信息，輸入存在的自習教室信息名	查找出自習教室信息	與預期結果一致
點擊搜索自習教室信息，輸入不存在的自習教室信息名	不顯示自習教室信息	與預期結果一致

下表是自習室預約管理功能的測試用例，檢測了自習室預約管理中自習室預約單的操作是否成功運行。觀察系統的響應情況，得出該功能也達到了設計目標，系統運行正確。

前置條件；用戶登錄系統。

表6-2 自習室預約管理的測試用例

功能描述	用于自習室預約管理
測試目的	檢測自習室預約管理時各種操作的情況
測試數據以及操作	預期結果	實際結果
未選擇高校自習室，點擊提交	提示請選擇高校自習室	與預期結果一致

1. 1. 測試結果

根據以上測試情況，測試結果如下表所示。

表6-1測試結果表

測試項目	測試結果
登錄測試	成功
修改密碼測試	成功
自習教室測試	成功
預約測試	成功
預約簽到測試	成功
用戶管理測試	成功
取消預約管理測試	成功
考勤信息管理測試	成功
公告管理測試	成功
自習室分類測試	成功

1. 總結與展望

本研究針對自習室在線預約系統地需求建模，數據建模及過程建模分析設計并實現自習室在線預約系統的過程。給出系統應用架構并分析優劣勢，通過功能分解圖，系統組件圖描述功能需求。設計建立了數據庫，給出系統關鍵數據結構的定義。通過類關系圖描述組件間的協作關系，給出各個類的定義方法。通過描述每一個類的字段，屬性及方法實現自習室在線預約系統的前后端代碼。最終給出系統集成整合方法，完成自習室在線預約系統地設計與實現。

在此項目的開發中，明白了前后臺在整個系統中起到了什么作用，因為前后臺的連接，用戶可以對系統進行操作，可以在輸入自己的相關信息后，通過后臺加工，完成對數據庫的查找、修改、添加，而理解了這些關系與實現的方法后。再去完善整個系統的功能就更加清晰與簡單了。此次的項目它涉及了前臺與后臺系統的搭建，在學校所學的知識基礎上，此次的項目，讓我對于一個系統的前端開發，以及后臺的作用都有了一個更深切的認知。