@extends('template.main')

@section('titulo','Agregar Nuevo Grupo')

@section('cabecera')
<script>
    $(document).ready(function () {
        $("#modalidad").change(function(){
            var plan = $("#plan").val();
            var modalidad = $("#modalidad").val();
            $.ajax({
                data: {"modalidad": modalidad,"parametro":1},
                type: "GET",
                url: "{{ route('alumnos.nivel') }}",

                beforeSend: function(){
                    $('#carreraElemento').html("<center><img src=\"{{ asset('img/loading.gif') }}\" style=\"max-width: 100px\"></center>");
                },

                success: function(response){

                    $('#carreraElemento').html(response);

                }
            });
            $.ajax({
                data: {"plan": plan, "tipoEstudio": tipoEstudio},
                type: "GET",
                url: "{{ route('alumnos.plan.generacion') }}",

                beforeSend: function(){
                    $('#salidaGeneracion').html("<center><img src=\"{{ asset('img/loading.gif') }}\" style=\"max-width: 100px\"></center>");
                },

                success: function(response){

                    $('#salidaGeneracion').html(response);

                }
            });

        });
        $("#parciales").change(function(){
            var parciales = $("#parciales").val();
            $.ajax({
                data: {"parciales": parciales},
                type: "GET",
                url: "{{ route('grupos.fechas1') }}",

                beforeSend: function(){
                    $('#fechas').html("<center><img src=\"{{ asset('img/loading.gif') }}\" style=\"max-width: 100px\"></center>");
                },

                success: function(response){

                    $('#fechas').html(response);

                }
            });

        });
    });
</script>
@endsection

@section('contenido')
    <div class="row" >
        <div class="col-lg-12">
            <div class="col-lg-12">
                <nav aria-label="breadcrumb">
                    <ol class="breadcrumb">
                        <li class="breadcrumb-item"><a href="{{ route('home') }}"><i class="fas fa-home"></i> Inicio </a></li>
                        <li class="breadcrumb-item">Grupos</li>
                        <li class="breadcrumb-item active" aria-current="page"><i class="fas fa-user-graduate"></i> Agregar Nuevo</li>
                    </ol>
                </nav>
                <hr>
            </div>
            <div class="col-lg-9">
                <h3 class="contexto"> <i class="fas fa-user-graduate"></i> Agregar Nuevo Grupo</h3>
            </div>
            <div class="col-lg-12"><strong>* Campos obligatorios</strong></div>
            <div class="col-lg-12">
                <form method="post" action="{{ route('grupos.store') }}" autocomplete="off" enctype="multipart/form-data">
                    @csrf
                   <div class="row">
                       <div class="col-lg-3">
                           <label>* Tipo de estudio</label>
                           <select name="tipoCarrera" id="modalidad" class="form-control" required>
                               <option value="">Seleccione una opción</option>
                               @foreach($modalidadInfo as $cr)
                                   <option value="{{ $cr->idnivel }}">{{ $cr->tipo }}</option>
                               @endforeach
                           </select>
                       </div>
                       <div class="col-lg-3" id="carreraElemento">
                           <label>* Carrera</label>
                           <select name="carrera" class="form-control" disabled>
                               <option value="">Seleccione primero un tipo de estudio.</option>
                           </select>
                       </div>
                       <div class="col-lg-3">
                           <label>* Modalidad</label>
                           <select name="modalidad" class="form-control" required>
                               <option value="">Seleccione una opción</option>
                               @foreach($modalidades as $modalidad)
                                   <option value="{{ $modalidad->idModalidad }}">{{ $modalidad->modalidad }}</option>
                               @endforeach
                           </select>
                       </div>
                       <div class="col-lg-3">
                           <label>* Cuatrimestre</label>
                           <select name="cuatrimestre" id="cuatrimestre" class="form-control" required>
                               <option value="">Seleccione una opción</option>
                               @for($i=1;$i<=9;$i++)
                               <option value="{{$i}}" >{{$i}}</option>
                               @endfor
                           </select>
                       </div>
                       <div class="col-lg-3">
                           <label>* Nombre del Grupo</label>
                           <input type="text" value="{{ old('nombre') }}" onkeyup="javascript:this.value=this.value.toUpperCase();" maxlength="100"  name="nombre" class="form-control" required autofocus>
                       </div>
                       <div class="col-lg-3">
                           <label>* Numero de Parciales</label>
                           <select name="parcial" id='parciales' class="form-control" required>
                               <option value="">Seleccione una opción</option>
                               <option value="1" >1</option>
                               <option value="2" >2</option>
                               <option value="3" >3</option>
                               <option value="4" >4</option>
                               <option value="5" >5</option>
                           </select>
                       </div>
                       <div class="col-lg-12" id="fechas">

                       </div>
                       <div class="col-lg-12">
                           <br>
                           <button type="submit" class="btn btn-success"><i class="fas fa-plus"></i> Agregar</button>
                       </div>
                   </div>
                </form>
            </div>
        </div>
    </div>
@endsection