@extends('layouts.app')

@section('content')
<div class="page-frame bg-pale-navy">
  <div class="content-wrapper">
    <section class="wrapper bg-light">
      <div class="container py-15 py-md-17">
        <div class="row text-center mb-10">
          <div class="col-md-10 col-lg-9 col-xxl-8 mx-auto">
            <h3 class="display-3 px-xl-10 mb-0">DATA PERMOHONAN REKOMENDASI</h3>
          </div>
          <!-- /column -->
        </div>
        <div class="row">
          <div class="card shadow-lg">
            <div class="card-header">
              <div class="alert alert-dark alert-icon" role="alert">
                <p class="help-block">
                  <i class="uil uil-map-marker-info"></i> <b>Perhatian</b>
                  <br>
                  1. Harap Kode disimpan guna memonitoring status pengajuan. 
                  <br>
                  2. Dalam pengambilan Surat Rekomendasi diharapkan membawa berkas - berkas asli yang dibutuhkan untuk verifikasi.
                </p>
              </div>

              <h2>Kode Pengajuan : {{$detail->kode_rekom}}</h2>
            </div>
            <div class="card-body px-5">
              <div class="row">
                <div class="col-md-6">
                    <table class="table table-striped">
                      <tr>
                        <td>Jenis Permohonan</td>
                        <td>:</td>
                        <td>{{$detail->permohonan}}</td>
                      </tr>
                      <tr>
                        <td>Nama Pemohon</td>
                        <td>:</td>
                        <td>{{$detail->pemohon}}</td>
                      </tr>
                      <tr>
                        <td>Pekerjaan</td>
                        <td>:</td>
                        <td>{{$detail->pekerjaan}}</td>
                      </tr>
                      <tr>
                        <td>Universitas / Instansi / Lembaga</td>
                        <td>:</td>
                        <td>{{$detail->instansi}}</td>
                      </tr>
                      <tr>
                        <td>Alamat ( Pemohon / Universitas)</td>
                        <td>:</td>
                        <td>{{$detail->alamat}}</td>
                      </tr>
                      <tr>
                        <td>Tujuan Penelitian</td>
                        <td>:</td>
                        <td>{{$detail->tujuan_p}}</td>
                      </tr>
                      <tr>
                        <td>Penanggung Jawab</td>
                        <td>:</td>
                        <td>{{$detail->penanggung}}</td>
                      </tr>
                      <tr>
                        <td>Jumlah Peserta</td>
                        <td>:</td>
                        <td>{{$detail->peserta}}</td>
                      </tr>
                      <tr>
                        <td>Status Penelitian</td>
                        <td>:</td>
                        <td>{{$detail->status_p}}</td>
                      </tr>
                      <tr>
                        <td>Lampiran Proposal / Abstrak</td>
                        <td>:</td>
                        <td>{{$detail->lampiran}}</td>
                      </tr>
                    </table>
                </div>
                <div class="col-md-6">
                  <table class="table table-striped">
                    <tr>
                      <td width="40%">Nama Peneliti Utama</td>
                      <td width="5%">:</td>
                      <td>{{$detail->peneliti_utama}}</td>
                    </tr>
                    <tr>
                      <td>Hp</td>
                      <td>:</td>
                      <td>{{$detail->hp}}</td>
                    </tr>
                    <tr>
                      <td>Judul Penelitian</td>
                      <td>:</td>
                      <td>{{$detail->judul_p}}</td>
                    </tr>
                    <tr>
                      <td>Bidang Penelitian</td>
                      <td>:</td>
                      <td>{{$detail->bidang}}</td>
                    </tr>
                    <tr>
                      <td>Lokasi Penelitian</td>
                      <td>:</td>
                      <td>{{$detail->lokasi_p}}</td>
                    </tr>
                    <tr>
                      <td>Waktu Penelitian</td>
                      <td>:</td>
                      <td>{{$detail->awal_rekom}} - {{$detail->akhir_rekom}}</td>
                    </tr>
                    <tr>
                      <td>Persetujuan dari Lokasi</td>
                      <td>:</td>
                      <td>{{$detail->persetujuan_lokasi}}</td>
                    </tr>
                    <tr>
                      <td>Kewarganegaraan</td>
                      <td>:</td>
                      <td>{{$detail->warga}}</td>
                    </tr>
                  </table>
                </div>
              </div>
            </div>
          </div>
        </div>

        <hr class="divider my-4">

        <div class="row">
          <div class="card shadow-lg">
            <div class="card-header">
              <h2>Berkas</h2>
            </div>
            <div class="card-body">
              <div class="row">
                <div class="col-md-6">
                  <table class="table table-striped table-bordered">
                    <thead>
                      <th>No.</th>
                      <th>Nama Berkas</th>
                      <th>Berkas</th>
                    </thead>
                    <tbody>
                      @foreach ($berkas as $key => $item)
                        <tr>
                          <td>{{$key+1}}</td>
                          <td>{{$item->nama}}</td>
                          <td>{{$item->file}}</td>
                        </tr>
                      @endforeach
                      
                    </tbody>
                  </table>
                </div>

                <div class="col-md-5">
                  
                </div>
              </div>
            </div>
          </div>

        </div>
      </div>
    </section>
  </div>   
</div>
@endsection

@section('script')
<script>
var berkas_count = 0;
var pemohon_count = 0;

$('#sp_pekerjaan').select2({
	ajax: {
		url: "{{ route('e_rekomendasi.master.pekerjaan')}}",
		dataType: 'json',
		type: "GET",
		delay: 700,
		quietMillis: 10,
		data: function (params) {
			return {
				param: $.trim(params.term)
			};
		},
		processResults: function (data) {
      // console.log(data)
			return {
				results: $.map(data, function (item) {
          // console.log(item);
					return {
						id: item.id,
						text: item.pekerjaan,
					}
				})
			}
		}
	}
});

$('#sp_permohonan').select2({
	ajax: {
		url: "{{ route('e_rekomendasi.master.permohonan')}}",
		dataType: 'json',
		type: "GET",
		delay: 700,
		quietMillis: 10,
		data: function (params) {
			return {
				param: $.trim(params.term)
			};
		},
		processResults: function (data) {
      // console.log(data)
			return {
				results: $.map(data, function (item) {
          // console.log(item);
					return {
						id: item.id,
						text: item.permohonan,
					}
				})
			}
		}
	}
});

$('#sp_bidang').select2({
	ajax: {
		url: "{{ route('e_rekomendasi.master.bidang')}}",
		dataType: 'json',
		type: "GET",
		delay: 700,
		quietMillis: 10,
		data: function (params) {
			return {
				param: $.trim(params.term)
			};
		},
		processResults: function (data) {
      // console.log(data)
			return {
				results: $.map(data, function (item) {
          // console.log(item);
					return {
						id: item.id,
						text: item.bidang,
					}
				})
			}
		}
	}
});

$('#waktu_survei').daterangepicker();

$("#btnaddpemohon").on("click",function() {
  pemohon_count = pemohon_count + 1;
  let id_pemohon = `pemohon-${pemohon_count}`;
  let form_nama_pemohon = `
    <div id="${id_pemohon}">
      <hr class="divider my-4">
      <div class="input-group mb-3">
        <input type="text" name="nama_pemohon[]" class="form-control" placeholder="Nama Pemohon">
        <div class="input-group-append">
          <button type="button" class="btn btn-lg btn-danger rounded-0" onclick="hapusElement('${id_pemohon}')"><i class="fa fa-trash"></i></button>
        </div>
      </div>
    </div>
  `
  $("#list_nama_pemohon").append(form_nama_pemohon);
})

$("#btnaddberkas").on("click",function(){
  berkas_count = berkas_count+1;
  // console.log("berhasil")
  let id_berkas = `berkas-${berkas_count}`;
  let form_berkas = `
    <div id="${id_berkas}">
      <hr class="divider my-4">
      <label for="jenis_url">Berkas</label>
      <small>Maksimal ukuran file 5 MB</small>
      <div class="input-group mb-3">
        <input type="file" id="file_ktp" name="file_ktp[]" class="form-control ">
        <div class="input-group-append">
          <button type="button" class="btn btn-lg btn-danger rounded-0" onclick="hapusElement('${id_berkas}')"><i class="fa fa-trash"></i></button>
        </div>
      </div>
    </div>
  `;

  $("#list_berkas").append(form_berkas);
})

function hapusElement(idelment){
  $(`#${idelment}`).remove();
}


</script>
@endsection