Git 倉庫
https://gitee.com/black_lacquer_white_moon/jmu-voting-system
需求分析
班級投票系統主要包括班級前台投票、投票結果查看和后台管理系統三個部分。班級前台投票包括投票主題和選項,選項可以是單選或多選,主要包含以下模塊:
- 顯示投票選項模塊:主要是顯示投票內容,即投票表單的實現;
- 參與投票模塊: 禁止重復投票;
- 顯示投票結果模塊:主要是投票選項的計數統計,通過柱狀圖更直觀的顯示各選項的票數;
后台管理主要包括投票項目的增加、修改和刪除,其中修改投票項目還可以包含對選項的修改和刪除:
- 管理員登錄驗證模塊;
- 投票主題顯示模塊:可以瀏覽投票主題及相關信息(投票總數、投票時間等),可實現分頁顯示;
- 投票主題增加模塊: 以表單的形式增加投票主題以及選項的個數;
- 投票項目的刪除:對於不需要的投票主題可實現刪除。
使用的技術
Web 部分
- HTML、CSS、JavaScript
- Ajax
- jQuery
- bootstrap
- JSON
- Servlet
- Cookie
DB 部分
- SQL
- MySQL
- JDBC
設計模式
- MVC 模式
- DAO 模式
- 前后端分離
開發環境
- JDK
- TOMCAT
- Eclipse
- Navicat
系統程序設計
數據庫設計
在需求分析階段我們采用的是自上而下的分析方法,那么要在其基礎上進一步作概念設計我們面臨的是細化的分析數據流圖以及數據字典,分析得到實體及其屬性后,進一步可分析各實體之間的聯系。
首先先找到實體,畫出系統各個實體的全局 E-R 圖。
由此可以得到系統的實體及其屬性如下:
- User(UsersID, UsersUsername, UsersPassword, UsersType)
- Item(ItemID, ItemTitle, ItemText, ItemType)
- Option(OptionID, OptionText, ItemID)
- Record(RecordID, UserID, ItemID, OptionID, RecordSendTime)
系統功能設計
- 學生管理員登錄驗證模塊:該模塊用於管理員和學生的登錄。登錄驗證后,學生和管理員才可以進入系統實行操作。未注冊過賬號的用戶可進行注冊后再登錄,賬號密碼可以更改。
- 顯示投票選項模塊:此模塊為學生進行一個投票項目的投票使用,針對投票項目的類型分為單選和多選,投票項目類型為單選則學生只能選擇一個選項進行投票;投票項目類型為單選則學生能選擇多個選項進行投票。
- 學生參與投票模塊:此模塊供用戶對投票項目進行投票所用。在投票首頁上,將會一個“進入投票”按扭,用戶可進入該投票項目自由選擇投票選項進行投票。投票操作具體為:用戶選擇一個投票選項,提交,即可投票成功,此時頁面會跳轉至顯示投票結果的頁面。
- 顯示投票結果模塊:此模塊供用戶查看該項目已有的投票情況。投票結果顯示頁面會顯示相應投票選項的得票率和該項目總的得票數。
- 管理員管理用戶模塊:此模塊為管理員操作的模塊,管理員可以管理系統內所有學生,對其信息進行修改以及添加學生信息。
- 投票項目增刪查改模塊:此模塊為管理員操作的模塊。管理員登入系統后,可對本系統的所以投票項目進行相應的管理,如:添加投票項目,刪除投票項目等。
- 投票選項增刪查改模塊:此模塊為管理員操作的模塊。管理員登入系統后,可對本系統的所以投票項目進行相應的管理添加投票項目對應的選項,以及刪除投票項目對應的選項等。
程序流程設計
系統流程圖如下,用戶在主頁可以選擇登陸、注冊或修改密碼。用戶登錄成功后,分別進入管理員或普通用戶頁面。普通用戶登錄完成后進入主界面,可以修改自己的信息,然后選擇投票項目參與投票。用戶若是管理員可以對用戶進行增刪改查、對項目進行增刪改查和對選項進行增刪改查。最后用戶選擇退出登錄,回到登錄界面。
數據庫實現
投票選項信息表
列名 | 數據類型 | 可否為空 | 說明 |
---|---|---|---|
Option_id | Int(11) | not null | 選項號 |
Option_text | text | null | 選項內容 |
Item_id | Int(11) | null | 投票項目號 |
投票項目信息表
列名 | 數據類型 | 可否為空 | 說明 |
---|---|---|---|
Item_id | Int(11) | not null | 投票項目號 |
Item_title | Varchar(255) | null | 投票項目名 |
Item_text | text | null | 投票描述信息 |
Item_type | Int(10 | null | 投票類型 |
學生投票記錄表
列名 | 數據類型 | 可否為空 | 說明 |
---|---|---|---|
Record_id | Int(11) | not null | 記錄號 |
User_id | Int(11) | not null | 用戶號 |
Item_id | Int(11) | not null | 投票項目號 |
Option_id | Int(11) | not null | 選項號 |
Send_time | datetime | null | 提交時間 |
用戶登錄表
列名 | 數據類型 | 可否為空 | 說明 |
---|---|---|---|
User_id | Int(11) | not null | 用戶號 |
Username_md5 | Varchar(255) | null | 用戶名(md5) |
Password_md5 | Varchar(255) | null | 密碼(md5) |
User_type | Int(11) | null | 用戶類型 |
用戶信息表
列名 | 數據類型 | 可否為空 | 說明 |
---|---|---|---|
Username | Varchar(255) | null | 用戶名 |
User_id | Int(11) | not null | 用戶號 |
Sex | Varchar(4) | null | 性別 |
Age | Int(3) | null | 年齡 |
Telephone | Varchar(11) | null | 聯系方式 |
學生投票記錄展示視圖
列名 | 數據類型 | 可否為空 | 說明 |
---|---|---|---|
Item_id | Int(11) | not null | 投票項目號 |
Username | Varchar(255) | null | 用戶名 |
Item_title | Varchar(255) | null | 投票項目名 |
Option_text | text | null | 選項內容 |
Send_time | datetime | null | 提交時間 |
選項提交記錄數視圖
列名 | 數據類型 | 可否為空 | 說明 |
---|---|---|---|
Item_id | Int(11) | not null | 投票項目號 |
Option_text | text | null | 選項內容 |
Total | Bigint(21) | not null | 投票總數 |
程序實現
程序結構
系統基於eclipse環境進行開發,使用Tomcat 8.5 作為服務器,使用MySQL 5.7 為數據庫存儲數據。項目的結構如圖所示:
程序包划分
Controller 包
Controller 包中有 19 個 servlet 文件,分別對應着 19 個接口,前端頁面可以通過向這些接口發送請求來獲取 JSON 數據。
Dao 包
Dao 包中放置 6 個 Dao 接口,分別對應了對數據庫中的表或者視圖的操作行為。實現類可以繼承 Dao 包中的方法,供其他程序調用。
Dao.impl 包
Dao.impl 包存儲 Dao 包中的接口的實現類,其中的 6 個實現類是基於 JDBC 的訪問 MySQL 數據庫的實現類。
Model 包
存放實體類,對應經過數據庫設計后得到的5個實體,數據庫取出數據時將使用這些實體對象存儲。
Utils 包
存放工具類,供其他類調用實現一些功能。
靜態資源
系統擁有的靜態資源如下所示。
功能展示
登錄與信息完善
用戶進入網頁后,首先看到的是登錄頁面。
對於用戶沒有填寫的內容,網頁會自動提示用戶。
如果用戶選擇注冊,則進入注冊頁面,如果用戶沒有按照要求填寫也會提示用戶。
用戶填寫用戶名和密碼后提交,即可完成注冊。
用戶輸入正確的用戶名和密碼后,即可登陸成功。
登錄成功后,用戶可以修改自己的信息。
修改后用戶可以查看自己的信息。
學生投票
選擇“學生投票”,用戶可以選擇投票項目。
進入投票項目后,用戶可以進行投票。
系統會檢查用戶的行為,阻止重復投票。
如果投票項目是多選的,則用戶可以選多個選項。
多選的投票項目同樣不能重復提交。
進入“投票結果”頁面,用戶可以查看投票結果,通過柱狀圖和餅狀圖呈現出來。
在搜索欄中,可以搜索其他投票項目的投票結果。
銷戶
用戶可以選擇銷戶,銷戶后用戶的所有投票記錄都會被刪除。
用其他的用戶登錄,可以看到投票記錄發生了變化,這是由於銷戶刪除了一些記錄導致的。
用戶可以修改密碼。
投票管理
管理員需要選擇身份是管理員才能登錄。
選擇“投票管理”,管理員可以對投票項目進行操作。
例如可以添加一個投票項目。
如圖所示添加成功。
可以選擇一個投票項目編輯它的選項。
如圖是添加選項。
可以看到已經添加了多個選項。
對於要刪除的選項,可以進行刪除,刪除選項后該選項的投票記錄也會被刪除。
也可以刪除整個投票項目,刪除后該投票項目的記錄都會被刪除。
如圖所示刪除成功。
用戶管理
進入“用戶管理”界面,管理員可以看到所有用戶的基本信息。
管理員可以編輯用戶的基本信息,但是不能改密碼。
可以看到用戶的信息被更改了。
完成情況
優點
- 通過 Ajax 向 Servlet 接口發送請求的方式實現前后端分離;
- 簡潔而有科技感的前端設計;
- 使用 DAO 模式編寫數據庫操作接口降低代碼耦合度;
- 數據庫設計合理,表的設計均達到 3NF,且在控制層實現實體完整性;
- 用戶敏感信息(密碼)加密存儲,使用數字簽名進行認證;
- 實現了投票系統的大部分需求,支持普通用戶和管理員的使用;
- 使用 Git 進行管理,代碼具有豐富的注釋和文檔注釋,易於維護。
缺點
- 網頁設計缺乏過濾手段,安全性較低;
- 前端頁面設計速度較慢導致開發效率較低,一部分功能沒有完全實現;
- 部分前端頁面布局設計不美觀,存在一定的生搬硬套;
- 后端接口缺乏過濾器對用戶進行驗證;
- 后端接口接收數據時照單全收,沒有進行數據類型的判別與檢驗;
- result.jsp 頁面(也就是唯一一個 jsp 文件)有未處理的 Bug。