{% load i18n %}


<style>
    #data-content .btn-confirm{
        //color:white; 
        padding:5px 8px 3px 8px; 
        background-color:#17a2b8;
        //border:1px solid #717171; 
        
    }
    #data-content .btn-confirm:hover{
        color:white; 
        padding:5px 8px 3px 8px; 
        background-color:#007bff;
        //border:1px solid #717171; 
        
    }
    #data-content .gtt{
        font-weight:bold;
    }
</style>


<script type="text/javascript">
    $(document).ready(function(){   

        var page_length=10;      

        var table=$('#tb').DataTable({
            dom: 'Bfrtip',
            autoWidth: true,
            pageLength: page_length,
           

            buttons: [{extend:'excelHtml5',text: '导出到Excel'}],   
            language:lng,          
            data:{{data|safe}},            

            drawCallback: function () {
                var api = this.api();     
                $( api.column(9).footer() ).html(                   
                   api.column( 9, {page:'current'} ).data().sum()
                );
                $( api.column(10).footer() ).html(                   
                    api.column(10, {page:'current'} ).data().sum()
                );
                $( api.column(11).footer() ).html(                   
                    $.formatNum(api.column(11, {page:'current'} ).data().sum(),2)
                );
                
                $('#data-content .gtt').text($.formatNum(api.column(11).data().sum(),2));
            }
        });     
        


       
        $('#tb').on("click","td a.btn-details",function(event){
            event.preventDefault(); 
            $.OpenDlg($(this).attr('href'),'渠道促销-扫码明细',1000,700);                  
        });     

        $('#tb').on("click","td a.btn-confirm",function(event){
            event.preventDefault(); 
            $.ajax({
                url:$(this).attr('href'),
                success:function(data){                   
                    var date_from,date_to;
                    date_fr=$('#dt_fr').val();
                    date_to=$('#dt_to').val();
                    var params=[];
                    if(date_fr!=''){params.push('date_from='+date_fr)};
                    if(date_to!=''){params.push('date_to='+date_to)};

                    if(params.length==0){                        
                        $.RefreshContent('{{request.path}}');
                    }else{
                        $.RefreshContent('{{request.path}}?'+params.join('&'));
                    }
                },
                error:function(){
                    toastr.error("连接服务器失败！", "操作失败：",
                        {timeOut: 800, positionClass: "toast-center-center"}
                    );
                }

            });                   
        });     

       

        
        $('.datepicker').datepicker({dateFormat: 'yy-mm-dd'});
        $('.datepicker').datepicker('setDate',new Date());
        setDatePickerZh();

        $('#dt_fr').val('{{date_from}}');
        $('#dt_to').val('{{date_to}}');
        $("#agent_id").val('{{agent_id}}');
        $("#agent_label").val('{{agent_name}}');



        $('.btn-qry').click(function(){
            var date_from,date_to,agent_id;
            date_fr=$('#dt_fr').val();
            date_to=$('#dt_to').val();
            agent_id=$('#agent_id').val();
            var params=[];
            if(date_fr!=''){params.push('date_from='+date_fr)};
            if(date_to!=''){params.push('date_to='+date_to)};
            if(agent_id!=''){params.push('agent_id='+agent_id)};    
            if(params.length==0){
                bootbox.alert("{% trans '请先输入查询条件！'%}");
            }else{
                $.RefreshContent('{{request.path}}?'+params.join('&'));
            }
        });



        $('#agent_label').autocomplete({   
            source: function(request, response) {
                $.ajax({
                    url: '/obj/ajax/autocomplete/agent/',
                    dataType: "json",
                    data: {
                        term:   $("#agent_label").val() ,//搜索栏里的内容
                        company_id:  $('#id_company').val() ,//额外参数
                    },
                    success: function(data) {
                        response(data);
                    }
                });
            },            
            select: function (event, ui) {
                $("#agent_id").val(ui.item.value);
                $("#agent_label").val(ui.item.label);
                return false;
            }
        });


       
    });
</script>




<div>
    <ol class="breadcrumb">
        <li>渠道促销</li>
        <li>扫码奖励明细</li>     
    </ol>

    <form role="form"  class="form-inline" style="margin-top:0px;padding-left:10px;">
        <div class="col-sm-2 input-group">
            <span class="input-group-addon">{% trans "开始日期" %}</span>
            <input class="datepicker form-control" id="dt_fr" />
        </div>
        <div class="col-sm-2 input-group">
            <span class="input-group-addon">{% trans "结束日期" %}</span>
            <input class="datepicker form-control" id="dt_to" />
        </div>    

        <div class="col-sm-3 input-group">
            <input type='hidden' id='agent_id' />
            <input class='form-control' id='agent_label' placeholder='所有经销商' />
        </div>
        <div  class="col-sm-2 input-group">
            <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>
        <div  class="col-sm-2 input-group">
            扫码奖励总计：<span class='gtt'></span>  
        </div>

    </form>
    <div class="clearfix"></div>

    <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>
                <tr>
                  {% for c in clmns %}
                    {% if forloop.first %}
                        <th>合计：</th>
                    {% else %}
                        <th></th>
                    {% endif %}
                {% endfor %}
                </tr>
            </tfoot>
            </table>
        </div>
    </div>
    </div>
</div>
