動(dòng)態(tài)表單技術(shù)在高校流程建設(shè)中的應(yīng)用

文/吳昊

結(jié)合“互聯(lián)網(wǎng)+教育”的思想，智慧校園一站式綜合服務(wù)平臺(tái)應(yīng)運(yùn)而生。該平臺(tái)包括各類業(yè)務(wù)系統(tǒng)的集成、日常行政事務(wù)的辦理等。傳統(tǒng)的建設(shè)方式會(huì)造成兼容性差、擴(kuò)展性差等問題。動(dòng)態(tài)表單技術(shù)的出現(xiàn)，不僅能夠提高流程建設(shè)的效率，而且便于后期的管理，使得高校流程建設(shè)進(jìn)入了一個(gè)新階段。

1 一站式平臺(tái)的概述

為了近一步提升高校對(duì)于師生的服務(wù)質(zhì)量，大多數(shù)高校已經(jīng)穩(wěn)步建設(shè)了網(wǎng)上一站式的服務(wù)平臺(tái)，該平臺(tái)與學(xué)生相關(guān)的業(yè)務(wù)系統(tǒng)包括教務(wù)系統(tǒng)、研究生管理系統(tǒng)、實(shí)驗(yàn)室安全教育與考試系統(tǒng)等；與教職工相關(guān)的包括oa辦公系統(tǒng)、教師入職手續(xù)辦理系統(tǒng)、科研管理系統(tǒng)等。對(duì)于上述第三方業(yè)務(wù)系統(tǒng)的集成，只需要提供相應(yīng)的接口，并完成對(duì)接工作即可。師生僅需一個(gè)用戶名與密碼，即可登入第三方系統(tǒng)，打破了數(shù)據(jù)壁壘，完成了各部門信息的互聯(lián)互通。

當(dāng)然，該平臺(tái)不僅僅是系統(tǒng)信息的簡單整合，也可方便師生進(jìn)行業(yè)務(wù)流程的辦理。例如郵箱申請(qǐng)，學(xué)生可直接線上申請(qǐng)，申辦信息按照相應(yīng)的流程配置，自動(dòng)轉(zhuǎn)發(fā)至審核部門。審核成功后，郵箱系統(tǒng)自動(dòng)為學(xué)生開啟郵箱。師生借助一站式平臺(tái)，避免了傳統(tǒng)的人工辦理程序的繁雜，減少了在部門間的奔波，實(shí)現(xiàn)了讓數(shù)據(jù)多跑路，師生少跑腿。

此外，一站式服務(wù)平臺(tái)不僅可以服務(wù)師生，也有利于管理者科學(xué)決策。由于其具有校內(nèi)流程的統(tǒng)計(jì)等功能，通過可視化界面的方式呈現(xiàn)數(shù)據(jù)，管理者對(duì)學(xué)校近期流程申請(qǐng)的積壓或完成情況一目了然，能夠更精準(zhǔn)的把握動(dòng)態(tài)數(shù)據(jù)，是實(shí)現(xiàn)科學(xué)化管理的有效途徑。

圖1：用印流程建設(shè)步驟圖

圖2：組件類型圖

圖3：用印流程前端設(shè)計(jì)圖

2 利用動(dòng)態(tài)表單實(shí)現(xiàn)流程的快速構(gòu)建

2.1 動(dòng)態(tài)表單的發(fā)展

值得注意的是，一站式平臺(tái)中的業(yè)務(wù)流程變動(dòng)頻率快。如果采用傳統(tǒng)的表單構(gòu)建方式，存在建設(shè)周期長、功能簡單、操作不靈活等缺點(diǎn)[1]。動(dòng)態(tài)表單技術(shù)在此基礎(chǔ)上應(yīng)運(yùn)而生，國外對(duì)于這一塊領(lǐng)域研究的較早，最具有象征意義的是微軟公司在office2003中引進(jìn)的新成員：InfoPath。InfoPath的底層由一個(gè)或者多個(gè)XML架構(gòu)的模板、控件及指令集集成[2]，擁有大量的常用控件。國內(nèi)也有諸多學(xué)者針對(duì)固定格式表單的可擴(kuò)展性差等問題，進(jìn)行了相關(guān)研究。張佳強(qiáng)[3]等人基于SSH框架，利用超文本分析技術(shù)獲得關(guān)鍵信息，完成了系統(tǒng)中表單的動(dòng)態(tài)定制；蔣贊[4]等人以Saas為載體，基于Json實(shí)現(xiàn)了表單、視圖的動(dòng)態(tài)功能可擴(kuò)展；談華宇[5]等人設(shè)計(jì)了基于Bootstrap框架的動(dòng)態(tài)表單在線設(shè)計(jì)器，通過置換型模板引擎，滿足了表單形式不斷變化的要求。下文將對(duì)Bootstrap框架進(jìn)行簡單闡述。

2.2 Bootstrap框架

Bootstrap來自于美國的Twitter公司，是一個(gè)基于HTML、CSS、JavaScript的前端開發(fā)框架。Bootstrap中包含的主要內(nèi)容有CSS、組件、JavaScript插件等：

（1）Bootstrap帶有以下主要特性：全局的CSS設(shè)置、HTML的基本元素、輔助類以及網(wǎng)格系統(tǒng)。

（2）Bootstrap中含有大量的Web組件，如輸入框、進(jìn)度條、下拉菜單等，利用這類組件，能夠迅速完成一個(gè)美觀大方、功能齊全的網(wǎng)站的搭建。

（3）Bootstrap自帶十余個(gè)自定義的插件，其中包括模態(tài)框、彈出框、警告框等等，可以給網(wǎng)站帶來更多互動(dòng)。由于大部分插件無需編寫代碼，既可自動(dòng)觸發(fā)，降低了使用難度，易用性高。

2.3 建設(shè)步驟

本文以揚(yáng)州大學(xué)為例，闡述基于Bootstrap框架的表單構(gòu)造器（formbuilder）在用印流程中的應(yīng)用。用印流程建設(shè)步驟如圖1所示，以下本文將詳細(xì)闡述四個(gè)步驟。

首先，完成前端表單頁面的設(shè)計(jì)，前端組件類型如圖2所示。

圖2中包括輸入框、選擇框等組件。在設(shè)計(jì)前端頁面時(shí)，將所需的組件拖拽至相應(yīng)的編輯區(qū)即可。設(shè)計(jì)頁面主要由四個(gè)部分組成，分別為申請(qǐng)人的基本信息、用印信息、審批信息和有待擴(kuò)展的信息。基本信息一般包括申請(qǐng)人的工號(hào)、姓名等，考慮到姓名的重名情況，本文采用工號(hào)作為唯一識(shí)別碼。用印信息代表的是具體的用印類型、時(shí)間、事由等。審批信息是部門領(lǐng)導(dǎo)和校領(lǐng)導(dǎo)的審批意見，分為同意、不同意和退回三種情況。待擴(kuò)展是指今后需要補(bǔ)充和擴(kuò)展的信息。用印流程的前端頁面設(shè)計(jì)如圖3所示。

其次，根據(jù)前端的頁面信息，建設(shè)對(duì)應(yīng)的流程模型。在建設(shè)模型的時(shí)候，需要掌握流程的基本走向。流程模型包括開始事件、任務(wù)、網(wǎng)關(guān)、邊界事件、結(jié)束事件等。構(gòu)建模型時(shí)，有三個(gè)注意點(diǎn)：首先，為完成模型的成功部署，需要在模型配置中將正確的表單地址填入；其次，每配置一個(gè)任務(wù)，都要將相應(yīng)的表單屬性進(jìn)行修改，不能遺漏；最后，對(duì)于流程完結(jié)、退回，需要配置短信提示，輸入的短信模式是不同的，注意區(qū)分。用印申請(qǐng)的流程模型如圖4所示。

再次，新建用印申請(qǐng)應(yīng)用，此應(yīng)用將會(huì)在服務(wù)大廳的最新發(fā)布中顯現(xiàn)。部分界面如圖5所示。

最后，完成該應(yīng)用的權(quán)限分配。對(duì)于每個(gè)流程，一般權(quán)限主要?jiǎng)澐譃椋航搪毠ぃ▽Ｈ谓處煛⑿姓藛T、教輔人員等）、學(xué)生（本科生、研究生）。因?yàn)榇藨?yīng)用主要針對(duì)教職工，所以將此應(yīng)用的權(quán)限分配給教職工。

通過以上四個(gè)步驟，本文完成了揚(yáng)州大學(xué)用印流程的建設(shè)。當(dāng)然，采用動(dòng)態(tài)表單的方式不僅能夠快速完成流程的構(gòu)建，對(duì)于后期的維護(hù)和管理工作有幾大優(yōu)勢(shì)：

（1）易于修改細(xì)節(jié)錯(cuò)誤。在構(gòu)建流程模型時(shí)，配置短信可能指向錯(cuò)誤：當(dāng)流程出現(xiàn)技術(shù)性問題時(shí)，短信應(yīng)發(fā)至學(xué)校的信息技術(shù)部門；而當(dāng)師生想要咨詢流程該如何填報(bào)時(shí)，短信應(yīng)發(fā)至具體負(fù)責(zé)該流程的部門。如果在配置短信時(shí)指向不明，則會(huì)給不相關(guān)部門帶來額外的工作量。此時(shí)該平臺(tái)的管理員只需在流程模型里做簡單的修改，輕松解決該問題。

圖4：用印流程模型圖

圖5：用印流程應(yīng)用的部分界面圖

（2）代碼可復(fù)用性強(qiáng)。動(dòng)態(tài)表單的配置具有反向生成表單界面的功能。在圖2中，將代碼復(fù)制粘貼至源代碼表示框內(nèi)，再點(diǎn)擊反向生成界面按鈕，即可快速生成表單界面。針對(duì)自身需求，對(duì)快速生成的界面進(jìn)行簡單調(diào)整，輕松完成第一步表單的設(shè)計(jì)，提高流程建設(shè)的效率。

（3）便于表單界面友好性的提升。在師生的使用過程中，根據(jù)師生要求，管理員可以針對(duì)他們的每一步操作，補(bǔ)充相應(yīng)的界面提示語等，使流程申請(qǐng)界面更加簡潔、直觀，易于師生使用。

（4）流程的可擴(kuò)展性強(qiáng)。后期管理員可修改表單界面展示的表單字段、調(diào)整字段在界面上的展示順序等。即使對(duì)于比較復(fù)雜的操作，整個(gè)流程需要增加審核部門而言，只需用拖拽組件的方式動(dòng)態(tài)修改前端設(shè)計(jì)頁面，然后在流程模型中添加任務(wù)，并進(jìn)行相應(yīng)的配置，即可完成流程的修改。

3 結(jié)束語

在高校信息化迅速發(fā)展的今天，對(duì)于業(yè)務(wù)流程的構(gòu)建，不僅要求建設(shè)周期短、效率高，更要求有利于后期的維護(hù)與管理。本文以揚(yáng)州大學(xué)為例，通過用印流程的簡單構(gòu)建，充分發(fā)揮了動(dòng)態(tài)表單技術(shù)與流程相結(jié)合的優(yōu)勢(shì)，易于操作，可擴(kuò)展性強(qiáng)。