@extends('layouts.app')
@section('content')

@php
    $g_judul = 'REKAPITULASI PELAKSANAAN MEDIASI';
    @endphp

<!--begin::Content-->
<div class="modal fade" tabindex="-1" id="show">
  <div class="modal-dialog modal-xl modal-dialog-scrollable" id="show-app">
  </div>
</div>

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

<div class="modal fade" tabindex="-1" id="create">
  <div class="modal-dialog modal-lg">
    <div class="modal-content">
      <form method="GET" 
          action="{{route('rpm.pt.custom.laporan.create')}}" 
          accept-charset="UTF-8" role="form" autocomplete="off">
        <div class="modal-header">
            <h5 class="modal-title">Buat Laporan 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>
  
        @php
        $bulan =
        ['Januari','Februari','Maret','April','Mei','Juni','Juli','Agustus','September','Oktober','November','Desember'];

        $list_bulan = ['01','02','03','04','05','06','07','08','09','10','11','12'];
        @endphp
        <div class="modal-body">
            <div class="row mb-4">
                <div class="col-5 d-flex align-items-center "><div class="fw-bold">Mulai Bulan/Tahun</div></div>
                <div class="col-7">
                  <div class="row">
                    <div class="col-6">
                      <select class="form-select" name="bulan_awal">
                        @for ($i = 1; $i <= 12; $i++)
                          <option value="{{$list_bulan[$i-1]}}">{{$bulan[$i-1]}}</option>
                        @endfor
                      </select>
                    </div>
                    <div class="col-6">
                      <select class="form-select" name="tahun_awal">
                        @for ($i = $tahunpertama; $i <= $tahunterakhir; $i++)
                          <option value="{{$i}}">{{$i}}</option>
                        @endfor
                      </select>
                    </div>
                  </div>
                </div>
            </div>
            <div class="row mb-4">
                <div class="col-5 d-flex align-items-center"><div class="fw-bold">Hingga Bulan/Tahun</div></div>
                <div class="col-7">
                  <div class="row">
                    <div class="col-6">
                      <select class="form-select" name="bulan_akhir">
                        @for ($i = 1; $i <= 12; $i++)
                          <option value="{{$list_bulan[$i-1]}}">{{$bulan[$i-1]}}</option>
                        @endfor
                      </select>
                    </div>
                    <div class="col-6">
                      <select class="form-select" name="tahun_akhir">
                        @for ($i = $tahunpertama; $i <= $tahunterakhir; $i++)
                          <option value="{{$i}}">{{$i}}</option>
                        @endfor
                      </select>
                    </div>
                  </div>
                </div>
            </div>
            <div class="row mb-4">
                <div class="col-5 d-flex align-items-center"><div class="fw-bold">Judul Laporan</div></div>
                <div class="col-7">
                  <div class="row">
                    <div class="col-12">
                      <input type="text" name="judul" class="form-control" required>
                    </div>
                  </div>
                </div>
            </div>
            <div class="row mb-4">
                <div class="col-5 d-flex align-items-center"><div class="fw-bold">Kolom Keterangan</div></div>
                <div class="col-7">
                  <div class="row">
                    <div class="col-12">
                      <div class="form-check">
                        <input class="form-check-input" type="checkbox" value="1" id="checkKeterangan" name="check_keterangan">
                        <label class="form-check-label" for="checkKeterangan">
                          Tambahkan
                        </label>
                      </div>
                    </div>
                  </div>
                </div>
            </div>
            <div class="row mb-4">
                <div class="col-5 d-flex align-items-center"><div class="fw-bold">Kolom Kendala/Monitoring</div></div>
                <div class="col-7">
                  <div class="row">
                    <div class="col-12">
                      <div class="form-check">
                        <input class="form-check-input" type="checkbox" value="1" id="checkKendala" name="check_kendala_monitoring">
                        <label class="form-check-label" for="checkKendala">
                          Tambahkan
                        </label>
                      </div>
                    </div>
                  </div>
                </div>
            </div>
            <div class="row mb-4">
                <div class="col-5 d-flex align-items-center"><div class="fw-bold">Tanda Tangan Panitera Muda</div></div>
                <div class="col-7">
                  <div class="row">
                    <div class="col-12">
                      <div class="form-check">
                        <input class="form-check-input" type="checkbox" value="1" id="checkpanmud" name="check_panmud">
                        <label class="form-check-label" for="checkpanmud">
                          Ikut Tanda Tangan
                        </label>
                      </div>
                    </div>
                  </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="hapus">
  <div class="modal-dialog" id="hapus-app">
  </div>
</div>

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

<div class="modal fade" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" id="sahkan">
  <div class="modal-dialog modal-xl modal-dialog-scrollable" 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-xl modal-dialog-scrollable" 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">
      @include('layouts.success_error')
      <!--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">{{$g_judul}}</span>
                <span class="text-muted mt-1 fw-bold fs-7">Laporan Custom</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-->


            <!--begin::Body-->
            <div class="card-body">

              <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 class="min-w-150px w-150px">Range</th>
                      <th class="min-w-200px w-200px">Keterangan</th>
                      <th class="min-w-50px w-50px text-center">TTD 1</th>
                      <th class="min-w-50px w-50px text-center">TTD 2</th>
                      <th class="min-w-50px w-50px text-center">TTD 3</th>
                      <th class="min-w-75px w-75px">Berkas</th>
                      <th>Ubah</th>
                    </tr>
                  </thead>
                  <tbody id="table_body">
                    
                    @foreach ($laporan as $row_laporan)
                    
                    @php
                        $bulan_awal = \Carbon\Carbon::createFromFormat('!m',$row_laporan->bulan_awal)->isoFormat('MMMM');
                        $tahun_awal = $row_laporan->tahun_awal;

                        $bulan_akhir = \Carbon\Carbon::createFromFormat('!m',$row_laporan->bulan_akhir)->isoFormat('MMMM');
                        $tahun_akhir = $row_laporan->tahun_akhir;
                    @endphp

                    <tr id="tr{{$row_laporan->id}}">
                      @if($bulan_awal.$tahun_awal == $bulan_akhir.$tahun_akhir)
                        <td>{{$bulan_awal.' '.$tahun_awal}}</td>
                      @else
                        <td>{{$bulan_awal.' '.$tahun_awal}} s/d {{$bulan_akhir.' '.$tahun_akhir}}</td>
                      @endif
                      
                      <td id="judul{{$row_laporan->id}}">
                        <div class="fs-8 fw-bolder d-flex justify-content-between">
                            <div>JUDUL</div>
                            <button type="button" class="btn btn-sm btn-warning btnedit px-2 py-0" data-id="{{$row_laporan->id}}"><span class="bi bi-pencil-square"></span></button>
                        </div>
                        <div class="fs-7"  id="judul_isi{{$row_laporan->id}}">
                          {{$row_laporan->judul}}
                        </div>
                        <div class="fs-8 fw-bolder mt-2 mb-1">KOLOM TAMBAHAN</div>
                        <div class="d-flex gap-1">
                          <span class="badge badge-{{$row_laporan->check_keterangan == 1 ? 'success' : 'danger'}}">Ket</span>
                          <span class="badge badge-{{$row_laporan->check_kendala_monitoring == 1 ? 'success' : 'danger'}}">Ken</span>
                          <span class="badge badge-{{$row_laporan->check_kendala_monitoring == 1 ? 'success' : 'danger'}}">Mon</span>
                        </div>
                        <div class="fs-8 fw-bolder mt-2 mb-1">TANDA TANGAN</div>
                        <div class="d-flex gap-1">
                          <span class="badge badge-{{$row_laporan->check_panmud == 1 ? 'success' : 'danger'}}">Panmud</span>
                        </div>
                      </td>
                      

                      @if($row_laporan->check_panmud == 1)
                      <td class="ubah{{$row_laporan->id}} fs-8 text-center">
                        @if ($row_laporan->dittd_validasi == 'BELUM')
                          @if(auth()->user()->isPanmudPT())
                              <button type="button" class="btn btn-sm btn-success btnttd" data-id="{{$row_laporan->id}}" id="ttd{{$row_laporan->id}}"><i class="fas fa-qrcode"></i> Sign</button>
                          @else
                          <i>Belum</i>
                          @endif
                        @else
                          {{$row_laporan->dittd_nama}}<br>{{$row_laporan->dittd_nip}}<br>{{$row_laporan->dittd_jabatan}}<br>{{$row_laporan->dittd_tanggal}}
                        @endif
                      </td>
                      @else
                      <td class="ubah{{$row_laporan->id}} fs-8 text-center">
                        -
                      </td>
                      @endif

                      <td class="ubah{{$row_laporan->id}} fs-8 text-center">
                        @if ($row_laporan->disahkan_validasi == 'BELUM')
                          @if(auth()->user()->isPaniteraPT())
                            @if ($row_laporan->dittd_validasi == 'BELUM')
                              <i>Belum</i>
                            @else
                              <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>
                            @endif
                          @else
                          <i>Belum</i>
                          @endif
                        @else
                          {{$row_laporan->disahkan_nama}}<br>{{$row_laporan->disahkan_nip}}<br>{{$row_laporan->disahkan_jabatan}}<br>{{$row_laporan->disahkan_tanggal}}
                        @endif
                      </td>

                      <td class="ubah{{$row_laporan->id}} fs-8 text-center">
                        @if ($row_laporan->diketahui_validasi == 'BELUM')
                          @if(auth()->user()->isPimpinanPT())
                            @if ($row_laporan->disahkan_validasi == 'BELUM')
                              <i>Belum</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</i>
                          @endif
                        @else
                          {{$row_laporan->diketahui_nama}}<br>{{$row_laporan->diketahui_nip}}<br>{{$row_laporan->diketahui_jabatan}}<br>{{$row_laporan->diketahui_tanggal}}
                        @endif
                      </td>

                      <td class="ubah{{$row_laporan->id}}">
                        <div class="d-grid">
                          {{-- <a type="button"
                            href="{{route('rpm.pt.custom.laporan.show',['id' => $row_laporan->id ]) }}"
                            class="btn btn-sm btn-primary p-1" target="_blank">DETAIL</a> --}}
                          <button type="button" class="btn btn-sm btn-primary btnshow p-1" data-id="{{$row_laporan->id}}">
                            DETAIL
                          </button>
                          <a type="button"
                            href="{{route('rpm.pt.custom.pdf.show',['id' => Crypt::encryptString($row_laporan->id) ]) }}"
                            class="btn btn-sm btn-danger p-1 mt-2" target="_blank">PDF</a>
                          <a type="button"
                            href="{{route('rpm.pt.custom.surat.index',['id' => $row_laporan->id ]) }}"
                            class="btn btn-sm btn-info p-1 mt-2">SURAT</a>
                        </div>
                      </td>

                      <td class="ubah{{$row_laporan->id}}">  
                        <button type="button" class="btn btn-sm btn-danger btnhapus" data-id="{{$row_laporan->id}}"><span class="bi bi-trash"></span></button>
                      </td>
                    </tr>
                    
                    @endforeach
                  </tbody>
                </table>
              </div>

              {{ $laporan->links() }}
            </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 ttd(url, dataid){
        axios.get(url, {
            params: {
                'data_id': dataid,
            }
        }).then(function (response){
            $('#ttd-app').html(response.data);
            $("#ttd").modal('show');
        });
    };

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

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

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

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

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

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

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

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

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

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

    $(document).ready(function(){
        
        $('#table_body').on('click','.btnshow',function(e){
          btn = $(this);
          show('{{ route("rpm.pt.custom.laporan.show") }}', btn.data('id'));
        });
        
        $('#table_body').on('click','.btnedit',function(e){
          btn = $(this);
          edit('{{ route("rpm.pt.custom.laporan.edit") }}', btn.data('id'));
        });

        $('#table_body').on('click','.btnhapus',function(e){
          btn = $(this);
          hapus('{{ route("rpm.pt.custom.laporan.remove") }}', btn.data('id'));
        });

        @if(auth()->user()->isPanmudPT())
          $('#table_body').on('click','.btnttd',function(e){
            btn = $(this);
            ttd('{{ route("rpm.pt.custom.ttd.create") }}', btn.data('id'));
          });
        @endif

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

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


</script>

@stop