@extends('payroll.employee_frontend.layouts.employee')
@section('content')
<section>
  <div class="col-12 mt-4">
    <h2 class="page-title text-center">Leave History</h2>
    <div class="mb-2 heading-border"></div>
  </div>
</section>
<section class="px-3  pt-3 pt-lg-5 row">

  <div class="col-12 mb-4">
    <div class="blu-card d-flex flex-wrap">
      <div class="col-12 col-md-6">
        <h5 class="mb-3 card-in-h">
          <i class="fa fa-calendar mr-2 text-primary" aria-hidden="true"></i>
          Leave History
        </h5>
      </div>
      <div class="col-12 col-md-6 text-left text-md-right">
        <a class="btn btn-success" href="{{route('employee.leave.create')}}" >Create new leave</a>
      </div>
      <div class="col-12 table-responsive">
        <table class="table table-bordered table-hover">
          <thead class="thead-blu">
            <tr>
              <th>Type</th>
              <th>Start date</th>
              <th>End date</th>
              <th>Total Days</th>
              <th>Reason</th>
              <th>Status</th>
            </tr>
          </thead>
          <tbody>
            @foreach ($leave_history as $lh)
            <tr class="att-status-row">

              <td>{{$lh->LeaveType->name}}</td>
              <td>{{$lh->start_date}}</td>
              <td>{{$lh->end_date}}</td>
            <td>{{$lh->leave_count}}</td>
            <td style="white-space: pre-wrap; max-width: 150px;">{{$lh->leave_reason}}</td>
            <td>
              <span class="

              {{
                $lh->approve_status == 2 ? 'badge badge-success' :
                ($lh->approve_status == 3 ? 'badge badge-danger' :
                ($lh->approve_status == 1 ? 'badge badge-warning' : 'badge badge-primary'

                 ) )}}



               px-2 py-1">

               {{
                $lh->approve_status == 2 ? 'Approved' :
                ($lh->approve_status == 3 ? 'Rejected' :
                ($lh->approve_status == 1 ? 'Pending' : 'unknown'

                 ) )}}

              </span>
            </td>
            </tr>
            @endforeach

          </tbody>
        </table>
      </div>
    </div>
  </div>

</section>


<!-- <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#exampleModal">
Launch demo modal
</button> -->

<!-- Modal -->
{{-- <div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
  <div class="modal-dialog modal-lg" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLabel">Leave form</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        <form class="" action="index.html" method="post">
          <div class="d-flex flex-wrap">
            <div class="form-group col-12 col-md-4">
              <label for="exampleInputEmail1">Leave type</label>
              <input type="email" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="Enter email">
            </div>
            <div class="form-group col-12 col-md-4">
              <label for="exampleInputEmail1">Leave type</label>
              <input type="email" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="Enter email">
            </div>
            <div class="form-group col-12 col-md-4">
              <label for="exampleInputEmail1">Leave type</label>
              <input type="email" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="Enter email">
            </div>
            <div class="form-group col-12 col-md-4">
              <label for="exampleInputEmail1">Leave type</label>
              <input type="email" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="Enter email">
            </div>
            <div class="form-group col-12 col-md-4">
              <label for="exampleInputEmail1">Leave type</label>
              <input type="email" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="Enter email">
            </div>
            <div class="form-group col-12 col-md-4">
              <label for="exampleInputEmail1">Leave type</label>
              <input type="email" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="Enter email">
            </div>
          </div>
        </form>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
        <button type="button" class="btn btn-primary">Submit form</button>
      </div>
    </div>
  </div>
</div> --}}


@endsection