WeX5開發(fā)框架下班級(jí)量化考評(píng)App的設(shè)計(jì)與實(shí)現(xiàn)

張遠(yuǎn)平

摘? 要： WeX5是目前流行的App開發(fā)平臺(tái)，支持快速開發(fā)各類輕量級(jí)的App應(yīng)用。通過App進(jìn)行班級(jí)量化考評(píng)管理，能充分發(fā)揮移動(dòng)互聯(lián)網(wǎng)和智能手機(jī)的優(yōu)勢(shì)，快捷便利地為班級(jí)管理提供服務(wù)。從提升教育管理效率的需求出發(fā)，使用WeX5開發(fā)工具開發(fā)一款滿足班級(jí)量化考評(píng)需求的App應(yīng)用軟件，實(shí)現(xiàn)統(tǒng)一登錄、掃碼錄入、數(shù)據(jù)查詢、信息推送和數(shù)據(jù)匯總等功能。實(shí)踐證明，該App能大大提高學(xué)校教育管理的效率。

關(guān)鍵詞： WeX5; 班級(jí)量化考評(píng); App; 設(shè)計(jì)與實(shí)現(xiàn)

中圖分類號(hào)：TP319? ? ? ? ? 文獻(xiàn)標(biāo)識(shí)碼：A? ? ?文章編號(hào)：1006-8228（2020）11-66-04

Abstract： WeX5 is a current popular App development platform that supports the rapid development of various lightweight App applications. The quantitative evaluation management of class by using an App can give full play to the advantages of mobile Internet and smart phone， and provide services for class management quickly and conveniently. Starting from the need for improving the efficiency of education management， WeX5 development tool is used to develop the App software that meets the quantitative evaluation needs of class， and the functions of unified login， scan code entry， data query， information push， and data summary are realized. Practice has proved that the App can greatly improve the efficiency of education management in the school.

Key words： WeX5; class quantitative evaluation; App; design and implementation

0 引言

班級(jí)量化考評(píng)是指在制定完善的評(píng)比規(guī)則的情況下，通過采集班集體或?qū)W生個(gè)人的評(píng)價(jià)數(shù)據(jù)，在班級(jí)管理過程中實(shí)施量化考核的過程。為了提高班級(jí)的管理水平，學(xué)校需要進(jìn)一步豐富和完善考評(píng)手段，使考評(píng)管理實(shí)現(xiàn)制度化、科學(xué)化和信息化?，F(xiàn)階段，有一些學(xué)校在班級(jí)考評(píng)管理方面還存在一定的問題。①管理思想固化，因循守舊，缺乏創(chuàng)新思維，師生信息化素養(yǎng)有待提高。②操作方式落后。班級(jí)評(píng)比登記以手工登記為主，再錄入相應(yīng)的系統(tǒng)供用戶瀏覽、查詢，造成信息發(fā)布不及時(shí)，獲取信息渠道不暢等，有時(shí)還會(huì)因此而延誤教學(xué)進(jìn)度或最佳時(shí)機(jī)。

“互聯(lián)網(wǎng)+教育”理念對(duì)教育信息化產(chǎn)生了持續(xù)推動(dòng)作用，智能手機(jī)在校園逐步普及，教育類App的應(yīng)用已經(jīng)滲透到教育教學(xué)管理的各個(gè)環(huán)節(jié)。對(duì)學(xué)校而言，如何利用手機(jī)為教育教學(xué)服務(wù)，是當(dāng)前的一個(gè)熱點(diǎn)議題[1]。班級(jí)量化考評(píng)App正是發(fā)揮移動(dòng)互聯(lián)網(wǎng)的優(yōu)勢(shì)，提高教育管理效果的一個(gè)有效途徑。

1 需求分析

1.1 功能性需求

班級(jí)量化考評(píng)App要求實(shí)現(xiàn)單點(diǎn)登錄、統(tǒng)一認(rèn)證，并給各管理部門分配權(quán)限，實(shí)現(xiàn)學(xué)生考勤、課堂紀(jì)律、衛(wèi)生檢查、集會(huì)檢查、儀容儀表檢查、宿舍評(píng)分、處分管理等功能。該App能對(duì)考評(píng)情況進(jìn)行分類展現(xiàn)和查詢，并對(duì)數(shù)據(jù)進(jìn)行匯總，通過生成階段性得分、學(xué)期總分等報(bào)表信息，為教育管理決策提供服務(wù)。同時(shí)，通過對(duì)數(shù)據(jù)的采集、分析和提取，生成學(xué)生的德育電子檔案，為教育大數(shù)據(jù)的應(yīng)用提供支撐。

應(yīng)用操作上，力求快捷、簡(jiǎn)便，輸入方式包括手工輸入和二維碼掃描輸入，信息輸入后能第一時(shí)間推送到手機(jī)端，體現(xiàn)智能手機(jī)信息處理的高效性。

1.2 非功能性需求

選用目前App開發(fā)的主流工具，縮短開發(fā)周期，使維護(hù)成本可控。要求App部署在云服務(wù)器，運(yùn)行穩(wěn)定可靠，提供掃碼下載安裝。界面操作美觀實(shí)用，符合日常操作習(xí)慣。

根據(jù)需求分析報(bào)告，整理得到系統(tǒng)功能結(jié)構(gòu)圖如圖1所示。

2 相關(guān)開發(fā)平臺(tái)

2.1 WeX5開發(fā)平臺(tái)

WeX5是北京起步科技（justep）公司推出的基于H5的開源、免費(fèi)的App快速開發(fā)平臺(tái)。它支持安卓App、蘋果App、微信公眾號(hào)、webApp及其他各種輕應(yīng)用的開發(fā)[2]。WeX5提供了豐富的組件，采用可視化的設(shè)計(jì)模式和開放式的開發(fā)架構(gòu)，前端支持HTML5+CSS+JS，后端支持asp、php、.net等，能輕松對(duì)接即時(shí)通訊、推送、支付等插件。

2.2 極光推送（JPush）平臺(tái)

極光推送（JPush）是獨(dú)立的第三方云推送平臺(tái)，能為移動(dòng)應(yīng)用開發(fā)者提供移動(dòng)消息推送服務(wù)。開發(fā)者只需在客戶端集成極光推送 SDK，即可輕松地把 Push功能添加到App中[4]。WeX5開發(fā)環(huán)境集成了極光推送插件，使開發(fā)者能快速開發(fā)出具備推送功能的App應(yīng)用。

3 課堂考勤與紀(jì)律登記功能模塊的設(shè)計(jì)與實(shí)現(xiàn)

3.1 數(shù)據(jù)庫(kù)相關(guān)表設(shè)計(jì)

在本例中，采用WeX5文件包下的mysql作為后臺(tái)數(shù)據(jù)庫(kù)，運(yùn)行heidiMysql數(shù)據(jù)庫(kù)管理工具，創(chuàng)建班級(jí)量化考評(píng)數(shù)據(jù)庫(kù)classManage。本模塊涉及的數(shù)據(jù)庫(kù)表包括班級(jí)信息表（class）、學(xué)生信息表（student）、考勤信息表（checkon）、考勤項(xiàng)目表（checkonitem）、課堂紀(jì)律登記表（classviolation）、課堂紀(jì)律登記項(xiàng)目表（classviolationitem）、課堂時(shí)間表（classtimetable）、用戶表（user）等，以考勤信息表的設(shè)計(jì)為例，如表1所示。

3.2 部分功能的實(shí)現(xiàn)

3.2.1 登錄頁面的實(shí)現(xiàn)

系統(tǒng)登錄的功能是對(duì)用戶的登錄信息進(jìn)行驗(yàn)證，如用戶登錄成功，則在手機(jī)中保存登錄信息，使該App能實(shí)現(xiàn)用戶的自動(dòng)登錄。登錄驗(yàn)證功能使用了數(shù)據(jù)組件的setFilter方法，對(duì)用戶輸入的賬號(hào)信息進(jìn)行匹配，如果登錄信息能夠匹配賬戶表，則進(jìn)入目標(biāo)頁面，同時(shí)調(diào)用sessionStorage的setItem方法記錄用戶的信息，以實(shí)現(xiàn)自動(dòng)登錄的功能。其主要代碼如下：

var uData=this.comp（"userData"）;

var userid=this.comp（"idInput"）.val（）;

var userpwd=this.comp（"passwordInput"）.val（）;

uData.setFilter（"f1"，"userID='"+userid+"'

and password='"+userpwd+"'"）;

uData.refreshData（）;

if（uData.count（）>0） {

var row=uData.getFirstRow（）;

var username=row.val（"userName"）;

var userbranch=row.val（"branch"）;

var userUUID={};

userUUID.userID=userid;

userUUID.userName=username;

userUUID.userBranch=userbranch;

localStorage.setItem（"userUUID"，JSON.stringify（userUUID））;

this.getParent（）.comp（"contents1"）.getContent

（"myContent"）.active（）; }

3.2.2 考勤與紀(jì)律數(shù)據(jù)登記頁面的實(shí)現(xiàn)

⑴ 手工輸入方式

在文本框中輸入學(xué)生的學(xué)號(hào)，獲取學(xué)生的信息，并顯示學(xué)生的照片進(jìn)行對(duì)比，同時(shí)根據(jù)當(dāng)前時(shí)間智能化地生成選項(xiàng)，用戶選擇違紀(jì)項(xiàng)目進(jìn)行登記，把采集到的違紀(jì)信息保存到數(shù)據(jù)庫(kù)中。以考勤登記的實(shí)現(xiàn)為例，其部分代碼如下：

var checkonD=this.comp（“checkonData”）;

checkonD.newData（{

“defaultValues” ： [ {

“ID”：justep.UUID.createUUID（），

“stuNo”：this.comp（“stuNoinput”）.val（），

“stuName”：$（this.getElementByXid

（“stuNameoutput”））.html（），

“stuClass”： $（this.getElementByXid

（“stuClassoutput”））.html（），

“checkonItem”：$（this.getElementByXid

（“selectItem”））.find（“option：selected”）.text（），

“checkonScore”：this.comp（“selectItem”）.val（），

“checkonWeek”：this.comp（“selectweek”）.val（），

“checkonWeekDay”：this.comp（“selectweekday”）.val（），

“checkonSection”：this.comp（“selectsection”）.val（），

“checkonMemo”：this.comp（“memotextarea”）.val（），

“recorduser”：userLocal.userName

} ]

}）;

checkonD.saveData（）;

⑵ 掃描二維碼輸入方式

跟手工輸入方式的區(qū)別在于通過掃描學(xué)生名單或?？ㄉ系亩S碼采集信息，輸入效率相對(duì)較高。實(shí)現(xiàn)二維碼掃描主要是通過調(diào)用cordova插件實(shí)現(xiàn)的，其主要代碼如下：

require（"$UI/system/lib/cordova/cordova"）;

require（"cordova！com.justep.cordova.plugin

.barcodescanner"）; //引用二維碼插件

Model.prototype.scanBtnClick=function（event） {

var me=this;

function onSuccess（result） {

me.comp（"stuNoinput"）.val（result.text）;

}

function onError（error） {

justep.Util.hint（"掃描失??！"）;

}

justep.barcodeScanner.scan（onSuccess， onError）;

};

3.2.3 消息推送功能的實(shí)現(xiàn)

⑴ 在需要實(shí)現(xiàn)極光推送功能的w頁面中，添加對(duì)極光插件的引用，并調(diào)用jpush.js文件建立實(shí)例。引用極光推送插件的代碼如下：