{{ View::make('layout.header') }}
<style>
    .fc-right .fc-state-active {

        z-index: 1 !important;
    }

    .fc-month-button,
    .fc-agendaWeek-button {
        border-top-right-radius: 0 !important;
        border-bottom-right-radius: 0 !important;
    }

    .fc-agendaWeek-button,
    .fc-agendaDay-button {
        border-top-left-radius: 0 !important;
        border-bottom-left-radius: 0 !important;

    }

    .fc-icon-left-single-arrow:after,
    .fc-icon-right-single-arrow:after {
        top: -30% !important;
    }

    .fc-icon-left-single-arrow:after {
        font-size: 135% !important;
        font-weight: inherit !important;
        content: "\e900" !important;
    }

    .fc-icon-right-single-arrow:after {
        font-size: 135% !important;
        font-weight: inherit !important;
        content: "\e901" !important;
    }

    .fc-state-default {
        box-shadow: none !important;
    }

    .fc-content .fc-title {
        font-size: 11px;
        white-space: break-spaces !important;
    }

    .fc-right .fc-button {
        padding: 0.438rem 0.5rem !important;

        height: 100%;
    }

    .fc-right .fc-button-group {
        width: 60% !important;
        float: right !important;
    }

    @media only screen and (min-width: 768px) {

        .fc-left,
        .fc-right {
            width: 50% !important;
        }

        .app-calendar .fc-popover {
            left: 50% !important;
            top: 30% !important;
        }
    }

    @media only screen and (max-width: 768px) {

        .fc-left,
        .fc-right {
            width: 100% !important;
        }

        .app-calendar .fc-popover {
            left: 20% !important;
            top: 40% !important;
        }
    }
</style>

<!-- BEGIN: Content-->
<div id="data">
    <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">
                            <h2 class="content-header-title float-left mb-0">E-Leave</h2>
                            <div class="breadcrumb-wrapper">
                                <ol class="breadcrumb">
                                    <li class="breadcrumb-item">Approval
                                    </li>
                                    <li class="breadcrumb-item active"><a href="#">Dashboard</a>
                                    </li>
                                </ol>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="content-body">
                <!-- Dashboard Ecommerce Starts -->
                <section id="dashboard-ecommerce">
                    <div class="row match-height">

                        <!-- Statistics Card -->
                        <div class="col-xl-12 col-md-12 col-12">
                            <div class="card card-statistics" style="flex: 0;">
                                <div class="card-header">
                                    <h4 class="card-title">Leave Request</h4>
                                </div>
                                <div class="card-body statistics-body">
                                    <div class="row">

                                        <div class="col-xl-3 col-sm-6 col-12 mb-2 mb-xl-0">
                                            <div class="media">
                                                <div class="avatar bg-light-warning mr-2">
                                                    <div class="avatar-content">
                                                        <i data-feather="calendar" class="avatar-icon"></i>
                                                    </div>
                                                </div>
                                                <div class="media-body my-auto">
                                                    <h4 class="font-weight-bolder mb-0">{{ $pendingLeaves }}</h4>
                                                    <p class="card-text font-small-3 mb-0">Pending</p>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-xl-3 col-sm-6 col-12 mb-2 mb-sm-0">
                                            <div class="media">
                                                <div class="avatar bg-light-warning mr-2">
                                                    <div class="avatar-content">
                                                        <i data-feather="calendar" class="avatar-icon"></i>
                                                    </div>
                                                </div>
                                                <div class="media-body my-auto">
                                                    <h4 class="font-weight-bolder mb-0">{{ $cancellationpendingLeaves }}
                                                    </h4>
                                                    <p class="card-text font-small-3 mb-0">Cancellation Pending</p>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-xl-3 col-sm-6 col-12 mb-2 mb-xl-0">
                                            <div class="media">
                                                <div class="avatar bg-light-success mr-2">
                                                    <div class="avatar-content">
                                                        <i data-feather="thumbs-up" class="avatar-icon"></i>
                                                    </div>
                                                </div>
                                                <div class="media-body my-auto">
                                                    <h4 class="font-weight-bolder mb-0">{{ $approvedLeaves }}</h4>
                                                    <p class="card-text font-small-3 mb-0">Approved</p>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-xl-3 col-sm-6 col-12 mb-2 mb-sm-0">
                                            <div class="media">
                                                <div class="avatar bg-light-danger mr-2">
                                                    <div class="avatar-content">
                                                        <i data-feather="calendar" class="avatar-icon"></i>
                                                    </div>
                                                </div>
                                                <div class="media-body my-auto">
                                                    <h4 class="font-weight-bolder mb-0">{{ $rejectLeaves }}</h4>
                                                    <p class="card-text font-small-3 mb-0">Rejected</p>
                                                </div>
                                            </div>
                                        </div>

                                    </div>
                                </div>
                            </div>
                            <!--<div class="card card-statistics" style="flex: 0;">
                                <div class="card-header">
                                    <h4 class="card-title">My Teams</h4>
                                    <form id="filter-form">
                                        <div class="d-sm-flex justify-content-between align-items-center mb-3">
                                            <div class="d-flex align-items-center">
                                                @csrf
                                                <select class="form-control" id="year-select"  name="year">
                                                <option value="2019" {{ request()->get('year') && request()->get('year') == '2019' ? 'selected' : '' }}>2019</option>
                                                <option value="2020" {{ request()->get('year') && request()->get('year') == '2020' ? 'selected' : '' }}>2020</option>
                                                <option value="2021" {{ request()->get('year') && request()->get('year') == '2021' ? 'selected' : 'selected' }}>2021</option>
                                                </select>
                                            </div>
                                        </div>
                                    </form>
                                </div>
                                <div class="card-body statistics-body">
                                    <div class="row">
                                        <canvas id="canvas" height="230" width="600"></canvas>
                                    </div>
                                </div>
                            </div>-->
                            <!-- <div class="">
                                <div class="card card-revenue-budget">
                                    <div class="row mx-0">
                                        <div class="col-md-12 col-12 revenue-report-wrapper">
                                            <div class="d-sm-flex justify-content-between align-items-center mb-3">
                                                <h4 class="card-title mb-50 mb-sm-0">My Leave Approvals</h4>

                                                <div class="btn-group">
                                                    <input type="text" id="nam" name="name" class="form-control" placeholder="Emp No" style="padding-left: 10px;" value="{{ request()->get('name') ? request()->get('name') : '' }}">
                                                    &nbsp;&nbsp;
                                                    <select name="type" id="leavetype" class="select2 form-control">
                                                        <option value=""> 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;&nbsp;
                                                    <select name="status" id="sta" class="select2 form-control">
                                                        <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;
                                                    
                                                  </div>
                                            </div>

                                            <div id="revenue-report-chart"></div>
                                            <style type="text/css">
                                                .table th, .table td {padding: 8px;}
                                                .leave_table th, .leave_table td {padding: 8px;}
                                            </style>

                                            <div class="table-responsive">
                                                <table class="leave_table">
                                                    <thead>
                                                        <tr>
                                                            <th style="text-transform: capitalize;">Employee No.</th>
                                                            <th style="text-transform: capitalize;">Type</th>
                                                            <th style="text-transform: capitalize;">Date</th>
                                                            <th style="text-transform: capitalize;">Status</th>
                                                            <th style="text-transform: capitalize;">Approve</th>
                                                            <th style="text-transform: capitalize;">Reject</th>
                                                        </tr>
                                                    </thead>
                                                    <tbody>
                                                        @foreach ($recentLeaves as $recent)
@php
    $userPersonal = DB::table('user_personal')
        ->where('username', $recent->username)
        ->first();
    $user_id = Auth::id();
    $emp_no = isset($userPersonal) ? $userPersonal->employee_no : '';

    $status = '';
    $class = '';
    $no_action = '-';

    if ($recent->status == 0) {
        $status = 'Pending';
        $class = 'grey';
    } elseif ($recent->status == 1) {
        $status = 'Approved';
        $class = 'green';
    } elseif ($recent->status == 2) {
        $status = 'Rejected';
        $class = 'red';
    } elseif ($recent->status == 3) {
        $status = 'Recommended';
        $class = 'blue';
    } elseif ($recent->status == 4) {
        $status = 'Cancelled';
        $class = 'yellow';
    } elseif ($recent->status == 5) {
        $status = 'Cancellation Pending';
        $class = 'orange';
    }
@endphp
                                                        <tr>


                                                        <input type="hidden" class="id" value="{{ $recent->id }}">
                                                            <td>{{ $emp_no }}</td>
                                                            <td>{{ $recent->type }}</td>
                                                            <td><a class="appDialog-model" data-toggle="modal" data-target="#inlineForm"
                                                                data-id="{{ $recent->id }}" style="color:#3192F4;">{{ date('d-m-Y', strtotime($recent->start_date)) }}</a></td>
                                                            <td style="color:{{ $class }}">{{ $status }}</td>
                                                            @if ($recent->status == 0 || $recent->status == 3 || $recent->status == 4 || $recent->status == 5)
<td ><button type="button" class="btn btn-success approved-btn yes-btn1" data-toggle="modal" data-target="#exampleModal" >Approve</button></td>
                                                        <td><button type="button" class="btn btn-danger reject-btn" data-toggle="modal" data-target="#rejectModal">Reject</button>
                                                      </td
@else
<td> {{ $no_action }} </td>
                                                      <td> {{ $no_action }} </td>
@endif

                                                            {{-- <td style="text-align:center;"> <input type="checkbox" name="inlineRadioOptions"id="inlineRadio"/></td> --}}
                                                            {{-- <td style="text-align:center;"> <input type="checkbox" name="inlineRadioOptions"id="inlineRadio{{ $request->id }}" value="{{ $request->id }}" {{ in_array($request->status, ['1', '2']) ? 'disabled' : ''}}/></td> --}}
                                                        </tr>
@endforeach
                                                    </tbody>
                                                </table>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>-->
                        </div>
                        <!--<div class="col-lg-4 col-12">
                            <div class="card card-user-timeline">
                                <div class="card-header">
                                    <div class="d-flex align-items-center">

                                        <h4 class="card-title">Leave Reasons</h4>
                                    </div>
                                </div>
                                <div class="card-body" style="height:250px;">
                                    <canvas id="pie-chart"></canvas>
                                </div>
                            </div>

                            <div class="card card-user-timeline">
                                <div class="card-header">
                                    <div class="d-flex align-items-center">

                                        <h4 class="card-title">Messages</h4>
                                    </div>
                                </div>
                                <div class="card-body" style="height:500px;">
                                    <div class="row avg-sessions pt-50">
                                        <div class="table-responsive">
                                            <table class="table">
                                                <thead>
                                                    <tr>
                                                        <th style="text-transform: capitalize;">Message</th>
                                                        <th style="text-transform: capitalize;">Expiry Date</th>
                                                        <th style="text-transform: capitalize;">Sender</th>
                                                    </tr>
                                                </thead>
                                                <tbody>
                                                    @foreach ($messages as $message)
<tr>
                                                            <td>{{ $message->message }}</td>
                                                            <td>{{ $message->expiry_date }}</td>
                                                            <td>{{ $message->sender }}</td>
                                                        </tr>
@endforeach
                                                </tbody>
                                            </table>
                                        </table>
                                    </div>
                                </div>
                            </div>
                        </div>-->


                        <div class="app-calendar  col-xl-12 col-md-12 col-12">
                            <div class="card card-revenue-budget">
                                <div class="row mx-0">
                                    <div class="col-md-12 col-12 revenue-report-wrapper" style="padding:0px;">
                                        <div class="col-md-12 col-12 revenue-report-wrapper float right">
                                            <div class="row">
                                                <div class="col-md-12">
                                                    <h4 class="card-title" style="margin-bottom:0px;">Search Leave
                                                    </h4>
                                                </div>

                                            </div>
                                        </div>

                                        <div class="d-sm-flex justify-content-between align-items-center "
                                            style="margin-bottom:20px;">
                                            <div class="card shadow-none border-0 mb-0 rounded-0">
                                                <div class="d-sm-flex justify-content-between align-items-center">
                                                    <form id="all-filter">
                                                        @csrf
                                                        <div class="d-flex align-items-center"
                                                            style="padding-left: 20px;padding-top: 10px;">
                                                            <input type="hidden" name="year" id="year"
                                                                class="form-control" style=""
                                                                value="{{ date('Y') }}" placeholder="">
                                                            <input type="hidden" name="month" id="month"
                                                                class="form-control" style=""
                                                                value="{{ date('m') }}" placeholder="">
                                                            @php
                                                                $hmonth1 = date('n-Y', strtotime('-1 months'));
                                                                $hmonth2 = date('n-Y');
                                                                $hmonth3 = date('n-Y', strtotime('+1 months'));
                                                                $hmonth = $hmonth2;
                                                            @endphp
                                                            <input type="hidden" name="hmonth" id="hmonth"
                                                                class="form-control" style=""
                                                                value="{{ $hmonth }}" placeholder="">

                                                            <input type="hidden" name="calenderview"
                                                                id="calenderview" class="form-control" style=""
                                                                value="current" placeholder="">

                                                            <input type="text" name="name" id="name"
                                                                class="form-control"
                                                                style="border-width: 0 1px 0 0px; border-radius:0px; padding-left: 10px;"
                                                                value="" placeholder="Employee">
                                                            &nbsp;
                                                            <select name="type" class=" form-control"
                                                                style="padding-left: 10px; border-width: 0 1px 0 0px; border-radius:0px;"
                                                                id="type-selection" onchange="ajaxsearch('isfilter')">
                                                                <option value="">All Leave Types</option>
                                                                @foreach ($leaveTypes as $type)
                                                                    <option value="{{ $type->type }}"
                                                                        {{ request()->get('type') && request()->get('type') == $type->type ? 'selected' : '' }}>
                                                                        {{ $type->name }}</option>
                                                                @endforeach
                                                            </select>
                                                            &nbsp;
                                                            <select class="form-control" id="select-branch"
                                                                name="branch" onchange="ajaxsearch('isfilter')"
                                                                style="border-width: 0 1px 0 0px; border-radius:0px;">
                                                                <option value="">Branch</option>
                                                                @foreach ($branches as $branch)
                                                                    <option value="{{ $branch->id }}">
                                                                        {{ $branch->name }}</option>
                                                                @endforeach
                                                            </select>
                                                            &nbsp;
                                                            <select class="form-control" id="select-department"
                                                                name="department" onchange="ajaxsearch('isfilter')"
                                                                style="border-width: 0 1px 0 0px; border-radius:0px;">
                                                                <option value="">Department</option>
                                                                @foreach ($departments as $department)
                                                                    <option value="{{ $department->id }}">
                                                                        {{ $department->name }}</option>
                                                                @endforeach
                                                            </select>
                                                            &nbsp;
                                                            <select class="form-control" id="select-category"
                                                                name="category" onchange="ajaxsearch('isfilter')"
                                                                style="border-width: 0 1px 0 0px; border-radius:0px;">
                                                                <option value="">Category</option>
                                                                @foreach ($categories as $category)
                                                                    <option value="{{ $category->id }}">
                                                                        {{ $category->name }}</option>
                                                                @endforeach
                                                            </select>
                                                        </div>
                                                    </form>
                                                </div>
                                                <div class="card-body pb-0">
                                                    <div class="row">
                                                        <div class="col-md-12">
                                                            @include('E-Leave.inc.calender-filter')
                                                        </div>
                                                    </div>

                                                </div>
                                            </div>

                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="col-xl-12 col-md-12 col-12">
                            <div class="card card-revenue-budget">
                                <div class="row mx-0">
                                    <div class="col-md-12 col-12 revenue-report-wrapper" style="padding:0px;">
                                        <div class="col-md-12 col-12 revenue-report-wrapper float right">
                                            <div class="row">
                                                <div class="col-md-12">
                                                    <h4 class="card-title">Staff Leave Details</h4>
                                                    <div class="card-header" style="padding:0px;">
                                                        <div class="btn-group">
                                                            <button onclick="more_filter()"
                                                                class="btn btn-primary waves-effect waves-float waves-light"
                                                                style="">Filter</button>
                                                        </div>

                                                        <div
                                                            class="d-sm-flex justify-content-between align-items-center">
                                                            <div class="d-flex align-items-right">
                                                                <div class="btn-group btn-align-right">
                                                                    <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="#exampleModal1">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="#rejectModal1">Reject</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>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                            <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 ($categories as $category)
                                                                <option value="{{ $category->id }}">
                                                                    {{ $category->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 ($departments as $department)
                                                                <option value="{{ $department->id }}">
                                                                    {{ $department->name }}</option>
                                                            @endforeach

                                                        </select>
                                                    </div>
                                                    <div class="col-sm-6 filter-form-group mb-1">
                                                        Branch &nbsp;:<span class="red">*</span>&nbsp;
                                                        <select class="select form-control" id="branch"
                                                            name="branch">
                                                            <option value="">All</option>
                                                            @foreach ($branches as $branch)
                                                                <option value="{{ $branch->id }}">
                                                                    {{ $branch->name }}</option>
                                                            @endforeach

                                                        </select>
                                                    </div>

                                                    <div class="col-sm-6 filter-form-group mb-1">
                                                        Date &nbsp;:<span class="red">*</span>&nbsp;
                                                        <input type="date" name="sdate" id="sdate"
                                                            class="tcal form-control flatpickr-basic"
                                                            placeholder="DD-MM-YYYY" data-dateformat="dd-mm-yy">
                                                    </div>
                                                    <div class="col-sm-6 filter-form-group" style="margin-top:5px;">
                                                        <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; table-layout: fixed;">
                                                        <thead>
                                                            <tr>
                                                                <th style="text-transform: capitalize;"
                                                                    width="10%">Emp No.</th>
                                                                                                                                <th style="text-transform: capitalize;"
                                                                    width="{{ $percent }}%">Name</th>
                                                                <!-- <th style="text-transform: capitalize;"  width="5%">Dept</th>-->
                                                                <th style="text-transform: capitalize;"
                                                                    width="10%">Relieve</th>
                                                                <th style="text-transform: capitalize;"
                                                                    width="10%">Applied On</th>
                                                                <th style="text-transform: capitalize;"
                                                                    width="10%">Type</th>
                                                                <th style="text-transform: capitalize;"
                                                                    width="10%">Date</th>
                                                                <th style="text-transform: capitalize;white-space: nowrap;"
                                                                    width="5%">Days</th>
                                                                <th style="text-transform: capitalize;"
                                                                    width="9%">Reason</th>
                                                                <th style="text-transform: capitalize;"
                                                                    width="20%">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>
                            </div>

                            <div class="col-xl-12 col-md-12 col-12">
                                <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

                                                            $color = '#82868b';
                                                            $sts = 'pending';

                                                        @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 }}:pending'"></td>
                                                        </tr>
                                                    @endforeach
                                                </tbody>
                                            </table>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <!--<div class="col-xl-12 col-md-12 col-12">
                            <div class="card card-revenue-budget">
                                <div class="row mx-0">
                                    <div class="col-md-12 col-12 revenue-report-wrapper">
                                            <div class="col-md-12 col-12 revenue-report-wrapper float right">
                                                <form id="filter-form ">
                                                    <div class="row">
                                                        <div class = "col-md-10">
                                                            <h4 class="card-title">My Summary</h4>
                                                        </div>
                                                        <div class = "col-md-2">
                                                    
                                                            @csrf
                                                            <select class="form-control" id="year-select"  name="year">
                                                            <option value="2019" {{ request()->get('year') && request()->get('year') == '2019' ? 'selected' : '' }}>2019</option>
                                                            <option value="2020" {{ request()->get('year') && request()->get('year') == '2020' ? 'selected' : '' }}>2020</option>
                                                            <option value="2021" {{ request()->get('year') && request()->get('year') == '2021' ? 'selected' : 'selected' }}>2021</option>
                                                            </select>
                                                        </div>
                                                    </div>
                                                </form>
                                            </div>
                                            <div class="d-sm-flex justify-content-between align-items-center mb-3">
    
                                                <table class="table-responsive"  id="attendance-table">
                                                    <thead>
                                                    <tr>
                                                        <th style="text-align: center;font-size: 18px; color: white;"></th>
                                                        @for ($i = 1; $i < 32; $i++)
<th style="width:40px;">{{ $i }}</th>
@endfor
                                                    </tr>
                                                    </thead>
                                                    <tbody>
                                                    <tr style="line-height:30px;">
                                                        <td>Jan</td>
                                                        @foreach ($arrayOne as $janKey => $january)
<td style="background-color:{{ $january }};border-radius: 10px;"></td>
@endforeach
                                                    </tr>
                                                    <tr style="line-height:30px;">
                                                        <td>Feb</td>
                                                        @foreach ($arrayTwo as $febKey => $february)
<td style="background-color:{{ $february }};border-radius: 10px;"></td>
@endforeach
                                                    </tr>
                                                    <tr style="line-height:30px;">
                                                        <td>Mar</td>
                                                        @foreach ($arrayThree as $marKey => $march)
<td style="background-color:{{ $march }};border-radius: 10px;"></td>
@endforeach
                                                    </tr>
                                                    <tr style="line-height:30px;">
                                                        <td>Apr</td>
                                                        @foreach ($arrayFour as $aprKey => $april)
<td style="background-color:{{ $april }};border-radius: 10px;"></td>
@endforeach
                                                    </tr>
                                                    <tr style="line-height:30px;">
                                                        <td>May</td>
                                                        @foreach ($arrayFive as $mayKey => $may)
<td style="background-color:{{ $may }};border-radius: 10px;"></td>
@endforeach
                                                    </tr>
                                                    <tr style="line-height:30px;">
                                                        <td>Jun</td>
                                                        @foreach ($arraySix as $junKey => $june)
<td style="background-color:{{ $june }};border-radius: 10px;"></td>
@endforeach
                                                    </tr>
                                                    <tr style="line-height:30px;">
                                                        <td>Jul</td>
                                                        @foreach ($arraySeven as $julKey => $july)
<td style="background-color:{{ $july }};border-radius: 10px;"></td>
@endforeach
                                                    </tr>
                                                    <tr style="line-height:30px;">
                                                        <td>Aug</td>
                                                        @foreach ($arrayEight as $augKey => $august)
<td style="background-color:{{ $august }};border-radius: 10px;"></td>
@endforeach
                                                    </tr>
                                                    <tr style="line-height:30px;">
                                                        <td>Sep</td>
                                                        @foreach ($arrayNine as $sepKey => $september)
<td style="background-color:{{ $september }};border-radius: 10px;"></td>
@endforeach
                                                    </tr>
                                                    <tr style="line-height:30px;">
                                                        <td>Oct</td>
                                                        @foreach ($arrayTen as $octKey => $october)
<td style="background-color:{{ $october }};border-radius: 10px;"></td>
@endforeach
                                                    </tr>
                                                    <tr style="line-height:30px;">
                                                        <td>Nov</td>
                                                        @foreach ($arrayEleven as $novKey => $november)
<td style="background-color:{{ $november }};border-radius: 10px;"></td>
@endforeach
                                                    </tr>
                                                    <tr style="line-height:30px;">
                                                        <td>Dec</td>
                                                        @foreach ($arrayTweal as $decKey => $december)
<td style="background-color:{{ $december }};border-radius: 10px;"></td>
@endforeach
                                                    </tr>
                                                    </tbody>
                                                </table>
    
                                            </div>
                                        <table>
                                            <tfoot>
                                                <tr>
                                                    <div class="row">
                                                        <div class = "col-md-2">
                                                    <td style="background-color:;border-radius: 10px;width:30px;"><td>

                                                    <div class = "col-md-2">
                                                    <td colspan="4">Public Holidays<td>

                                                     <td style="background-color:#FDD778;border-radius: 10px;width:30px;"><td>
                                                        <div class = "col-md-2">
                                                    <td colspan="4">Rest Day<td>
                                                    <td style="background-color:#F1F3F5;border-radius: 10px;width:30px;"><td>
                                                        <div class = "col-md-2">
                                                    <td colspan="4">Off-Day<td>
                                                    <td style="background-color:#000000;border-radius: 10px;width:30px;"><td>
                                                        <div class = "col-md-2">
                                                    <td colspan="4">Approved<td>
                                                    <td style="background-color:#1EBC61;border-radius: 10px;width:30px;"><td>
                                                        <div class = "col-md-2">
                                                    <td colspan="4">Pending<td>
                                                    <td style="background-color:#F8981F;border-radius: 10px;width:30px;"><td>
                                                        <div class = "col-md-2">
                                                    <td colspan="4">MC<td>
                                                    <td style="background-color:#D84637;border-radius: 10px;width:30px;"><td>
                                                        <div class = "col-md-2">
                                                    <td colspan="4">Other<td>
                                                        <td style="background-color: #0096FF;border-radius: 10px;width:30px;"><td>
                                                <tr>
                                            </tfoot>
                                        </table>
                                    </div>
                                </div>
                            </div>
                        </div>-->
                </section>
            </div>

        </div>

        <!-- Dashboard Ecommerce ends -->
        <div class="modal fade" id="exampleModal1" tabindex="-1" role="dialog"
            aria-labelledby="exampleModalLabel1" 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">
                        <input type="hidden" id="leave_id_for_approve" value="">
                        <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="rejectModal1" tabindex="-1" role="dialog" aria-labelledby="rejectModalLabel1"
            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" id="leave_id_for_reject" value="">
                        <lable>Please enter reject Reason</lable>
                        <input type="text" name="reject_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="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">
                        <input type="hidden" id="leave_id_for_approve" value="">
                        <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 approve-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" id="leave_id_for_reject" value="">
                        <lable>Please enter reject Reason</lable>
                        <input type="text" name="reject_reason" id="rejectReason" class="form-control">
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-danger reject-ok-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">
                        <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 type="text/javascript">
    $('.yes-btn').attr('disabled', false);
    $('.reject-btn').attr('disabled', false);
    $('.approve-yes-btn').attr('disabled', false);
    $('.reject-ok-btn').attr('disabled', false);
    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";
        }
    }
    $(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).ready(function() {

        $("#leavetype").change(function() {
            data = $("#leavetype").val();
            var url = '{{ route('approval-dashboard') }}';
            $.ajax({
                url: url,
                type: 'get',
                data: {
                    'type': data
                },
                success: function(res) {
                    tableD = res.data.split("|||");
                    $(".leave_table").find('tbody').remove();
                    $(".leave_table").find('thead').after(tableD[0]);
                },


                error: function(w) {}

            });

        });

    });


    $(document).ready(function() {

        $("#sta").change(function() {
            status = $("#sta").val();
            var url = '{{ route('approval-dashboard') }}';
            $.ajax({
                url: url,
                type: 'get',
                data: {
                    'status': status
                },
                success: function(res) {
                    tableD = res.data.split("|||");
                    $(".leave_table").find('tbody').remove();
                    $(".leave_table").find('thead').after(tableD[0]);
                },


                error: function(w) {}

            });

        });

    });


    $(document).on('click', '.approved-btn', function() {
        data = $(this).closest("tr").find('.id').val();
        $('#leave_id_for_approve').val(data);
        // alert(data);

    });

    $(document).on('click', '.approve-yes-btn', function() {
        $('.approve-yes-btn').attr('disabled', true);
        var data = $('#leave_id_for_approve').val();
        //alert(data);
        var url = '{{ route('leave-approve') }}';
        $.ajax({
            url: url,
            type: 'POST',
            data: {
                '_token': '<br />
<b>Fatal error</b>:  Uncaught Error: Call to undefined function csrf_token() in /home/ecoleave/public_html/backup/v6/resources/views/approvals/dashboard.blade.php:1129
Stack trace:
#0 {main}
  thrown in <b>/home/ecoleave/public_html/backup/v6/resources/views/approvals/dashboard.blade.php</b> on line <b>1129</b><br />