yy_rms_39zhiyao_duizhao/templates/drug/DrugPutInByBarCode.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) {
                var index = 0;
                if (flag_status) {

                    flag_status = false;
                    var Place = "";
                    layer.prompt({
                            formType: 0,
                            value: '',
                            title: '请输入药剂的层数位置',
                            btn: ['确定'], //按钮，
                            area: ['500px', '300px'],
                            closeBtn: 1,
                            cancel: function (i, layero) {
                                layer.close(i);
                                $(document).barCodeEmpty();
                                flag_status = true;
                            }
                        },
                        function (value, i) {
                            if (!value && value.length === 0) {
                                layer.msg("请输入具体位置")
                                return
                            }
                            $(document).barCodeEmpty();
                            index = layer.load(2, {shade: 0.01});
                            Place = value + '层';
                            layer.close(i);
                            //获取该一维码对应指定行数据，准备到表单中提交后台入库
                            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,
                                    Place: Place,
                                },
                                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 %}