@extends('templates.template')
@push('page-title')
<h2>Frequência</h2><br>
<p> </p>
@endpush
@section('content')

<h3>Frequência</h3>
<br>
<table class="table table-striped table-bordered" role="grid" aria-describedby="example_info" id="searchListarMatricula" width="100%">
	<thead>
		<tr>
			<th>#</th>
			<th>Aluno</th>
			<th>Situação</th>
      @if($role != 'professor')
			<th>Ações</th>
      @endif
		</tr>
	</thead>
	<tbody>
		
		<tr class="" data-url="{{ route('matriculas.detalhes', $aula['aluno_id']) }}">
			
			@foreach($matriculas as $key)
			<td>{{$key->id}}</td>
			<td>{{$key->aluno['nomecompleto']}}</td>
			
			@foreach($key->frequencias as $k)

				@if($k->aula_id == $aula->id)
					@if($k->situacao == 'P')
					<td style="text-align: left;"><span style="font-size: 20px; color: green; " class="glyphicon glyphicon-ok-circle"></span> PRESENTE  @if($role == 'professor')
					@else
						
					@endif</td>
					@else
					<td style="text-align: left;"><span style="font-size: 20px; color: red; " class="glyphicon glyphicon-remove-circle"></span>
					 AUSENTE ({{$k->justificativa['descricao']}}@if($k->justificativa == null)Sem Justificativa @endif) @if($role == 'professor') @else @if($k->documento == null) 
					@if($k->justificativa_id != 0) <a href="" data-toggle="modal" data-target="#exampleModalLong" id="{{$k->id}}" class="btnDocumento"  >Enviar Documento</a>

					@endif

					@else
					<a href="/documentosdejustificativas/{{$k->documento}}">Visualizar Documento</a>

					@endif
					@endif
					
					 </td>
 
					@endif
          @if($role != 'professor')
<td><a href="" id="{{$k->id}}"  data-toggle="modal" data-target="#editar" class="btnAlteracao btn btn-success">Editar</a></td>
@endif
				@endif
			@endforeach
			
			</tr>
			@endforeach
		
	</tbody>
</table>


<!-- Modal Enviar Documento -->
<div class="modal fade" id="exampleModalLong" tabindex="-1" role="dialog" aria-labelledby="exampleModalLongTitle" aria-hidden="true">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLongTitle">Enviar Documento</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
       {!! Form::open(['route' => 'frequencia.frequenciaDocumento.update', 'files'=>'true']) !!}
       {!! Form::file('documento', null, ['class'=>'form-control'])!!}
       {!! Form::hidden('campoid', null, ['class'=>'form-control', "id"=>"campoId"])!!}
       
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancelar</button>
        {!! Form::submit('Anexar', ['class'=>'btn btn-success']) !!}
      </div>
    </div>
       {!! Form::close() !!}
  </div>
</div>

<!-- Modal Editar-->
<div class="modal fade" id="editar" tabindex="-1" role="dialog" aria-labelledby="exampleModalLongTitle" aria-hidden="true">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLongTitle">Alterar Situação </h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
       {!! Form::open(['route' => 'frequencia.alterar', 'files'=>'true']) !!}
      		<input type="hidden" name="campoid" id="campoIdAlteracao">
      		<input type="hidden" name="campoPresente" id="campoPresente"> 

      		<div class="form-group">
      			<input  class="check" id="" type="checkbox" value="" checked="" >
      		</div>
      		<div class="form-group">
      		{!! Form::select('opAusente', $justificativas, null, ['class'=>'form-control opAusente ']) !!}
      		</div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancelar</button>
        {!! Form::submit('Salvar Alteração', ['class'=>'btn btn-success']) !!}
      </div>
    </div>
       {!! Form::close() !!}
  </div>
</div>

</div>	
@stop
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.mask/1.14.0/jquery.mask.min.js"></script>
<script src="bower_components/bootstrap-checkbox/dist/js/bootstrap-checkbox.min.js"></script>
<script type="text/javascript">
	var mask = function (val) {
    val = val.split(":");
    return (parseInt(val[0]) > 19)? "HZ:M0" : "H0:M0";
}

pattern = {
    onKeyPress: function(val, e, field, options) {
        field.mask(mask.apply({}, arguments), options);
    },
    translation: {
        'H': { pattern: /[0-2]/, optional: false },
        'Z': { pattern: /[0-3]/, optional: false },
        'M': { pattern: /[0-5]/, optional: false }
    },
    placeholder: 'hh:mm'
};

$(document).ready(function () {
  $("#QuantidadeHoras1").mask(mask, pattern);
  $("#QuantidadeHoras2").mask(mask, pattern);
  $("#QuantidadeHoras3").mask(mask, pattern);
  $("#QuantidadeHoras4").mask(mask, pattern);
});


</script>

 <script type="text/javascript">
  $(function() {
    $('.select2').selectpicker();
    $('.data').datetimepicker({
      format: 'DD/MM/YYYY'
    });
    // função para valores quebradoes
    $('.valor').mask('0.000,00', {reverse: true}).val();
      $('.valor').is(function(){
        $(this).mask('000.000,00', {reverse: true}).val();
      });
          $('.desconto').css('display', 'none');
     // $('#tipoMatricula').change(function(event) {
     //  var tipoMatricula =  $(this).val();
     //    if(tipoMatricula == 1 || tipoMatricula == 3){
     //      $('.desconto').css('display', 'table');
     //    }else{
     //      $('.desconto').css('display', 'none');
     //    }
     // });

  });
</script>
<script type="text/javascript">
	$(function() {
		$(".btnDocumento").click(function(){
			var id =$(this).prop('id');
			// alert(id)
			$("#campoId").val(id)

		});

		$(".btnAlteracao").click(function(){
			var id =$(this).prop('id');
			var value =$(this).data('dado')
			var matricula = $(this).data("matricula");
			
			    
			$("#campoIdAlteracao").val(id)	   
			$("#matricula").val(matricula);

		});

		$("#ausente").click(function(){
			// var id =$(this).prop('id');
			alert("oi")
			// $("#campoIdAlteracaoP").val(id)	    
			// $("#campoIdAlteracaoA").val(id)	    
		});
				
	});
</script>

@section('scripts')
{!! HTML::script('bower_components/bootstrap-checkbox/dist/js/bootstrap-checkbox.min.js') !!}
<script>
$('.check').checkboxpicker({
  html: true,
  offLabel: '<span class="glyphicon glyphicon-remove"> AUSENTE',
  onLabel: '<span class="glyphicon glyphicon-ok"> PRESENTE'
});

$('.opAusente').hide();

$(':checkbox').checkboxpicker().on('change', function() {
             
    if($(this).prop('checked') === false){
         $('.opAusente').show()
    	 $('#campoPresente').val('false')

    }else{
    	 $('.opAusente').hide()
    	 $('#campoPresente').val('true')

    }
 });
</script>
@endsection