APP下载

面向多平台的经济签证管理系统的设计与实现∗

2017-10-16刘卓炫刘贤梅

计算机与数字工程 2017年9期
关键词:控件单元格浏览器

刘卓炫 刘贤梅 田 枫 赵 娅

面向多平台的经济签证管理系统的设计与实现∗

刘卓炫 刘贤梅 田 枫 赵 娅

(东北石油大学计算机与信息技术学院 大庆 163318)

针对经济签证的传统文档管理方式效率低、成本高的问题以及企业对经济签证的信息化管理需求,结合移动端和PC端同时使用的用户需要,设计并开发了面向多平台的经济签证管理系统。论文描述了系统设计情况和整体方案,总结了系统中联想提示、基于模板的word导出和基于NPOI插件的Excel导出等关键技术。该系统有利于提高经济签证管理效率,降低管理成本和优化经济签证办理流程,具有良好的应用价值和实际意义。

多平台;经济签证;信息化管理

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 引言

经济签证是把工程量清单外增加的必要工程量和合理开销通过经济签证变为可进入工程决算计量的工程量的依据和过程。当现场工程量发生合理变更时,经济签证由施工单位申报,需写明签证原因、内容、具体工程量等,由业主组织施工单位、监理单位、建设单位参加现场核定。

随着互联网与信息技术的发展,经济签证的信息化管理方式凭借其管理效率高、管理成本低、信息安全性和可靠性强等特点逐渐取代了传统文档管理方式,成为经济签证管理的必然选择。智能手机的出现进一步改善和优化了经济签证的信息化管理方式,因此基于对经济签证信息化管理的需要,设计并开发了面向PC机、手机和平板等多平台的经济签证管理系统。

2 系统设计

经济签证管理系统采用浏览器(Browser)、WEB服务器、数据库系统(DBMS)构成的BWD体系结构[1],是一个多层的B/S模式[2],如图1所示。

图1 B/S系统运行方式

整个系统逻辑架构分为四层:数据层、业务逻辑层、表现层和用户层,系统逻辑架构如图2所示。

图2 系统逻辑架构图

3 整体方案

面向多平台的经济签证管理系统基于ASP.NET开发技术,采用Oracle10g数据库,以C#作为主要开发语言。系统基于B/S模式构建,针对传统PC端与移动端浏览器在显示和功能上的区别,结合现场多使用移动端进行现场签证填报和批量上传照片以及多使用PC端进行签证信息管理的工作特点,提供自适应样式来支持PC端和移动端页面的显示,方便用户在多平台上对系统的使用。

4 关键技术

4.1 识别浏览器运行平台

在识别浏览器运行平台[3]方面,主要使用了HttpBrowserCapabilities类和HttpCapabilitiesBase类。利用HttpBrowserCapabilities类能够使服务器通过在客户端运行的浏览器获取相关功能信息,包括浏览器类型、浏览器版本号以及客户端是否是基于Win32的计算机等。而HttpCapabilitiesBase类则能够提供对客户端浏览器功能的详细信息的访问,其中可利用IsMobileDevice属性获取一个值来指示浏览器运行平台是否为已识别移动设备。代码如下。

System.Web.HttpBrowserCapabilities myBrowserCaps=Request.Browser;int isMobile=((System.Web.Configuration.HttpCapabilitiesBase)myBrowserCaps).IsMobileDevice?1:0;

4.2 批量图片上传

批量图片上传原理即循环执行单张图片上传,直至所选批量图片全部上传完成[4]。首先,利用HttpContext.Current.Request.Files选取上传的批量图片并赋值给HttpFileCollection类对象声明的数组变量files,再循环取出数组中每个元素的值并利用HttpContext.Current.Server.MapPath(“../”)获得对应的图片路径,最后利用SaveAs(存储路径)方法对图片进行存储。批量图片存储时为了提高交互性,利用进度条来显示当前上传进度,代码如下。

var percent=(loaded/total*100).toFixed(2)+‘%’;//计算图片当前已上传的进度。

eleProgress.children (‘.uploadify-progress-bar’).css(‘width’,percent);//更新进度条。

4.3 联想提示

在录入时根据用户输入内容给予相关提示辅助录入已成为一种必然趋势。AJAX技术[5]利用XMLHttpRequset为JavaScript脚本提供了在页面之内与服务器通信的手段[6],同时DOM和XML为脚本语言提供了交互和存储的新渠道[7],使得AJAX异步式交互技术成为实现联想提示功能的最佳选择。

在ASP.NET中,对AJAX相关技术进行了封装[8]。本系统中实现联想提示功能时主要使用了封装的AjaxControlToolkit控件,具体实现方法如下。

1)添加脚本控制域

<ajaxToolkit: ToolkitScriptManager>... </ajax⁃Toolkit:ToolkitScriptManager>。

2)在脚本控制域中添加Textbox和AutoCom⁃pleteExtender控件[9],并设置相关必要参数。Tar⁃getControl ID是必须指定的属性,它指出Extender应该实时监听哪个控件,把目标控件的ID赋给它即可;ServicePath指出要使用的Web服务的路径,这里指的是asmx文件的路径;ServiceMethod指定返回数据的函数,填入目标函数名即可;Minimum⁃PrefixLength是最少需要录入的长度,当输入的内容长度满足此条件时,监听才会调用指定服务获取数据并弹出下拉列表;Completion Interval属性是指用户录入后多长时间,程序去调用服务来获取数据,单位是毫秒;EnableCaching属性用来指定是否允许缓存,若设为true,表示允许缓存,在多数情况下,它可以减少数据访问次数,但在数据源经常变化的情况下,它会向用户提供过时的错误信息;CompletionSetCount属性指定一次应该返回多少项;FirstRowSelected属性表示是否默认选中第一项。

3)在完成AutoCompleteExtender控件的参数设置后,按照ServicePath属性的对应路径新建后缀为.asmx的WebService服务文件并将文件中的[Sys⁃tem.Web.Script.Services.ScriptService]语 句 解 除 注释,从而允许使用ASP.NET AJAX从脚本中调用此Web服务。

4)在WebService服务文件中,撰写控件Ser⁃viceMethod属性指定的带返回值的方法;方法中的prefixText是获取到的用户当前输入的内容,count是CompletionSetCount属性指定的返回的项的数目。

在完成属性设置和方法撰写后便可实现联想提示功能,效果如图3所示。

图3 联想提示效果

4.4 基于模板的W ord导出

常见的Word导出实现方法有两种,一种是利用预先创建的。dot格式的Word模板来实现Word导出[10],另一种是直接创建Word文件并进行相应读写和导出操作[11]。由于系统中的经济签证单具有规范格式,故本系统采用第一种方法,利用模板来实现Word文件导出功能,该功能实现效果如图4所示。

图4 经济签证Word导出样式

基于模板的Word导出实现方法如下:

1)制作.dot格式的Word模板并在需填写内容处添加标签。

2)利用 Application.Documents.Open(ref文件名,ref oMissing,ref oMissing,ref oMissing,...)方法打开模板,并通过语句doc.Bookmarks[“标签名”].Range.Text=label.text.toString()向模板中对应标签处添加所赋内容。

3)利用Word.Tables tabs1=doc.Tables获取模板中的全部table,并向选定的Table中插入一行:dt_Word.Rows.Add(ref oMissing)。

4)在选定的行中利用 dt_Word.Cell(row Idex,1).Select()插入并选择第一个单元格,利用Align⁃men属性设置第一个单元格中内容位置。

5)向被选定单元格插入图片:App.Selection.InlineShapes.AddPicture(basePicdir+pics[i],ref oMissing,ref oMissing,ref oMissing),并设置图片宽度 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))添加头信息通知浏览器激活文件下载对话框执行下载而非打开文件,另外将Response.Con⁃tentType属性设置为application/octet-stream来指定服务器响应的HTTP内容类型为字节流。

7)利用 Response.W riteFile(fi.FullName)输出写好的word文件。

4.5 基于NPOI插件的Excel导出

常见的Excel导出实现方法为利用Excel模板实现导出[12]或直接创建Excel文件进行读写和导出操作,本系统采用第二种方法实现Excel导出。由于官方提供的Excel文档存取方法效率低、兼容性差[13]且基本不支持服务器端的处理[14],因此借助了第三方NPOI插件来方便Excel操作。

NPOI为POI项目的.NET版本,是一套用Java写成的开源的用于读写Excel、Word等微软OLE组件文档[15]的第三方类库,能够帮助Webform的开发者在没有安装Office的情况下读写Excel格式的文件,目前支持到Excel2007。NPOI对Excel进行读写的主要方法是按照Excel组织文件的格式规则和方法通过文件流方式生成Excel文件,避免了通过OLE方式激活庞大的Excel进程,大量节省了服务器资源,提高了服务器生成Excel文件的性能[16]。

基于NPOI插件的Excel导出实现方法如下。

1)NPOI包括6个常用子类库,分别为基础辅助库 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,开发人员可按需加载相应类库。系统中主要使用了NPOI.Util、NPOI.SS、NPOI.POIFS和NPOI.HSSF。

2) 利 用 HSSFWorkbook hssfworkbook=new HSSFWorkbook()创建工作薄。

3)创建名为sheetName的工作表:ISheet sheet=hssfworkbook.CreateSheet("sheetName")。

4)IRow row0=sheet.CreateRow(行序号)创建行,工作表中的行序号从0开始。

5)ICell cell0=row0.CreateCell(单元格序号)创建指定行上的单元格,单元格序号从0开始,并利用cell0.SetCellValue(“单元格内容”)对指定单元格赋值。

6)利用sheet.GetRow(行序号).HeightInPoints设置指定行行高,利用sheet.SetColumnWidth(列序号,数值)设置指定列列宽。

7)创建单元格样式:ICellStyle style=hssfwork⁃book.CreateCellStyle(),利用 Alignment和 Vertica⁃lAlignment属性设置水平和竖直方向的对齐方式,利用style.SetFont(字体样式)设置字体样式,Bor⁃derTop、BorderBottom、BorderLeft和 BorderRight用于设置上下左右边框、DataFormat设置数据格式。

8)IFont font_zd=hssfworkbook.CreateFont()创建字体样式,FontHeightInPoints属性用于设置字号,FontName设置字体,Color设置颜色,Boldweight设置加粗。

9)设置合并a~b行的x~y列的单元格:sheet.AddMergedRegion(new CellRangeAddress(a,b,x,y))。

10)先实例化MemoryStream类来初始化数组用于封装以无符号字节数组形式存储的数据,再调用工作薄对象的W rite(MemoryStream类变量)方法将数据从缓存区写入MemoryStream流对象。

11)添加Http头信息通知浏览器激活文件下载对话框执行下载而非打开文件,设置显示的文件名和使用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流对象中数据以二进制流形式输出到浏览器。

以上NPOI操作均为常用基本操作,NPOI中还提供了冻结行列、函数计算以及绘图等多种操作,可根据需要进行使用。

5 结语

面向多平台的经济签证管理系统综合利用ASP.NET技术、Web客户端技术以及数据库技术等满足了用户现场通过移动端填报签证和批量上传现场照片,同时利用PC端进行签证管理与导出工作的需求,优化了传统签证办理流程,提高了签证管理效率,降低了签证管理成本,实现了经济签证的自动化、信息化管理,具有良好的应用和推广前景。

[1]张学军,包亚萍.基于BWD模式的电子商务系统的研究与设计[J].计算机应用研究,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多层结构的个性化网络教学系统设计[J].吉林大学学报(信息科学版),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].信息网络安全,2016(3):34-39.

LI Zhouhui,HUANG Yanqun,TANG Yi.Research on Browsers Recognition[J].Netinfo Security,2016(3):34-39.

[4]顾梅华.基于C#.NET的文件传输关键技术研究与系统实现[D].成都:电子科技大学,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技术的Web应用的建模与测试用例生成[J].计算机科学,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技术的环保监控系统[D].杭州:浙江大学,2006:6-22.

HUANG Zhichun.The Environmental Monitor System based on AJAX[D].Hangzhou:Zhejiang University,2006:6-22.

[7]杨俊峰,黎建辉,杨风雷.深层网站Ajax页面数据采集研 究 综 述[J].计 算 机 应 用 研 究 ,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开发中的应用[J].计算机应用与软件,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及其在科研咨询服务系统中的应用[J].微型电脑应用,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]孙静静.基于标签技术的Word智能报表的研究[D].青岛:中国海洋大学,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报告生成功能开发[J].计算机工程与应用,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日

国家自然科学基金项目(编号:61502094);黑龙江省自然科学基金项目(编号:F2016002);黑龙江省教育科学规划重点课题(编号:GJB1215019)资助。

刘卓炫,男,硕士研究生,研究方向:虚拟现实。刘贤梅,女,教授,硕士生导师,研究方向:虚拟现实。田枫,男,副教授,博士,硕士生导师,研究方向:多媒体计算。赵娅,女,副教授,硕士,研究方向:虚拟现实。

猜你喜欢

控件单元格浏览器
合并单元格 公式巧录入
流水账分类统计巧实现
基于.net的用户定义验证控件的应用分析
玩转方格
玩转方格
微软发布新Edge浏览器预览版下载换装Chrome内核
反浏览器指纹追踪
关于.net控件数组的探讨
基于嵌入式MINIGUI控件子类化技术的深入研究与应用
浏览器