<div class="wrapper">
    <div class="container">
        <!-- Page-Title -->
        <div class="row">
            <div class="col-sm-12">
                <h4 class="page-title">Service Commission of Staff For : <?php echo $monthName.'-'.$year; ?></h4>
                <a class="btn btn-warning" href="<?php echo base_url(); ?>view_retail_staff_commission_single/<?php echo $payables[0]['id_staff']."/".$month.'/'.$year; ?>" target="_blank">Retail commission</a>
            </div>
        </div>

        <div class="row" id="divselection">
            <div class="col-sm-12">
                <div class="card-box ">
                    <h4><?php echo $payables[0]['staff_fullname']; ?></h4>
                </div>
            </div>
        </div>

        <div class="row" id="divselection">
            <div class="col-sm-12">
                <div class="card-box ">
                    
                    <table id="tblstaff" class="table  table-striped">
                        <thead>
                            <tr>
                                <th>Date</td>
                                <th>Day</td>
                                <th>Commission Mode</td>
                                <th>Target</td>
                                <th>Income Generated</th>
                                <th>Commission</th>
                                <th>Requested</th>                               
                                <th>Additional Staff</th>
                            </tr>
                        </thead>
                        <tbody>
                            
                            <?php $commission=0; $income=0; foreach($payables as $payable){ ?>
                            <tr>
                                <td><?php echo date_format(date_create($payable['Date']), 'd-m-Y'); ?></td>
                                <td><?php echo $payable['Day']; ?></td>
                                <td class="text-center"><?php echo $payable['commission_mode']; ?></td>
                                <td class="text-center"><?php echo $payable['commission_mode']=='Target' ? $payable['commission_target'] : ''; ?></td>
                                <td class="text-center"><?php echo $payable['paid']; $income = $income + $payable['paid']; ?></td>
                                <td class="text-center "><?php echo $payable['service_commission']; $commission = $commission + $payable['service_commission'];?></td>
                                <td><?php echo $payable['requested']; ?></td>
                                <td><?php echo $payable['additional_staff']; ?></td>
                            </tr>
                            <?php } ?>
                        </tbody>
                        <tfoot>
                            <tr>
                                <th colspan="4"></th>
                                <th class="text-center"><?php echo $income;?></th>
                                <th class="text-center"><?php echo $commission;?></th>
                                <th colspan="2"></th>
                            </tr>
                        </tfoot>
                    </table>
                </div>
            </div>
        </div>
    </div>

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

        $('#tblstaff').DataTable({
            lengthMenu: [[10, 25, 50, -1], [10, 25, 50, "All"]],
            stateSave: true,
            <?php if(DOWNLOAD == true || $this->session->userdata('role') == 'Admin' || $this->session->userdata('role')=='Super User'){ ?>
            dom: "Bfrtlip",
            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"}],
            <?php } else { ?>
                dom: "frtlip",
            <?php } ?> 
            responsive: 0,
            "order": [[ 0, "asc" ]]

        });
    });
    
    
    </script>