minongyun/application/admin/view/task/taskadd.html

<style>
    table {
        border-collapse: collapse;
        border-spacing: 0;
    }

    td,th {
        padding: 0;
    }

    .pure-table {
        border-collapse: collapse;
        border-spacing: 0;
        empty-cells: show;
        border: 1px solid #cbcbcb;
    }

    .pure-table caption {
        color: #000;
        font: italic 85%/1 arial,sans-serif;
        padding: 1em 0;
        text-align: center;
    }

    .pure-table td,.pure-table th {
        border-left: 1px solid #cbcbcb;
        border-width: 0 0 0 1px;
        font-size: inherit;
        margin: 0;
        overflow: visible;
        padding: .5em 1em;
    }

    .pure-table thead {
        background-color: #e0e0e0;
        color: #000;
        text-align: left;
        vertical-align: bottom;
    }

    .pure-table td {
        background-color: transparent;
    }

    .pure-table-bordered td {
        border-bottom: 1px solid #cbcbcb;
    }

    .pure-table-bordered tbody>tr:last-child>td {
        border-bottom-width: 0;
    }
</style>
<form id="add-form" class="form-horizontal" role="form" data-toggle="validator" method="POST" action="">
    <div id="qrcode" style="margin-left: 80px;">
        <img src="" id="myImage" alt=""/>
    </div>
    <div id="time" style="margin-left: 450px;margin-top: -25px;"></div>
    <div style="height: 10px;"></div>

    <div class="form-group">


        <table id="head"  style="margin-left: 50px;width: 900px" class="pure-table pure-table-bordered">
            {foreach name="task" item="vo" key="key"}
            <thead>
        <tr>
            <th style="width: 150px;">{$vo.bach}</th>
            <th style="width: 350px;">{$vo.name}</th>
            <th style="width: 150px;">生产量:{$vo.number}kg</th>
            <th style="width: 200px;">机台号:{$vo.machine}</th>
        </tr>
        </thead>
            <tbody>
                {foreach name="list[$key]" item="v" key="k"}
                    <tr>
                        <td>{$v.material}</td>
                        <td>{$v.percentage}</td>
                        <td>{$v.num}</td>
                        <td></td>
                    </tr>
                {/foreach}
            </tbody>
            {/foreach}
        </table>




    </div>
    <div class="form-group">
        <table id="foot" style="margin-left: 50px;width: 900px" class="pure-table pure-table-bordered">
            <thead>
            <tr>
                <th colspan="4" style="text-align: center">汇总领料单</th>
            </tr>

            </thead>
            <tbody>
            {foreach name="result" item="v" key="key"}
            <tr>
                <td style="width: 150px;">{$v.material}</td>
                <td style="width: 350px;">{$v.percentage}</td>
                <td style="width: 150px;">{$v.num}</td>
                <td style="width: 200px;">{$v.str}</td>
            </tr>
            {/foreach}
            </tbody>
        </table>
    </div>

</form>
<div class="form-group layer-footer">
    <label class="control-label col-xs-12 col-sm-2"></label>
    <div class="col-xs-12 col-sm-8">
        <button type="reset" class="btn btn-default btn-embossed print">{:__('打印')}</button>
        <!--<button type="submit" class="btn btn-success btn-embossed submit">{:__('保存')}</button>-->

    </div>
</div>
<script src="__CDN__/assets/js/jquery.js"></script>
<script>
    $('.submit').click(function (){
        var headTable = document.getElementById('head');
        var headData = [];
        for(var i=0,rows=headTable.rows.length; i<rows; i++){
            for(var j=0,cells=headTable.rows[i].cells.length; j<cells; j++){
                if(!headData[i]){
                    headData[i] = new Array();
                }
                headData[i][j] = headTable.rows[i].cells[j].innerHTML;
            }
        }
        var footTable = document.getElementById('foot');
        var footData = [];
        for(var k=0,rows=footTable.rows.length; k<rows; k++){

            for(var v=0,cells=footTable.rows[k].cells.length; v<cells; v++){
                if(!footData[k]){
                    footData[k] = new Array();
                }
                footData[k][v] = footTable.rows[k].cells[v].innerHTML;
            }
        }
        $.ajax({
            type: "POST",
            url: "{:url('admin/picking/doAdd')}",
            data: {headData: headData,footData:footData},
            dataType: "json",
            success: function (data) {
                console.log(data)
                if (data.code == 1){
                    layer.confirm(data.msg,5000)
                    var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
                    parent.location.reload();//刷新父页面，注意一定要在关闭当前iframe层之前执行刷新
                    parent.layer.close(); //再执行关闭
                }
            }
        })

    });

</script>
<script type='text/javascript' src='__CDN__/assets/js/jquery2.1.1.min.js'></script>
<script type="text/javascript" src="__CDN__/assets/js/jquery.qrcode.min.js"></script>
<script type="text/javascript" src="__CDN__/assets/js/jQuery.print.js"></script>
<script>
    jQuery(function($) { 'use strict';

        $(".print").on('click', function() {
            var footTable = document.getElementById('foot');

            var txt = footTable.rows[0].innerText.substr(0,11);
            createQrcode(txt,50,50);
            console.log(txt);
            var mydate = new Date();
            var year = mydate.getFullYear();
            var mouth = mydate.getMonth() + 1;
            if (parseInt(mouth)<10){
                mouth = '0'+mouth;
            }
            var date = mydate.getDate();
            if (parseInt(date)<10){
                date = '0'+date;
            }
            var hours = mydate.getHours();
            if (parseInt(hours)<10){
                hours = '0'+hours;
            }
            var minutes = mydate.getMinutes();
            if (parseInt(minutes)<10){
                minutes = '0'+minutes;
            }
            var seconds = mydate.getSeconds();
            if (parseInt(seconds)<10){
                seconds = '0'+seconds;
            }
            var now_time = year+'-'+mouth+'-'+date+' '+hours+':'+minutes+':'+seconds;
            // var img = document.getElementById("myImage"); /// get image element
            var canvas = document.getElementsByTagName('canvas')[0];
            // img.src = canvas.toDataURL();                     /// update image
            $('#time').html(now_time);
            $.print("#add-form");
            $('#qrcode').html('');
            $('#time').html('');
            return false;
        });
        function createQrcode(txt,width,height) {
            $("#qrcode").qrcode({
                render: "canvas",//canvas和table两种渲染方式
                width: width,
                height: height,
                correctLevel:2,//二维码纠错级别
                background:"#ffffff",//背景颜色
                foreground:"#000000", //二维码颜色
                text:txt
            });
        }
    });
</script>