面向多平臺的經(jīng)濟簽證管理系統(tǒng)的設(shè)計與實現(xiàn)?

劉卓炫 劉賢梅 田 楓 趙 婭

面向多平臺的經(jīng)濟簽證管理系統(tǒng)的設(shè)計與實現(xiàn)?

劉卓炫 劉賢梅 田 楓 趙 婭

（東北石油大學(xué)計算機與信息技術(shù)學(xué)院 大慶 163318）

針對經(jīng)濟簽證的傳統(tǒng)文檔管理方式效率低、成本高的問題以及企業(yè)對經(jīng)濟簽證的信息化管理需求，結(jié)合移動端和PC端同時使用的用戶需要，設(shè)計并開發(fā)了面向多平臺的經(jīng)濟簽證管理系統(tǒng)。論文描述了系統(tǒng)設(shè)計情況和整體方案，總結(jié)了系統(tǒng)中聯(lián)想提示、基于模板的word導(dǎo)出和基于NPOI插件的Excel導(dǎo)出等關(guān)鍵技術(shù)。該系統(tǒng)有利于提高經(jīng)濟簽證管理效率，降低管理成本和優(yōu)化經(jīng)濟簽證辦理流程，具有良好的應(yīng)用價值和實際意義。

多平臺；經(jīng)濟簽證；信息化管理

AbstractAimed at the problems that traditional paper document management for economic visa has the poor efficiency and high cost，and demands for the informatization management of economic visa from enterprises，the management system for economic visa on multiplatform is designed and developed with considering the user demand to support the simultaneous use of PC and mobile devices.The design and whole scheme of system is described and the key technologies such as prompting relevant content，exporting the word document based on template and exporting the excel workbook based on NPOIand so on are summed up in this paper.The system will help improve the efficiency of economic visa management，reduce management costs and optimize the process of econom?ic visa processing and it has good application value and practical significance.

Key Wordsmultiplatform，economic visa，informatization management

Class NumberTP311

1 引言

經(jīng)濟簽證是把工程量清單外增加的必要工程量和合理開銷通過經(jīng)濟簽證變?yōu)榭蛇M入工程決算計量的工程量的依據(jù)和過程。當(dāng)現(xiàn)場工程量發(fā)生合理變更時，經(jīng)濟簽證由施工單位申報，需寫明簽證原因、內(nèi)容、具體工程量等，由業(yè)主組織施工單位、監(jiān)理單位、建設(shè)單位參加現(xiàn)場核定。

隨著互聯(lián)網(wǎng)與信息技術(shù)的發(fā)展，經(jīng)濟簽證的信息化管理方式憑借其管理效率高、管理成本低、信息安全性和可靠性強等特點逐漸取代了傳統(tǒng)文檔管理方式，成為經(jīng)濟簽證管理的必然選擇。智能手機的出現(xiàn)進一步改善和優(yōu)化了經(jīng)濟簽證的信息化管理方式，因此基于對經(jīng)濟簽證信息化管理的需要，設(shè)計并開發(fā)了面向PC機、手機和平板等多平臺的經(jīng)濟簽證管理系統(tǒng)。

2 系統(tǒng)設(shè)計

經(jīng)濟簽證管理系統(tǒng)采用瀏覽器（Browser）、WEB服務(wù)器、數(shù)據(jù)庫系統(tǒng)（DBMS）構(gòu)成的BWD體系結(jié)構(gòu)［1］，是一個多層的B/S模式［2］，如圖1所示。

圖1 B/S系統(tǒng)運行方式

整個系統(tǒng)邏輯架構(gòu)分為四層：數(shù)據(jù)層、業(yè)務(wù)邏輯層、表現(xiàn)層和用戶層，系統(tǒng)邏輯架構(gòu)如圖2所示。

圖2 系統(tǒng)邏輯架構(gòu)圖

3 整體方案

面向多平臺的經(jīng)濟簽證管理系統(tǒng)基于ASP.NET開發(fā)技術(shù)，采用Oracle10g數(shù)據(jù)庫，以C#作為主要開發(fā)語言。系統(tǒng)基于B/S模式構(gòu)建，針對傳統(tǒng)PC端與移動端瀏覽器在顯示和功能上的區(qū)別，結(jié)合現(xiàn)場多使用移動端進行現(xiàn)場簽證填報和批量上傳照片以及多使用PC端進行簽證信息管理的工作特點，提供自適應(yīng)樣式來支持PC端和移動端頁面的顯示，方便用戶在多平臺上對系統(tǒng)的使用。

4 關(guān)鍵技術(shù)

4.1 識別瀏覽器運行平臺

在識別瀏覽器運行平臺［3］方面，主要使用了HttpBrowserCapabilities類和HttpCapabilitiesBase類。利用HttpBrowserCapabilities類能夠使服務(wù)器通過在客戶端運行的瀏覽器獲取相關(guān)功能信息，包括瀏覽器類型、瀏覽器版本號以及客戶端是否是基于Win32的計算機等。而HttpCapabilitiesBase類則能夠提供對客戶端瀏覽器功能的詳細(xì)信息的訪問，其中可利用IsMobileDevice屬性獲取一個值來指示瀏覽器運行平臺是否為已識別移動設(shè)備。代碼如下。

System.Web.HttpBrowserCapabilities myBrowserCaps=Request.Browser；int isMobile=（（System.Web.Configuration.HttpCapabilitiesBase）myBrowserCaps）.IsMobileDevice？1：0；

4.2 批量圖片上傳

批量圖片上傳原理即循環(huán)執(zhí)行單張圖片上傳，直至所選批量圖片全部上傳完成［4］。首先，利用HttpContext.Current.Request.Files選取上傳的批量圖片并賦值給HttpFileCollection類對象聲明的數(shù)組變量files，再循環(huán)取出數(shù)組中每個元素的值并利用HttpContext.Current.Server.MapPath（“../”）獲得對應(yīng)的圖片路徑，最后利用SaveAs（存儲路徑）方法對圖片進行存儲。批量圖片存儲時為了提高交互性，利用進度條來顯示當(dāng)前上傳進度，代碼如下。

var percent=（loaded/total*100）.toFixed（2）+‘%’；//計算圖片當(dāng)前已上傳的進度。

eleProgress.children （‘.uploadify-progress-bar’）.css（‘width’，percent）；//更新進度條。

4.3 聯(lián)想提示

在錄入時根據(jù)用戶輸入內(nèi)容給予相關(guān)提示輔助錄入已成為一種必然趨勢。AJAX技術(shù)［5］利用XMLHttpRequset為JavaScript腳本提供了在頁面之內(nèi)與服務(wù)器通信的手段［6］，同時DOM和XML為腳本語言提供了交互和存儲的新渠道［7］，使得AJAX異步式交互技術(shù)成為實現(xiàn)聯(lián)想提示功能的最佳選擇。

在ASP.NET中，對AJAX相關(guān)技術(shù)進行了封裝［8］。本系統(tǒng)中實現(xiàn)聯(lián)想提示功能時主要使用了封裝的AjaxControlToolkit控件，具體實現(xiàn)方法如下。

1）添加腳本控制域

＜ajaxToolkit： ToolkitScriptManager＞... ＜/ajax?Toolkit：ToolkitScriptManager＞。

2）在腳本控制域中添加Textbox和AutoCom?pleteExtender控件［9］，并設(shè)置相關(guān)必要參數(shù)。Tar?getControl ID是必須指定的屬性，它指出Extender應(yīng)該實時監(jiān)聽哪個控件，把目標(biāo)控件的ID賦給它即可；ServicePath指出要使用的Web服務(wù)的路徑，這里指的是asmx文件的路徑；ServiceMethod指定返回數(shù)據(jù)的函數(shù)，填入目標(biāo)函數(shù)名即可；Minimum?PrefixLength是最少需要錄入的長度，當(dāng)輸入的內(nèi)容長度滿足此條件時，監(jiān)聽才會調(diào)用指定服務(wù)獲取數(shù)據(jù)并彈出下拉列表；Completion Interval屬性是指用戶錄入后多長時間，程序去調(diào)用服務(wù)來獲取數(shù)據(jù)，單位是毫秒；EnableCaching屬性用來指定是否允許緩存，若設(shè)為true，表示允許緩存，在多數(shù)情況下，它可以減少數(shù)據(jù)訪問次數(shù)，但在數(shù)據(jù)源經(jīng)常變化的情況下，它會向用戶提供過時的錯誤信息；CompletionSetCount屬性指定一次應(yīng)該返回多少項；FirstRowSelected屬性表示是否默認(rèn)選中第一項。

3）在完成AutoCompleteExtender控件的參數(shù)設(shè)置后，按照ServicePath屬性的對應(yīng)路徑新建后綴為.asmx的WebService服務(wù)文件并將文件中的［Sys?tem.Web.Script.Services.ScriptService］語 句 解 除 注釋，從而允許使用ASP.NET AJAX從腳本中調(diào)用此Web服務(wù)。

4）在WebService服務(wù)文件中，撰寫控件Ser?viceMethod屬性指定的帶返回值的方法；方法中的prefixText是獲取到的用戶當(dāng)前輸入的內(nèi)容，count是CompletionSetCount屬性指定的返回的項的數(shù)目。

在完成屬性設(shè)置和方法撰寫后便可實現(xiàn)聯(lián)想提示功能，效果如圖3所示。

圖3 聯(lián)想提示效果

4.4 基于模板的W ord導(dǎo)出

常見的Word導(dǎo)出實現(xiàn)方法有兩種，一種是利用預(yù)先創(chuàng)建的。dot格式的Word模板來實現(xiàn)Word導(dǎo)出［10］，另一種是直接創(chuàng)建Word文件并進行相應(yīng)讀寫和導(dǎo)出操作［11］。由于系統(tǒng)中的經(jīng)濟簽證單具有規(guī)范格式，故本系統(tǒng)采用第一種方法，利用模板來實現(xiàn)Word文件導(dǎo)出功能，該功能實現(xiàn)效果如圖4所示。

圖4 經(jīng)濟簽證Word導(dǎo)出樣式

基于模板的Word導(dǎo)出實現(xiàn)方法如下：

1）制作.dot格式的Word模板并在需填寫內(nèi)容處添加標(biāo)簽。

2）利用 Application.Documents.Open（ref文件名，ref oMissing，ref oMissing，ref oMissing，...）方法打開模板，并通過語句doc.Bookmarks［“標(biāo)簽名”］.Range.Text=label.text.toString（）向模板中對應(yīng)標(biāo)簽處添加所賦內(nèi)容。

3）利用Word.Tables tabs1=doc.Tables獲取模板中的全部table，并向選定的Table中插入一行：dt_Word.Rows.Add（ref oMissing）。

4）在選定的行中利用 dt_Word.Cell（row Idex，1）.Select（）插入并選擇第一個單元格，利用Align?men屬性設(shè)置第一個單元格中內(nèi)容位置。

5）向被選定單元格插入圖片：App.Selection.InlineShapes.AddPicture（basePicdir+pics［i］，ref oMissing，ref oMissing，ref oMissing），并設(shè)置圖片寬度 App.ActiveDocument.InlineShapes［1+i］.Width 和高 度 App.ActiveDocument.InlineShapes［1+i］.Height。

6）用SaveAs（）方法將模板另存為.doc文件，并通 過 Response.AddHeader（"Content-Disposition"，"attachment； filename="+ Server.UrlEncode （fi.Name））添加頭信息通知瀏覽器激活文件下載對話框執(zhí)行下載而非打開文件，另外將Response.Con?tentType屬性設(shè)置為application/octet-stream來指定服務(wù)器響應(yīng)的HTTP內(nèi)容類型為字節(jié)流。

7）利用 Response.W riteFile（fi.FullName）輸出寫好的word文件。

4.5 基于NPOI插件的Excel導(dǎo)出

常見的Excel導(dǎo)出實現(xiàn)方法為利用Excel模板實現(xiàn)導(dǎo)出［12］或直接創(chuàng)建Excel文件進行讀寫和導(dǎo)出操作，本系統(tǒng)采用第二種方法實現(xiàn)Excel導(dǎo)出。由于官方提供的Excel文檔存取方法效率低、兼容性差［13］且基本不支持服務(wù)器端的處理［14］，因此借助了第三方NPOI插件來方便Excel操作。

NPOI為POI項目的.NET版本，是一套用Java寫成的開源的用于讀寫Excel、Word等微軟OLE組件文檔［15］的第三方類庫，能夠幫助Webform的開發(fā)者在沒有安裝Office的情況下讀寫Excel格式的文件，目前支持到Excel2007。NPOI對Excel進行讀寫的主要方法是按照Excel組織文件的格式規(guī)則和方法通過文件流方式生成Excel文件，避免了通過OLE方式激活龐大的Excel進程，大量節(jié)省了服務(wù)器資源，提高了服務(wù)器生成Excel文件的性能［16］。

基于NPOI插件的Excel導(dǎo)出實現(xiàn)方法如下。

1）NPOI包括6個常用子類庫，分別為基礎(chǔ)輔助庫 NPOI.Util、OLE 格式讀寫庫 NPOI.POIFS、Mi?crosoft Drawing格式讀寫庫NPOI.DDF、Excel公式計算庫 NPOI.SS、OLE的 Summary Information和Document Summary Information屬性讀寫庫NPOI.HPSF和Excel BIFF格式讀寫庫NPOI.HSSF，開發(fā)人員可按需加載相應(yīng)類庫。系統(tǒng)中主要使用了NPOI.Util、NPOI.SS、NPOI.POIFS和NPOI.HSSF。

2） 利 用 HSSFWorkbook hssfworkbook=new HSSFWorkbook（）創(chuàng)建工作薄。

3）創(chuàng)建名為sheetName的工作表：ISheet sheet=hssfworkbook.CreateSheet（"sheetName"）。

4）IRow row0=sheet.CreateRow（行序號）創(chuàng)建行，工作表中的行序號從0開始。

5）ICell cell0=row0.CreateCell（單元格序號）創(chuàng)建指定行上的單元格，單元格序號從0開始，并利用cell0.SetCellValue（“單元格內(nèi)容”）對指定單元格賦值。

6）利用sheet.GetRow（行序號）.HeightInPoints設(shè)置指定行行高，利用sheet.SetColumnWidth（列序號，數(shù)值）設(shè)置指定列列寬。

7）創(chuàng)建單元格樣式：ICellStyle style=hssfwork?book.CreateCellStyle（），利用 Alignment和 Vertica?lAlignment屬性設(shè)置水平和豎直方向的對齊方式，利用style.SetFont（字體樣式）設(shè)置字體樣式，Bor?derTop、BorderBottom、BorderLeft和 BorderRight用于設(shè)置上下左右邊框、DataFormat設(shè)置數(shù)據(jù)格式。

8）IFont font_zd=hssfworkbook.CreateFont（）創(chuàng)建字體樣式，F(xiàn)ontHeightInPoints屬性用于設(shè)置字號，F(xiàn)ontName設(shè)置字體，Color設(shè)置顏色，Boldweight設(shè)置加粗。

9）設(shè)置合并a～b行的x～y列的單元格：sheet.AddMergedRegion（new CellRangeAddress（a，b，x，y））。

10）先實例化MemoryStream類來初始化數(shù)組用于封裝以無符號字節(jié)數(shù)組形式存儲的數(shù)據(jù)，再調(diào)用工作薄對象的W rite（MemoryStream類變量）方法將數(shù)據(jù)從緩存區(qū)寫入MemoryStream流對象。

11）添加Http頭信息通知瀏覽器激活文件下載對話框執(zhí)行下載而非打開文件，設(shè)置顯示的文件名和使用UTF-8編碼方式：Response.AddHeader（“Content-Disposition”，string.Format（“attachment；filename=｛0｝.xls”，HttpUtility.UrlEncode（“工作薄名”，System.Text.Encoding.UTF8）））。

12）利用 Response.BinaryW rite（ms.ToArray（））將MemoryStream流對象中數(shù)據(jù)以二進制流形式輸出到瀏覽器。

以上NPOI操作均為常用基本操作，NPOI中還提供了凍結(jié)行列、函數(shù)計算以及繪圖等多種操作，可根據(jù)需要進行使用。

5 結(jié)語

面向多平臺的經(jīng)濟簽證管理系統(tǒng)綜合利用ASP.NET技術(shù)、Web客戶端技術(shù)以及數(shù)據(jù)庫技術(shù)等滿足了用戶現(xiàn)場通過移動端填報簽證和批量上傳現(xiàn)場照片，同時利用PC端進行簽證管理與導(dǎo)出工作的需求，優(yōu)化了傳統(tǒng)簽證辦理流程，提高了簽證管理效率，降低了簽證管理成本，實現(xiàn)了經(jīng)濟簽證的自動化、信息化管理，具有良好的應(yīng)用和推廣前景。

［1］張學(xué)軍，包亞萍.基于BWD模式的電子商務(wù)系統(tǒng)的研究與設(shè)計［J］.計算機應(yīng)用研究，2003（5）：99-101.

ZHANG Xuejun，BAO Yaping.The Research and Design of Electronic Commerce Based on BWD Mode［J］.Appli?cation Research of Computers，2003（5）：99-101.

［2］蘭麗娜，文福安，王建坤.基于B/S多層結(jié)構(gòu)的個性化網(wǎng)絡(luò)教學(xué)系統(tǒng)設(shè)計［J］.吉林大學(xué)學(xué)報（信息科學(xué)版），2007，25（3）：308-313.

LAN Lina，WEN Fuan，WANG Jiankun.Design of Individ?uality E-Learning System Based on B/S Multi-Layer Ar?chitecture［J］.Journal of Jilin University（Information Sci?ence Edition），2007，25（3）：308-313.

［3］李周輝，黃燕群，唐屹.瀏覽器識別研究［J］.信息網(wǎng)絡(luò)安全，2016（3）：34-39.

LI Zhouhui，HUANG Yanqun，TANG Yi.Research on Browsers Recognition［J］.Netinfo Security，2016（3）：34-39.

［4］顧梅華.基于C#.NET的文件傳輸關(guān)鍵技術(shù)研究與系統(tǒng)實現(xiàn)［D］.成都：電子科技大學(xué)，2013：47-49.

GU Meihua.File Transmission Key Technology Research and The System Realization Based on C#.NET［D］.Cheng?du：University of Electronic Science and Technology of China，2013：47-49.

［5］賀濤，繆淮扣，錢忠勝.基于Ajax技術(shù)的Web應(yīng)用的建模與測試用例生成［J］.計算機科學(xué)，2014，41（8）：219-223.

HE Tao，MIAO Huaikou，QIAN Zhongsheng.Modeling and Test Case Generation for Ajax-based WA［J］.Comput?er Science，2014，41（8）：219-223.

［6］黃志春.基于AJAX技術(shù)的環(huán)保監(jiān)控系統(tǒng)［D］.杭州：浙江大學(xué)，2006：6-22.

HUANG Zhichun.The Environmental Monitor System based on AJAX［D］.Hangzhou：Zhejiang University，2006：6-22.

［7］楊俊峰，黎建輝，楊風(fēng)雷.深層網(wǎng)站Ajax頁面數(shù)據(jù)采集研 究 綜 述［J］.計 算 機 應(yīng) 用 研 究 ，2013，30（6）：1606-1610.

YANG Junfeng，LI Jianhui，YANG Fenglei.Survey on re?search of data collection from supporting Ajax technology deep Websites［J］.Application Research of Computers，2013，30（6）：1606-1610.

［8］仰燕蘭，金曉雪，葉樺.ASP.NET AJAX框架研究及其在Web開發(fā)中的應(yīng)用［J］.計算機應(yīng)用與軟件，2011，28（6）：195-198.

YANG Yanlan，JIN Xiaoxue，YE Hua.On ASP.NET AJAX Framework and its Application in Web Development［J］.Computer Applications and Software，2011，28（6）：195-198.

［9］張正做，龔青.AJAX及其在科研咨詢服務(wù)系統(tǒng)中的應(yīng)用［J］.微型電腦應(yīng)用，2012，28（3）：59-64.

ZHANG Zhengzuo，GONG Qing.AJAX and its Applica?tion in Scientific Research and Consulting Service System［J］.Microcomputer Applications，2012，28（3）：59-64.

［10］孫靜靜.基于標(biāo)簽技術(shù)的Word智能報表的研究［D］.青島：中國海洋大學(xué)，2013：7-26.

SUN Jingjing.Research on Intelligent Word Report Based on Tag［D］.Qingdao：Ocean University of China，2013：7-26.

［11］葉明，張諍.基于C#.NET的Word報告生成功能開發(fā)［J］.計算機工程與應(yīng)用，2008，44（9）：104-106.

YE Ming，ZHANG Zheng.Development of Word Report

Design and Im p lementation of M anagement System for Econom ic Visa on M ulti Platform

LIU Zhuoxuan LIU Xianmei TIAN Feng ZHAO Ya
（School of Computer and Information Technology，Northeast Petroleum University，Daqing 163318）

TP311

10.3969/j.issn.1672-9722.2017.09.027

2017年3月10日，

2017年4月17日

國家自然科學(xué)基金項目（編號：61502094）；黑龍江省自然科學(xué)基金項目（編號：F2016002）；黑龍江省教育科學(xué)規(guī)劃重點課題（編號：GJB1215019）資助。

劉卓炫，男，碩士研究生，研究方向：虛擬現(xiàn)實。劉賢梅，女，教授，碩士生導(dǎo)師，研究方向：虛擬現(xiàn)實。田楓，男，副教授，博士，碩士生導(dǎo)師，研究方向：多媒體計算。趙婭，女，副教授，碩士，研究方向：虛擬現(xiàn)實。