Web打印控件Lodop实现表格物流单的打印

一、lodop打印预览效果图

 LODOP.PRINT_SETUP();打印维护效果图

LODOP.PREVIEW();打印预览图

二、写在前面

最近项目用到了LODOP的套打,主要用到两个地方,一是物流的面单(即套打在EMS等各种物流快递单),另一个是把数据画成表格来打印出库单。物流面单比较简单,网上有各种例子还是比较方便的。主要说说通过该工具画表格的用法,当然通过ADD_PRINT_TABLE 这种超文本格式(即通过写好表格的html来实现)的也可以琢磨琢磨。

三、lodop的demo

<html>
<body>
<object id="LODOP" classid="clsid:2105C259-1E0C-4534-8141-A753534CB4CA" width=0 height=0></object>
<script language="javascript" src="LodopFuncs.js"></script>
<script language="javascript" type="text/javascript">
function CreatePrintPage() {

var whichOne='jx';
var num=2;
    var fenyeSize=0;
   
    var printNum;//序号
    LODOP.PRINT_INITA(0,0,1800,1460,"套打EMS的模板");
    if(whichOne=="bz"||whichOne=="hn"){
         LODOP.SET_PRINT_PAGESIZE(0,0,0,"A4");
         fenyeSize=1070;
    }else if(whichOne=="jx"){
         LODOP.SET_PRINT_PAGESIZE(0,'210mm','140mm',"A4");//一开始用的是像素,后来都改成用mm为单位
         fenyeSize=140;
    }if(whichOne=="zj"){
          LODOP.PRINT_INITA(100,11,800,1460,"套打EMS的模板");
         fenyeSize=470;
        LODOP.SET_PRINT_PAGESIZE(0,1900,1300,"A4");
        LODOP.SET_PRINT_MODE("PRINT_PAGE_PERCENT", "Width:80%;Height:80%");
    }
   
        for(var i=0;i<1;i++){

            
            var lastheght=2;
            //上面的信息
            if(num!=1){//标准单据有标题,  num==1浙江单据没有
            LODOP.ADD_PRINT_TEXT("3.39mm","64.4mm","77.55mm","9.6mm","XXXXX平台销售出库单");
                LODOP.SET_PRINT_STYLEA(0, "ItemType", 0);
                LODOP.SET_PRINT_STYLEA(0, "FontSize", 14);
                LODOP.SET_PRINT_STYLEA(0, "Bold", 1);
            }
           
            var size =19;     
            
            var extendSize=0;
            var table_hegth=(size+1)*25;
            var fonsize=4;
            //上面的信息
            var lsous="11121额鹅鹅鹅"
            var shohuor="111"
            if(whichOne=="hn"||whichOne=="jx"){
                
                LODOP.ADD_PRINT_TEXT("15.29mm","12.54mm","20.13mm","5.37mm","订单编号:");
                LODOP.ADD_PRINT_TEXT("15.29mm","28.18mm","45.56mm","5.37mm","1111111111111111");
                LODOP.ADD_PRINT_TEXT("15.29mm","73.37mm","20.13mm","5.37mm","下单日期:");
                LODOP.ADD_PRINT_TEXT("15.29mm","88.66mm","20.13mm","5.37mm","2017-0909");
                LODOP.ADD_PRINT_TEXT("15.29mm","109.03mm","20.13mm","5.37mm","发货日期:");
                LODOP.ADD_PRINT_TEXT("15.29mm","124.65mm","20.13mm","5.37mm","2017-0909");
                LODOP.ADD_PRINT_TEXT("6.03mm","154.28mm","27.54mm","14.1mm","1234");
                LODOP.SET_PRINT_STYLEA(0, "ItemType", 0);
                LODOP.SET_PRINT_STYLEA(0, "FontSize", 32);
                LODOP.SET_PRINT_STYLEA(0, "Bold", 1);
                LODOP.ADD_PRINT_TEXT("21.11mm","12.54mm","20.13mm","5.37mm","零售商:");
                LODOP.ADD_PRINT_TEXT("21.11mm","24.98mm",3+getByteLen(lsous)*1.7+"mm","5.37mm",lsous);
                LODOP.ADD_PRINT_TEXT("21.11mm",24.98+3+getByteLen(lsous)*1.7+"mm","20.13mm","5.37mm","收货人:");
                LODOP.ADD_PRINT_TEXT("21.11mm",38+3+getByteLen(lsous)*1.7+"mm","20.13mm","5.37mm",shohuor);
                LODOP.ADD_PRINT_TEXT("21.11mm",58+3+getByteLen(lsous)*1.7+"mm","20.13mm","5.37mm","联系电话:");
                LODOP.ADD_PRINT_TEXT("21.11mm",73+3+getByteLen(lsous)*1.7+"mm","20.13mm","5.37mm","19765663427");
                LODOP.ADD_PRINT_TEXT("26.41mm","12.81mm","20.13mm","5.37mm","收货地址:");
                LODOP.ADD_PRINT_TEXT("26.41mm","28.68mm","139.99mm","5.37mm","北京天安门广场");
            }
    
            //标题等
            LODOP.ADD_PRINT_TEXT("33.02mm","15.72mm","9.55mm","5.37mm","行号");
             LODOP.SET_PRINT_STYLEA(0, "Alignment", 2);
            LODOP.ADD_PRINT_TEXT("33.02mm","49.85mm","13.52mm","5.37mm","供货商");
            LODOP.ADD_PRINT_TEXT("33.02mm","91.65mm","9.55mm","5.37mm","型号");
            LODOP.ADD_PRINT_TEXT("33.02mm","120.5mm","9.55mm","5.37mm","颜色");
            LODOP.ADD_PRINT_TEXT("33.02mm","144.57mm","20.13mm","5.37mm","单价(元)");
            LODOP.ADD_PRINT_TEXT("33.02mm","162.56mm","9.55mm","5.37mm","数量");
            LODOP.ADD_PRINT_TEXT("33.02mm","171.82mm","27.81mm","5.37mm","应付金额(元)");
            
            //表格线
            LODOP.ADD_PRINT_LINE("31.31mm","13mm","31.31mm","193.00mm",0,1);// 最上条标题横线            
            LODOP.ADD_PRINT_LINE("37.31mm","13mm","37.31mm","193.00mm",0,1);// 标题下横线        
            LODOP.ADD_PRINT_LINE("31.31mm","13mm", "37.11mm", "13mm", 0, 1);// 最左竖线
            LODOP.ADD_PRINT_LINE("31.31mm","25mm", "37.11mm", "25mm", 0, 1);// 行号后竖线
            LODOP.ADD_PRINT_LINE("31.31mm","83mm", "37.11mm", "83mm", 0, 1);// 供货商后竖线
            LODOP.ADD_PRINT_LINE("31.31mm","110mm", "37.11mm", "110mm", 0, 1);// 型号后竖线
            LODOP.ADD_PRINT_LINE("31.31mm","140mm", "37.11mm", "140mm", 0, 1);// 颜色后竖线
            LODOP.ADD_PRINT_LINE("31.31mm","160mm", "37.11mm", "160mm", 0, 1);// 单价后竖线
            LODOP.ADD_PRINT_LINE("31.31mm","170mm", "37.11mm", "170mm", 0, 1);// 数量后竖线
            LODOP.ADD_PRINT_LINE("31.31mm","193mm", "37.11mm", "193mm", 0, 1);// 最右竖线
    
            //动态列表信息
            var trheight=37.31;//用于每个竖线距离上面的固定长度
            var thHeight=37.98;//用于每行商品距离上面的固定长度
            var newHeight=0;//用于动态增加一行的长度
            var lastSize=0;//分页前的那个下标
            var allProductNumber=0;
            for(var k=0;k<size;k++){
            var aaa="12345678901234567";
            var bbb="12345678901";
            var ccc="1234567";
                newHeight=(k-lastSize)*5.37+extendSize*fonsize;
                var SizeTmpt=parseInt(getByteLen(aaa)/35);
           
                if(parseInt(getByteLen(bbb)/16)>SizeTmpt){
                     SizeTmpt=parseInt(getByteLen(bbb)/16);
                }
               
                if(parseInt(getByteLen(ccc)/17)>SizeTmpt){
                    SizeTmpt=parseInt(getByteLen(ccc)/17);
                }
                LODOP.ADD_PRINT_TEXT(thHeight+newHeight+"mm","15.72mm","9.55mm","5.37mm",k+1);
                LODOP.SET_PRINT_STYLEA(0, "Alignment", 2);
                LODOP.ADD_PRINT_TEXT(thHeight+newHeight+"mm","25mm","58mm",5.3+SizeTmpt*fonsize+"mm",aaa);
                LODOP.SET_PRINT_STYLEA(0, "Alignment", 2);
                LODOP.ADD_PRINT_TEXT(thHeight+newHeight+"mm","83mm","27mm",5.3+SizeTmpt*fonsize+"mm",bbb);
                LODOP.SET_PRINT_STYLEA(0, "Alignment", 2);
                LODOP.ADD_PRINT_TEXT(thHeight+newHeight+"mm","110mm","30mm",5.3+SizeTmpt*fonsize+"mm",ccc);
                LODOP.SET_PRINT_STYLEA(0, "Alignment", 2);
                LODOP.ADD_PRINT_TEXT(thHeight+newHeight+"mm","140mm","20mm","5.37mm",'1234');
                LODOP.SET_PRINT_STYLEA(0, "Alignment", 2);
                LODOP.ADD_PRINT_TEXT(thHeight+newHeight+"mm","160mm","10mm","5.37mm",'2333');
                LODOP.SET_PRINT_STYLEA(0, "Alignment", 2);
                LODOP.ADD_PRINT_TEXT(thHeight+newHeight+"mm","170mm","23mm","5.37mm",'2323');
                LODOP.SET_PRINT_STYLEA(0, "Alignment", 2);
                
                extendSize+=SizeTmpt;
                newHeight=(k-lastSize)*5.37+extendSize*fonsize;
          if(k==lastSize+1&&k!=1){
              LODOP.ADD_PRINT_LINE(trheight+newHeight-SizeTmpt*fonsize+"mm","13mm",trheight+newHeight-SizeTmpt*fonsize+"mm","193mm",0,1);//每条数据后加一横线
          }
                LODOP.ADD_PRINT_LINE(trheight+newHeight-SizeTmpt*fonsize+"mm","13mm",trheight+newHeight+5.37+"mm","13mm",0,1);//最左竖线
                LODOP.ADD_PRINT_LINE(trheight+newHeight-SizeTmpt*fonsize+"mm","25mm",trheight+newHeight+5.37+"mm","25mm",0,1);//行号后竖线
                LODOP.ADD_PRINT_LINE(trheight+newHeight-SizeTmpt*fonsize+"mm","83mm",trheight+newHeight+5.37+"mm","83mm",0,1);//供货商后竖线
                LODOP.ADD_PRINT_LINE(trheight+newHeight-SizeTmpt*fonsize+"mm","110mm",trheight+newHeight+5.37+"mm",'110mm',0,1);//型号后竖线
                LODOP.ADD_PRINT_LINE(trheight+newHeight-SizeTmpt*fonsize+"mm","140mm",trheight+newHeight+5.37+"mm","140mm",0,1);//颜色后竖线
                LODOP.ADD_PRINT_LINE(trheight+newHeight-SizeTmpt*fonsize+"mm","160mm",trheight+newHeight+5.37+"mm","160mm",0,1);//单价后竖线
                LODOP.ADD_PRINT_LINE(trheight+newHeight-SizeTmpt*fonsize+"mm","170mm",trheight+newHeight+5.37+"mm","170mm",0,1);//数量后竖线
                LODOP.ADD_PRINT_LINE(trheight+newHeight-SizeTmpt*fonsize+"mm","193mm",trheight+newHeight+5.37+"mm","193mm",0,1);//最右竖线
                
                LODOP.ADD_PRINT_LINE(trheight+newHeight+5.57+"mm","13mm",trheight+newHeight+5.57+"mm","193mm",0,1);//每条数据后加一横线

                if((trheight+newHeight+5.57)%fenyeSize<=fenyeSize&&(trheight+5.57+newHeight)%fenyeSize>=(fenyeSize-15)){
                 
                        LODOP.NewPage();
                        thHeight=0.67;
                       lastSize=k;
                       trheight=0;
                    extendSize=0;

                }

             
            }

            table_hegth=trheight+newHeight+5.57;
    
      if(whichOne=="hn"||whichOne=="jx"){
          lastheght+=9.4;
            LODOP.ADD_PRINT_TEXT(1+table_hegth+"mm","91.65mm","9.55mm","5.37mm","合计");
            LODOP.SET_PRINT_STYLEA(0, "Alignment", 2);
            LODOP.ADD_PRINT_TEXT(1+table_hegth+"mm","160mm","10mm","5.37mm",'3333');
            LODOP.SET_PRINT_STYLEA(0, "Alignment", 2);
            LODOP.ADD_PRINT_TEXT(1+table_hegth+"mm","170mm","23mm","5.37mm",'999999');
            LODOP.SET_PRINT_STYLEA(0, "Alignment", 2);
            LODOP.ADD_PRINT_LINE(4.7+table_hegth+"mm","13mm",4.7+table_hegth+"mm","193mm",0,1);//备注上横线
            LODOP.ADD_PRINT_LINE(9.4+table_hegth+"mm","13mm",9.4+table_hegth+"mm","193mm",0,1);//最后一横线
            LODOP.ADD_PRINT_LINE(table_hegth+"mm", "13mm", table_hegth+9.4+"mm", "13mm", 0, 1);// 最左竖线
            LODOP.ADD_PRINT_LINE(table_hegth+"mm", "160mm", 4.7+table_hegth+"mm", "160mm", 0, 1);// 单价后竖线
            LODOP.ADD_PRINT_LINE(table_hegth+"mm", "170mm", 4.7+table_hegth+"mm", "170mm", 0, 1);// 数量后竖线
            LODOP.ADD_PRINT_LINE(table_hegth+"mm", "193mm", table_hegth+9.4+"mm", "193mm", 0, 1);// 最右竖线
            
               if((trheight+9.4+newHeight)%fenyeSize<=fenyeSize&&(trheight+newHeight+9.4)%fenyeSize>=(fenyeSize-6)){                     
                        LODOP.NewPage();
                       lastheght=0;
                       table_hegth=0;
                        
              }
      }

           
            // 最下显示订单信息
            

            var moneyWeight=0;
            LODOP.ADD_PRINT_TEXT(lastheght+table_hegth+"mm","12.54mm","27.81mm","5.37mm","订单总金额:");
            LODOP.ADD_PRINT_TEXT(lastheght+table_hegth+"mm","30mm","27.81mm","5.37mm",'555666'+"");
            moneyWeight+=getByteLen('555666')*1.7+4;
            LODOP.ADD_PRINT_TEXT(lastheght+table_hegth+"mm",30+moneyWeight+"mm","3mm","5.37mm","-");
                LODOP.ADD_PRINT_TEXT(lastheght+table_hegth+"mm",30+3+moneyWeight+"mm","18.55mm","5.37mm","价保返利:");
            LODOP.ADD_PRINT_TEXT(lastheght+table_hegth+"mm",30+17+moneyWeight+"mm","27.81mm","5.37mm","7667元");
                moneyWeight+=getByteLen('7667')*1.7+4;
            LODOP.ADD_PRINT_TEXT(lastheght+table_hegth+"mm",30+17+moneyWeight+"mm","3mm","5.37mm","-");
                LODOP.ADD_PRINT_TEXT(lastheght+table_hegth+"mm",30+20+moneyWeight+"mm","17.81mm","5.37mm","预付款:");
            LODOP.ADD_PRINT_TEXT(lastheght+table_hegth+"mm",30+31+moneyWeight+"mm","27.81mm","5.37mm","7887元");
               moneyWeight+=getByteLen('7887')*1.7+4;
            LODOP.ADD_PRINT_TEXT(lastheght+table_hegth+"mm",30+31+moneyWeight+"mm","3mm","5.37mm","-");
                LODOP.ADD_PRINT_TEXT(lastheght+table_hegth+"mm",30+34+moneyWeight+"mm","17.81mm","5.37mm","账期:");
            LODOP.ADD_PRINT_TEXT(lastheght+table_hegth+"mm",30+43+moneyWeight+"mm","17.81mm","5.37mm","999元");
            moneyWeight+=getByteLen('787')*1.7+4;
            LODOP.ADD_PRINT_TEXT(lastheght+table_hegth+"mm",30+43+moneyWeight+"mm","3mm","5.37mm","-");
                LODOP.ADD_PRINT_TEXT(lastheght+table_hegth+"mm",30+46+moneyWeight+"mm","17.81mm","5.37mm","优惠券:");
            LODOP.ADD_PRINT_TEXT(lastheght+table_hegth+"mm",30+57+moneyWeight+"mm","17.81mm","5.37mm","888元");
        moneyWeight+=getByteLen('787')*1.7+4;
            LODOP.ADD_PRINT_TEXT(lastheght+table_hegth+"mm",30+57+moneyWeight+"mm","3mm","5.37mm","-");
                LODOP.ADD_PRINT_TEXT(lastheght+table_hegth+"mm",30+60+moneyWeight+"mm","17.81mm","5.37mm","预定金:");
            LODOP.ADD_PRINT_TEXT(lastheght+table_hegth+"mm",30+71+moneyWeight+"mm","17.81mm","5.37mm","555元");
        moneyWeight+=getByteLen('788')*1.7+4;
            LODOP.ADD_PRINT_TEXT(lastheght+table_hegth+"mm",30+71+moneyWeight+"mm","3mm","5.37mm","=");
                LODOP.ADD_PRINT_TEXT(lastheght+table_hegth+"mm",30+74+moneyWeight+"mm","18.55mm","5.37mm","线上支付:");
            LODOP.ADD_PRINT_TEXT(lastheght+table_hegth+"mm",30+88+moneyWeight+"mm","17.81mm","5.37mm","555元");
            
            if(whichOne=="hn"||whichOne=="jx"){
               if((lastheght+table_hegth+5)%fenyeSize<=fenyeSize&&(lastheght+table_hegth+5)%fenyeSize>=(fenyeSize-6)){                     
                        LODOP.NewPage();
                       lastheght=0;
                       table_hegth=0;
                        
              }
                LODOP.ADD_PRINT_TEXT(lastheght+table_hegth+5+"mm","12.54mm","27.81mm","5.37mm","制单人:");
                LODOP.ADD_PRINT_TEXT(lastheght+table_hegth+5+"mm","62.54mm","27.81mm","5.37mm","配货员:");
                LODOP.ADD_PRINT_TEXT(lastheght+table_hegth+5+"mm","112.54mm","27.81mm","5.37mm","检验员:");
                LODOP.ADD_PRINT_TEXT(lastheght+table_hegth+5+"mm","162.54mm","27.81mm","5.37mm","包装员:"); 
            }
             LODOP.NewPage();
        }
LODOP.PRINT_SETUP();


};  

function getByteLen(val) {
    var len = 0;
    for (var i = 0; i < val.length; i++) {
        if (val[i].match(/[^\x00-\xff]/ig) != null) //全角
            len += 2;
        else
            len += 1;
    }
    return len;
}


</script> 
进入<a href="javascript:;" onclick="javascript:CreatePrintPage();LODOP.PRINT_DESIGN();">模板设计</a><br><br>
进入<a href="javascript:;" onclick="javascript:CreatePrintPage();">模板的打印预览</a>
</body>
</html>

三、表格设计思路

来源是官网的http://www.c-lodop.com/demolist/PrintSampleA1.html。主要是画线条,每个循环数据都在后面加横线和竖线,里面根据纸张分好页既可。

四、注意事项

1、 LODOP.PRINT_SETUP();打印维护会导致打印的时候左下角有lodop水印,不用就没有,或者注册后就没有了。

2、简单的获取打印次数可以用这个方法。

LODOP.On_Return=function(TaskID,Value){
alert(Value);
};

3、lodop的各种demo官方网站http://www.mtsoftware.cn/LodopDemo.html。

4、附件是lodop技术文档和各种lodop插件以及demo 下载附件

5、碰到几次客户反映和开发效果不一致的原因,是因为插件导致的,具体可参照http://blog.sina.com.cn/s/blog_157ebf1370102wprq.html,不同插件界面不一样,打印的操作也不一样

转载于:https://www.cnblogs.com/minzhousblogs/p/6558120.html

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
二维码,条形码,网页各类打印样式控件Lodop 1.如何在页面内嵌入控件见样例一 2.如何选材打印当前页面内容见样例二 3.如何用代码生成打印页见样例三 4.如何打印设计和定位套打见样例四 5.如何控制纸张大小和连续打印见样例五 6.如何输出多页长文档及双面打印见样例六 7.如何定向输出见样例七 8.如何打印图片见样例八 9.如何用程序加载打印维护背景图见样例九 10如何控制打印样式(STYLE)见样例十 11如何直接打印条形码见样例十一 12如何读写本地文件见样例十二 13如何打印旋转内容见样例十三 14如何按URL打印见样例十四 15如何打印表格的页头页尾见样例十五 16如何设置预览窗口大小见样例十六 17如何发打印机指令或直接读写端口见样例十七 18如何打印幅面高度不固定的票据见样例十八 19如何内嵌显示及预览时包含背景图见样例十九 20如何强制分页并预览多页卡片见样例二十 21如何控制打印维护的功能权限见样例二十一 22如何构建自己的纯WEB打印预览见样例二十二 23如何居中打印超文本见样例二十三 24如何选择界面皮肤见样例二十四 25如何指定输出到哪页或仅预览见样例二十五 26如何提高多页打印的性能见样例二十六 27如何导出数据到Excel文件见样例二十七 28如何快速读取客户端系统信息见样例二十八 29如何使用其它长度位见样例二十九 30如何分页输出页面内容见样例三十 31如何打印表格的分页小计或合计见样例三十一 32如何实现清晰的图表打印见样例三十二 33如何实现甘特图等的图表打印见样例三十三 34如何使用百分比%和满页打印见样例三十四 35如何获得打印结果和程序代码见样例三十五 36如何在设计过程中用js编辑内容见样例三十六 37如何打印公章效果图见样例三十七 38如何用BASE64编码输出图片见样例三十八 39如何打印田字格、上划线等文本见样例三十九 40如何进行数据格式转换见样例四十 41如何把内容关联后按顺序打印见样例四十一 42如何把整页内容缩放打印见样例四十二 43如何分页打印综合表格见样例四十三 44如何缩放打印个超文本内容见样例四十四 45如何获得打印状态及最终结果见样例四十五 46如何设置右边距和下边距见样例四十六
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值