基于uni-app ＋SpringBoot 的移動智能辦公系統(tǒng)設(shè)計(jì)與實(shí)現(xiàn)

李英玲，牛美雅，蘭宏富

(1. 西南民族大學(xué)計(jì)算機(jī)科學(xué)與工程學(xué)院，四川成都 610041；2. 西南民族大學(xué)計(jì)算機(jī)系統(tǒng)國家民委重點(diǎn)實(shí)驗(yàn)室，四川成都 610041)

隨著計(jì)算機(jī)技術(shù)在軟件應(yīng)用上逐漸成熟，辦公軟件已從無紙化辦公發(fā)展到互聯(lián)網(wǎng)遠(yuǎn)程辦公，能滿足人們基本的辦公需求[1].各地方政府、大型企業(yè)等機(jī)構(gòu)，都大力加強(qiáng)辦公的自動化和信息化建設(shè)，協(xié)同辦公模式逐步在企業(yè)以及政務(wù)辦公中占據(jù)主體地位[2]，以提高員工工作效率和企業(yè)競爭力[3-4].隨著物聯(lián)網(wǎng)、大數(shù)據(jù)、人工智能等技術(shù)的快速發(fā)展，給傳統(tǒng)辦公帶來發(fā)展契機(jī)，在線移動辦公成為繼無紙化辦公和互聯(lián)網(wǎng)遠(yuǎn)程辦公之后的新一代辦公模式.新一代信息技術(shù)的應(yīng)用，既可有效促進(jìn)整個(gè)協(xié)同辦公體系的發(fā)展，也為企業(yè)智能化轉(zhuǎn)型提供內(nèi)驅(qū)力[5].OA 系統(tǒng)成長至第三代時(shí)，數(shù)據(jù)處理技術(shù)、數(shù)據(jù)庫和信息管理技術(shù)的應(yīng)用進(jìn)一步提高了OA 系統(tǒng)的辦公質(zhì)量和效率[6]，但是也存在技術(shù)過于陳舊[7]、審批效率低下[8]，并且安裝和操作繁瑣、系統(tǒng)安全[9]與數(shù)據(jù)安全等問題[10-13]. 隨著微信應(yīng)用的普及以及微信公眾平臺二次開發(fā)接口的提供，微信小程序無需安裝、卸載、隨時(shí)打開等諸多優(yōu)勢[14].很大程度上滿足了移動辦公開發(fā)需求[15]，但是在操作流程、人性化、便捷服務(wù)和安全性等方面不足.

基于上述背景，本系統(tǒng)實(shí)現(xiàn)了一個(gè)移動智能辦公系統(tǒng)，以 uni-app 和 Springboot 為核心框架，將 Shiro、JWT 和人臉識別技術(shù)相結(jié)合，并采用本地寶和GPS定位技術(shù)，實(shí)現(xiàn)簽到考勤、視頻會議、消息通知、用戶身份認(rèn)證和授權(quán)，并對拍照簽到地疫情風(fēng)險(xiǎn)進(jìn)行管理.通過異步多線程向RabbitMQ 發(fā)送公告實(shí)現(xiàn)對消息數(shù)據(jù)的緩存，最后采用RBAC 權(quán)限控制技術(shù)實(shí)現(xiàn)了對用戶權(quán)限的管理.該系統(tǒng)能較大程度上簡化用戶操作、增強(qiáng)系統(tǒng)安全性，提高辦公的工作效率，并提升用戶體驗(yàn).

1 系統(tǒng)架構(gòu)

基于uni-app 和SpringBoot 移動智能辦公系統(tǒng)的架構(gòu)如圖1 所示，包含5 個(gè)邏輯元素，分別是使用uni-app 框架開發(fā)系統(tǒng)的移動端、各個(gè)功能的基礎(chǔ)模塊、保證安全交互的數(shù)據(jù)庫.

圖1 系統(tǒng)架構(gòu)圖Fig.1 Model architecture of smart mobile office system

1)前端采用uni-app 框架進(jìn)行開發(fā)，uni-app 是使用Vue 語言來實(shí)現(xiàn)開發(fā)各種跨平臺應(yīng)用的前端框架，組件豐富.

2)后端采用SpringBoot 進(jìn)行開發(fā)，其主要優(yōu)點(diǎn):快速地構(gòu)建項(xiàng)目、對于主流開發(fā)框架無需配置集成、項(xiàng)目可獨(dú)立運(yùn)行、不需要外部依賴Servlet 容器、提供在運(yùn)行時(shí)的應(yīng)用監(jiān)控，因此極大地改善和提高了項(xiàng)目開發(fā)的工作效率.

3)后端的權(quán)限驗(yàn)證使用Java 領(lǐng)域非常知名的認(rèn)證與授權(quán)框架Shiro，該框架適用性廣泛.系統(tǒng)可抵御跨站腳本XSS 攻擊，通過過濾器攔截所有請求，將請求中的內(nèi)容轉(zhuǎn)義，再存儲到數(shù)據(jù)庫中.

4)人臉識別程序需要較多依賴庫，環(huán)境配置繁瑣，因此本系統(tǒng)把依賴環(huán)境和人臉識別程序環(huán)境封裝成Docker 鏡像.只需要在本地Docker 創(chuàng)建容器，并導(dǎo)入鏡像，就可運(yùn)行人臉識別程序.

5)消息通知模塊使用異步多線程向RabbitMQ 發(fā)送公告消息緩存數(shù)據(jù)，以降低MongoDB 數(shù)據(jù)庫寫入壓力，提高系統(tǒng)健壯性. 拍照簽到功能通過調(diào)用人臉識別程序，實(shí)現(xiàn)簽到功能，最終將簽到信息存儲到Mysql 中.

1.1 uni-app 框架

uni-app 被廣泛認(rèn)為是較好的小程序開發(fā)框架、App 跨平臺框架和方便的H5 開發(fā)框架.當(dāng)業(yè)務(wù)需要在不同的平臺展示時(shí)，針對不同的平臺編寫?yīng)氂械倪\(yùn)行代碼的成本顯然非常高，而uni-app 則可以實(shí)現(xiàn)一次編碼多端編譯，可將代碼發(fā)布到iOS，以及各種小程序(微信/支付寶/頭條/QQ)、快應(yīng)用等多個(gè)不同的平臺，從而降低開發(fā)成本. 因此，為了提高代碼的效率，本系統(tǒng)使用uni-app 框架開發(fā)前端應(yīng)用，該框架遵循Vue 語法規(guī)范，主要用到了CSS、LESS 和 JavaScript 語言.

1.2 Shiro 和 JWT 技術(shù)

Shiro 是Java 領(lǐng)域非常知名的認(rèn)證(Authentication)與授權(quán)(Authorization)框架，用以替代JavaEE 中的JAAS 功能.相較于其他認(rèn)證與授權(quán)框架，Shiro 設(shè)計(jì)得非常簡單，適用性好，任意JavaWeb 項(xiàng)目都可以使用Shiro 框架，而Spring Security 只能適用于Spring項(xiàng)目. 例如，JFinal 和 Nutz 非 Spring 框架都可使用Shiro，而 Spring Security 框架不適用. 因此，本系統(tǒng)采用Shiro 技術(shù)實(shí)現(xiàn)核驗(yàn)用戶身份與授予用戶權(quán)限的功能.

JWT (Json Web Token)被廣泛用來在身份提供者和服務(wù)提供者間傳遞被認(rèn)證的用戶身份信息，以便于從資源服務(wù)器獲取資源，也可用于增加一些額外的其他業(yè)務(wù)邏輯所必須的聲明信息，該Token 也可直接被用于身份認(rèn)證，也可被用于進(jìn)行數(shù)據(jù)加密. JWT 技術(shù)實(shí)現(xiàn)用戶認(rèn)證，如圖2 所示，后端系統(tǒng)根據(jù)用戶OpenID、微信賬號以及過期時(shí)間生成Token 字符串令牌，Token 字符串令牌返回給小程序端，用戶發(fā)送任何請求都要附帶Token，通過每次驗(yàn)證Token 字符串令牌的有效性，決定是否執(zhí)行請求的業(yè)務(wù)邏輯.

圖2 基于 JWT 的用戶認(rèn)證Fig.2 User authentication based on JWT

傳統(tǒng)的 HttpSession 依靠瀏覽器的 Cookie 存放SessionId，要求客戶端必須是瀏覽器.當(dāng)前的JavaWeb系統(tǒng)，客戶端可以是瀏覽器、APP、小程序以及物聯(lián)網(wǎng)設(shè)備.為了讓這些設(shè)備都能訪問到JavaWeb 項(xiàng)目，引入JWT 技術(shù).JWT 的Token 是純字符串，至于客戶端如何保存，沒有具體要求. 只要客戶端發(fā)起請求的時(shí)候附帶上Token 即可. 本系統(tǒng)使用Shiro 和JWT 技術(shù)實(shí)現(xiàn)用戶身份認(rèn)證功能.

1.3 RabbitMQ

消息隊(duì)列產(chǎn)品有很多，常見的包括RocketMQ、RabbitMQ、ActiveMQ 和 Kafka. 其中 Kafka 性能最好，消息收發(fā)的速度較快；但是消息收發(fā)的可靠性不如RabbitMQ.

RabbitMQ 既支持消息異步收發(fā)，又支持同步收發(fā).雖然系統(tǒng)當(dāng)前大部分的場景對應(yīng)的是消息異步收發(fā)，但是也有同步收發(fā)的需求，RabbitMQ 能適應(yīng)各種業(yè)務(wù)場景的優(yōu)點(diǎn)就得以體現(xiàn).另外，RabbitMQ 支持五種隊(duì)列模式，可以應(yīng)用于更多的業(yè)務(wù)場景. 基于RabbitMQ 上述的優(yōu)點(diǎn)，本項(xiàng)目選擇RabbitMQ 實(shí)現(xiàn)消息隊(duì)列.

1.4 Docker

本系統(tǒng)采用Docker 技術(shù)搭建人臉識別程序運(yùn)行環(huán)境，主要基于以下兩方面的考慮:

首先，Docker 容器之間是相互隔離的，在容器中部署程序的同時(shí)，不用擔(dān)心跟其他容器產(chǎn)生沖突. 例如某公司幾年前開發(fā)的Java 程序用的是JDK1.6，而當(dāng)前需要部署的Java 項(xiàng)目基于JDK1.8 開發(fā)，無法在服務(wù)器上面同時(shí)安裝JDK1.6 和JDK1.8 環(huán)境.Docker技術(shù)通過創(chuàng)建兩個(gè)人容器進(jìn)行部署能解決這個(gè)問題，在兩個(gè)容器中分別安裝JDK1.6 和JDK1.8，分別部署新舊程序.Docker 可實(shí)現(xiàn)在一個(gè)服務(wù)器上部署若干程序，并且不產(chǎn)生沖突.

其次，Docker 能提供快速化部署. 把需要部署的程序和運(yùn)行環(huán)境打成Docker 鏡像，分發(fā)給其他人，接收后創(chuàng)建容器就可以直接運(yùn)行程序了.

1.5 RBAC 權(quán)限管理

RBAC 的基本思想是，對系統(tǒng)操作的各種權(quán)限不是直接授予具體的用戶，而是在用戶集合與權(quán)限集合之間建立一個(gè)角色集合.每一種角色對應(yīng)一組相應(yīng)的權(quán)限.一旦用戶被分配適當(dāng)?shù)慕巧?，該用戶就擁有此角色的所有操作?quán)限.這樣做的好處是，不必在每次創(chuàng)建用戶時(shí)都進(jìn)行分配權(quán)限的操作，只要分配用戶相應(yīng)的角色即可，而且角色的權(quán)限變更比用戶的權(quán)限變更要少很多，這樣將簡化用戶權(quán)限管理，減少系統(tǒng)開銷.

2 系統(tǒng)設(shè)計(jì)與實(shí)現(xiàn)

2.1 軟件功能設(shè)計(jì)

基于uni-app 和SpringBoot 移動智能辦公系統(tǒng)的總體功能設(shè)計(jì)如圖3 所示:包括簽到考勤模塊、視頻會議模塊、消息通知模塊和系統(tǒng)管理模塊.

圖3 基于uni-app 和SpringBoot 移動智能辦公系統(tǒng)總體功能Fig.3 Overall requirement of smart mobile office system

簽到考勤模塊包括拍照簽到、簽到地疫情風(fēng)險(xiǎn)管理、考勤統(tǒng)計(jì)功能.在職員工身份認(rèn)證及授權(quán)成功后，通過人臉識別子系統(tǒng)進(jìn)行拍照簽到；系統(tǒng)獲取員工簽到地的疫情風(fēng)險(xiǎn)信息，針對高風(fēng)險(xiǎn)地區(qū)進(jìn)行相應(yīng)處理；最后統(tǒng)計(jì)簽到信息:包括用戶信息、簽到時(shí)間、疫情風(fēng)險(xiǎn)等級、周考勤.

視頻會議管理模塊包括創(chuàng)建＼編輯會議、選擇參會者和查看會議功能.具有會議相應(yīng)權(quán)限的用戶和超級管理員可創(chuàng)建會議，并可在會議詳情頁面可填寫會議時(shí)間、會議參與人以及會議內(nèi)容等信息.查看會議，是用戶可通過滑動、分頁等方式查看個(gè)人創(chuàng)建或者參與的會議列表，以及會議詳情.

消息通知管理模塊包括定時(shí)輪詢接收消息、消息的自動發(fā)送和異步寫入功能.在小程序主頁面設(shè)有定時(shí)器，每5 分鐘輪詢接收新消息，并在主頁面上顯示未讀消息提醒；消息的自動發(fā)送指系統(tǒng)自動向員工發(fā)送消息通知，并將消息寫到消息隊(duì)列. 異步寫入消息是用異步線程從消息隊(duì)列中，接收該用戶的系統(tǒng)消息，然后把系統(tǒng)消息存儲在數(shù)據(jù)庫中.

系統(tǒng)管理模塊包括用戶管理、權(quán)限管理和部門管理功能.權(quán)限管理是采用RBAC 權(quán)限模型，把權(quán)限映射成角色，再把角色關(guān)聯(lián)到用戶的功能，并且前后端項(xiàng)目都要驗(yàn)證用戶的權(quán)限，才能實(shí)現(xiàn)登錄. 編輯個(gè)人信息是用戶可以通過編輯按鈕實(shí)現(xiàn)對個(gè)人信息的修改、刪除功能.

2.2 數(shù)據(jù)庫設(shè)計(jì)

本系統(tǒng)使用Mysql 數(shù)據(jù)庫，根據(jù)軟件功能列表，設(shè)計(jì)如下的數(shù)據(jù)表:

1)系統(tǒng)常量表(sys＿config)，記錄移動辦公系統(tǒng)的常量配置信息，包括主鍵、參數(shù)名、參數(shù)值、狀態(tài)、備注等.2)用戶表(tb＿user)，記錄用戶信息，包括主鍵id、授權(quán)字符串、昵稱、頭像網(wǎng)址、姓名、性別、手機(jī)號碼、郵箱、入職日期、角色、是否是超級管理員、部門編號、狀態(tài)(1 在職 0 離職)等.3)角色表(tb＿role)，記錄系統(tǒng)角色信息，包括主鍵id、角色名稱、權(quán)限集合.4)權(quán)限表(tb＿permission)，記錄每個(gè)權(quán)限所能夠訪問的模塊，包括權(quán)限名稱、模塊ID、行為ID.5)特殊工作日表(tb＿workday)，記錄特殊工作日信息，包括id 和特殊工作日日期.6)特殊節(jié)假日表(tb＿h(yuǎn)olidays)，記錄特殊節(jié)假日信息，包括id 和節(jié)假日日期.7)用戶人臉模型表(tb＿face＿model)，記錄用戶人臉模型數(shù)據(jù)信息，包括人臉模型id、用戶id 和用戶人臉模型數(shù)據(jù).8)部門表(tb＿dept)，記錄部門信息，包括部門id 和部門名稱.9)城市表(tb＿city)，記錄城市名稱及對應(yīng)的簡稱信息，包括id、城市名稱和城市簡稱.10)用戶簽到表(tb＿checkin)，用于存儲用戶簽到的信息，主鍵、用戶ID、簽到地址、國家、省份、城市、區(qū)劃、考勤結(jié)果、風(fēng)險(xiǎn)等級、簽到日期、簽到時(shí)間.11)會議表(tb＿meeting)，記錄會議信息，包括會議id、會議題目、創(chuàng)建人id、日期、開會地點(diǎn)、開始時(shí)間、結(jié)束時(shí)間、會議類型、參與者、會議內(nèi)容和狀態(tài)等.12)消息表，記錄系統(tǒng)發(fā)出的或者其他用戶發(fā)出的通知信息的主體，包括主鍵、UUID 值(設(shè)置唯一索引，防止消息被重復(fù)發(fā)送)、發(fā)送者ID、發(fā)送者的頭像URL、發(fā)送者名稱、消息正文、發(fā)送時(shí)間.13)消息標(biāo)記表(message＿ref)，記錄有關(guān)消息接收者的信息，包括主鍵、消息ID、接收者ID、是否已讀、是否為新接收的消息.

2.3 系統(tǒng)詳細(xì)設(shè)計(jì)與實(shí)現(xiàn)

2.3.1 簽到考勤

簽到考勤模塊的流程圖如圖4 所示.

圖4 簽到考勤流程圖Fig.4 Flow chart of check-in attendance

用戶授權(quán)成功后進(jìn)入在線考勤頁面，訪問服務(wù)器動態(tài)獲取當(dāng)天是否需要簽到(非工作日或者調(diào)班日無需簽到)；在工作日，用戶點(diǎn)擊拍照按鈕進(jìn)行拍照，同時(shí)后端檢測是否存在該用戶的人臉模型數(shù)據(jù)，如果沒有，則彈出提示框，詢問用戶是否要錄入人臉模型數(shù)據(jù)；如果數(shù)據(jù)庫中存在人臉模型數(shù)據(jù)，則通過人臉識別子系統(tǒng)比對當(dāng)前拍照的圖像與系統(tǒng)人臉模型，比對成功就簽到成功，否則簽到失敗.簽到成功后，根據(jù)用戶簽到的地理位置，并通過本地寶獲取該地區(qū)新冠疫情風(fēng)險(xiǎn)等級，如果員工在疫情高風(fēng)險(xiǎn)地區(qū)簽到，系統(tǒng)立即向公司人事部門發(fā)送告警郵件. 最后，后端系統(tǒng)對用戶簽到考勤信息進(jìn)行統(tǒng)計(jì)，通過圖表的方式展示當(dāng)日簽到信息和本周簽到信息，并使用灰色圖標(biāo)表示節(jié)假日及用戶入職前的考勤情況.

實(shí)現(xiàn)簽到考勤模塊功能偽代碼如下:

images/BZ_84_1282_1296_2274_1371.png輸入:用戶簽到照片path 和所在地信息集合param輸出:無BEGIN驗(yàn)證認(rèn)證與授權(quán)doGetAuthenticationInfo獲取上班時(shí)間d2，考勤結(jié)束時(shí)間d3 If 簽到時(shí)間d1 ＜=上班時(shí)間d2 Then正?？记贓lse if 簽到時(shí)間 d1 ＞ 上班時(shí)間 d2 ＆＆ 簽到時(shí)間 d1 ＜考勤結(jié)束時(shí)間d3 Then遲到End If獲取數(shù)據(jù)庫中存儲的該用戶人臉模型數(shù)據(jù)faceModel IffaceModel = = null Then拋出異常:不存在人臉模型Else向人臉識別子系統(tǒng)發(fā)送請求HttpUtil.createPost(checkinUrl)；請求體攜帶用戶簽到照片F(xiàn)ileUtil.file(path)與人臉模型數(shù)據(jù)faceModel If 無法識別出人臉或照片中存在多張人臉Then拋出異常Else if "False".equals(body)拋出異常Else if "True".equals(body)獲取用戶簽到地新冠疫情等級保存簽到記錄End If End If END

拍照簽到:通過doGetAuthenticationInfo 方法對用戶認(rèn)證授權(quán)成功后，如果是第一次簽到，checkin 方法檢測數(shù)據(jù)庫中沒有該員工人臉模型，給出異常提示，根據(jù)當(dāng)前簽到照片創(chuàng)建人臉模型數(shù)據(jù)；否則，向人臉識別程序發(fā)送http 請求，驗(yàn)證當(dāng)前簽到照片與系統(tǒng)人臉模型是否一致，驗(yàn)證成功，則簽到成功，同時(shí)獲取簽到地疫情風(fēng)險(xiǎn)信息；否則簽到失敗.

簽到地疫情風(fēng)險(xiǎn)管理:通過GPS 定位員工打卡位置，使用騰訊位置服務(wù)獲取坐標(biāo)轉(zhuǎn)換成真實(shí)地址，然后采用本地寶查詢所在地區(qū)風(fēng)險(xiǎn)等級，根據(jù)所在地區(qū)信息拼接成對應(yīng)的本地寶訪問地址url，然后解析本地寶HTML 頁面的標(biāo)簽，提取其風(fēng)險(xiǎn)疫情等級信息.如果員工的疫情風(fēng)險(xiǎn)等級是:高風(fēng)險(xiǎn)，后端就發(fā)送高風(fēng)險(xiǎn)疫情警告郵件給管理員.

為了同時(shí)處理風(fēng)險(xiǎn)等級判斷和告警郵件發(fā)送，提高系統(tǒng)的執(zhí)行效率，故將發(fā)送告警郵件的功能提取出來，用異步多線程執(zhí)行的.具體來講，在主類上添加＠EnableAsync 以開啟異步多線程；創(chuàng)建ThreadPoolConfig 類，聲明 Java 線程池；創(chuàng)建 EmailTask 類，定義線程任務(wù)；查詢員工的姓名和部門名稱，在. xml 文件中聲明查詢語句；接口中定義抽象方法，定義值注入變量，用來接收用戶簽到地高風(fēng)險(xiǎn)告警郵件.

2.3.2 視頻會議

創(chuàng)建/編輯會議功能包含創(chuàng)建會議和編輯會議兩部分.通過點(diǎn)擊創(chuàng)建會議、編輯會議按鈕會進(jìn)入到會議詳情頁面，該頁面包括輸入會議標(biāo)題、編輯會議時(shí)間、地點(diǎn)和內(nèi)容以及選擇會議的參會者三部分.其中，當(dāng)選擇會議類型為:線下會議時(shí)，地點(diǎn)是必填項(xiàng).用戶填完信息后可以點(diǎn)擊保存.

選擇會議參會者功能實(shí)現(xiàn)了用戶在填寫會議詳情的時(shí)候，點(diǎn)擊添加按鈕，跳轉(zhuǎn)到部門員工列表，在其中選擇需要添加的員工.當(dāng)用戶點(diǎn)擊添加參會者按鈕時(shí)，需要驗(yàn)證當(dāng)前用戶是否具有查看部門員工的權(quán)限，如果有權(quán)限就會展示所有部門的員工. 頁面初始化時(shí)，會獲取當(dāng)前會議已選的參會者.

查看會議功能主要是實(shí)現(xiàn)分頁加載會議列表meeting＿list.頁面初始化時(shí)，小程序端向后端請求當(dāng)前用戶的會議列表；后端獲取數(shù)據(jù)后，通過分頁的形式，展示了用戶參與或創(chuàng)建的會議，并且按日期進(jìn)行分組展示.

2.3.3 消息通知

該功能模塊包括定時(shí)輪詢接收消息，消息自動發(fā)送以及異步寫入消息.

1)定時(shí)輪詢接收消息

首頁的定時(shí)輪詢活動如圖5 所示，index 頁面設(shè)有定時(shí)器，每5 分鐘發(fā)送一次輪詢，消息任務(wù)MessageTask 利用異步線程接收MQ 中的消息，并保存到消息集合message＿ref 中，并將新收到的消息的標(biāo)志位設(shè)置為false；服務(wù)端程序Service 把消息隊(duì)列中當(dāng)前用戶的未讀消息返回到微信小程序，顯示給用戶.

圖5 視頻會議流程圖Fig.5 Flow chart of video conferences

2)消息的自動發(fā)送

與用戶相關(guān)的業(yè)務(wù)發(fā)生變化或者用戶資料被修改后，系統(tǒng)會自動向員工發(fā)送消息通知；后端接收到消息后，調(diào)用messageTask 類發(fā)送系統(tǒng)消息到MQ 消息隊(duì)列中，并不直接寫入到MongoDB；然后在首頁輪詢的時(shí)候提示用戶有新的系統(tǒng)消息.

3)異步寫入

異步寫入是在用戶登錄時(shí)，消息任務(wù)類 MessageTask 的異步線程，從消息隊(duì)列MQ 中接收該用戶的系統(tǒng)消息；然后將系統(tǒng)消息存儲到數(shù)據(jù)庫，并從消息隊(duì)列MQ 中刪除，從而實(shí)現(xiàn)了錯峰寫入.

消息列表詳情頁面中，根據(jù)發(fā)送郵件者的不同，可以動態(tài)設(shè)置消息列表頁面的名稱，也可根據(jù)當(dāng)前的消息類型，展示不同的消息列表. 未讀的消息底色為紅色，用戶單擊未讀消息，當(dāng)用戶點(diǎn)擊后，后端通過消息ID 將message＿ref 集合中的未讀標(biāo)志重置為已讀.

2.3.4 系統(tǒng)管理

該功能模塊包括用戶管理、權(quán)限管理和部門管理.

1)用戶管理

用戶管理包括激活碼注冊、我的考勤、個(gè)人資料管理等功能.當(dāng)管理員創(chuàng)建新員工后，系統(tǒng)會自動向新員工發(fā)送包含激活碼的郵件.新員工在線辦公系統(tǒng)的注冊頁面填寫激活碼后，系統(tǒng)將微信平臺獲取到用戶的信息，更新到數(shù)據(jù)庫，實(shí)現(xiàn)用戶微信賬號和系統(tǒng)賬號進(jìn)行綁定.在后續(xù)的登錄時(shí)，只需點(diǎn)擊登錄按鈕即可實(shí)現(xiàn)自動登錄.

我的考勤功能，可在日歷控件選擇查詢的年份和月份，得到個(gè)人的月考勤情況；個(gè)人資料功能，實(shí)現(xiàn)對個(gè)人信息的錄入和修改.

再如選段中的句子：“Si elles sont grasses…(if they are lush…)”由于上文的“terres（土地）”是陰性復(fù)數(shù)的名詞，因此該句中選擇了陰性復(fù)數(shù)的主語人稱代詞elles（她們）代替terres；然而在英語的詞匯中，主格的第三人稱復(fù)數(shù)是不分性別的，所以只能用they一詞來作為法語elles的譯文，同樣無法譯出原文terres的“性”。

2)權(quán)限管理

用戶登錄系統(tǒng)時(shí)，Shiro 框架會對用戶進(jìn)行認(rèn)證與授權(quán)，成功獲取認(rèn)證與授權(quán)對象后，跳轉(zhuǎn)至首頁，微信小程序端從本地讀取用戶的權(quán)限信息，進(jìn)行權(quán)限控制管理.

認(rèn)證與授權(quán):本系統(tǒng)通過使用RBAC 權(quán)限管理結(jié)合Shiro(Java 安全框架)技術(shù)，根據(jù)用戶的狀態(tài)(例如在職、離職)和令牌的有效性實(shí)現(xiàn)對用戶的認(rèn)證，確保平臺權(quán)限訪問的安全和正常運(yùn)行.其認(rèn)證與授權(quán)過程如圖6 所示:

圖6 基于Shiro 認(rèn)證與授權(quán)流程圖Fig.6 Flow chart of certification and authorization

當(dāng)微信小程序端發(fā)送ajax 請求傳遞參數(shù)，后端Shiro 的過濾器XssFilter 攔截所有的請求，將傳遞的數(shù)據(jù)信息轉(zhuǎn)義后存儲到數(shù)據(jù)庫中.轉(zhuǎn)義后的請求會再次被OAuth2Filter 類攔截，認(rèn)證用戶提交的令牌沒有問題， 就可以當(dāng)作已經(jīng)成功登錄， 因此需要OAuth2Realm 類頒發(fā)認(rèn)證對象，然后通過HTTP 請求往下傳遞.接著讓OAuth2Realm 類中的授權(quán)方法返回一個(gè)授權(quán)對象，根據(jù)用戶的userId 將用戶的權(quán)限列表查詢出來，封裝在授權(quán)對象中，傳遞給Web 方法，最終返回給微信小程序端進(jìn)行存儲.

權(quán)限控制:采用RBAC 權(quán)限控制技術(shù)，實(shí)現(xiàn)了對用戶權(quán)限的管理.采用模塊和行為相結(jié)合的方式得到權(quán)限控制消息，并記錄到權(quán)限表tb＿permission 中，同時(shí)采用JSON 數(shù)據(jù)格式存儲各角色的權(quán)限.

本系統(tǒng)的微信小程序端和后端都需要權(quán)限驗(yàn)證，后端的權(quán)限驗(yàn)證通過Shiro 框架實(shí)現(xiàn)，微信小程序端通過自定義封裝函數(shù)來實(shí)現(xiàn)權(quán)限驗(yàn)證.用戶的權(quán)限信息存儲在權(quán)限表中，當(dāng)用戶登錄時(shí)，從后端程序查詢并得到當(dāng)前用戶的權(quán)限列表，并保存到本地Storage.然后每個(gè)頁面在加載時(shí)，先判斷用戶的權(quán)限，再根據(jù)權(quán)限控制頁面加載的內(nèi)容.例如:用戶登錄成功后，點(diǎn)擊“會議”，進(jìn)入會議列表頁面. 具有創(chuàng)建會議權(quán)限的用戶可以看到“創(chuàng)建會議”按鈕；沒有該權(quán)限的用戶無法查看到“創(chuàng)建會議”按鈕.

3)部門管理

部門管理是給擁有管理員權(quán)限和部門查看、修改權(quán)限的用戶呈現(xiàn)部門信息、增刪改功能. 在新增和修改時(shí)，需要驗(yàn)證用戶輸入的部門名稱，是否符合要求并且是否為已存在的部門；在刪除部門時(shí)，給出刪除的確認(rèn)提示“是否刪除某某部門?”，以免誤操作.

①HBuilder X；

②微信開發(fā)者工具；

③IntelliJ IDEA 2020.3.3；

④Navicat Premium 15；

⑤Oracle VM VirtualBox；

⑥MobaXterm.

3 系統(tǒng)測試

本系統(tǒng)的測試通過真機(jī)運(yùn)行，使用昵稱為“王小美”的管理員賬號登錄，按照管理員的注冊和登錄、消息通知的接收和發(fā)送、拍照簽到的驗(yàn)證、簽到考勤統(tǒng)計(jì)的查看、視頻會議的編輯、用戶和部門的管理流程進(jìn)行測試.

1)登錄注冊

首先管理員賬號“王小美”在注冊頁面輸入激活碼:000000，若綁定過超級管理員則顯示“無法注冊成為超級管理員”，否則注冊成功并跳轉(zhuǎn)至首頁.測試結(jié)果如圖7 所示.

2)消息通知

當(dāng)用戶注冊成功跳轉(zhuǎn)至首頁，通過下拉展示輪詢接收到新信息，并且可在消息提醒中查看接收到的新系統(tǒng)消息.測試結(jié)果如圖8 所示.

圖8 (a)定時(shí)輪詢接收新消息(b)未讀消息頁面Fig.8 (a) Regularly receiving new messages(b) The pages of unread messages

3)拍照簽到

用戶點(diǎn)擊“拍照”，獲得攝像頭權(quán)限后，進(jìn)行人臉拍照.若用戶是新員工第一次拍照簽到，會提示用戶“是否將當(dāng)前照片作為人臉識別模型?”，用戶點(diǎn)擊確定后，系統(tǒng)提示“人臉建模成功”；否則直接進(jìn)行簽到.測試結(jié)果如圖9 所示.

圖9 (a)新用戶首次拍照簽到頁面(b)簽到成功Fig.9 (a) First check-in pages (b) Check-in successfully

4)簽到考勤統(tǒng)計(jì)

簽到成功后，跳轉(zhuǎn)至簽到結(jié)果頁面，顯示用戶今日的簽到信息以及用戶本周的考勤情況。 系統(tǒng)檢測到該用戶簽到地為高風(fēng)險(xiǎn)地區(qū)，給公司主管發(fā)送疫情告警郵件。 測試結(jié)果如圖10 所示.

圖10 (a)簽到地疫情風(fēng)險(xiǎn)告警郵件 (b)簽到記錄Fig.10 (a) Warning emails of epidemic risk(b) Sign-in records

5)視頻會議

用戶點(diǎn)擊“會議”，進(jìn)入會議列表頁面. 具有創(chuàng)建會議權(quán)限的用戶可以看到“創(chuàng)建會議”按鈕.點(diǎn)擊“創(chuàng)建會議”按鈕，進(jìn)入會議詳情頁面，填寫會議的信息并選擇會議參會者.測試結(jié)果如圖11 所示.

圖11 (a)具有權(quán)限的會議列表 (b)創(chuàng)建會議頁面Fig.11 (a) Authorauthorized meeting list(b) Creating a meeting

6)用戶管理

管理員可以對員工進(jìn)行管理，在我的頁面點(diǎn)擊“員工管理”，添加新員工的基本信息.保存成功后，發(fā)送系統(tǒng)注冊碼到新員工的郵箱.測試結(jié)果如圖12 所示.

圖12 (a)我的頁面 (b)新用戶激活碼注冊Fig.12 (a) My pages (b) Activation registration code

7)部門管理

管理員點(diǎn)擊“部門管理”，顯示所有的部門信息，可進(jìn)行新增、修改和刪除操作. 選中“市場部”，點(diǎn)擊“修改”按鈕，將“市場部”修改為“外聯(lián)部”，測試結(jié)果如圖13 所示.

圖13 (a)修改部門名稱 (b)添加部門成功Fig.13 (a) Update department Name (b) Add department

4 結(jié)論

隨著計(jì)算機(jī)技術(shù)在軟件應(yīng)用上逐漸成熟，在線移動辦公成為繼無紙化辦公和互聯(lián)網(wǎng)遠(yuǎn)程辦公之后的新一代辦公模式.利用微信公眾平臺提供的二次開發(fā)接口，結(jié)合業(yè)務(wù)及日常辦公流程開發(fā)移動辦公系統(tǒng)，很大程度上滿足了移動辦公開發(fā)需求.

基于上述背景，本系統(tǒng)基于微信平臺，采用uniapp 和SpringBoot 框架設(shè)計(jì)并實(shí)現(xiàn)移動智能辦公系統(tǒng)，具體包括:基于Shiro 和JWT 技術(shù)實(shí)現(xiàn)了用戶身份認(rèn)證和授權(quán)管理；基于人臉識別技術(shù)實(shí)現(xiàn)了拍照簽到，并采用GPS 定位和本地寶實(shí)現(xiàn)員工簽到地疫情風(fēng)險(xiǎn)管理；使用異步多線程向RabbitMQ 發(fā)送公告，數(shù)據(jù)緩存等功能.

最后，以實(shí)際應(yīng)用為例進(jìn)行測試，驗(yàn)證了該系統(tǒng)能較大程度上簡化用戶操作、增強(qiáng)系統(tǒng)安全性，提高辦公的工作效率，并提升用戶體驗(yàn).