reportV.html 5.92 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">
<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" />-->
    <!--&lt;!&ndash;[if IE]>-->
    <!--<link href="css/font-awesome-ie7.min.css" rel="stylesheet" />-->
    <!--<![endif]&ndash;&gt;-->

    <style type="text/css">
        .table-bordered td, .table-bordered th {
            border: 1px solid #000 !important;
        }

        .table tbody tr td {
            padding: 3px;
            text-align: center;
        }

        element.style {
            width: 500px;
            /*height: auto;*/
            color: #333;
        }
    </style>
</head>

<body id="ddd">
<div class="noprint container" style="text-align:right; /*padding: 20px;*/float: right">
    <span style="padding-left:20px;"><button type="button" onClick="a()"><i class="fa fa-print"></i> 打印</button></span>
</div>
<div class="container" style=" width:320px;/*height:228px;*/color: #333">
    <div class="row">
        <table width="100%" height="auto" border="0" cellspacing="0" cellpadding="0"
               class="dy-report table table-bordered"
               th:each="row:${inventoryReport}">
            <caption style="font-size:18px;text-align:center; color:#333; padding-bottom: 3px;"
                     th:text="${row.companyName}"></caption>
            <tbody>
            <tr>
                <td width="20%" scope="col">项目</td>
                <td colspan="1" scope="col" style="text-align:center">
                    <span th:text="${row.moCode}"></span>
                </td>
                <td  rowspan="3" width="15%" style="padding: 1px">
                    <div class="qrcode"></div>
                </td>
            </tr>
            <tr>
                <td  scope="col">存货编码</td>
                <td  scope="col" style="text-align:center">
                    <span th:text="${row.materialCode}" ></span>
                </td>

            </tr>
            <tr style="vertical-align:middle">
                <td>存货名称</td>
                <td  style="text-align:center">
                    <span th:text="${row.materialName}"></span>
                </td>

            </tr>
            <tr >
                <td >规格型号</td>
                <td colspan="2"  style="text-align:center;padding:0px;">
                    <span style="font-size:10px;display: inline-block; white-space: pre-wrap;" th:text="${row.materialSpec}"></span>
                </td>
            </tr>
            <tr>
                <td>数量</td>
                <td colspan="2"  style="text-align:center; padding: 0">
                    <!--<input name="" type="text" style="line-height:18px;  border:0; text-align:center;" th:text="${receiptDetail.qty}"/>-->
                    <input id="qty" name="qty" th:value="*{row.qty}" class="form-control" type="text" style="text-align:center;height:30px;border: none"/>
                </td>
            </tr>
            </tbody>
        </table>
    </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/qrcode/qrcode.min.js"></script>
<script type="text/javascript">
    function a() {
        // $("#ddd").jqprint();
        $(".qrcode").children().remove();
        print_qrcode();
        window.print();
    }

    function print_qrcode() {
        $('.dy-report').each(function (i, item) {
            // var company = $(this).children()[1].children[0].innerText;
            // var code16 = $(this).children()[1].children[1].innerText;
            // var name = $(this).children()[1].children[2].innerText;
            // var spec = $(this).children()[1].children[3].innerText;
            // let moCode = $(this).children()[1].children[4].innerText;
            // company = company.substring(5);
            // code16 = code16.substring(5);
            // name = name.substring(5);
            // spec = spec.substring(5);
            // var reg = /\t/;
            // name = name.replace(reg, "");
            // var qty = $(this).find('input').val();
            // var company=$(this).children()[1].children[0].innerText;
            var materialCode=$(this).children()[1].children[1].innerText.substring(4);
            // var code16=$(this).children()[1].children[1].innerText;
            // console.log($(this).children()[1].children)
            //存货代码
            var name = $(this).children()[1].children[2].innerText.substring(4);
            var spec = $(this).children()[1].children[3].innerText.substring(4);
            // var materialName = $(this).children()[1].children[3].innerText;
            let moCode = $(this).children()[1].children[0].innerText.substring(2);

            // project=project.substring(5);
            var qty=$("#qty").val();
            // var code_text=company+'/'+ code16 +'/' +name+'/'+spec+'/'+qty+'/'+project;
            // var code_text=company+'/'+ name +'/'+qty+'/'+moCode;
            let code_text = materialCode.replace(/\s+/g, "") + "||||" +
                name.replace(/\s+/g, "") + "||" + spec.replace(/\s+/g, "") +
                "||" + qty + "||" + moCode.replace(/\s+/g, "");
            var QRcode = new QRCode($(this).find('.qrcode')[0], {
                text: code_text,
                width: 80,
                height: 80,
                correctLevel: QRCode.CorrectLevel.L
            });
        });
    }

    print_qrcode();

</script>

</body>
</html>