https://www.bilibili.com/video/BV1eA4m1G7gX/

演示視頻：

4 系統(tǒng)實(shí)現(xiàn)

在網(wǎng)上報(bào)名系統(tǒng)完成的的生命周期中，經(jīng)過(guò)需求分析、系統(tǒng)設(shè)計(jì)的階段之后，就開(kāi)始了系統(tǒng)實(shí)施階段既系統(tǒng)實(shí)現(xiàn)階段。系統(tǒng)分析和設(shè)計(jì)階段的主要工作集中在邏輯、功能和技術(shù)的設(shè)計(jì)上，系統(tǒng)實(shí)現(xiàn)階段的任務(wù)繼承了前面各個(gè)階段的工作成果，并將技術(shù)設(shè)計(jì)轉(zhuǎn)化為物理實(shí)現(xiàn)，所以說(shuō)系統(tǒng)實(shí)現(xiàn)的工作成果是系統(tǒng)分析和系統(tǒng)設(shè)計(jì)階段的結(jié)晶。

 人機(jī)交互子系統(tǒng)是用戶所能直接看到的，是給用戶的第一感覺(jué)，他現(xiàn)在已經(jīng)成為判斷一個(gè)軟件好壞的重要標(biāo)準(zhǔn)。一個(gè)易用、低錯(cuò)、適應(yīng)、美觀的界面，能夠使用戶自如的完成操作。

3.1管理員登陸界面

為了保證系統(tǒng)的安全性，管理員要使用本系統(tǒng)必須先登陸到系統(tǒng)中。管理員登錄采用AJAX方式進(jìn)行驗(yàn)證，先是在前臺(tái)獲取管理員輸入的登錄賬號(hào)、密碼，點(diǎn)擊登錄后，通過(guò)AJAX方式，后臺(tái)異步進(jìn)行驗(yàn)證，實(shí)現(xiàn)頁(yè)面無(wú)刷新的管理員登錄。程序運(yùn)行效果圖如圖3.1所示：

圖3.1管理員登陸頁(yè)面設(shè)計(jì)

在登陸頁(yè)面后，輸入用戶名和用戶密碼，點(diǎn)擊提交按鈕，就會(huì)跳轉(zhuǎn)到登陸的service中，在該service中對(duì)用戶名及密碼進(jìn)行判斷，如果輸入正確會(huì)提示“通過(guò)驗(yàn)證”，進(jìn)入到管理員操作界面，如果輸入錯(cuò)誤則提示“用戶名和密碼不正確”，“用戶名不能為空”，“密碼不能為空”等提示信息，然后頁(yè)面又會(huì)跳轉(zhuǎn)回到登陸頁(yè)面。

3.2管理員主頁(yè)面

管理員主頁(yè)面的左方頁(yè)面展示了管理員可操作的功能菜單，進(jìn)入相關(guān)的管理頁(yè)面可以鏈接到子菜單，每個(gè)管理模塊下面都有相應(yīng)的子菜單。程序運(yùn)行效果圖如圖3.2所示。

圖3.2管理員主頁(yè)面

在系統(tǒng)中必要的jsp頁(yè)面將會(huì)對(duì)用戶進(jìn)行攔截操作，這樣可以提高安全性，防止用戶不經(jīng)過(guò)登陸頁(yè)面而進(jìn)入任何子菜單頁(yè)面：

3.4報(bào)名信息管理模塊

該管理模塊實(shí)現(xiàn)管理員對(duì)報(bào)名信息的管理操作。點(diǎn)擊報(bào)名信息管理菜單，系統(tǒng)調(diào)用后臺(tái)對(duì)應(yīng)的報(bào)名Action類(lèi)查詢出所有的報(bào)名信息，并把這些信息封裝到數(shù)據(jù)集合List中，綁定到request對(duì)象，然后頁(yè)面跳轉(zhuǎn)到相應(yīng)的jsp，通過(guò)el表達(dá)式顯示出來(lái)。在報(bào)名信息管理功能中，頁(yè)面通過(guò)列表列出當(dāng)前用戶所有的報(bào)名信息，包括等級(jí)、科目、姓名、性別、身份證號(hào)等信息。點(diǎn)擊列表的刪除按鈕，實(shí)現(xiàn)報(bào)名信息的刪除操作。程序效果圖如圖3.3所示：

圖3.3 報(bào)名信息管理頁(yè)面

3.5瀏覽考生須知

用戶可以在首頁(yè)瀏覽考生須知，點(diǎn)擊“考生須知”菜單，系統(tǒng)跳轉(zhuǎn)到考生須知詳細(xì)信息的頁(yè)面，在這里系統(tǒng)將考生報(bào)名考試需要注意的事項(xiàng)列舉出來(lái)，以便避免不必要的麻煩,讓考生能夠順利的參加考試。程序效果圖如下圖3.4所示。

圖3.4考生須知頁(yè)面

3.6在線報(bào)名功能

用戶點(diǎn)擊添加在線報(bào)名菜單，系統(tǒng)跳轉(zhuǎn)到填寫(xiě)報(bào)名信息的頁(yè)面。在此頁(yè)面主要是添加報(bào)名考試的相關(guān)信息，包括填寫(xiě)或選擇考試等級(jí)、考試科目、姓名、性別以及身份證號(hào)等，點(diǎn)擊確定按鈕完成報(bào)名，在這里是通過(guò)下拉框的形式將考試等級(jí)和考試科目呈現(xiàn)出來(lái)。如果是沒(méi)有輸入完整的報(bào)名信息，比如沒(méi)有輸入身份證號(hào)，系統(tǒng)都會(huì)給出相應(yīng)的錯(cuò)誤提示，不能錄入成功。是否為空是通過(guò)form表單中的οnsubmit=return checkForm()來(lái)檢查。程序效果圖如圖3.5所示：

圖3.5在線報(bào)名頁(yè)面

用戶可以對(duì)自己的報(bào)名信息進(jìn)行管理，用戶點(diǎn)擊“我的報(bào)名”菜單，頁(yè)面跳轉(zhuǎn)到報(bào)名信息管理界面，系統(tǒng)將調(diào)用后臺(tái)的報(bào)名信息Action類(lèi)查詢出所有的報(bào)名信息，并把這些信息封轉(zhuǎn)到數(shù)據(jù)集合List中，綁定到request對(duì)象，然后頁(yè)面跳轉(zhuǎn)到相應(yīng)的jsp，顯示出報(bào)名信息。包括考試等級(jí)、考試科目、姓名、性別以及身份證號(hào)等信息。點(diǎn)擊刪除按鈕，可以將對(duì)應(yīng)的報(bào)名信息刪除。程序效果圖如下圖3.6所示。

圖3.6我的報(bào)名信息管理頁(yè)面

照片上傳

圖3.7文件上傳

3.7用戶留言咨詢

該功能模塊實(shí)現(xiàn)用戶對(duì)系統(tǒng)進(jìn)行留言的操作。用戶點(diǎn)擊菜單欄的“ 留言板塊”菜單，頁(yè)面跳轉(zhuǎn)到留言界面，系統(tǒng)將調(diào)用后臺(tái)的留言Action類(lèi)查詢出所有的留言信息，并把這些信息封轉(zhuǎn)到數(shù)據(jù)集合List中，綁定到request對(duì)象，然后頁(yè)面跳轉(zhuǎn)到相應(yīng)的jsp，顯示出留言信息。點(diǎn)擊我要留言咨詢鏈接，可以輸入留言內(nèi)容進(jìn)行留言。程序效果圖如下圖3.8所示。

圖3.8留言板塊頁(yè)面

學(xué)生留言界面：

圖3.9留言板塊頁(yè)面