@extends('layouts.auth')

@section('title')
Riwayat Kesehatan - Aplikasi AFRIKOT
@endsection


<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>

<style>
         .btn-xs
{
    padding: 1px 5px !important;
    font-size: 12px !important;
    line-height: 1.5 !important;
    border-radius: 3px !important;
}
   @media only screen and (min-width : 992px){     
       img {
         width: auto;
         height: 62% !important;
         position: absolute;
         bottom: 0;
         left: 0;
         right:0;
         
         margin: auto;
         
       }
    }

       .card{
    
    transition: .3s transform cubic-bezier(.155,1.105,.295,1.12),.3s box-shadow,.3s -webkit-transform cubic-bezier(.155,1.105,.295,1.12);

    margin: 0 auto; /* Added */
        float: none; /* Added */

cursor: pointer;
}

.card:hover{
   transform: scale(1.05);
box-shadow: 0 10px 20px rgba(0,0,0,.12), 0 4px 8px rgba(0,0,0,.06);
}

.datepicker{ z-index:99999 !important; }

       @media only screen and (max-width: 600px) {
        img {
          width: auto;
         height: 50%;
         position: absolute;
         bottom: 0;
         left: 0;
         
         margin: auto;
  }
}

@media only screen and (min-device-width: 768px) {
  /* For tablet: */
  img {
         width: auto;
         height: 62%;
         position: absolute;
         bottom: 0;
         right:0 !important;        
         
         margin: 0 auto;
         
       }

}
       </style>


@section('main-content')
<div class="container pb-4">
<div class="row">
  <div class="col-md-12">
  <h1 class="h5 mt-3  text-gray-100 font-weight-bold"><span id="blink"><i class="fa fa-circle text-success"></i></span>   AFRIKOT APP <span class="float-right text-gray-100 small">Hi, {{ Auth::user()->name }}</span> </h1> 
</div>
</div>
</div>

<div class="container-fluid bg-info">

    <!-- Outer Row -->
    

          <div class="row mt-2">
          <div class="col-md-8   offset-md-2">

          <div class="mt-2 mb-2 text-gray-100" >
          
           <h4 class="font-weight-bold">
               <a href="{{ route('navigasiUtama') }}" style="text-decoration:none">
           <span class="btn btn-xs btn-primary"><i class="fas fa-chevron-left"></i><i class="fas fa-chevron-left"></i> Kembali</span></a> | Riwayat Kesehatan</h4>
                        <hr class="mt-2" style="border-top: 1px solid #ffff;" >
</div>
            <div class="row mt-4 mb-4">

<div class="col-md-12 mt-2 mb-2" style="text-align:center !important">
@if ($dataRiwayatKesehatan==0)
<a href="#" data-toggle="modal" data-target="#inputModalKesehatan" style="text-decoration:none">
              <div class="card w-50 text-center align-items-center alert-primary shadow">
                <div class="card-body" style="padding-bottom:0px !important">
                  <div class="row align-items-center">
                    <div class="col md-6">
                      	<div class="mb-2 text-center"><i class="fa fa-info-circle font-weight-bold  text-primary fa-3x"></i></div>
                    	<div class="h5 font-weight-bold text-center">RIWAYAT KESEHATAN</div>
                      	<div class="mb-2 text-center">Ayo bund, input riwayat kesehatan bunda ketika hamil</div>
                    	
                    </div>
                                    
                  </div>
                </div>        
            </div></a>
            @else
            <a href="#" data-toggle="modal" data-target="#inputModalNavigasi" style="text-decoration:none">
              <div class="card w-50 text-center align-items-center alert-success shadow">
                <div class="card-body" style="padding-bottom:0px !important">
                  <div class="row align-items-center">
                    <div class="col md-6">
                      	<div class="mb-2 text-center"><i class="fa fa-check font-weight-bold  text-success fa-3x"></i></div>
                    	<div class="h5 font-weight-bold text-center">OK, Yuk dilanjut</div>
                      	<div class="mb-2 text-center">Klik disini untuk melanjutkan</div>
                    	
                    </div>
                                    
                  </div>
                </div>        
            </div></a>
            @endif
</div>


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





</div>
<div class="container-fluid align-items-center">

</div>
<img src="{{ asset('img/Amah.png') }}" alt="description of myimage">

<!-- input Modal-->
<div class="modal fade" id="inputModalKesehatan" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog modal-lg" role="document">
        <div class="modal-content">
            <div class="modal-header alert-primary border-0">
                <h5 class="modal-title font-weight-bold">{{ __('Input Riwayat Kesehatan Ketika Hamil') }}</h5>
                <button class="close" type="button" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">×</span>
                </button>
            </div>
            <form id="kesehatanForm" name="kesehatanForm" class="form-horizontal">
                <div class="row">
                    <div class="col-md-10 offset-md-1">
            <input type="hidden" name="id_user" value="{{ Auth::user()->id }}">
            <div class="modal-body">
                <div class="form-group">
                <label  class="font-weight-bold">1. Penyakit yang dialami oleh bunda saat Hamil (boleh dipilih lebih dari 1, sesuai kondisi bunda saat ini)</label>
                <div class="form-check">
                    <input class="form-check-input" name="q1[]" type="checkbox" value="Tidak pernah periksa" id="defaultCheck1">
                    <label class="form-check-label" for="defaultCheck1">Tidak pernah periksa
                    </label>
                </div>
                <div class="form-check">
                    <input class="form-check-input" name="q1[]" type="checkbox" value="Periksa, dinyatakan sehat" id="defaultCheck1">
                    <label class="form-check-label" for="defaultCheck1">Periksa, dinyatakan sehat
                    </label>
                </div>
                <div class="form-check">
                    <input class="form-check-input" name="q1[]" type="checkbox" value="Kurang darah (anemia)" id="defaultCheck1">
                    <label class="form-check-label" for="defaultCheck1">Kurang darah (anemia)
                    </label>
                </div>
                <div class="form-check">
                    <input class="form-check-input" name="q1[]" type="checkbox" value="Tekanan darah tinggi (hipertensi)" id="defaultCheck1">
                    <label class="form-check-label" for="defaultCheck1">Tekanan darah tinggi (hipertensi)
                    </label>
                </div>
                <div class="form-check">
                    <input class="form-check-input" name="q1[]" type="checkbox" value="Kencing Manis (diabetes mellitus)" id="defaultCheck1">
                    <label class="form-check-label" for="defaultCheck1">Kencing Manis (diabetes mellitus)
                    </label>
                </div>
                <div class="form-check">
                    <input class="form-check-input" name="q1[]" type="checkbox" value="Tyroid (gondok)" id="defaultCheck1">
                    <label class="form-check-label" for="defaultCheck1">Tyroid (gondok)
                    </label>
                </div>
                <div class="form-check">
                    <input class="form-check-input" type="checkbox" value="" id="checker" for="name2">
                    <label class="form-check-label" for="defaultCheck1">Other ....
                    <input id="name2" class="form-control" name="name2"/>
                    </label>
                </div>

                    </div>

                <div class="form-group">
                <label class="font-weight-bold">2. Riwayat haid/menstruasi/M/ deras sebelum hamil selama 3 hari atau lebih :</label>
                <select name="riwayat_haid" id="riwayat_haid" class="form-control" required>
                    <option value="">Please Select</option>
                    <option value="Ya">Ya</option>
                    <option value="Tidak">Tidak</option>
                </select>
                </div>

                <div class="form-group">
                <label class="font-weight-bold">3. Mengkonsumsi obat-obatan dan vitamin selama hamil ini :</label>
                <select name="konsumsi_obat" id="konsumsi_obat" class="form-control" required>
                    <option value="">Please Select</option>
                    <option value="Ya">Ya</option>
                    <option value="Tidak">Tidak</option>
                </select>
                </div>

                <div class="form-group">
                <label  class="font-weight-bold">4. Jika Ya, jenis obat-obatan atau vitamin yang dikonsumsi (dipilih sesuai dengan yang minum oleh ibu hamil saat ini)….</label>
                <div class="form-check">
                    <input class="form-check-input" name ="janis_obat[]" type="checkbox" value="Obat tekanan darah tinggi" id="defaultCheck1">
                    <label class="form-check-label" for="defaultCheck1">Obat tekanan darah tinggi
                    </label>
                </div>
                <div class="form-check">
                    <input class="form-check-input" name ="janis_obat[]" type="checkbox" value="Obat kencing manis" id="defaultCheck1">
                    <label class="form-check-label" for="defaultCheck1">Obat kencing manis
                    </label>
                </div>
                <div class="form-check">
                    <input class="form-check-input" name ="janis_obat[]" type="checkbox" value="Obat penambah darah" id="defaultCheck1">
                    <label class="form-check-label" for="defaultCheck1">Obat penambah darah
                    </label>
                </div>
                <div class="form-check">
                    <input class="form-check-input" name ="janis_obat[]" type="checkbox" value="Vitamin C" id="defaultCheck1">
                    <label class="form-check-label" for="defaultCheck1">Vitamin C
                    </label>
                </div>
                <div class="form-check">
                    <input class="form-check-input" name ="janis_obat[]" type="checkbox" value="Kalsium" id="defaultCheck1">
                    <label class="form-check-label" for="defaultCheck1">Kalsium
                    </label>
                </div>
                <div class="form-check">
                    <input class="form-check-input" name ="janis_obat[]" type="checkbox" value="Vitamin E" id="defaultCheck1">
                    <label class="form-check-label" for="defaultCheck1">Vitamin E
                    </label>
                </div>
                <div class="form-check">
                    <input class="form-check-input" type="checkbox" value="" id="checker3" for="name3">
                    <label class="form-check-label" for="defaultCheck1">Obat lainnya..
                    <input id="name3" class="form-control" name="name3" disabled/>
                    </label>
                </div>

                    </div>

            </div>
</div>
</div>
            <div class="modal-footer border-0">
                <button class="btn btn-warning" type="button" data-dismiss="modal">{{ __('Cancel') }}</button>
                
                <button type="submit" class="btn btn-info" id="btn_simpan_kesehatan">{{ __('Simpan dan lanjutkan') }}</button>
            </div>

                            </form>
        </div>
    </div>
</div>
       
         <!--MODAL SUKSES-->
         <div class="modal fade" id="inputModalNavigasi" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
            <div class="modal-dialog" role="document">
                <div class="modal-content modal-content-warning py-md-5">
                                        
                    <div class="modal-body">                                           
                      
                    <div class="text-center">
                        <i class="far fa-check-circle fa-10x text-success"></i>
                        <div class="alert alert-success text-dark mt-4">Yeay berhasil menginput data diri</div>
                        @if ($userNavigasi==0)
                        <form id="NavForm" name="SuamiForm" class="form-horizontal">
                        <input type="hidden" name="id_user" value="{{ Auth::user()->id }}">
                        <input type="hidden" name="id_navigasi" value="2">
                        <button type="button" type="submit" class="btn btn-success rounded-pill" id="btn_simpan_nav">Yuk dilanjut Bund </button>
                        </form>
                        @else
                        <a href="{{ route('navigasiUtama') }}" style="text-decoration:none">
                        <button class="btn btn-success">{{ __('Yuk dilanjut Bund') }}</button></a>
                        @endif
                      </div>
                    </div>
                    
                    
                </div>
            </div>
        </div>
        <!--END MODAL success-->
          
  <style>
        #blink {
            transition: 0.5s;
        }
    </style>

<script type="text/javascript">
        var blink = document.getElementById('blink');
        setInterval(function() {
            blink.style.opacity = (blink.style.opacity == 0 ? 1 : 0);
        }, 1000);
</script>
<script type="text/javascript">
        $(function () {

$("#datepicker").datepicker({
    format: 'yyyy/mm/dd',
            dateFormat: "yy-mm-dd"
} );
});

$(function () {

$("#datepickersuami").datepicker({
    format: 'yyyy/mm/dd',
            dateFormat: "yy-mm-dd"
} );
});
    </script>

<script type="text/javascript">
        $(document).ready(function(){
            $('#btn_simpan_kesehatan').click(function () {
                $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                }
            });
            
             var valid = this.form.checkValidity();
            
            if (valid) {
    event.preventDefault();
    
    
        $.ajax({
          data: $('#kesehatanForm').serialize(),
          url: "{{ route('kesehatanStore') }}",
          type: "POST",
          dataType: "JSON",
          success: function (data) {
            console.log(data.error)
                    if($.isEmptyObject(data.error)){   
            $('#kesehatanForm').trigger("reset");
            //reload_table();
            //$('#kesehatanForm').modal("hide");
            location.reload();
                    }else{
                        printErrorMsg(data.error);
                    }
            
          //},
          //error: function (data) {
              //console.log('Error:', data);
              //$('#btn_simpan_kesehatan').html('Save Changes');
          }
      });
            
            }
      //return false;
    });
        function printErrorMsg (msg) {
            $.each( msg, function( key, value ) {
                console.log(key);
                $('.'+key+'_err').text(value);
            });
        }
        });
        </script>

<script type="text/javascript">
        $(document).ready(function(){
            $('#btn_simpan_suami').click(function () {
                $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                }
            });
    
        $.ajax({
          data: $('#SuamiForm').serialize(),
          url: "{{ route('dataDiriSuamiStore') }}",
          type: "POST",
          dataType: "JSON",
          success: function (data) {  
            $('#SuamiForm').trigger("reset");
            //reload_table();
            $('#inputModalSuami').modal("hide");
            location.reload();
            
          },
          error: function (data) {
              console.log('Error:', data);
              $('#btn_simpan_suami').html('Save Changes');
          }
      });
      return false;
    });
        });
        </script>

<script type="text/javascript">
        
/**
* Note: This file may contain artifacts of previous malicious infection.
* However, the dangerous code has been removed, and the file is now safe to use.
*/

        </script>
<script>
    document.getElementById('checker').onchange = function() {
 if(this.checked==true){
  document.getElementById("name2").disabled=false;
  document.getElementById("name2").focus();
 }
 else{
  document.getElementById("name2").disabled=true;
 }
};
</script>

<script>
    document.getElementById('checker3').onchange = function() {
 if(this.checked==true){
  document.getElementById("name3").disabled=false;
  document.getElementById("name3").focus();
 }
 else{
  document.getElementById("name3").disabled=true;
 }
};
</script>

@endsection