{% load i18n %}


<style>  
    #tb tbody td img{
        height:30px;
        cursor:pointer;
    }
    
</style>

<style> 
    .word-wrap{
        width: 100%;white-space: normal;word-wrap: break-word;word-break: break-all;
    }
</style>



<script type="text/javascript">
    $(document).ready(function(){
        var table;
        function RefreshTable(){           
            table=$('#tb').DataTable({
            dom: 'Bfrtip',
            autoWidth: true,
            ordering:false,
            searching: false,
            pageLength: 10,
            buttons: [{extend:'excelHtml5',text: '导出到Excel'}],   
            language:lng,

			"destroy":true,
			"processing": true,
            "serverSide": true,                
            "ajax": {
                "url":"/company/ajax/datatable/agent/",
                "data":function(params){   
                    var agent_name=$('#agent_name').val(),level_id=$('#level_id').val(),is_golden=$('#is_golden').val(); 
                    params.name__icontains=agent_name;                    
                    params.level_id=level_id;   
                    params.is_golden=is_golden;     
                }
            }
        });         
         
        $(".btn-obj-add").click(function () { 
            event.preventDefault();
            $.RefreshContent($(this).attr('href'));        
        });

        $('#tb').on("click","td a",function(event){			
            event.preventDefault();   
            $.RefreshContent($(this).attr('href'));            
        });    	

        
        };
        /*
        $.dataTablesSettings = {
            "aLengthMenu": [10, 25, 50, 100],
            "bAutoWidth": false,
            "bDeferRender": true,
            "bLengthChange": true,
            "sAjaxSource": "/ReceivedDoc/AjaxHandler",
            "bPaginate": true,
            "bServerSide": true,
            "bSort": true,
            "iDisplayLength": 10,
            searching: false,//是否显示搜索框
            "aaSorting": [[0, "asc"]], // set first column as a default sort by asc
            "bFilter": true,
            "aoColumnDefs": [{  // define columns sorting options(by default all columns are sortable extept the first checkbox column)
                'bSortable': true,
                'aTargets': [0, 8]
            }],
            "fnServerParams": function (aoData) {
                aoData._rand = Math.random();
            },
            "fnDrawCallback": function () {
            }









            $('#btn_search').click(function () {

            //这里重新设置参数
            $.dataTablesSettings.fnServerParams = function (aoData) {
                aoData._rand = Math.random();
                aoData.push(
                    { "name": "year", "value": $('#year').val() },
                    { "name": "month", "value": $('#month').val() },
                    { "name": "StartTime", "value": $('#StartTime').val() },
                    { "name": "EndTime", "value": $('#EndTime').val() },
                    { "name": "DTMName", "value": $('#DTMName').val() },
                    { "name": "KeyWords", "value": $('#KeyWords').val() }
                );
            }
            //搜索就是设置参数，然后销毁datatable重新再建一个
            dataTable.fnDestroy(false);
            dataTable = $(".dataTables-example").dataTable($.dataTablesSettings);
            //搜索后跳转到第一页
            dataTable.fnPageChange(0);
        });

        var table=$('#tb').DataTable({
            dom: 'Bfrtip',
            autoWidth: true,
            ordering:false,
            searching: false,
            pageLength: 10,
            buttons: [{extend:'excelHtml5',text: '导出到Excel'}],   
            language:lng,
			
			"processing": true,
            "serverSide": true,                
            "ajax": {
                "url":"/company/ajax/datatable/agent/",
                "data":function(params){
                    console.log(params);
                }
            }
        });         
        */      





        
         
        $(".btn-obj-add").click(function () { 
            event.preventDefault();
            $.RefreshContent($(this).attr('href'));        
        });

        $('.btn-qry').click(function(){
            RefreshTable();
        });

        $('#tb').on("click","td a",function(event){			
            event.preventDefault();   
            $.RefreshContent($(this).attr('href'));            
        });    	

        
		RefreshTable();
    });
   
</script>



<ol class="breadcrumb">
    <li>{{tt1}}</li>
    <li>{{tt2}}</li>     
</ol>

<form role="form"  class="form-inline" style="margin-top:0px;margin-left:5px;">
    <div class="col-sm-2">   
        <input id='agent_name' class='form-control' style='width:250px;' placeholder='经销商名称:所有' />
    </div>
    <div class='col-sm-3'>
        <span>经销商层级：</span>
        <select class='form-control' id='level_id'>
            <option value='2'>一级</option>
            <option value='4'>二级</option>
            <option value='5'>三级</option>
            <option value='' selected="selected">所有</option>
        </select>
        <span>是否金牌客户：</span>
        <select class='form-control' id='is_golden'>
            <option value='1'>是</option>
            <option value='0'>否</option>
            <option value='' selected="selected">所有</option>
        </select>   
    </div>
    <div class='col-sm-1'>
        <span class='input-group-btn'>
            <a type="button" class='btn btn-primary btn-qry'>
                <span class='glyphicon glyphicon-search' style='padding-right:5px;'></span>{% trans '查询' %}
            </a>
        </span>
    </div>

    {% if show_add %}  
        <div class="pull-right">
            <span class='input-group'> 
                <button type="button" class='btn btn-obj-add l-a create-btn' href='{{murl}}'>
                    <span class='glyphicon glyphicon-plus' style='padding-right:5px;'></span>{% trans '新建' %}
                </button>
            </span>
        </div>
    
    {% endif %}
</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>                  
            </tfoot>
            </table>
        </div>
    </div>
</div>
