<div class="wrapper">
    <div class="container">
        <!-- Page-Title -->
        <div class="row hidden-print">
            
            <div class="pull-left col-sm-8">
                <h4 class="page-title">Staff Payables as on : <?php echo date('d-m-Y'); ?></h4>
            </div>            
        </div>
            
        <div class="row" id="divselection">
            <div class="col-sm-12">
                <div class="card-box">
                    <div class="row">
                        <div class="col-md-12">
                            <h4>Staff Payables Sheet for Approval </h4>
                            <p>Date: <?php echo date('d-m-Y H:i:s');?></p>
                            <table id="tblstaff" class="table  table-bordered">
                                <thead>
                                    <tr>                                
                                        <th>Staff ID</th>
                                        <th>Emp. ID</th>
                                        <th>Name</th>
                                        <th>Bank Account</th>
                                        <th>Voucher</th>
                                        <th>Salary Month</th>
                                        <th>Year</th>
                                        <th class="text-right">Wages Payable</th>
                                        <th>Description</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    
                                    <?php $totalpayables=0; $totalreceivables=0; foreach($payables as $payable){ 
                                        if($payable['salary_payable'] > 0){
                                        ?>
                                    <tr id="<?php echo $payable['id_staff']."_".$payable['id_account_vouchers']; ?>">
                                        
                                        <td key="staff_id" type="ignore"><?php echo $payable['id_staff']; ?></td>
                                        <td key="staff_id" type="ignore"><?php echo $payable['staff_eid']; ?></td>
                                        <td key="staff_fullname" type="ignore" name="staff_name"><?php echo $payable['staff_fullname']; ?></td>
                                        <td><?php echo $payable['staff_account'];?></td>
                                        <td key="voucher_id" type="ignore"><?php echo $payable['id_account_vouchers']; ?></td>
                                        <td key="month" type="ignore"><?php echo date_create($payable['voucher_date'])->format('F'); ?></td>
                                        <td key="year" type="ignore"><?php echo $payable['voucher_year']; ?></td>
                                        <td key="payable" type="ignore" name="payable" id="payable_<?php echo $payable['id_staff']."_".$payable['id_account_vouchers']; ?>" class="text-right" ><?php echo number_format($payable['salary_payable'],2); $totalpayables = $totalpayables +$payable['salary_payable']; ?></td>                                                                    
                                        <td><?php echo $payable['description']; ?></td>                                    
                                    </tr>
                                    <?php } } ?>
                                </tbody>
                                <tfoot>
                                    <tr>
                                        <th colspan="7"></th>
                                        <th class="text-right"><?php echo number_format($totalpayables);?></th>
                                        <th class="text-right"><label style="text-align: right;" class="form-label" id="totalpayablelabel"></label></th>
                                        
                                        
                                    </tr>
                                </tfoot>
                            </table>
                        </div>                        
                    </div>
                    <div class="row m-t-40">
                        <div class="col-md-12 col-sm-12 col-xs-12 m-t-40">
                            <table class='' style='border:none !important; width:100%; text-align: center; color:#000;'>
                                <tr>
                                    <td>________________________________</td>
                                    <td>________________________________</td>
                                    <td>________________________________</td>   
                                    <td>________________________________</td>
                                </tr>
                                <tr>
                                    <td>PREPARED BY </td>
                                    <td>MANAGER FINANCE </td>
                                    <td>EXECUTIVE DIRECTOR </td>
                                    <td>APPROVED BY </td>
                                </tr>
                            </table>
                            
                        </div>
                    </div>
                </div>

                <div class="row hidden-print">
                    <div class="col-md-12" >
                    <a href="javascript:window.print()" class="btn btn-inverse waves-effect waves-light pull-right" id="btnprint" ><i class="fa fa-print"></i></a>
                    </div>
                </div>

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

    <script>
        
    $(document).ready(function() {

        // $('#tblstaff').DataTable({
        //     lengthMenu: [[10, 25, 50, -1], [10, 25, 50, "All"]],
        //     stateSave: true,
        //     dom: "Bfrtlip",
        //     "bPaginate": false,
        //     buttons: [{extend: "copy", className: "btn-sm btn-custom btn-trans"}, {extend: "csv", className: "btn-sm btn-pink btn-trans"}, {
        //             extend: "excel",
        //             className: "btn-sm btn-warning btn-trans"
        //         }, {extend: "pdf", className: "btn-sm btn-purple btn-trans"}],
        //     responsive: 0,
        //     "order": [[ 1, "asc" ]],
        //     "columnDefs": [{targets: 0, orderable: false}]
        // });
    
        $(".numeric").keypress(function(e) {
            //if the letter is not digit then display error and don't type anything
            if (e.which != 13 && e.which != 8 && e.which != 0  && e.which != 46 && (e.which < 48 || e.which > 57)) {
                return false;
            }
        });

        $(".decimal").keypress(function(e) {
            //if the letter is not digit then display error and don't type anything
            if (e.which != 13 && e.which != 8 && e.which != 0  && e.which != 46 && (e.which < 48 || e.which > 57) ) {

                return false;
            }
        });

        $('#account_voucher_date').datepicker({
            autoclose: true,
            todayHighlight: true,
            format: 'yyyy-mm-dd'
        }).datepicker('setDate', new Date());;

    });

    function showhidebank(){
       
        if($('input[name=voucher_payment_mode]:checked').val()=="Bank"){
            
            $("#showbank").show();
            $("#showcash").hide();
            $("#showcard").hide();
            $("#payment_mode").val("Bank");
        } else if($('input[name=voucher_payment_mode]:checked').val()=="Cash"){ 
            $("#showbank").hide();
            $("#showcash").show();
            $("#showcard").hide();
            $("#payment_mode").val("Cash");
        } else if($('input[name=voucher_payment_mode]:checked').val()=="Card"){ 
            $("#showbank").hide();
            $("#showcash").hide();
            $("#showcard").show();
            $("#payment_mode").val("Card");
        }
        
    }
    
    function select_action(){
        console.log('selecting action');
        
        var Action  = $("#select_action option:selected").val();
        
        console.log(Action);
        
        if(Action = "payment"){
            staff_payment();
        }else{
            staff_receiving();
        }
        
    }
    
    function staff_payment(){
        
        var TableData;
        TableData = storeOTblValues();
        TableData = $.toJSON(TableData);
        //console.log(TableData); 
        
        
        if (TableData.length > 0) {

            $.ajax({
               type: "POST",
                    url: '<?php echo base_url().'staff_controller/check_staff_payment'; ?>',
                    data: {
                       account_voucher_date: $("#account_voucher_date").val(),
                       payment_mode: $("#payment_mode").val(),
                       instrument_number: $("#instrument_number").val(),
                       bank_account: $("#bank_account").val(),
                       cash_account: $("#cash_account").val(),
                       card_account: $("#card_account").val(),
                       
                       TableData : TableData
                    },
                    success: function(data) {
                        //console.log(data);
                        if(parseInt(data) > 0){
                            toastr.success(data, 'Done!');
                            location.reload();
                        } else { 
                            toastr.error(data, 'Error');
                            toastr.info('No vouchers created at this time', 'Done!');
                        }   
                    }

            });
        }
        
        
    }
    
    
    function storeOTblValues(){
        var TableData = new Array(); var count=0;
        $('#tblstaff tr').each(function(row, tr) {
            //console.log(tr);             
            var a = {}; var dothis=false;
            $('#tblstaff tr[id="'+$(tr).find('td:eq(1)').text()+'_'+$(tr).find('td:eq(3)').text()+ '"] td').each(function(col, td) {
                //console.log($(td).attr('key'));
                var elem = $(td).attr('key') ;
                if(typeof $(td).attr('key') !== 'undefined' && $(td).attr('key') !== ''){
                    //console.log($(td).children('input[type="checkbox"]').is(':checked'));
                    if($(td).attr('type') == 'checkbox'){
                        if($(td).children('input[type="checkbox"]').is(':checked') == true){
                            dothis = true;  
                        }else{
                            dothis = false;  
                        }
                    } else if($(td).attr('type') !== 'add_input' && $(td).attr('type') !== 'subtract_input'){
                        a[elem] = $(td).text();
                    } else{
                        //console.log($(td).children('input[type="text"]').val());
                        a[elem] = $(td).children('input[type="text"]').val();
                    }                    
                }
            });
            //console.log(a);
            if(typeof a !== 'undefined' && dothis == true){  
                TableData[count] = a;
                a={};
                count++;
            }
        });     
        
        //TableData.shift();  // first row will be empty - so remove
        //TableData.shift();
        //TableData.pop();    // last row will be empty - so remove
        
       //console.log(TableData);
        return TableData;
       // return false;
    }
    
    function selectall(){
        var totalpayable = 0;
        if($("#checkall").is(':checked') == true){
            $('#tblstaff tr').each(function(row, tr) {
                //console.log($(tr).find('td:eq(7) input[type="text"]').val());
                $("#checkbox_"+$(tr).find('td:eq(1)').text()+"_"+$(tr).find('td:eq(3)').text()).prop("checked",true);
                if(typeof($(tr).find('td:eq(7) input[type="text"]').val())!=='undefined'){
                    totalpayable = totalpayable + parseFloat($(tr).find('td:eq(7) input[type="text"]').val());
                }               
            });
        } else {
            $('#tblstaff tr').each(function(row, tr) {
                //console.log(tr);
                $("#checkbox_"+$(tr).find('td:eq(1)').text()+"_"+$(tr).find('td:eq(3)').text()).prop("checked",false);
            });
        }
        $("#totalpayablelabel").html(Math.round(totalpayable * 100)/100);
    }
    
    function selectsingle(){
        var totalpayable = 0;
        $('#tblstaff tr').each(function(row, tr) {
            
            //console.log($("#checkbox_"+$(tr).find('td:eq(1)').text()+"_"+$(tr).find('td:eq(3)').text()).is(':checked'));
            if($("#checkbox_"+$(tr).find('td:eq(1)').text()+"_"+$(tr).find('td:eq(3)').text()).is(':checked') === true){
                if(typeof($(tr).find('td:eq(7) input[type="text"]').val())!=='undefined'){
                    totalpayable = totalpayable + parseFloat($(tr).find('td:eq(7) input[type="text"]').val());
                }
            }
        });
        
        $("#totalpayablelabel").html(Math.round(totalpayable * 100)/100);
    }
        
    </script>