{% load i18n %}
<style>
    #data-content table tbody td{
        color:black;
    }  
   
    #no_form .label_infor span{
        color:green;
        font-weight:bold;
    }  
</style>


<ol class="breadcrumb">
        <li> {% trans "瓶盖码数据" %}</li>
        <li> {% trans "瓶盖码查询" %}</li>
</ol>


<script type="text/javascript">
    $(document).ready(function(){        

        $('#code').keydown(function (event) {
            if (event.keyCode == 13) {
                var code=$.trim($('#code').val());   
                refresh(code);
            }
        });    

        $('.btn-qry').click(function(){
            var code=$.trim($('#code').val());            
            if(code.length<10){                
                toastr.error(
                    "{% trans '请先输入您要查询的盖码!' %}",
                    "操作错误：",
                    {timeOut: 800, positionClass: "toast-center-center"}
                );
                return;
            };
            refresh(code);
        });



        function refresh(code){           
            $.ajax({
                type:'GET',                           
                url:'/bottlecap/infor/ajax/?code='+$('#code').val(),                
                dataType:'json',
                success: function(data) {
                    if(data.e!=''){
                        toastr.error( data.e,  "数据错误：",  {timeOut: 800, positionClass: "toast-center-center"} );                    
                    }else{
                        var d=data['data'];
                        $('#label_type,#label_cap,#label_outer,#cap_fcty,#cap_tm,#cap_zip').html('');
                        $('#tb_inform tbody,#tb_binding tbody').html('');
                        if(d.label_type=='' && $.isEmptyObject(d.inform)){
                            toastr.error(
                                "没有查询到该盖码任何信息",  "数据错误：",  {timeOut: 800, positionClass: "toast-center-center"}
                            );
                        }else{ 
                            $('#label_type').text(d.label_type);
                            $('#label_cap').text(d.fcty_binding.cap);
                            $('#label_outer').text(d.fcty_binding.outter);
                            if(!$.isEmptyObject(d.inform)){
                                var tr_inform='<tr>'+
                                    '<td>'+d.inform.code+'</td>'+
                                    '<td>'+d.inform.id+'</td>'+
                                    '<td>'+d.inform.dt+'</td>'+
                                    '<td>'+d.inform.product+'</td>'+
                                    '<td>'+d.inform.qty+'</td>'+
                                    '<td>'+d.inform.segment+'</td>'+
                                    '<td>'+d.inform.sn_fr+'</td>'+
                                    '<td>'+d.inform.sn_to+'</td>'+
                                    '</tr>';
                                $('#tb_inform  tbody').html(tr_inform);
                            };
                            if(!$.isEmptyObject(d.fcty_binding)){    
                                var tr_binding='<tr>'+
                                    '<td>'+d.fcty_binding.factory+'</td>'+
                                    '<td>'+d.fcty_binding.cap+'</td>'+
                                    '<td>'+d.fcty_binding.outter+'</td>'+
                                    '<td>'+d.fcty_binding.tm+'</td>'+
                                    '<td>'+d.fcty_binding.file+'</td>'+
                                    '<td>'+d.fcty_binding.size+'</td>'+
                                    '<td>'+d.fcty_binding.lines+'</td>'+
                                    '<td>'+d.fcty_binding.cnt+'</td>'+
                                    '</tr>';                                
                                $('#tb_binding tbody').html(tr_binding);
                            }
                        }
                    }
                }
            }); 
        }
    });
</script>
 

<div class='x_panel'>

<div class='clearfix'></div>
<div class='tt'>
    <form role="form" id='no_form' class="form-inline">   
    <div class='input-group col-sm-2'>
        <input id='code' class='form-control' placeholder="{% trans '请输入盖码，点击查询按钮或按回车键查询' %}"/>     
    </div>
    <div class='input-group col-sm-1'>
        <span class='input-group-btn pull-right'>
            <button  type="button" class='btn btn-primary btn-qry'>
                <span class='glyphicon glyphicon-search' style='padding-right:5px;'></span>{% trans "查询" %}
            </button>
        </span>
    </div>
    <div class='input-group col-sm-12 label_infor' style='margin-top:20px;'>
        <div class='col-sm-4'>码类型:<span id='label_type'></span></div>
        <div class='col-sm-4'>盖内码:<span id='label_cap'></span></div>
        <div class='col-sm-4'>盖外码:<span id='label_outer'></span></div>
    </div>
    </form>
</div>
<div class="table-responsive" >
    <div style='margin-top:40px;'>业务通知单：</div>
    <table id='tb_inform' class='table table-bordered table-condensed table-hover'>
        <thead><tr>            
            <td>单号</td><td>ID</td><td>日期</td><td>产品</td><td>码数量</td><td>号段</td><td>起始</td><td>结束</td>                    
        </tr></thead>
        <tbody></tbody>
    </table>
    <div style='margin-top:40px;'>瓶盖厂信息：</div>
    <table id='tb_binding' class='table table-bordered table-condensed table-hover'>
        <thead><tr>
            <td>瓶盖厂</td><td>盖内码</td><td>盖外码</td><td>上传时间</td><td>zip文件</td><td>大小(MB)</td><td>文本行数</td><td>写入数量</td>       
        </tr></thead>
        <tbody></tbody>
    </table>
</div>
</div>
