{% 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 value = []
        var table=$('#tb').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}}

        });
        $(".checkall").on('click',function () {
            var list_before = $('.checkchild')
            for (var i = 0; i < list_before.length; i++) {
                if (list_before[i].checked) {
                    console.log(1)
                    $(".checkchild").prop("checked", false);
                    break;
                }else {
                    console.log(0)
                    $(".checkchild").prop("checked", true);
                    break;
                }
            }
            var list = $('.checkchild')
            for (var i = 0; i < list.length; i++) {
                    if (list[i].checked) {
                        if (value.indexOf(parseInt(list[i].value)) !=-1) {
                            {#value.push(parseInt(list[i].value))#}
                        }else{
                            value.push(parseInt(list[i].value))
                        }

                    }else {
                        if ($.inArray(parseInt(list[i].value), value) == -1) {
                            //$.inArray(元素, 数组) == -1 表示要删除的元素不在原数组中
                        } else {
                            value.splice($.inArray(parseInt(list[i].value), value), 1);
                        }
                        $(".checkchild").prop("checked", false);
                    }
            }
        });

        {#$("#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();
                }
            });
        });    
		
		$('#id_company_name').autocomplete({
			source: function(request, response) {
                $.ajax({
                    url: '/obj/ajax/autocomplete/agent/',
                    dataType: "json",
                    data: {
                        term:   $("#id_company_name").val()
                    },
                    success: function(data) {
                        response(data);
                    }

                });
            },
			select: function (event, ui) {
				$("#id_company").val(ui.item.value);
				$("#id_company_name").val(ui.item.label);
				return false;
			}
		});
    
		var url = '/company/saleman/manage/?obj=agent&uid={{uid}}';
        $('.btn-save').click(function () {
            SubmitThisForm('#form1');
        });
		
		$(".btn-delete").click(function(){
			var id = $(this).data("id");
			$.ajax({
				type: 'post',
                url, 
				data:{
					company_id:id,
					delflag:1
				},
                success: function(html) {
                    $('#bg-modal .modal-body').html(html);
                },
                error: function(XMLHttpRequest, textStatus, errorThrown) {
                    alert('连接服务器失败');
                }
			})
		})
		$("#tb").on('click','.checkchild',function (e){
            var check = $(this).prop("checked");
            if (check){
                    if (value.indexOf(parseInt(this.value))){
                        value.push(parseInt(this.value))
                    }
                }else{
                    if($.inArray(parseInt(this.value), value) == -1){
                        //$.inArray(元素, 数组) == -1 表示要删除的元素不在原数组中
                    }else{
                        value.splice($.inArray(parseInt(this.value), value), 1);
                    }
                }
        })
		SubmitThisForm = function (form) {
                $(form).ajaxSubmit({
                    type: 'post',
                    url,    
                    success: function(html) {

                        $('#bg-modal .modal-body').html(html); 
                    },
                    error: function(XMLHttpRequest, textStatus, errorThrown) {
                        alert('连接服务器失败');                        
                    }
                });
                return; // 阻止表单自动提交事件
		};
        $('.btn-delete-all').click(function (){
            if (value.length > 0) {
                $.ajax({
                    type: 'post',
                    url: '/company/saleman/manage/?obj=agent&uid={{uid}}',
                    data: {
                        company_ids:value.join(','),
                        delflag: 1
                    },
                    success: function(html) {
                        $('#bg-modal .modal-body').html(html);
                    },
                    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 ">{% trans '公司名称:' %} </label>
        <div class="col-sm-8">
            <input id='id_company_name' class='form-control' />
			<input id="id_company" name="company_id" type="hidden" />
        </div>
    </div>  

    <div class="form-group">
        <div class="col-sm-offset-2">
            <a class="btn btn-default btn-save">添加</a>
        </div>
    </div>
</form>

  

{#<div class="col-md-12 col-sm-12 col-xs-12">#}
{#    <div class="x_panel">#}
{#        <div  class="table-responsive">#}
{#            <table id='tb'  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>#}
 <div class='col-md-12 form-group'>
    <div class="table-responsive">
        <table id='tb' class="table table-striped table-bordered dt-responsive nowrap tb"
            cellspacing="0" width="100%">
            <thead>
                <tr>
                    <th>
                        <input type="checkbox" class ="checkall" id="group_checkbox" style="display: none；"/>
                        <label for="group_checkbox">全选/反选
                        </label>
                    </th>
                    <th>名称</th>
                    <th>父级</th>
                    <th>营销层级</th>
                    <th>所属战区</th>
                    <th>所属分区</th>
                    <th>地址</th>
                    <th>联系电话</th>
                    <th>终端店</th>
                    <th>渠道</th>
                    <th>操作</th>
                </tr>
            </thead>
            <tbody>

            </tbody>
            <tfoot>
                <th> <span class="btn btn-sm btn-danger btn-delete-all"  >批量删除</span> </th>
                <th><input type="text" placeholder="名称"></th>
                <th><input type="text" placeholder="父级"></th>
                <th><input type="text" placeholder="营销层级"></th>
                <th><input type="text" placeholder="所属战区"></th>
                <th><input type="text" placeholder="所属分区"></th>
                <th><input type="text" placeholder="地址"></th>
                <th><input type="text" placeholder="联系电话"></th>
                <th><input type="text" placeholder="终端店"></th>
                <th><input type="text" placeholder="渠道"></th>
                <th><input type="text" placeholder="操作"></th>
            </tfoot>
        </table>
    </div>
</div>