yy_rms_39zhiyao_duizhao/templates/drug/DrugPutInByBarCode_copy.html

{% extends 'base.html' %}


{% block content %}
{% load static %}
<link rel="stylesheet" href="{% static 'layuiadmin/layui/css/layui.css' %}" media="all">
<style type="text/css">
    body {
        background-color: #FFF !important;
    }


    .ibox{
        padding-left: 25px;
        padding-right: 25px;
    }
    .dataTables_wrapper{
        padding-bottom: 0px !important;
    }
    /* th,td{
        white-space:nowrap;
    } */
.lxWidth{
    width: 100px !important;
}

</style>

<div class="ibox float-e-margins">
    <div style="text-align: center;line-height: 60px;font-size: 20px;">绑定入库</div>
    <form class="form-horizontal myForm" role="form">
          {% if not template_obj %}
        <div class="form-group">
            <div class="col-sm-12">
                <table id="dataTableModel" style="height: 400px;" class="table table-striped table-bordered table-hover dataTables-example">
                    <thead>
                        <tr>
                            <th>类型ID</th>
                            <th width="200">类型名称</th>
                            <th width="200">EnglishName</th>
                            <th>纯度</th>
                            <th>CAS码</th>
                            <th>生产日期</th>
                            <th>保质期（天）</th>
                            <th>生产厂家</th>
                        </tr>
                    </thead>
                    <tbody>
                    </tbody>
                </table>
            </div>
        </div>
        {% else %}
          <div class="form-group">
            <div class="col-sm-12">
                <table id="dataTableModel" class="table table-striped table-bordered table-hover dataTables-example">
                    <thead>
                        <tr>
                            <th>类型ID</th>
                            <th width="200">类型名称</th>
                            <th width="200">EnglishName</th>
                            <th>纯度</th>
                            <th>CAS码</th>
                            <th>生产日期</th>
                            <th>保质期（天）</th>
                            <th>生产厂家</th>
                            <th>状态</th>
                            <th>生产厂商</th>
                            <th>销售商</th>
                            <th>价格（元）</th>
                            <th>规格</th>
                            <th>单位</th>
                            <th>规格单位</th>
                        </tr>

                    </thead>
                    <tbody>
                    {# 加载自定过滤器 #}
                    {% load myfilter %}
                    {% for template_content1 in all_children_template_list %}
                                    <tr class="gradeA" id="">
                                        <td>{% firstof template_content1.VarietyId '' %} </td> <!--种类id-->
                                        <td class="lxWidth">{% firstof template_content1.Name '' %}</td> <!--中文名称 Name-->
                                        <td>{% firstof template_content1.EnglishName '' %}</td><!--英文名称 EenglistName-->
                                        <td>{% firstof template_content1.Purity '' %}</td><!--纯度-->
                                        <td>{% firstof template_content1.CASNumber '' %}</td>
                                        <td style="width:75px;text-align: center">{% firstof template_content1.ProductionDate '' %}</td>
                                        <td>{% firstof template_content1.ShelfLife '' %}</td>
                                        <td>{% firstof template_content1.Manufacturer '' %}</td>
                                        <td>未入库</td>
                                        <td>{% firstof template_content1.Manufacturer '' %}</td>
                                        <td>{% firstof template_content1.Distributor '' %}</td>
                                        <td>{% firstof template_content1.Price '' %}</td>
                                        <td>{% firstof template_content1.Speci '' %}</td>
                                        <td>{% firstof template_content1.Unit '' %}</td>
                                        <td>{% firstof template_content1.SpeciUnit '' %}</td>
                                    </tr>
{% endfor %}
                    </tbody>
                </table>
            </div>
        </div>


        {% endif %}


        <div class="form-group" style="position:fixed; left:15px; bottom:20px;width:900px">

            <!-- <div class="col-md-1 col-md-offset-11">
                <button class="btn btn-white" type="button" id="closeForm">关闭</button>
            </div> -->
        </div>
     <!--  隐藏client_id -->
        <input type="hidden" name="" value="{{ client_id }}" id="client_id">
        <input type="hidden" name="" value="{{ CustomerId }}" id="CustomerId">

    </form>
    <div style="line-height: 80px;font-size: 18px;text-align: center;" class="approve-status layui-bg-orange">
        请扫描试剂条码</div>
</div>


{% load static %}
                <script src="{% static 'js/warning.js' %}"></script>

<script type="text/javascript">
    // flag_status 用来RFID入库禁止频繁弹窗
    var flag_status = true;
    window.focus();
    var templateListStr= localStorage.getItem('templateListStatus');
    var templateList=JSON.parse(templateListStr);
    if(templateList==null){
        templateList=[];
    }
    var curTem=templateList.find(x=>x.templateId==localStorage.getItem('curTemplateId'));
    // alert(curTem.curIndex);
    var template_index =0;
    if(curTem){
        template_index = curTem.curIndex;
    }
    $('.gradeA:nth-child(' + (template_index+1) + ')').addClass("selected")
    window.focus();   // 当前页面获得焦点用来RFID扫描
        //挂钩jquery插件，实现条码识别
        $(document).barCodeScanerModeEnter(function (barCode) {
            if(barCode){
                    if(flag_status){
                        var index = layer.load(2, {shade: 0.01});
                        flag_status = false;
                    
                    //获取该一维码对应指定行数据，准备到表单中提交后台入库
                    var data_list = ["VarietyId", "Name", "EnglishName", "Purity", "CASNumber", "ProductionDate", "ShelfLife", "Price", "", "", "", ""]
                    $("find-barCode");
                           // 引入flavr 弹窗插件
                // 触发ajax  提交绑定表单
                        $.ajax({

                            type: 'POST',
                            url: '{% url 'drug:drugPutInView' %}',
                            data: {template_index:template_index,
                                client_id:$('#client_id').val(),
                                CustomerId: $('#CustomerId').val(),
                                barCode: barCode,
                            },
                            success:function (data) {
                                //  改变datatable指定列的值

                            if(data.status == 0){
                                flag_status = true;
                                 document.getElementById('dataTableModel').
                                     rows[template_index + 1].cells[7].innerHTML = '已入库';
                                 layer.close(index);
                                 $('.gradeA:nth-child(' + (template_index+1) + ')').css('color', 'red');
                                $('.gradeA:nth-child(' + (template_index+1) + ')').css('font-weight', 700);
                                $('.gradeA:nth-child(' + (template_index+1) + ')').css('background-color', '#DCDCDC');
                                $('.gradeA:eq(' + (template_index+1) + ')').addClass("selected").siblings().removeClass("selected");
                                $(".dataTables_scrollBody").scrollTop((template_index*36)-15);
                                    template_index += 1
                                    curTem.curIndex=template_index;
                                    localStorage.setItem('templateListStatus',JSON.stringify(templateList));
                        
                        
                            }else{

                                layer.close(index);
                                new $.flavr({
                                         modal: false,
                                        autoclose: false,
                                        timeout: 2000,
                                        buttons: {OK: {
                                        text: '确认',
                                        style: 'danger',
                                        addClass: null,
                                        action: function (e) {

                                           flag_status = true;
                                            // socket.send('123123');
                                        }
                                    },},
                                    content: data.message
                                });
                            }
                            },
                            error: function () {
                                alert('数据异常！');
                                flag_status = true;
                                layer.close(index);
                                // socket.send('886');
                            }
                        });
              
                    }else{


                    }


                }
        });


            //监听窗口关闭事件，当窗口关闭时，主动去关闭websocket连接，防止连接还没断开就关闭窗口，server端会抛异常。



    var index = parent.layer.getFrameIndex(window.name);
    $(function () {
        var tableModel = $('#dataTableModel').DataTable({
            searching: false,
            lengthChange: false,
            select: true,
            "bPaginate": false,
            'scrollX': false,
            'bAutoWidth': false,
            'scrollY': true,
            "ordering": false,
            "scrollY": "380px",
           columnDefs: [{
                           "targets": [0, 9, 10, 11, 12, 13, 14],
                           "visible": false
            }],
            // 初始化，描画都已经完成，常用于ajax
            "initComplete": function (settings, json) {
                $(".dataTables_scrollBody").scrollTop((template_index*36)-15);
                $(".gradeA").click(function(){
                    $(this).addClass("selected").siblings().removeClass("selected");
                    template_index = $(this).index();
                    curTem.curIndex=template_index;
                    localStorage.setItem('templateListStatus',JSON.stringify(templateList));
                    $(".dataTables_scrollBody").scrollTop((template_index*36)-15);
                });
            },
        });


        $("#closeForm").click(function () {
            // socket.send('886');
            parent.layer.close(index);
        });
        

    })

</script>
<!-- <script>
//////////////////////////////////////////////////////////////////////////////////////////////////////////////
client_id = $('#client_id').val();
CustomerId = $('#CustomerId').val();
console.log(client_id);
console.log(CustomerId);

$.ajax({
    type: 'POST',
    url: '{% url 'drug:drugPutInView' %}',
    data: {template_index:'1',
        client_id:$('#client_id').val(),
        CustomerId: $('#CustomerId').val(),
        // barCode: barCode,
    },
    success:function (data) {
        //  改变datatable指定列的值
        alert('成功向后台提交数据');
    if(data.status == 0){
        flag_status = true;
        // socket.send('23123123');
        var tag = document.getElementById('dataTableModel').rows[1];
        tag.style.backgroundColor = '#82e282'  //已入库的行标记为偏绿色
        tag.cells[7].innerHTML = '已入库';
            document.getElementById('dataTableModel').
            rows[1 + 1].cells[7].innerHTML = '预备入库';
        layer.close(index);
    }else{

        layer.close(index);
        new $.flavr({
                modal: false,
                autoclose: false,
                timeout: 2000,
                buttons: {OK: {
                text: '确认',
                style: 'danger',
                addClass: null,
                action: function (e) {

                flag_status = true;
                    // socket.send('123123');
                }
            },},
            content: data.message
        });
    }
    },
    error: function () {
        alert('数据异常！');
        flag_status = true;
        layer.close(index);
        // socket.send('886');
    }
    });

//////////////////////////////////////////////////////////////////////////////////////////////////////////////
</script> -->



{% endblock %}