基于B/S模式的可自助式計量委托單管理系統的設計與實現

賀建峰，杜珂珂，曹守軍，張俊，胡楊升，張昊，任俊香，寶媛媛

基于B/S模式的可自助式計量委托單管理系統的設計與實現

賀建峰，杜珂珂，曹守軍，張俊，胡楊升，張昊，任俊香，寶媛媛

在計量工作中，委托方及檢測方之間主要業務交流是通過委托單的方式來完成的，在過去的計量活動中，委托單基本是由計量檢測機構填寫和完成。針對委托單業務進行具體分析，設計并實現了一種基于B/S模式的可自助式計量委托單管理系統，可以讓委托方自主填寫委托單，檢測人員審核通過后即可生效。在保證委托單中信息準確的同時，也能夠大幅減少計量檢測機構的工作量，提高機構工作效率。以Oracle為數據庫支撐，基于SSH和ExtJS框架進行代碼開發，確保了系統的穩定和高效。

B/S模式；計量；委托單管理；可自助式； SSH框架；ExtJS框架

0 引言

過去，計量檢測機構在委托單的管理方面都采用了人工的方式進行管理。而現在，已有很多檢測機構從人工方式轉變為了基于C/S模式的信息化管理方式，這種轉變一定程度上提高了委托信息錄入的效率，減少了不必要的人員往來，降低了計量檢測的運行費用。

但傳統的C/S（客戶端/服務器模式）模式，需要針對不同的操作系統開發不同的客戶端，開發成本較高，兼容性不佳。客戶端程序需要安裝在每臺機器上，安裝工作量較大。系統升級時，每一臺機器需要重新安裝相應的客戶端，其維護和升級成本也非常高[1]。

而且普通的計量委托單管理系統是非自助式的，需要專人完成相關委托單生成操作，生成委托單前需要由檢測人員與委托方詳細溝通后才能進行，如果有大量的委托單需要生成，就會大大占用檢測機構的時間，影響計量檢測工作的效率。

本文設計實現的基于B/S模式（瀏覽器/服務器模式）的可自助式計量委托單管理系統，可以顯著改善這兩個問題。系統采用的B/S模式，只需在聯網環境下，打開瀏覽器輸入網址即可使用，有效地降低了系統的使用門檻和系統維護成本。可自助式設計讓委托單位可自行創建和管理委托業務，可以自行打印檢驗合格證書，大大減少了計量檢測機構人員的工作量，降低了計量檢測成本，提高了機構工作效率。

1 系統結構分析

本文介紹的基于B/S模式的可自助式計量委托單管理系統可以為計量檢測機構以及委托方提供一個基于Web的計量委托單管理平臺。該系統既可以作為計量檢測機構工作人員創建及管理委托業務的在線平臺，還可以讓委托方人員自行生成委托單供計量工作人員審核，自行管理已生效的器具檢測證書。

該系統包括兩個入口：計量機構入口和委托方入口。

計量機構入口包含四個模塊：委托單創建模塊（計量機構）、未完成委托單模塊（計量機構）、已完成委托單模塊（計量機構）、委托單位庫模塊，計量機構可以查看和管理不同委托方的所有委托單，如圖1所示：

圖1 計量機構入口包含模塊

委托方入口包含三個模塊：委托單創建模塊（委托方）、未完成委托單模塊（委托方）、已完成委托單模塊（委托方），委托方只能創建和管理與本單位相關的委托單，如圖2所示：

圖2 委托方入口包含模塊

2 系統主要功能設計

為了實現委托方的自助式填單功能，需要為不同的委托單位分配對應的賬號和密碼。委托方通過單位名稱和密碼即可以通過委托方入口進入，才可創建并填寫委托單。委托方的相關信息需要保存在委托單位信息庫中，方便計量人員新增、修改以及刪除單位信息，也方便在委托單中直接填寫委托方的基本信息。

在計量委托業務中，以委托單的生成最為復雜。委托單包含了計量業務的關鍵信息，其中有委托業務的基本信息：受檢單位、單位詳細地址、聯系人、聯系電話、機構代碼、經辦人、經辦人電話、接件人、受理部門、檢測科室、交通費、委托日期、區間日期、所屬州市等；還包含了要檢定的器具的信息，包括器具名稱、證書編號、規格型號、準確度、測量范圍、出廠編號、校驗人、校驗日期、校驗費用、檢定地點等。

為了保證信息的準確性和有效性，委托單的創建到完成需要經歷以下6個過程：

（1）創建：填寫委托單基本信息，添加檢測器具目錄

（2）錄入：計量人員檢測完畢后，將檢測信息錄入到委托單中，比如器具的準確度、測量范圍等

（3）校核：核對錄入信息的準確性和有效性

（4）批準：經過負責人批準后，可以生成檢驗合格證書

（5）收費：委托方須交付本委托單所產生的實際費用，才可獲得檢驗證書

（6）完成：委托方交費完畢后，該委托單完成并存檔，可以在已完成委托單中查詢及復制

具體流程圖，如圖3所示：

圖3 委托單的創建到完成

委托方可以自行創建委托單，只要通過計量機構的審批合格后，便可以開始正常的檢測流程。

一份委托單創建完成后，便處于未完成狀態，在該階段，檢測機構和委托方均可以在未完成委托單模塊中查看相應的委托單，不同的是檢測機構可以對未完成委托單實行錄入、校核、收費、存檔操作，而委托方只可以查看該委托單的完成進度。

當一系列檢測流程結束后，檢測人員可以完成相應的委托單，使其改變為完成狀態，之后該委托單便可以在已完成委托單模塊中被查詢到。檢測機構可以在此模塊查看已完成的委托業務，委托方則可以自行打印已取得的器具檢測合格證書。

對某個固定的企業，需要檢定的計量器具的數量、種類、周期是相對固定的，每年檢定員所做的檢定工作有很大部分是重復工作[2]。在已完成委托單模塊中設計的復制委托單功能，可以通過歷史或上次委托單形成的企業信息、委托單信息、計量器具信息、原始記錄及檢定證書信息，快速生產新的委托單和對應編號，重置已經檢驗過的器具證書狀態，滿足計量檢定的所有需要，減輕檢定人員的錄入工作量。

3 使用技術及功能實現

本系統使用了Java企業開發平臺中較為流行和穩定的開源集成框架SSH（Struts，Spring，Hibernate）作為系統主體結構支撐，Struts MVC進行流程控制，Spring進行業務流轉，Hibernate進行數據庫操作的封裝。SSH框架提供了統一的開發平臺，降低了開發多層應用程序的復雜性及開發成本，同時提供對集成應用程序的支持，具有良好的部署應用和添加目錄服務支持的功能，增強了系統的安全機制[3]。

Web頁面使用了一個以Ajax技術為基礎的富客戶端開發框架ExtJS進行創建。Ajax Web程序比傳統的Web程序具有更好的交互性，更快的響應速度[4]。ExtJS有著豐富的功能和UI組件，可以與用戶實現豐富的互動，可以兼容多平臺下的主流瀏覽器，方便使用者在不同瀏覽器下的開發。ExtJS還可以實現網頁應用的MVC分離構建，實現動態加載頁面文件，提高系統運行速度。采用MVC架構在軟件進行開發的時候只需要分別開發相應的Model、View、Controller即可。在維護時候一樣只需要針對相應的層來進行維護，操作非常簡便，成本也比較低[5]。

用戶在頁面上的操作請求經過SSH框架進行處理，調用指定的Java邏輯業務類，完成相應的功能。數據庫則使用了具備高穩定性和多功能性的Oracle進行處理，保證系統的安全、快速和有效性。

3.1 前端表現層實現

委托單業務涉及到大量的數據顯示和修改等操作，牽涉到復雜的界面構成。ExtJS可輕松構造出功能強大、界面美觀的網頁和客戶端程序，為解決多個數據表聯動查詢、更新顯示、分頁顯示以及樹狀結構顯示等復雜界面提供了快捷的途徑[6]。使用ExtJS框架的前提是引入其包含的JS文件和CSS主題文件，需要在首頁html源碼中添加如下代碼：

在ExtJS中，能夠定義各種組件類，如Window、Grid、Form、Button等，在需要的時候可動態的生成相應的組件實例。例如在委托單位庫中，當需要新增一條委托單位的信息時，可以點擊新增按鈕，這時期望彈出一個包含特定表單的窗口供用戶錄入信息，可以用如下命令動態生成需要的組件：

Ext.create(‘Ext.window.Window’，{

title:”委托單位信息新增”，

items:[{

xtype:”form”，

items:[ /*需要填寫的字段*/]

}]

});

在數據的保存和刪除時，經常會需要和后臺動態的交互數據，ExtJS中提供了一種比JS中的XMLHttpRequest對象更為方便易用的Ext.Ajax對象，它提供了靈活的配置參數供開發者使用，以下是未完成委托單中一個利用Json數據格式向后臺傳送委托單ID的例子：

Ext.Ajax.request({

url:‘weiWanCWTD_WanChengWTD’，

params:{wtdid:wtdid}，

success:function(){/*成功后操作*/}，

faliure:function(){/*失敗后操作*/}

});

由于系統不只在局域網內部使用，工作人員還可能在外網使用以處理一些特殊情況。在這時，系統的預加載速度就顯得十分重要。雖然ExtJS提供了豐富的前端表現組件，但卻造成了其預加載文件體積過大，在網速不理想的狀態下加載速度較慢，導致第一次接入系統時等待時間過長。為此，采取了兩種方法來減少系統加載時間。

首先，對編寫的前端代碼進行了一系列精簡處理，例如部署前刪除大量注釋、去除無用的空格及字符等操作。其次，利用ExtJS官方提供的工具對程序進行預編譯，篩除掉沒有用到的部分組件及特性代碼，一定程度減小了庫文件的體積。

經過這兩種方式的處理，解決了掛載文件過大的問題，外網加載體驗得到一定提高。

B/S應用的主要特性便是隨時隨地的通過瀏覽器即可使用，但是市面上的瀏覽器種類繁多，每種瀏覽器還有多個版本，不同種類的不同版本對于相同JS代碼的解析存在差別，所以相同的代碼展現在用戶面前的實際內容不盡相同。ExtJS為瀏覽器的兼容性做了優化，但仍不能保證在一些低版本的瀏覽器上實現全部效果。

為此，在前端代碼層面，大量選擇通用的函數及方法對瀏覽器特性進行調用，同一功能通過判定瀏覽器種類做不同的代碼實現，確保對大部分瀏覽器的良好兼容性。在用戶方面，為其推薦并安裝符合通用解析標準的瀏覽器，確保用戶得到完整的系統功能體驗。

3.2 后端業務邏輯層實現

SSH框架使開發邏輯變得更清晰，產品耦合性降低，能更多的應用面向對象的思想，提高了系統開發的效率。

本系統采用B/S模式的三層架構，即表示層、業務邏輯層、數據層。Structs中的ActionForm對象接收并封裝表示層的請求參數，然后通過ActionServlet轉發給相應的Action，Action根據請求參數調用模型的業務邏輯方法處理請求，并將處理結果返回給前端頁面。

以保存委托單功能的實現為例，說明在SSH框架下，一項功能是怎樣從請求到完成的。工作人員在新建委托單界面填寫完信息后，點擊“保存委托單”按鈕進行保存，點擊該按鈕后，將連接至Structs配置中尋找對應的Action對象，這里Structs中的Action交予Spring管理，所以Structs中配置如下：

value="spring">

class="xinJianWTDAction"

method="{1}">

Sping在配置文件中尋找到該Action對應的bean配置項，實例化并對其進行依賴注入，application_action.xml中配置如下：

class="jlgl.Action.weituodan.XinJianWTD

Action" scope="prototype">

ref="changYongService"/>

實例化后的Action對象根據用戶請求中包含的參數尋找到合適的業務處理方法，進行邏輯處理并返回結果。邏輯處理部分代碼如下：

public void saveORupdateWeiTuoDan() {

// 返回結果字段

private String jg;

// 委托單重要字段

private String wtdid;

private String wtdbh;

/*邏輯處理代碼*/

jg = changYongService.save_one(wtdxxb);

this.shuChu_String(jg);

}

業務邏輯中調用的changYongService實例是通過依賴注入實現的。其中的save_one()方法，依賴于持久層的Hibernate框架，利用Hibernate的ORM(Object Relational Mapping)技術，可以將關系數據庫中表的數據映射為對象，保證源碼的簡練和完全面向對象的風格。

在業務邏輯中，需要對處理不同委托單狀態的人員進行權限分配并嚴格控制。各個檢測科室與器具的不同種類相對應，本檢測科室只能受理與本科室相關的器具委托單的檢測業務，而中心辦公室可以查看所有的委托單受理情況，并進行核檢及批準等操作，但不可進行新建委托單操作。

為了對不同科室間的權限范圍進行區分及功能限制，在數據庫為不同科室添加了相應表征字段，在登錄后，后端程序將科室及人員信息保存到系統Session中，并返回到前端頁面，前端依據這些信息進行相應的功能限制，比如鎖定某些按鈕及文本框，隱藏部分組件等一系列操作。后端代碼隨時進行權限監控，一旦有越權請求，將停止執行操作并發出警告。

通過以上措施，成功的解決了業務邏輯中的權限分配及功能劃分問題。

3.3 特殊功能的實現

委托單中的器具可在線創建對應的證書模版，工作人員可以修改此模版，并手動填寫相關器具檢測信息。證書模版文件是存儲在服務器上的Excel表格文件，所以系統中就需要實現Excel文件的在線編輯功能。

由于B/S模式的特殊性，瀏覽器無法直接調用用戶系統中的Excel編輯軟件。如果要調用本地的Excel編輯軟件，必須為瀏覽器安裝相應的插件。經過綜合比對，最終選取了PageOffice標準版for Java這一插件實現這項功能。

首先PageOffice能支持WPS和微軟Office兩種編輯工具，覆蓋面廣；其次支持SSH開發架構及MVC模式，服務器端無需安裝微軟Office，兼容性強；其對于Java支持豐富，簡化了接口，高效快捷；最后，在線編輯操作功能豐富，方便用戶使用操作。綜合這些特點，選用此插件完全滿足了系統的需求，且Excel編輯功能運行良好。

在計量器具、標準裝置以及配套設備的規格參數中，存在有一些專用字符需要填寫及顯示。這些字符不存在于操作系統的現有字庫內，需要人為的造字并添加進自定義字庫。

最終采用了微軟的專用字符編輯程序生成了自造字庫，包含常用化學符號、上標帶符號數、下標帶符號數、1～10等級符號、上標0～99數字、小寫26字母上下標、特殊字符累計共266種字符，并制作了一鍵安裝工具方便系統用戶安裝及使用。

在特殊字符的插入功能上，利用ExtJS豐富的組件功能設計并實現了菜單式插入懸浮窗。用戶需要插入專用字符時，首先將光標放置到文本域內，然后點擊專用字符插入按鈕，即彈出一個包含所有專用字符的懸浮窗，用戶可以點擊相應字符進行插入。

4 總結

本文提出了一種基于B/S模式的可自助式計量委托單管理系統。B/S模式可以有效降低使用門檻和維護成本，可自助式設計則大大減少了計量檢測機構人員的工作量，提高了計量委托業務完成的效率，降低了檢測成本。該系統代碼在SSH和ExtJS框架的基礎上進行構建，數據庫則采用了穩定性和高性能兼具的Oracle，做了大量的兼容性處理和功能改進，充分保證了系統運行的安全性和有效性。但是，仍然尚有一些問題需要進一步深入研究，如ExtJS框架加載速度仍需提升、部分計量特殊字符顯示不全等問題。

[1] 侯淑英.B/S模式和C/S模式優勢比較[J].沈陽教育學院學報,2007,02:98-100.

[2] 劉勇.紅河州計量檢測業務監管公共服務平臺設計及應用[J].計量與測試技術,2014,03:101-103.

[3] 趙佩佩.基于SSH的電子公文傳輸系統的設計與實現[D].北京郵電大學,2010.

[4] 任遠博.基于Ajax技術的計量管理系統設計與實現[D].武漢理工大學,2012.

[5] 朱存華.商品產品質量計量檢測信息在線管理系統的設計與實現[D].電子科技大學,2013.

[6] 張軍鋒,汪健雄,賈新茹.基于ExtJS框架的數據維護系統設計與實現[J].鐵路計算機應用,2010,01:27-3.

The Design and Implement of Self-serviceable System for Management of Metrology Orders Based on B/S Mode

He Jianfeng, Du Keke, Cao Shoujun, Zhang Jun, Hu Yangsheng, Zhang Hao, Ren Junxiang, Bao Yuanyuan
(School of Information Engineering and Automation, Kunming University of Science and Technology,Kunming 650500, China)

In metrology work, main communication between clients and metrology agency is accomplished by service orders, in the past metrology test activities, most of the orders were filled and completed by metrology agency. For the orders launched by clients, the paper designed and implemented a self-serviceable system based on B/S to automatically analyze and transfer the orders to the related department to deal with, which the metrological inspectors can check out and approve the orders. The designed system can guarantee the order accuracy and efficiency and reduce the workload of metrology agencies as well. In addition, the system is developed based on Oracle database and SSH and ExtJS technologies, which ensures the stability and efficiency of the system.

B/S Mode; Metrology; Service Order Management; Self-Serviceable; SSH Framework; ExtJS Framework

TP311

A

2014.11.16）

1007-757X(2015)01-0004-04

國家自然科學基金（No.11265007）

賀建峰（1965-），男，云南昆明，昆明理工大學，信息工程與自動化學院，教授，博士，研究方向：信息化管理與建設，昆明，650500

杜珂珂（1988-），男，山東濟寧，昆明理工大學，信息工程與自動化學院，碩士研究生，研究方向：信息管理系統建設，昆明，650500

曹守軍（1988-），男，山東日照，昆明理工大學，信息工程與自動化學院，碩士研究生，研究方向：信息化技術，昆明，650500

張 俊（1990-），男，云南昆明，昆明理工大學，信息工程與自動化學院，碩士研究生，研究方向：軟件工程，昆明，650500

胡楊升（1993-），男，山西運城，昆明理工大學，信息工程與自動化學院，碩士研究生，研究方向：生物醫學工程，昆明，650500

張 昊（1990-），男，江蘇南通，昆明理工大學，信息工程與自動化學院，碩士研究生，研究方向：Web開發，昆明，650500

任俊香（1989-），女，山東菏澤，昆明理工大學，信息工程與自動化學院，碩士研究生，研究方向：數據挖掘，昆明，650500

寶媛媛（1990-），女，云南騰沖，昆明理工大學，信息工程與自動化學院，碩士研究生，研究方向：信息化建設，昆明，650500