{% load i18n %}





<div class="subtitle">
    <ol class="breadcrumb">
        <li>{% trans "物流工具" %}</li>
        <li>{% trans "在线采集标签替换" %}</li>
    </ol>
</div>

<script type="text/javascript">
    $(document).ready(function () {
        $('input[name="info"]').change(function () {
            info = $('input[name="info"]:checked').attr('value');
            if (info == 'custom') {
                $('#fahuo_info').show(400);
            } else {
                $('#fahuo_info').hide(400);
            }
        });

        var uploadType = '';


        $('#upload').on('click',function () {
            var Sel = document.getElementById("select");
            var index = Sel.selectedIndex;
            uploadType = Sel.options[index].value;
            // console.log(val);
            if (uploadType == '') {
                alert("请选择替换类型");
            }
            else {
                document.getElementById('xFile').click();
            }
        })

        $('#xFile').change(function () {
            var formData = new FormData();
            formData.append("type", uploadType);
            $('#info table').html('');
            $('#info .info').html('');
            $('#errinfo_null_rec').html('');
            $('#errinfo_delivered_rec').html('');
            $('#errinfo_different_rec').html('');
            console
            var xhr = new XMLHttpRequest();
            var file = document.getElementById('xFile').files;
            var formDat;
            var cnt = 0;
            for (i = 0; i < file.length; i++) {
                var fn = file[i].name.substr(0, 2).toUpperCase();
                formData.append("files", file[i]);
                cnt = cnt + 1;
            }
            if (cnt == 0) {
                //bootbox.alert("{% trans '没有可上传的文件!' %}", function() {});
                toastr.error(
                    "没有可上传的文件!",
                    "操作错误：",
                    { timeOut: 800, positionClass: "toast-center-center" }
                );

                return;
            }
            $('#msg').remove();
            $('.btn-upload').addClass('disabled');
            $('#ajax_loading2').show();
            var si = '';
            xhr.open('POST', '/inventory/upload/label_replace_sh/');
            xhr.setRequestHeader("X-CSRFToken", '{{ csrf_token }}');
            xhr.send(formData);
            xhr.onreadystatechange = (function (_xhr) {
                return function () {
                    if (_xhr.readyState == 4) {


                        if (_xhr.status == 200) {
                            console.log('200');
                            var d = eval('(' + _xhr.responseText + ')');
                            if (d.e != '') {
                                $('.btn-upload').removeClass('disabled');
                                toastr.error(
                                    d.e,
                                    "上传失败：",
                                    { timeOut: 800, positionClass: "toast-center-center" }
                                );
                                //bootbox.alert(d.e, function() {});
                                return;
                            };
                            $('#info table').prepend(
                                '<tr>' +
                                '<th style="width:30px">{% trans '上传的TXT文件名' %}</th>' +
                                '<th style="width:15px">{% trans '总行数' %}</th>' +
                                '<th style="width:15px">{% trans '写入替换记录数' %}</th>' +
                                '<th style="width:15px">{% trans '错误标签' %}</th>' +
                                '</tr>'
                            );
                            for (var n in d.files) {
                                $('#info table').append(
                                    '<tr>' +
                                    '<td>' + d.files[n].txt_name + '</td>' +
                                    '<td>' + d.files[n].total + '</td>' +
                                    '<td>' + d.files[n].ok + '</td>' +
                                    '<td>' + d.files[n].err + '</td>' +
                                    '</tr>'
                                );
                            };
                            var html = '';
                            $('#info .info').html(html);
                            $('.btn-upload').removeClass('disabled');
                            $('#ajax_loading2').hide();
                        }
                        else {
                            $('.btn-upload').removeClass('disabled');
                            $('#ajax_loading2').hide();
                            //bootbox.alert("{% trans '通讯错误!' %}", function() {});
                            toastr.error(
                                "通讯错误",
                                "上传失败：",
                                { timeOut: 800, positionClass: "toast-center-center" }
                            );
                            return;
                        }
                    }
                }
            })(xhr);
            xhr.timeout = 300000;
            xhr.ontimeout = function (event) {
                $('#ajax_loading2').hide();
                //bootbox.alert("{% trans '请求超时！' %}", function() {});
                toastr.error(
                    "请求超时！",
                    "操作失败：",
                    { timeOut: 800, positionClass: "toast-center-center" }
                );
            }
        });

    });
</script>


<div>
    {% trans "点击右边按钮，选择标签替换TXT文件上传服务器：" %}
    <select id="select" style="width : 150px;">
        <option value="">请选择替换类型</option>
        <option value="pg">瓶盖替换</option>
        <option value="qh">标签替换（全换）</option>
    </select>
    <label class="btn btn-primary btn-upload btn-sm" id="upload">{% trans "上传文件" %}</label>
    <div style='font-style:italic;'>TXT文件格式：每行两列，先是旧标签号码后是新标签号码，中间用英文逗号分隔</div>
    <form>
        <input type="file" id="xFile" accept="text/plain" multiple="multiple"
            style="position:absolute;clip:rect(0 0 0 0);">
    </form>

    <div id='info'>
        <div id='tb_div' class='table-responsive'>
            <table class='table table-bordered table-striped table-condensed table-hover'></table>
        </div>
        <div class='info'></div>
    </div>
    <div id='errinfo_null_rec'></div>
    <div id='errinfo_delivered_rec'></div>
    <div id='errinfo_different_rec'></div>


    <div id='msg'></div>

</div>