第5章 系統(tǒng)實(shí)現(xiàn)

一、技術(shù)路線：

開(kāi)發(fā)語(yǔ)言：Java

前端技術(shù)：JavaScript、VUE.js（2.X）、css3

數(shù)據(jù)庫(kù)：MySQL 5.7

數(shù)據(jù)庫(kù)管理工具：Navicat或sqlyog

開(kāi)發(fā)工具：IDEA或Ecplise

二、項(xiàng)目介紹：

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

三、運(yùn)行截圖：

3.1登錄模塊的實(shí)現(xiàn)

系統(tǒng)登錄模塊后臺(tái)登錄模塊，為確保系統(tǒng)安全性，系統(tǒng)操作員只有在登錄界面輸入正確的用戶名、密碼單擊“登錄”按鈕后才能夠進(jìn)入本系統(tǒng)的主界面。

管理員登錄流程圖如下所示。

管理員登錄流程圖

3.2管理員功能模塊

管理員通過(guò)輸入用戶名，密碼、角色信息進(jìn)行系統(tǒng)登錄，效果如下圖所示3-1所示

圖3-1管理員登錄界面

3.2.1學(xué)生管理

管理員對(duì)學(xué)生管理獲取學(xué)號(hào)、學(xué)生姓名、性別、院系班級(jí)、手機(jī)號(hào)碼、個(gè)人頭像等一些基本信息的詳情、刪除和修改。學(xué)生管理效果如下圖所示3-2所示

圖3-2 學(xué)生管理界面

3.2.2老師管理

管理員對(duì)老師管理獲取工號(hào)、老師姓名、性別、所屬院系、聯(lián)系手機(jī)、個(gè)人頭像等一些基本信息的詳情、刪除和修改。老師管理效果如下圖所示3-3所示

圖3-3 老師管理界面

3.2.3作業(yè)信息管理

管理員對(duì)作業(yè)信息管理獲取作業(yè)名稱、所屬科目、作業(yè)文件、發(fā)布日期、完成日期、工號(hào)、老師姓名等一些基本信息的詳情、刪除和修改。作業(yè)信息管理效果如下圖所示3-4所示

圖3-4 作業(yè)信息管理界面

3.2.4作業(yè)提交管理

管理員通過(guò)作業(yè)提交管理頁(yè)面查看作業(yè)名稱、所屬科目、學(xué)生作業(yè)、提交日期、學(xué)號(hào)、學(xué)生姓名、院系班級(jí)、工號(hào)、老師姓名等進(jìn)行詳情、刪除、修改等操作。作業(yè)提交管理效果如下圖所示3-5所示

圖3-5作業(yè)提交管理界面

3.2.5作業(yè)批改管理

管理員通過(guò)作業(yè)批改管理頁(yè)面查看作業(yè)名稱、所屬科目、學(xué)生作業(yè)、評(píng)分、批改日期、學(xué)號(hào)、學(xué)生姓名、院系班級(jí)、工號(hào)、老師姓名等信息進(jìn)行詳情或修改刪除，作業(yè)批改管理效果如下圖所示3-6所示

圖3-6作業(yè)批改管理界面

3.3學(xué)生功能模塊

3.3.1學(xué)生登錄

 學(xué)生通過(guò)輸入學(xué)號(hào)，密碼，角色等信息進(jìn)行系統(tǒng)登錄，如圖3-7所示。

圖3-7學(xué)生登錄界面圖

3.3.2作業(yè)信息管理

學(xué)生對(duì)作業(yè)信息管理查看作業(yè)名稱、所屬科目、作業(yè)文件、發(fā)布日期、完成日期、工號(hào)、老師姓名并進(jìn)行詳情、提交作業(yè)等操作。作業(yè)信息管理效果如下圖所示3-8所示

圖3-8作業(yè)信息管理界面圖

3.3.3個(gè)人信息

在個(gè)人信息頁(yè)面可以通過(guò)查看學(xué)號(hào)、學(xué)生姓名、性別、院系班級(jí)、手機(jī)號(hào)碼、個(gè)人頭像等內(nèi)容并進(jìn)行修改。個(gè)人信息效果如下圖所示3-9所示

。

圖3-9個(gè)人信息界面圖

3.3.4作業(yè)批改管理

在作業(yè)批改管理頁(yè)面可以通過(guò)查看作業(yè)名稱、所屬科目、學(xué)生作業(yè)、評(píng)分、批改日期、學(xué)號(hào)、學(xué)生姓名、院系班級(jí)、工號(hào)、老師姓名等內(nèi)容并進(jìn)行詳情。作業(yè)批改管理效果如下圖所示3-10所示

。

圖3-10作業(yè)批改管理界面圖

3.4老師功能模塊

3.3.1老師登錄

 老師通過(guò)輸入工號(hào)，密碼，角色等信息進(jìn)行系統(tǒng)登錄，如圖3-11所示。

圖3-11老師登錄界面圖

3.3.2個(gè)人信息

老師對(duì)個(gè)人信息查看工號(hào)、老師姓名、性別、所屬院系、聯(lián)系手機(jī)、個(gè)人頭像并進(jìn)行修改等操作。個(gè)人信息效果如下圖所示3-12所示

圖3-12個(gè)人信息界面圖

3.3.3作業(yè)信息管理

在作業(yè)信息管理頁(yè)面可以通過(guò)查看作業(yè)名稱、所屬科目、作業(yè)文件、發(fā)布日期、完成日期、工號(hào)、老師姓名等內(nèi)容并進(jìn)行詳情、修改、刪除。作業(yè)信息管理效果如下圖所示3-13所示

。

圖3-13作業(yè)信息管理界面圖

3.3.4作業(yè)提交管理

在作業(yè)提交管理頁(yè)面可以通過(guò)查看作業(yè)名稱、所屬科目、學(xué)生作業(yè)、提交日期、學(xué)號(hào)、學(xué)生姓名、院系班級(jí)、工號(hào)、老師姓名等內(nèi)容并進(jìn)行詳情、批改作業(yè)。作業(yè)提交管理效果如下圖所示3-14所示

。

圖3-14作業(yè)提交管理界面圖

3.3.5作業(yè)批改管理

在作業(yè)批改管理頁(yè)面可以通過(guò)查看作業(yè)名稱、所屬科目、學(xué)生作業(yè)、評(píng)分、批改日期、學(xué)號(hào)、學(xué)生姓名、院系班級(jí)、工號(hào)、老師姓名等內(nèi)容并進(jìn)行詳情。作業(yè)批改管理效果如下圖所示3-15所示

圖3-15作業(yè)批改管理界面圖