@extends('be.layout-index')
@section('content')
@php
$modul="Pelapor";
$modula="m_pelapor";
$id='';
$nama='';
$nm_user='';
$sandi='';
$aktif='';
$jenis_noidentitas='';
$no_identitas='';
$id_katpelapor='';
$id_kappelapor='';
$kappelapor='';
$tempat_lahir='';
$tanggal_lahir='';
$jenis_kelamin='';
$pekerjaan='';
$pekerjaan_lain='';
$warganegara='';
$alamat='';
$provinsi='';
$kabkota='';
$hp='';
$fax='';
$email='';
$foto_diri='';
$foto_identitas='';
$jabatan='';
if(isset($data)){
	$id=$data->id_user;
	$nama=$data->nama;
	$nm_user=$data->nm_user;
	$sandi=$data->sandi;
	$aktif=$data->aktif;
	$jenis_noidentitas=$data->jenis_noidentitas;
	$no_identitas=$data->no_identitas;
	$id_katpelapor=$data->id_katpelapor;
	$id_kappelapor=$data->id_kappelapor;
	$kappelapor=$data->kappelapor;
	$tempat_lahir=$data->tempat_lahir;
	$tanggal_lahir=IndonesiaTgl($data->tanggal_lahir);
	$jenis_kelamin=$data->jenis_kelamin;
	$pekerjaan=$data->pekerjaan;
	$pekerjaan_lain=$data->pekerjaan_lain;
	$warganegara=$data->warganegara;
	$alamat=$data->alamat;
	$provinsi=$data->provinsi;
	$kabkota=$data->kabkota;
	$hp=$data->hp;
	$fax=$data->fax;
	$email=$data->email;
	$foto_diri=$data->foto_diri;
	$foto_identitas=$data->foto_identitas;
	$jabatan=$data->jabatan;
}
if($foto_diri==''){
	$foto_diri='profil.jpg';
}
@endphp
<link rel="stylesheet" href="{{asset('media/assets/css/select2.min.css')}}">
<link rel="stylesheet" href="{{asset('media/assets/css/select2-bootstrap.css')}}">
<link href="{{asset('media/assets/node_modules/bootstrap-datepicker/bootstrap-datepicker.min.css')}}" rel="stylesheet" type="text/css" />
<link href="{{asset('media/assets/node_modules/clockpicker/dist/jquery-clockpicker.min.css')}}" rel="stylesheet">
<script>
  	$(document).ready(function(){
	  
       $("#provinsi").change(function (){
           var url = "{{route('add_ajax_kab')}}/"+$(this).val();
           $('#kabkota').load(url);
           return false;
       });
	   $("#id_katpelapor").change(function (){
	   	   if(this.value==1||this.value==2){
	           	$('#kappelapor').addClass("d-none");
	           	$('#d_kappelapor').removeClass("d-none");
				
				var url = "{{route('m_pelapor.add_ajax_katpelapor')}}/"+$(this).val();
		        $('#id_kappelapor').load(url);
		        return false;
		   }
		   else if(this.value==3||this.value==4){
			    $('#kappelapor').val('')
	           	$('#kappelapor').removeClass("d-none");
	           	$('#d_kappelapor').addClass("d-none");
		   }
		   else{
			    $('#kappelapor').val('')
	           	$('#kappelapor').addClass("d-none");
	           	$('#d_kappelapor').addClass("d-none");
		   }
       });
       $("#pekerjaan").change(function (){
	   	   if(this.value==5){
           	$('#dpekerjaan_lain').addClass("show");
           	$('#dpekerjaan_lain').removeClass("hide");
		   }
		   else{
		   	$('#dpekerjaan_lain').val('')
           	$('#dpekerjaan_lain').removeClass("show");
           	$('#dpekerjaan_lain').addClass("hide");
		   }
       });
	 });
</script>
<style>
.padtop{
	margin-top:10px;
}
.konf{
	color:red;
}
.foto{
  width: 160px;
  height: 160px;
  margin-bottom:20px;
  box-shadow: rgba(0, 0, 0, 0.19) 0px 10px 20px, rgba(0, 0, 0, 0.23) 0px 6px 6px;
}
</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">
		<form id=frm name=frm method=post enctype="multipart/form-data" action='{!!route('m_pelapor.save')!!}'>
			@csrf
			@if($id!='')
			<div class="row">
				<div class="col-sm-3">
					<img class="foto" src="{{asset('media/uploads/foto/'.$foto_diri)}}">
				</div>
			</div>
			@endif
			<div class="row">
				<div class="col-sm-6">
					@if(session('failed'))
						<div class="alert alert-danger">
							<a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
							{{ session('failed') }}
						</div>
					@endif
				</div>
			</div>
			<div class="row">
				<div class="col-sm-6">
					<div class="form-group row required">
						<label class="col-sm-4 control-label">Nama</label>
						<div class="col-sm-7">
							<input name="nama" value="{{$nama}}"  class="form-control"/>
						</div>
					</div>
					<div class="form-group row required">
						<label class="col-sm-4 control-label">Jenis Identitas</label>
						<div class="col-sm-4">
							<select class='form-control select2' id=jenis_noidentitas name=jenis_noidentitas>
							@php
								echo "<option value=''";
								if($jenis_noidentitas==""){echo " selected ";}
								echo ">-Pilih-";
							  	if (!empty($m_jenis_noidentitas)) {
		                      		foreach ($m_jenis_noidentitas as $row){
										echo "<option value='".$row->id."'";
										if($row->id==$jenis_noidentitas){echo " selected ";}
										echo ">".$row->nama;
									}
								}
			                @endphp
							</select>
						</div>
					</div>
					<div class="form-group row required">
						<label class="col-sm-4 control-label">No Identitas</label>
						<div class="col-sm-7">
							<input name="no_identitas" value="{{$no_identitas;}}"  class="form-control"/>
						</div>
					</div>
					<div class="form-group row required">
						<label class="col-sm-4 control-label">Kategori Pelapor</label>
						<div class="col-sm-5">
							<select class='form-control select2' id=id_katpelapor name=id_katpelapor>
							@php
								echo "<option value=''";
								if($id_katpelapor==""){echo " selected ";}
								echo ">-Pilih-";
							  	if (!empty($m_katpelapor)) {
		                      		foreach ($m_katpelapor as $row){
										echo "<option value='".$row->id."'";
										if($row->id==$id_katpelapor){echo " selected ";}
										echo ">".$row->nama;
									}
								}
			                @endphp
							</select>
						</div>
					</div>
					<div class="form-group row">
						<label class="col-sm-4 control-label">Kapasitas Pelapor</label>
						<div class="col-sm-7">
							<div id="d_kappelapor" class="{!!($id_katpelapor==1||$id_katpelapor==2?"":"d-none")!!}">
						   	<select name="id_kappelapor" id="id_kappelapor" style="width:300px" class="form-control select2 ">
								@php
									echo "<option value=''";
									if($id_kappelapor==""){echo " selected ";}
									echo ">- Pilih -";
								  	if (!empty($m_kappelapor)) {
			                      		foreach ($m_kappelapor as $row){
											echo "<option value='".$row->id."'";
											if($row->id==$id_kappelapor){echo " selected ";}
											echo ">".$row->nama;
										}
									}
				                @endphp
							</select>
							</div>
							<input name="kappelapor" id="kappelapor" value="{[$kappelapor;}}"  class="form-control {{($id_katpelapor==3||$id_katpelapor==4?"":"d-none")}}"/>
						</div>
					</div>
					<div class="form-group row">
						<label class="col-sm-4 control-label">Tempat Lahir</label>
						<div class="col-sm-8">
							<input name="tempat_lahir" value="{{$tempat_lahir;}}"  class="form-control"/>
						</div>
					</div>
					<div class="form-group row">
						<label class="col-sm-4 control-label">Tanggal Lahir</label>
						<div class="col-sm-5 input-group">
		                    <input type="text" name=tanggal_lahir class="form-control" id="tanggal_lahir" placeholder="dd/mm/yyyy" value="{{$tanggal_lahir}}" autocomplete="off">
		                    <div class="input-group-append"> 
		                        <span class="input-group-text"><i class="icon-calender"></i></span> 
		                    </div> 
						</div>
					</div>
					<div class="form-group row">
						<label class="col-sm-4 control-label">Jenis Kelamin</label>
						<div class="col-sm-4">
							<select class='form-control select2' id=jenis_kelamin name=jenis_kelamin>
							@php
							  	echo "<option value=''";
								if($jenis_kelamin==""){echo " selected ";}
								echo ">-Pilih-";
							  	echo "<option value='Laki-laki'";
								if($jenis_kelamin=="Laki-laki"){echo " selected ";}
								echo ">Laki-laki";
							  	echo "<option value='Perempuan'";
								if($jenis_kelamin=="Perempuan"){echo " selected ";}
								echo ">Perempuan";
			                @endphp
							</select>
						</div>
					</div>
					<div class="form-group row">
						<label class="col-sm-4 control-label">Pekerjaan</label>
						<div class="col-sm-6">
						   <select style="width:200px" class='form-control select2' id=pekerjaan name=pekerjaan>
								@php
									echo "<option value=''";
									if($pekerjaan==""){echo " selected ";}
									echo ">- Pilih Pekerjaan -";
								  	if (!empty($m_pekerjaan)) {
			                      		foreach ($m_pekerjaan as $row){
											echo "<option value='".$row->id."'";
											if($row->id==$pekerjaan){echo " selected ";}
											echo ">".$row->nama;
										}
									}
				                @endphp
						   </select>
						   <span id=dpekerjaan_lain class="{{($pekerjaan==5?'show':'hide')}}"><input name="pekerjaan_lain" id="pekerjaan_lain" value="{{$pekerjaan_lain}}"  class="form-control padtop"/></span>
						</div>
					</div>
					<div class="form-group row">
						<label class="col-sm-4 control-label">Kewarganegaraan</label>
						<div class="col-sm-3">
							<select class='form-control select2' id=warganegara name=warganegara>
							@php
							  	echo "<option value=''";
								if($warganegara==""){echo " selected ";}
								echo ">-Pilih-";
							  	echo "<option value='1'";
								if($warganegara=="1"){echo " selected ";}
								echo ">WNI";
							  	echo "<option value='0'";
								if($warganegara=="0"){echo " selected ";}
								echo ">WNA";
			                @endphp
							</select>
						</div>
					</div>
					<div class="form-group row required">
						<label class="col-sm-4 control-label">Username</label>
						<div class="col-sm-6">
							@php 
								if($id!=""){
									echo $nm_user.'<input type=hidden name="nm_user" id="nm_user" value="'.$nm_user.'">';
								}
								else{
									echo '<input name="nm_user" id="nm_user" value="'.$nm_user.'"  class="form-control" onchange="cekuser(this.value)"/>';
								} 
							@endphp
						</div>
					</div>
					<div class="form-group row required">
						<label class="col-sm-4 control-label">Sandi</label>
						<div class="col-sm-6">
							<input name="sandi" class="form-control"/><br>
							<font color=red size=1>* Kosongkan apabila tidak dilakukan perubahan.</font>
						</div>
					</div>
				</div>
				<div class="col-sm-6">
					<div class="form-group row">
						<label class="col-sm-4 control-label">Alamat</label>
						<div class="col-sm-8">
							<textarea name="alamat" class="form-control"/>{{$alamat}}</textarea>
						</div>
					</div>
					<div class="form-group row required">
						<label class="col-sm-4 control-label">Propinsi</label>
						<div class="col-sm-6">
						   <select class='form-control select2' id=provinsi name=provinsi>
								@php
									echo "<option value=''";
									if($provinsi==""){echo " selected ";}
									echo ">- Pilih Provinsi -";
								  	if (!empty($m_provinsi)) {
			                      		foreach ($m_provinsi as $row){
											echo "<option value='".$row->kode."'";
											if($row->kode==$provinsi){echo " selected ";}
											echo ">".$row->nama;
										}
									}
				                @endphp
						   </select>
						</div>
					</div>
					<div class="form-group row required">
						<label class="col-sm-4 control-label">Kabupaten/Kota</label>
						<div class="col-sm-7">
						   	<select name="kabkota" class="form-control select2" id="kabkota">
								@php
									echo "<option value=''";
									if($kabkota==""){echo " selected ";}
									echo ">- Pilih Kabupaten -";
								  	if (!empty($m_kabkota)) {
			                      		foreach ($m_kabkota as $row){
											echo "<option value='".$row->kode."'";
											if($row->kode==$kabkota){echo " selected ";}
											echo ">".$row->nama;
										}
									}
				                @endphp
							</select>
						</div>
					</div>
					<div class="form-group row">
						<label class="col-sm-4 control-label">HP</label>
						<div class="col-sm-5">
							<input name="hp" value="{{$hp}}"  class="form-control"/>
						</div>
					</div>
					<div class="form-group row">
						<label class="col-sm-4 control-label">Email</label>
						<div class="col-sm-5">
							<input name="email" value="{{$email}}"  class="form-control"/>
						</div>
					</div>
				</div>
			</div>
			<br />
			<div class="row">
				<div class="col-sm-6">
					<div class="form-group" style="margin-left:13px">
						<div class="col-sm-offset-2 col-sm-10">
							<input name="id" type="hidden" value="{{$id}}" />
							<button type="submit" class="btn btn-primary btn-sm" name="btnSave"><i class='fa fa-save'></i> Simpan</button>
							<a href="javascript:history.back()" class="btn btn-warning btn-sm"><i class='fa fa-repeat'></i> Batalkan</a>
						</div>
					</div>
				</div>
			</div>
		</form>
	</div>
</div>
            </div>
        </div>
    </div>
</div>
<script>
function cekuser(u){
	if(cekusers(u)){
		alert("Username sudah ada")
	}
}
function cekusers(u){
	@if($id!='')
		echo 'sts=true;';
	else
		var s=false
		$.ajax({url: "{{route('m_pelapor.cekuser')}}?u="+u,async: false, success: function(h){
	    s=(h.indexOf("1")!=-1?false:true);
	  	}});
	@endif
	return s;
}
function cekktp(u){
	@if($id!='') 
		echo 'sts=true;';
	else
		var s=false
		$.ajax({url: "{{route('m_pelapor.cekuser')}}?u="+u,async: false, success: function(h){
	    s=(h.indexOf("1")!=-1?false:true);
	  	}});
	@endif
	return s;
}

$(function() {
  $("#frm").validate({
  	errorClass: "errorCssClass",
    rules: {
	  nama: "required",
	  jenis_noidentitas: "required",
	  no_identitas: "required",
	  nm_user: "required",
	  provinsi: "required",
	  kabkota: "required",
    },
    messages: {
	  nama: "Isikan Nama",
	  jenis_noidentitas: "Isikan Jenis Identitas",
	  no_identitas: "Isikan No Identitas",
	  nm_user: "Isikan Username",
	  provinsi: "Isikan Provinsi",
	  kabkota: "Isikan Kabupaten",
    },
	errorPlacement: function (error, element) {
        if (element.parent('.input-group').length) { 
            error.insertAfter(element.parent());      // radio/checkbox?
        } else if (element.hasClass('select2')) {    
            error.insertAfter(element.next('span'));  // select2
        } else {         
            error.insertAfter(element);               // default
        }
    },
	highlight: function (element, errorClass, validClass) {
        $(element).addClass(errorClass); //.removeClass(errorClass);
        $(element).closest('.form-group').removeClass('has-success').addClass('has-error');
    },
   	unhighlight: function (element, errorClass, validClass) {
       	$(element).removeClass(errorClass); //.addClass(validClass);
       },
	submitHandler: function(form) {
		var frm = document.getElementById("frm");
		if(cekusers($('#nm_user').val())){
			alert('User name sudah ada yang pakai')
		}
		else{
			if(gosubmit()){
				$("#overlay").fadeIn(300);
				frm.submit();
				/*
				var formData = new FormData(frm);
				$.ajax({
				    type: "POST",
				    url: "{!!route('m_user.save')!!}",
				    data: formData,
				    contentType: false,
				    processData: false,
				    beforeSend: function() {
				    },
				    success: function(msg){
						document.location.href=msg
				    },
				    error: function() {
				    }
				});
				*/
			}
		}
	}
  });
});
</script>
<script src="{{asset('media/assets/js/select2.full.js')}}"></script>
<script src="{{asset('media/assets/node_modules/bootstrap-datepicker/bootstrap-datepicker.min.js')}}"></script>
<script src="{{asset('media/assets/node_modules/clockpicker/dist/jquery-clockpicker.min.js')}}"></script>
<script>
$(".select2").select2();
</script>
<script>
jQuery('#tanggal_lahir').datepicker({
	format: 'dd/mm/yyyy',
    autoclose: true,
    todayHighlight: true
});
</script>
@endsection