{{View::make('layout.header')}}

  <!-- END: Custom CSS-->

   <style>

     

        .timeline .timeline-item .timeline-event h6{ 

            word-break : break-all; }

    </style>

    

    <!-- BEGIN: Content-->

    <div class="app-content content ">

        <div class="content-overlay"></div>

        <div class="header-navbar-shadow"></div>

        <div class="content-wrapper">

         <div class="content-header row">

                <div class="content-header-left col-md-9 col-12 mb-2">

                    <div class="row breadcrumbs-top">

                        <div class="col-12">

                            <div class="breadcrumb-wrapper">

                                <ol class="breadcrumb">

                                    <li class="breadcrumb-item">Approval

                                    </li>

                                    <li class="breadcrumb-item active"><a href="#">Approve / Reject / Cancel</a>

                                    </li>

                                </ol>

                            </div>

                        </div>

                    </div>

                </div>

            </div>

            <div class="content-body mb-5">

                <!-- Dashboard Ecommerce Starts -->

                <section id="dashboard-ecommerce">

                    <div class="row match-height">

                        <div class="col-md-12">

                            <div class="card">

                                <div class="card-header" style="">

                                        <div class="btn-group">

                                            <input type="text" id="staff_name" name="name"  class="form-control" placeholder="Staff name" style="padding-left: 10px; border-width: 0 1px 0 0px; border-radius:0px;" value="{{request()->get('name') ? request()->get('name') : '' }}">

                                            &nbsp;

                                            <select name="type" id="typ" class=" form-control" style="padding-left: 10px; border-width: 0 1px 0 0px; border-radius:0px;">

                                                <option value="">All Leave Types</option>

                                                @foreach($leaveTypes as $type)

                                                    <option value="{{ $type->type }}" {{request()->get('type') && request()->get('type') == $type->name ? 'selected' : '' }}>{{ $type->name }}</option>

                                                @endforeach

                                            </select>

                                            &nbsp;

                                            <select name="status" id="sta" class=" form-control" style="border-width: 0 1px 0 0px; border-radius:0px">

                                                <option value="">All</option>

                                                <option value="0">Pending</option>

                                                <option value="1">Approved</option>

                                                <option value="2">Rejected</option>

                                                <option value="3">Recommended</option>

                                                <option value="4">Cancelled</option>

                                                <option value="5">Cancellation Pending</option>

                                            </select>

                                            &nbsp;&nbsp;&nbsp;&nbsp;

                                            <div class="">

                                                <button onclick="more_filter()" class="btn btn-primary waves-effect waves-float waves-light" style="">Filter</button>

                                            </div>

                                             <div class="btn-group" style="margin-left:20px;">

                                                <button type="button" class="btn btn-success waves-effect waves-float waves-light approved-btn" disabled  data-toggle="modal" data-target="#exampleModal" >Approve</button>

                                                &nbsp;&nbsp;

                                                <button type="button" class="btn btn-danger waves-effect waves-float waves-light  reject-visible-btn" disabled data-toggle="modal" data-target="#rejectModal">Reject</button>

                                                &nbsp;&nbsp;

                                                <button type="button" class="btn  btn-warning waves-effect waves-float waves-light cancel-visible-btn" disabled data-toggle="modal" data-target="#cancelModal">Cancel</button>

                                                &nbsp;&nbsp;

                                                {{-- hide and show --}}

                                                <div class="dropdown" style="margin-top: 3px;">

                                                    <button class="dropbtn fa fa-gear"></button>

                                                    <div id="myDropdown" class="dropdown-content">

        

                                                    </div>

                                                </div>

                                        

                                            </div>

                                        </div>

                                        <div class="d-sm-flex justify-content-between align-items-center" style="margin: 0px 0;">

                                    <div class="d-flex align-items-right">

                                        <div class="btn-group btn-align-right">

                                            </div>

                                    </div>    

                                </div>

                                 

                                </div>

                                <style>

                                    .ilter-container

                                    {





                                        display:none !important;



                                    }



                                </style>

                                <div class="card activity filter-container" style="margin: 0px 15px; background-color:#e6e5e5; padding:10px 20px 20px 20px; display:none !important;" id="empleavetoday">

                                    <div class="row">

                                        <div class="col-md-12" style="padding:0px;">

                                            <button id="spanclose" onclick="more_filter()" style="float:right;border:0px;background-color:transparent;color:white;padding: 3px 8px 5px;"><svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-x cursor-pointer font-large-1" data-repeater-delete=""><line x1="18" y1="6" x2="6" y2="18"></line><line x1="6" y1="6" x2="18" y2="18"></line></svg></button>

                                        </div>

                                    </div>

                                    <div class="row">

                                        <div class="col-sm-6 filter-form-group mb-1">

                                                Category &nbsp;:<span class="red">*</span>&nbsp;

                                                <select class="select form-control" id="category" name="category">

                                                                <option value="">All</option>

                                                                @foreach($category as $cat)

                                                                <option value="{{ $cat->id }}" {{request()->get('category') && request()->get('category') == $cat->id ? 'selected' : '' }}>{{ $cat->name }}</option>

                                                                @endforeach



                                                                </select>

                                            </div>

                                        <div class="col-sm-6 filter-form-group mb-1">

                                            Department &nbsp;:<span class="red">*</span>&nbsp;

                                            <select class="select form-control" id="dept" name="dept">

                                                            <option value="">All</option>

                                                            @foreach($department as $dept)

                                                            <option value="{{ $dept->id }}" {{request()->get('dept') && request()->get('dept') == $dept->id ? 'selected' : '' }}>{{ $dept->name }}</option>

                                                            @endforeach



                                                            </select>

                                        </div>

                                        <div class="col-sm-6 filter-form-group mb-1">

                                        Employee Name   &nbsp;:

                                            <input type="text" name="name" id="name" placeholder="Enter Name" class="tcal form-control" data-dateformat="dd-mm-yy">

                                        </div>

                                        <div class="col-sm-6 filter-form-group mb-1">

                                        Employee No.  &nbsp;:

                                            <input type="text" name="phone" id="phone" placeholder="Enter Employee No." class="tcal form-control" data-dateformat="dd-mm-yy">

                                        </div>

                                        <div class="col-sm-6 filter-form-group mb-1">

                                            Date From  &nbsp;:

                                            <input type="date" name="sdatefrom" id="sdatefrom"  class="tcal form-control flatpickr-basic" placeholder="DD-MM-YYYY"  data-dateformat="dd-mm-yy">

                                        </div>

                                        <div class="col-sm-6 filter-form-group mb-1">

                                            Date To &nbsp;:<span class="red">*</span>&nbsp;

                                            <input type="date" name="sdateto" id="sdateto" class="tcal form-control flatpickr-basic" placeholder="DD-MM-YYYY"  data-dateformat="dd-mm-yy">

                                        </div>

                                        <div class="col-sm-6 filter-form-group mb-1">

                                            Leave Type &nbsp;:<span class="red">*</span>&nbsp;

                                            <select class="select form-control" id="leavetype" name="leavetype">

                                                            <option value="">All</option>

                                                            <option value="Annual">Annual Leave</option>

                                                            <option value="Medical">Medical Leave</option>

                                                            <option value="Maternity">Maternity Leave</option>

                                                            <option value="Marriage">Marriage Leave</option>

                                                            <option value="Compassionate">Compassionate Leave</option>

                                                            <option value="Hospital">Hospital Leave</option>

                                                            <option value="Examination">Examination Leave</option>

                                                            <option value="Paternity">Paternity Leave</option>

                                                            <option value="Advance">Advance Leave</option>

                                                            <option value="Other_pay">Replacement Leave</option>

                                                            <option value="Line_Shut">Line Shut Down</option>

                                                            <option value="Absent">Absent</option>

                                                            <option value="npl">No Pay Leave</option>

                                                            </select>

                                        </div>

                                        <div class="col-sm-6 filter-form-group" style="margin-top:19px;">

                                            <input type="button" value="Apply" onclick="search();" class="filter-apply btn btn-info" />

                                        </div>

                                    </div>

                                </div>

                                <div class="card-body" style="padding-top:0px;">

                                    <div class="table-responsive" style="overflow: unset;">

                                        <table class="table table-striped  my-leave-summary-entitle" id="leavetable" style="font-size:12px;" >

                                            <thead>

                                                <tr>

                                                    <th style="text-transform: capitalize;" width="11%">Emp No.</th>

                                                    <th style="text-transform: capitalize;"  width="20%">Name</th>

                                                    <th style="text-transform: capitalize;" width="5%">Type</th>

                                                    <th style="text-transform: capitalize;" width="13%">Date</th>

                                                    <th style="text-transform: capitalize;" width="6%">Days</th>

                                                    <th style="text-transform: capitalize;" width="32%">Reason</th>

                                                    <th style="text-transform: capitalize;" width="5%">Status</th>

                                                    <th style="text-transform: capitalize;" style="text-align:center;"  width="2%"><input type="checkbox" id="checkAll" ></th>

                                                </tr>

                                            </thead>

                                            <tbody id="listbd">

                                   

                                          

                                            </tbody>

                                        </table>

                                 <!-- </div> -->

                                </div>

                            </div>

                        </div>

                        

                            <div class="card">

                                <div class="card-header">

                                    <h4>Replacement Leaves </h4>

                                    <div class="btn-group" >

                                        <div class="btn-group" style="margin-left:20px;">

                                            <button type="button" class="btn btn-success waves-effect waves-float waves-light approved-btn1" disabled  data-toggle="modal" data-target="#approveModal" >Approve</button>

                                            &nbsp;&nbsp;

                                            <button type="button" class="btn btn-danger waves-effect waves-float waves-light  reject-visible-btn1" disabled data-toggle="modal" data-target="#rejectModal1">Reject</button>

                                            &nbsp;&nbsp;

                                            <button type="button" class="btn  btn-warning waves-effect waves-float waves-light delete-visible-btn1" disabled data-toggle="modal" data-target="#deleteModal">Delete</button>

                                        </div>

                                    </div>

                                </div>

                                <div class="card-body" style="padding-top:0px !important;  padding-bottom:0px !important;"> 



                                    <div class="table-responsive" style="overflow-x: unset !important;">

                                        <table class="table table-striped" id="reporttable11" style=" font-size:12px;">

                                            <thead>

                                                <tr>

                                                    <th>Name</th>

                                                    <th>Date</th>

                                                    <th>Days</th>

                                                    <th>Reason</th>

                                                    <th>Applied On</th>

                                                    <th>Status</th>

                                                    <th style="text-transform: capitalize;" style="text-align:center;"  width="2%"><input type="checkbox" id="checkAll11" ></th>

                                                </tr>

                                            </thead>

                                            <tbody>

                                            @foreach($replacement as $value)

                                            @php

                                                    $disable ='';

                                                    $color='';

                                                    $sts='';

                                                    if($value->status=='pending'){

                                                $color="#82868b";

                                                $sts='pending';

                                            }elseif($value->status=='approved'){

                                                $color="#28c76f";

                                                $sts='approved';

                                                $disable ='disabled';

                                            }elseif($value->status==null){

                                                $color="#82868b";

                                                $sts='pending';

                                            }

                                            elseif($value->status=='rejected'){

                                                $color="#ea5455";

                                                $sts='Rejected';

                                            }

                                            

                                            

                                            @endphp

                                                <tr>

                                                    <td>{{ $value->name }}</td>

                                                    <td>{{ $value->start_date }}</td>

                                                    <td>{{ $value->no_granted }}</td>

                                                    <td>{{ $value->reason }}</td>

                                                    <td>{{ $value->date_applied }}</td>

                                                    <td><div class="status-fd" style="color: {{ $color }}"> ⦿ {{ $sts }}</div></td>

                                                    <td><input type="checkbox" class="replacement" name="inlineRadioOptions11" id="inlineRadio{{ $value->id }}" value="{{ $value->id }}:{{ $value->status }}'" {{ $disable }}></td>

                                                </tr>

                                            @endforeach

                                            </tbody>

                                        </table>

                                    </div>  

                                </div>    

                            </div>

                    </div>

                </section>

                <!-- Dashboard Ecommerce ends -->

                <div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">

                    <div class="modal-dialog" role="document">

                        <div class="modal-content">

                        <div class="modal-header">



                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">

                            <span aria-hidden="true">&times;</span>

                            </button>

                        </div>

                        <div class="modal-body">

                        <h5 class="modal-title" id="exampleModalLabel">Are you sure want approve the leave(s)?</h5>

                        </div>

                        <div class="modal-footer">

                            <button type="button" class="btn btn-primary yes-btn">Yes</button>

                            <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>

                        </div>

                        </div>

                    </div>

                </div>

                <div class="modal fade" id="rejectModal" tabindex="-1" role="dialog" aria-labelledby="rejectModalLabel" aria-hidden="true">

                    <div class="modal-dialog" role="document">

                        <div class="modal-content">

                        <div class="modal-header">

                            <h5 class="modal-title" id="exampleModalLabel">Are you sure want reject the leave(s)?</h5>

                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">

                            <span aria-hidden="true">&times;</span>

                            </button>

                        </div>

                        <div class="modal-body">

                            <input type="hidden" name="leave_id" id="leaveID">

                            <div id="rmsg"></div>

                            <lable>Please enter reject Reason</lable>

                            <input type="text" name="reason" id="rejectReason"  class="form-control">

                        </div>

                        <div class="modal-footer">

                        <button type="button" class="btn btn-danger reject-btn">OK</button>

                        <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>

                            </div>

                        </div>

                    </div>

                </div>

                <div class="modal fade" id="cancelModal" tabindex="-1" role="dialog" aria-labelledby="rejectModalLabel" aria-hidden="true">

                    <div class="modal-dialog" role="document">

                        <div class="modal-content">

                        <div class="modal-header">

                            <h5 class="modal-title" id="exampleModalLabel">Are you sure want cancel the leave(s)?</h5>

                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">

                            <span aria-hidden="true">&times;</span>

                            </button>

                        </div>

                        <div class="modal-body">

                            <input type="hidden" name="leave_id" id="leaveID">

                            <div id="cmsg"></div>

                            <lable>Please enter cancellation Reason</lable>

                            <input type="text" name="reason" id="cancelReason"  class="form-control">

                        </div>

                        <div class="modal-footer">

                        <button type="button" class="btn btn-danger cancel-btn">OK</button>

                        <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>

                            </div>

                        </div>

                    </div>

                </div>





                <div class="modal fade" id="approveModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">

                    <div class="modal-dialog" role="document">

                        <div class="modal-content">

                        <div class="modal-header">



                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">

                            <span aria-hidden="true">&times;</span>

                            </button>

                        </div>

                        <div class="modal-body">

                        <h5 class="modal-title" id="exampleModalLabel">Are you sure want approve the Replacement leave(s)?</h5>

                        </div>

                        <div class="modal-footer">

                            <button type="button" class="btn btn-primary yes-btn1">Yes</button>

                            <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>

                        </div>

                        </div>

                    </div>

                </div>

                <div class="modal fade" id="rejectModal1" tabindex="-1" role="dialog" aria-labelledby="rejectModalLabel" aria-hidden="true">

                    <div class="modal-dialog" role="document">

                        <div class="modal-content">

                        <div class="modal-header">

                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">

                                <span aria-hidden="true">&times;</span>

                            </button>

                        </div>

                        <div class="modal-body">

                            <h5 class="modal-title" id="exampleModalLabel">Are you sure want reject the Replacement leave(s)?</h5>

                        </div>

                        <div class="modal-footer">

                        <button type="button" class="btn btn-danger reject-btn1">OK</button>

                        <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>

                            </div>

                        </div>

                    </div>

                </div>

                <div class="modal fade" id="deleteModal" tabindex="-1" role="dialog" aria-labelledby="rejectModalLabel" aria-hidden="true">

                    <div class="modal-dialog" role="document">

                        <div class="modal-content">

                        <div class="modal-header">

                            

                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">

                            <span aria-hidden="true">&times;</span>

                            </button>

                        </div>

                        <div class="modal-body">

                            <h5 class="modal-title" id="exampleModalLabel">Are you sure want delete the Replacement leave(s)?</h5>

                        </div>

                        <div class="modal-footer">

                        <button type="button" class="btn btn-danger delete-btn">OK</button>

                        <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>

                            </div>

                        </div>

                    </div>

                </div>

            </div>

        </div>

    </div>

    <!-- END: Content-->

    {{View::make('layout.footer')}}

    @include('inc.timline-model')

    <script src="//cdn.jsdelivr.net/npm/sweetalert2@11"></script>

    <script type="text/javascript">

        $('.yes-btn').attr('disabled', false);

        $('.reject-btn').attr('disabled', false);

        $('.delete-btn').attr('disabled', false);

        $('.reject-btn1').attr('disabled', false);

        $('.yes-btn1').attr('disabled', false);

        $(document).on('click', 'input[name="inlineRadioOptions"]', function() {

            $('.approved-btn').attr('disabled', false);

            $('.reject-visible-btn').attr('disabled', false);

            $('.cancel-visible-btn').attr('disabled', false);

        });



        $(document).on('click', 'input[name="inlineRadioOptions11"]', function() {

            $('.approved-btn1').attr('disabled', false);

            $('.reject-visible-btn1').attr('disabled', false);

            $('.delete-visible-btn1').attr('disabled', false);

        });

        $(document).on('click', '.yes-btn', function() {

            var arrId = [];

            var arrstatus =[];

            var status_val =[];

            $('.yes-btn').attr('disabled', true);

              $.each($('input[name="inlineRadioOptions"]:checked'), function(){

                var str =$(this).val();

                var myArr = str.split(":");

                arrId.push(myArr[0]);

                arrstatus.push(myArr[1]);

                if(myArr[1]==5){

                    status_val.push(4);

                }else{

                    status_val.push(1);

                }

              });

             

             

            var url = '{{route('approveleave')}}';

            $.ajax({

                url:url,

                type:'POST',

                data:{

                    '_token' : "{{ csrf_token() }}",

                    'status' : status_val,

                    'ids' : arrId

                    

                },

                success:function(e){

                    // console.log(e);

                   

                    window.location.reload();

                    

                },

                error:function(w){

                }

            });

        });



        $(document).on('click', '.reject-btn', function() {

            var arrId = [];

            var arrstatus =[];

            var status_val=[];

            $('.reject-btn').attr('disabled', true);

            if($('#rejectReason').val()!=''){

              $.each($('input[name="inlineRadioOptions"]:checked'), function(){

                var str =$(this).val();

                var myArr = str.split(":");

                arrId.push(myArr[0]);

                arrstatus.push(myArr[1]);

                if(myArr[1]==5){

                    status_val.push(1);

                }else{

                    status_val.push(2);

                }

              });

            

            var url = '{{route('approveleave')}}';

            $.ajax({

                url:url,

                type:'POST',

                data:{

                    '_token' : "{{ csrf_token() }}",

                    'ids' : arrId,

                    'status' : status_val,

                    'reject_reason' :  $('#rejectReason').val()

                },

                success:function(e){

                    window.location.reload();

                  // console.log(e);

                },

                error:function(w){

                }

            });

            }

            else{

			    $("#rmsg").empty();

                $("#rmsg").append('<p style="color:red;">Reason cannot be blank.</p>');

            }

        });



        $(document).on('click', '.cancel-btn', function() {

            var arrId = [];

            var arrstatus =[];

            var status_val=[];

            $('.cancel-btn').attr('disabled', true);

            if($('#cancelReason').val()!=''){

               $.each($('input[name="inlineRadioOptions"]:checked'), function(){

                var str =$(this).val();

                var myArr = str.split(":");

                arrId.push(myArr[0]);

                arrstatus.push(myArr[1]);

                status_val.push(4);

              });

            var url = '{{route('approveleave')}}';

            $.ajax({

                url:url,

                type:'POST',

                data:{

                    '_token' : "{{ csrf_token() }}",

                    'ids' : arrId,

                    'status' : status_val,

                    'cancel_reason' :  $('#cancelReason').val()

                },

                success:function(e){

                    window.location.reload();

                },

                error:function(w){

                }

            });

             }

            else{

			    $("#cmsg").empty();

                $("#cmsg").append('<p style="color:red;">Reason cannot be blank.</p>');

            }

        });



        $(document).on('click', '.delete-btn', function() {

            var arrId = [];

            var arrstatus =[];

            $('.delete-btn').attr('disabled', true);

               $.each($('input[name="inlineRadioOptions11"]:checked'), function(){

                var str =$(this).val();

                var myArr = str.split(":");

                arrId.push(myArr[0]);

                arrstatus.push(myArr[1]);

              });

              //console.log(arrId);

            var url = '{{route('deleteRLeave')}}';

            $.ajax({

                url:url,

                type:'POST',

                data:{

                    '_token' : "{{ csrf_token() }}",

                    'ids' : arrId

                },

                success:function(e){

                    window.location.reload();

                },

                error:function(w){

                }

            });

            

        });



        $(document).on('click', '.reject-btn1', function() {

            var arrId = [];

            var arrstatus =[];

            $('.reject-btn1').attr('disabled', true);

               $.each($('input[name="inlineRadioOptions11"]:checked'), function(){

                var str =$(this).val();

                var myArr = str.split(":");

                arrId.push(myArr[0]);

                arrstatus.push(myArr[1]);

              });

              //console.log(arrId);

            var url = '{{route('rejectRLeave')}}';

            $.ajax({

                url:url,

                type:'POST',

                data:{

                    '_token' : "{{ csrf_token() }}",

                    'ids' : arrId

                },

                success:function(e){

                    window.location.reload();

                },

                error:function(w){

                }

            });

            

        });



        $(document).on('click', '.yes-btn1', function() {

            var arrId = [];

            var arrstatus =[];

            $('.yes-btn1').attr('disabled', true);

               $.each($('input[name="inlineRadioOptions11"]:checked'), function(){

                var str =$(this).val();

                var myArr = str.split(":");

                arrId.push(myArr[0]);

                arrstatus.push(myArr[1]);

              });

              //console.log(arrId);

            var url = '{{route('RLeaveStatus')}}';

            $.ajax({

                url:url,

                type:'POST',

                data:{

                    '_token' : "{{ csrf_token() }}",

                    'ids' : arrId

                },

                success:function(e){

                    window.location.reload();

                },

                error:function(w){

                }

            });

            

        });

    </script>





    <script type="text/javascript">



        $(document).ready(function() {

           

      

  var status= $('select[name="status"]')



status.change(function(){



console.log(status);

console.log(type);

    getDateRangeRecord();

});



var type= $('select[name="type"]')



type.change(function(){



console.log(status);

console.log(type);

getDateRangeRecord();



});

$("#staff_name").keyup( function() {

   

    getDateRangeRecord();

    dataTable.draw();

   // oTable.ajax.reload();

});

});

	    var base_url = $('body').attr('data-baseurl')+'/e-leave';

        $(document).ready(function() {

             var type = $("#typ").val();

            //alert(type);

            var status = document.getElementById("sta").value;

            var nam = document.getElementById("staff_name").value;

        

           

            var url = "approve-leave/search?type=" + type + "&status="+ status + "&name="+ nam;

            $('#reporttable11').DataTable({

                "lengthMenu": [[20, 50, 100, -1], [20, 50,100, "All"]],

                

                "processing": true,

                'columnDefs': [{

                    "targets": [6],

                    "orderable": false

                }],

                 "language": {

                    "paginate": {

                    // remove previous & next text from pagination

                    "previous": '&nbsp;',

                    "next": '&nbsp;'

                    }

                },

                

            });

            

			var table = $('#leavetable').DataTable({

                "lengthMenu": [[20, 50, 100, -1], [20, 50,100, "All"]],

		        "processing": true,

                "destroy": true,

                "serverSide": true,

                "order": [],

		        "ajax": url,

               

                "columns": [





                {

                    data: 'emp_no',

                    name: 'emp_no',

                    "render": function(data, type, row, meta) {

                        var empno = '<input type="hidden" id="lastindex" value="' + row

                            .lastindex + '"> <input type="hidden" id="userindex" value="' + row

                            .userindex + '"><a class="popper" onmouseover="ventitle(' + row.id +

                            ');"   onmouseout="ventitle(' + row.id + ');"  href="">' + row

                            .emp_no + '</a>';

                        empno += '<div id="pop' + row.id +

                            '" style=" width: 80%; display : none; position : absolute;  z-index : 99999; padding : 0px;  background : #fff; border : 1px solid #A2ADBC; -moz-border-radius : 3px; -webkit-border-radius: 3px; margin : 0px; -webkit-box-shadow   : 0px 0px 5px 0px rgba(164, 164, 164, 1); box-shadow : 0px 0px 5px 0px rgba(164, 164, 164, 1);  left: 8%;"><div class="table-responsive" style="padding: 0px;">';

                        empno +=

                            '<table id="entitle" class="table table-bordered my-leave-summary-entitle" style="width:100%; font-size:11px;text-align: center;" width="100%" border="1">';

                        empno += '<thead>';

                        empno += '<tr style="height:50px;background: #F7F7F7;">';

                        empno +=

                            '<th style="width:5%;background: #F7F7F7;text-align: center;color:black;text-transform: capitalize;">Type</th>';

                        empno +=

                            '<th style="width:8%;text-align:center;color:black;background: #F7F7F7;text-transform: capitalize;">BF</th>';

                        empno +=

                            '<th style="width:8%;text-align:center;color:black;background: #F7F7F7;text-transform: capitalize;white-space: nowrap;">BF Adj</th>';

                        empno +=

                            '<th style="width:8%;text-align:center;color:black;background: #F7F7F7;text-transform: capitalize;">Entitle</th>';

                        empno +=

                            '<th style="width:5%;text-align:center;color:black;background: #F7F7F7;text-transform: capitalize;">Earn</th>';

                        empno +=

                            '<th style="width:10%;text-align:center;color:black;text-transform: capitalize;">Claimable</th>';

                        empno +=

                            '<th style="width:5%;text-align:center;color:black;text-transform: capitalize;">NPL</th>';

                        empno +=

                            '<th style="width:10%;text-align:center;color:black;text-transform: capitalize; padding-left: 0px !important; padding-right: 0px !important; padding-bottom: 0px !important;">Taken';

                        empno +=

                            '<table class="tableheading" style="width:100%; margin-top: 0.72rem !important;     border-top: 1px solid #ebe9f1;">';

                        empno += '<thead><tr>';

                        empno +=

                            '<th style="border-top:none;border-bottom:none; border-left:none; width:50%;">EL</th>';

                        empno +=

                            '<th style="border-top:none;border-bottom:none;border-right:none; width:50%">AL</td>';

                        empno += '</tr></thead></table>';

                        empno += ' </th>';

                        empno +=

                            '<th style="width:13%;text-align:center;color:black;text-transform: capitalize; padding-left: 0px !important; padding-right: 0px !important; padding-bottom: 0px !important;">Forfeit';

                        empno +=

                            '<table class="tableheading" style="width:100%; margin-top: 0.72rem !important; border-top: 1px solid #ebe9f1;">';

                        empno += '<thead><tr>';

                        empno +=

                            '<th style="border-top:none;border-bottom:none; width:50%">BF</th>';

                        empno +=

                            '<th style="border-top:none;border-bottom:none; width:50%">Adj</th>';

                        empno += '</tr></thead></table></th>';

                        empno +=

                            '<th style="width:8%;text-align:center;color:black;text-transform: capitalize;">Balance</th>';

                        empno += '</tr>';

                        empno += '</thead>';

                        empno += '<tbody>';

                        empno += '</tbody>';

                        empno += '</table>';

                        empno += '</div>';

                        empno += '</div>';

                        return empno;

                    }

                },

                //  { data: 'emp_no', name: 'emp_no' },

                {

                    data: 'emp_name',

                    name: 'emp_name'

                },



                {

                    data: 'leave_type',

                    name: 'Type',

                    "render": function(data, type, row, meta) {

                        var ltype = '';

                        var ids = row.lid;

                        if (row.filename != '') {

                            ltype += '<a target="_blank" href="' + base_url + '/view-file/' + row.lid +

                                '" style="color:blue;">';

                            ltype += row.leave_type;

                            ltype += '</a>';

                        } else {

                            ltype += row.leave_type;

                        }

                        return ltype;

                    }

                },

                {

                    data: 'date',

                    name: 'date',

                    "render": function(data, type, row, meta) {

                        var ldate =

                            '<a class="appDialog-model" data-toggle="modal" data-target="#inlineForm" data-id="' +

                            row.id + '" style="color:#3192F4;">' + row.date.split("-").reverse()

                            .join("-") + '</a>';





                        return ldate;

                    }

                },

                {

                    data: 'no_days',

                    name: 'no_days',

                    "render": function(data, type, row, meta) {



                        if (row.is_hourly != 0) {

                            var ldate = parseFloat(row.no_of_hours).toFixed(2) + ' Hour(s)';

                        } else {

                            var ldate = row.no_days + '&nbsp;' + row.half_day_type + ' Day(s)';

                        }





                        return ldate;

                    }

                },

                {

                    data: 'reason',

                    name: 'Reason'

                },

                {

                    data: 'leave_status',

                    name: 'Status',



                    "render": function(data, type, row, meta) {

                        var colorData = row.back_color;

                        var leave = `<div class="status-fd" style="color: ${colorData}"> ⦿ ` +

                            row.leave_status + `</div>`;

                        // var leave = `<div class="status-fd"><div style="display:inline-block; margin-top:5px; margin-right:5%; border-width: 2px; border-style:solid; border-color: ${colorData}; border-radius: 50%;width: 12px;height: 12px;text-align:center;"><div style="height: 5px;width: 5px; background-color: ${colorData}; border-radius: 50%;padding:2px 2px;margin: auto auto;margin-top:1.5px;"></div></div>`+ row.leave_status +`</div>`;

                        return leave;

                    }



                },

                {

                    name: 'Action',

                    "render": function(data, type, row, meta) {

                        var action =

                            '<input type="checkbox" class="approve" name="inlineRadioOptions"id="inlineRadio' +

                            row.id + '" value="' + row.id + ':' + row.status + '"';

                            

                        if(row.leave_multiple_approver != 4 && row.leave_multiple_approver != 0){

                            

                             action += row.dradio;

                        }



                        if (row.status == '1' || row.status == '2') {

                            action += 'disabled';

                        } else {

                            action += '';

                        }

                        action += '/>';





                        return action;



                    }

                },





            ],

               

                'columnDefs': [{

                    "targets": [7],

                    "orderable": false

                }],

                "language": {

                    "paginate": {

                    // remove previous & next text from pagination

                    "previous": '&nbsp;',

                    "next": '&nbsp;'

                    }

                },

                'rowCallback': function(row, data, index){

                    $(row).find('td:eq(6)').css('color', data.back_color);

                    $(row).find('td:eq(6)').css('width', "20%");

                    $(row).find('td:eq(6)').css('font-weight', 'bold');

                    $(row).find('td:eq(5)').css('word-break', 'break-all');

                 }

            

                

		    });

		    

		    var columns = table.settings().init().columns;

            for (let i = 0; i < columns.length; i++) {

                //

                var dCol =

                    `<div class="toggle-vis custom-control mt-1 ml-1 custom-control-success custom-checkbox"><input class='inp custom-control-input' data-column="${i}" key="{!! $c_key !!}" id="{!! $c_key !!}_${i}"  type="checkbox" checked><label for="{!! $c_key !!}_${i}" class="custom-control-label" style="cursor: pointer">${columns[i].name}</label></div>`;

                $("#myDropdown").append(dCol);

            }

            

            // show hide and show data

            var daraArr = {!! json_encode($columnHideShowData) !!}

            hidefun(table, '{!! $c_key !!}', daraArr);





        });



function getDateRangeRecord(){

    



  var type = $("#typ").val();

  //alert(type);

  var status = document.getElementById("sta").value;

  var nam = document.getElementById("staff_name").value;



   

    var string_url = "approve-leave/search?type=" + type + "&status="+ status + "&name="+ nam;

    $('#leavetable').DataTable({

                "lengthMenu": [[20, 50, 100, -1], [20, 50,100, "All"]],

                "processing": true,

                "destroy": true,

                "serverSide": true,

                "order": [],

		        "ajax": string_url,

               

                "columns": [

                    

                    { data: 'emp_no', name: 'emp_no',

                    "render": function (data,type,row,meta){ 

                    var empno='<input type="hidden" id="lastindex" value="'+row.lastindex+'"> <input type="hidden" id="userindex" value="'+row.userindex+'"><a class="popper" onmouseover="ventitle('+row.id+');"   onmouseout="ventitle('+row.id+');"  href="">'+row.emp_no+'</a>';

                    empno+='<div id="pop'+row.id+'" style=" width: 80%; display : none; position : absolute;  z-index : 99999; padding : 0px;  background : #fff; border : 1px solid #A2ADBC; -moz-border-radius : 3px; -webkit-border-radius: 3px; margin : 0px; -webkit-box-shadow   : 0px 0px 5px 0px rgba(164, 164, 164, 1); box-shadow : 0px 0px 5px 0px rgba(164, 164, 164, 1);  left: 8%;"><div class="table-responsive" style="padding: 0px;">';

                        empno+='<table id="entitle" class="table table-bordered my-leave-summary-entitle" style="width:100%; font-size:11px;text-align: center;" width="100%" border="1">';

                        empno+='<thead>';

                        empno+='<tr style="height:50px;background: #F7F7F7;">';

                        empno+='<th style="width:5%;background: #F7F7F7;text-align: center;color:black;text-transform: capitalize;">Type</th>';

                        empno+='<th style="width:8%;text-align:center;color:black;background: #F7F7F7;text-transform: capitalize;">BF</th>';

                        empno+='<th style="width:8%;text-align:center;color:black;background: #F7F7F7;text-transform: capitalize;white-space: nowrap;">BF Adj</th>';

                        empno+='<th style="width:8%;text-align:center;color:black;background: #F7F7F7;text-transform: capitalize;">Entitle</th>';

                        empno+='<th style="width:5%;text-align:center;color:black;background: #F7F7F7;text-transform: capitalize;">Earn</th>';

                        empno+='<th style="width:10%;text-align:center;color:black;text-transform: capitalize;">Claimable</th>';

                        empno+='<th style="width:5%;text-align:center;color:black;text-transform: capitalize;">NPL</th>';

                        empno+='<th style="width:10%;text-align:center;color:black;text-transform: capitalize; padding-left: 0px !important; padding-right: 0px !important; padding-bottom: 0px !important;">Taken';

                        empno+='<table class="tableheading" style="width:100%; margin-top: 0.72rem !important;     border-top: 1px solid #ebe9f1;">';

                        empno+='<thead><tr>';

                        empno+='<th style="border-top:none;border-bottom:none; border-left:none; width:50%;">EL</th>';

                        empno+='<th style="border-top:none;border-bottom:none;border-right:none; width:50%">AL</td>';

                        empno+='</tr></thead></table>';

                        empno+=' </th>';

                        empno+='<th style="width:13%;text-align:center;color:black;text-transform: capitalize; padding-left: 0px !important; padding-right: 0px !important; padding-bottom: 0px !important;">Forfeit';

                        empno+='<table class="tableheading" style="width:100%; margin-top: 0.72rem !important; border-top: 1px solid #ebe9f1;">';

                        empno+='<thead><tr>';

                        empno+='<th style="border-top:none;border-bottom:none; width:50%">BF</th>';

                        empno+='<th style="border-top:none;border-bottom:none; width:50%">Adj</th>';

                        empno+='</tr></thead></table></th>';

                        empno+='<th style="width:8%;text-align:center;color:black;text-transform: capitalize;">Balance</th>';

                        empno+='</tr>';

                        empno+='</thead>';

                        empno+='<tbody>';

                        empno+='</tbody>';

                        empno+='</table>';

                        empno+='</div>';

                        empno+='</div>';

                        return empno;

                        }

                    },

                  //  { data: 'emp_no', name: 'emp_no' },

		            { data: 'emp_name', name: 'emp_name' },

		            { data: 'leave_type', name: 'leave_type',

                    "render": function (data,type,row,meta){ 

                        var ltype = '';

                         var ids=row.lid;

                    if(row.filename != '' ) {

                     ltype+= '<a href="'+base_url+'/view-file/'+row.lid+'" style="color:blue;">';

                     ltype+= row.leave_type;

                     ltype+='</a>';

                    }

                       else{

                       ltype+=row.leave_type;

                       } 

                        

                       return ltype;                     

                   } },

                   { data: 'date', name: 'date',

                    "render": function (data,type,row,meta){ 

                        var ldate = '<a class="appDialog-model" data-toggle="modal" data-target="#inlineForm" data-id="'+row.id+'" style="color:#3192F4;">'+ row.date.split("-").reverse().join("-")+'</a>';

                   

                        

                       return ldate;                     

                    } },

                   

                    { data: 'no_days', name: 'no_days',

                        "render": function (data,type,row,meta){ 

                        if(row.is_hourly!=0){

                            var nodays = parseFloat(row.no_of_hours).toFixed(2)+' Hour(s)';

                        }else{	

                            var nodays = row.no_days+'&nbsp;'+row.half_day_type+' Day(s)';

                        }

                        

                       return nodays;                     

                    }  },

                    { data: 'reason', name: 'reason' },

                    { data: 'leave_status', name: 'leave_status',



                        "render": function (data, type, row, meta){

                                var colorData = row.back_color;

                                var leave = `<div class="status-fd" style="color: ${colorData}"> ⦿ ` + row.leave_status +`</div>`;

                                // var leave = `<div class="status-fd"><div style="display:inline-block; margin-top:5px; margin-right:5%; border-width: 2px; border-style:solid; border-color: ${colorData}; border-radius: 50%;width: 12px;height: 12px;text-align:center;"><div style="height: 5px;width: 5px; background-color: ${colorData}; border-radius: 50%;padding:2px 2px;margin: auto auto;margin-top:1.5px;"></div></div>`+ row.leave_status +`</div>`;

                                return leave;

                        }



                    },

                    {"render": function (data,type,row,meta){ 

                        var action = '<input type="checkbox" class="approve" name="inlineRadioOptions"id="inlineRadio'+row.id+'" value="'+row.id+':'+row.status+'"'+row.dradio;

                        if(row.status == '1' || row.status =='2') { 

                            action+='disabled';

                         } else{ 

                            action+='';

                             }

                            action+='/>';

                   

                        

                       return action;                     

                  

		                }

		            },

                

                ],

                

                'columnDefs': [{

                    "targets": [7],

                    "orderable": false

                }],

                "language": {

                    "paginate": {

                    // remove previous & next text from pagination

                    "previous": '&nbsp;',

                    "next": '&nbsp;'

                    }

                },

                'rowCallback': function(row, data, index){

               

                    $(row).find('td:eq(6)').css('color', data.back_color);

                    $(row).find('td:eq(6)').css('width', "20%");

                    $(row).find('td:eq(6)').css('font-weight', 'bold');

                    $(row).find('td:eq(5)').css('word-break', 'break-all');

                }

                });

                

   

        }



   



</script>

<style>

    #example {



        max-width: 100% !important;

        overflow: scroll; <!-- Available options: visible, hidden, scroll, auto -->

    }

</style>



<script>

  var x = document.getElementById("empleavetoday");

  x.style.display = "none";





function more_filter() {

  var x = document.getElementById("empleavetoday");

  if (x.style.display === "none") {

    x.style.display = "block";

  } else {

    x.style.display = "none";

  }

}





function search() {



  var from = document.getElementById("sdatefrom").value;

  var to = document.getElementById("sdateto").value;

  var name = document.getElementById("name").value;

  var phone = document.getElementById("phone").value;

  var type = document.getElementById("leavetype").value;

  var category = document.getElementById("category").value;

  var dept = document.getElementById("dept").value;



  var string_url = "approve-leave/ssearch?type=" + type + "&name=" + name + "&from=" + from + "&to=" + to + "&phone=" + phone + "&category=" + category + "&dept=" + dept;

  $('#leavetable').DataTable({

                "lengthMenu": [[20, 50, 100, -1], [20, 50,100, "All"]],

                "processing": true,

                "destroy": true,

                "serverSide": true,

                "order": [],

		        "ajax": string_url,

               

                "columns": [

                    { data: 'emp_no', name: 'emp_no',

                    "render": function (data,type,row,meta){ 

                     

                    var empno=' <input type="hidden" id="lastindex" value="'+row.lastindex+'"> <input type="hidden" id="userindex" value="'+row.userindex+'"><a class="popper" onmouseover="ventitle('+row.id+');"   onmouseout="ventitle('+row.id+');"  href="">'+row.emp_no+'</a>';

                    empno+='<div id="pop'+row.id+'" style=" width: 80%; display : none; position : absolute;  z-index : 99999; padding : 0px;  background : #fff; border : 1px solid #A2ADBC; -moz-border-radius : 3px; -webkit-border-radius: 3px; margin : 0px; -webkit-box-shadow   : 0px 0px 5px 0px rgba(164, 164, 164, 1); box-shadow : 0px 0px 5px 0px rgba(164, 164, 164, 1);  left: 8%;"><div class="table-responsive" style="padding: 0px;">';

                        empno+='<table id="entitle" class="table table-bordered my-leave-summary-entitle" style="width:100%; font-size:11px;text-align: center;" width="100%" border="1">';

                        empno+='<thead>';

                        empno+='<tr style="height:50px;background: #F7F7F7;">';

                        empno+='<th style="width:5%;background: #F7F7F7;text-align: center;color:black;text-transform: capitalize;">Type</th>';

                        empno+='<th style="width:8%;text-align:center;color:black;background: #F7F7F7;text-transform: capitalize;">BF</th>';

                        empno+='<th style="width:8%;text-align:center;color:black;background: #F7F7F7;text-transform: capitalize;white-space: nowrap;">BF Adj</th>';

                        empno+='<th style="width:8%;text-align:center;color:black;background: #F7F7F7;text-transform: capitalize;">Entitle</th>';

                        empno+='<th style="width:5%;text-align:center;color:black;background: #F7F7F7;text-transform: capitalize;">Earn</th>';

                        empno+='<th style="width:10%;text-align:center;color:black;text-transform: capitalize;">Claimable</th>';

                        empno+='<th style="width:5%;text-align:center;color:black;text-transform: capitalize;">NPL</th>';

                        empno+='<th style="width:10%;text-align:center;color:black;text-transform: capitalize; padding-left: 0px !important; padding-right: 0px !important; padding-bottom: 0px !important;">Taken';

                        empno+='<table class="tableheading" style="width:100%; margin-top: 0.72rem !important;     border-top: 1px solid #ebe9f1;">';

                        empno+='<thead><tr>';

                        empno+='<th style="border-top:none;border-bottom:none; border-left:none; width:50%;">EL</th>';

                        empno+='<th style="border-top:none;border-bottom:none;border-right:none; width:50%">AL</td>';

                        empno+='</tr></thead></table>';

                        empno+=' </th>';

                        empno+='<th style="width:13%;text-align:center;color:black;text-transform: capitalize; padding-left: 0px !important; padding-right: 0px !important; padding-bottom: 0px !important;">Forfeit';

                        empno+='<table class="tableheading" style="width:100%; margin-top: 0.72rem !important; border-top: 1px solid #ebe9f1;">';

                        empno+='<thead><tr>';

                        empno+='<th style="border-top:none;border-bottom:none; width:50%">BF</th>';

                        empno+='<th style="border-top:none;border-bottom:none; width:50%">Adj</th>';

                        empno+='</tr></thead></table></th>';

                        empno+='<th style="width:8%;text-align:center;color:black;text-transform: capitalize;">Balance</th>';

                        empno+='</tr>';

                        empno+='</thead>';

                        empno+='<tbody>';

                        empno+='</tbody>';

                        empno+='</table>';

                        empno+='</div>';

                        empno+='</div>';

                        return empno;

                        }

                    },

                  //  { data: 'emp_no', name: 'emp_no' },

		            { data: 'emp_name', name: 'emp_name' },

                    { data: 'leave_type', name: 'leave_type',

		            "render": function (data,type,row,meta){ 

                        var ltype = '';

                         var ids=row.lid;

                    if(row.filename != '' ) {

                     ltype+= '<a href="'+base_url+'/view-file/'+row.lid+'" style="color:blue;">';

                     ltype+= row.leave_type;

                     ltype+='</a>';

                    }

                       else{

                       ltype+=row.leave_type;

                       } 

                        

                       return ltype;                     

                   } },

                   { data: 'date', name: 'date',

                    "render": function (data,type,row,meta){ 

                        var ldate = '<a class="appDialog-model" data-toggle="modal" data-target="#inlineForm" data-id="'+row.id+'" style="color:#3192F4;">'+ row.date.split("-").reverse().join("-")+'</a>';

                   

                        

                       return ldate;                     

                    } },

                    { data: 'no_days', name: 'no_days',

                        "render": function (data,type,row,meta){ 

                        if(row.is_hourly!=0){

                            var nodays = parseFloat(row.no_of_hours).toFixed(2)+' Hour(s)';

                        }else{	

                            var nodays = row.no_days+'&nbsp;'+row.half_day_type+' Day(s)';

                        }

                       return nodays;                     

                    }  },

                    { data: 'reason', name: 'reason' },

                    { data: 'leave_status', name: 'leave_status',



                        "render": function (data, type, row, meta){

                                var colorData = row.back_color;

                                var leave = `<div class="status-fd" style="color: ${colorData}"> ⦿ ` + row.leave_status +`</div>`;

                                // var leave = `<div class="status-fd"><div style="display:inline-block; margin-top:5px; margin-right:5%; border-width: 2px; border-style:solid; border-color: ${colorData}; border-radius: 50%;width: 12px;height: 12px;text-align:center;"><div style="height: 5px;width: 5px; background-color: ${colorData}; border-radius: 50%;padding:2px 2px;margin: auto auto;margin-top:1.5px;"></div></div>`+ row.leave_status +`</div>`;

                                return leave;

                        }



                    },

                    {"render": function (data,type,row,meta){ 

                        var action = '<input type="checkbox" class="approve" name="inlineRadioOptions"id="inlineRadio'+row.id+'" value="'+row.id+':'+row.status+'"'+row.dradio;

                        

                         if(row.status == '1' || row.status =='2') { 

                            action+='disabled';

                         } else{ 

                             action+='';

                             }

                             action+='/>';

                   

                        

                       return action;                     

                  

		                }

		            },

                

                ],

                

                'columnDefs': [{

                    "targets": [7],

                    "orderable": false

                }],

                "language": {

                    "paginate": {

                    // remove previous & next text from pagination

                    "previous": '&nbsp;',

                    "next": '&nbsp;'

                    }

                },

                'rowCallback': function(row, data, index){

                    $(row).find('td:eq(6)').css('color', data.back_color);

                    $(row).find('td:eq(6)').css('width', "20%");

                    $(row).find('td:eq(6)').css('font-weight', 'bold');

                    $(row).find('td:eq(5)').css('word-break', 'break-all');

                }

                });







}



function ventitle(id) {

    $('#pop'+id).toggle();

    var string_url = "en?id="+id;

  $.ajax({

        url : string_url,

        type : "GET",

        cache: false,

       success:function(result){



//  var tb = "";

//             tb = tb + "<tr style='height:30px;' class='text-center'>";

//             tb = tb + "<th style='background: #F7F7F7;'><b>AL</b></th>";

//             tb = tb + "<td>"+ result.myLeaveSumm.abf ?? 0 +"</td>";

//             tb = tb + "<td>"+ result.myLeaveSumm.abfadj ?? 0 +"</td>";

//             tb = tb + "<td>"+ result.myLeaveSumm.aentitle ?? 0 +"</td>";

//             tb = tb + "<td>"+ result.myLeaveSumm.aearn ?? 0 +"</td>";

//             tb = tb + "<td>"+ result.myLeaveSumm.claimable ?? 0 +"</td>";

//             tb = tb + "<td>"+ result.myLeaveSumm.anpl ?? 0 +"</td>";

//             tb = tb + "<td style='width:11%; padding:0px !important;'>";

//             tb = tb + "<table style='width:100%; height: 50px;'>";

//             tb = tb + "<tbody><tr>";

//             tb = tb + "<td style='border-left:none;border-top:none;border-bottom:none;padding:0;width:50%;border-right:1px solid; border-color:#ebe9f1;'>"+ result.myLeaveSumm.atakenel ?? 0 +"</td>";

//             tb = tb + "<td style='width:50%; border-top:none;border-bottom:none;border-right:none;paddinborder-right:none;'>"+ result.myLeaveSumm.atakenal ?? 0 +"</td>";

//             tb = tb + "</tr></tbody></table>";

//             tb = tb + "</td>";

//             tb = tb + "<td style='width:11%; padding:0px !important;'>";

//             tb = tb + "<table class='tableheading' style='width:100%; height: 50px;'>";

//             tb = tb + "<tbody><tr>";

//             tb = tb + "<td style=' width:50%;  border-left:none;border-top:none;border-bottom:none;padding:0;  border-right:1px solid; border-color:#ebe9f1;'>"+ result.myLeaveSumm.aforfeitbf ?? 0 +"</td>";

//             tb = tb + "<td style=' width:50%;  border-top:none;border-bottom:none;padding:10px;border-right:none;'>"+ result.myLeaveSumm.aforfeitadj ?? 0 +"</td>";

//             tb = tb + "</tr></tbody></table>";

//             tb = tb + "</td>";

//             tb = tb + "<td>"+ result.myLeaveSumm.balance ?? 0 +"</td></tr>";

//             tb = tb + "<tr style='height:30px;'>";

//             tb = tb + "<th class='type text-center' style='background: #F7F7F7;'><b>MC</b></th>";

//             tb = tb + "<td>"+ result.medicalSumm.mbf ?? 0 +"</td>";

//             tb = tb + "<td>"+ result.medicalSumm.mbfadj ?? 0 +"</td>";

//             tb = tb + "<td>"+ result.medicalSumm.mentitle ?? 0 +"</td>";

//             tb = tb + "<td>-</td>";

//             tb = tb + "<td>"+ result.medicalSumm.mclaimable ?? 0 +"</td>";

//             tb = tb + "<td>"+ result.medicalSumm.mnpl ?? 0 +"</td>";

           

//             tb = tb + "<td>"+ result.medicalSumm.mtaken ?? 0 +"</td>";

//             tb = tb + " <td>0</td>";

//             tb = tb + " <td>"+ result.medicalSumm.mbalance ?? 0 +"</td>";

//             tb = tb + "</tr>"; 

//             tb = tb + "<tr style='height:30px;''>";

//             tb = tb + "<th class='type text-center' style='background: #F7F7F7;'><b>RL</b></th>";

//             tb = tb + "<td>"+ result.myLeaveSummSm.bf ?? 0 +"</td>";

//             tb = tb + "<td>"+ result.myLeaveSummSm.bfadj ?? 0 +"</td>";

//             tb = tb + "<td>-</td>";

//             tb = tb + "<td>"+ result.myLeaveSummSm.granted ?? 0 +"</td>";

//             tb = tb + "<td>-</td>";

//             tb = tb + "<td>-</td>";

//             tb = tb + "<td>"+ result.myLeaveSummSm.taken ?? 0 +"</td>";

//             tb = tb + "<td>"+ result.myLeaveSummSm.forfeit ?? 0 +"</td>";

//             tb = tb + "<td>"+ result.myLeaveSummSm.balance ?? 0 +"</td>";

//             tb = tb + "</tr> ";                              



var taken=result.myLeaveSumm['annual']['taken'];

            var pannual=result.myLeaveSumm['past_leaves']['annual'];

            var ael=taken+pannual;

            var mentitle=result.myLeaveSumm['medical']['entitle'];

            var madj=result.myLeaveSumm['brought_forward']['medical_adj'];

            var mclaimable=mentitle+madj;

            var mtaken=result.myLeaveSumm['medical']['taken'];

            var mmedical=result.myLeaveSumm['past_leaves']['medical'];

            var mctaken=mtaken+mmedical;

            var  bannual= result.myLeaveSumm['brought_forward']['annual'];

            var bannualtaken= result.myLeaveSumm['brought_forward']['annual_taken'];

            var bf = bannual-bannualtaken;

            var meentitle = result.myLeaveSumm['medical']['entitle'];

            var mebalance =  (meentitle + result.myLeaveSumm['brought_forward']['medical_adj'])-(result.myLeaveSumm['medical']['taken']+result.myLeaveSumm['past_leaves']['medical']);                                     

            // var rtaken = result.myLeaveSummSm['entitle']['Other_pay']['taken']+ result.myLeaveSummSm['entitle']['past_leaves']['replacement'];

            if(result.myLeaveSumm['bfadj_forfeit']==1) { 

                var albf=result.myLeaveSumm['brought_forward']['annual']- result.myLeaveSumm['brought_forward']['annual_taken'] } 

            else {

                var albf =0 

                }

            if(result.myLeaveSumm['bfadj_forfeit']==1) {

                var aladj= result.myLeaveSumm['brought_forward']['annual_adj']- result.myLeaveSumm['brought_forward']['bfAdjLeaveTaken'];

                } 

            else 

            {

                var aladj=0;

            }   

            if(mctaken > meentitle) 

            { var mt =0 ; } 

            else { var mt=mebalance; }

            if(result.myLeaveSummSm['bf_forfeit'] == 1){

            var actual_bf = result.myLeaveSummSm['entitle']['brought_forward']['Other_pay'];

            var taken_bf = result.myLeaveSummSm['entitle']['EmergencyLeaveValue'];

            var past_leave = result.myLeaveSummSm['entitle']['past_leave_forfeit'];

            

            if(actual_bf>0){

            var bf_forfeit = actual_bf - taken_bf - past_leave;

            }else{

            var bf_forfeit = actual_bf - taken_bf - past_leave;

            }

            }else{

            var bf_forfeit =  result.myLeaveSummSm['bf_forfeit'];

                }

            var tb = "";

            tb = tb + "<tr style='height:30px;' class='text-center'>";

            tb = tb + "<th style='background: #F7F7F7;'><b>AL</b></th>";

            tb = tb + "<td>"+ result.myLeaveSumm['brought_forward']['annual'] +"</td>";

            tb = tb + "<td>"+ result.myLeaveSumm['brought_forward']['annual_adj'] +"</td>";

            tb = tb + "<td>"+ result.myLeaveSumm['annual']['entitle'] +"</td>";

            tb = tb + "<td>"+ result.myLeaveSumm['earn'] +"</td>";

            tb = tb + "<td>"+ result.myLeaveSumm['claimable'] +"</td>";

            tb = tb + "<td>"+ result.myLeaveSumm['npl'] ?? 0 +"</td>";

            tb = tb + "<td style='width:11%; padding:0px !important;'>";

            tb = tb + "<table style='width:100%; height: 50px;'>";

            tb = tb + "<tbody><tr>";

            tb = tb + "<td style='border-left:none;border-top:none;border-bottom:none;padding:0;width:50%;border-right:1px solid; border-color:#ebe9f1;'>"+ result.myLeaveSumm['EmergencyLeaveValue'] +"</td>";

            tb = tb + "<td style='width:50%; border-top:none;border-bottom:none;border-right:none;paddinborder-right:none;'>"+ ael +"</td>";

            tb = tb + "</tr></tbody></table>";

            tb = tb + "</td>";

            tb = tb + "<td style='width:11%; padding:0px !important;'>";

            tb = tb + "<table class='tableheading' style='width:100%; height: 50px;'>";

            tb = tb + "<tbody><tr>";

            tb = tb + "<td style=' width:50%;  border-left:none;border-top:none;border-bottom:none;padding:0;  border-right:1px solid; border-color:#ebe9f1;'>"+ albf +"</td>";

            tb = tb + "<td style=' width:50%;  border-top:none;border-bottom:none;padding:10px;border-right:none;'>"+ aladj +"</td>";

            tb = tb + "</tr></tbody></table>";

            tb = tb + "</td>";

            tb = tb + "<td>"+ result.myLeaveSumm['balance'] ?? 0 +"</td></tr>";

            tb = tb + "<tr style='height:30px;'>";

            tb = tb + "<th class='type text-center' style='background: #F7F7F7;'><b>MC</b></th>";

            tb = tb + "<td>"+ result.myLeaveSumm['brought_forward']['medical'] +"</td>";

            tb = tb + "<td>"+ result.myLeaveSumm['brought_forward']['medical_adj'] +"</td>";

            tb = tb + "<td>"+ (Math.round(result.myLeaveSumm['medical']['entitle']*2))/2 +"</td>";

            tb = tb + "<td>-</td>";

            tb = tb + "<td>"+ (Math.round(mclaimable*2))/2 +"</td>";

            tb = tb + "<td>0</td>";

           

            tb = tb + "<td>"+ mctaken +"</td>";

            tb = tb + " <td>0</td>";

            tb = tb + " <td>"+ (Math.round(mt*2))/2 +"</td>";

            tb = tb + "</tr>"; 

            tb = tb + "<tr style='height:30px;''>";

            tb = tb + "<th class='type text-center' style='background: #F7F7F7;'><b>RL1</b></th>";

            // tb = tb + "<td>"+ result.myLeaveSummSm['entitle']['brought_forward']['Other_pay'] +"</td>";

            // tb = tb + "<td>"+ result.myLeaveSummSm['entitle']['adjust_leaves'] +"</td>";

            // tb = tb + "<td>-</td>";

            // tb = tb + "<td>"+ result.myLeaveSummSm['entitle']['Other_pay']['granted'] +"</td>";

            // tb = tb + "<td>-</td>";

            // tb = tb + "<td>-</td>";

            // tb = tb + "<td>"+ rtaken +"</td>";

            // tb = tb + "<td>"+ bf_forfeit +"</td>";

            // tb = tb + "<td>"+ result.myLeaveSummSm['balance'] +"</td>";result.myLeaveSummSm.bf



            tb = tb + "<td>"+ result.myLeaveSummSm.bf +"</td>";

            tb = tb + "<td>"+ result.myLeaveSummSm.bfadj +"</td>";

            tb = tb + "<td>-</td>";

            tb = tb + "<td>"+ result.myLeaveSummSm.granted +"</td>";

            tb = tb + "<td>-</td>";

            tb = tb + "<td>-</td>";

            tb = tb + "<td>"+ result.myLeaveSummSm.taken +"</td>";

            tb = tb + "<td>"+ result.myLeaveSummSm.forfeit +"</td>";

            tb = tb + "<td>"+ result.myLeaveSummSm.balance +"</td>";

            tb = tb + "</tr> "; 

            tb = tb + "<tr style='height:30px;''>";

            tb = tb + "<th class='type text-center' style='background: #F7F7F7;'><b>RL2</b></th>";

            tb = tb + "<td>"+ result.myLeaveSummSm1.bf +"</td>";

            tb = tb + "<td>"+ result.myLeaveSummSm1.bfadj +"</td>";

            tb = tb + "<td>-</td>";

            tb = tb + "<td>"+ result.myLeaveSummSm1.granted +"</td>";

            tb = tb + "<td>-</td>";

            tb = tb + "<td>-</td>";

            tb = tb + "<td>"+ result.myLeaveSummSm1.taken +"</td>";

            tb = tb + "<td>"+ result.myLeaveSummSm1.forfeit  +"</td>";

            tb = tb + "<td>"+ result.myLeaveSummSm1.balance +"</td>";

            tb = tb + "</tr> "; 





$("#entitle tbody").html(tb);

        }

      });

}





        $("#checkAll").click(function(){

            $('.approved-btn').attr('disabled', false);

            $('.reject-visible-btn').attr('disabled', false);

            $('.cancel-visible-btn').attr('disabled', false);

            $('input:checkbox').not(this).filter('.approve').not(":disabled").prop('checked', this.checked);

        });



        $("#checkAll11").click(function(){

            $('.approved-btn1').attr('disabled', false);

            $('.reject-visible-btn1').attr('disabled', false);

            $('.delete-visible-btn1').attr('disabled', false);

            $('input:checkbox').not(this).filter('.replacement').not(":disabled").prop('checked', this.checked);

        });





</script>