@extends('layouts.master_panel')

@section('title') Pointage des heures de travail @stop

@section('CSS') 


<link rel="stylesheet" type="text/css" href="{{url('/')}}/js/datatables/dataTables.bootstrap4.min.css">

<link rel="stylesheet" href="{{url('/')}}/assets/vendor/datepicker/tempusdominus-bootstrap-4.css" />


@stop

@section('JS') 


<script src="{{url('/')}}/js/datatables/jquery.dataTables.min.js"></script>
<script src="{{url('/')}}/js/datatables/dataTables.bootstrap4.min.js"></script>

<script type="text/javascript" class="init">
  $(document).ready(function() {
    $("#example").dataTable({ "language": { "url": "{{ url('/') }}/js/datatables/lang/fr.json" },
      "order": [[ 0, "desc" ]]
    });
  });
  </script>


<script src="{{url('/')}}/assets/vendor/datepicker/moment.js"></script>
<script src="{{url('/')}}/assets/vendor/datepicker/tempusdominus-bootstrap-4.js"></script>
<script src="{{url('/')}}/assets/vendor/datepicker/datepicker.js"></script>

<script src="{{url('/')}}/assets/vendor/datepicker/fr.js"></script>

<script type="text/javascript">
    $(function () {
        $('#datetimepickerdate').datetimepicker({
          format: 'DD/MM/YYYY',
          locale: 'fr'
      });
    });

</script>





<script type="text/javascript">
$(document).ready(function () { 

  $('.presentBox').change(function() {

      var id = this.id;
      var idSplit = id.split("-");

      if(this.checked) {
        $('#is_present'+idSplit[1]).val('1');

        $('#is_absent'+idSplit[1]).val('0'); 
        $('#is_retard'+idSplit[1]).val('0'); 

        $('#IsAbsent-'+idSplit[1]).prop('checked', false); 
        $('#IsRetard-'+idSplit[1]).prop('checked', false); 

        $(".retard-section-"+idSplit[1]).css({"display":"none"});

        
      } else {
        $('#is_present'+idSplit[1]).val('0'); 
      } 
  
  });

  $('.absentBox').change(function() {

      var id = this.id;
      var idSplit = id.split("-");

      if(this.checked) {
        $('#is_absent'+idSplit[1]).val('1'); 

        $('#is_present'+idSplit[1]).val('0'); 
        $('#is_retard'+idSplit[1]).val('0'); 

        $('#IsPresent-'+idSplit[1]).prop('checked', false); 
        $('#IsRetard-'+idSplit[1]).prop('checked', false); 

        $(".retard-section-"+idSplit[1]).css({"display":"none"});

      } else {
        $('#is_absent'+idSplit[1]).val('0'); 
      } 
  
  });

  $('.retardBox').change(function() {

      var id = this.id;
      var idSplit = id.split("-");

      if(this.checked) {
        $('#is_retard'+idSplit[1]).val('1'); 

        $('#is_present'+idSplit[1]).val('0'); 
        $('#is_absent'+idSplit[1]).val('0'); 

        $('#IsPresent-'+idSplit[1]).prop('checked', false); 
        $('#IsAbsent-'+idSplit[1]).prop('checked', false);

        $(".retard-section-"+idSplit[1]).css({"display":"block"});

      } else {
        $('#is_retard'+idSplit[1]).val('0'); 
      } 
  
  });

});
</script>


@stop


@section('content')


                  <!-- ============================================================== -->
                  <!-- pageheader  -->
                  <!-- ============================================================== -->
                  <div class="row">
                      <div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                          <div class="page-header">
                              <h3 class="mb-2">Pointage des heures de travail</h3>
                           
                              <div class="page-breadcrumb">
                                  <nav aria-label="breadcrumb">
                                      <ol class="breadcrumb">
                                          <li class="breadcrumb-item active" aria-current="page">Pointage des heures de travail</li>
                                      </ol>
                                  </nav>
                              </div>
                          </div>
                      </div>
                  </div>
                  <!-- ============================================================== -->
                  <!-- end pageheader  -->
                  <!-- ============================================================== -->


<div class="row">


<div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
  <div class="card">
  <div class="card-body">


@if(Session::has('error'))

<div class="alert alert-danger alert-dismissible fade show text-center" role="alert">
  <strong>{{ Session::get('error') }}</strong>
  <button type="button" class="close" data-dismiss="alert" aria-label="Close">
    <span aria-hidden="true">&times;</span>
  </button>
</div>

@endif

@if(Session::has('success'))
<div class="alert alert-success alert-dismissible fade show text-center" role="alert">
  <strong>{{ Session::get('success') }}</strong>
  <button type="button" class="close" data-dismiss="alert" aria-label="Close">
    <span aria-hidden="true">&times;</span>
  </button>
</div>
@endif

<div class="clearfix"></div>

@if(isset($_GET['date']))