国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

lodop+art-template實現(xiàn)web端漂亮的小票樣式打印

hersion / 1282人閱讀

摘要：一現(xiàn)狀由于之前采用打印控件商業(yè)版付費可以使用免費版但是會有水印去打印小票，是一行一行的打印，但是不滿足給到復(fù)雜布局的小票樣式，所以得重新考慮如何來實現(xiàn)。打印控件介紹是支持瀏覽器端的打印控件，功能挺強大的。

一. 現(xiàn)狀

由于之前采用Lodop打印控件(商業(yè)版付費,可以使用免費版 但是會有水印)去打印小票，是一行一行的打印，但是不滿足UI給到復(fù)雜布局的小票樣式，所以得重新考慮如何來實現(xiàn)。

二. 介紹 art-template介紹

art-template 是一個簡約、超快的模板引擎。

它采用作用域預(yù)聲明的技術(shù)來優(yōu)化模板渲染速度，從而獲得接近 JavaScript 極限的運行性能，并且同時支持 NodeJS 和瀏覽器。在線速度測試。

中文文檔：art-template中文文檔

跟著文檔首先熟悉一下，然后看一下語法，跟著語法去實踐一下，很快就可以上手完成功能。

Lodop打印控件介紹

Lodop是支持瀏覽器端的web打印控件， 功能挺強大的。

官網(wǎng)地址：http://www.lodop.net/

目前客戶端有很多是基于瀏覽器內(nèi)核套的殼，那么在需要特殊打印的場景下，可以試下這個控件。

三. 方案選擇 
方案一：用html+css進行網(wǎng)頁布局，html2canvas.js 來實現(xiàn)將網(wǎng)頁轉(zhuǎn)換成圖片，然后直接用Lodop打印圖片， 但是經(jīng)過測試，打印出來的圖片模糊不清，而且html2canvas.js的兼容性IE>8，所以不符合


方案二：將這部分功能讓后端去完成模板+數(shù)據(jù)渲染并生成圖片去打印，但是發(fā)現(xiàn)跟方案一有相似的地方，解決不了圖片打印模糊不清，但是可以解決兼容性問題，依然不符合


方案三：采用html+css進行網(wǎng)頁布局，用art-template進行模板渲染后生成html字符串，然后采用Lodop打印控件來直接打印網(wǎng)頁。經(jīng)過實際測試，打印出來的字跡清晰，而且art-template的兼容性在IE5下的功能也是正常的。所以最終就采用該方案
四. 方案落地

art-template模板編寫

上面的可以按照自己的樣式效果，先寫好靜態(tài)頁面，然后在根據(jù)art-template的語法動態(tài)設(shè)置

渲染數(shù)據(jù)：

// 增加過濾器
template.defaults.imports.toFixed = function(num) {
    return Number(num).toFixed(2);
}

var printhtml =  template("print58-tpl", detail);
$("#printerView").html(printhtml);
var height = $("#printerView").outerHeight();  // 為了動態(tài)獲取頁面渲染過后的高度，傳遞到打印控件，指定打印多少。
    // 創(chuàng)建打印頁
    // 初始化小票打印身份信息
    initLodopLicences();
    
    // 創(chuàng)建小票打印頭信息
    //createPayTitle("匯總打印憑證", "匯總信息");
    try{

        LODOP.PRINT_INIT("打印小票");
        LODOP.SET_PRINT_PAGESIZE(3,"58mm",20,"");
        LODOP.ADD_PRINT_HTM("9mm","0mm","RightMargin:0mm",height+"px", printhtml);
        }catch(err){
            
        }
    
    createPayFooter();
    
     // 開始打印
    startPayPrint(pcPrinterName);
五. 總結(jié)

經(jīng)過為期1天左右的時間，從方案的篩選到最終完成功能，學(xué)習(xí)到對于需要打印小票的場景，又多了一點點體會。

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://specialneedsforspecialkids.com/yun/104881.html

相關(guān)文章

  • lodop打印控件的使用

    摘要：失敗原因有前一個打印事務(wù)沒有完成操作系統(tǒng)沒有添加打印機驅(qū)動等。每個打印事務(wù)至少初始化一次，打印程序首先調(diào)用初始化函數(shù)設(shè)定打印紙張為固定紙張或自適應(yīng)內(nèi)容高，并設(shè)定相關(guān)大小值或紙張名及打印方向 web打印解決方案 1.生成打印模版（網(wǎng)頁），使用window.print()預(yù)覽打印模版，在瀏覽器中打印2.導(dǎo)出網(wǎng)頁為excel文件，詳見網(wǎng)頁導(dǎo)出為excel 3.使用lodop打印控件 第一種方...

    lucas 評論0 收藏0

  • web打印一篇就夠，jspdf，wkhtmltopdf

    摘要：前端時間公司有一個項目要批量打印，主要是打印準考證，考試成績，以及考試證書。一句話，一旦出現(xiàn)了問題，修復(fù)起來會非常困難，關(guān)鍵代碼就一行。問題往往出現(xiàn)在，往往在測試環(huán)境沒有問題，在正式環(huán)境上就不行。 前端時間公司有一個項目要批量打印，主要是打印準考證，考試成績，以及考試證書。參考方案，前端打印，后端打印 后端打印 后端打印主要是用wkhtmltopdf這個，這個框架需要在后端安裝一大堆東...

    Miracle 評論0 收藏0

  • web打印一篇就夠，jspdf，wkhtmltopdf

    摘要：前端時間公司有一個項目要批量打印，主要是打印準考證，考試成績，以及考試證書。一句話，一旦出現(xiàn)了問題，修復(fù)起來會非常困難，關(guān)鍵代碼就一行。問題往往出現(xiàn)在，往往在測試環(huán)境沒有問題，在正式環(huán)境上就不行。 前端時間公司有一個項目要批量打印，主要是打印準考證，考試成績，以及考試證書。參考方案，前端打印，后端打印 后端打印 后端打印主要是用wkhtmltopdf這個，這個框架需要在后端安裝一大堆東...

    Galence 評論0 收藏0

  • 購物小票——Python字符串格式化練習(xí)

    摘要：格式化字符串一般用于一些格式化輸出，我們來看一段例子，利用打印輸出一個購物小票。其實學(xué)習(xí)本就是從簡到難，循序漸進的打印結(jié)果如下，簡單的使用了，字符串的對齊，指定寬度，保留小數(shù)點位數(shù)等。 格式化字符串一般用于一些格式化輸出，我們來看一段例子，利用打印輸出一個購物小票。是不是會讓大家想起第一次學(xué)寫代碼，打印三角形，直角三角形等等。其實學(xué)習(xí)本就是從簡到難，循序漸進的 showImg(http...

    Allen 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<