{% load i18n %}
<style>
    #data-content .div_x .sn, #data-content .sn-s{
        width:210px;
    }
    #data-content .div_detail .sn{
        width:100px;
    }

    #label_info{
        max-height: 500px;
        overflow-y: auto;
    }
    
    .g{
        color:green;
        font-weight:bold;
    }
    .b{
        color:black;
    }
    .r{
        color:red;
        font-weight:bold;
    }
    #stk_dev thead td{
        color:black;
    }

    #qry_code{
        padding-bottom:0px;
        margin-bottom:0px;    
    }
    #relations td .replace{
        margin-left:10px;
        font-style:italic;
        color:red;
        font-weight:bold;
    }
    #product{
        margin-bottom:20px;
    }
    #div_boxes{
        max-height:400px;
    }


    td.unprocessed .unprocessed div {
        color:gray;
        font-style:italic;

    }


   .tooltip-inner{            

        max-width: 600px;
   }

   


</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());
                if(code.length>=12){
                    refresh(code);
                }
            }
        });         

        $('.btn-qry').click(function(){
            var code=$.trim($('#code').val());            
            if(code.length<12){                
                toastr.error(
                    "{% trans '请先输入您要查询的标签号码!' %}",
                    "操作错误：",
                    {timeOut: 800, positionClass: "toast-center-center"}
                );
                return;
            };
            refresh(code);
        });
        function refresh(code){
            //清空数据
            $('#div_cartons tbody,#div_boxes tbody,#stk_dev tbody,#product').html('').hide();                
            $('#qry_code').html('');
            $.ajax({
                type:'GET',                           
                url:'/inventory/get/label/infor/?code='+code,                
                dataType:'json',
                success: function(d) {   
                    if(d.e!=''){                        
                        toastr.error(
                            d.e,
                            "错误：",
                            {timeOut: 800, positionClass: "toast-center-center"}
                        );
                        return ;
                    };    

                    var s='';                   
                    for (var i in d.product.property){                        
                        s=s+'<span style="margin-left:30px;">'+d.product.property[i].desc_cn+':<span class="g">'+
                            d.product.property[i].value+'</span>'+d.product.property[i].unit+'</span>';
                    };       
                    
                    $('#product').html(
                        '<div class="row">'+
                            '<div class="col-md-2"><span>{% trans "标签号码:" %}</span><span class="g">'+d.infor.code+'</span></div>'+
                            '<div class="col-md-1"><span>{% trans "类型:" %}</span><span class="g">'+d.package.name+'</span></div>'+                            
                            '<div class="col-md-9">'+
                                '<span>{% trans "产品名称:" %}</span><span class="g">'+d.product.name+'</span>'+
                                '<span style="margin-left:20px;">{% trans "价格:" %}</span><span class="g">'+d.product.price+'</span>'+s+
                            '</div>'+
                        '</div>'
                    );

                    var cartons='',boxes='',stk_dev='',r,s='',cls='',sFw='';     
                    if (d.relations.level==2){
                        cartons='<tr style="color:black;"><td colspan=2>箱标</td></tr>';
                        for (var i in d.relations.cartons){ 
                            //cartons=cartons+'<tr><td style="width:20%;">'+(1+parseInt(i))+'</td><td>'+
                            //    '<span '+(d.relations.cartons[i].label==code?' class="g"':'')+'>'+d.relations.cartons[i].label+'</span>'+                                
                            //    (d.relations.cartons[i].dt_replace==''?'':'<span class="replace">此标签有替换记录 '+
                            //        d.relations.cartons[i].dt_replace+" "+d.relations.cartons[i].code0+'->'+d.relations.cartons[i].code+'</span>')+                                       
                            //    '</td></tr>'; 

                            cartons=cartons+'<tr><td style="width:30%;">'+(1+parseInt(i))+'</td><td>'+
                                '<span'+((d.infor.ab_bindding?d.relations.cartons[i].code_b:d.relations.cartons[i].label)==code?' class="g"':'')+'>'+
                                         (d.infor.ab_bindding?d.relations.cartons[i].code_b:d.relations.cartons[i].label)+'</span>'+                                
                                         (d.relations.cartons[i].dt_replace==''?'':'<span class="replace">此标签有替换记录'+
                                            d.relations.cartons[i].dt_replace+" "+d.relations.cartons[i].code0+'->'+d.relations.cartons[i].code+'</span>')+                                       
                                '</td></tr>';       
                        };
                        r=d.relations.children;
                        if(r.length>0){
                                boxes=boxes+'<tr style="color:black;"><td colspan=2>瓶标</td></tr>';
                        };                           
                        for (var j in r){                               
                            s="";
                            if(r[j].is_bottlecap){
                                if(! r[j].complete){                              
                                    cls='unprocessed';
                                };                                
                            }else{
                                if(! r[j].bottlecap.complete){                                   
                                    cls='unprocessed';
                                };                            
                            };

                            if(r[j].bottlecap.code!=''){
                                s='<span class="'+cls+'">'+
                                    '<span title="瓶盖物流码:'+r[j].bottlecap.code+'" data-placement="left" data-toggle="tooltip"></span>'+
                                '</span>';
                            };
                            //2021-11-29
                            if(r[j].fw!=''){
                                sFw='<span>'+
                                    '<span title="防伪码:'+r[j].fw+'" data-placement="left" data-toggle="tooltip"></span>'+
                                '</span>';
                            };


                            console.log(sFw);
                            
                            //boxes=boxes+'<tr><td style="width:20%;">'+(1+parseInt(j))+'</td>'+
                            //    '<td class="'+cls+'"><span '+(r[j].label==code?' class="g"':'')+'>'+s+r[j].label+'</span>'+
                            //        (r[j].dt_replace==''?'':'<span class="replace">此标签有替换记录 '+
                            //        r[j].dt_replace+' '+r[j].code0+' -> '+r[j].code+'</span>')+                                    
                            //    '</td></tr>';
                            boxes=boxes+'<tr><td style="width:30%;">'+(1+parseInt(j))+'</td>'+'<td class="'+cls+'"><span'+((d.infor.ab_bindding?r[j].code_b:r[j].label)==code?'class="g"':'')+'>'+s+sFw+
                                    (d.infor.ab_bindding?(r[j].code_b==''?r[j].label:r[j].code_b):r[j].label)+'</span>'+
                                    (r[j].dt_replace==''?'':'<span class="replace">此标签有替换记录 '+
                                    r[j].dt_replace+' '+r[j].code0+' -> '+r[j].code+'</span>')+                                    
                                '</td></tr>';
                        };                           
                        
                    } else {                       
                        for (var i in d.relations.cartons){ 
                            cartons=cartons+'<tr><td style="width:5%;">箱标</td><td><span '+
                                ((d.infor.ab_bindding?d.relations.cartons[i].code_b:d.relations.cartons[i].label)==code?' class="g"':'')+'>'+
                                (d.infor.ab_bindding?d.relations.cartons[i].code_b:d.relations.cartons[i].label)+'</span>'+
                                (d.relations.cartons[i].dt_replace==''?'':'<span class="replace">此标签有替换记录 '+
                                    d.relations.cartons[i].dt_replace+" "+d.relations.cartons[i].code0+'->'+d.relations.cartons[i].code+'</span>')+                                
                                '</td></tr>';
                        };
                        for (var j in d.relations.children){
                                r=d.relations.children[j];
                                boxes=boxes+'<tr><td style="width:5%;">'+(1+parseInt(j))+'</td><td style="width:5%;">盒标</td>'+
                                    '<td colspan=2>'+
                                        '<span '+((d.infor.ab_bindding?r.code_b:r.label)==code?' class="g"':'')+'>'+(d.infor.ab_bindding?r.code_b:r.label)+'</span>'+
                                        (r.dt_replace==''?'':'<span class="replace"> 此标签有替换记录 '+
                                            r.dt_replace+' '+r.code0+'->'+r.code+'</span>')+                                    
                                    '</td></tr>';
                                for (var k in r.children){
                                    boxes=boxes+'<tr><td></td><td style="width:5%;">'+(1+parseInt(k))+
                                        '</td><td colspan=2>瓶标 <span '+
                                            ((d.infor.ab_bindding?(r.children[k].code_b==''?r.children[k].code_a:r.children[k].code_b):r.children[k].label)==code?' class="g"':'')+
                                        '>'+
                                        (d.infor.ab_bindding?(r.children[k].code_b?r.children[k].code_b:r.children[k].code_a):r.children[k].label)+
                                        '</span>'+
                                        (r.children[k].dt_replace==''?'':'<span class="replace">此标签有替换记录 '+
                                            r.children[k].dt_replace+' '+r.children.code0+'->'+r.children.code)+
                                        '</span></td></tr>';
                                }
                        };
                                                                               
                    };

                    $('#div_cartons table tbody').append(cartons);   
                    $('#div_boxes table tbody').html(boxes);                           
                    if (d.stock_development.length>0){
                        stk_dev='<tr style="color:black;"><td>时间</td><td>单据类型</td><td>单据编号</td><td>公司名称</td><td>操作员</td>'+                        
                            '<td>标签号码</td><td>类型</td><td>产品名称</td><td>仓库名称</td><td>客户名称</td></tr>';
                    };
                    for(var i in d.stock_development){                        
                        r=d.stock_development[i];
                        s=r.customer;                 
                        if(r.vtype_id==3){
                            store=r.store_to;
                        }else{
                            store=r.store;
                        };
                        stk_dev=stk_dev+'<tr><td>'+r.tm+'</td><td>'+r.voucher+'</td><td>'+r.bill_no+'</td><td>'+r.company+'</td><td>'+r.user+'</td>'+                        
                            '<td>'+r.label_code+'</td><td>'+r.label_pkg+'</td><td>'+r.product+'</td><td>'+store+'</td><td>'+s+'</td></tr>';                    
                    };                    
                    $('#stk_dev tbody').html(stk_dev);

                    $('#div_cartons tbody,#div_boxes tbody,#stk_dev tbody,#product').show();    

                    $('#div_boxes [data-toggle="tooltip"]').tooltip('show');
                    //2020-10-29  解绑 HOVER, 鼠标移出时，盖码信息保持显示
                    $('#div_boxes [data-toggle="tooltip"]').unbind('mouseenter').unbind('mouseleave');                      
                }
            });
        }
    });
</script>
 

<div class='x_panel'>
<br/>

<div class='tt'>
    <div class='input-group'>
        <input id='code' class='datepicker form-control' placeholder="{% trans '请输入标签号码，点击查询按钮或按回车键查询' %}"/>
        <span class='input-group-btn'>
            <button  type="button" class='btn btn-primary btn-qry'>
                <span class='glyphicon glyphicon-search' style='padding-right:5px;'></span>{% trans "查询" %}
            </button>
        </span>
    </div>
</div>

<div class='clearfix'></div>
<div id='qry_code'></div>
<div id='lbl_replace'></div>


<div id="product" style='display:none'></div>
<div id="relations" >
    <div id='div_cartons' class='table-responsive'>
        <table class='table table-bordered table-condensed table-hover'><tbody></tbody></table>
    </div>
     <div id='div_boxes' class='table-responsive'>
        <table class='table table-bordered table-condensed table-hover'><tbody></tbody></table>
    </div>
</div>
<div id="stk_dev" class="table-responsive">
    <table class='table table-bordered table-condensed table-hover'>
        <thead></thead>
        <tbody></tbody>
    </table>
</div>
</div>







