杰表技术论坛 's Archiver

admin 发表于 2015-8-4 10:10

使用jatoolsPrinter实现套打(转帖,很详细)

[color=#362e2b][font=Arial]最近在工作中遇到了套打的需求,前前后后,花了不少时间,现在总结一下套打的实现方式。[/font][/color]
[color=#362e2b][font=Arial]一、设计思路[/font][/color]
[color=#362e2b][font=Arial]1、将待打印的文档扫描生成图片,作为网页的背景图片。[/font][/color]
[color=#362e2b][font=Arial]2、通过css将待打印的文字进行定位[/font][/color]
[color=#362e2b][font=Arial]3、使用jatoolsPrinter插件打印已定位好的网页信息。[/font][/color]
[color=#362e2b][font=Arial]二、设计实现[/font][/color]
[color=#362e2b][font=Arial]1、下载并安装jatoolsPrinter插件,[url=http://printfree.jatools.com/]http://printfree.jatools.com/[/url][/font][/color]
[color=#362e2b][font=Arial]2、计算背景图片的像素
[/font][/color]
[color=#362e2b][font=Arial](1)使用直尺在屏幕上,测量打印预览页面的宽度,即红色边框的宽度,在分辨率为1600*900的PC上width=220mm。[/font][/color]
[color=#362e2b][font=Arial][img]http://img.blog.csdn.net/20150731093339890?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center[/img]
[/font][/color]
[color=#362e2b][font=Arial](2)使用像素尺子工具,测量打印预览页面的宽度像素widthPx,在分辨率为1600*900的PC上widthPx=790px[/font][/color]
[color=#362e2b][font=Arial](3)使用直尺测量待套打文档的宽度和长度,比如A4纸的大小为210mm×297mm[/font][/color]
[color=#362e2b][font=Arial](4)计算出背景图片的宽度像素=790*210/220,高度像素=790*297/220,将扫描的图片调整为该大小。[/font][/color]

[font=Consolas,][font=Verdana, Geneva, Arial, Helvetica, sans-serif][size=9px][b][html][/b] [url=http://blog.csdn.net/jxq0816/article/details/47165141#]view plain[/url][url=http://blog.csdn.net/jxq0816/article/details/47165141#]copy[/url]
[/size][/font]

[list=1][*][b]<[/b][b]style[/b]
type="text/css"[b]>[/b][*]        body {[*]            margin-top:15px;[*]            margin-left:0px;[*]            background-image:url('${ctxPath}/resources/assets/imgs/bg2.png');[*]                        background-repeat:no-repeat;[*]        }[*][*][b]</[/b][b]style[/b][b]>[/b][/list][/font]



[color=#362e2b][font=Arial]2、设计打印页面[/font][/color]
[color=#362e2b][font=Arial]我是使用freeMarker来设计的页面[/font][/color]
[color=#362e2b][font=Arial](1)如果页面中待打印元素,不需要进行逻辑处理,直接显示,可以使用绝对定位来实现。[/font][/color]

[font=Consolas,][font=Verdana, Geneva, Arial, Helvetica, sans-serif][size=9px][b][html][/b] [url=http://blog.csdn.net/jxq0816/article/details/47165141#]view plain[/url][url=http://blog.csdn.net/jxq0816/article/details/47165141#]copy[/url]
[/size][/font]

[list=1][*].jp-comp-1{left: 420px; top: 130px; z-index: 101;}[*]   .jp-comp-2{left: 220px; top: 280px; z-index: 102;}[*]   .jp-comp-3{left: 555px; top: 280px; z-index: 103;}[*]   .jp-comp-4{left: 220px; top: 335px; z-index: 104;}[*]   .jp-comp-5{left: 555px; top: 335px; z-index: 105;}[*]   .jp-comp-6{left: 220px; top: 395px; z-index: 106;}[*]   .jp-comp-7{left: 220px; top: 455px; z-index: 107;}[*]   .jp-comp-8{left: 220px; top: 515px; z-index: 108;}[*]   .jp-comp-9{left: 220px; top: 570px; z-index: 109;}[*]   .jp-comp-10{left: 555px; top: 570px; z-index: 110;}[*]   .jp-comp-11{left: 800px; top: 300px; z-index: 111;}[*]   .jp-comp-12{left: 850px; top: 580px; z-index: 112;}[/list][/font]

[color=#362e2b][font=Arial][img]http://img.blog.csdn.net/20150731100919694?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center[/img]
[/font][/color]
[color=#362e2b][font=Arial](2)如果打印信息需要经过逻辑判断,则不能使用绝对定位,这是插件的设计缺陷,我在这里浪费了不少时间,希望后人别再走我的弯路。如下图的需求是根据后台传递的业务类型,在相应的方框内打钩。
[/font][/color]
[color=#362e2b][font=Arial][img]http://img.blog.csdn.net/20150731101317813?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center[/img][/font][/color]
[color=#362e2b][font=Arial]这里,我们使用margin-left来进行定位。[/font][/color]
[font=Consolas,][font=Verdana, Geneva, Arial, Helvetica, sans-serif][size=9px][b][html][/b] [url=http://blog.csdn.net/jxq0816/article/details/47165141#]view plain[/url][url=http://blog.csdn.net/jxq0816/article/details/47165141#]copy[/url]
[/size][/font]

[list=1][*][#if vo.busTypeName == "注册登记"][*]    [b]<[/b][b]div[/b]
style="float:left;margin-left:145px;"[b]>[/b]√[b]</[/b][b]div[/b][b]>[/b][*]        [#else][*]    [b]<[/b][b]div[/b]
style="float:left;margin-left:145px;"[b]>[/b][b]</[/b][b]div[/b][b]>[/b][*][/#if][/list][/font]
[color=#362e2b][font=Arial]换行使用<br>标签。[/font][/color]
[color=#362e2b][font=Arial](3)如下图所示,如果待套打文档是表格,我们可以使用table来进行布局。
[/font][/color]
[color=#362e2b][font=Arial][img]http://img.blog.csdn.net/20150731103704982?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center[/img]
[/font][/color]

[font=Consolas,][font=Verdana, Geneva, Arial, Helvetica, sans-serif][size=9px][b][html][/b] [url=http://blog.csdn.net/jxq0816/article/details/47165141#]view plain[/url][url=http://blog.csdn.net/jxq0816/article/details/47165141#]copy[/url]
[/size][/font]

[list=1][*][b]<[/b][b]table[/b]
align="left"
width="615px"
border="0px"
style="line-height:21px;margin-top:-5px; margin-left:70px;text-align:center"[b]>[/b][*]    [b]<[/b][b]tr[/b][b]>[/b][*]        [b]<[/b][b]td[/b]
width="263px"[b]>[/b][#--类别--] [b]</[/b][b]td[/b][b]>[/b][*]        [b]<[/b][b]td[/b]
width="52px"[b]>[/b][#--判定--] [b]</[/b][b]td[/b][b]>[/b][*]        [b]<[/b][b]td[/b]
width="245px"[b]>[/b][#--类别--] [b]</[/b][b]td[/b][b]>[/b][*]        [b]<[/b][b]td[/b]
width="55px"[b]>[/b][#--判定--] [b]</[/b][b]td[/b][b]>[/b][*]    [b]</[/b][b]tr[/b][b]>[/b][*]    [b]<[/b][b]pre[/b]
name="code"
class="html"[b]>[/b]
[b]<[/b][b]tr[/b][b]>[/b][*]               //此处省略代码[*]        [b]</[/b][b]tr[/b][b]>[/b][*][*][b]</[/b][b]table[/b][b]>[/b][*][/list][/font]
[color=#362e2b][font=Arial]3.打印插件的版本问题[/font][/color]
[color=#362e2b][font=Arial](1)5,4,0,0 版的插件引入代码[/font][/color]

[font=Consolas,][font=Verdana, Geneva, Arial, Helvetica, sans-serif][size=9px][b][html][/b] [url=http://blog.csdn.net/jxq0816/article/details/47165141#]view plain[/url][url=http://blog.csdn.net/jxq0816/article/details/47165141#]copy[/url]
[/size][/font]

[list=1][*][b]<[/b][b]object[/b]
id="ojatoolsPrinter"
codebase="jatoolsPrinter.cab#version=5,4,0,0"
classid="clsid:B43D3361-D075-4BE2-87FE-057188254255"
width="0"
height="0"[b]>[/b][*]        [b]<[/b][b]embed[/b]
id="ejatoolsPrinter"
type="application/x-vnd.jatoolsPrinter"
width="0"
height="0"[b]>[/b][b]</[/b][b]embed[/b][b]>[/b][*]    [b]</[/b][b]object[/b][b]>[/b][*][b]</[/b][b]body[/b][b]>[/b][*][b]<[/b][b]script[/b]
type="text/javascript"[b]>[/b][*]     var myDoc={[*]        settings:{[*]            topMargin:10,[*]            bottomMargin:200,[*]            leftMargin:20,[*]            orientation:1[*]        },[*]        enableScreenOnlyClass:true,[*]        documents:document,[*]        copyrights:'杰创软件拥有版权  [url=http://www.jatools.com]www.jatools.com[/url]'[*]    };[*]    var jatoolsPrinter = navigator.userAgent.indexOf('MSIE') [b]>[/b] -1 ? document.getElementById('ojatoolsPrinter'): document.getElementById('ejatoolsPrinter');[*]    jatoolsPrinter.print(myDoc,false);[*]    window.close();[*][b]</[/b][b]script[/b][b]>[/b][*][b]</[/b][b]html[/b][b]>[/b][/list][/font]

[color=#362e2b][font=Arial](2)8,6,0,0版插件的引入代码(更新于2014.12.17)[/font][/color]


[font=Consolas,][font=Verdana, Geneva, Arial, Helvetica, sans-serif][size=9px][b][html][/b] [url=http://blog.csdn.net/jxq0816/article/details/47165141#]view plain[/url][url=http://blog.csdn.net/jxq0816/article/details/47165141#]copy[/url]
[/size][/font]

[list=1][*]<!-- 插入打印控件 -->[*][b]<[/b][b]OBJECT[/b]
ID="jatoolsPrinter"
CLASSID="CLSID:B43D3361-D075-4BE2-87FE-057188254255"[*]         codebase="jatoolsPrinter.cab#version=8,6,0,0"[b]>[/b][b]</[/b][b]OBJECT[/b][b]>[/b][*][*][b]</[/b][b]body[/b][b]>[/b][*][*] [b]<[/b][b]script[/b]
type="text/javascript"[b]>[/b][*]    function doPrint() {[*]        myDoc = {[*]            marginIgnored:true,[*]               enableScreenOnlyClass:true,[*]              documents: document,[*]              copyrights: '杰创软件拥有版权  [url=http://www.jatools.com]www.jatools.com[/url]'[*]        }[*]           document.getElementById("jatoolsPrinter").printPreview(myDoc);[*][*]    }[*][b]</[/b][b]script[/b][b]>[/b][*][*][b]</[/b][b]html[/b][b]>[/b][/list][/font]

admin 发表于 2015-8-4 10:12

原文:[url=http://blog.csdn.net/jxq0816/article/details/47165141]http://blog.csdn.net/jxq0816/article/details/47165141[/url]

页: [1]

Powered by Discuz! Archiver 6.1.0  © 2001-2007 Comsenz Inc.