@extends('be.layout-index')
@section('content')
@php
$modul="Pelaporan";
$modula="m_laporan";
$id = '';
$no = '';
$no_offline = '';
$tgl_offline='';
$no_registrasi = '';
$id_pelapor = '';
$pelapornm = '';
$id_tahapan = '';
$tahapannm = '';
$jeniswilpemilihan = '';
$waktukejadian = '';
$waktukejadian_time = '';
$waktudiketahui = '';
$waktudiketahui_time = '';
$ringkasan = '';
$tempatkejadian = '';
$uraian = '';
$stsvalid="";
$stsvalidnm="";
$stsvalid_date=null;
$stsvalidbukti="";
$stsvalidbuktinm="";
$stsvalidbukti_date=null;
$stsvalidperbaikan="";
$stsvalidperbaikannm="";
$stsvalidperbaikan_date=null;
if(isset($data)){
	$id = $data->id;
	$no = $data->no;
	$no_offline = $data->no_offline;
	$tgl_offline=$data->tgl_offline;
	$no_registrasi = $data->no_registrasi;
	$id_pelapor = $data->id_pelapor;
	$pelapornm = $data->pelapornm;
	$id_tahapan = $data->id_tahapan;
	$tahapannm = $data->tahapannm;
	$jeniswilpemilihan = $data->jeniswilpemilihan;
	$waktukejadian = $data->waktukejadian;
	$waktukejadian_time = $data->waktukejadian_time;
	$waktudiketahui = $data->waktudiketahui;
	$waktudiketahui_time = $data->waktudiketahui_time;
	$ringkasan = $data->ringkasan;
	$tempatkejadian = $data->tempatkejadian;
	$uraian = html_entity_decode($data->uraian);
	$stsvalid = $data->stsvalid;
	$stsvalidnm = $data->stsvalidnm;
	$stsvalid_date = $data->stsvalid_date;
	$stsvalidbukti = $data->stsvalidbukti;
	$stsvalidbuktinm = $data->stsvalidbuktinm;
	$stsvalidbukti_date = $data->stsvalidbukti_date;
	$stsvalidperbaikan = $data->stsvalidperbaikan;
	$stsvalidperbaikannm = $data->stsvalidperbaikannm;
	$stsvalidperbaikan_date = $data->stsvalidperbaikan_date;
}
@endphp
<link rel="stylesheet" href="{{asset('media/assets/css/select2.min.css')}}">
<link rel="stylesheet" href="{{asset('media/assets/css/select2-bootstrap.css')}}">
<style>

.headmin-kmptns{
	height:20px;
	line-height:65px;
  	cursor: pointer;
	font-size:11pt;
	margin-left:35px;
	margin-top:-20px;
	padding-top:-20px;
}
.hd-kmptns{
	border-bottom:1px solid #bcbcbc;
	margin-right:0px;
	margin-left:10px;
	padding-top:10px;
	width:100%;
}
.btn-kmptns{
  	color: #666666;
	margin-left:-20px;
}
.btn-kmptns:after {
  content: url("{{asset('media/media/image/panahbawaha.png')}}");
  color: #000;
  font-weight: bold;
  float: left;
}
.btn-kmptns.collapsed:after {
  content: url("{{asset('media/image/panahkanana.png')}}");
}


.headmin-kmptnsa{
	height:20px;
	line-height:65px;
  	cursor: pointer;
	font-size:11pt;
	margin-left:35px;
	margin-top:-20px;
	padding-top:-20px;
}
.hd-kmptnsa{
	border-bottom:1px solid #bcbcbc;
	margin-right:0px;
	margin-left:10px;
	padding-top:10px;
	width:100%;
}
.btn-kmptnsa{
  	color: #666666;
	margin-left:-20px;
}
.btn-kmptnsa:after {
  content: url("{{asset('media/image/panahbawaha.png')}}");
  color: #000;
  font-weight: bold;
  float: left;
}
.btn-kmptnsa.collapsed:after {
  content: url("{{asset('media/image/panahkanana.png')}}");
}
.jdla{
	font-size:11pt;
	color:#000;
	line-height:1.5;
}
.subjdl{
	font-size:11pt;
	font-weight:bold;
}
.isicol{
	margin-top:10px;
	margin-left:10px;
}

.komp{
	width:95%;
}
.jdl{
	font-size:11pt;
	font-weight:bold;
}
.jdla{
	font-size:11pt;
	color:#000;
	line-height:1.5;
}
.panel-group{
	width:102%!important;
	margin-left:-10px;
}

.padtop{
	margin-top:10px;
}
</style>
<div class="row">
   <div class="col-12">
       <div class="card">
           	<div class="card-body">
			
<div class="panel-default">
	<div class="content-box-header  panel-heading">
		<div class="panel-title"></div>
	</div>
	<div class="content-box-large box-with-header">
            <div class="row">
				<div class="col-12">
  					<form name=frm id=frm method=post action="{!!route('m_laporan.save_validasi')!!}">
					@csrf
					   <div class="card">
				        <div class="col-md-12 col-sm-12 col-xs-12 hd-kmptns" role="tab" id="heading1">
				          <a class="btn btn-kmptns collapsed col-md-12" data-toggle="collapse" data-parent="#accordionEx" href="#collapse1" aria-expanded="false" aria-controls="collapse1">
				            <div class="headmin-kmptns" align=left>Peristiwa</div>
				          </a>
				        </div>
				        <div id="collapse1" class="collapse isicol show" role="tabpanel" aria-labelledby="heading1" data-parent="#accordionEx">
				          <div class="card-body">
							<div class="col-12">
								<div class="row">
				                    <div class="col-sm-6">
										<div class="form-group row">
										    <label class="col-sm-4 control-label">No</label>
											<div class="col-sm-7 tebal">{!!$no!!}</div>
										</div>
										<div class="form-group row">
										    <label class="col-sm-4 control-label">No Registrasi</label>
											<div class="col-sm-7 tebal">{!!$no_registrasi!!}</div>
										</div>
										<div class="form-group row">
										    <label class="col-sm-4 control-label">No Offline</label>
											<div class="col-sm-7 tebal">{!!$no_offline!!}</div>
										</div>
										<div class="form-group row">
										    <label class="col-sm-4 control-label">Tanggal Penyampaian Laporan Offline</label>
											<div class="col-sm-7 tebal">{!!konversi_tanggal('j M Y H:i:s',$tgl_offline)!!}</div>
										</div>
										<div class="form-group row">
										    <label class="col-sm-4 control-label">Pelapor/Penemu</label>
											<div class="col-sm-7 tebal">{!!$pelapornm!!}</div>
										</div>
										<div class="form-group row">
										    <label class="col-sm-4 control-label">Kategori</label>
											<div class="col-sm-7">{!!$jeniswilpemilihan!!}</div>
										</div>
										<div class="form-group row">
										    <label class="col-sm-4 control-label">Waktu kejadian</label>
											<div class="col-sm-7">{!!konversi_tanggal('j M Y',$waktukejadian).' '.$waktukejadian_time!!}</div>
										</div>
										<div class="form-group row">
										    <label class="col-sm-4 control-label">Tanggal diketahui</label>
											<div class="col-sm-7">{!!konversi_tanggal('j M Y',$waktudiketahui).' '.$waktudiketahui_time!!}</div>
										</div>
									</div>
									<div class="col-sm-6">
										<div class="form-group row">
											<label class="col-sm-4 control-label">Peristiwa singkat</label>
											<div class="col-sm-8">{!!$ringkasan!!}</div>
										</div>
										<div class="form-group row">
											<label class="col-sm-4 control-label">Tempat kejadian</label>
											<div class="col-sm-8">{!!$tempatkejadian!!}</div>
										</div>
									</div>
								</div>
							</div>
				          </div>
				        </div>
				      </div>
					  
					  <div class="card">
				        <div class="col-md-12 col-sm-12 col-xs-12 hd-kmptns" role="tab" id="heading7">
				          <a class="btn btn-kmptns collapsed col-md-12" data-toggle="collapse" data-parent="#accordionEx" href="#collapse7" aria-expanded="true" aria-controls="collapse7">
				            <div class="headmin-kmptns" align=left>Pelapor/Penemu Lain</div>
				          </a>
				        </div>
				        <div id="collapse7" class="collapse isicol" role="tabpanel" aria-labelledby="heading7" data-parent="#accordionEx">
				          <div class="card-body">
							<div class="col-10">
								<table class="table table-bordered table-hover display responsive" id="tableterlapor" width="100%">
						        <thead>
						          <tr>
							            <th class="text-center" width=5%>No</th>
							            <th class="text-center" width=35%>Nama</th>
							            <th class="text-center" width=45%>Alamat</th>
							            <th class="text-center" width=20%>HP</th>
						          </tr>
						        </thead>
						        <tbody id="tbody">
									@php 
										$configfoot="$('#tableterlapor').DataTable();";
									    $notif_idx=1;
										foreach($m_pelaporlain as $item)
										{
											echo '
											<tr>
												<td>'.$notif_idx.'</td>
												<td>'.$item->nama.'</td>
												<td>'.$item->alamat.'</td>
												<td>'.$item->hp.'</td>
											</tr>
											';
											$notif_idx++;
										}
									@endphp
						        </tbody>
						      </table>
							  </div>
				          </div>
				        </div>
				      </div>
					  
					  <div class="card">
				        <div class="col-md-12 col-sm-12 col-xs-12 hd-kmptns" role="tab" id="heading2">
				          <a class="btn btn-kmptns collapsed col-md-12" data-toggle="collapse" data-parent="#accordionEx" href="#collapse2" aria-expanded="true" aria-controls="collapse2">
				            <div class="headmin-kmptns" align=left>Terlapor</div>
				          </a>
				        </div>
				        <div id="collapse2" class="collapse isicol" role="tabpanel" aria-labelledby="heading2" data-parent="#accordionEx">
				          <div class="card-body">
							<div class="col-10">
								<table class="table table-bordered table-hover display responsive" id="tableterlapor" width="100%">
						        <thead>
						          <tr>
								  	@if($id_jenislaporan!=3)
							            <th class="text-center" width=5%>No</th>
							            <th class="text-center" width=35%>Nama</th>
							            <th class="text-center" width=45%>Alamat</th>
							            <th class="text-center" width=20%>HP</th>
									@else
							            <th class="text-center" width=5%>No</th>
							            <th class="text-center" width=35%>Nama</th>
							            <th class="text-center" width=25%>Alamat</th>
							            <th class="text-center" width=20%>Pekerjaan</th>
							            <th class="text-center" width=15%>HP</th>
									@endif
						          </tr>
						        </thead>
						        <tbody id="tbody">
									@php 
										$configfoot="$('#tableterlapor').DataTable();";
									    $notif_idx=1;
										foreach($m_terlapor as $item)
										{
											echo '
											<tr>
												<td>'.$notif_idx.'</td>
												<td>'.$item->nama.'</td>
												<td>'.$item->alamat.'</td>';
												if($id_jenislaporan==3){
													echo '<td>'.$item->pekerjaan.'</td>';
												}
												echo '<td>'.$item->hp.'</td>
											</tr>
											';
											$notif_idx++;
										}
									@endphp
						        </tbody>
						      </table>
							  </div>
				          </div>
				        </div>
				      </div>
					  
					  @if($id_jenislaporan!=3)
					   <div class="card">
				        <div class="col-md-12 col-sm-12 col-xs-12 hd-kmptns" role="tab" id="heading3">
				          <a class="btn btn-kmptns collapsed col-md-12" data-toggle="collapse" data-parent="#accordionEx" href="#collapse3" aria-expanded="true" aria-controls="collapse3">
				            <div class="headmin-kmptns" align=left>Saksi</div>
				          </a>
				        </div>
				        <div id="collapse3" class="collapse isicol" role="tabpanel" aria-labelledby="heading3" data-parent="#accordionEx">
				          <div class="card-body">
						  	<div class="col-10">
								<table class="table table-bordered table-hover display responsive" id="tablesaksi" width="100%">
						        <thead>
						          <tr>
						            <th class="text-center" width=5%>No</th>
						            <th class="text-center" width=35%>Nama</th>
						            <th class="text-center" width=45%>Alamat</th>
						            <th class="text-center" width=20%>HP</th>
						          </tr>
						        </thead>
						        <tbody id="tbody">
									@php 
										$configfoot="$('#tablesaksi').DataTable();";
									    $notif_idx=1;
										foreach($m_saksi as $item)
										{
											echo '
											<tr>
												<td>'.$notif_idx.'</td>
												<td>'.$item->nama.'</td>
												<td>'.$item->alamat.'</td>
												<td>'.$item->hp.'</td>
											</tr>
											';
											$notif_idx++;
										}
									@endphp
						        </tbody>
						      </table>
							</div>
				          </div>
				        </div>
				      </div>
					  @endif
					  <div class="card">
				        <div class="col-md-12 col-sm-12 col-xs-12 hd-kmptns" role="tab" id="heading5">
				          <a class="btn btn-kmptns collapsed col-md-12" data-toggle="collapse" data-parent="#accordionEx" href="#collapse5" aria-expanded="false" aria-controls="collapse5">
				            <div class="headmin-kmptns" align=left>Bukti</div>
				          </a>
				        </div>
				        <div id="collapse5" class="collapse" role="tabpanel" aria-labelledby="heading5" data-parent="#accordionEx">
				          <div class="card-body">
				            <div class="col-7">
								<table class="table table-bordered table-hover display responsive" id="tablebukti" width="100%">
						        <thead>
						          <tr>
						            <th class="text-center" width=5%>No</th>
						            <th class="text-center" width=75%>Deskripsi</th>
						            <th class="text-center" width=20%>File</th>
						          </tr>
						        </thead>
						        <tbody id="tbody">
									@php 
										$configfoot="$('#tablebukti').DataTable();";
									    $notif_idx=1;
										foreach($m_bukti as $item)
										{
											$file=(isset($item->file)!=""?'<a href="'.media_url().'uploads/laporan/'.$item->file.'" target="_blank"><button type="button" class="btn btn-primary btn-sm" onclick=><i class="ti-download"></i> Download</button></a>':'');
											echo '
											<tr>
												<td>'.$notif_idx.'</td>
												<td>'.$item->deskripsi.'</td>
												<td>'.$file.'</td>
											</tr>
											';
											$notif_idx++;
										}
									@endphp
						        </tbody>
						      </table>
							</div>
				          </div>
				        </div>
				     </div>
					 
					 <div class="card">
				        <div class="col-md-12 col-sm-12 col-xs-12 hd-kmptns" role="tab" id="heading6">
				          <a class="btn btn-kmptns collapsed col-md-12" data-toggle="collapse" data-parent="#accordionEx" href="#collapse6" aria-expanded="false" aria-controls="collapse6">
				            <div class="headmin-kmptns" align=left>Uraian</div>
				          </a>
				        </div>
				        <div id="collapse6" class="collapse" role="tabpanel" aria-labelledby="heading6" data-parent="#accordionEx">
				          <div class="card-body">
				            <div class="col-12">
								{!!$uraian!!}
							</div>
				          </div>
				        </div>
				     </div>
					 
					  <div class="row" style="height:15px"></div>
					  <div class="row">
						<div class="col-sm-8">
							<div class="form-group row"style="margin-left:13px">
								<label class="col-sm-{!!($stsvalid==1?'3':'3')!!} control-label">Validasi Laporan</label>
								<div class="col-sm-5">
									@if($stsvalid==1){
										<font color=green>Laporan sudah divalidasi</font>
									@else
										<select class='form-control select2' id=stsvalid name=stsvalid>
										@php
										  	echo "<option value=''";
											if($stsvalid==""){echo " selected ";}
											echo ">-Pilih-";
										  	echo "<option value='1'";
											if($stsvalid=="1"){echo " selected ";}
											echo ">Laporan divalidasi";
						                @endphp
										</select>
									@endif
								</div>
							</div>
							<div class="form-group row"style="margin-left:13px">
								<label class="col-sm-{!!($stsvalid==1?'3':'3')!!} control-label">Tahapan</label>
								<div class="col-sm-5">
									@if($stsvalid==1)
										{!! $tahapannm !!}
									@else
										<select class='form-control select2' id=tahapan name=tahapan>
										@php
											echo "<option value=''";
											if($id_tahapan==""){echo " selected ";}
											echo ">-Pilih-";
										  	if (!empty($m_tahapan)) {
					                      		foreach ($m_tahapan as $row){
													echo "<option value='".$row->id."'";
													if($row->id==$id_tahapan){echo " selected ";}
													echo ">".$row->nama;
												}
											}
						                @endphp
										</select>
									@endif
								</div>
							</div>
							@if($stsvalid==1)
								<div class="form-group row"style="margin-left:13px">
									<label class="col-sm-3 control-label">Divalidasi oleh</label>
									<div class="col-sm-5">
										{!!$stsvalidnm!!}
									</div>
								</div>
								<div class="form-group row"style="margin-left:13px">
									<label class="col-sm-3 control-label">Tanggal validasi</label>
									<div class="col-sm-5">
										{!!konversi_tanggal('j M Y H:i:s',$stsvalid_date)!!}
									</div>
								</div>
							@endif
						</div>
					  </div>
					  <div class="row">
						<div class="col-sm-12">
							<div class="form-group" style="margin-left:13px">
								<div class="col-sm-offset-2 col-sm-10">
									<input name="id" type="hidden" value="{!!$id!!}" />
									<input name="id_jenislaporan" type="hidden" value="{!!$id_jenislaporan!!}" />
								    <input type="hidden" name="no" value="{!!$no!!}">
								    <input type="hidden" name="id_pelapor"value="{!!$id_pelapor!!}">
									@if($stsvalid!=1)
										<button type="button" class="btn btn-primary btn-sm" name="btnSave" id=btnSave><i class='fa fa-save'></i> Simpan</button>
										<a id="kirim_notif" class="btn btn-info btn-sm"><i class='fa fa-repeat'></i> Notifikasi</a>
									@endif
									<a href="javascript:history.back()" class="btn btn-warning btn-sm"><i class='fa fa-repeat'></i> Back</a>
								</div>
							</div>
						</div>
					  </div>
					  </form>
					  
				</div>
			</div>	
	</div>
</div>

			</div>
        </div>
    </div>
</div>

<!--MODAL NOTIF-->
  <form id=frmnotif name=frmnotif>
      <div class="modal fade" id="Modal_Notif" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
        <div class="modal-dialog" role="document">
          <div class="modal-content">
            <div class="modal-header">
              <h5 class="modal-title" id="exampleModalLabel">Kirim Notifikasi</h5>
              <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                <span aria-hidden="true">&times;</span>
              </button>
            </div>
            <div class="modal-body" id="nm_notif" required>
				<textarea rows=5 class="form-control" name=notif id=notif></textarea>
			</div>
            <div class="modal-footer">
			  <input type="hidden" name="id_notif" id="id_notif">
			  <input type="hidden" name="no" id="no" value="{!!$no!!}>">
			  <input type="hidden" name="id_pelapor" id="id_pelapor" value="{!!$id_pelapor!!}">
              <button type="button" class="btn btn-secondary" data-dismiss="modal">Batal</button>
              <button type="button" type="submit" id="btn_notif" class="btn btn-primary">Kirim</button>
            </div>
          </div>
        </div>
      </div>
      </form>
  <!--END MODAL NOTIF-->
  
<script src="{{asset('media/assets/js/select2.full.js')}}"></script>
<script>
$(".select2").select2();
$(document).ready(function(){
	
    $('#btnSave').on('click',function(){
		if(confirm('Laporan akan divalidasi?')){
			if($('#stsvalid :selected').val()){
				if(gosubmit()){
					$("#overlay").fadeIn(300);
					var frm = document.getElementById("frm");
					frm.submit();
					/*
					var formData = new FormData(frm);
					$.ajax({
					    type: "POST",
					    url: "{!!route('m_laporan.save_validasi')!!}",
					    data: formData,
					    contentType: false,
					    processData: false,
					    beforeSend: function() {
					    },
					    success: function(msg){
							document.location.href=msg
					    },
					    error: function() {
					    }
					});
					**/
				}
			}
			else{
				alert('Status validasi harus dipilih terlebih dahulu')
			}
		}
	});
    $('#kirim_notif').on('click',function(){
          $('#Modal_Notif').modal('show');
	});
    $('#btn_notif').on('click',function(){
	    var id = $('#id_notif').val();
		var frm = document.getElementById("frmnotif");
		var formData = new FormData(frm);
		formData.append('_token', '{{csrf_token()}}')
		if($('#notif').val()==''){
			alert('Pesan notifikasi harus diisi terlebih dahulu')
		}
		else{
			$.ajax({
			    type: "POST",
			    url: "{!!route('m_laporan.save_notif')!!}",
			    data: formData,
			    contentType: false,
			    processData: false,
			    beforeSend: function() {
			    },
			    success: function(msg){
					$('#Modal_Notif').modal('hide');
					$('#notif').val('');
			    },
			    error: function() {
					alert('error')
			    }
			});
		}
   });
});
 </script>
@endsection