<div class="wrapper">
    <div class="container">
        <!-- Page-Title -->
        <div class="row">
            <div class="col-sm-12">
                <div class="btn-group pull-right m-t-15">
                    <!-- <a type="button" href="<?php echo base_url(); ?>coachingsearch" class="btn btn-custom waves-effect waves-light" >Add New Enrollment <span class="m-l-5"><i class="fa fa-plus"></i></span></a>                     -->
                </div>
                <h4 class="page-title">Student Monthly  Attendance Report (<?php echo $business[0]['business_name'];?>):</h4>
            </div>
        </div>
 <div class="row" id="divselection">
            <div class="col-sm-12">
                <div class="card-box ">
                    <h4 class="header-title m-t-0 m-b-30">Filters:</h4>
                    <form action="<?php echo base_url(); ?>coaching_group_mark_student_attendance/5" method="post">
                        <input type="hidden" name="csrf_test_name" id="members_csrf" value=""/>
                    <div class="row">
                        <div class="col-lg-12">  
                            
                          <div class="row"> 
                          <div class="row">
                                <div class="col-lg-2">
                                    <div class="row">
                                        <div class="col-lg-12"> <label class="control-label">Select Date:</label></div>
                                    </div>
                                    <div class="row">
                                        <div class="col-lg-12"> 
                                        <input class="form-control mdate" id="mDate" name="mDate" value="<?php echo $today;?>" >
                                    </div>
                                    </div>
                                 </div> 
                                <div class="col-lg-2">
                                    <div class="row">
                                        <div class="col-lg-12"> <label class="control-label">Select Staff:</label></div>
                                    </div>
                                    <div class="row">
                                        <div class="col-lg-12"> 
                                            <select  class="form-control" id="staff_id" name="staff_id">
                                                <option >Select Staff</option> 
                                             
                                            </select>
                                        </div>
                                    </div>
                                </div>    
                            <div class="row">
                                <div class="col-lg-2">
                                    <div class="row">
                                        <div class="col-lg-12"> <label class="control-label">Select Group :</label></div>
                                    </div>
                                    <div class="row">
                                        <div class="col-lg-12"> 
                                            <select  class="form-control" id="coaching_service" name="id_program_group">
                                            </select>
                                        </div>
                                    </div>
                                </div>  

                               

                                
                                
                                <!-- <div class="col-lg-2">
                                    <div class="row">
                                        <div class="col-lg-12"> <label class="control-label">View:</label></div>
                                    </div>
                                    <div class="row">
                                        <div class="col-lg-12"> 
                                            <select class="form-control" id="filter_veiw" name="filter_veiw">                                               
                                                <option <?php if(isset($status)){if($status=='Active'){echo 'selected="selected"';}} ?> value="Active">Active</option>
                                                <option <?php if(isset($status)){if($status=='Completed'){echo 'selected="selected"';}} ?> value="Completed">Completed</option>
                                                <option <?php if(isset($status)){if($status=='All'){echo 'selected="selected"';}} ?> value="All">All</option>                                                
                                            </select>
                                        </div>
                                    </div>
                                </div> -->
                               
                                <div class="col-lg-2">
                                    <div class="row">
                                        <div class="col-lg-12"> <label class="control-label"></label></div>
                                    </div>
                                    <div class="row">
                                        <div class="col-lg-6 col-md-6 col-sm-6 col-xs-6" > 
                                            <button onclick="$('#members_csrf').val($('#cook').val());"  type="submit" class="btn btn-pink btn-bordred waves-effect w-md waves-light m-b-5">Run</button>
                                        </div>
                                        <div class="col-lg-6 col-md-6 col-sm-6 col-xs-6"><i id="cog" class="fa fa-spin fa-cog" style="display:none; font-size:26px;width: auto;margin-right: 10px;"></i></div>
                                    </div>
                                </div>

                            </div>
                        </div>
                    </div>
                    </form>
                </div>
            </div>
        </div> 
        
        <div class="row" >
            <div class="col-sm-12">
                <div class="card-box ">
                    <h4 class="header-title m-t-0 m-b-30"></h4>
                    <div class="row">
                        <div class="col-lg-12">
                            <table id="datatable-buttons" class="table table-striped table-bordered dt-responsive nowrap" cellspacing="0" width="100%">
                                <thead>
                                    <tr>
                                        <th width="2%">No #</th>
                                        <th width="28%">Name</th>
                                        <th width="28%">Visit Date</th>
                                        <th width="28%">Start Time</th>
                                        <th width="28%">End Time</th>
                                        <th width="28%">Mark In</th>
                                        <th width="28%">Mark In Time</th>
            
                                                 
                                    </tr>
                                </thead>
                                <tbody>  
         
                                   
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div> 

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

        $('.mdate').datepicker({
                default: today,
                autoclose: true,
                todayHighlight: true,
                format: 'yyyy-mm-dd'
            });
        
        $("#staff_id,#coaching_service").select2();
     
    jQuery('#txteditcustomeranniversary').datepicker({
                    autoclose: true,
                    todayHighlight: true,
                    format: 'yyyy/mm/dd'
                });

                jQuery('#txtcustomeranniversary').datepicker({
                    autoclose: true,
                    todayHighlight: true,
                    format: 'yyyy/mm/dd'
                });
       
       $('#datatable-buttons').DataTable({
                "lengthMenu": [[10, 25, 50, -1], [10, 25, 50, "All"]],
                "stateSave": true,
                "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"}],
                "responsive": !0,
		"order": [[ 1, 'asc' ]],
		"displayLength": 25
		
            });
            //changeview();
    });
    
    function changeview(){
        $('#datatable-buttons tr').each(function(row, tr) {
            //$(this).css('display','');
            console.log( $(tr).find('td:eq(7)').text().trim());
            console.log( $(tr).find('td:eq(8)').text().trim());
            if(row>0){
                var total = $(tr).find('td:eq(7)').text().trim();
                var booked = $(tr).find('td:eq(8)').text().trim();
                var status='';

                if(parseInt(total) <= parseInt(booked)){status = 'Completed';}
                else if(total > booked) {status = 'Active';}

                if($("#filter_veiw").val() != 'All'){ 
                    if(status != $("#filter_veiw").val()){
                        $(this).css('display','none');            
                    }else{
                        $(this).css('display','');
                    }
                }else{
                    $(this).css('display','');
                }
            }
        });
    }  


</script>