實驗室信息化管理微信小程序的設計

陳少龍，張 凡

(湖北理工學院 a.外國語學院,b.科研處，湖北 黃石 435003)

實驗教學是高校培養(yǎng)創(chuàng)新型人才的重要環(huán)節(jié)，如何打破傳統(tǒng)的實驗室管理方式，提高實驗室管理水平已成為亟需解決的問題[1-2]。以湖北理工學院外國語學院實驗室為例，截至2021年底，學院共有14間實驗室，共計1 200余件電腦設備，每間實驗室配備2個實驗本，即課堂簽到本和設備故障處理本，供課程簽到和報修故障設備。據(jù)統(tǒng)計，2018—2021年實驗室工作人員對每臺設備年均排查多達20余次，年均設備故障率僅為2.1%。實驗室的檢修次數(shù)多、工作量大、耗時長、工作效率低且紙質(zhì)材料不方便統(tǒng)計和長期保存[3]，因此迫切需要一款智能化工具來輔助工作人員完成實驗室管理工作[4-5]。

基于此，設計開發(fā)一款實驗室信息化管理助手微信小程序[6-7]，設備報修、課程簽到等均可在線上實時操作，方便快捷，為高校實驗室信息化建設提供了新方法和新思路。

1 關(guān)鍵技術(shù)概述

1.1 小程序框架

小程序前端框架主要分為視圖層和邏輯層，共有json，wxml，wxss和js 4類代碼文件。視圖層主要負責展示呈現(xiàn)，由wxml頁面結(jié)構(gòu)文件、wxss頁面樣式文件和json頁面配置文件組成。邏輯層又稱為AppService，負責小程序的行為動作，由js腳本文件構(gòu)成。邏輯層將數(shù)據(jù)處理后發(fā)送給視圖層，同時接收視圖層的事件反饋；視圖層將邏輯層的數(shù)據(jù)展示到界面，同時將視圖層的事件發(fā)送給邏輯層[8]。

小程序前端頁面除上述4類代碼文件外，還包括utils，images，sitemap.json等文件夾，用以支撐小程序前端頁面呈現(xiàn)。其中，utils文件夾存放公共js代碼，方便不同頁面直接調(diào)用，images文件夾通常存放靜態(tài)圖片，sitemap.json用來配置小程序并使其頁面被微信索引[8]。

1.2 小程序云開發(fā)

云開發(fā)能力主要包括云數(shù)據(jù)庫、云存儲、云函數(shù)和云調(diào)用。云數(shù)據(jù)庫是一個json數(shù)據(jù)庫，每條記錄均為json格式。云存儲是一塊存儲空間，通過云函數(shù)可完成前端文件上傳到云存儲及云存儲文件下載到前端等操作。云函數(shù)是一段運行在云端的后端代碼，由開發(fā)者在開發(fā)工具中創(chuàng)建編寫完成后，一鍵上傳部署即可運行。云調(diào)用是利用小程序開放接口的能力，調(diào)用定義在云端的云函數(shù)。相比于傳統(tǒng)開發(fā)模式，云開發(fā)具有開發(fā)高效、成本低、開發(fā)者上手容易、登錄邏輯簡單、服務穩(wěn)定、數(shù)據(jù)安全等優(yōu)點[6]。

2 系統(tǒng)設計

2.1 架構(gòu)設計

高校實驗室信息化管理助手微信小程序的架構(gòu)主要分為前端、后端和前后端交互。前端主要包括小程序UI、展示層的模板引擎渲染、業(yè)務層模塊等。其中，小程序業(yè)務層主要包括設備報修、教學簽到和用戶信息3個模塊。設備報修模塊主要包含填報設備故障報修單、查看個人設備報修記錄、查看某一設備報修詳細信息、管理員查看和處理等功能。教學簽到模塊主要包含填報課堂簽到單、查看課堂簽到記錄、查看某一簽到詳細記錄、根據(jù)某課程簽到記錄再簽一次等功能。用戶信息模塊主要包含用戶登錄授權(quán)、查看個人信息、完善個人信息等功能。后端主要指云服務器端的數(shù)據(jù)存儲，包括云數(shù)據(jù)庫、云函數(shù)和云存儲。前后端數(shù)據(jù)交互主要通過wx.cloud進行，前端通過wx.cloud.callFunction發(fā)送Post或Get請求，更新或訪問云服務器端數(shù)據(jù)，后端通過Promise機制將前端需要的數(shù)據(jù)返回，前端根據(jù)返回內(nèi)容呈現(xiàn)相應頁面。

2.2 業(yè)務流程設計

用戶進入小程序后，訪問云數(shù)據(jù)庫，判斷是否存在該用戶信息，若存在可直接在小程序中完成設備報修和教學簽到。若用戶首次登錄，需授權(quán)小程序獲取微信昵稱、頭像等信息，并將信息寫入云數(shù)據(jù)庫，同時完善個人信息后才能進行設備報修和教學簽到等操作。

用戶發(fā)現(xiàn)設備故障后，可進入小程序填報并提交故障信息，管理員核實并處理故障信息后在小程序中給出反饋，具體報修進度可進入“我報修的故障”模塊中查看。

用戶進入小程序填寫課堂簽到信息時，若此課程通過小程序進行簽到過，可直接根據(jù)已有簽到信息選擇“再簽一次”并提交，具體簽到情況可進入“我的教學簽到”模塊中查看。小程序各模塊的業(yè)務流程如圖1所示。

(a) 我的信息模塊 (b) 設備報修模塊 (c) 教學簽到模塊

2.3 數(shù)據(jù)庫設計

根據(jù)系統(tǒng)功能需求構(gòu)建實體關(guān)系模型，即數(shù)據(jù)庫E-R圖。根據(jù)E-R圖，設計數(shù)據(jù)庫表，分別為用戶信息表、課堂簽到表和設備報修維護表。以設備報修維護表為例，列出其在數(shù)據(jù)庫中的字段名、字段屬性，并對字段進行解釋說明。小程序的數(shù)據(jù)庫E-R圖如圖2所示。設備報修維護表詳細信息見表1。

圖2 小程序的數(shù)據(jù)庫E-R圖

表1 設備報修維護表詳細信息

續(xù)表

3 系統(tǒng)功能實現(xiàn)

點擊“實驗室信息化管理助手”小程序后，即可顯示小程序首頁信息，此時在首頁js文件的onload函數(shù)中調(diào)用云函數(shù)login，獲取云數(shù)據(jù)庫user中的用戶信息，若返回值is_in_database為1，則將返回的個人信息寫入到全局變量app.globalData中，用戶便可進行“設備報修”“課程簽到”和“查看我的信息”等操作。用戶若遇到問題還可在首頁中快速尋求技術(shù)團隊的幫助，向技術(shù)老師打電話或發(fā)消息請求支援。

3.1 設備報修模塊

1)填報“設備故障報修”。用戶切換到設備報修模塊，系統(tǒng)首先判斷全局變量user_id是否為空。若為空，則提示未授權(quán)登錄，并提示用戶在“我的信息”中授權(quán)登錄；若user_id不為空，用戶可填寫設備故障信息，包括教室編號、設備編號、設備名稱、故障說明、添加故障圖片等，同時獲取系統(tǒng)時間，在formSubmit函數(shù)中提交。系統(tǒng)調(diào)用云函數(shù)add_repairedInformation，將故障信息寫入云數(shù)據(jù)庫repair_computer，并清空當前提交的頁面信息，以防用戶重復提交。

2)查看“我報修的故障”。用戶若需查看個人報修情況，可切換至“我報修的故障”頁面，訪問云數(shù)據(jù)庫repair_computer，獲取用戶user_id下所有的報修故障列表，并按照設備報修狀態(tài)、故障提交時間排序呈現(xiàn)。若需查看某條報修信息，點擊“設備名”和“故障說明”，通過options參數(shù)將此條報修id傳至myd_index.js頁面，在頁面中調(diào)用云函數(shù)get_repairDetail，獲取詳細記錄，并在“查看詳情”頁面中呈現(xiàn)。

3)“查看詳情”。用戶提交的故障信息推送至管理員后，管理員可通過訪問云數(shù)據(jù)庫repair_computer查看故障狀態(tài)status為“false”的故障信息。選擇一條未處理的故障信息，在onLoad中訪問云數(shù)據(jù)庫repair_computer，對故障進行查看和處理，并在unrepairedDetail頁面中填寫處理狀態(tài)，給出處理反饋意見，通過formSubmit提交。處理提交后，用戶可在“我報修的故障”中再次查看該條記錄的詳細故障信息，此故障狀態(tài)變?yōu)椤耙烟幚怼薄?/p>

3.2 教學簽到模塊

1)填報“課堂教學簽到”。用戶切換到“教學簽到”模塊，系統(tǒng)首先判斷全局變量user_id是否為空。若為空，則提示未授權(quán)登錄，并提示用戶在“我的信息”中授權(quán)登錄；若user_id不為空，則獲取用戶角色role_value值，待值為teacher，方可填寫簽到信息，否則提示無權(quán)進行教學簽到。用戶可在“課堂教學簽到”模塊填寫課程名稱、教室編號、課堂節(jié)次、應到人數(shù)、實到人數(shù)、課堂開始周次和當前簽到周次等，同時獲取系統(tǒng)簽到時間和當前學期，并通過formSubmit函數(shù)提交。系統(tǒng)調(diào)用云函數(shù)add_signInformation，將簽到信息寫入到云數(shù)據(jù)庫teach_sign_in中，并清空已提交的頁面信息，以防重復提交。

2)查看“我的教學簽到”。用戶若需查看個人簽到情況，可切換至“我的教學簽到”頁面，訪問云數(shù)據(jù)庫teach_sign_in，獲取用戶user_id下的所有簽到信息，并按照簽到時間降序排列。若需查看某條簽到信息，點擊該條簽到信息，通過options參數(shù)將此條課程簽到id傳至msd_index.js頁面，在頁面中調(diào)用云函數(shù)get_ myBeforeSignIn，獲取該簽到課程的詳細記錄，并在“查看簽到詳情”頁面中呈現(xiàn)。

3)根據(jù)已有課程信息再簽一次。若某課程已在系統(tǒng)中有簽到記錄，用戶可直接查看該課程簽到記錄，并在記錄中點擊“再簽一次”按鈕，通過wx.reLaunch跳轉(zhuǎn)到簽到頁面，并傳遞該簽到id值。signIn.js頁面通過observers獲取傳過來的signId值若不為空，則直接調(diào)用云函數(shù)get_ myBeforeSignIn，獲取此簽到id對應的簽到信息，并寫入到文本框中。用戶根據(jù)實際情況修改實到人數(shù)和當前簽到周次后，提交即可產(chǎn)生此次簽到記錄。

3.3 “我的信息”模塊

1)登錄授權(quán)。用戶首次進入小程序時，需切換到“我的信息”模塊進行授權(quán)登錄。若在“我的信息”模塊頁面onLoad中is_in_database值為0，則呈現(xiàn)登錄按鈕。用戶點擊“登錄”按鈕，調(diào)用wx.getUserProfile函數(shù)，彈出授權(quán)框詢問用戶是否允許授權(quán)小程序獲取該用戶微信昵稱、微信頭像等信息；若用戶拒絕授權(quán)，將無法使用小程序基本功能；若用戶選擇允許，則調(diào)用云函數(shù)add_userInfo寫入到云數(shù)據(jù)庫user中，并更新用戶全局變量值。

2)查看和完善“我的信息”。通過wx.getUserProfile函數(shù)授權(quán)獲取的用戶信息不全、部分信息缺失時，需進入“完善我的信息”模塊，填寫用戶姓名、角色、工號或?qū)W號以及聯(lián)系方式等，點擊“提交”按鈕，通過云函數(shù)updata_userInfo更新云數(shù)據(jù)庫user表。用戶數(shù)據(jù)更新后，可進入“查看我的信息”模塊，在頁面onLoad中訪問云數(shù)據(jù)庫user，獲取用戶信息并呈現(xiàn)。

4 系統(tǒng)測試

根據(jù)《智能移動終端應用軟件(APP)技術(shù)要求》(GB/T 37729—2019)，從性能、功能、易用性、UI界面、權(quán)限和兼容性幾方面對小程序展開測試。

1)性能測試。采用微信小程序官方提供的性能分析工具對小程序的性能、體驗和最佳實踐進行詳細測試，評分結(jié)果可在微信開發(fā)者工具Audits中查看。性能測試得分100，測試12項，通過12項。體驗得分90，測試5項，通過4項，沒通過1項，主要原因是文字顏色與背景顏色搭配較差，兩者顏色過于接近。最佳實踐得分80，測試10項，通過7項，沒通過3項，主要原因是發(fā)現(xiàn)使用了廢棄接口、存在未綁定在WXML的變量傳入setData，wxss的覆蓋率較低，存在大量未使用的樣式?？傮w得分98，小程序性能良好，但還需要根據(jù)測試分析結(jié)果進一步優(yōu)化，增強用戶的體驗感。

2)功能測試。小程序功能測試結(jié)果與功能設計描述文檔一致、不含隱藏功能。當終端斷網(wǎng)、電話接入等需要中斷或掛起微信時，小程序未對終端產(chǎn)生破壞性影響。在通信信號不穩(wěn)定、切換網(wǎng)絡等環(huán)境下運行，小程序各業(yè)務功能均正常?？呻S時停止或退出，反復操作使用，微信未出現(xiàn)異常，功能良好。

3)易用性測試。小程序易用性測試良好，支持中文用戶界面，按鈕未出現(xiàn)點擊無反應、報錯等問題，界面未出現(xiàn)模糊、拉伸變形等現(xiàn)象。標簽與內(nèi)容關(guān)聯(lián)，切換標簽時，內(nèi)容隨之切換，無空白頁面。軟件界面易操作，菜單層次最多3層，界面均有退出、返回按鈕。小程序無用戶操作手冊，無廣告信息推送，無字體調(diào)節(jié)和界面調(diào)節(jié)功能。

4)UI界面測試。小程序?qū)Ш街庇^，各控件操作方式一致，頁面標簽風格統(tǒng)一，字體、字號、格式和規(guī)范均一致，頁面圖片清晰、尺寸一致、配色合理，無敏感性詞匯、關(guān)鍵詞、敏感圖片等內(nèi)容，可以根據(jù)需要對不同窗口尺寸進行UI適配。

5)權(quán)限測試。小程序權(quán)限測試良好，在用戶未登錄時，點擊各業(yè)務模塊均彈出請授權(quán)登錄。用戶授權(quán)登錄后，可正常使用各業(yè)務模塊。同一微信號在不同手機微信端登錄，所能查看的數(shù)據(jù)和操作的各業(yè)務模塊均相同。

6)兼容性測試。小程序調(diào)試基礎(chǔ)庫版本為2.20.2，支持Android端/IOS端8.0.14及以上版本，基本覆蓋Android和IOS主流版本系統(tǒng)，但目前尚不支持MacOS和Windows版本。

5 結(jié)論

設計開發(fā)了一款高校實驗室信息化管理助手微信小程序，性能、功能、易用性、UI界面、權(quán)限和兼容性測試結(jié)果良好，可在高校實驗室投入使用。但是，小程序在應用中也存在一些問題，如簽到數(shù)據(jù)和維護數(shù)據(jù)未能導出為EXCEL格式文件，無法進行教室預約等，需在應用過程中不斷完善，以實現(xiàn)實驗室的數(shù)字化、信息化管理。