陸婷婷
摘要:為解決傳統(tǒng)的畢業(yè)選題工作存在效率不高、工作煩瑣等問(wèn)題,開(kāi)發(fā)完成了一套移動(dòng)選題平臺(tái)。移動(dòng)選題平臺(tái)包含后端管理子系統(tǒng)、后端數(shù)據(jù)接口、前端H5應(yīng)用三部分,采用當(dāng)前流行的軟件開(kāi)發(fā)技術(shù)實(shí)現(xiàn),使用vue漸進(jìn)式框架和前后端分離等技術(shù)進(jìn)行開(kāi)發(fā),同實(shí)際的高校畢業(yè)論文選題工作成功對(duì)接,功能較為完備,性能較穩(wěn)定。移動(dòng)選題平臺(tái)已經(jīng)正式投入使用,能夠在較短的時(shí)間內(nèi)完成畢業(yè)選題任務(wù),使畢業(yè)選題工作周期大大縮短,效率明顯提升。
關(guān)鍵詞:vue;路由;移動(dòng)開(kāi)發(fā);選題平臺(tái);接口設(shè)計(jì)
中圖分類(lèi)號(hào):TP315? ? ? 文獻(xiàn)標(biāo)識(shí)碼:A
文章編號(hào):1009-3044(2021)26-0069-03
開(kāi)放科學(xué)(資源服務(wù))標(biāo)識(shí)碼(OSID):
傳統(tǒng)的畢業(yè)選題工作主要圍繞在線下進(jìn)行,一般至少需要1個(gè)星期才能完成這項(xiàng)工作,效果不是很理想。隨著移動(dòng)互聯(lián)網(wǎng)技術(shù)的不斷發(fā)展,迫切地需要一種移動(dòng)選題平臺(tái)來(lái)輔助完成畢業(yè)選題工作。當(dāng)前已經(jīng)涌現(xiàn)了很多的畢業(yè)論文選題平臺(tái),通過(guò)閱讀大量的文獻(xiàn)資料發(fā)現(xiàn),有些平臺(tái)基于PC電腦端開(kāi)發(fā),有些平臺(tái)使用的是一些老舊技術(shù),在性能、功能、用戶體驗(yàn)等方面都有所欠缺[1-4]。本文使用vue漸進(jìn)式框架和前后端分離等技術(shù)[5],實(shí)現(xiàn)的移動(dòng)選題平臺(tái)經(jīng)嚴(yán)格測(cè)試,在各方面使用效果較為理想。
1 系統(tǒng)架構(gòu)設(shè)計(jì)與模塊分析
1.1 系統(tǒng)架構(gòu)設(shè)計(jì)
整個(gè)系統(tǒng)使用前端和后端分離的技術(shù),前端和后端各自負(fù)責(zé)自己的業(yè)務(wù)。前端使用axios.js作為異步調(diào)用工具,訪問(wèn)API接口獲得數(shù)據(jù)。前端從后端獲取的數(shù)據(jù)需要進(jìn)行加工處理,所以在系統(tǒng)架構(gòu)設(shè)計(jì)中增加了node.js作為橋梁,所有從API接口獲取的數(shù)據(jù)都需要通過(guò)node.js進(jìn)行加工,加工后的數(shù)據(jù)可直接在前端使用,這樣可以做到層次分明,提高開(kāi)發(fā)效率。如圖1所示。
其中,前端部分由顯示層、互動(dòng)層和異步數(shù)據(jù)處理層組成。互動(dòng)層使用基于vue和vue擴(kuò)展的相關(guān)開(kāi)發(fā)技術(shù)實(shí)現(xiàn),顯示層使用sui作為前端UI框架,配合html5、css3和JQuery共同實(shí)現(xiàn),異步處理層使用axios.js異步獲取數(shù)據(jù)。
后端由兩大部分組成,一部分是管理員用戶使用的后臺(tái)管理系統(tǒng),另一部分是給前端用戶使用的API接口,API接口的風(fēng)格遵循RestFul API的風(fēng)格實(shí)現(xiàn)。
1.2 業(yè)務(wù)模塊分析
移動(dòng)選題平臺(tái)涉及學(xué)生、指導(dǎo)教師和管理員等角色,結(jié)合工作單位多年來(lái)的學(xué)生選題工作管理流程經(jīng)驗(yàn),歸納出移動(dòng)選題平臺(tái)所需要的功能模塊。
主要模塊的功能如下:
1)系統(tǒng)初始化模塊
管理員負(fù)責(zé)對(duì)平臺(tái)數(shù)據(jù)進(jìn)行初始化,平臺(tái)運(yùn)行之前必須對(duì)數(shù)據(jù)進(jìn)行初始化,以方便下一批學(xué)生進(jìn)行選題。
2)數(shù)據(jù)導(dǎo)入導(dǎo)出模塊
導(dǎo)入的數(shù)據(jù)主要包含指導(dǎo)論題題目信息、 學(xué)生基本信息數(shù)據(jù)(學(xué)號(hào)、姓名、班級(jí)、所屬系部等)、教師的基本數(shù)據(jù)(姓名、工號(hào)、所屬系部等)、班級(jí)和系部基本數(shù)據(jù)等。選題平臺(tái)結(jié)束運(yùn)行后,需要對(duì)選題平臺(tái)中的選題進(jìn)行導(dǎo)出操作,導(dǎo)出的信息可以按照學(xué)生的專(zhuān)業(yè)、所在的班級(jí)以及系部等分類(lèi)進(jìn)行輸出,輸出的形式使用xls等格式。
3)基本數(shù)據(jù)維護(hù)管理模塊
數(shù)據(jù)導(dǎo)入后,可以對(duì)上述2)所描述的基本數(shù)據(jù)進(jìn)行維護(hù)管理,此模塊主要實(shí)現(xiàn)對(duì)基本數(shù)據(jù)的增加、修改、刪除以及列表等操作。
4)選題管理模塊
指導(dǎo)教師負(fù)責(zé)對(duì)畢業(yè)論文題目進(jìn)行提交,可以根據(jù)自己所設(shè)題目的需要,修改、刪除或者新增畢業(yè)題目,查看本組論文的選題情況等。
5)日志管理模塊
日志管理模塊負(fù)責(zé)系統(tǒng)日志,平臺(tái)中的各個(gè)用戶行為都會(huì)記錄在日志數(shù)據(jù)庫(kù)中。通過(guò)對(duì)平臺(tái)的日志情況進(jìn)行詳細(xì)分析,可以得出學(xué)生對(duì)哪些選題興趣,可以分析出學(xué)生感興趣的指導(dǎo)老師,并且可以增加安全性等。
6)權(quán)限管理
權(quán)限管理模塊是平臺(tái)中必要的組成部分。平臺(tái)的使用者主要包含學(xué)生、指導(dǎo)教師、管理員等角色,不同角色的功能需要通過(guò)權(quán)限管理模塊進(jìn)行區(qū)分。
2 數(shù)據(jù)庫(kù)設(shè)計(jì)
移動(dòng)選題平臺(tái)包含學(xué)生信息表、指導(dǎo)教師表、論文題目表、選題信息表、系部信息表、日志信息表、角色表、權(quán)限表、指導(dǎo)數(shù)量表等數(shù)據(jù)表。平臺(tái)處理的基本信息主要存儲(chǔ)在學(xué)生信息表、指導(dǎo)教師表、系部信息表等數(shù)據(jù)表中;選題相關(guān)的數(shù)據(jù)表包含選題信息表、論文題目表、指導(dǎo)數(shù)量表等;角色表和權(quán)限表存儲(chǔ)權(quán)限管理相關(guān)信息。
下面簡(jiǎn)要介紹選題信息表和指導(dǎo)數(shù)量表的表結(jié)構(gòu)。選題信息表結(jié)構(gòu)如表1所示。
從表中看出,id為選題編號(hào),設(shè)置為自動(dòng)增長(zhǎng)。Xh字段為學(xué)號(hào)字段,通過(guò)該字段可以在學(xué)生信息表中查詢學(xué)生的信息;tid字段為指導(dǎo)教師的編號(hào),通過(guò)該字段能查詢指導(dǎo)教師的相關(guān)信息;tmid為學(xué)生選擇題的題目id,通過(guò)該字段能查詢論文題目的相關(guān)信息。
指導(dǎo)數(shù)量表的表結(jié)構(gòu)如表2所示。
每個(gè)指導(dǎo)教師指導(dǎo)的學(xué)生數(shù)量有限,使用count字段記錄上限,icount是已經(jīng)選擇的數(shù)量,如果count大于icount,說(shuō)明該教師已經(jīng)被學(xué)生選完了,后面的學(xué)生無(wú)法再選擇該教師。
3 模塊設(shè)計(jì)實(shí)現(xiàn)
3.1 前端項(xiàng)目結(jié)構(gòu)設(shè)計(jì)
前端項(xiàng)目的開(kāi)發(fā)使用VUE-CLI腳手架工具進(jìn)行開(kāi)發(fā),使用前端相關(guān)技術(shù)實(shí)現(xiàn)。
在powershell控制臺(tái)下,輸入vue create bysj命令創(chuàng)建本項(xiàng)目(bysj為項(xiàng)目名),技術(shù)模塊選擇安裝babel、router、vuex、linter/formater等,項(xiàng)目需要的其他第三方工具,比如axios.js、mockjs、elementui等,需要在項(xiàng)目中使用npm install命令進(jìn)行安裝。
項(xiàng)目創(chuàng)建好后,需要對(duì)項(xiàng)目的目錄結(jié)構(gòu)進(jìn)行重構(gòu),以利于項(xiàng)目的快速開(kāi)發(fā)。在一級(jí)目錄中增加api目錄、directive目錄、mock目錄以及l(fā)ib目錄。異步訪問(wèn)數(shù)據(jù)的js源文件都統(tǒng)一放在api目錄中,directive目錄用于存放一些使用vue創(chuàng)建的指令,使用mockjs所創(chuàng)建的mock數(shù)據(jù)存放在mock目錄,前端開(kāi)發(fā)所需要的其他第三方源文件工具存放在lib目錄。