基于SpringBoot+Vue技術的學科競賽管理系統(tǒng)的設計與實現(xiàn)

楊友法　郭城　汪浩源　許孝整　黃銀河　彭凱　章力成　林學志

關鍵詞：SpringBoot；Vue；學科競賽系統(tǒng)

中圖分類號：TP311 文獻標識碼：A

文章編號：1009-3044（2023）10-0054-05

0 引言

學科競賽不僅是提高大學生綜合能力和專業(yè)技術的重要手段和方式，同時更能彌補傳統(tǒng)日常教學中的許多缺點和不足。比如在日常的教學中通過教師長時間的課堂授課，容易影響大學生對學科知識的探索欲望。但通過競賽這種新穎的第二課堂方式更能吸引學生的學習興趣。近幾年來，隨著各高校開始推動學科競賽的發(fā)展，學生報名人數(shù)越來越多，像這樣線下的方式使得組織和管理變得尤為繁重，這就間接要求組織者在組織管理方面能夠有一套解決這些不足的管理方案，所以，研發(fā)一個學科競賽管理系統(tǒng)就變得尤為重要。本文提出了以MySQL為數(shù)據(jù)存儲，Vue 和SpringBoot 為技術支撐設計并實現(xiàn)具有一體化、信息化的學科競賽管理系統(tǒng)，管理者只需要通過線上對學科競賽進行宣傳，對學生的報名進行審核，對比賽結果進行通告，對競賽資金報銷進行核查，就可以很好地彌補傳統(tǒng)競賽方式中的缺點和不足，減輕工作人員的工作量，提高競賽數(shù)據(jù)的準確性，推動國家人才教育機制的進一步改革，更能提高學生報名的積極性。讓學科競賽變得更加規(guī)范、更加信息化。

1 系統(tǒng)總體設計

參照學科競賽管理系統(tǒng)軟件的研發(fā)目標、項目可行性以及學科競賽的具體運行流程，從中能夠分析出學科競賽管理系統(tǒng)的需求很是多樣化。根據(jù)需求文檔，競賽管理系統(tǒng)軟件總體可分為以下幾大模塊，五個主要的競賽系統(tǒng)模塊功能圖如圖1所示。

1.1 管理員及學生用戶模塊

自定義模塊能否設計得合理、科學，從某種角度來看會阻礙整個管理系統(tǒng)的免費推廣和更好的用戶體驗。超級管理員有權對注冊后正在系統(tǒng)中的學生的相關信息進行管理，這里的相關信息涵蓋了學生個人的基礎信息，學生的比賽信息以及學生所涵蓋的指導老師基礎信息等。完善的數(shù)據(jù)管理能夠為數(shù)據(jù)的統(tǒng)計分析結果給予更有力的內容支撐[1]。

高校學生在瀏覽器搜索該系統(tǒng)注冊后，能夠使用該學生在學校的賬號密碼登錄該系統(tǒng)。管理人員如忘記密碼，可參考管理系統(tǒng)登錄界面忘記密碼提示找回密碼。學校學生注冊后所有信息都將安全地保存在系統(tǒng)的數(shù)據(jù)庫里。超級管理員開通管理系統(tǒng)后，學校學生可在線預報名學科競賽。如不在指定時間范圍內，可自行修改本校學生的基礎信息和競賽報名相關信息。學校的學生是管理系統(tǒng)選擇的基本元素，自定義模塊有更好的用戶體驗將決定管理系統(tǒng)的系統(tǒng)穩(wěn)定性和免費推廣的容易程度。

1.2 用戶信息模塊

用戶模塊分別涵蓋了對學校和專業(yè)的相關數(shù)據(jù)管理。對學校的數(shù)據(jù)管理，其主要功能是對學校的相關信息進行管理。對后來管理系統(tǒng)中可能會有多所高校信息以及在它們之間的競賽選拔情況，該系統(tǒng)都提供了較為強大了功能支持。對各高校的數(shù)據(jù)庫數(shù)據(jù)進行分類管理和詳細分析，從而分析得出精確的競賽數(shù)據(jù)。對于專業(yè)的數(shù)據(jù)管理，主要內容是專業(yè)方面的信息管理。每個專業(yè)都有自己獨有的特色，每個專業(yè)的具體情況也不完全相同。系統(tǒng)中對專業(yè)信息管理定制模塊進行了針對性的設計和制作，能更好地讓用戶方便快捷地選出自己心儀的專業(yè)。

1.3 比賽處理模塊

該模塊涵蓋了競賽工程項目管理、學校學生報名后的考試信息管理和競賽官網(wǎng)公告信息管理、競賽工程項目管理。在學科競賽的用戶管理中，應當需要設置競賽和管理考生的工程，競賽工程項目管理還涵蓋對公共信息的管理。學科競賽借助這些相關信息的分級分類管理，有利于競賽數(shù)據(jù)的分析和統(tǒng)計，更有利于學校學生在不同競賽項目之間進行比較和分析。

學生學籍信息管理模塊中能滿足競賽信息化管理的要求。如果本校學生在學科競賽報名過程中仍存在遺漏，系統(tǒng)管理員可修改本校學生報名考試相關信息，在原有基礎上進行完善、刪除等操作方式。在賽事公告欄目中，可以快捷地對公告信息進增、刪、改、查的操作，實現(xiàn)信息管理的高效化[2]。

1.4 賽事得分模塊

此模塊涵蓋了對競賽成績的管理和對數(shù)據(jù)的精確分析。在對成績數(shù)據(jù)的管理中包括增加、修改、刪除、查詢考生參賽后的成績等操作。

2 項目設計目標及原則

2.1 關于大學生競賽管理系統(tǒng)的基本要求

1）功能要求：分為系統(tǒng)首頁、個人中心、學生、競賽級別、指導老師、賽事預告、競賽信息管理等。

2）性能要求：能夠跨系統(tǒng)登錄和操作管理系統(tǒng)，能夠保證無差別、更方便的操作。

3）安全方面：用戶必要通過注冊然后登錄系統(tǒng)，并且不同的用戶給予不同的權限限定。

2.2 開發(fā)目標

1）實現(xiàn)管理系統(tǒng)的規(guī)范化和自動化

2）減少管理人員對系統(tǒng)的維護和管理

3）方便用戶對比賽進行查詢和修改操作

4）操作界面便捷高效，滿足用戶多樣化的需求

3 系統(tǒng)數(shù)據(jù)庫設計

3.1 體系研發(fā)應用環(huán)境

1）以JavaWeb技術為支撐的學科管理系統(tǒng)

2）采用B/S模式的架構模式

3）數(shù)據(jù)庫技術采用MySQL存儲技術

3.2 MySQL 數(shù)據(jù)庫介紹

MySQL是一款關系型數(shù)據(jù)庫，它有著自己獨特的優(yōu)勢，這些優(yōu)勢使它成為目前最流行的關系型數(shù)據(jù)庫之一。MySQL與其他關系型數(shù)據(jù)庫相比有著體積小，速度快的特點，其次是它符合本次該系統(tǒng)開發(fā)的最好選擇，成本低、開源這些特點，也是選擇它的主要原因。

3.3 系統(tǒng)功能模塊設計

1）管理員和學生模塊

該軟件涵蓋了系統(tǒng)管理員和高校學生用戶模塊兩部分，第一部分是系統(tǒng)管理員部分，第二部分是高校學生用戶部分。

系統(tǒng)管理員，首先確認在登錄界面，系統(tǒng)管理員能夠借助輸入賬號和密碼登錄管理系統(tǒng)后臺。如果忘記了賬號和密碼，能夠選用管理員權限忘記密碼功能，幫助找回密碼。其中一種形式是在系統(tǒng)菜單中，密碼找回功能非常強大。輸入賬號、出生日期、身份證號碼等相關信息找回密碼。系統(tǒng)管理員登錄管理系統(tǒng)成功后，系統(tǒng)管理員能夠在管理系統(tǒng)菜單中能夠一目了然地看到系統(tǒng)管理員所擁有的權限和功能，系統(tǒng)管理員是整個管理系統(tǒng)功能權限最齊全的管理員，而對于不同的管理員則掌握著整個系統(tǒng)模塊不同的權限。三級系統(tǒng)管理員管理權限最低，管理系統(tǒng)的權限最少。但有權管理來自其他系統(tǒng)管理員的信息，其中包含如何改進、修改和刪除與系統(tǒng)管理員有所關聯(lián)的信息。從某個角度說，他們的權限高于其他的任何功能，在整個管理系統(tǒng)后臺，由不同的管理員擁有的不同權限一起維護整個系統(tǒng)后臺和系統(tǒng)的可用性、可擴展性。

在校學生用戶在登錄界面可以進行注冊、登錄、找回密碼等操作。在校學生在管理系統(tǒng)的登錄界面進行注冊。注冊過程中，學生一定要填寫學生賬號、出生日期、身份證號、學生籍貫、學校位置等相關信息，以及與學生申請有所關聯(lián)的信息。

以學生賬號和密碼的方式登錄競賽管理系統(tǒng)。在登錄成功后，學生可以根據(jù)自己意愿修改個人的信息。學生可以自主選擇適合自己的競賽項目，在一定的時間內，學生也能夠修改學科競賽項目或取消。如果學生在登錄找回系統(tǒng)時忘記了賬號和密碼，能夠直接輸入自己的賬號、出生日期、身份證號等相關信息，借助系統(tǒng)在線找回密碼。最后一個是學校信息管理，在學校計算機信息管理系統(tǒng)的通用菜單中，系統(tǒng)管理員添加學校相關信息，也可修改和刪除學校信息[3]。

在專業(yè)信息管理中，管理員可以根據(jù)學生的專業(yè)增加相關的專業(yè)信息，學生可以使用查詢操作，使得專業(yè)信息展示在當前頁面中。在頁面中展示的每一條記錄，管理員都可以進行增刪改查等操作。在之前管理員設置好的專業(yè)信息后使得學生在報名時只能根據(jù)自己專業(yè)來選擇跟本專業(yè)相關聯(lián)的不同的競賽項目。

2）項目競賽管理模塊

該模塊涵蓋了學生競賽項目信息、各高校學生參賽項目信息和公告信息管理三個部分。

在系統(tǒng)管理員系統(tǒng)運行的具體過程中，在管理學科賽事信息時，能夠完善學科賽事的詳細信息，所有學科賽事的對比能夠借助公告展示出來。競賽項目能夠被相應地修改或刪除。在競賽項目信息管理的管理中，系統(tǒng)管理員能夠隨時查看各個競賽項目的學校報名情況，也能夠在后臺中為學生報名學科比賽。在校生注冊系統(tǒng)后，系統(tǒng)管理員也能夠刪除與在校生注冊有所關聯(lián)的信息。在學科競賽管理系統(tǒng)軟件的登錄賬號首頁，充分予以了內容展示框，用于展示學科競賽活動的宣傳信息。系統(tǒng)管理員可以編輯學科競賽的公告信息，其中包括官網(wǎng)公告中應展示的學科競賽報名考試科目、學科競賽報名時間等相關信息，系統(tǒng)公告相關管理員在將編輯好的公告發(fā)布到官網(wǎng)后，學生可以在官網(wǎng)查看相關的比賽的具體內容來進行比較以選擇適合自己的競賽項目，學生也可以通過公告官網(wǎng)來查看競賽結果。

3）成績管理模塊

成績管理模塊涵蓋了競賽成績數(shù)據(jù)和對成績數(shù)據(jù)的分析結果展示兩個部分。學科競賽管理系統(tǒng)，將競賽學生的成績導入檢索系統(tǒng)，在成績管理系統(tǒng)模塊中，可查詢學生競賽成績，選擇不同的專業(yè)，能夠查看不同專業(yè)的競賽數(shù)據(jù)。

3.4 數(shù)據(jù)庫表的設計

數(shù)據(jù)庫表存儲了競賽管理系統(tǒng)軟件中的數(shù)據(jù)庫數(shù)據(jù)，這是對學科競賽數(shù)據(jù)進行數(shù)據(jù)庫數(shù)據(jù)進行了可視化分析，以下就是對管理系統(tǒng)軟件中存取數(shù)據(jù)庫表的設計與制作[4]。

一般情況下，往往根據(jù)E-R圖的基礎知識，將具體的概念分析模型導出到三維圖，然后對三維圖進行標準化，得到數(shù)據(jù)庫表。

1）學校學生相關信息表如圖2所示，命名為“stu?dent”。一方面，該表用來存儲學生學號、姓名、出生年月日、所在學校、考試科目、年級等信息。在表結構中，id的值是參照結合xkjs_stud表中stu_id的值，name 的值是xkjs_stu表中stu_name的值，project的值來自字段project_name 的值表名kj_project，年值來自xkjs_year表的years字段值，月值來自xkjs_month數(shù)據(jù)表中的month字段的值。

2）公告信息表具體情況表的基本結構如圖3所示，并更名為“gonggao”?！癵onggao”的含義是指一方面存儲廣告主題、官網(wǎng)廣告具體內容等相關信息。

3）項目表的基本結構如圖4所示，命名“xkjs_proj?ect”。xkjs_project表存儲系統(tǒng)管理員名稱、不同年份、月中、學科考試科目分數(shù)等信息。

4）學校信息表具體表結構如圖5 所示，命名為“school”，school表主要存放學科競賽管理系統(tǒng)所屬的學校信息。

5）管理員信息表具體表結構如圖6所示，命名為“user”，user表主要存放管理員用戶名、密碼等信息。

4系統(tǒng)設計

4.1 關鍵技術

本系統(tǒng)可以使用多種瀏覽器自行注冊登錄，在開發(fā)時采用了idea2022，以JDK8作為開發(fā)工具包，數(shù)據(jù)庫采用的是市面上最流行的MySQL，服務器仍然使用的是tomcat，前端靜態(tài)資源采用Nginx進行部署，將前后端分離的優(yōu)勢進行了最大化，項目開發(fā)環(huán)境部署簡單且易行[5]。

該系統(tǒng)設計主要使用SpringBoot+Vue進行整合開發(fā)，后端主要利用了三層架構，包含業(yè)務邏輯層，實體層以及數(shù)據(jù)訪問層。前端Web層用于靜態(tài)資源的展現(xiàn)和支持，Spring負責實體bean的業(yè)務邏輯處理，My?Baits負責數(shù)據(jù)庫和數(shù)據(jù)訪問層的交接。通過Spring?Boot+Vue前后端分離的架構，可以完美地使前端和后端代碼分離開來，對開發(fā)人員的門檻降低了很多，前端是前端，后端是后端招聘模式，服務端和客戶端進行了分離，很好地解決了代碼的耦合度，方便以后對系統(tǒng)進行維護和優(yōu)化[6]。

4.2 部分模塊實現(xiàn)

競賽模塊包括競賽模塊、新聞模塊、通知模塊、教學模塊等四部分內容。競賽管理主要是系統(tǒng)的競賽模塊的相關的管理操作，比如新增賽事、修改賽事、刪除賽事等，便于以后發(fā)布賽事通知、新聞等內容。下面是核心設計代碼：

@Service

@Slf4j

public class CompetitionItemServiceImpl imple?ments CompetitionItemService {

@Autowired

@Qualifier（value =“CompetitionItemDao”

private CompetitionItemDao CompetitionItemDao;//添加比賽項

public void addCompetitionItem（ CompetitionIte?mEntity item）{

if （checkField（item））{

item. setStauts（ItemStateType. ITEM_STATUS. get?Code（）））

Integer result = CompetitionItemDao. addCompeti?tionItem（item）;

if（result > 0 ）{

log.info“（ 添加賽事成功”，item.toString（））

}else{

log.error“（ 添加賽事失敗，未知異常請仔細查看”）;

}}}

//修改比賽項

public void alterCompetitionItem（CompetitionIte?mEntity entity， String itemId）{

if （checkFields（entity））{

entity.setId（itemId）;

int result = CompetitionItemDao. alterCompetition?Item（entity）;

if（result > 0 ）{

log.info“（ 通過賽事id{}修改成功”，entity.to?String（））

}else{

log.error“（ 通過賽事id{}修改賽事失敗，未知異常請仔細查看”）;

}}}

//刪除賽事

public void removeCompetitionItem（String[] item?Lists） {

for （String itemId ： itemLists） {

CompetitionItemEntity entity = CompetitionItemEn?tity.getInstance（）;

CompetitionItemEntity item = entity. getItemBy?ItemId（itemId）;

if （！StringUtils.isEmpty（item）） {

int result = CompetitionItemDao.remove（item）;

if（result > 0 ）{

log.info“（ 通過賽事id{}刪除成功”，entity.to?String（））

}else{

log.error“（ 通過賽事id{}刪除新聞失敗，未知異常請仔細查看”）;

}

}

公告信息管理模塊是指系統(tǒng)的用戶可以自行查閱學科競賽的相關競賽資料，比如競賽的組織，管理方式和競賽的詳細信息，讓參賽選手得以準確、及時地掌握信息。掌握學科技能比賽的相關規(guī)定和要求。核心部分的代碼如下[7]

@Slf4j

public class CompetitionAdviseServiceImpl imple?ments CompetitionAdviseService {

@Autowired

@Qualifier（value =“competitionAdviseDao”）

CompetitionAdviseDao competitionAdviseDao;

//添加通知

@Override

public void addCompetitionAdvise （CompetitionAd?vise advise） {

advise. setAdviseState（AdviseStateType. AD?VISE_ORDER.getCode（））;

int result = competitionAdviseDao. addAdvise（ad?vise）;

if（result > 0 ）{

log.info“（ 通過通知id{}添加成功”，advise.to?String（））

}else{

log.error“（ 通過通知id{}添加失敗，未知異常請仔細查看”）;

}}

//刪除通知

@Override

public void removeCompetitionAdvise（String[] advi?seIds） {

for （String adviseId： adviseIds） {

CompetitionAdviseEntity item = this. getNotice?ByNoticeId（adviseId）;

if （！StringUtils.isEmpty（item）） {

int result = gameNoticeDao.removeAdvise（item）;

if（result > 0 ）{

log.info“（ 通過通知id{}刪除通知成功”，item.to?String（））

}else{

log.error“（ 通過通知id{}刪除通知失敗，未知異常請仔細查看”）;

}

}

}

// 修改通知

@Override

public void changeCompetitionAdvise （String Advi?seId） {

CompetitionAdviseEntity item = new MatchNo?ticeEntity（）;

item.setId（AdviseId）;

int result = matchNoticeDao.changeCompetitionAd?vise（item）;

if（result > 0 ）{

log.info“（ 通過通知id{}修改通知成功”，item.to?String（））

}else{

log.error“（ 通過通知id{}修改通知失敗，未知異常請仔細查看”）;

}

}

}

5 結束語

本文采用前端Vue+后端SpringBoot的架構設計選型模式，使用MySQL數(shù)據(jù)庫搭建賽事信息管理系統(tǒng)代理平臺，同時設計了用戶管理和賽事信息管理，解決了傳統(tǒng)學科競賽選拔模式中復雜和容易出錯的問題，實踐中獲得了學校的好評。但在后期的完善開發(fā)中，還要繼續(xù)深挖和擴展管理系統(tǒng)的功能和模塊，使系統(tǒng)給學生和教師使用起來體驗感更好，功能更豐富，為社會的信息化事業(yè)貢獻一份微不足道的力量[8]。