{% load i18n %}


<style>
    #period-name,#period-fr,#period-to{
        display:inline-block;
        min-width:70px;
    }
   

    #myTabContent tbody img{
        height:32px;
        margin-left:10px;    
    
    }

    #data-content .dataTable .selected{
        color:black;
        background:#aab7d1;
    } 

    #tb_payable tbody tr td:nth-child(6),#tb_payable tbody tr td:nth-child(7),#tb_payable tbody tr td:nth-child(8),#tb_payable tbody tr td:nth-child(9){
        color:black;
        font-weight:bold;
    }
    #tb_payable td .popover {
        max-width: 400px;
    }

    
    #data-content .tab-content .tt-amt{        
        display:inline-block;
        color:black;    
        margin-right:15px;
    }


    

    #tb_application tbody td span.app-status{
        margin-right:5px;
    }




     #tb_closing thead th{
        background-color:white;
        valign:middle;
        text-align:center;
        vertical-align:middle;   
    }


</style>





<script type="text/javascript">
    $(document).ready(function(){ 
        var cnt_transmit=0;
        var amt_transmit=0.00;
        var page_length=10;
        var table_payable,table_application,table_paid,table_lv1,table_transfer;        


        
        $('#period_closing').change(function(){     
            if($(this).val()=='0'){
                $('.btn-period-close').addClass('disabled');
            }else{
                $('.btn-period-close').removeClass('disabled'); 
            }
        });

        var table_closing=$('#tb_closing').DataTable({
            dom: 'Bfrtip',
            autoWidth: true,
            pageLength: page_length,
            buttons: [{extend:'excelHtml5',text: '导出到Excel'}],   
            language:lng,          
            data:{{data_closing|safe}},           
        });            
       


        $('#myTabContent .btn-period-create').click(function(){
            event.stopPropagation(); 
            event.preventDefault();              
            $.OpenUrlCfmDlg('/obj/edit/rebateperiod/','新建会计期','保存','取消');        
            
        });


        $('#myTabContent .btn-period-close').click(function(){           
            $.ajax({
                url: '/sales/channelretate/period/action/close/?id='+$('#period_closing').val(),
                dataType: "json",               
                success: function(data) {
                    if(data.e){
                        toastr.error(data.e, "操作错误：",
                            {timeOut: 800, positionClass: "toast-center-center"}
                        );
                        return;
                    }else{
                        $.RefreshContent('/sales/channelretate/period/redeem/'); 
                    } 
                }
            });
        });
        
        refresh_tb('list_payable');
        refresh_tb('list_application');         
        refresh_tb('list_lv1');
        refresh_tb('list_transfer');
        //refresh_tb('list_paid');

        $('#myTabContent .btn-period-payable').click(function(){
            refresh_tb('list_payable');
        });
        $('#myTabContent .btn-period-application').click(function(){
            refresh_tb('list_application');
        });
        $('#myTabContent .btn-period-paid').click(function(){
            refresh_tb('list_paid');
        });  

        $('#myTabContent .btn-period-lv1').click(function(){
            refresh_tb('list_lv1');
        });    

        $('#myTabContent .btn-period-transfer').click(function(){
            refresh_tb('list_transfer');
        });    


        function refresh_tb(what){
            var closing_id='';
            var tb='';
            var el='';      
            var status='';
            var method='';
            var lv_id='';
            var invoice_needed='';
            var paid_method='';
            var paid_lv='';
            switch (what){
                case  'list_payable':
                    tb='#tb_payable';
                    el='#tab_2';
                    closing_id=$('#period_payable').val(); 
                    lv_id=$('#lv_id').val();
                    if (lv_id!=''){
                        lv_id="&lv_id="+lv_id;
                    }
                    break;
                case  'list_application':
                    tb='#tb_application';
                    el='#tab_3';
                    closing_id=$('#period_application').val();
                    status="&status="+$('#status_application').val();
                    method="&method="+$('#payment_method').val();
                    invoice_needed="&invoice_needed="+$('#invoice_needed').val();
                    break;
                //case  'list_paid':
                //    tb='#tb_paid';
                //    el='#tab_4';
                //    paid_method="&method="+$('#paid_method').val();
                //    paid_lv="&paid_lv="+$('#paid_lv').val();
                //    closing_id=$('#period_paid').val();       
                //    break;   
                case  'list_transfer':
                    tb='#tb_transfer';
                    el='#tab_4';
                    method="&method="+$('#transfer_method').val();
                    status="&status="+$('#transfer_status').val();
                    //paid_lv="&paid_lv="+$('#paid_lv').val();
                    closing_id=$('#period_transfer').val();       
                    break;     
                case  'list_lv1':
                    tb='#tb_lv1';
                    el='#tab_5';
                    closing_id=$('#period_lv1').val();       
                    break;           
            };

            if(closing_id==''){
                toastr.error(label+"会计期不能为空！", "操作错误：",
                    {timeOut: 800, positionClass: "toast-center-center"}
                );               
            }else{
                 $.ajax({
                    type:'GET',
                    processData: false,  
                    contentType: 'application/json; charset=utf-8',
                    url:'/sales/channelretate/period/action/'+what+'/?closing_id='+closing_id+status+method+lv_id+invoice_needed,
                    success:function(data){    
                        switch (what){
                            case  'list_payable': 
                                initDataPayable(tb,el,data);                                 
                                break;
                            case  'list_application':
                                initDataApplication(tb,el,data);                                   
                                break;
                            case  'list_paid':
                                initDataPaid(tb,el,data);                                    
                                break;       
                            case  'list_lv1':
                                initDataLv1(tb,el,data);                                    
                                break; 
                            case  'list_transfer':
                                initDataTransfer(tb,el,data);                                    
                                break; 
                        };                        
                    },
                    error: function(XMLHttpRequest, textStatus, errorThrown) {
                        alert('连接服务器失败');
                        return;
                    }
                 });     
            };  
        };


        function updatePayable(id, amount, reason,dataIndex) {
            $.ajax({
                type: "POST",
                data: {"value":amount,"reason":reason}, 
                url: "/sales/channelretate/update/payable/"+id+"/",
                success: function(data) {
                    if(data.e==''){                        
                        toastr.success('应付款金额已改为 '+data.new, data.agent+":",
                             {timeOut: 800, positionClass: "toast-center-center"}                                
                        );    
                        var data=table_payable.row(dataIndex).data();
                        data[6]=$.formatNum(parseFloat(amount),2);
                        table_payable.row(dataIndex).data(data);
                        table_payable.row(dataIndex).data(data).draw(); 
                    }else{
                        toastr.error(data.e,'输入错误：',
                             {timeOut: 800, positionClass: "toast-center-center"}                                
                        );                          
                    };
                },                    
                beforeSend: function(xhr) {                    
                    xhr.setRequestHeader("X-CSRFToken", '{{ csrf_token }}');
                }
            });            
        };

        //function destroyTable() {
        //    if ($.fn.DataTable.isDataTable('#myAdvancedTable')) {
        //        table.destroy();
        //        table.MakeCellsEditable("destroy");
        //    }
        //};

        function initDataPayable(tb,el,data){
            table_payable=$(tb).DataTable({
                dom: 'Bfrtip',
                autoWidth: true,
                destroy: true,
                pageLength: page_length,
                buttons: [{extend:'excelHtml5',text: '导出到Excel'}],   
                language:lng,          
                data:data.data,
                drawCallback: function () {
                    var api = this.api();   
                    $( api.column(4).footer() ).html(                   
                        $.formatNum(api.column(4,{page:'current'}).data().sum(),2)
                    );
                    $( api.column(5).footer() ).html(                   
                        $.formatNum(api.column(5,{page:'current'}).data().sum(),2)
                    );
                    $( api.column(6).footer() ).html(                   
                        $.formatNum(api.column(6,{page:'current'}).data().sum(),2)
                    );
                    $( api.column(7).footer() ).html(                   
                        $.formatNum(api.column(7,{page:'current'}).data().sum(),2)
                    );
                    $( api.column(8).footer() ).html(                   
                        $.formatNum(api.column(8,{page:'current'}).data().sum(),2)
                    );
                    $( api.column(9).footer() ).html(                   
                        $.formatNum(api.column(9,{page:'current'}).data().sum(),2)
                    );
                    $(el+' .tt-amt').text($.formatNum(api.column(4).data().sum(),2));                        
                    $(el+' .tt-balance').text($.formatNum(api.column(5).data().sum(),2)); 
                    $(el+' .tt-total').text($.formatNum(api.column(6).data().sum(),2)); 
                    $(el+' .tt-paid_amt').text($.formatNum(api.column(7).data().sum(),2));  
                    $(el+' .tt-paid_vat').text($.formatNum(api.column(8).data().sum(),2)); 
                    $(el+' .tt-paid_total').text($.formatNum(api.column(9).data().sum(),2));  
                },
                /*
                createdRow: function (row, data, dataIndex) {                    
                    $(row).dblclick(function(){                            
                        $(tb+' tbody tr').removeClass('selected');
                        $(row).addClass('selected');
                        function CallBack(){   
                            var id=data[0];
                            var amt_new=$('#confirm-modal .payable-amount-new').val();
                            var reason=$('#confirm-modal .payable-reason').val();
                            //if($.isEmpty(reason)){
                            //    toastr.error('请输入修改原因','输入错误：',
                            //        {timeOut: 800, positionClass: "toast-center-center"}                                
                            //    );                                      
                            //}else{
                                updatePayable(id,amt_new,reason,dataIndex);
                            //};                                
                        };
                        var content='<form class="form-horizontal" role="form" >'+
                            '<div class="form-group">'+                                
                                '<input class="payable-amount-old" type="hidden"  value="'+data[5]+'" />'+
                                '<label class="col-sm-3 control-label">原应付款金额</label>'+
                                '<label class="col-sm-9 control-label">'+data[5]+'</label>'+
                            '</div>'+
                            '<div class="form-group">'+
                                '<label class="col-sm-3 control-label">现应付款金额</label>'+
                                '<div class="col-sm-9"><input type="number" class="payable-amount-new form-control" value="'+$.trim(data[5])+'"/></div>'+
                            '</div>'+
                            '<div class="form-group">'+
                                '<label class="col-sm-3 control-label">修改原因</label>'+
                                '<div class="col-sm-9"><input class="payable-reason form-control"/></div>'+
                            '</div>'+
                            '</form>';
                        $.OpenCfmDlg(data[1]+":",content,CallBack);
                    });
                }
                */
            }); 
            $(tb).find('tbody tr td img').parent().css({'padding-top':'2px','padding-bottom':'2px'});
            table_payable.column(0).visible(false);  

            //$("[data-toggle='popover']").popover({
            //    html:true,
            //    placement:'bottom'
            //});  
        };

        function initDataApplication(tb,el,data){
            table_application=$(tb).DataTable({
                dom: 'Bfrtip',
                autoWidth: true,
                destroy: true,
                pageLength: page_length,
                buttons: [{extend:'excelHtml5',text: '导出到Excel'}],   
                language:lng,          
                data:data.data,   
                drawCallback: function () {
                    var api = this.api();    
                    $('#tb_application tfoot tr .tt_amt').text(
                        $.formatNum(api.column(5,{page:'current'}).data().sum(),2)
                    );
                    $('#tb_application tfoot tr .tt_vat').text(
                        $.formatNum(api.column(7,{page:'current'}).data().sum(),2)
                    );
                    $('#tb_application tfoot tr .tt_total').text(
                        $.formatNum(api.column(8,{page:'current'}).data().sum(),2)
                    );
                    $(el+' .gtt_amt').text($.formatNum(api.column(5).data().sum(),2));
                    $(el+' .gtt_vat').text($.formatNum(api.column(7).data().sum(),2));
                    $(el+' .gtt_total').text($.formatNum(api.column(8).data().sum(),2));
                }, 
                createdRow: function( nRow, aData, iDataIndex ) {
                    $(nRow).attr('id', aData[0]);
                }
            });
            $(tb).find('tbody tr td img').parent().css({'padding-top':'2px','padding-bottom':'2px'});
            table_application.column(0).visible(false);  

            //table_application.columns().every(function () {                        
            //    var that = this;             
            //    $('input', this.footer() ).on( 'keyup change clear', function () {
            //        if ( that.search() !== this.value ) {
            //            that.search( this.value ).draw();
            //        }
            //    });
            //});    
            
        };
        function initDataPaid(tb,el,data){
            table_paid=$(tb).DataTable({
                dom: 'Bfrtip',
                autoWidth: true,
                destroy: true,
                pageLength: page_length,
                buttons: [{extend:'excelHtml5',text: '导出到Excel'}],   
                language:lng,          
                data:data.data,        
                drawCallback: function () {
                    var api = this.api();     
                    $( api.column(7).footer() ).html(                   
                        $.formatNum(api.column(7,{page:'current'}).data().sum(),2)
                    );
                    $(el+' .gtt').text($.formatNum(api.column(7).data().sum(),2));
                }, 
            }); 
            $(tb).find('tbody tr td img').parent().css({'padding-top':'2px','padding-bottom':'2px'});
            table_paid.column(0).visible(false);        
        };   

        function initDataLv1(tb,el,data){
            table_lv1=$(tb).DataTable({
                dom: 'Bfrtip',
                autoWidth: true,
                destroy: true,
                pageLength: page_length,
                buttons: [{extend:'excelHtml5',text: '导出到Excel'}],   
                language:lng,          
                data:data.data,        
                drawCallback: function () {
                    var api = this.api();                       
                    $('#tb_lv1 tfoot tr .tt_amt').text(
                        $.formatNum(api.column(3,{page:'current'}).data().sum(),2)
                    );
                    $('#tb_lv1 tfoot tr .tt_balance').text(
                        $.formatNum(api.column(4,{page:'current'}).data().sum(),2)
                    );
                    $('#tb_lv1 tfoot tr .tt_total').text(
                        $.formatNum(api.column(5,{page:'current'}).data().sum(),2)
                    );   
                    $(el+' .gtt').text($.formatNum(api.column(5).data().sum(),2));
                    
                    //$(el+' .tt_balance').text($.formatNum(api.column(3).data().sum(),2));
                    //$(el+' .tt_total').text($.formatNum(api.column(4).data().sum(),2));
                }, 
                createdRow: function( nRow, aData, iDataIndex ) {
                    $(nRow).attr('pid', aData[0]);
                }
            }); 
            //$(tb).find('tbody tr td img').parent().css({'padding-top':'2px','padding-bottom':'2px'});

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

        function initDataTransfer(tb,el,data){                
            $('#tab_4 .gtt_unpaid').text($.formatNum(data.amt_unpaid,2));
            $('#tab_4 .gtt_paid').text($.formatNum(data.amt_paid,2));

            table_transfer=$(tb).DataTable({
                dom: 'Bfrtip',
                autoWidth: true,
                destroy: true,
                pageLength: page_length,
                columnDefs: [{
                    targets:[16],
                    render: function(data){
                       return "\u200C" + data ;
                }}],
                buttons: [{
                    extend:'excel',                     
                    text: '导出到Excel',

                    //exportOptions: {
	                //    trim: true,
                    //    stripHtml: true,
                        //format: {
                        //    header: function ( html, index, node ) {
                        //        return index + ' [' + html +']';
                        //    }
                        //}
	                //},


                    //customize: function ( xlsx ) {
                    //    var sheet = xlsx.xl.worksheets['sheet1.xml'];
                    //    //这里表示第E列所有数据使用第67种数据格式（新增的那种格式）
                    //    $('row c[r^="Q"]', sheet).attr( 's', '49' );
                    //},


                }],   
                language:lng,          
                data:data.data,        
                drawCallback: function () {
                    var api = this.api();     
                    
                    $('#tb_transfer tfoot tr .tt_amt').text(
                        $.formatNum(api.column(4,{page:'current'}).data().sum(),2)
                    );
                    $('#tb_transfer tfoot tr .tt_balance').text(
                        $.formatNum(api.column(5,{page:'current'}).data().sum(),2)
                    );
                    $('#tb_transfer tfoot tr .tt_vat').text(
                        $.formatNum(api.column(7,{page:'current'}).data().sum(),2)
                    );
                    $('#tb_transfer tfoot tr .tt_tt').text(
                        $.formatNum(api.column(8,{page:'current'}).data().sum(),2)
                    );                    
                }, 
                createdRow: function( nRow, aData, iDataIndex ) {
                    $(nRow).attr('tid', aData[0]);
                }
            }); 
            //$(tb).find('tbody tr td img').parent().css({'padding-top':'2px','padding-bottom':'2px'});

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


        
        $('#tb_application').on("click","td button",function(event){
            var tr=$(this).closest('tr');
            var app_id=$(tr).attr('id');
            var act=$(this).attr('act');
            var agt=$(tr).find('.agent').text();
            if(act=='review_invoice'){                
                $.OpenDlg('/sales/channelretate/period/action/review_invoice/?id='+app_id,agt+":",1000,700);            
            }else{
                var btns=[                    
                    {"title":"驳回", "clss":["btn-warning", "btn-reject", "btn-act"]},
                    {"title":"作废", "clss":["btn-danger",  "btn-scrap", "btn-act"]}
                ];                
                $.OpenUrlCustomDlg("/sales/channelretate/period/action/rebateapplication_reject/?id="+app_id,agt,btns);            
            }           
        });          
        $('#tb_application').on("click","td a.viewlog",function(event){
            event.preventDefault();
            var tr=$(this).closest('tr');          
            var agt=$(tr).find('.agent').text();
            $.OpenDlg($(this).attr('href'),agt+':',1000,700); 
        });
        $('#tb_transfer').on("click","td button",function(event){
            var tr=$(this).closest('tr');
            var app_id=$(tr).attr('tid');
            var act=$(this).attr('act');
            var agt=$(tr).find('.agent').text();
            if(act=='review_invoice'){                
                $.OpenDlg('/sales/channelretate/period/action/review_invoice/?id='+app_id,agt+":",1000,700);            
            }else{
                var btns=[                    
                    {"title":"驳回", "clss":["btn-warning", "btn-reject", "btn-act"]},
                    {"title":"作废", "clss":["btn-danger",  "btn-scrap", "btn-act"]}
                ];                
                $.OpenUrlCustomDlg("/sales/channelretate/period/action/rebateapplication_reject/?id="+app_id,agt,btns);            
            }           
        });  


        $('#tb_transfer').on("click","td a.viewlog",function(event){
            event.preventDefault();
            var tr=$(this).closest('tr');          
            var agt=$(tr).find('.agent').text();
            $.OpenDlg($(this).attr('href'),agt+':',1000,700); 
        });




        //2021-03-28
        Array.prototype.remove = function(val) { 
            var index = this.indexOf(val); 
            if (index > -1) { 
                this.splice(index, 1); 
            } 
        };
        var wx_pay_ids=[];
        $('#tb_application').on("change","td input[type='checkbox']",function(event){
            var tr=$(this).closest('tr');
            var app_id=$(tr).attr('id');
            var checked=$(this).prop("checked");  
            var cls=$(this).attr('class');
            var m=$(this).attr('method');
            
            //if (cls=='casher_pay'){
            //    if (m=='1'){
            //        if (checked){
            //            if (wx_pay_ids.indexOf(app_id)==-1){
            //                wx_pay_ids.push(app_id);
            //            }
            //        }else{
            //            wx_pay_ids.remove(app_id);
            //        }                   
            //    }else{

            //        if (checked){
            //            var agt=$(tr).find('.agent').text();
            //            var btns=[                    
            //                {"title":"确定", "clss":["btn-primary",  "btn-bankpaid", "btn-act"]},
            //                {"title":"取消", "clss":["btn-default",  "btn-cancel",   "btn-act"]}
            //            ];                
            //            $.OpenUrlCustomDlg("/sales/channelretate/period/action/rebateapplication_bankpaid/?id="+app_id,agt,btns);
            //        }else{
                                  
            //        }
            //    }            
            //}else{
                $.ajax({
                    type:'POST',
                    data:{
                        'checked':checked,
                        'id':app_id
                    },
                    datatype: 'json',
                    url:'/sales/channelretate/period/action/'+cls+'/',
                    success:function(data){                           
                        $(tr).find('td:nth-child(11)').text(data.status);                        
                    },
                    error: function(XMLHttpRequest, textStatus, errorThrown) {
                        alert('连接服务器失败');
                        return;
                    }                
                });                 
            //};           
            //if (wx_pay_ids.length>0){
            //    $('#myTabContent .btn-period-wx_pay').removeClass('disabled');  
            //}else{
            //    $('#myTabContent .btn-period-wx_pay').addClass('disabled'); 
            //};            
        });   
        $('#tb_transfer').on("change","td input[type='checkbox']",function(event){
            var tr=$(this).closest('tr');
            var app_id=$(tr).attr('tid');
            var checked=$(this).prop("checked");  
            var cls=$(this).attr('class');
            var m=$(this).attr('method');
            
            if (m=='1'){               
                var wa_status=$(this).attr('wa_status');
                if(wa_status==''){
                    if (checked){
                        if (wx_pay_ids.indexOf(app_id)==-1){
                            wx_pay_ids.push(app_id);
                        }
                    }else{
                        wx_pay_ids.remove(app_id);
                    }
                }else{
                    toastr.error('微信钱包 '+wa_status+',暂不能转帐。');
                    $(this).prop("checked",false);
                }                   
            }else{
                if (checked){
                    var agt=$(tr).find('.agent').text();
                    var btns=[                    
                        {"title":"确定", "clss":["btn-primary",  "btn-bankpaid", "btn-act"]},
                        {"title":"取消", "clss":["btn-default",  "btn-cancel",   "btn-act"]}
                    ];                
                    $.OpenUrlCustomDlg("/sales/channelretate/period/action/rebateapplication_bankpaid/?id="+app_id,agt,btns);
                }else{
                                  
                }
            }; 
            if (wx_pay_ids.length>0){
                $('#myTabContent .btn-period-wx_pay').removeClass('disabled');  
            }else{
                $('#myTabContent .btn-period-wx_pay').addClass('disabled'); 
            };            
        });


        $('#myTabContent .btn-period-wx_pay').click(function(){
            event.stopPropagation(); 
            event.preventDefault();
            if (wx_pay_ids.length>0){
                $.ajax({
                    type:'POST',
                    data:{                        
                        'ids':wx_pay_ids.join(',')
                    },
                    //datatype: 'json',
                    url:'/sales/channelretate/period/action/wx_pay/',
                    success:function(html){   

                        //2021-05-03

                        $.OpenCfmDlg('微信转帐:',html);

                        //$.RefreshContent('/sales/channelretate/period/redeem/'); 
                        
                    },
                    error: function(XMLHttpRequest, textStatus, errorThrown) {
                        alert('连接服务器失败');
                        return;
                    }                
                });
            }else{
                alert('没有可微信转帐的提现申请');
            }     
        });




        $('#tb_lv1').on("change","td input[type='checkbox']",function(event){
           
            var tr=$(this).closest('tr');
            var app_id=$(tr).attr('pid');
            var checked=$(this).prop("checked");      
            if (checked){
                var agt=$(tr).find('td:nth-child(1)').text();
                var btns=[                    
                    {"title":"确定", "clss":["btn-primary",  "btn-bankpaid", "btn-act"]},
                    {"title":"取消", "clss":["btn-default",  "btn-cancel",   "btn-act"]}
                ];  
                $.OpenUrlCustomDlg("/sales/channelretate/period/action/lv1_pay/?id="+app_id,agt+":",btns);
            };
            
        });     
        
        $('#tb_closing').on('change','td input[type="checkbox"]',function(event){  
            var tr=$(this).closest('tr');
            var id=$(this).attr('id').split('-')[1];
            var checked=$(this).prop("checked"); 
            if(checked){
                $.ajax({
                    type:'POST',
                    data:{                        
                        'cls_id':id
                    },
                    datatype: 'json',
                    url:'/sales/channelretate/period/action/close_period/',
                    success:function(data){   
                        $(tr).find('td:nth-child(14)').html(data.msg);      
                    },
                    error: function(XMLHttpRequest, textStatus, errorThrown) {
                        alert('连接服务器失败');
                        return;
                    }                
                });                
            };       
        });
      
    });
</script>




<div>
    <ol class="breadcrumb">
        <li>渠道促销</li>
        <li>奖励结算与核销</li>     
    </ol>
</div>



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

<div class="x_panel" style='min-height:700px;'>
<div class="" role="tabpanel" data-example-id="togglable-tabs">
    <ul id="myTab" class="nav nav-tabs bar_tabs" role="tablist">
        <li role="presentation" class="active"><a href="#tab_1" id="home-tab" role="tab" data-toggle="tab">期结期控</a></li>
        <li role="presentation" class=""><a href="#tab_2" role="tab" id="payable-tab" data-toggle="tab">应付款明细列表</a></li>
        <li role="presentation" class=""><a href="#tab_3" role="tab" id="application-tab" data-toggle="tab">提现申请明细列表</a></li>  
        <li role="presentation" class=""><a href="#tab_4" role="tab" id="transfer-tab" data-toggle="tab">提现转帐明细列表</a></li>  

        <li role="presentation" class=""><a href="#tab_5" role="tab" id="paid-tab" data-toggle="tab">平台商转预付款明细列表</a></li>
        <!--
        <li role="presentation" class=""><a href="#tab_4" role="tab" id="lv1-tab" data-toggle="tab">已转帐(货返)明细列表</a></li>       
        -->
    </ul>
    
    <div id="myTabContent" class="tab-content">
        <div role="tabpanel" class="tab-pane fade active in" id="tab_1">
            <div class='col-md-12 form-inline' style='margin-bottom:20px;'>
                会计期：<select id='period_closing' class='form-control'  style='width:200px;'>                    
                    <option value='0'>----</option>
                    {% for p in cal_periods %}
                        <option value='{{p.0}}'>{{p.1}}</option>
                    {% endfor %}
                </select>
                <span class="btn btn-primary btn-period-close disabled" style='margin-top:3px;'>期结</span> 
                {% if perms.company.sys_admin %}
                    <div class="btn btn-primary btn-period-create pull-right" style='margin-top:3px;'>新建</div>
                {% endif %}
            </div>

            
            <div class='col-md-12 form-group' >
            <div  class="table-responsive">
                <table id='tb_closing'  class="table table-striped table-bordered dt-responsive nowrap" cellspacing="0" width="100%">
                <thead>
                    <tr><th rowspan=2>期结名称</th><th colspan=2>平台商</th><th colspan=2>二级商</th>
                        <th rowspan=2>创建时间</th><th rowspan=2>期结时间</th>
                        <th rowspan=2>账单笔数</th><th rowspan=2>应付款金额</th><th rowspan=2>申请提现笔数</th>
                        <th rowspan=2>申请提现金额</th><th rowspan=2>已付款笔数</th><th rowspan=2>已付款金额</th>
                        <th rowspan=2>关闭</th>
                    </tr>
                    <tr>
                        <th>开始日期</th><th>结束日期</th><th>开始日期</th><th>结束日期</th>
                    </tr>    
                </thead>
                <tbody></tbody>
                <tfoot></tfoot>
                </table>
            </div>
            </div>

        </div>
        <div role="tabpanel" class="tab-pane fade" id="tab_2">
            <div class='col-md-12 form-inline' style='margin-bottom:20px;'>
            会计期：<select id='period_payable' class='form-control' style='width:200px;margin-right:20px;'>   
                    {% for p in periods %}
                        <option value='{{p.0}}'>{{p.1}}</option>
                    {% endfor %}                   
                </select>
            层级：<select id='lv_id' class='form-control' style='width:100px;margin-right:20px;'>
                <option value=''>所有</option>
                <option value='2'>一级</option>
                <option value='4'>二级</option>
            </select>
            <span class="btn btn-primary btn-period-payable" style='margin-top:3px;'>查询</span> 
            
            <!--
                <span class="btn btn-primary btn-check-payable"  style='margin-top:3px;'>审核</span> 
            -->

            <div  class="col-sm-7 input-group pull-right">
                <span> 
                    本期奖励:<span class='tt-amt tt-amt' style='font-weight:bold;'></span>
                    上期余额:<span class='tt-amt tt-balance' style='font-weight:bold;'></span>
                    本期应提:<span class='tt-amt tt-total' style='font-weight:bold;'></span>
                    本期提现：<span class='tt-amt tt-paid_amt' style='font-weight:bold;'></span>
                    本期税金：<span class='tt-amt tt-paid_vat' style='font-weight:bold;'></span>
                    本期付款：<span class='tt-amt tt-paid_total' style='font-weight:bold;'></span>
                </span>
            </div>

            </div>

            <div class='col-md-12 form-group' >
            <div  class="table-responsive">
                <table id='tb_payable'  class="table table-striped table-bordered dt-responsive nowrap" cellspacing="0" width="100%">
                <thead>   
                    {% for c in clmns_payable %}
                        <th>{{c}}</th>
                    {% endfor %}
                </thead>
                <tbody></tbody>
                <tfoot>
                    {% for c in clmns_payable %}
                        {% ifequal forloop.counter 2 %}
                            <th>合计：</th>
                        {% else %}
                            <th></th>
                        {% endifequal %}
                    {% endfor %}  
                </tfoot>
                </table>
            </div>
            </div>            

        </div>
        <div role="tabpanel" class="tab-pane fade" id="tab_3">
            <div class='col-md-12 form-inline' style='margin-bottom:20px;'>
                会计期：<select id='period_application' class='form-control' style='width:150px;margin-right:20px;'>  
                {% for p in periods %}
                        <option value='{{p.0}}'>{{p.1}}</option>
                    {% endfor %}                   
                </select>
                状态:<select id='status_application' class='form-control'  style='margin-right:20px;'>
                    <option value='' >所有</option>
                    {% for obj in status %}
                        <option value='{{obj.0}}'>{{obj.1}}</option>
                    {% endfor %}
                </select>
                转帐方式:<select id='payment_method' class='form-control'  style='margin-right:20px;'>
                    <option value='' >所有</option>                   
                    <option value='1'>微信钱包</option>
                    <option value='2'>银行转帐</option>
                </select>
                提现方式:<select id='invoice_needed' class='form-control'  style='margin-right:20px;'>
                    <option value='' >所有</option>                   
                    <option value='1'>开票提现</option>
                    <option value='0'>不开票提现</option>
                </select>
            <span class="btn btn-primary btn-period-application" style='margin-top:3px;'>查询</span>   
            <div  class="col-sm-4 input-group pull-right">
                提现：<span class='gtt_amt' style='font-weight:bold;margin-right:20px;'></span>  
                税额：<span class='gtt_vat' style='font-weight:bold;margin-right:20px;'></span> 
                合计：<span class='gtt_total' style='font-weight:bold;margin-right:20px;'></span> 
            </div>


            </div>
            <div class='col-md-12 form-group' >
            <div  class="table-responsive">
                <table id='tb_application'  class="table table-striped table-bordered dt-responsive nowrap" cellspacing="0" width="100%">
                <thead> 
                    {% for c in clmns_application %}
                        <th>{{c}}</th>
                    {% endfor %}
                </thead>
                <tbody></tbody>
                <tfoot>
                    <!--
                    <tr class='fnd'>
                        {% for c in clmns_application %}                       
                            <th><input type="text" placeholder="{{c}}"></th>   
                        {% endfor %}
                    </tr>
                    -->

                    <tr class='tt'>{% for c in clmns_application %}
                        {% ifequal forloop.counter 2 %}
                            <th>合计：</th>
                        {% else %}
                            {% ifequal forloop.counter 6 %}
                                <th class='tt_amt'></th>
                            {% else %}
                                {% ifequal forloop.counter 8 %}
                                    <th class='tt_vat'></th>
                                {% else %}
                                    {% ifequal forloop.counter 9 %}
                                        <th class='tt_total'></th> 
                                    {% else %}
                                        <th></th>
                                    {% endifequal %}
                                {% endifequal %}
                            {% endifequal %}
                        {% endifequal %}
                    {% endfor %}</tr>                    
                </tfoot>
                </table>
            </div>
            </div>
        </div>

        <div role="tabpanel" class="tab-pane fade" id="tab_5">
            <div class='col-md-12 form-inline' style='margin-bottom:20px;'>
                会计期：<select id='period_lv1' class='form-control' style='width:200px;'>  
                {% for p in periods %}
                        <option value='{{p.0}}'>{{p.1}}</option>
                    {% endfor %}                   
                </select>
                <span class="btn btn-primary btn-period-lv1" style='margin-top:3px;'>查询</span>             

                <div  class="col-sm-2 input-group pull-right">
                    转预付款总金额：<span class='gtt' style='font-weight:bold;'></span>        
                </div>
            </div>

            
            <div class='col-md-12 form-group' >
            <div  class="table-responsive">
                <table id='tb_lv1'  class="table table-striped table-bordered dt-responsive nowrap" cellspacing="0" width="100%">
                <thead>  
                    {% for c in clmns_lv1 %}
                        <th>{{c}}</th>
                    {% endfor %}
                </thead>
                <tbody></tbody>
                <tfoot>
                    <tr class='fnd'>
                        {% for c in clmns_lv1 %}                       
                            <th><input type="text" placeholder="{{c}}"></th>   
                        {% endfor %}
                    </tr>   
                    <tr>
                    {% for c in clmns_lv1 %}                        
                        {% ifequal forloop.counter 2 %}
                            <th>合计：</th>
                        {% else %}
                            {% ifequal forloop.counter 4 %}
                                <th class='tt_amt'></th>
                            {% else %}
                                {% ifequal forloop.counter 5 %}
                                    <th class='tt_balance'></th>
                                {% else %}
                                    {% ifequal forloop.counter 6 %}
                                        <th class='tt_total'></th> 
                                    {% else %}
                                        <th></th>
                                    {% endifequal %}
                                {% endifequal %}
                            {% endifequal %}  
                        {% endifequal %}
                    {% endfor %}  
                    </tr>
                </tfoot>
                </table>
            </div>
            </div>            
        </div>



        
        <div role="tabpanel" class="tab-pane fade" id="tab_4">
            <div class='col-md-12 form-inline' style='margin-bottom:20px;'>
                会计期：<select id='period_transfer' class='form-control' style='width:200px;margin-right:20px;'>  
                {% for p in periods %}
                        <option value='{{p.0}}'>{{p.1}}</option>
                {% endfor %}                   
                </select>


                状态:<select id='transfer_status' class='form-control'  style='margin-right:20px;'>
                        <option value='' >所有</option>
                        <option value='3,10'>待转帐</option>
                        <option value='6'>已转帐</option>
                </select>

                转帐方式:<select id='transfer_method' class='form-control'  style='margin-right:20px;'>
                    <option value='' >所有</option>                   
                    <option value='1'>微信钱包</option>
                    <option value='2'>银行转帐</option>                    
                </select>
               
                <span class="btn btn-primary btn-period-transfer" style='margin-top:3px;'>查询</span>   

                <span class="btn btn-primary btn-period-wx_pay disabled" style='margin-top:3px;'>微信转帐</span>

                <div  class="col-sm-3 input-group pull-right">
                    待转帐：<span class='gtt gtt_unpaid' style='font-weight:bold;margin-right:20px;'></span>  
                    已转帐：<span class='gtt gtt_paid' style='font-weight:bold;'></span> 
                </div>
            </div>
            <div class='col-md-12 form-group' >
            <div  class="table-responsive">
                <table id='tb_transfer'  class="table table-striped table-bordered dt-responsive nowrap" cellspacing="0" width="100%">
                <thead>  
                    {% for c in clmns_transfer %}
                        <th>{{c}}</th>
                    {% endfor %}
                </thead>
                <tbody></tbody>
                <tfoot>
                    <tr class='fnd'>
                        {% for c in clmns_transfer %}                       
                            <th><input type="text" placeholder="{{c}}"></th>   
                        {% endfor %}
                    </tr>  
                    <tr> 
                    {% for c in clmns_transfer %}
                        {% ifequal forloop.counter 2 %}
                            <th>合计：</th>

                        {% else %}                            
                            {% ifequal forloop.counter 5 %}
                                <th class='tt_amt'></th>
                            {% else %}
                                {% ifequal forloop.counter 6 %}
                                    <th class='tt_balance'></th>
                                {% else %}
                                    {% ifequal forloop.counter 8 %}
                                        <th class='tt_vat'></th> 
                                    {% else %}
                                        {% ifequal forloop.counter 9 %}
                                            <th class='tt_tt'></th> 
                                        {% else %}                                        
                                            <th></th>
                                        {% endifequal %}
                                    {% endifequal %}
                                {% endifequal %}
                            {% endifequal %} 
                        {% endifequal %}                        
                    {% endfor %}  
                </tr></tfoot>

                </table>
            </div>
            </div>            
        </div>
        

        
    </div>    
</div>
</div>   



