print.html 4.87 KB
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <head th:include="include :: header"></head>
    <title>盛具</title>
    <link href="css/bootstrap.min.css" rel="stylesheet"/>
    <link href="css/font-awesome.min.css" rel="stylesheet"/>
    <link href="css/font-awesome-ie7.min.css" rel="stylesheet"/>
    <style type="text/css">
        body, ul, li {
            padding: 0;
            margin: 0;
        }

        ul, li {
            list-style: none;
        }

        .table-bordered td, .table-bordered th {
            border: 0px solid #000 !important
        }

        .ewm_w ul {
            width: 500px;
            margin: 0 auto;
        }

        .ewm_w li {
            width: 500px;
            height: 228px;
            padding: 0px;
            margin: 0px auto;
            display: inline-table;
        }

        .ewm_w {
            width: 156px;
            float: left;
            padding-left: 0px;
        }

        .r_two {
            padding-left: 20px;
        }
    </style>
</head>

<body>
<div class="container">
    <div class="row" style="text-align:right"><span class="hidden-print" style="padding-left:20px;"><button
            type="button" onClick="a()"><i class="fa fa-print"></i> 打印</button></span></div>
    <div class="row" style="width:500px;padding:0px 0px; margin:0 auto">
        <div style="width: 312px; margin:0;padding:0;">
            <div th:each="row:${container}">
                <div class="ewm_w">
                    <table style="height: 220px; margin:0;padding:0;" border="0" cellspacing="0" cellpadding="0"
                           class="dy-report table table-bordered">
                        <!--th:each="row:${container}">-->
                        <tbody>
                        <tr>
                            <td align="center">
                                <img id="barcode" name="rotate"/>
                                <input th:value="${row.code}" id="code" type="hidden" name="code"/>
                            </td>
                        </tr>
                        </tbody>
                    </table>
                </div>
                <div class="ewm_w">
                    <table style="height: 220px; margin:0;padding:0;" border="0" cellspacing="0" cellpadding="0"
                           class="dy-report table table-bordered">
                        <tbody>
                        <tr>
                            <td align="center">
                                <img id="barcode" name="rotate"/>
                                <input th:value="${row.code}" id="code" type="hidden" name="code"/>
                            </td>
                        </tr>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>

<div th:include="include :: footer"></div>
<style type="text/css">
    @media print {
        .noprint {
            display: none;
        }
    }
</style>
<script type="text/javascript" src="../../../js/jquery-1.4.4.min.js"></script>
<script type="text/javascript" src="../../../js/jquery.jqprint-0.3.js"></script>
<script type="text/javascript" src="../../../js/barcode/JsBarcode.all.js"></script>
<script type="text/javascript">
    var barcodeStyle = {
        format: "CODE128",//选择要使用的条形码类型
        width: 2,//设置条之间的宽度
        height: 70,//高度
        displayValue: true,//是否在条形码下方显示文字
        // text:"456",//覆盖显示的文本
        // fontOptions:"bold italic",//使文字加粗体或变斜体
        font: "monospace",//设置文本的字体fantasy
        textAlign: "center",//设置文本的水平对齐方式
        textPosition: "bottom",//设置文本的垂直位置
        textMargin: 1,//设置条形码和文本之间的间距
        fontSize: 35,//设置文本的大小
        background: "#ffffff",//设置条形码的背景
        lineColor: "#000000",//设置条和文本的颜色。
        margin: 1//设置条形码周围的空白边距
    };

    function print_qrcode() {
        $('.dy-report').each(function (i, item) {
            var code = document.getElementsByName("code")[i].getAttribute("value");
            $(this).find('#barcode').JsBarcode(code, barcodeStyle);
            document.getElementsByName("rotate")[i].style.transform = 'rotate(' + 90 + 'deg)';
        });
    }

    print_qrcode();
</script>

<script type="text/javascript" src="../../../js/jquery-1.4.4.min.js"></script>
<script type="text/javascript" src="../../../js/jquery.jqprint-0.3.js"></script>
<script type="text/javascript">
    function a() {
        window.print();
    }
</script>

</body>
</html>