@extends('layouts.app2') @section('dynamic_css')
<link href="{!! asset('/plugins/bootstrap-material-datetimepicker/css/bootstrap-material-datetimepicker.css') !!}" rel="stylesheet" />
<link href="{!! asset('/css/fullcalendar.min.css') !!}" rel="stylesheet" />
<link href="{!! asset('/css/fullcalendar.print.min.css') !!}" rel="stylesheet" media="print" />
<link href="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/1.1.3/sweetalert.min.css" rel="stylesheet" />
<style>
    body {
        font-family: "Lucida Grande", Helvetica, Arial, Verdana, sans-serif;
        font-size: 14px;
        background-color: #fff;
    }

    #calendar {
        max-width: 1050px;
        margin: 0 auto;
        background-color: white;
        width: 100%;
    }

    .h2,
    h2 {
        font-size: 1.5rem !important;
    }

    #calendar table .fc-head {
        background-color: #2bbbad!important;
        color: white;
    }

    .fc-day-header {
        height: 43px;
        font-size: 18px;
        padding-top: 16px !important;
    }

    .color_indegator {
        margin-left: 10px;
        margin-top: 2px;
        font-weight: 700;
    }

    .fc-scroller {
        height: auto !important;
        /* max-height: 350px !important; */
        overflow-x: hidden !important;
        overflow-y: auto !important;
    }


    #agenda_d {
        /*   height: 300px;*/
        border: 1px solid #d4c8c8;
        /* padding: 39px; */
        /* padding-top: 10px;*/
        /*background-color: #17a2b8;*/
    }

    .row_pading {
        padding-right: 0px;
        padding-left: 0px;
    }

    .row_margin {
        margin-right: 0px;
        margin-left: 0px;
    }

    .card_header {
        padding: 0rem 0rem;
    }


    .dtp-btn-ok {
        background-color: #007bff;
        opacity: .7;
    }

    .dtp-btn-cancel {
        background-color: #dc3545;
        opacity: .7;
    }

    .dtp-btn-clear {
        background-color: #ffc107;
        opacity: .7;
    }




    /* fallback */

    @font-face {
        font-family: 'Material Icons';
        font-style: normal;
        font-weight: 400;
        src: url(https://fonts.gstatic.com/s/materialicons/v38/flUhRq6tzZclQEJ-Vdg-IuiaDsNc.woff2) format('woff2');
    }

    .material-icons {
        font-family: 'Material Icons';
        font-weight: normal;
        font-style: normal;
        font-size: 24px;
        line-height: 1;
        letter-spacing: normal;
        text-transform: none;
        display: inline-block;
        white-space: nowrap;
        word-wrap: normal;
        direction: ltr;
        -webkit-font-feature-settings: 'liga';
        -webkit-font-smoothing: antialiased;
    }



    .docs-tab-content {
        position: relative;
        border: 1px solid rgba(0, 0, 0, .15);
        padding: 0;
    }

    .docs-tabs .nav-link {
        border-width: 1px 1px 0 1px;
        border-color: rgba(0, 0, 0, .15);
        border-style: solid;
        border-radius: 5px 5px 0 0;
        margin-right: 8px;
        margin-bottom: -1px;
        color: #212529;
    }


    .switch {
        position: relative;
        display: inline-block;
        width: 60px;
        height: 26px;
    }

    .switch input {display:none;}

    .slider {
        position: absolute;
        cursor: pointer;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background-color: #ccc;
        -webkit-transition: .4s;
        transition: .4s;
    }

    .slider:before {
        position: absolute;
        content: "";
        height: 18px;
        width: 26px;
        left: 4px;
        bottom: 4px;
        background-color: white;
        -webkit-transition: .4s;
        transition: .4s;
    }

    input:checked + .slider {
        background-color: #2196F3;
    }

    input:focus + .slider {
        box-shadow: 0 0 1px #2196F3;
    }

    input:checked + .slider:before {
        -webkit-transform: translateX(26px);
        -ms-transform: translateX(26px);
        transform: translateX(26px);
    }

    /* Rounded sliders */
    .slider.round {
        border-radius: 34px;
    }

    .slider.round:before {
        border-radius: 50%;
    }


    .df{
        display: flex;
    }

    .slider_label{
        font-size: 18px;
        margin-left: 5px;
        margin-right: 5px;
    }    


    .border_bottom{
        border-bottom: 1px solid #e7e1e1;
        border-left: 3px solid #28a745;;
    }
    .border_left_red{
        border-left: 3px solid red;
    }   

    .show{
        border-bottom: 1px solid #e7e1e1;
    }

    .over_flow{
        overflow: hidden;
        text-align: left;
        text-decoration: none;
    }




</style>
@endsection @section('badcome')
@endsection 
@section('content')

<div class="container">
    <div class="row justify-content-center">
        <div class="col-md-12">
            <!-- Nav tabs -->
            <ul class="nav nav-tabs md-tabs nav-justified">
                <li class="nav-item">
                    <a class="nav-link active" data-toggle="tab" href="#panel1" role="tab">Apply For Leave</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" data-toggle="tab" href="#panel2" role="tab">Leave Balance</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" data-toggle="tab" href="#panel3" role="tab">Leave History</a>
                </li>
            </ul>
            <!-- Tab panels -->
            <div class="tab-content card">
                <!--Panel 1-->
                <div class="tab-pane fade in show active" id="panel1" role="tabpanel">
                    <div class="card">
                        <div class="card-header">Leave Application</div>

                        <div class="card-body">
                            <div class="row">
                                <div class="col-md-8">
                                    <form method="POST" action="{{url('/apply_leave')}}" aria-label="Leave Application" enctype="multipart/form-data" id="leave-apply-form" class="form-horizontal" style="width: 140%">
                                        @csrf
                                        <div class="form-group row">
                                            <div class="col-md-3">
                                                <label for="leave_type" class="col-form-label text-md-right">Leave Type</label>
                                                <select class="form-control" name="leave_type" id="leave_type" required="required">
                                                    <option value="">---Leave Type---</option>
                                                    @foreach($leave_type as $value)
                                                    <option value="{{$value['id']}}"  @if (old('leave_type') == $value['id']) selected="selected" @endif>{{$value['leave_name']}}</option>
                                                    @endforeach
                                                </select>

                                                @if ($errors->has('leave_type'))
                                                <span class="invalid-feedback" role="alert">

                                                </span>
                                                <strong class="text text-danger">{{ $errors->first('leave_type') }}</strong>
                                                @endif
                                            </div>
                                            <div class="col-md-3">
                                                <label for="leave_session" class="col-form-label text-md-right">Leave Session</label>
                                                <select  class="form-control" name="leave_session" id="leave_session" required="required">
                                                    <option value="">---Leave Session---</option>
                                                    @foreach($leave_session as $value)
                                                    <option value="{{$value['id']}}" @if (old('leave_session') == $value['id']) selected="selected" @endif>{{$value['session_name']}}</option>
                                                    @endforeach
                                                </select>

                                                @if ($errors->has('leave_session'))
                                                <span class="invalid-feedback" role="alert">

                                                </span>
                                                <strong class="text text-danger">{{ $errors->first('leave_session') }}</strong>
                                                @endif
                                            </div>
                                        </div>
                                        <div class="form-group row" hidden="hidden" id="day-div">
                                            <div class="col-md-3">
                                                <label for="partital_day" class="col-form-label text-md-right">Partial Days</label>
                                                <select class="form-control" name="partial_day" id="partial_day" >
                                                    <option value="">---Partial Days---</option>
                                                    @foreach($partial_days as $value)
                                                    <option value="{{$value['id']}}" @if (old('partial_day') == $value['id']) selected="selected" @endif>{{$value['partial_day_name']}}</option>
                                                    @endforeach
                                                </select>

                                                @if ($errors->has('partial_day'))
                                                <span class="invalid-feedback" role="alert">

                                                </span>
                                                <strong class="text text-danger">{{ $errors->first('partial_day') }}</strong>
                                                @endif
                                            </div>
                                            <div class="col-md-3">
                                                <label for="day_part" class="col-form-label text-md-right">Day Part</label>
                                                <select class="form-control" name="day_part" id="day_part">
                                                    <option value="">---Day Part---</option>
                                                    @foreach($day_parts as $value)
                                                    <option value="{{$value['id']}}" @if (old('day_part') == $value['id']) selected="selected" @endif>{{$value['day_part_name']}}</option>
                                                    @endforeach

                                                </select>

                                                @if ($errors->has('day_part'))
                                                <span class="invalid-feedback" role="alert">

                                                </span>
                                                <strong class="text text-danger">{{ $errors->first('day_part') }}</strong>
                                                @endif
                                            </div>
                                        </div>
                                        <div class="form-group row">

                                            <div class="col-md-3">
                                                <label for="from_date" class="col-form-label text-md-right">Leave From Date</label>
                                                <input type="text" name="from_date" id="from_date" class="datepicker form-control mm_input" required="required" value="{{old('from_date')}}">

                                                @if ($errors->has('from_date'))
                                                <span class="invalid-feedback" role="alert">

                                                </span>
                                                <strong class="text text-danger">{{ $errors->first('from_date') }}</strong>
                                                @endif
                                            </div>
                                            <div class="col-md-3">
                                                <label for="to_date" class="col-form-label text-md-right">Leave Till Date</label>
                                                <input type="text" name="to_date" id="to_date" class="form-control"  value="{{old('to_date')}}">

                                                @if ($errors->has('to_date'))
                                                <span class="invalid-feedback" role="alert">

                                                </span>
                                                <strong class="text text-danger">{{ $errors->first('to_date') }}</strong>
                                                @endif
                                            </div>
                                        </div>
                                        <div class="form-group row">
                                            <div class="col-md-6">
                                                <label for="relevant_doc" class="col-form-label text-md-right">If Any relevant document available</label>
                                                <input type="file" name="relevant_doc" id="relevant_doc" class="form-control"  value="{{old('to_date')}}">
                                                @if ($errors->has('relevant_doc'))
                                                <span class="invalid-feedback" role="alert">

                                                </span>
                                                <strong class="text text-danger">{{ $errors->first('relevant_doc') }}</strong>
                                                @endif
                                            </div>
                                        </div>


                                        <div class="form-group row">
                                            <div class="col-md-6">
                                                <label for="leave_reason" class="col-form-label text-md-right">Reason for leave application</label>
                                                <!--<textarea name="leave_reason" id="leave_reason" class="form-control" placeholder="Reason for a leave" required="required">
                                        {{old('leave_reason')}}
                                                </textarea>-->
                                                <textarea class="form-control" id="leave_reason" name="leave_reason" placeholder="Reason of leave" required=""></textarea>
                                                @if ($errors->has('leave_reason'))
                                                <span class="invalid-feedback" role="alert">

                                                </span>
                                                <strong class="text text-danger">{{ $errors->first('leave_reason') }}</strong>
                                                @endif

                                            </div>
                                        </div>

                                        <div class="form-group row mb-0">
                                            <div class="col-md-8">
                                                <button type="button" class="btn btn-primary" id="leave-apply-btn">
                                                    APPLY LEAVE
                                                </button>
                                            </div>
                                        </div>
                                    </form>
                                </div>
                                <div class="col-md-4">
                                    <table class="table table-striped table-bordered">
                                        <thead>
                                            <tr>
                                                <th>SL No.</th><th>Leave Name</th><th>Balanced Days</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            @php
                                            $i = 1;
                                            @endphp
                                            @foreach($leave_balances as $value)
                                            <tr>
                                                <td>{{$i++}}</td><td>{{$value['leave_name']}}</td><td>{{$value['balanced_days']}}</td>
                                            </tr>
                                            @endforeach
                                        </tbody>
                                    </table>
                                </div>
                            </div>

                        </div>
                    </div>
                </div>
                <!--/.Panel 1-->
                <!--Panel 2-->
                <div class="tab-pane fade" id="panel2" role="tabpanel">
                    <div class="card">
                        <div class="card-header">Leave Balance</div>

                        <div class="card-body">

                            <div class="col-md-12">
                                <table class="table table-striped table-bordered">
                                    <thead>
                                        <tr>
                                            <th>SL No.</th><th>Leave Name</th><th>Alloted Days</th><th>Leave Taken</th><th>Balanced Days</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        @php
                                        $i = 1;
                                        @endphp
                                        @foreach($leave_balances as $value)
                                        <tr>
                                            <td>{{$i++}}</td><td>{{$value['leave_name']}}</td><td>{{$value['alloted_leave_days']}}</td><td><a href="#">{{$value['alloted_leave_days']-$value['balanced_days']}}</a></td><td>{{$value['balanced_days']}}</td>
                                        </tr>
                                        @endforeach
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
                <!--/.Panel 2-->
                <!--Panel 3-->
                <div class="tab-pane fade" id="panel3" role="tabpanel">
                    <br>
                    <ul class="nav nav-tabs" id="myTab" role="tablist">
                        <li class="nav-item">
                            <a class="nav-link active" id="home-tab" data-toggle="tab" href="#active-leaves" role="tab" aria-controls="home" aria-selected="true">Active Leaves</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" id="profile-tab" data-toggle="tab" href="#past-leaves" role="tab" aria-controls="profile" aria-selected="false">Past Leaves</a>
                        </li>

                    </ul>
                    <div class="tab-content" id="myTabContent">
                        <div class="tab-pane fade show active" id="active-leaves" role="tabpanel" aria-labelledby="home-tab">
                            <table class="table table-responsive" id="active_leave_table">
                                <thead>
                                    <tr>
                                        <th>Sl No.</th>
                                        <th>Type</th>
                                        <th>Start Date</th>
                                        <th>Last Date</th>
                                        <th>Leave Days</th>
                                        <th>Leave Status</th>
                                        <th>Action</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @php
                                    $i = 1;
                                    $j = 0;
                                    @endphp
                                    @foreach($applied_leaves as $value)
                                        @php
                                        $date1 = date_create($value['start_date']);
                                        $date2 = date_create($value['end_date']);
                                        $diff = date_diff($date1, $date2);
                                        $leave_days = $diff->format('%a')+1;
                                        @endphp
                                    @if($value['id'] == 1 || $value['id'] == 4 )
                                    <tr>
                                        <td>{{$i++}}</td>
                                        <td>{{$value['leave_name']}}</td>
                                        <td class="start-date-data">{{$value['start_date']}}</td>
                                        <td class="end-date-data">{{$value['end_date']}}</td>
                                        <td><a href='' name="{{$value['id_leave_apply']}}"style="color:blue; font-weight: bold;" data-toggle="modal" data-target="#leaveDatesExampleModal" class="leave_days">{{$leave_days - $partial_leave_days_count[$j]}}</a></td>   
                                        <td>{{$value['status_name']}}</td>
                                        <td>@if($value['document'] != "")<a href="{{$value['document']}}" class="btn btn-success btn-xs btn-rounded"><i class="fa fa-download"></i></a>@endif<button type="button" class="btn btn-danger btn-xs btn-rounded leave-cancel" data-toggle="modal" data-target="#basicExampleModal" name="{{$value['id_leave_apply']}}" title="Cancel Leave Dates"><i class="fa fa-remove"></i></button></td>
                                    </tr>
                                    @endif
                                    @php
                                    $j++
                                    @endphp
                                    @endforeach
                                </tbody>
                            </table>
                        </div>
                        <div class="tab-pane fade" id="past-leaves" role="tabpanel" aria-labelledby="profile-tab">
                            <table class="table table-responsive" id="past_leave_table">
                                <thead>
                                    <tr>
                                        <th>Sl No.</th>
                                        <th>Type</th>
                                        <th>Start Date</th>
                                        <th>Last Date</th>
                                        <th>Leave Days</th>
                                        <th>Status</th>
                                        <th>Remarks</th>
                                        <th>Action</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @php
                                    $i = 1;
                                    $j = 0;
                                    @endphp
                                    @foreach($applied_leaves as $value)
                                        @php
                                        $date1 = date_create($value['start_date']);
                                        $date2 = date_create($value['end_date']);
                                        $diff = date_diff($date1, $date2);
                                        $leave_days = $diff->format('%a')+1;
                                        @endphp

                                    @if($value['id'] != 1)
                                    <tr>
                                        <td>{{$i++}}</td>
                                        <td>{{$value['leave_name']}}</td>
                                        <td class="start-date-data">{{$value['start_date']}}</td>
                                        <td class="end-date-data">{{$value['end_date']}}</td>
                                        <td><a href='' name="{{$value['id_leave_apply']}}"style="color:blue; font-weight: bold;" data-toggle="modal" data-target="#leaveDatesExampleModal" class="leave_days">{{$leave_days - $partial_leave_days_count[$j]}}</a></td>   
                                        <td>{{$value['status_name']}}</td>
                                        <td>{{$value['remarks']}}</td>
                                        <td>@if($value['document'] != "")<a href="{{$value['document']}}" class="btn btn-success btn-xs btn-rounded" title="Download leave document"><i class="fa fa-download"></i></a>@endif </td>
                                    </tr>
                                    @endif
                                    @php
                                        $j++;
                                    @endphp
                                    @endforeach
                                </tbody>
                            </table>
                        </div>
                    </div>

                </div>
                <!--/.Panel 2-->

            </div>

        </div>
    </div>
</div>
<!-- Modal -->
<div class="modal fade" id="basicExampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <form method="post" action="{{route('cancel_leave')}}" class="form-horizontal">
                <div class="modal-header">
                    <h5 class="modal-title" id="exampleModalLabel">Leave Cancelation</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">

                    @csrf
                    <input type="hidden" name="leave_apply" id="leave_apply">
                    <table class="table table-responsive table-striped">
                        <thead>
                            <tr>
                                <th>Sl. No.</th><th>Date</th><th>Mark</th>
                            </tr>
                        </thead>
                        <tbody id="leave_date_body">

                        </tbody>
                    </table>

                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                    <button type="submit" class="btn btn-primary">Save changes</button>
                </div>
            </form>
        </div>
    </div>
</div>
<!-- Modal -->
    <div class="modal fade" id="leaveDatesExampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="exampleModalLabel">Leave Dates</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    <table class="table table-responsive table-striped">
                        <thead>
                            <tr>
                                <th>Date</th><th>Status</th>
                            </tr>
                        </thead>
                        <tbody id="leave_cancel_date_body">

                        </tbody>
                    </table>

                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                </div>
            </div>
        </div>
    </div>

@endsection 
@section('dynamic_js')
<script src="{{ asset('plugins/bootstrap-select/js/bootstrap-select.js') }}"></script>
<script src="{{ asset('js/lib/moment.min.js') }}"></script>
<script src="{{ asset('plugins/bootstrap-material-datetimepicker/js/bootstrap-material-datetimepicker.js') }}"></script>
<script src="{{ asset('js/lib/fullcalendar.min.js') }}"></script>
<script src="{{ asset('js/custom/calender_minutes.js') }}"></script>
<script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script>
<script>
@php
        $start = new Carbon\Carbon('first day of this month');
@endphp
        $('#from_date').bootstrapMaterialDatePicker({
    weekStart: 0,
            time: false,
            minDate: "{{$start->parse()->format('Y-m-d')}}"
}).on('change', function () {
    $('#to_date').bootstrapMaterialDatePicker({
        weekStart: 0,
        time: false,
        minDate: $('#from_date').val()
    }).change(function () {
        var date1 = new Date($('#from_date').val());
        var date2 = new Date($('#to_date').val());
        var timeDiff = Math.abs(date2.getTime() - date1.getTime());
        var diffDays = Math.ceil(timeDiff / (1000 * 3600 * 24));
        if ($('#leave_type').val() === "1" && diffDays > 2.5) {
            swal("Casual leave cannot be applied more than 2.5 days in a months. "+diffDays);
            $('#to_date').val("");
        }
        /*if ($('#leave_session').val() === "2" && diffDays > 1) {
         swal("On half session leave more than one day cannot be taken.");
         $('#to_date').val("");
         }*/
        if ($('#leave_type').val() === "2" && diffDays > 14) {
            var loss_of_pay_days = diffDays - 14;
            swal("Your sick leave exceeds its balanced days limits. Its exceeded " + loss_of_pay_days + " days will be considered as loss of pay");
        }
    });
});
</script>
<script>
    $(document).on('click', '.leave-cancel', function () {
        $('#leave_apply').val($(this).attr('name'));
        var cancel_leave_dates = new Array();
        var button = $(this);
        $.get("get_canceled_leave_dates", {
            leave_apply: $(this).attr('name')
        }, function (j) {

            for (var i = 1; i < j.length; i++) {
                cancel_leave_dates[i - 1] = j[i].cancel_date;
            }
            var start_date = button.closest("tr")   // Finds the closest row <tr> 
                    .find(".start-date-data")     // Gets a descendent with class="nr"
                    .text();
            var end_date = button.closest("tr")   // Finds the closest row <tr> 
                    .find(".end-date-data")     // Gets a descendent with class="nr"
                    .text();
            if (end_date === "") {
                end_date = start_date;
            }
            get_leave_dates(start_date, end_date, cancel_leave_dates);
        });
    });
    function get_leave_dates(start_date, end_date, cancel_leave_dates) {
        var date1 = new Date(start_date);
        var date2 = new Date(end_date);
        var timeDiff = Math.abs(date2.getTime() - date1.getTime());
        var diffDays = Math.ceil(timeDiff / (1000 * 3600 * 24));
        var tr = "";
        for (var i = 0; i <= diffDays; i++) {
            var dat = new Date(start_date);
            var dd = "";
            dat.setDate(dat.getDate() + i);
            var mm = dat.getMonth() + 1; // getMonth() is zero-based
            var dd = dat.getDate();
            var leave_date = [dat.getFullYear(),
                (mm > 9 ? '-' : '-0') + mm,
                (dd > 9 ? '-' : '-0') + dd
            ].join('');

            if (!cancel_leave_dates.includes(leave_date)) {
                tr += "<tr><td>" + (i + 1) + "</td><td>" + leave_date + "</td><td><input type='checkbox' name='cancel_leave_date[]' value='" + leave_date + "'></td></tr>";
            }

        }
        tr += "<tr><td colspan='3'><textarea name='cancel_reason' id='cancel_reason' placeholder='Reason for leave cancel' class='form-control'></textarea></td></tr>";
        $('#leave_date_body').html(tr);
    }
    $(document).on('change', '#leave_session', function () {
        /*var leave_types = [3, 4, 5];
         if (leave_types.includes(parseInt($('#leave_type').val())) && $(this).val() === "2") {
         swal("Leaves like Privilege, Maternity and Paternal leave cannot be taken as half day leave");
         $(this).val("");
         }*/
        if ($(this).val() === "2") {
            $("#day-div").removeAttr("hidden");
            $('#partital_day').attr("required", "required");
            $('#day_part').attr("required", "required");
        } else {
            $("#day-div").attr("hidden", "hidden");
            $('#partital_day').removeAttr("required");
            $('#day_part').removeAttr("required");
        }
    });
    $(document).on('change', '#leave_type', function () {
        if ($(this).val() === "2") {
            $('#relevant_doc').attr("required", "required");
        } else {
            $('#relevant_doc').removeAttr("required");
        }
    });
    $(document).on('change','#leave_session',function(){
       if($('#leave_type').val() === "3" && $('#leave_session').val() === "2"){
          swal("Privilege leave cannot be applied as half leave.");
          $('#leave_session').val("");
        }
    });
    $(document).ready(function () {
        if ($('#leave_session').val() === "2") {
            $("#day-div").removeAttr("hidden");
            $('#partital_day').attr("required", "required");
            $('#day_part').attr("required", "required");
        }
    });
    $(document).on('click', '.leave_days', function () {
    var cancel_leave_dates = new Array();
    var button = $(this);
    $.get("{{url('/get_canceled_leave_dates')}}", {
        leave_apply: $(this).attr('name')
    }, function (j) {
        for (var i = 1; i < j.length; i++) {
            cancel_leave_dates[i - 1] = j[i].cancel_date;
        }
        var start_date = button.closest("tr")   // Finds the closest row <tr> 
                .find(".start-date-data")     // Gets a descendent with class="nr"
                .text();
        var end_date = button.closest("tr")   // Finds the closest row <tr> 
                .find(".end-date-data")     // Gets a descendent with class="nr"
                .text();
        if (end_date === "") {
            end_date = start_date;
        }
        get_canceled_leave_dates(start_date, end_date, cancel_leave_dates);
    });
});
function get_canceled_leave_dates(start_date, end_date, cancel_leave_dates) {
    var date1 = new Date(start_date);
    var date2 = new Date(end_date);
    var timeDiff = Math.abs(date2.getTime() - date1.getTime());
    var diffDays = Math.ceil(timeDiff / (1000 * 3600 * 24));
    var tr = "";
    for (var i = 0; i <= diffDays; i++) {
        var dat = new Date(start_date);
        var dd = "";
        var end_dd = "";
        dat.setDate(dat.getDate() + i);
        var mm = dat.getMonth() + 1; // getMonth() is zero-based
        var dd = dat.getDate();
        var leave_date = [dat.getFullYear(),
            (mm > 9 ? '-' : '-0') + mm,
            (dd > 9 ? '-' : '-0') + dd
        ].join('');
        
        if (!cancel_leave_dates.includes(leave_date)) {
            tr += "<tr><td>" + leave_date +"</td><td><i class='fa fa-check' style='color: #28a745'></i></td></tr>";
        } else {
             tr += "<tr><td>" + leave_date +"</td><td><i class='fa fa-remove' style='color:#dc3545'></i></td></tr>";

        }

    }
    $('#leave_cancel_date_body').html(tr);
}
$(document).ready(function () {
    $('#active_leave_table').DataTable();
    $('#past_leave_table').DataTable();
});
</script>
@endsection