<style>
    .table>tbody>tr>td, .table>tbody>tr>th, .table>tfoot>tr>td, .table>tfoot>tr>th, .table>thead>tr>td, .table>thead>tr>th {
        padding: 8px;
        line-height: 1.42857143;
        vertical-align: top;
        
        color: #000;
    }
    .mouse-cursor{
        
    }
</style>  
<div class="wrapper">
            <div class="container">
                <!-- Page-Title -->
                
                <div class="row hidden-print">
                    <div class="col-sm-12" >
                        <div class="col-sm-2" >
                            <h4 class="page-title">Payment Slips</h4>
                        </div>
                        <form method="post" action="<?php echo base_url();?>staff_controller/printslips">
                        <div class="col-sm-8 m-t-15 " style="text-align:right;">
                             <div class="col-sm-3">
                                <select type="text" id="selected_staff" name="staff_id" class="form-control" >
                                    <?php foreach ($staff as $s){?>
                                    <option <?php if($selected_staff == $s['id_staff']){ echo "selected='seleted'";} ?> value='<?php echo $s['id_staff']; ?>'><?php echo $s['staff_fullname']?></option>
                                    <?php } ?>
                                </select>    
                            </div>

                            <div class="col-sm-3 ">
                                
                               <select class="form-control" onchange="$('#month').val($('#selected_month option:selected').text());" id="selected_month" name="selected_month">
                                   <?php $month = $lastmonthyear[0]['Month']; ?>
                                       <option value="1" <?php if ($month === '1') {
                                           echo "selected";
                                       } ?> >January</option>
                                       <option value="2" <?php if ($month === '2') {
                                           echo "selected";
                                       } ?>>February</option>
                                           <option value="3" <?php if ($month === '3') {
                                           echo "selected";
                                       } ?>>March</option>
                                           <option value="4" <?php if ($month === '4') {
                                           echo "selected";
                                       } ?>>April</option>
                                           <option value="5" <?php if ($month === '5') {
                                           echo "selected";
                                       } ?>>May</option>
                                           <option value="6" <?php if ($month === '6') {
                                           echo "selected";
                                       } ?>>June</option>
                                           <option value="7" <?php if ($month === '7') {
                                           echo "selected";
                                       } ?>>July</option>
                                           <option value="8" <?php if ($month === '8') {
                                           echo "selected";
                                       } ?>>August</option>
                                           <option value="9" <?php if ($month === '9') {
                                           echo "selected";
                                       } ?>>September</option>
                                           <option value="10" <?php if ($month === '10') {
                                           echo "selected";
                                       } ?>>October</option>
                                           <option value="11" <?php if ($month === '11') {
                                           echo "selected";
                                       } ?>>November</option>
                                           <option value="12" <?php if ($month === '12') {
                                           echo "selected";
                                       } ?>>December</option>
                               </select>
                                <input type="hidden" name="month" id="month">
                            </div>
                             <div class="col-sm-2  ">
                               <select class="form-control" name="selected_year" id="selected_year">
                                   <?php $year=$lastmonthyear[0]['Year']; for($x=1; $x<=4; $x++){?>
                                   <option value="<?php echo $year;?>" <?php if($year===$lastmonthyear[0]['Year']){ echo "selected";} ?>><?php echo $year;?></option>
                                   <?php $year=$year-1; }?>
                               </select>
                            </div>
                            <div class='col-sm-2'>
                                <button type="submit"  class="btn btn-pink waves-effect waves-light  pull-right" ><span class="m-l-5"><i class="fa fa-refresh"></i> Generate Slip</span></button>
                            </div>
                        </div>
                        
                    </form>
                        <div class="col-sm-2 pull-right" >
                            <div class="m-t-15">
                                 <div class="btn-group">
                                    <button type="button" class="btn btn-warning dropdown-toggle waves-effect waves-light" data-toggle="dropdown" aria-expanded="true">Staff Payments<span class="m-l-5"><i class="fa fa-money"></i></span></button>
                                    <ul class="dropdown-menu" role="menu">
                                        <li><a href="<?php echo base_url(); ?>staff_list">Staff</a></li>
                                        <li><a href="<?php echo base_url();?>calculatemonthstaffpayment">Monthly Salary Calculation</a></li>
                                        <li><a href="<?php echo base_url();?>view_staff_payables_receivables/<?php echo $this->session->userdata('businessid'); ?>">Make Payments To Staff </a></li>
                                        <li class="divider"></li>

                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <?php if(isset($vouchers) && $vouchers !==''){?>
                <div class="row">
                    <div class="col-md-12">
                        <div class="panel panel-default">
                            <div class="panel-body" >
                                <div id="print_area" style="color:#000;">
                                 <div class="row">
                                    <div class="pull-left">
                                        <h3 class="logo invoice-logo"><?php if(isset($business)){ echo "<img src='".base_url().'assets/images/business/'.$business[0]['business_logo']."' alt='".$business[0]['business_name']."' class='img-responsive' />";} else {echo 'SalonPK';}?></h3>
                                    </div>
                                    <div class="pull-right">
                                        <p><strong>Print Date: </strong> <?php echo date('d-m-Y'); ?></p>
                                        <p><strong>Payment Type: </strong>Staff Payment Slip</p>
                                    </div>
                                </div>    
                                <?php $current_vid=0; foreach($vouchers as $voucher){ ?>    
                                    <div class="row">
                                        <div class="pull-left">
                                            <table class="table" style="padding:2px;">
                                                <tr>
                                                    <td>Emplyee Name: </td><td><span style="padding-left:15px; color:#000; font-size:14px; font-weight: bold;"><?php echo $voucher[0]['staff_fullname']; ?></span></td>
                                                    <td style="width:150px;"></td>
                                                    <td>Date Of Joining </td><td><span style="padding-left:15px; color:#000; font-size:14px; font-weight: bold;"><?php echo $voucher[0]['staff_date_of_joining']; ?></span></td>
                                                    
                                                </tr>
                                                <tr>
                                                    <td>Designation: </td><td><span style="padding-left:15px; color:#000; font-size:14px; font-weight: bold;"><?php echo $voucher[0]['staff_designation']; ?></span></td>
                                                    <td style="width:20px;"></td>
    `                                               <td>CNIC</td><td><span style="padding-left:15px; color:#000; font-size:14px; font-weight: bold;"><?php echo $voucher[0]['staff_cnic']; ?></span></td>
                                                </tr>
                                                <tr>
                                                    <td>Department: </td><td><span style="padding-left:15px; color:#000; font-size:14px; font-weight: bold;"><?php echo $voucher[0]['staff_department']; ?></span></td>
                                                    <td style="width:20px;"></td>
                                                    <td>Account Number </td><td><span style="padding-left:15px; color:#000; font-size:14px; font-weight: bold;"><?php echo $voucher[0]['staff_bank_account']; ?></span></td>
                                                </tr>
                                                <tr>
                                                    <td>Salary Month: </td><td><span style="padding-left:15px; color:#000; font-size:14px; font-weight: bold;"><?php echo $lastmonthyear[0]['MonthName'];?>, <?php echo $lastmonthyear[0]['Year'];?></span></td>
                                                    <td style="width:20px;"></td>
                                                    <td>Account Title </td><td><span style="padding-left:15px; color:#000; font-size:14px; font-weight: bold;"><?php echo $voucher[0]['staff_bank_account_title']; ?></span></td>
                                                </tr>
                                                <tr>
                                                    <td>Staff System ID:</td><td> <span style="padding-left:15px; color:#000; font-size:14px; font-weight: bold;"><?php echo $voucher[0]['id_staff']; ?></h4></p>
                                                    <td style="width:20px;"></td>
                                                    <td>Bank </td><td><span style="padding-left:15px; color:#000; font-size:14px; font-weight: bold;"><?php echo $voucher[0]['staff_bank']; ?></span></td>
                                                </tr>
                                                <tr>
                                                    <td>Employee Code:</td><td><span style="padding-left:15px; color:#000; font-size:14px; font-weight: bold;"><?php echo $voucher[0]['staff_eid']; ?></h4></td>
                                                    <td style="width:20px;"></td>
                                                    <td>Pay Day</td><td></td>
                                               </tr>
                                            </table>
                                        </div>
                                        <div class="pull-right">
                                            <p ><strong>Voucher ID: </strong> <?php echo $voucher[0]['id_account_vouchers']; ?></p>
                                            <p ><strong>Date: </strong> <?php echo  $voucher[0]['payment_date']; ?></p>
                                            <p id="modep"><strong>Payment Type: </strong>Salary</p>
                                        </div>
                                    </div>
                                    
                                    <div class="row">
                                        <div class="col-md-12">
                                        <table class="table table-bordered" style="border-bottom: 1px solid #000; border-top: 1px solid #000;">  
                                            <thead>
                                                <tr>
                                                    <th class="text-center" style="border-bottom: 1px solid #000; border-right: 1px solid #000;"><strong>PAYABLE</strong></th>
                                                    <th class="text-center" style="border-bottom: 1px solid #000;"><strong>DEDUCTION</strong></th>
                                                </tr>
                                            </thead>
                                            <tbody>
                                                
                                                <tr>
                                                    <td style=" border-right: 1px solid #000;">
                                                        <table class="table" >
                                                            <thead>
                                                                <tr >
                                                                    <th >Item</th>
                                                                    <th class="text-right" >Debit</th>
                                                                    <th class="text-right" >Credit</th>
                                                                    <th></th>
                                                                </tr>
                                                            </thead>
                                                            <tbody>
                                                                <?php $debit=0;  foreach($voucher as $key=>$row){ if($key !== 'payments'){?>
                                                                <?php if($row['debit_amount'] > 0 && $row['entity_name'] !== 'salary_payable'){?>
                                                                <tr>
                                                                    <td><?php echo str_replace('Expense', '', $row['account_head']); $staffname = $row['staff_name'];?></td>
                                                                    <td class="text-right"><?php if($row['debit_amount'] > 0){ echo $row['debit_amount'];} $debit=$debit+$row['debit_amount'];?></td><!-- comment -->
                                                                    <td class="text-right"><?php if($row['credit_amount'] > 0){ echo $row['credit_amount'];} //$credit=$credit+$row['credit_amount'];?></td>
                                                                    <td></td>
                                                                </tr>
                                                                <?php }}} ?>
                                                            </tbody>
                                                            <tfoot>
                                                                <tr>
                                                                    <th></th>
                                                                    <th class="text-right"></th>
                                                                    <th class="text-right"></th>
                                                                    <th></th>
                                                                </tr>
                                                            </tfoot>
                                                        </table>                                            
                                                    </td><!-- end col -->
                                                    <td >
                                                        <table class="table" >
                                                            <thead>
                                                                <tr>
                                                                    <th >Item</th>
                                                                    <th class="text-right">Debit</th>
                                                                    <th class="text-right">Credit</th>
                                                                    <th></th>
                                                                </tr>
                                                            </thead>
                                                            <tbody>
                                                                <?php  $credit=0; foreach($voucher as $key=>$row){ if($key !== 'payments'){?>
                                                                <?php if($row['credit_amount'] > 0 && $row['entity_name'] !== 'salary_payable'){?>
                                                                <tr>
                                                                    <td><?php echo $row['account_head'];?></td>
                                                                    <td class="text-right"><?php if($row['debit_amount']>0){ echo $row['debit_amount'];} //$debit=$debit+$row['debit_amount'];?></td><!-- comment -->
                                                                    <td class="text-right"><?php if($row['credit_amount']>0){ echo $row['credit_amount'];} $credit=$credit+$row['credit_amount'];?></td>
                                                                    <td></td>
                                                                </tr>
                                                                <?php }}} ?>
                                                            </tbody>
                                                            <tfoot>
                                                                <tr>
                                                                    <th></th>
                                                                    <th class="text-right"></th>
                                                                    <th class="text-right"></th>
                                                                    <th></th>
                                                                </tr>
                                                            </tfoot>
                                                        </table>                                            
                                                    </td><!-- end col -->
                                                </tr>
                                            
                                                <tr>
                                                    <td style="border-right: 1px solid #000; border-bottom: 1px solid #000;"> 
                                                        <table class="table">
                                                            <tr>
                                                                <th >Total Payable Amount : </th>
                                                                <th class="text-right"><?php echo $debit; ?></th>
                                                                <th class="text-right"></th>
                                                                <th ></th>
                                                            </tr>
                                                        </table>
                                                    </td>
                                                    <td style="border-bottom: 1px solid #000;">
                                                        <table class="table"  >
                                                            <tr>
                                                                <th >Total Deduction Amount :</th>
                                                                <th class="text-right"></th>
                                                                <th class="text-right"><?php echo $credit; ?></th>
                                                                <th ></th>
                                                            </tr>
                                                        </table>
                                                    </td>
                                                </tr>
                                            </tbody>
                                        </table>
                                        </div>
                                    </div><!-- end row -->
                                 
                                        
                                    <div class="row m-t-20">
                                        <div class="col-md-12 col-sm-12 col-xs-12 ">
                                            <table class="table table-bordered" style="border-bottom: 1px solid #000; border-top: 1px solid #000;">
                                                <thead>
                                                    <tr>
                                                        <th></th>
                                                        <th class="text-right">Debit</th>
                                                        <th class="text-right">Credit</th>
                                                        <th></th>
                                                    </tr> 
                                                </thead>
                                                <tbody>    
                                                    <tr>
                                                        <td >TOTAL PAYABLE TO <?php echo $staffname; ?> (Payable - Deduction) </td>
                                                        <td class="text-right" ><?php echo $debit-$credit;?></td>
                                                        <td class="text-right"></td>
                                                        <td class="text-right"></td>
                                                    <tr>
                                                    <?php foreach($voucher as $key=>$payments){ if($key==='payments'){ ?>    
                                                    <?php foreach($payments as $row){ ?>
                                                    <tr>
                                                        <td><?php echo $row['payment_remarks'];?></td>
                                                        <td  style=""></td>
                                                        <td  class="text-right" ><?php echo $row['debit_amount']; $paidout=$row['debit_amount'];  ?></td>
                                                        <td  style=""></td>
                                                    </tr>
                                                    <?php } ?>
                                                     <?php }} ?>   
                                                </tbody>
                                                <tfoot>
                                                    <tr>
                                                        <th style="border-top: 1px solid #000;">Remaining Payable:</th>
                                                        <th style="border-top: 1px solid #000;"></th>
                                                        <th style="border-top: 1px solid #000;" class="text-right"><?php echo round($debit-$credit - $row['debit_amount'],2);  ?></th>
                                                        <th style="border-top: 1px solid #000;"></th>
                                                    </tr>
                                                    
                                                </tfoot>    
                                                        
                                            </table>
                                        </div>
                                    </div>
                                   
                                <?php } ?>
                                    <div class="row" style="margin-top: 50px;">
                                        <div class="col-md-4 col-sm-4 col-xs-4 ">
                                            <div class="row">
                                                <div class="col-xs-12">
                                                    ________________________
                                                </div>
                                            </div>
                                            <div class="row">
                                                <div class="col-xs-12">
                                                    <span>Prepared By</span>
                                                </div>
                                            </div>
                                            
                                        </div>
                                        <div class="col-md-4 col-sm-4 col-xs-4 ">
                                             <div class="row">
                                                <div class="col-xs-12">
                                                    ________________________
                                                </div>
                                            </div>
                                            <div class="row">
                                                <div class="col-xs-12">
                                                    <span>Approved By</span>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-md-4 col-sm-4 col-xs-4 ">
                                             <div class="row">
                                                <div class="col-xs-12">
                                                    ________________________
                                                </div>
                                            </div>
                                            <div class="row">
                                                <div class="col-xs-12">
                                                    <span>Received By</span>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-md-4 col-sm-4 col-xs-4 "></div>
                                    </div>
                                    <hr>
                                    <div class="row">
                                        <div class="col-md-12 col-sm-12 col-xs-12 ">
                                           <div class="clearfix m-t-10">
                                                <h5 class="small text-inverse font-600"></h5>
                                                <?php echo $business[0]['business_name'];?><br>
                                                <small>
                                                    <?php echo $business[0]['business_address'];?>
                                                    <?php echo $business[0]['business_phone1'];?>
                                                </small>
                                            </div>
                                        </div>
                                    </div>
                                
                                </div>
                                <hr>
                                <div class="hidden-print">
                                    <div class="pull-right">
                                        <a href="javascript:window.print()" class="btn btn-inverse waves-effect waves-light" id="btnprint"><i class="fa fa-print"></i></a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <!-- end row -->
                <?php } ?>
               
<script>
 $('document').ready(function(){
     $('#month').val($('#selected_month option:selected').text());
 });   
 function reloadslips(){
     $("#print_area").html('');
      $.ajax({
            type: 'POST',
            url: '<?php echo base_url();?>staff_controller/searchpayments',
            data: {payment_month: $("#selected_month :selected").val(), month: $("#selected_month :selected").text(), payment_year: $("#selected_year :selected").val(), payment_type: $("#selected_type :selected").val(), staff_id:$("#selected_staff :selected").val()},
            dataType: "json",
            cache: false,
            async: true,
            success: function(data) {
                
                console.log(data);
                mhtml="";
                var today = new Date();
                var dd = today.getDate();
                var mm = today.getMonth()+1; 
                var yyyy = today.getFullYear();
                var total=0;
                    mhtml +='<div class="row m-b-30 m-t-30"><div class="pull-left">';
                    mhtml +='<h3 class="logo invoice-logo"><?php if(isset($business)){ echo "<img src=\"".base_url()."assets/images/business/".$business[0]['business_logo']."\" alt=\"".$business[0]["business_name"]."\" class=\"img-responsive\" />";} else {echo "SkedWise";}?>';
                    mhtml +='</h3></div><div class="pull-right">';
                    mhtml +='<p class="m-t-30"><strong>Date: </strong> '+ dd + '-' + mm + '-' + yyyy +'</p></div></div>';
                    mhtml +='<table class="table table-bordered">';
                    mhtml +='<tr>';    
                    mhtml +='<td><h4 class="text-inverse font-600">Name          :         '+data[0]['staff_name']+'</h4></td><td colspan="2"><h4 class="text-inverse font-600">Staff #:   '+ data[0]['staff_number'] +'</h4></td>';
                    mhtml +='</tr>';
                    mhtml +='<tr >';    
                    mhtml +='<td class="text-inverse font-600" style="border-bottom:1px solid #808080; border-top:1px solid #808080;">Remarks</td><td class="text-inverse font-600" style="border-bottom:1px solid #808080; border-top:1px solid #808080;">Payment Month</td><td class="text-inverse font-600" style="border-bottom:1px solid #808080; border-top:1px solid #808080; text-align:right;">Deductions</td><td class="text-inverse font-600" style="border-bottom:1px solid #808080; border-top:1px solid #808080; text-align:right;">Amount</td>';
                    mhtml +='</tr>';
                for (x = 0; x < data.length; x++) {    
                    mhtml +='<tr>' ;   
                        mhtml +='<td><h5>'+data[x]['account_head']+'</h5></td>';
                        mhtml +='<td ><h5>'+data[x]['payment_month']+' '+data[x]['payment_year']+'</h5></td>';
                        mhtml +='<td><h5>'+data[x]['debit_amount']+'</h5></td>';
                        mhtml +='<td style="text-align:right"><h5 class="text-inverse font-600">'+data[x]['debit_amount'].toString().replace(/,/g, "").replace(/\B(?=(\d{3})+(?!\d))/g, ",")+'</h5>'; 
                    mhtml +='</tr>';
                    total = total + parseFloat(data[x]['debit_amount']);
                    }
                    mhtml +='<tr>' ;   
                    mhtml += '<td style="border-top:1px solid #808080; text-align:right;" colspan=3><h4 class="text-inverse font-600" >Total</h4></td><td style="text-align:right"><h4 class="text-inverse font-600">'+total.toString().replace(/,/g, "").replace(/\B(?=(\d{3})+(?!\d))/g, ",") +'</h4></td>';
                    mhtml +='</tr>' ;   
                    mhtml +='</table>';
                    mhtml +='<br/><br/><div class="row m-t-50"><div class="col-md-12 col-sm-12 col-xs-12 "><div class="pull-left">';
                        mhtml +='<h5 >Employee __________________</h5>';
                    mhtml +='</div>';
                    mhtml +='<div class="pull-right ">';
                        mhtml +='<h5>Director ___________________</h5>';
                    mhtml +='</div>';
                    mhtml +='</div><!-- end col --></div><!-- end row -->';
                    mhtml +='</div></div><div class="row"><div class="col-md-12 col-sm-12 col-xs-12 "><div class="clearfix m-t-10 m-b-20">';
                    mhtml +='';
                    mhtml +='<small></small>';
                    mhtml +='</div></div></div>';
                    
                
                $("#print_area").html(mhtml);
            }
        });
     
     
 }
   
    
   

</script>
