@extends('layouts.master')
@section('content')
<div class="row page-titles">
	<div class="col-md-5 align-self-center">
	    <h4 class="text-themecolor">Master Parent</h4>
	</div>
	<div class="col-md-7 align-self-center text-right">
	    <div class="d-flex justify-content-end align-items-center">	        
	        <button type="button" class="btn btn-info btn-rounded" data-toggle="modal" data-target="#modal-edit" id="#AddParent"><i class="fa fa-plus-circle"></i> Create New Parent</button>
	    </div>
	</div>
</div>
<div class="row">
    <div class="col-12">
        <div class="card">
            <div class="card-body">
                <h4 class="card-title">Parent list</h4>
                <h6 class="card-subtitle"></h6>
                <div class="table-responsive">
                    <table id="dtable" class="table table-striped table-bordered">
                        <thead>
                            <tr>
                                <th>No</th>
                                <th>No KTP</th>
                                <th>Name</th>
                                <th>Email</th> 
                                <th>Relationship</th>     
                                <th>Children</th>                           
                                <th>Action</th>
                            </tr>
                        </thead>
                        <tbody>
                            
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
       </div>
    </div>
@include('master.parent.modal_edit')
@endsection
@section('js')

<script>
  // Switchery
   // $('select').select2();
   var save_method = 'add';
   var id_student;
    $(".js-example-basic-multiple").select2({
      placeholder: "Select"
    });
	var table = $("#dtable").DataTable({
        
          processing : true,
          serverSide : true,
          ordering    : false,
          
          ajax: {
            url :'parentData',
            type : 'get'
        },
          columns    : [
          
          
          {data : null, name : 'no'},
          {data : 'NIK', name : 'NIS'},
          {data : 'nama', name : 'nama_lengkap'},
          {data : 'user.email', name : 'kelamin'},
          {data : 'hub', name : 'status'},
           {data : 'child', name : 'status'},
          {data : 'action',  orderable: false, searchable: false},

          ],
          // columnDefs: [
          //   {
          //       "targets": 5, // your case first column
          //       "className": "text-center",
          //  },
          // ],
          // "order": [[ 1, 'asc' ]]
  });
  table.on('draw.dt', function () {
    var info = table.page.info();
    table.column(0, { search: 'applied', order: 'applied', page: 'applied' }).nodes().each(function (cell, i) {
        cell.innerHTML = i + 1 + info.start;
    });
	});

  $('.modal').on('hidden.bs.modal', function(){
    $(this).find('form')[0].reset();
     save_method = 'add';

     // $('.switchery').prop('checked', true).trigger("click");
  });
  $('#AddParent').click(function(){
    save_method = 'add';
    $('#p_nik').prop('disabled', false);
    $('#p_email').prop('disabled', false);
  })
  
  


function parents(NIS){
  dataParents(NIS);
  id_student = NIS;
  $('#new_parent').hide();
  $('#data_parents').show();
   $("#list_parent").DataTable().clear().destroy();
  var  table = $("#list_parent").DataTable({
       
          processing : true,
          serverSide : true,
          ordering    : false,
          pageLength : 5,
          lengthMenu: [[5, 10, 20, -1], [5, 10, 20, 'Todos']],
          ajax: {
            url :'student/listparent'+'/'+NIS,
            type : 'get',
            },
          columns    : [
          
          {data : null, name : 'null'},
          {data : 'NIK', name : 'NIK'},
          {data : 'nama', name : 'nama'},
          {data : 'email', name : 'email'},
          {data : 'hub', name : 'hub'},
          
         
          
          ],
          createdRow : function(row, datas, dataIndex){
                                $(row).find('td:eq(0)').html('<input type="checkbox" name="list['+dataIndex+']" value='+datas.NIK+'>')                            
                            },
  });
}
function show_form_parent(){
  $('#parent_form').get(0).reset();
  $('#p_category').val('new');
  $('#new_parent').show();
  $('#data_parents').hide();
}
function show_list_parent(){
  $('#parent_form').get(0).reset();
  $('#p_category').val('existing');
  $('#new_parent').hide();
  $('#data_parents').show();
}
$('#submitParent').click(function(){
  if(save_method == 'add'){

      var urls ='parent' ;
      var method = 'post';
      console.log("jjkk")
    }
    else if(save_method == 'edit'){
      var urls ='parent'+'/'+$('#p_nik').val();
      var method = 'put';
    }
  $.ajax({
      headers: {'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')},
      url : urls,
      type : method,
      data : $('#parent_form').serialize(),
      success: function(response){
      console.log(response);
      
       localStorage.setItem("swal",
                                    swal({
                                        title: 'success',
                                        text:  response['message'],
                                        type: response['type'],
                                        timer: 3500,
                                        showConfirmButton: false
                                    })
                            );
       if(response['type'] == 'success'){
         $('#modal-edit').modal('hide');
       }
     
      table.ajax.reload();
       $('#parent_form').get(0).reset();
      },
      error:function(xhr){
        localStorage.setItem("swal",
                                    swal({
                                        title: 'error',
                                        text:  xhr.status,
                                        type: 'error',
                                        timer: 3500,
                                        showConfirmButton: false
                                    })
                            );
      }
    });
});
function dataParents(nis){
  $("#dtparents").DataTable().clear().destroy();
  var  table = $("#dtparents").DataTable({
       
          processing : true,
          serverSide : true,
          ordering    : false,
         searching: false,
         paging:   false,
        ordering: false,
        info:     false,
          ajax: {
            url :'student/dtparents'+'/'+nis,
            type : 'get',
            },
          columns    : [
          
          {data : 'parent.NIK', name : 'NIK'},
          {data : 'parent.nama', name : 'nama'},
          {data : 'email', name : 'email'},
          {data : 'hub', name : 'hub'},
          {data : 'action', name : 'action'},
          
         
          
          ],
          
  });
}
function  destroy(nik){
   swal({
      title: "Are you sure?",
      text: "You will delete this Parent?",
      type: "warning",
      showCancelButton: true,
      confirmButtonColor: "#DD6B55",
      confirmButtonText: "Yes!",
      closeOnConfirm: true,
      showLoaderOnConfirm: true
      },
      function(isConfirm){
      if(isConfirm){
        console.log('confirm');
       $.ajax({
        headers: {'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')},
        url : 'parent'+'/'+nik,
        type : 'delete',
        dataType : 'json',
        success:function(response){
         table.ajax.reload();
          $('#parent_form').get(0).reset();
        localStorage.setItem("swal",
                      swal({
                          title: success,
                          text:  'data successfully deleted',
                          type: success,
                          timer: 3500,
                          showConfirmButton: false
                      })
              );
      
        },
        
        error:function(xhr){
          console.log(xhr)
         
          localStorage.setItem("swal",
                      swal({
                          title: 'Error',
                          text:  'data was not successfully deleted',
                          type: 'error',
                          timer: 3500,
                          showConfirmButton: false
                      })
              );

        }

       });
       
       }
      }); 

}
$('#p_email').on('keyup', function () {
    
    $.ajax({
      headers: {'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')},
      url : '/checkemail',
      type : 'post',
      data : {
        email : $('#p_email').val()
      },
      success:function(response){
        if(response == false){
          $('#message').html('e-mail already used').css('color', 'red');
        }
        else{
          $('#message').html('');
        }
      }
    })
});
function editParent(NIK){
    save_method = 'edit';
    $('#modal-edit').modal('show');
    $.ajax({
     url : 'parent'+'/'+NIK+'/edit',
     type: 'get',
      
      success:function(response){
        console.log(response);
        $('#p_nik').val(response.parent.NIK).prop('disabled', true);
        $('#p_nama').val(response.parent.nama);
        $('#p_email').val(response.parent.user.email).prop('disabled', true);
        $('#p_hp').val(response.parent.no_hp).trigger('change');
        $('#p_hub').val(response.parent.relationship).trigger('change');

        $('#p_students').val(response.students).change();

        save_method = 'edit';
      },
      error:function(xhr){
        console.log(xhr)
      }
  })
  }
</script>
@endsection