@extends('user.master')
@section('content')

@php
if (is_null($user))
{
  $totalHakCuti = 12;
  $sisaHakCuti = 12;
} else {
  $totalHakCuti = $user->n + $user->n2 + $user->n1;
  $sisaHakCuti = $totalHakCuti - $user->cuti_tahunan;
}
@endphp
<!-- Content Header (Page header) -->
  <section class="content-header">
    <h1>
      Ringkasan Cuti <strong>{{date('Y')}}</strong>
    </h1>
  </section>

  <!-- Main content -->
  <section class="content">

  	<div class="row">

      <div class="col-lg-6 col-xs-12">
        <div class="small-box bg-aqua">
          <div class="inner">
            <h3>{{$totalHakCuti}} Hari</h3>
            <p>HAK CUTI TAHUNAN</p>
          </div>
        </div>
      </div>

      <div class="col-lg-6 col-xs-12">
        <div class="small-box bg-red">
          <div class="inner">
            <h3>{{$sisaHakCuti}} Hari</h3>
            <p>SISA CUTI TAHUNAN</p>
          </div>
        </div>
      </div>
  	</div>
    
    @if (! is_null($user) )
    <div class="row">
      <div class="col-lg-2 col-xs-12">
        <div class="small-box bg-yellow">
          <div class="inner">
            <h4 class="dash-h4"><strong>{{$user->cuti_tahunan}} Hari</strong></h4>
            <p title="CUTI TAHUNAN" class="dash-p">CUTI TAHUNAN</p>
          </div>
        </div>
      </div>

      <div class="col-lg-2 col-xs-12">
        <div class="small-box bg-yellow">
          <div class="inner">
            <h4 class="dash-h4"><strong>{{$user->cuti_besar}} Hari</strong></h4>
            <p title="CUTI BESAR" class="dash-p">CUTI BESAR</p>
          </div>
        </div>
      </div>

      <div class="col-lg-2 col-xs-12">
        <div class="small-box bg-yellow">
          <div class="inner">
            <h4 class="dash-h4"><strong>{{$user->cuti_sakit}} Hari</strong></h4>
            <p title="CUTI SAKIT" class="dash-p">CUTI SAKIT</p>
          </div>
        </div>
      </div>

      <div class="col-lg-2 col-xs-12">
        <div class="small-box bg-yellow">
          <div class="inner">
            <h4 class="dash-h4"><strong>{{$user->cuti_melahirkan}} Hari</strong></h4>
            <p title="CUTI MELAHIRKAN" class="dash-p">CUTI MELAHIRKAN</p>
          </div>
        </div>
      </div>

      <div class="col-lg-2 col-xs-12">
        <div class="small-box bg-yellow">
          <div class="inner">
            <h4 class="dash-h4"><strong>{{$user->cuti_karena_alasan_penting}} Hari</strong></h4>
            <p title="CUTI KARENA ALASAN PENTING" class="dash-p">CUTI KARENA ALASAN PENTING</p>
          </div>
        </div>
      </div>

      <div class="col-lg-2 col-xs-12">
        <div class="small-box bg-yellow">
          <div class="inner">
            <h4 class="dash-h4"><strong>{{$user->cuti_diluar_tanggungan_negara}} Hari</strong></h4>
            <p title="CUTI DILUAR TANGGUNGAN NEGARA" class="dash-p">CUTI DILUAR TANGGUNGAN NEGARA</p>
          </div>
        </div>
      </div>
      @else
      <div class="row">
      <div class="col-lg-2 col-xs-12">
        <div class="small-box bg-yellow">
          <div class="inner">
            <h4 class="dash-h4"><strong>0 Hari</strong></h4>
            <p title="CUTI TAHUNAN" class="dash-p">CUTI TAHUNAN</p>
          </div>
        </div>
      </div>

      <div class="col-lg-2 col-xs-12">
        <div class="small-box bg-yellow">
          <div class="inner">
            <h4 class="dash-h4"><strong>0 Hari</strong></h4>
            <p title="CUTI BESAR" class="dash-p">CUTI BESAR</p>
          </div>
        </div>
      </div>

      <div class="col-lg-2 col-xs-12">
        <div class="small-box bg-yellow">
          <div class="inner">
            <h4 class="dash-h4"><strong>0 Hari</strong></h4>
            <p title="CUTI SAKIT" class="dash-p">CUTI SAKIT</p>
          </div>
        </div>
      </div>

      <div class="col-lg-2 col-xs-12">
        <div class="small-box bg-yellow">
          <div class="inner">
            <h4 class="dash-h4"><strong>0 Hari</strong></h4>
            <p title="CUTI MELAHIRKAN" class="dash-p">CUTI MELAHIRKAN</p>
          </div>
        </div>
      </div>

      <div class="col-lg-2 col-xs-12">
        <div class="small-box bg-yellow">
          <div class="inner">
            <h4 class="dash-h4"><strong>0 Hari</strong></h4>
            <p title="CUTI KARENA ALASAN PENTING" class="dash-p">CUTI KARENA ALASAN PENTING</p>
          </div>
        </div>
      </div>

      <div class="col-lg-2 col-xs-12">
        <div class="small-box bg-yellow">
          <div class="inner">
            <h4 class="dash-h4"><strong>0 Hari</strong></h4>
            <p title="CUTI DILUAR TANGGUNGAN NEGARA" class="dash-p">CUTI DILUAR TANGGUNGAN NEGARA</p>
          </div>
        </div>
      </div>
      @endif
    </div>
	 
   @if ($listcutiatasan->count() > 0)
   <div class="row">
      <div class="col-md-12">
        <div class="box box-primary">
          <div class="box-header with-border">
        <h3 class="box-title">Pengajuan Cuti Bawahan</h3>
      </div>
          <div class="box-body no-padding">
            <table class="table table-bordered table-striped">
                  <thead>
                    <tr>
                      <th style="width: 100px">TGL SURAT</th>
                      <th>PEGAWAI</th>
                      <th style="width: 200px">JENIS CUTI</th>
                      <th style="width: 120px">MULAI TGL</th>
                      <th style="width: 120px">SAMPAI TGL</th>
                    </tr>
                  </thead>
                  <tbody>
                    @foreach($listcutiatasan as $row)
                    <tr>
                      <td>{{date('d M Y', strtotime($row->tanggal_surat))}}</td>
                      <td>{{$row->pegawai_nip}} <br> {{$row->pegawai_nama}} <br>{{$row->pegawai_jabatan}}</td>
                      <td>
                        @switch($row->jenis)
                          @case(1)
                              Cuti Tahunan
                              @break
                          @case(2)
                              Cuti Besar
                              @break
                          @case(3)
                              Cuti Sakit
                              @break
                          @case(4)
                              Cuti Melahirkan
                              @break
                          @case(5)
                              Cuti Karena Alasan Penting
                              @break
                          @case(6)
                              Cuti di Luar Tanggungan Negara
                              @break
                          @default
                              
                        @endswitch
                      </td>
                      <td>{{date('d M Y', strtotime($row->tgl_dari))}}</td>
                      <td>{{date('d M Y', strtotime($row->tgl_sampai))}}</td>
                    </tr>
                    @endforeach
                  </tbody>
                </table>

          </div>
        </div>
      </div>
    </div>
    @endif

    <div class="row">
    	<div class="col-md-6">
        <strong>LIHAT BULAN LAIN</strong>
        <div class="form-group" style="margin-bottom: 5px;">
          <input type="text" class="form-control input-sm" name="tanggal_surat" id="tanggal_surat" value="{{date('F Y', strtotime($blnTahun))}}" style="width: 150px;">
        </div>
      </div>
      <div class="col-md-6 text-right">
        <strong>KETERANGAN</strong>
        <p style="margin-top: 5px;">
          <span class="label label-warning">Cuti Masih Proses</span>
          <span class="label label-success">Cuti Diterima</span>
        </p>
    	</div>
    </div>

    <div class="row">
      <div class="col-md-12">
        <div class="box box-primary">
          <div class="box-body no-padding">
            <!-- THE CALENDAR -->
            <div id="calendar"></div>
          </div>
        </div>
      </div>
    </div>
  </section>
@endsection

@push('css')
  <!-- fullCalendar -->
  <link rel="stylesheet" href="{{asset('asset/bower_components/fullcalendar/dist/fullcalendar.min.css')}}">
  <link rel="stylesheet" href="{{asset('asset/bower_components/fullcalendar/dist/fullcalendar.print.min.css')}}" media="print">
  <link rel="stylesheet" href="{{asset('asset/bower_components/select2/dist/css/select2.min.css')}}">

  <style type="text/css">
    .dash-h4 {
    margin-top: 0px;margin-bottom: 5px;
    }
    .dash-p {
      margin-bottom: 0px;
          white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      display: inline-block;
      max-width: 100%;
    }
  </style>
@endpush

@push('js')
  <!-- fullCalendar -->
  <script src="{{asset('asset/bower_components/moment/moment.js')}}"></script>
  <script src="{{asset('asset/bower_components/fullcalendar/dist/fullcalendar.min.js')}}"></script>
  <script src="{{asset('asset/bower_components/select2/dist/js/select2.min.js')}}"></script>

  <!-- Page specific script -->
  <script>
  $(document).ready(function() {
    $('#tanggal_surat').datepicker({
        format: "MM yyyy",
        startView: 1,
        orientation: "bottom",
        minViewMode: 1,
            todayHiglight: true,
            autoclose: true
      })
       .on('changeMonth', function(e) {
          //console.log(e.date);
          window.location.replace("{{route('user.dashboard.index')}}?bln="+e.date.getMonth()+"&thn="+e.date.getFullYear());
      });
    });
    $(function () {

      /* initialize the calendar
       -----------------------------------------------------------------*/
      //Date for the calendar events (dummy data)
      var date = new Date()
      var d    = date.getDate(),
          m    = date.getMonth(),
          y    = date.getFullYear()
      $('#calendar').fullCalendar({
      	//eventStartEditable: false,
        displayEventTime: false,
        header    : {
          left  : '',
          center: 'title',
          right : ''
        },
        titleFormat: '[{{date('F Y', strtotime($blnTahun))}}]',
        buttonText: {
          today: 'Hari Ini',
          month: 'Bulan',
          week : 'Minggu',
          day  : 'Hari'
        },
        //Random default events
        events    : [
          @foreach($cuti as $c)
          {
              title : '{{ $c->pegawai_nama }} NIP:{{ $c->pegawai_nip }}',
              start : '{{ $c->tgl_dari }}',
              end : '{{date('Y-m-d', strtotime('+1 day', strtotime( $c->tgl_sampai)))}}',
              @if($c->pejabat_status == 0)
              backgroundColor: '#f39c12', //kuning
              borderColor    : '#f39c12' //kuning
              @else
              backgroundColor: '#00a65a', //hijau
              borderColor    : '#00a65a' //hijau
              @endif
          },
          @endforeach
        ]

      });

      $('#calendar').fullCalendar( 'gotoDate', "{{date('Y-m-d', strtotime($blnTahun))}}" )

      $('.fc-prev-button').click(function(){
        window.location.replace('{{route('user.cuti.index')}}');
      });

      $('.fc-next-button').click(function(e){
         alert('nextis clicked, do something');
      });

      $('.fc-today-button').click(function(e){
         window.location.replace('{{route('user.dashboard.index')}}');
      });

    })
  </script>

@endpush