Web打印 Lodop打印控件 bootstrap框架

貼圖 
這裏寫圖片描述 




知乎:顯著提升程序員身心健康和工作效率的裝備有哪些?

  1. 筆記本: 
    1.銀河艦隊 PAVILION 15-bc011TX光暗影精靈2 
    2.頑石 —FL5900U7500超薄i7(性價比最高) 

  2. 鍵盤: 
    1.機械鍵盤:FILCO 聖手 87鍵 紅軸(日)櫻桃(Cherry)G80-3000 茶軸 
    (德)
    DUCKY 
    2087S(臺)
     
    2.靜電容:HHKB(日) 
    3.情懷插入:小黑USB鍵盤 ThinkPad USB Track Point 鍵盤 0B47082 

  3. 顯示器:Eizo,戴爾,三星,明基,22寸以上(AOC C3208VW8 32英寸曲屏) 

  4. PC配置:i7,16G,SSD,雙顯示器 

  5. 電腦椅:Aeron Chair(個人經濟承受能力下,最貴的) 

  6. 萌妹紙一枚(多多益善,不過太多小心受用不起) 

  1. IDE:

    1.Win(Visual Studio)
    2.Linux(Vim,其他真的還有必要說嗎?)
    3.Mac(Xcode,CodeRunner,SnippetsLab)
    4.跨平臺(Pycharm,UltraEdit,Eclipse,Source Insight,Codeblocks)
    5.插件(Visual Assist X,Pydev)
    
  2. 耳機: 
    1.聽音樂:AKG Q460 
    2.玩遊戲:賽睿西伯利亞 v1,v2

貼圖 
這裏寫圖片描述 


一、下載Lodop打印控件 http://www.lodop.net/


二、將解壓的Lodop文件夾加入到項目中




三、在web頁面中引入Lodop的js文件

    
<script src="../Scripts/Lodop/LodopFuncs.js"></script>
    <object id="LODOP_OB" classid="clsid:2105C259-1E0C-4534-8141-A753534CB4CA" width="0" height="0">
        <embed id="LODOP_EM" type="application/x-print-lodop" width="0" height="0" pluginspage="../Scripts/Lodop/install_lodop.exe"></embed>
    </object>

 <script>
 var LODOP; //聲明爲全局變量   
 function preview(){ 
myPreview2();
        };
function preview_2() {
            CreateOneFormPage_2();
            LODOP.PREVIEW();
        };
        function CreateOneFormPage() {
            LODOP = getLodop();
            LODOP.PRINT_INIT("打印控件功能演示_Lodop功能_表單一");
            LODOP.SET_PRINT_STYLE("FontSize", 18);
            LODOP.SET_PRINT_STYLE("Bold", 1);
            LODOP.SET_PRINT_PAGESIZE(0, "1064", "200", "A4");//動態紙張
            //LODOP.ADD_PRINT_TEXT(50, 231, 260, 39, "打印頁面部分內容");
            LODOP.ADD_PRINT_HTM(88, 200, 350, 600, document.getElementById("PrintHTML").innerHTML);
            LODOP.PREVIEW();
        };
</script>

<a style="cursor: pointer;" οnclick="preview()">打印</a>



<!-- 打印 樣式 -->
    <div id="PrintHTML" style="background-color: white;">
        <table style="width: 100%;">
            <tr>
                <td colspan="3" style="height: 25px; text-align: center; font-weight: bold; font-size: 14px;">上海XX有限公司(上海旗艦店)</td>
            </tr>
            <tr>
                <td colspan="3" style="height: 25px; text-align: center; font-size: 14px;">定金單</td>
            </tr>
            <tr>
                <td style="width: 50%; height: 25px; font-size: 12px; text-align: left;" id="Print_CustomerInformation">客戶:王某某    電話:13011112222    卡號:8021656090    渠道:1000000    到貨通知:不通知</td>
                <td style="width: 10%; height: 25px;"></td>
                <td style="width: 40%; height: 25px; font-size: 12px; text-align: right;" id="Print_DateString">出貨:14.10.10    開單:14.10.02    NO:535063</td>
            </tr>
            <tr>
                <td colspan="3" style="width: 100%; height: 25px; font-size: 12px;" id="Print_SendGoodsInformation">[寄貨]123212  上海市上海市閘北區西藏北路9898號  (聯繫人:劉某某  13817489878)
                </td>
            </tr>
        </table>
        <table style="width: 100%; border: solid 1px black; border-collapse: collapse; table-layout: fixed; margin-top: 5px;" id="Print_OsaledInformation">
            <thead>
                <tr>
                    <th style="width: 10%; font-size: 12px; text-align: center; border: 1px solid black;">條碼<br />
                        單內ID
                    </th>
                    <th style="width: 15%; font-size: 12px; text-align: center; border: 1px solid black;">名稱<br />
                        款號(鑲口範圍)
                    </th>
                    <th style="width: 10%; font-size: 12px; text-align: center; border: 1px solid black;">證書
                    </th>
                    <th style="width: 10%; font-size: 12px; text-align: center; border: 1px solid black;">重量
                    </th>
                    <th style="width: 15%; font-size: 12px; text-align: center; border: 1px solid black;">參數
                    </th>
                    <th style="width: 10%; font-size: 12px; text-align: center; border: 1px solid black;">原價<br />
                        成品價
                    </th>
                    <th style="width: 30%; font-size: 12px; text-align: center; border: 1px solid black;">單內備註
                    </th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td style="font-size: 12px; text-align: center; border: 1px solid black;">00396097<br />
                        888852
                    </td>
                    <td style="font-size: 12px; text-align: center; border: 1px solid black;">GIA
                    </td>
                    <td style="font-size: 12px; text-align: center; border: 1px solid black;">GIA-17097234</td>
                    <td style="font-size: 12px; text-align: center; border: 1px solid black;">0.6ct</td>
                    <td style="font-size: 12px; text-align: center; border: 1px solid black;">VS1 G VG VG EX</td>
                    <td style="font-size: 12px; text-align: center; border: 1px solid black;">19590<br />
                        19590</td>
                    <td style="font-size: 12px; border: 1px solid black; word-wrap: break-word; padding-left: 4px;">保留裸鑽 無內刻</td>
                </tr>
                <tr>
                    <td style="font-size: 12px; text-align: center; border: 1px solid black;">26606188<br />
                        888853</td>
                    <td style="font-size: 12px; text-align: center; border: 1px solid black;">鉑900鑽石對戒<br />
                        RB939</td>
                    <td style="font-size: 12px; text-align: center; border: 1px solid black;">2014I1274123766</td>
                    <td style="font-size: 12px; text-align: center; border: 1px solid black;">3.674 g 主:0.079ct*28</td>
                    <td style="font-size: 12px; text-align: center; border: 1px solid black;">----</td>
                    <td style="font-size: 12px; text-align: center; border: 1px solid black;">3250<br />
                        3250</td>
                    <td style="font-size: 12px; border: 1px solid black; word-wrap: break-word; padding-left: 4px;">保留異調(成都-上海) 對戒 材質:鉑900 手寸:11 無內刻 表面處理:拋光</td>
                </tr>
            </tbody>
            <tfoot>
                <tr>
                    <td rowspan="1" colspan="7" style="font-size: 12px; height: 50px; border: 1px solid black;"></td>
                </tr>
                <tr>
                    <td colspan="6" style="font-size: 12px; height: 30px; text-align: left; border: 1px solid black; padding-left: 20px;" id="Print_AmountName">實收金額(大寫):<b>伍佰零拾零元零角</b>(E1411-0000043  現金)</td>
                    <td style="font-size: 12px; text-align: left; border: 1px solid black; padding-left: 20px;" id="Print_osaled_earnest">定金:500</td>
                </tr>
            </tfoot>
        </table>
        <table style="width: 100%; table-layout: fixed; margin-top: 20px;">
            <tr>
                <td style="width: 50%; height: 25px; font-size: 12px; text-align: left; font-weight: bold;">客戶須知
                    <ol>
                        <li>定金單作爲取貨的重要憑證,請您妥善保管,結單時請同時攜帶定單及身份證件。</li>
                        <li>非定製類商品訂單有效期30天,即於定金單顯示的出貨日期30天內結單,定製類商品(刻
                            字屬於定製類商品)訂單有效期60天,即於定金單顯示的出貨日期60天內結單,如客戶未能
                            按時結單,則視爲合同自動解除,XXXX所收定金將視爲違約金,不予返還
                        </li>
                        <li>如過出貨日期仍未收到我們的到貨通知,請儘快聯繫我們的客服中心,查詢定單具體情況。
                        </li>
                    </ol>
                </td>
                <td style="width: 10%; height: 25px;"></td>
                <td style="width: 40%; height: 25px; font-size: 12px; text-align: center; vertical-align: middle;">上海旗艦店:南京東路XXX號XX廣場8層 (九江路XXX號側門電梯直達)<br />
                    客服電話:400-880-00XX<br />
                    專業XX網站:www.XX.com
                </td>
            </tr>
        </table>
        <table style="width: 100%; border-collapse: collapse; margin-top: 20px;">
            <tr>
                <td style="font-size: 12px; text-align: left;">營業員:0000    收銀員:0096</td>
                <td style="font-size: 12px; text-align: left;">銷售(簽字):<input type="text" style="border: 0px; border-bottom: 1px solid black;" /></td>
                <td style="font-size: 12px; text-align: left;">顧客(簽字):<input type="text" style="border: 0px; border-bottom: 1px solid black;" /></td>
                <td style="font-size: 12px; text-align: right;">★號代表刻愛心符號<br />
                    取貨憑證自取貨日起保留期一年</td>
            </tr>
            <tr>
                <td colspan="4" style="font-size: 12px; height: 40px; text-align: right;">1/1</td>
            </tr>
        </table>
    </div>
    <!-- 打印 樣式 -->





四、打印預覽





五、問題說明

    有些chrome瀏覽器會出現奔潰問題,其實不是瀏覽器奔潰無反應是假死狀態。針對這個Lodop對谷歌瀏覽器停用Plugin技術的處理辦法:http://blog.sina.com.cn/s/blog_55c109190101sadd.html


貼圖 
這裏寫圖片描述 




知乎:顯著提升程序員身心健康和工作效率的裝備有哪些?

  1. 筆記本: 
    1.銀河艦隊 PAVILION 15-bc011TX光暗影精靈2 
    2.頑石 —FL5900U7500超薄i7(性價比最高) 

  2. 鍵盤: 
    1.機械鍵盤:FILCO 聖手 87鍵 紅軸(日)櫻桃(Cherry)G80-3000 茶軸 
    (德)
    DUCKY 
    2087S(臺)
     
    2.靜電容:HHKB(日) 
    3.情懷插入:小黑USB鍵盤 ThinkPad USB Track Point 鍵盤 0B47082 

  3. 顯示器:Eizo,戴爾,三星,明基,22寸以上(AOC C3208VW8 32英寸曲屏) 

  4. PC配置:i7,16G,SSD,雙顯示器 

  5. 電腦椅:Aeron Chair(個人經濟承受能力下,最貴的) 

  6. 萌妹紙一枚(多多益善,不過太多小心受用不起) 

  1. IDE:

    1.Win(Visual Studio)
    2.Linux(Vim,其他真的還有必要說嗎?)
    3.Mac(Xcode,CodeRunner,SnippetsLab)
    4.跨平臺(Pycharm,UltraEdit,Eclipse,Source Insight,Codeblocks)
    5.插件(Visual Assist X,Pydev)
    
  2. 耳機: 
    1.聽音樂:AKG Q460 
    2.玩遊戲:賽睿西伯利亞 v1,v2

貼圖 
這裏寫圖片描述 



發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章