@extends('layouts.app')
@section('content')
<!--begin::Content-->

<div class="modal fade" tabindex="-1" id="create">
  <div class="modal-dialog">
    <div class="modal-content">
      <form method="GET" 
          action="{{route('pn.laporan.range_harian.create')}}" 
          accept-charset="UTF-8" role="form" autocomplete="off">

          <input type="hidden" name="tanggal_awal" id="tanggal_awal" value="{{date('Y-m-d')}}">
          <input type="hidden" name="tanggal_akhir" id="tanggal_akhir" value="{{date('Y-m-d')}}">

        <div class="modal-header">
            <h5 class="modal-title">Buat Laporan Harian Baru</h5>
            <!--begin::Close-->
            <div class="btn btn-icon btn-sm btn-active-light-primary ms-2" data-bs-dismiss="modal" aria-label="Close">
                <span class="svg-icon svg-icon-2x"></span>
            </div>
            <!--end::Close-->
        </div>
  
        <div class="modal-body">
            <div class="row mb-4">
                <div class="col-12">
                      <div class="mb-0">
                        <label class="form-label">Pilih Range Tanggal</label>
                        <input class="form-control form-control-solid" placeholder="Pick date range" id="kt_daterangepicker_1"/>
                    </div>
                  </div>
            </div>
        </div>
  
        <div class="modal-footer d-flex justify-content-between">
          <button type="button" class="btn btn-light" data-bs-dismiss="modal">Batal</button>
          <button type="submit" class="btn btn-primary">Buat Laporan</button>
        </div>
      </form>
    </div>  
  </div>
</div>

<div class="modal fade" tabindex="-1" id="ubah_status">
  <div class="modal-dialog" id="ubah_status-app">
  </div>
</div>

<div class="modal fade" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" id="sahkan">
  <div class="modal-dialog modal-lg" id="sahkan-app">
  </div>
</div>

<div class="modal fade" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" id="diketahui">
  <div class="modal-dialog modal-lg" id="diketahui-app">
  </div>
</div>

<div class="content d-flex flex-column flex-column-fluid" id="kt_content">
  <!--begin::Post-->
  <div class="post d-flex flex-column-fluid" id="kt_post">
    <!--begin::Container-->
    <div id="kt_content_container" class="container-xxl">
      <!--begin::Row-->
      <div class="row g-5 g-xl-8">
        <div class="col-xl-12">
          <!--begin::List Widget 3-->
          <div class="card card-xl-stretch mb-xl-8">
            <!--begin::Header-->
            <div class="card-header py-5">
              <h3 class="card-title align-items-start flex-column">
                
                <span class="card-label fw-bolder fs-3 mb-1">Laporan Range Harian</span>
                <span class="text-muted mt-1 fw-bold fs-7">Laporan Pelaksanaan Range Harian</span>
                
              </h3>
              <div>
                <button type="button" class="btn btn-success fw-bolder me-2" data-bs-toggle="modal" data-bs-target="#create"><i class="fas fa-plus"></i>Laporan Baru</button>
              </div>
            </div>
            <!--end::Header-->

            <div class="card-header border-0 py-5">
              <form autocomplete="off">
                <div class="d-md-flex justify-content-md-start" data-kt-customer-table-toolbar="base">
                  <div class="me-md-3">
                    <label class="col-form-label">Pilih : </label>
                  </div>
                  <div class="me-md-3 mb-3 mb-md-0">
                    <select class="form-select" name="status_data">
                      <option value="SEMUA" {{$status_data=='SEMUA' ? 'selected' :''}}>SEMUA</option>
                        <option value="AKTIF" {{$status_data=='AKTIF' ? 'selected' :''}}>AKTIF</option>
                        <option value="NONAKTIF" {{$status_data=='NONAKTIF' ? 'selected' :''}}>NONAKTIF</option>
                    </select>
                  </div>
                  <div class="d-flex me-md-3 mb-3 mb-md-0">
                    <button type="submit" class="btn btn-primary fw-bolder me-2"><i class="fas fa-search"></i>Lihat
                      Data</button>
                  </div>
                </div>
              </form>
            </div>

            <!--begin::Body-->
            <div class="card-body">
              <div
                class="alert bg-light-info border border-info border border-dashed d-flex flex-column flex-sm-row w-100 p-5 mb-10">
                <!--begin::Content-->
                <div class="d-flex">
                  <div class="d-flex flex-column pe-0 pe-sm-10">
                    <span class="text-muted fs-7 fw-bold">Satker</span>
                    <h5 class="mb-1">{{auth()->user()->satker->nama}}</h5>
                  </div>
                  <div class="d-flex flex-column pe-0 pe-sm-10">
                    <span class="text-muted fs-7 fw-bold">Status Data</span>
                    <h5 class="mb-1">{{$status_data}}</h5>
                  </div>
                </div>
                <!--end::Content-->
              </div>
              <div class="table-responsive">
                <table class="table table-row-dashed table-row-gray-300 gy-5 gs-7">
                  <thead>
                    <tr class="fw-bolder text-gray-800 border-bottom border-gray-200 bg-light">
                      <th style="min-width: 150px; width: 150px;">Range</th>
                      <th class="min-w-50px w-50px">Status</th>
                      <th class="min-w-100px w-100px">Dibuat</th>
                      <th class="min-w-100px w-100px">Disahkan</th>
                      <th class="min-w-100px w-100px">Diketahui</th>
                      <th class="min-w-50px w-50px">Berkas</th>
                      <th class="min-w-50px w-50px">Ubah</th>
                    </tr>
                  </thead>
                  <tbody id="table_body">
                    
                    @foreach ($laporan as $row_laporan)
                    
                    @php
                        $tanggal_awal = \Carbon\Carbon::createFromFormat('Y-m-d',$row_laporan->tanggal_awal)->isoFormat('DD MMMM YYYY');
                        $tanggal_akhir = \Carbon\Carbon::createFromFormat('Y-m-d',$row_laporan->tanggal_akhir)->isoFormat('DD MMMM YYYY');
                    @endphp

                    <tr id="tr{{$row_laporan->id}}">
                      @if($tanggal_awal == $tanggal_akhir)
                        <td>{{$tanggal_awal}}</td>
                      @else
                        <td>{{$tanggal_awal}}<br>s/d<br>{{$tanggal_akhir}}</td>
                      @endif
                      
                      <td id="status{{$row_laporan->id}}">{{$row_laporan->status_data}}</td>
                      
                      @php
                        $dibuat_tanggal = \Carbon\Carbon::createFromFormat('Y-m-d H:i:s',$row_laporan->dibuat_tanggal)->isoFormat('DD MMMM YYYY HH:mm:ss');
                      @endphp
                      <td class="ubah{{$row_laporan->id}} fs-8">
                        {{$row_laporan->dibuat_nama}}<br>{{$row_laporan->dibuat_nip}}<br>{{$row_laporan->dibuat_jabatan}}<br>{{$dibuat_tanggal}}
                      </td>

                      <td class="ubah{{$row_laporan->id}} fs-8">
                        @if ($row_laporan->disahkan_validasi == 'BELUM')
                          @if(auth()->user()->isPaniteraPN())
                              <button type="button" class="btn btn-sm btn-success btnsahkan" data-id="{{$row_laporan->id}}" id="sahkan{{$row_laporan->id}}"><i class="fas fa-qrcode"></i> Sign</button>
                          @else
                          <i>Belum disahkan</i>
                          @endif
                        @else
                        @php
                        $disahkan_tanggal = \Carbon\Carbon::createFromFormat('Y-m-d H:i:s',$row_laporan->disahkan_tanggal)->isoFormat('DD MMMM YYYY HH:mm:ss');
                      @endphp
                          {{$row_laporan->disahkan_nama}}<br>{{$row_laporan->disahkan_nip}}<br>{{$row_laporan->disahkan_jabatan}}<br>{{$disahkan_tanggal}}
                        @endif
                      </td>

                      <td class="ubah{{$row_laporan->id}} fs-8">
                        @if ($row_laporan->diketahui_validasi == 'BELUM')
                          @if(auth()->user()->isPimpinanPN())
                            @if ($row_laporan->disahkan_validasi == 'BELUM')
                              <i>Menunggu Disahkan</i>
                            @else
                              <button type="button" class="btn btn-sm btn-success btndiketahui" data-id="{{$row_laporan->id}}" id="diketahui{{$row_laporan->id}}"><i class="fas fa-qrcode"></i> Sign</button>
                            @endif   
                          @else
                          <i>Belum diketahui</i>
                          @endif
                        @else
                        @php
                        $diketahui_tanggal = \Carbon\Carbon::createFromFormat('Y-m-d H:i:s',$row_laporan->diketahui_tanggal)->isoFormat('DD MMMM YYYY HH:mm:ss');
                      @endphp
                          {{$row_laporan->diketahui_nama}}<br>{{$row_laporan->diketahui_nip}}<br>{{$row_laporan->diketahui_jabatan}}<br>{{$diketahui_tanggal}}
                        @endif
                      </td>

                      <td class="ubah{{$row_laporan->id}}">
                        <div class="d-grid">
                          <a type="button"
                            href="{{route('pn.laporan.range_harian.pdf.show',['id' => Crypt::encryptString($row_laporan->id) ]) }}"
                            class="btn btn-sm btn-primary" target="_blank">PDF</a>
                        </div>
                      </td>

                      <td class="ubah{{$row_laporan->id}}">  
                        <button type="button" class="btn btn-sm btn-danger btnubah_status" data-id="{{$row_laporan->id}}"><span class="bi bi-pencil-square"></span></button>
                      </td>
                    </tr>
                    
                    @endforeach
                  </tbody>
                </table>
              </div>
            </div>
            <!--end::Body-->
          </div>
          <!--end:List Widget 3-->
        </div>
      </div>
      <!--end::Row-->
    </div>
    <!--end::Container-->
  </div>
  <!--end::Post-->
</div>
<!--end::Content-->
@endsection


@section('js')

<script>

    function sahkan(url, dataid){
        axios.get(url, {
            params: {
                'data_id': dataid,
            }
        }).then(function (response){
            $('#sahkan-app').html(response.data);
            $("#sahkan").modal('show');
        });
    };

    function ubah_status(url, dataid){
        axios.get(url, {
            params: {
                'data_id': dataid,
            }
        }).then(function (response){
            $('#ubah_status-app').html(response.data);
            $("#ubah_status").modal('show');
        });
    };

    function diketahui(url, dataid){
        axios.get(url, {
            params: {
                'data_id': dataid,
            }
        }).then(function (response){
            $('#diketahui-app').html(response.data);
            $("#diketahui").modal('show');
        });
    };


  $('#kt_daterangepicker_1').daterangepicker({
            locale: {format: 'DD/MM/YYYY'},
            "autoApply": true,
        }, function(start, end, label) {
      //console.log("A new date selection was made: " + start.format('YYYY-MM-DD') + ' to ' + end.format('YYYY-MM-DD'));
      
      $('#tanggal_awal').val(start.format('YYYY-MM-DD'));
      $('#tanggal_akhir').val(end.format('YYYY-MM-DD'));
      
        });

    $('#sahkan').on('hidden.bs.modal', function () {
        $('#sahkan-app').empty();
    });

    $('#ubah_status').on('hidden.bs.modal', function () {
        $('#ubah_status-app').empty();
    });

    $(document).ready(function(){
        
        $('#table_body').on('click','.btnubah_status',function(e){
          btn = $(this);
          ubah_status('{{ route("pn.laporan.range_harian.ubah_status.create") }}', btn.data('id'));
        });

        @if(auth()->user()->isPaniteraPN())
          $('#table_body').on('click','.btnsahkan',function(e){
            btn = $(this);
            sahkan('{{ route("pn.laporan.range_harian.sahkan.create") }}', btn.data('id'));
          });
        @endif

        @if(auth()->user()->isPimpinanPN())
          $('#table_body').on('click','.btndiketahui',function(e){
            btn = $(this);
            diketahui('{{ route("pn.laporan.range_harian.diketahui.create") }}', btn.data('id'));
          });
        @endif
    });


</script>

@stop