@extends("backend.layout-sticky.master")

@section("title")
    Registrasi - Sistem Klinik
@endsection

@push('css')

@endpush

@section ('back')
<a href="#" data-back-button="" class="header-icon header-icon-1"><i class="fas fa-arrow-left"></i></a>
<!-- <a href="{{route('dashboard.master.pasien.index')}}" class="header-icon header-icon-1"><i class="fas fa-arrow-left"></i></a> -->
@endsection

@section ('content')

<div data-card-height="200" class="card card-style preload-img" data-src="{{asset('sticky-mobile/code/images/pictures/14w.jpg')}}">
    <div class="card-center text-center">
        <h1 class="font-22 color-white pt-3">Pendaftaran Pasien</h1>
    </div>
    <div class="card-overlay bg-black opacity-80"></div>
</div>
@if(session()->has('messages'))
  <div class="alert alert-success">
      {{ session()->get('messages') }}
  </div>
@endif

@if(session()->has('error'))
  <div class="alert alert-danger">
      {{ session()->get('error') }}
  </div>
@endif
<div class="card card-style">
  <form action="{{ route('dashboard.layanan.registrasi.store') }}" method="POST" enctype="multipart/form-data">

  @csrf

    @if ($errors->any())
        <div class="alert alert-danger">
            <ul>
                @foreach ($errors->all() as $error)
                    <li>{{ $error }}</li>
                @endforeach
            </ul>
        </div>
    @endif
      <div class="content mb-0">
        <input type="hidden" name="type" value="2">
        <label class="form-label">Pasien</label>
        <div class="form-group mb-4">
            <select id="patient_id" class="form-control" name="patient_id">

            </select>

        </div>

        <label class="form-label">Tanggal</label>
          <div class="input-style has-borders no-icon mb-4">
              <input type="date" value="{{ old('tgl_antrian', (isset($row) && $row['tgl_antrian'] ? $row['tgl_antrian'] : '') ) }}" max="2030-01-01" min="1930-01-01" name="tgl_antrian" class="form-control validate-text" id="tanggal" placeholder="Phone">
              <i class="fa fa-check disabled valid me-4 pe-3 font-12 color-green-dark"></i>
              <i class="fa fa-check disabled invalid me-4 pe-3 font-12 color-red-dark"></i>
          </div>

          <label class="form-label">Klinik</label>
          <div class="input-style has-borders no-icon mb-4">
              <select id="klinik_id"  name="klinik_id">
                  <option value="default" disabled selected>Pilih Klinik</option>
                  @foreach ($klinik as $val)
                  <option value="{{$val->id}}" {{ old('klinik_id', (isset($row) && $row['klinik_id'] == $val->id ? "selected" : '') ) }}>{{ $val->nama}}</option>
                  @endforeach
              </select>
              <span><i class="fa fa-chevron-down"></i></span>
              <i class="fa fa-check disabled valid color-green-dark"></i>
              <i class="fa fa-check disabled invalid color-red-dark"></i>
              <em></em>
          </div>

          <label class="form-label">Dokter</label>
          <div class="input-style has-borders no-icon mb-4">
              <select id="doctor_id"  name="doctor_id">
                  <option value="default" disabled selected>Pilih Dokter</option>
                  @foreach ($doctors as $val)
                  <option value="{{$val->id}}" {{ old('doctor_id', (isset($row) && $row['doctor_id'] == $val->id ? "selected" : '') ) }}>{{ $val->nama}}</option>
                  @endforeach
              </select>
              <span><i class="fa fa-chevron-down"></i></span>
              <i class="fa fa-check disabled valid color-green-dark"></i>
              <i class="fa fa-check disabled invalid color-red-dark"></i>
              <em></em>
          </div>

          <label class="form-label">Waktu</label>
          <div class="input-style has-borders no-icon mb-4">
              <select id="waktu"  name="waktu">

              </select>
              <span><i class="fa fa-chevron-down"></i></span>
              <i class="fa fa-check disabled valid color-green-dark"></i>
              <i class="fa fa-check disabled invalid color-red-dark"></i>
              <em></em>
          </div>

          <label class="form-label">Keluhan Utama</label>
          <div class="input-style has-borders no-icon validate-field mb-4">
              <input type="text" class="form-control" name="keluhan" value="{{ old('keluhan', (isset($row) && $row['keluhan'] ? $row['keluhan'] : '') ) }}" placeholder="Keluhan Utama">
              <i class="fa fa-times disabled invalid color-red-dark"></i>
              <i class="fa fa-check disabled valid color-green-dark"></i>
              <!-- <em>(required)</em> -->
          </div>

          <label class="form-label">File</label>
          <div class="input-style has-borders no-icon validate-field mb-4">
              <input type="file" class="form-control" name="file">
              <i class="fa fa-times disabled invalid color-red-dark"></i>
              <i class="fa fa-check disabled valid color-green-dark"></i>
              <!-- <em>(required)</em> -->
          </div>

          <button class="btn btn-xxs mb-3 rounded-s text-uppercase font-900 shadow-s border-blue-dark btn-save bg-blue-light" type="button">Save</button>
          <button class="btn-submit d-none"></button>



      </div>

  </form>
</div>
@endsection

@push('js')
<!-- Page level custom scripts -->
<script>

$(document).on('click', '.btn-save', function(e){

  let klinik = $("#klinik_id").val()
  let waktu = $("#waktu").val()
  let tanggal = $("#tanggal").val()
  let dokter = $("#doctor_id").val()
  let pasien = $("#patient_id").val()
  let error = 0
  console.log(pasien == null);
    if (waktu == null ) {
      error += 1
      Swal.fire({
          title:'error',
          text:'Silahkan masukkan waktu',
          icon:'error'
      })
    }

    if (pasien == null ) {
      error += 1
      Swal.fire({
          title:'error',
          text:'Silahkan masukkan pasien',
          icon:'error'
      })
    }

    if (waktu == 0 ) {
      error += 1
      Swal.fire({
          title:'error',
          text:'Jadwal tidak tersedia',
          icon:'error'
      })
    }

    if (klinik == undefined) {
      error += 1
      Swal.fire({
          title:'error',
          text:'Silahkan masukkan klinik',
          icon:'error'
      })
    }

    if (tanggal == "") {
      error += 1
      Swal.fire({
          title:'error',
          text:'Silahkan masukkan tanggal',
          icon:'error'
      })
    }

    if (dokter == null) {
      error += 1
      Swal.fire({
          title:'error',
          text:'Silahkan masukkan dokter',
          icon:'error'
      })
    }

  console.log(error);
  if (error > 0) {

  }else {
    $(".btn-submit").click()
  }


});

$("#patient_id").select2({
    placeholder:"Pilih Pasien",
    ajax:
    {
      url: "{{ route('dashboard.master.pasien.getNoRm') }}",
      processResults: function (data) {
        // console.log(data);
        return {
          results: data.results
        };
      }
    }
})

var doctor_id = 0
var klinik_id = 0
var tanggal = "2023-02-13"
var patient_id = $("#patient_id").val()

$(document).on('change', '#klinik_id', function(e){
  klinik_id = $(this).val()
  getWaktu(doctor_id, tanggal, klinik_id, patient_id)

});

$(document).on('change', '#doctor_id', function(e){
  doctor_id = $(this).val()
  getWaktu(doctor_id, tanggal, klinik_id, patient_id)

});

$(document).on('change', '#tanggal', function(e){
  tanggal = $(this).val()
  getWaktu(doctor_id, tanggal, klinik_id, patient_id)
});

$(document).on('change', '#patient_id', function(e){
  patient_id = $(this).val()
  getWaktu(doctor_id, tanggal, klinik_id, patient_id)
});

function getWaktu(doctor_id, tanggal, klinik_id, patient_id){
  $.ajax({
      url:"{{ route('dashboard.layanan.' . $module. '.getWaktu') }}",
      method:"GET",
      data: {
        doctor_id: doctor_id,
        tanggal: tanggal,
        klinik_id: klinik_id,
        patient_id: patient_id,
      },
      success:function(res){
        console.log(res);
        let html = ""
        $("#waktu").empty()
        $.each(res, function(k,v){
          html += `<option value="`+k+`">`+v+`</option>`
        })

        $("#waktu").html(html)

      }
    })
}

</script>
@endpush