report.html 4.49 KB
<!DOCTYPE HTML>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<meta charset="utf-8">
<head th:include="include :: header"></head>
<body class="white-bg" style="padding:5px 0;" id="ddd">
<div class="container" style="color: #333;">
	<div class="row">
        <table id="reportTable" width="100%" border="0" cellspacing="0" cellpadding="0" class="dy-report">
            <thead style="display:table-header-group;">
            <tr>
                <td colspan="10">
                    <span style="padding-top:40px;width: 40%; float:left;" class="time_c"></span>
                    <h2 style="width:24%;text-align:center;float:left;padding-top:10px;">调整单</h2>
                    <span style="padding-top:20px;width:35%;float:right; text-align: right"><img id="code" th:data="${adjustHeader['code']}"></img></span>
                </td>
            </tr>
            <tr style="padding:15px 0 5px 0;border-bottom:1px solid #606060">
                <td colspan="10">
                    <div style="width:40%; float:left;">&nbsp;</span></div>
                    <div style="width:60%; float:right; text-align:right">
                        <span class="noprint" style="padding-left:20px;"><button type="button" onClick="a()"><i class="fa fa-print"></i> 打印</button></span>
                    </div>
                </td>
            </tr>
            <tr>
                <th width="9%">容器</th>
                <th width="9%">明细id</th>
                <th width="15%">物料编码</th>
                <th width="14%">物料名称</th>
                <th width="9%">系统数</th>
                <th width="9%">实际数</th>
                <th width="9%">差异数</th>
                <th width="8%">调整数</th>
                <th width="18%">条码</th>
            </tr>
            </thead>
            <tbody>
            <tr th:each="row,rowStat : ${adjustDetails}">
                <td th:text="${row.containerCode}"></td>
                <td th:text="${row.id}"></td>
                <td th:text="${row.materialCode}"></td>
                <td th:text="${row.materialName}"></td>
                <td th:text="${row.systemQty}"></td>
                <td th:text="${row.countedQty}"></td>
                <td th:text="${row.gapQty}"></td>
                <td th:text="${row.adjustQty}"></td>
                <td><img></img></td>
            </tr>
            </tbody>
        </table>
    </div>
</div>
<div th:include="include :: footer"></div>
<script type="text/javascript" src="../../../js/barcode/JsBarcode.all.js"></script>
<script th:inline="javascript">

    var res=[[${adjustHeader.created}]];
    res=res.replace("T"," ");
    res=res.substr(0,19);
    $(".time_c").text(res);

    var  barcodeStyle = {
                format: "CODE128",//选择要使用的条形码类型
                width:1,//设置条之间的宽度
                height:40,//高度
                displayValue:true,//是否在条形码下方显示文字
                // text:"456",//覆盖显示的文本
                // fontOptions:"bold italic",//使文字加粗体或变斜体
                font:"monospace",//设置文本的字体fantasy
                textAlign:"center",//设置文本的水平对齐方式
                textPosition:"bottom",//设置文本的垂直位置
                textMargin:1,//设置条形码和文本之间的间距
                fontSize:12,//设置文本的大小
                background:"#ffffff",//设置条形码的背景
                lineColor:"#000000",//设置条和文本的颜色。
                margin:1//设置条形码周围的空白边距
    };

    $("#code").JsBarcode($("#code").attr("data"), barcodeStyle);

    // for (var i=0; i<$('#reportTable tbody tr').length; i++){
    //     var barcodeText = $("#reportTable tbody tr:eq("+ i +") td:eq(0)").innerText;
    //     $("#reportTable tbody tr:eq("+ i +") td:eq(6) canvas").JsBarcode("6666", barcodeStyle);
    // }

    $('#reportTable tbody tr').each(function(i) {
        var barcodeText = $(this).children()[0].innerText;
        JsBarcode($(this).children()[8].querySelector("img"), barcodeText, barcodeStyle);
    });


</script>
<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">
    function a(){
        // $("#ddd").jqprint();
        window.print();
    }
</script>
</body>
</html>