{% load i18n %}

{% ifequal obj 'Award' %}
<style>

    #tb tbody td img{
        height:30px;
        cursor:pointer;
    }

</style>
{% endifequal %}
<style>
    .word-wrap{
        width: 100%;white-space: normal;word-wrap: break-word;word-break: break-all;
    }
	.ui-datepicker{
		z-index:1051 !important;
	}
	.modal-footer{
		clear: both;

	}
	.ui-autocomplete{
		z-index: 9999 !important;
	}
    {##tb tr td:first-child{#}
    {#    text-align: center;#}
    {# }#}
</style>



<script type="text/javascript">

    $(document).ready(function(){
        var page_length=10;
        var table=$('#tb_collection').DataTable({
            dom: 'Bfrtip',
            autoWidth: true,
            pageLength: page_length,
            buttons: [{extend:'excelHtml5',text: '导出到Excel'}],
            language:lng,

            order: [],
            columnDefs: [ { "bSortable": false, "aTargets": [ 0 ] }],
			{% if order %}
            order: {{order|safe}},
			{% endif %}

            data:{{data|safe}}

        });

        {#$("#tb tbody").on("click","input",function(){#}
        {#     var check = $(this).find(".checkchild").prop("checked");#}
        {#     if(check && check==true){#}
        {#         $(this).find('.checkchild').prop("checked",false);#}
        {#     }else{#}
        {#         $(this).find('.checkchild').prop("checked",true);#}
        {#     }#}
        {# });#}

        table.columns().every( function () {
            var that = this;
            $('input', this.footer() ).on( 'keyup change clear', function () {
                if ( that.search() !== this.value ) {
                    that.search( this.value ).draw();
                }
            });
        });


        $('.btn-save').click(function (){
            if ($("#qty").val()){
                $.ajax({
                    type: 'post',
                    url: '/collection/ajax/manage/?obj=update&artical_id={{artical_id}}',
                    data: {
                        direction:$("#direction").val(),
                        qty: $("#qty").val(),
                        remark: $("#remark").val(),
                    },
                    success: function(html) {
                        toastr.success("{% trans '数据调整成功!' %}",
                            "{% trans '消息提示' %}",{timeOut: 800, positionClass: "toast-center-center"}
                        );
                        $.RefreshContent("collection/list/artical/");
                    },
                    error: function(XMLHttpRequest, textStatus, errorThrown) {
                        alert('连接服务器失败');
                    }
                })
            }
            else{
                alert('请输入数量！');
            }
        })
	});
</script>



<ol class="breadcrumb">
        <li>{{subtt.0}}</li>
        <li>{{subtt.1}}</li>
</ol>


<form role="form" method='POST' enctype="multipart/form-data" class="form-horizontal" id="form1"> {% csrf_token %}

    <div class="form-group">
        <label class="col-sm-2 control-label">手机号：</label>
        <div class="col-sm-3">
            <p class="form-control-static">{{ phone }}</p>
        </div>
        <label class="col-sm-2 control-label">姓名：</label>
        <div class="col-sm-3">
            <p class="form-control-static">{{ collector }}</p>
        </div>
    </div>
    <div class="form-group">
        <label class="col-sm-2 control-label">产品：</label>
        <div class="col-sm-3">
            <p class="form-control-static">{{ product_name }}</p>
        </div>
{#        <label class="col-sm-2 control-label">购买数量：</label>#}
{#        <div class="col-sm-2">#}
{#            <p class="form-control-static">{{ qty }}</p>#}
{#        </div>#}
        {% if show_balance %}
        <div class="form-group">
        <label class="col-sm-2 control-label">剩余数量：</label>
        <div class="col-sm-2">
            <p class="form-control-static">{{ balance }}</p>
        </div>
        {% endif %}
    </div>
    </div>

    {% if show_balance %}


    {% else %}
        <div class="form-group " style="margin-top: 40px;">
        <label class="col-sm-2 control-label ">{% trans '调整方向:' %} </label>
        <div class="col-sm-2">
            <select id="direction" class='form-control' style="text-align: center">
                <option value=1 seleted="selected">增加</option>
                <option value=-1>减少</option>
            </select>
        </div>
        <label class="col-sm-2 control-label ">{% trans '调整数量:' %} </label>
        <div class="col-sm-4">
            <input id='qty' placeholder="ml" class='form-control'/>
        </div>
    </div>


    <div class="form-group ">
        <label class="col-sm-1 control-label ">{% trans '备注:' %} </label>
        <div class="col-sm-10">
            <input id='remark'  class='form-control'/>
        </div>
    </div>
   <div>
        <a class="btn btn-primary btn-save" type="submit" style="float:right;">{% trans '保存' %}</a>
    </div>
    {% endif  %}




</form>



{% if clmns %}
    <div class="col-md-12 col-sm-12 col-xs-12">
        <div class="x_panel">
            <div class="table-responsive">
                <table id='tb_collection' class="table table-striped table-bordered dt-responsive nowrap"
                       cellspacing="0" width="100%">
                    <thead>
                    {% for c in clmns %}
                        <th>{{ c }}</th>
                    {% endfor %}
                    </thead>
                    <tbody></tbody>
                    <tfoot>
                    {% for c in clmns %}
                        <th><input type="text" placeholder="{{ c }}"></th>
                    {% endfor %}
                    </tfoot>
                </table>
            </div>
        </div>
    </div>
{% endif %}