<div class="container mt-5 mb-5">
    <div class="card bg-light-transparent">  
            <div class="card-header bg-white">
                <div class="float-left">
                    <h5><?php echo $title ?></h5>
                    <a href="<?php echo base_url('hr/movement/list_report')?>" target="_blank" class="btn btn-outline-dark btn-sm" title="Print Staff Movement">
                        <i class="fa fa-print"></i> Print
                    </a>
                    <button id="btnShowFilters" type="button" class="btn btn-outline-dark btn-sm collapsed" data-trigger="hover" title="Show Filters Box" data-toggle="collapse" data-target="#collapseFilter" aria-expanded="false">
                        <i class="fas fa-filter"></i>Show Filters
                    </button>
                </div>
            </div>
            <div class="collapse" id="collapseFilter">
                <div class="card-header">
                    <div class="row">
                        <div class="col">
                            <div class="card no-shadow">
                                <div class="card-body">
                                    <input type="hidden" id="dept_id" value="<?php echo $department_id ?>">
                                    <div class="row">
                                        <div class="col">
                                             <div class="form-group row">
                                                <label class="col-lg-4">
                                                    Year
                                                </label>                           
                                                <div class="col-lg-8">
                                                    <select name="filter_year" id="filter_year" class="form-control">
                                                    <?php if($yearList) foreach($yearList as $row){
														echo '<option value="'.$row->year.'">'.$row->year.'</option>'; 
													}
													echo '<option value="-1">All</option>'; 
													?>
                                                    </select>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="col">
                                            <div class="form-group row">
                                                <label class="col-lg-4">
                                                    Month
                                                </label>                           
                                                <div class="col-lg-8" >
                                                    <select name="filter_month" id="filter_month" class="form-control">
                                                        <option value="-1">Select Month</option>
                                                          <?php if(!empty($month)) foreach ($month as $row): ?>
                                                                <?php
                                                                if ($row->id == date('n')) {
                                                                    ?>
                                                                    <option value="<?php echo $row->id;?>" selected><?php echo $row->month;?></option>
                                                                
                                                                    <?php
                                                                }else{
                                                                     ?>
                                                                    <option value="<?php echo $row->id;?>"><?php echo $row->month;?></option>
                                                                        
                                                                    <?php
                                                                }
                                                                ?>
                                                            <?php endforeach ?> 
                                                                <option value="-1">All</option>   
                                                    </select>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="row">
                                        <div class="col">
                                             <div class="form-group row">
                                                <label class="col-lg-4">
                                                    Department
                                                </label>                           
                                                <div class="col-lg-8">
                                                    <select name="filter_department" id="filter_department" class=" form-control" <?php echo ($_SESSION['module_data']['role'] != 'admin')? 'disabled': '' ?>>
                                                        <option value="-1">Select Department</option>
                                                            <?php if(!empty($company)) foreach ($company as $row): ?>
                                                                <option value="<?php echo $row['id'];?>" <?php echo ($row['id'] == $deptID)? 'selected': '' ?> ><?php echo $row['name'];?></option>
                                                            <?php endforeach ?> 
                                                        <option value="-1">All</option>   
                                                    </select>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="col">
                                            <div class="form-group row">
                                                <label class="col-lg-4">
                                                    Staff
                                                </label>                           
                                                <div class="col-lg-8" >
                                                    <select name="filter_staff" id="filter_staff" class=" form-control">
                                                        <option value="-1">Select Staff</option>
                                                            <?php if(!empty($staff)) foreach ($staff as $row): ?>
                                                                <option value="<?php echo $row['id'];?>" ><?php echo $row['name'];?></option>
                                                            <?php endforeach ?> 
                                                        <option value="-1">All</option>   
                                                    </select>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="row">
                                        <div class="col d-print-none">
                                            <button class="btn btn-info" id="searchBtn">search</button>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div> 

            <div class="tab-content">
                <div class="tab-pane fade active show" id="tableView" role="tabpanel" aria-labelledby="nav-table-tab">
                    <div class="card-body">
                        <div class="card text-white bg-dark">
                            <div class="card-body">
                                <div class="row">
                                    <div class="col-2"></div>
                                    <div class="col-12 col-md-6">
                                        <div class="row">
                                            <label class="col-12 control-label" for="name" align="left">Year :</label>
                                            <div class="col-12">
                                                <input type="text" name="name" id="name" class="form-control" readonly/>
                                            </div>
                                        </div>
                                        <div class="row">
                                            <label class="col-12 control-label" for="dept_name" >Month:</label>
                                            <div class="col-12">
                                                <input type="text" name="dept_name" id="dept_name" class="form-control" readonly/>
                                            </div>
                                        </div>
                                        <div class="row">
                                            <label class="col-12 control-label" for="dept_name">Department:</label>
                                            <div class="col-12">
                                                <input type="text" name="dept_name" id="dept_name" class="form-control" value="<?php echo $department_name ?>" readonly/>
                                            </div>
                                        </div>
                                    </div>
                                </div>  
                            </div>
                        </div>
                        <div class="card no-shadow">
                            <div class="card-body">
                                <div class="table-responsive">
                                    <table class="table table-bordered p-0 m-0" width="100%">
                                        <thead>
                                            <th class="sorting text-center" tabindex="0" aria-controls="table_contact" rowspan="1" colspan="1" aria-label="#: activate to sort column ascending" style="width: 0px;">
                                                #
                                            </th>
                                            <th class="sorting" tabindex="0" aria-controls="table_contact" rowspan="1" colspan="1" aria-label="Company Code/ Cost Centre: activate to sort column ascending" style="width: 0px;">
                                                Year
                                            </th>
                                            <th class="sorting text-center" tabindex="0" aria-controls="table_contact" rowspan="1" colspan="1" aria-label="Company Code/ Cost Centre: activate to sort column ascending" style="width: 0px;">
                                                Month
                                            </th>
                                             <th class="sorting text-center" tabindex="0" aria-controls="table_contact" rowspan="1" colspan="1" aria-label="Company Code/ Cost Centre: activate to sort column ascending" style="width: 0px;">
                                                Staff Name
                                            </th>
                                            <th class="sorting" tabindex="0" aria-controls="table_contact" rowspan="1" colspan="1" aria-label="Company Name: activate to sort column ascending" style="width: 0px;">
                                                Total Hour Applied
                                            </th>
                                            <th class="sorting" tabindex="0" aria-controls="table_contact" rowspan="1" colspan="1" aria-label="Salary/ Wage Month: activate to sort column ascending" style="width: 0px;">
                                                Total Hour Approved
                                            </th>
                                            <th class="sorting text-center" tabindex="0" aria-controls="table_contact" rowspan="1" colspan="1" aria-label="Employee Total Upload: activate to sort column ascending" style="width: 0px;">
                                                Status
                                            </th>
                                            <th class="sorting text-center" tabindex="0" aria-controls="table_contact" rowspan="" colspan="1" aria-label="Total Net Pay: activate to sort column ascending" style="width: 0px;">
                                                Action
                                            </th>           
                                        </thead>  
                                        <tbody>
                                            <?php if (!empty($otLists)): ?>
                                                <?php foreach ($otLists as $key => $ot): ?>       
                                                <tr>
                                                    <td class="text-center"><?php echo $key+1;?></td>
                                                    <td class="text-center"><?php echo $ot['year'];?></td>
                                                    <td class="text-center"><?php echo date("F",mktime(0,0,0, $ot['month'],1,$ot['year']));?></td>
                                                    <td style="width: 30%"><?php echo $ot['name'];?></td>                              
                                                    <td class="text-center"><?php echo $ot['totalHoursApplied'];?></td>
                                                    <td class="text-center"><?php echo $ot['totalHoursApproved'];?></td>
                                                    <td>
                                                        <?php if($ot[0]['pending'] > 0) {?>
                                                            <span class="text-warning">Pending</span>
                                                        <?php }else if($ot[0]['reject'] == $ot[0]['totalrs']) {?>
                                                            <span class="text-danger">Rejected</span>
                                                        <?php }else { ?>
                                                            <span class="text-success">Approved</span>
                                                        <?php }?>
                                                       
                                                    </td>
                                                   <!--  <td style="width: 20%">
                                                        <div class="row">
                                                            <div class="col-8">
                                                                <span class="text-success">Approved</span>
                                                            </div>
                                                            <div class="col-4">
                                                                <span class="text-success"><?php echo $ot[0]['approve'] ?></span>
                                                            </div>
                                                        </div>
                                                        <div class="row">
                                                            <div class="col-8">
                                                                <span class="text-warning">Pending </span>
                                                            </div>
                                                            <div class="col-4">
                                                                <span class="text-warning"><?php echo $ot[0]['pending'] ?></span>
                                                            </div>
                                                        </div>
                                                        <div class="row">
                                                            <div class="col-8">
                                                                <span class="text-danger">Rejected</span> 
                                                            </div>
                                                            <div class="col-4">
                                                                <span class="text-danger"><?php echo $ot[0]['reject'] ?></span>
                                                            </div>
                                                        </div>
                                                    </td> -->
                                                    <td>
                                                        <a href="<?php echo base_url().'hr/overtime/approveOtList/'.$ot['ID'] ?>" class="btn btn-success btn-sm" data-toggle="tooltip" data-placement="top" title="Choose OT"><i class="fas fa-sign-in-alt"></i></a>
                                                    </td>                                                 
                                                </tr> 
                                                
                                                <?php endforeach ?>
                                            <?php endif ?>
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>      
        </div>
</div>

<!-- Modal change status -->

<div class="modal fade" id="modal_approve" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
    <div class="modal-dialog ">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="exampleModalLongTitle">Change Status</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                  <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <div class="row form-group">
                    <div class="col-lg-3">
                        <label for="bank_name">Status</label>
                    </div>
                    <div class="col">
                        <select name="month" class=" form-control">
                            <option value="">Approve</option>
                            <option value="">Pending</option>
                             <option value="">Reject</option>
                        </select>
                    </div>
                </div>
                <div class="row form-group">
                    <div class="col-lg-3">
                        <label for="bank_branch"> Comment</label>
                    </div>
                    <div class="col">
                       <textarea class=" form-control" name="" id="" rows="2"></textarea>
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button onclick="saveBankDetail()" type="button" id="saveButtonBank" class="btn btn-success btn-sm" style="margin-bottom:15px; width: 200px;"><i class="fa fa-save"></i> Save</button>
                <button type="button" class="btn btn-danger btn-sm" style="margin-bottom:15px; width: 200px;" data-dismiss="modal"><i class="fa fa-ban"></i> Cancel</button>
            </div>
        </div>
    </div>
</div>

<!-- Modal add OT -->

<script>
var token = "<?php echo $_SESSION['token'];?>"; 
$(document).ready(function(){

    $('#searchBtn').click(function(){
        getStaffOt();
    });
});

    function getStaffOt() {
        var table = $('.table').DataTable();
            table.clear().draw();
            var frmData = new FormData();

            frmData.append('filter_year',$('#filter_year').val());
            frmData.append('filter_month',$('#filter_month').val());
            frmData.append('filter_staff',$('#filter_staff').val());

            
            $.ajax({
                url:"<?php echo base_url('/hr/api/overtime/getStaffOt'); ?>",
                type:'post',
                dataType:'json',
                data:frmData,
                processData: false,
                contentType: false,
                success:function(data){

                    iziToast.success({
                        position: 'bottomRight',
                        message: 'filtering data',
                    });

                            // if(data.table[i].status == 0){
                            //     var badge = '<span class="badge badge-warning text-white">Pending</span>';
                            // }else if(data.table[i].status == 1){
                            //     var badge = '<span class="badge badge-success text-white">Approved</span>';
                            // }else if(data.table[i].status == 2){
                            //     var badge = '<span class="badge badge-danger text-white">Rejected</span>';
                            // }
                            
                            table.row.add({
                                0   : i+1,
                                1   : '<div class="text-center">'+data.table[i].year+'</div>',
                                2   : '<div class="text-center">'+month+'</div>',
                                3   : '<div class="text-center">'+data.table[i].totalHoursApplied+'</div>',
                                4   : '<div class="text-center">'+data.table[i].totalHoursApproved+'</div>',
                                5   : '<div class="text-center">'+badge+'</div>',
                                6   : '<div class="text-center"><a href="<?php echo base_url(); ?>/hr/overtime/monthList/'+ data.table[i].ID+'" class="btn btn-success btn-sm" data-tooltip="tooltip" data-placement="bottom" data-trigger="hover" data-original-title="View OT"><i class="fas fa-sign-in-alt"></i></a></div>',
                            }).draw();
                            console.log(data.table[i].ID);
                        }
                        
                    }
                    
                },
                error:function(){
                     iziToast.warning({
                        position: 'bottomRight',
                        message: '500 Internal Server Error.'
                    });
                }
            });
    }

</script> 