@extends('layouts.app')
{{-- title --}}
@section('title','Siswa')
{{-- vendor scripts --}}
@section('vendor-styles')
<link rel="stylesheet" type="text/css" href="{{asset('vendors/css/forms/select/select2.min.css')}}">
<link rel="stylesheet" type="text/css" href="{{asset('vendors/css/pickers/pickadate/pickadate.css')}}">
<link rel="stylesheet" type="text/css" href="{{asset('vendors/css/extensions/toastr.css')}}">
@endsection
{{-- page-styles --}}
@section('page-styles')
<link rel="stylesheet" type="text/css" href="{{asset('css/plugins/forms/validation/form-validation.css')}}">
<link rel="stylesheet" type="text/css" href="{{asset('css/plugins/extensions/toastr.css')}}">
@endsection
@section('content')

<!-- Multiple Rules Validation start -->
<section class="multiple-validation">
<div class="row">


        <!-- START TAB AND NAV UL Question -->
        <div class="col-sm-12">
            <ul class="nav nav-tabs" role="tablist">

           

              <li class="nav-item">
                <a class="nav-link" id="profile-tab " data-toggle="tab" href="#profile" aria-controls="profile" role="tab" aria-selected="false">
                  <i class="bx bx-user-voice align-middle"></i>
                  <span class="align-middle">Profil</span>
                </a>
              </li>

              <!--Upload Data-->
              <li class="nav-item">
                <a class="nav-link" id="edit-face-tab" data-toggle="tab" href="#edit-face" aria-controls="edit-face" role="tab" aria-selected="true">
                  <i class="bx bx-user align-middle"></i>
                  <span class="align-middle">Status Family</span>
                </a>
              </li>
              <!--Upload Data-->

              <li class="nav-item">
                <a class="nav-link " id="edit-school-tab" data-toggle="tab" href="#edit-school" aria-controls="edit-school" role="tab" aria-selected="true">
                  <i class="bx bx-home align-middle"></i>
                  <span class="align-middle">Data Asal Sekolah</span>
                </a>
              </li>

              <!--Data Orang Tua-->
              <li class="nav-item">
                <a class="nav-link" id="ortu-tab" data-toggle="tab" href="#edit-ortu" aria-controls="edit-ortu" role="tab" aria-selected="true">
                  <i class="bx bx-user align-middle"></i>
                  <span class="align-middle">Data Orang Tua</span>
                </a>
              </li>
              <!--Akhir Data Orang Tua Data-->

              <li class="nav-item">
                <a class="nav-link " id="edit-profile-tab" data-toggle="tab" href="#edit-profile" aria-controls="edit-profile" role="tab" aria-selected="true">
                  <i class="bx bx-book align-middle"></i>
                  <span class="align-middle">Question</span>
                </a>
              </li>



            


            </ul>





                <div class="tab-content ">
                    <div class="tab-pane" id="profile" aria-labelledby="profile-tab" role="tabpanel">
                    @include('pages.kesiswaan.students.pribadi')
                      
                </div>

                <div class="tab-pane " id="edit-school" aria-labelledby="edit-school-tab" role="tabpanel">
                    <!-- START ROW FORM SCHOOL -->
                    <div class="row">

                    <div class="col-sm-6">
                        <div class="form-group">
                        <label>Asal Sekolah</label>
                        <div class="controls form-label-group position-relative has-icon-left">
                            <input type="text" readonly name="asal_sekolah" id="asal_sekolah" class="form-control  @error('asal_sekolah') is-invalid @enderror" placeholder="Nama Asal Sekolah" required data-validation-required-message="This Asal Sekolah field is required" value="{{isset($detail_student) ? $detail_student->asal_sekolah : old('asal_sekolah')}}" autocomplete="off">
                            <div class="form-control-position">
                            <i class="bx bx-edit-alt"></i>
                            </div>
                            <!-- Error Message -->
                            @error('asal_sekolah')
                            <div class="help-block">
                            <ul role="alert">
                                <li>{{ $message }}</li>
                            </ul>
                            </div>
                            @enderror
                        </div>
                        </div>
                    </div>



                    <div class="col-sm-6">
                        <div class="form-group">
                        <label>NPSN (Nomor Pokok Sekolah Nasional)</label>
                        <div class="controls form-label-group position-relative has-icon-left">
                            <input type="text" readonly name="npsn_asal" id="npsn_asal" class="form-control  @error('name') is-invalid @enderror" placeholder="NPSN Asal Sekolah" required data-validation-required-message="This NPSN field is required" value="{{isset($detail_student) ? $detail_student->npsn_asal : old('npsn_asal')}}" autocomplete="off">
                            <div class="form-control-position">
                            <i class="bx bx-edit-alt"></i>
                            </div>
                            <!-- Error Message -->
                            @error('npsn_asal')
                            <div class="help-block">
                            <ul role="alert">
                                <li>{{ $message }}</li>
                            </ul>
                            </div>
                            @enderror
                        </div>
                        </div>
                    </div>




                    <div class="col-sm-12">
                        <div class="form-group">
                        <label>Alamat Asal Sekolah</label>
                        <div class="controls form-label-group position-relative has-icon-left">
                            <input type="text" readonly name="address_school" id="address_school" class="form-control  @error('address_school') is-invalid @enderror" placeholder="Alamat Asal Sekolah" required data-validation-required-message="This Alamat Asal Sekolah field is required" value="{{isset($detail_student) ? $detail_student->address_school : old('address_school')}}" autocomplete="off">
                                <div class="form-control-position">
                                <i class="bx bx-edit-alt"></i>
                                </div>
                            <!-- Error Message -->
                            @error('address')
                            <div class="help-block">
                            <ul role="alert">
                                <li>{{ $message }}</li>
                            </ul>
                            </div>
                            @enderror
                        </div>
                        </div>
                    </div>

                    </div>
                    <!-- AKHIR ROW FORM SCHOOL --> 
                </div>


                <div class="tab-pane " id="edit-profile" aria-labelledby="edit-profile-tab" role="tabpanel">
                  
                <div class="row"><!--AKHIR ROW-->

                  <div class="col-sm-6">
                    <div class="form-group">
                      <label>Siswa Siap Untuk Tidak Membawa Gadget / Smartphone, dan Kendaraan Bermotor Ke Sekolah</label>
                      <div class="controls form-label-group position-relative has-icon-left">
                        <input type="text" readonly autocomplete="off" name="quest1" class="form-control" value="{{isset($detail_student) ? $detail_student->quest1 : old('quest1')}}">

                        <div class="form-control-position">
                          <i class="bx bx-edit-alt"></i>
                        </div>
                      </div>
                    </div>
                  </div>

                    <div class="col-sm-6">
                      <div class="form-group">
                        <label>Siswa siap untuk tidak menjalin hubungan khusus dengan lawan jenis baik secara langsung ataupun di dunia maya</label>
                        <div class="controls form-label-group position-relative has-icon-left">
                          <input type="text" readonly autocomplete="off" name="quest2" class="form-control" value="{{isset($detail_student) ? $detail_student->quest2 : old('quest2')}}">
                          <div class="form-control-position">
                            <i class="bx bx-edit-alt"></i>
                          </div>
                          
                        </div>
                      </div>
                    </div>

                    <div class="col-sm-6">
                      <div class="form-group">
                        <label>Siswa mampu untuk mencapai target yang ditentukan sekolah baik dalam bidang Akhlak, Al Qur'an, dan Akademik</label>
                        <div class="controls form-label-group position-relative has-icon-left">
                          <input type="text" readonly autocomplete="off" name="quest3" class="form-control" value="{{isset($detail_student) ? $detail_student->quest3 : old('quest3')}}">
                          <div class="form-control-position">
                            <i class="bx bx-edit-alt"></i>
                          </div>
                          
                        </div>
                      </div>
                    </div>

                    <div class="col-sm-6">
                      <div class="form-group">
                        <label>Siswa mampu dan siap secara sadar untuk dapat menaati Peraturan Sekolahan Qur'an Darul Fattah</label>
                        <div class="controls form-label-group position-relative has-icon-left">
                          <input type="text" readonly autocomplete="off" name="quest4" class="form-control" value="{{isset($detail_student) ? $detail_student->quest4 : old('quest4')}}">
                          <div class="form-control-position">
                            <i class="bx bx-edit-alt"></i>
                          </div>
                          
                        </div>
                      </div>
                    </div>

                  </div><!--END ROW-->
                </div>


                         
              
                <!-- START ORTU -->
                <div class="tab-pane" id="edit-ortu" aria-labelledby="edit-ortu-tab" role="tabpanel">
                    
                <!-- START ROW FORM DATA PARENT -->
                    <div class="row">


                    <div class="col-sm-6">
                        <h4 class="button">Data Ayah</h4>
                        <div class="form-group">
                        <label>Nama Ayah</label>
                        <div class="controls form-label-group position-relative has-icon-left">
                            <input type="text" name="name_father" id="name_father" class="form-control  @error('name') is-invalid @enderror" placeholder="Nama Ayah" required data-validation-required-message="This Jumlah Sudara field is required" value="{{isset($detail_student) ? $detail_student->name_father : old('name_father')}}" autocomplete="off">
                            <div class="form-control-position">
                            <i class="bx bx-edit-alt"></i>
                            </div>
                            <!-- Error Message -->
                            @error('name')
                            <div class="help-block">
                            <ul role="alert">
                                <li>{{ $message }}</li>
                            </ul>
                            </div>
                            @enderror
                        </div>
                        </div>
                    </div>




                    <div class="col-sm-6">
                    <h4>Data Ibu</h4>

                        <div class="form-group">
                        <label>Nama Ibu</label>
                        <div class="controls form-label-group position-relative has-icon-left">
                            <input type="text" name="name_mother" id="name_mother" class="form-control  @error('name') is-invalid @enderror" placeholder="Nama Ibu" required data-validation-required-message="This Jumlah Sudara field is required" value="{{isset($detail_student) ? $detail_student->name_mother : old('name_mother')}}" autocomplete="off">
                            <div class="form-control-position">
                            <i class="bx bx-edit-alt"></i>
                            </div>
                            <!-- Error Message -->
                            @error('name')
                            <div class="help-block">
                            <ul role="alert">
                                <li>{{ $message }}</li>
                            </ul>
                            </div>
                            @enderror
                        </div>
                        </div>
                    </div>


                    <div class="col-sm-6">
                        <div class="form-group">
                        <label>No HP Ayah</label>
                        <div class="controls form-label-group position-relative has-icon-left">
                            <input type="text" name="phone_father" id="phone_father" class="form-control  @error('name') is-invalid @enderror" placeholder="No HP Ayah" required data-validation-required-message="This Jumlah Sudara field is required" value="{{isset($detail_student) ? $detail_student->phone_father : old('phone_father')}}" autocomplete="off">
                            <div class="form-control-position">
                            <i class="bx bx-edit-alt"></i>
                            </div>
                            <!-- Error Message -->
                            @error('name')
                            <div class="help-block">
                            <ul role="alert">
                                <li>{{ $message }}</li>
                            </ul>
                            </div>
                            @enderror
                        </div>
                        </div>
                    </div>



                    <div class="col-sm-6">
                        <div class="form-group">
                        <label>No HP Ibu</label>
                        <div class="controls form-label-group position-relative has-icon-left">
                            <input type="text" name="phone_mother" id="phone_mother" class="form-control  @error('name') is-invalid @enderror" placeholder="No HP Ibu" required data-validation-required-message="This Jumlah Sudara field is required" value="{{isset($detail_student) ? $detail_student->phone_mother : old('phone_mother')}}" autocomplete="off">
                            <div class="form-control-position">
                            <i class="bx bx-edit-alt"></i>
                            </div>
                            <!-- Error Message -->
                            @error('name')
                            <div class="help-block">
                            <ul role="alert">
                                <li>{{ $message }}</li>
                            </ul>
                            </div>
                            @enderror
                        </div>
                        </div>
                    </div>


                    <div class="col-sm-6">
                        <div class="form-group">
                        <label>Pendidikan Ayah</label>
                        <div class="controls form-label-group position-relative has-icon-left">
                            <input type="text" name="education_father"  id="education_father" class="form-control  @error('name') is-invalid @enderror" placeholder="Pendidikan Ayah" required data-validation-required-message="This Jumlah Sudara field is required" value="{{isset($detail_student) ? $detail_student->education_father : old('education_father')}}" autocomplete="off">
                            <div class="form-control-position">
                            <i class="bx bx-edit-alt"></i>
                            </div>
                            <!-- Error Message -->
                            @error('name')
                            <div class="help-block">
                            <ul role="alert">
                                <li>{{ $message }}</li>
                            </ul>
                            </div>
                            @enderror
                        </div>
                        </div>
                    </div>




                    <div class="col-sm-6">
                        <div class="form-group">
                        <label>Pendidikan Ibu</label>
                        <div class="controls form-label-group position-relative has-icon-left">
                            <input type="text" name="education_mother" id="education_mother" class="form-control  @error('name') is-invalid @enderror" placeholder="Pendidikan Ibu" required data-validation-required-message="This Jumlah Sudara field is required" value="{{isset($detail_student) ? $detail_student->education_mother : old('education_mother')}}" autocomplete="off">
                            <div class="form-control-position">
                            <i class="bx bx-edit-alt"></i>
                            </div>
                            <!-- Error Message -->
                            @error('name')
                            <div class="help-block">
                            <ul role="alert">
                                <li>{{ $message }}</li>
                            </ul>
                            </div>
                            @enderror
                        </div>
                        </div>
                    </div>





                    <div class="col-sm-6">
                        <div class="form-group">
                        <label>Pekerjaan Ayah</label>
                        <div class="controls form-label-group position-relative has-icon-left">
                            <input type="text" id="job_father" name="job_father"  class="form-control  @error('name') is-invalid @enderror" placeholder="Pekerjaan Ayah" required data-validation-required-message="This Jumlah Sudara field is required" value="{{isset($detail_student) ? $detail_student->job_father : old('job_father')}}" autocomplete="off">
                            <div class="form-control-position">
                            <i class="bx bx-edit-alt"></i>
                            </div>
                            <!-- Error Message -->
                            @error('name')
                            <div class="help-block">
                            <ul role="alert">
                                <li>{{ $message }}</li>
                            </ul>
                            </div>
                            @enderror
                        </div>
                        </div>
                    </div>



                    <div class="col-sm-6">
                        <div class="form-group">
                        <label>Pekerjaan Ibu</label>
                        <div class="controls form-label-group position-relative has-icon-left">
                            <input type="text" name="job_mother" id="job_mother" class="form-control  @error('name') is-invalid @enderror" placeholder="Pekerjaan Ibu" required data-validation-required-message="This Jumlah Sudara field is required" value="{{isset($detail_student) ? $detail_student->job_mother : old('job_mother')}}" autocomplete="off">
                            <div class="form-control-position">
                            <i class="bx bx-edit-alt"></i>
                            </div>
                            <!-- Error Message -->
                            @error('name')
                            <div class="help-block">
                            <ul role="alert">
                                <li>{{ $message }}</li>
                            </ul>
                            </div>
                            @enderror
                        </div>
                        </div>
                    </div>





                    <div class="col-sm-6">
                        <div class="form-group">
                        <label>Penghasilan Ayah</label>
                        <div class="controls form-label-group position-relative has-icon-left">
                            <input type="text" name="income_father" id="income_father"  class="form-control  @error('name') is-invalid @enderror" placeholder="Penghasilan Ayah" required data-validation-required-message="This Jumlah Sudara field is required" value="{{isset($detail_student) ? $detail_student->income_father : old('income_father')}}" autocomplete="off">
                            <div class="form-control-position">
                            <i class="bx bx-edit-alt"></i>
                            </div>
                            <!-- Error Message -->
                            @error('name')
                            <div class="help-block">
                            <ul role="alert">
                                <li>{{ $message }}</li>
                            </ul>
                            </div>
                            @enderror
                        </div>
                        </div>
                    </div>


                    <div class="col-sm-6">
                        <div class="form-group">
                        <label>Penghasilan Ibu</label>
                        <div class="controls form-label-group position-relative has-icon-left">
                            <input type="text" name="income_mother" id="income_mother"  class="form-control  @error('name') is-invalid @enderror" placeholder="Penghasilan Ibu" required data-validation-required-message="This Jumlah Sudara field is required" value="{{isset($detail_student) ? $detail_student->income_mother : old('income_mother')}}" autocomplete="off">
                            <div class="form-control-position">
                            <i class="bx bx-edit-alt"></i>
                            </div>
                            <!-- Error Message -->
                            @error('name')
                            <div class="help-block">
                            <ul role="alert">
                                <li>{{ $message }}</li>
                            </ul>
                            </div>
                            @enderror
                        </div>
                        </div>
                    </div>

                    </div>
                    <!-- AKHIR ROW FORM PARENT -->

                </div>
                <!-- AKHIR ORTU -->




                <!-- STRAT UPLOAD DATA FAMILY-->
                <div class="tab-pane" id="edit-face" aria-labelledby="edit-face-tab" role="tabpanel">
                  <div class="row"><!--AKHIR ROW-->

                    <div class="col-sm-6">
                      <div class="form-group">
                        <label>Jumlah Saudara</label>
                        <div class="controls form-label-group position-relative has-icon-left">
                          <input type="text" readonly autocomplete="off" name="jumlah_saudara" class="form-control" value="{{isset($detail_student) ? $detail_student->jumlah_saudara : old('jumlah_saudara')}}">

                          <div class="form-control-position">
                            <i class="bx bx-edit-alt"></i>
                          </div>
                        </div>
                      </div>
                    </div>

                      <div class="col-sm-6">
                        <div class="form-group">
                          <label>Anak Ke-</label>
                          <div class="controls form-label-group position-relative has-icon-left">
                            <input type="text" readonly autocomplete="off" name="anakke_personal" class="form-control" value="{{isset($detail_student) ? $detail_student->anakke_personal : old('anakke_personal')}}">
                            <div class="form-control-position">
                              <i class="bx bx-edit-alt"></i>
                            </div>
                            
                          </div>
                        </div>
                      </div>

                  </div><!--END ROW-->

                </div>
                <!-- AKHIR UPLOAD -->



</div>
</section>
<!-- Multiple Rule Validation end -->

@endsection
{{-- vendor scripts --}}
@section('vendor-scripts')
<script src="{{asset('vendors/js/forms/select/select2.full.min.js')}}"></script>
<script src="{{asset('vendors/js/forms/validation/jqBootstrapValidation.js')}}"></script>
<script src="{{asset('vendors/js/pickers/pickadate/picker.js')}}"></script>
<script src="{{asset('vendors/js/pickers/pickadate/picker.date.js')}}"></script>
@endsection

{{-- page scripts --}}
@section('page-scripts')
<script src="{{asset('js/scripts/forms/select/form-select2.js')}}"></script>
<script src="{{asset  ('js/scripts/forms/validation/form-validation.js')}}"></script>
<script src="{{asset('vendors/js/extensions/toastr.min.js')}}"></script>



<script>
  $(document).ready(function() {


    // Basic date
    $('.pickadate').pickadate({
      format: 'yyyy-mm-dd',
      selectYears: true,
      selectMonths: true
    });


    $('#level_year').select2({
      data: @php echo json_encode($level_year) @endphp,
      placeholder: 'Pilih Tahun Angkatan'
    });
    $('#level_year').val("@php echo $student->level_year @endphp").change().prop("disabled", true);

    $('#gender').select2({
      data: @php echo json_encode($gender) @endphp,
      placeholder: 'Pilih Jenis Kelamin'
    });
    $('#gender').val("@php echo $student->gender @endphp").change().prop("disabled", true);

    $('#agama').select2({
      data: @php echo json_encode($agama) @endphp,
      placeholder: 'Pilih Agama'
    });
    $('#agama').val("@php echo $student->agama @endphp").change().prop("disabled", true);


    $('#kewarganegaraan').select2({
      data: @php echo json_encode($kewarganegaraan) @endphp,
      placeholder: 'Pilih Kewarganegaraan'
    });
    $('#kewarganegaraan').val("@php echo $student->kewarganegaraan @endphp").change().prop("disabled", true);

    $('#category_room').select2({
      data: @php echo json_encode($category_room) @endphp,
      placeholder: 'Pilih Category Room'
    });
    $('#category_room').val("@php echo $student->category_room @endphp").change().prop("disabled", true);

    $('#student_grade').select2({
      data: @php echo json_encode($student_grade) @endphp,
      placeholder: 'Pilih Jenjang Siswa'
    });
    $('#student_grade').val("@php echo $student->student_grade @endphp").change().prop("disabled", true);

    $('#status').select2({
      data: @php echo json_encode($status) @endphp,
      placeholder: 'Pilih Status Siswa'
    });
    $('#status').val("@php echo $student->status @endphp").change().prop("disabled", true);

    $('#school').select2({
      data: @php echo json_encode($school) @endphp,
      placeholder: 'Pilih Sekolah'
    });
    $('#school').val("@php echo $student->school @endphp").change().prop("disabled", true);


    $('#room_id').select2({
      data: @php echo json_encode($room_id) @endphp,
      placeholder: 'Pilih Kelas'
    });
    $('#room_id').val("@php echo $student->room_id @endphp").change().prop("disabled", true);



    $(document).on('click', '.show-doc', function (e) {
      const file_name = $(this).attr("data-name")
      window.open(`${api}/master-data/users/show-document/${file_name}`, '_blank');
    })
 
  });


</script>





@endsection