@extends('layouts.master')
@section('content')
<div class="row page-titles">
	<div class="col-md-5 align-self-center">
	    <h4 class="text-themecolor">Yearly Program</h4>
	</div>
	<div class="col-md-7 align-self-center text-right">
	    <div class="d-flex justify-content-end align-items-center">	        
	        
	    </div>
	</div>
</div>
<div class="row">
    <div class="col-12">
        <div class="card">
            <div class="card-body">
                <div class="col-3">
                  <h6 class="card-title">Current School Year <span class="badge badge-pill badge-success">{{$current->meta_value}}</span>

                </h6>
                </div>
                @if (empty($periode))
                  <div class="col-3">
                  <button type="button" class="btn btn-rounded btn-block btn-outline-info generate"><i class="fa fa-plus-circle" ></i> Generate Period</button>
                </div>
                @else
                  <div class="table-responsive" id="tableMaster">
                   
                  </div>
                @endif
                 
            </div>
        </div>
       </div>
    </div>

@endsection
@include('master.yearly.modal_edit')
@section('js')

<script>
  // Switchery
   // $('select').select2();
   var periodes;
   var save_method = 'add';
   tableMaster();
    var elems = Array.prototype.slice.call(document.querySelectorAll('.js-switch'));
    $('.js-switch').each(function() {
        new Switchery($(this)[0], $(this).data());
    });
    jQuery('#date-range').datepicker({
        toggleActive: true,
        format: 'yyyy-mm-dd',
        todayHighlight: true
    });
    $('.input-daterange-datepicker').daterangepicker({
        buttonClasses: ['btn', 'btn-sm'],
        applyClass: 'btn-danger',
        cancelClass: 'btn-inverse'
    });
	

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

     // $('.switchery').prop('checked', true).trigger("click");
  });

  $('#AddUser').click(function(){
    $('.switchery').prop('checked', true).trigger("click");
  })
  $('#submitYearly').click(function(){
    console.log(save_method)
    if(save_method == 'add'){

      var urls ='yearly' ;
      var method = 'post';
      
    }
    else if(save_method == 'edit'){
      var urls ='yearly'+'/'+$('#id_yearly_program').val();
      var method = 'put';
    }

    $.ajax({
      headers: {'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')},
      url : urls,
      type : method,
      data : $('#yearly_form').serialize(),
      success: function(response){
      console.log(response);
      dtableDetail();
      var id_yearly_periode = $('#id_yearly_periode').val();
      $('#yearly_form').get(0).reset();
      $('#id_yearly_periode').val(id_yearly_periode);
      tableMaster();
       localStorage.setItem("swal",
                                    swal({
                                        title: 'success',
                                        text:  'Data berhasil disimpan',
                                        type: 'success',
                                        timer: 3500,
                                        showConfirmButton: false
                                    })
                            );
      // table.ajax.reload();
      },
      error:function(xhr){
        console.log(xhr);
      }

    });

  })
  

  $('.generate').click(function(){
    swal({
      title: "Are you sure?",
      text: "You will generate 12 month for Yearly Program?",
      type: "warning",
      showCancelButton: true,
      confirmButtonColor: "#DD6B55",
      confirmButtonText: "Yes!",
      closeOnConfirm: true,
      showLoaderOnConfirm: true
      },
      function(isConfirm){
      if(isConfirm){
        console.log('confirm');
       $.ajax({
        url : 'yearly/generate_period',
        type : 'get',
        dataType : 'json',
        success:function(response){
          localStorage.setItem("swal",
                      swal({
                          title: 'success',
                          text:  '12 months for Yearly Program successfully created',
                          type: 'success',
                          // timer: 3500,
                          showConfirmButton: true,
                          showLoaderOnConfirm: true,
                          
                      },
                      function(isConfirm){
                        location.reload();
                          })
              );
          
        },
        error:function(xhr){
          console.log(xhr);
        }
       });

       }
      });
       
  });
 function detail_yearly(id_periode,periode){
  periodes = id_periode;
  save_method = 'add';
  $.ajax({
    url : 'yearly/search_periode'+'/'+id_periode,
    type : 'get',
    success: function(response){
      $('#title_period').html(periode)
      console.log(response);
    }
  })
  $('#id_yearly_periode').val(id_periode);
  dtableDetail();
 }
 $('#modal-edit').on('show.bs.modal',function(){
    
 })
 function edit(id){
  console.log("masuk edit")
  save_method = 'edit';
  $.ajax({
    url : 'yearly/detail'+'/'+id,
    type : 'get',
    success: function(response){
      console.log(response);
      $("#id_yearly_program").val(response.id);
      $("#id_yearly_periode").val(response.id_yearly_periode);
      $("#start").val(response.tanggal_awal);
      $("#end").val(response.tanggal_akhir);
      $("#activity").val(response.kegiatan);
      $("#keterangan").val(response.keterangan);

    }
  })
  
 }
 function destroy(id){
  swal({
      title: "Are you sure?",
      text: "You will delete this Yearly Program?",
      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 : 'yearly'+'/'+id,
        type : 'delete',
        dataType : 'json',
        success:function(response){
          dtableDetail();
          tableMaster();
          localStorage.setItem("swal",
                      swal({
                          title: 'success',
                          text:  'data successfully deleted',
                          type: 'success',
                          timer: 3500,
                          showConfirmButton: false
                      })
              );
      
        },
        
        error:function(xhr){
          console.log(xhr)
          dtableDetail();
          localStorage.setItem("swal",
                      swal({
                          title: 'Error',
                          text:  'data was not successfully deleted',
                          type: 'error',
                          timer: 3500,
                          showConfirmButton: false
                      })
              );

        }

       });
       
       }
      }); 

 }
 function dtableDetail(){
        $('#dt-add-activity-detail').DataTable().clear();
        $('#dt-add-activity-detail').DataTable().destroy();
        $('#dt-add-activity-detail').DataTable({
                processing : true,
                serverSide : true,
                ordering   : false,
                
                fixedColumns: true,
                ajax: {
                          url :'yearly/search_periode'+'/'+periodes,
                          type : 'get'
                      },
                columns    : [
                {data : 'range', name : 'no'},
                {data : 'kegiatan', name : 'kegiatan'},
                {data : 'keterangan', name : 'tanggal_akhir'},
                {data : 'action', name : 'kegiatan'},

                ],
          });
 }
 function tableMaster(){
  $.ajax({
    url : 'yearly/load/table-master',
    type : 'get',
    success: function(response){
      console.log(response);
      $('#tableMaster').empty();
      $('#tableMaster').append(response);

    }
  })
  
  
 }
</script>
@endsection