@extends('cultural.plantillaDocente')
@section('scripts')
<link href="{{ asset('css/datatables.min.css') }}" rel="stylesheet">
<script src="{{ asset('js/datatables.min.js') }}"></script>
@endsection
@section('breadcrumb')

@endsection
@section('titulo', "Inscripciones")
@section('contenido')
<div class="col-9">
  @if(isset($msg))
  <div class="row">
    <div class="col-12 text-center">
      <div class="alert alert-secondary">
        <p>{{$msg}}</p>
      </div>
    </div>
  </div>
  @endif

  <div class="row">
    <div class="col-12">
      <div class="card mb-3">
        <div class="card-header">
          <h6 class="m-0 font-weight-bold" style="color:#FF0000;">Alumnos inscriptos</h6>
          <div class="pull-right">
            <a href="/docente/gestion-alumnos/nuevo" class="btn btn-cultural mr-3">Inscripción individual</a>
            <button type="button" class="btn btn-cultural mr-3" onclick="fAbrirModalExcel()">Inscripción masiva</button>
  
          </div>
        </div>
        <div class="panel-body p-2">
          <table id="grilla" class="display pt-2" style="width:100%">
            <thead>
              <tr>
                <th>Nombre y Apellido</th>
                <th>Documento</th>
                <th>Email</th>
                <th>Celular</th>
                <th>Examen</th>
                <th>Estado del pago</th>

              </tr>
            </thead>
          </table>
        </div>
      </div>
    </div>
  </div>
</div>

<div class="modal fade" id="modalExcel" tabindex="-1" role="dialog" aria-labelledby="modalExcelLabel" aria-hidden="true">
                <div class="modal-dialog" role="document">
                    <div class="modal-content">
                        <div class="modal-header">
                            <h5 class="modal-title" id="modalExcelLabel">Archivo</h5>
                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                <span aria-hidden="true">&times;</span>
                            </button>
                        </div>
                        <form method="POST" id="formArchivo" enctype="multipart/form-data" action="/importarExcel">
                        <input type="hidden" name="_token" value="{{ csrf_token() }}"></input>
                            <div class="modal-body">

                                <div class="row">
                                    <div class="col-12 form-group">
                                       <ul>
                                       <li><strong>Paso 1. </strong>Descargar el archivo excel desde el siguente link:</li> 
                                       <a style="font-style: italic;" href="/cultural/archivos/InscripcionalumnosCulturalInglesa.xlsx" download="InscripcionDeAlumnos" target="_blank"> Descargar excel</a> 
                                       <li><strong>Paso 2. </strong>Completar los datos.</li>
                                       <li><strong>Paso 3. </strong>Importar el archivo.</li>
                                      </ul>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-sm-12 form-group">
                                        <label><strong> Archivo Excel:</strong></label>
                                        <input type="file" id="excel" name="excel" class="form-control">
                                    </div>
                                </div>

                            </div>
                            <div class="modal-footer">
                                <button type="button" class="btn btn-secondary" data-dismiss="modal">Cerrar</button>
                                <button type="button" class="btn btn-primary" onclick="$('#formArchivo').submit();">Enviar</button>
                            </div>
                        </form>
                    </div>
                </div>
            </div>




<script>
 

  var dataTable = $('#grilla').DataTable({
            "processing": true,
            "serverSide": true,
            "bFilter": true,
            "bInfo": true,
            "bSearchable": true,
            "pageLength": 25,
            "order": [[ 0, "asc" ]],
            "ajax": "{{ route('alumno.cargarGrilla') }}"
        });

       function fAbrirModalExcel(){
        $('#modalExcel').modal('toggle');
       }
  
</script>

@endsection