@extends('layouts.main')
@section('title')
  Pengajuan Cuti |
@endsection
@section('css')
  <style>

  </style>
@endsection
@section('content')
  <h1 class="df-title mg-b-10">Surat Cuti</h1>
  <ol class="breadcrumb df-breadcrumbs">
    <li class="breadcrumb-item">Dashboard</li>
    <li class="breadcrumb-item active" aria-current="page">Surat Cuti</li>
  </ol>
  <div class="card card-table mg-t-50">
    <div class="card-header">
      <form>
        <div class="row">
          <div class="col-md-2">
            <select class="select2" style="width:100%" name="tahun" onchange="javascript:submit()">
              <option value="all" {{ ($tahun == 'all' ? 'selected' : null ) }} >Semua Tahun</option>
              @for ($y=date('Y'); $y > 2020; $y--)
              <option value="{{$y}}" {{ ($tahun == $y ? 'selected' : null ) }} >{{$y}}</option>
              @endfor
            </select>
          </div>
          <div class="col-md-3">
            <select class="select2" style="width:100%" name="jenis" onchange="javascript:submit()">
              <option value="all" {{ ($jenis == 'all' ? 'selected' : null ) }} >Semua Jenis Cuti</option>
              @foreach ($data['jenis_cuti'] as $key => $value)
              <option value="{{$value->id}}" {{ ($jenis == $value->id ? 'selected' : null ) }} >{{$value->jenis_cuti}}</option>
              @endforeach
            </select>
          </div>
        </div>
      </form>
    </div>
    <div class="card-body">
      <table class="table table-vertical-middle">
        <thead>
          <tr>
            <th width="50px">No</th>
            <th width="300px">Nama Pegawai</th>
            <th class="center">Jenis dan Tanggal Cuti</th>
            {{-- <th class="center">Durasi</th> --}}
            <th class="center">No. Surat Cuti</th>
            <th></th>
          </tr>
        </thead>
        <tbody>
          @foreach ($data['pengajuan'] as $key => $value)
            <tr>
              <td>{{ $data['pengajuan']->firstItem() + $key }}</td>
              <td>
                <div class="aside-loggedin mg-b-0">
                  <div class="media">
                    <div class="media-object wd-60 ht-60 mg-r-10 avatar">
                      <img src="{{(!empty($value->avatar) ? $value->avatar : asset('assets/images/user-avatar-placeholder.png') )}}" alt="" class="avatar-sm rounded-circle">
                    </div>
                    <div class="media-body align-self-center">
                      <h6 class="text-truncated-1">{{$value->nama_lengkap}}</h6>
                      <p class="text-muted mb-0">NIP.{{$value->nip}}</p>
                    </div>
                  </div>
                </div>
              </td>
              <td class="center" style="white-space:nowrap">
                {{$value->jenis_cuti}}
                <hr style="margin-top: 0.3rem;margin-bottom: 0.3rem;">
                {!!$value->tanggal_cuti!!}
              </td>
              <td class="center">{!! (!empty($value->no_surat_cuti) ? $value->no_surat_cuti : '<span style="color:#b00000" >Surat Cuti Belum Terbit</span>' ) !!}</td>
              <td style="width:1px;white-space:nowrap;">
                <a href="{{ route('detail_pengajuan',['page'=>'penerbitan_surat','id'=>$value->id]) }}" class="button dark ripple-effect ico">
                  <i data-feather="search" class="tx-white-8 wd-20 ht-20 "></i>
                </a>
              </td>
            </tr>
          @endforeach
        </tbody>
      </table>
    </div>
    <div class="card-footer">
      {{ $data['pengajuan']->links('include.pagination', ['pagination' => $data['pengajuan']] ) }}
    </div>
  </div>
@endsection
@section('js')
  <script>

  </script>
@endsection