@extends('template.main')

@section('titulo','Gestión de Carreras')

@section('cabecera')
    <script>
        $(document).ready(function() {
            $('#contenedor').DataTable( {
                language: {
                    "decimal": "",
                    "emptyTable": "No hay información",
                    "info": "Mostrando _START_ a _END_ de _TOTAL_ Entradas",
                    "infoEmpty": "Mostrando 0 to 0 of 0 Entradas",
                    "infoFiltered": "(Filtrado de _MAX_ total entradas)",
                    "infoPostFix": "",
                    "thousands": ",",
                    "lengthMenu": "Mostrar _MENU_ Entradas",
                    "loadingRecords": "Cargando...",
                    "processing": "Procesando...",
                    "search": "Buscar:",
                    "zeroRecords": "Sin resultados encontrados",
                    "paginate": {
                        "first": "Primero",
                        "last": "Ultimo",
                        "next": "Siguiente",
                        "previous": "Anterior"
                    }
                },
                "paging":false,

                initComplete: function () {
                    this.api().columns().every( function () {
                        var column = this;
                        var select = $('<select style="word-wrap: break-word;width:135px" ><option value=""></option></select>')
                            .appendTo( $(column.footer()).empty() )
                            .on( 'change', function () {
                                var val = $.fn.dataTable.util.escapeRegex(
                                    $(this).val()
                                );

                                column
                                    .search( val ? '^'+val+'$' : '', true, false )
                                    .draw();
                            } );

                        column.data().unique().sort().each( function ( d, j ) {
                            select.append( '<option value="'+d+'">'+d+'</option>' )
                        } );
                    } );
                }
            } );
        } );
    </script>
    <style>
        select option{
            width:180px;
            word-wrap: break-word;
            white-space: normal;
        }
        select{
            width:190px;
        }
    </style>
@endsection

@section('contenido')
    <div class="col-lg-12">
        <div class="row">
            <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">Carreras</li>
                        <li class="breadcrumb-item active" aria-current="page"><i class="fas fa-list"></i> Gestión de Carreras</li>
                    </ol>
                </nav>
                <hr>
            </div>
            <div class="col-lg-11">
                <h3 class="contexto"> <i class="fas fa-users-cog"></i> Gestión de Carreras</h3>
            </div>
            <div class="col-lg-1">
                <a href="" data-bs-toggle="modal" data-bs-target="#miModal" class="btn btn-success"><i class="fas fa-plus-square fa-2x"></i></a>
            </div>
            <div class="col-lg-12">
                <br>
                <table id="contenedor" class="table table-hover" style="background: #fff;" >
                    <thead>
                    <tr>
                        <th>Nombre</th>
                        <th>Nivel</th>
                        <th>Años</th>
                        <th>Meses</th>
                        <th>Acciones</th>
                    </tr>
                    </thead>
                    <tbody>
                    @php $i=0; @endphp
                    @foreach($carreras as $row)
                        <tr>
                            <td>{{ $row->nombre }}</td>
                            <td>{{ $row->NivelEducativo->tipo }}</td>
                            <td>{{ $row->años }}</td>
                            <td>{{ $row->meses}}</td>
                            <td>
                                <a href="{{ route('usuarios.administrarCarrera',$row->id) }}" class="btn btn-outline-info" title="Gestión de Carreras."><i class="fas fa-list"></i></a>
                                <a href="" data-bs-toggle="modal" data-bs-target="#Modal_{{$i}}" class="btn btn-outline-warning" title="Editar Carrera"><i class="far fa-edit"></i></a>
                                <a href="{{ route('usuarios.eliminarCarrera',$row->id) }}" class="btn btn-outline-danger" onclick="event.preventDefault(); if(eliminarCarrera()){ location.href = this.href; }" title="Eliminar Carrera"><i class="fas fa-trash"></i></a>
                            </td>
                        </tr>
                        @php $i++ @endphp
                    @endforeach
                    </tbody>
                </table>
            </div>
        </div>
    </div>
    <!-- Agregar -->
    <div class="modal fade" id="miModal" tabindex="-100" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header" style="background: #000; color: #fff;">
                    <h4 class="modal-title" id="myModalLabel">Agregar Nueva Carrera</h4>
                </div>
                <div class="modal-body">
                    <form method="POST" action="{{ route('usuarios.carreraStore') }}">
                        @csrf

                        <div class="form-group row">
                            <label for="nivel" class="col-md-4 col-form-label text-md-right">Nivel Educativo</label>
                            <div class="col-md-6">
                                <select name="nivel" class="form-control" >
                                    <option value="">Seleccione una opción</option>
                                    @foreach($nivel as $n)
                                            <option value="{{ $n->idnivel }}" >{{ $n->tipo }}</option>
                                    @endforeach
                                    @error('nivel')
                                    <span class="invalid-feedback" role="alert">
                                        <strong>{{ $message }}</strong>
                                    </span>
                                    @enderror
                                </select>
                            </div>

                        </div>

                        <div class="form-group row">
                            <label for="nombre" class="col-md-4 col-form-label text-md-right">Carrera Nueva</label>

                            <div class="col-md-6">
                                <input id="nombre" type="text" class="form-control @error('nombre') is-invalid @enderror" name="nombre" value="{{ old('nombre') }}" required autocomplete="nombre">

                                @error('nombre')
                                <span class="invalid-feedback" role="alert">
                                        <strong>{{ $message }}</strong>
                                    </span>
                                @enderror
                            </div>
                        </div>
                        <div class="form-group row">
                            <label for="anios" class="col-md-4 col-form-label text-md-right">Duración Anual</label>

                            <div class="col-md-6">
                                <select name="anios" class="form-control" >
                                    <option value="">Seleccione una opción</option>
                                    @for($i=0;$i<=5;$i++)
                                        <option value="{{ $i }}" >@if($i==1) {{$i}} año @else {{$i}} años @endif</option>
                                    @endfor
                                    @error('anios')
                                    <span class="invalid-feedback" role="alert">
                                        <strong>{{ $message }}</strong>
                                    </span>
                                    @enderror
                                </select>
                            </div>
                        </div>
                        <div class="form-group row">
                            <label for="mes" class="col-md-4 col-form-label text-md-right">Duración Mensual</label>

                            <div class="col-md-6">
                                <select name="mes" class="form-control" >
                                    <option value="">Seleccione una opción</option>
                                    @for($i=0;$i<=11;$i++)
                                        <option value="{{ $i }}" >@if($i==1) {{$i}} mes @else {{$i}} meses @endif</option>
                                    @endfor
                                    @error('mes')
                                    <span class="invalid-feedback" role="alert">
                                        <strong>{{ $message }}</strong>
                                    </span>
                                    @enderror
                                </select>
                            </div>
                        </div>

                        <div class="form-group row mb-0">
                            <div class="col-md-6 offset-md-4">
                                <button type="submit" class="btn btn-primary">
                                    <i class="fas fa-plus"></i> Agregar
                                </button>
                            </div>
                        </div>
                    </form>
                </div>
                <div class="modal-footer" style="background: #000; color: #fff;">
                    <center><button type="button" class="btn btn-outline-primary" data-bs-dismiss="modal" aria-label="Close">
                            <i class="fa fa-times"></i> Cerrar
                        </button></center>
                </div>
            </div>
        </div>
    </div>
    <!-- Editar -->
    @php $j=0 @endphp
    @foreach($carreras as $row)
        @php
            $carrera = \App\Carrera::where('id',$row->id)->first();
        @endphp
        <div class="modal fade" id="Modal_{{$j}}" tabindex="-100" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-header" style="background: #000; color: #fff;">
                        <h4 class="modal-title" id="myModalLabel">Editar Carrera</h4>
                    </div>
                    <div class="modal-body">
                        <form method="POST" action="{{ route('usuarios.updateCarrera') }}">
                            @csrf
                            <div class="form-group row">
                                <input name="id" value="{{$carrera->id}}" hidden>
                                <label for="nivel" class="col-md-4 col-form-label text-md-right">Nivel Educativo</label>
                                <div class="col-md-6">
                                    <select name="nivel" class="form-control">
                                        <option value="">Seleccione una opción</option>
                                        @foreach($nivel as $n)
                                            @if($carrera->idNivel == $n->idnivel)
                                                <option value="{{ $n->idnivel }}" selected>{{ $n->tipo }}</option>
                                            @else
                                                <option value="{{ $n->idnivel }}">{{ $n->tipo }}</option>
                                            @endif
                                        @endforeach
                                    </select>
                                </div>
                            </div>

                            <div class="form-group row">
                                <label for="nombre" class="col-md-4 col-form-label text-md-right">Editar Nombre</label>

                                <div class="col-md-6">
                                    <input id="nombre" type="text" class="form-control" name="nombre" value="{{ $carrera->nombre }}" required autocomplete="nombre">
                                </div>
                            </div>
                            <div class="form-group row">
                                <label for="anios" class="col-md-4 col-form-label text-md-right">Duración Anual</label>
                                <div class="col-md-6">
                                    <select name="anios" class="form-control" >

                                        <option value="">Seleccione una opción</option>
                                        @for($k=0;$k<=5;$k++)
                                            @if($carrera->años == $k)
                                                <option value="{{ $k }}" selected>{{ $carrera->años }}</option>
                                            @else
                                                <option value="{{ $k }}"> {{$k}}</option>
                                            @endif
                                        @endfor
                                    </select>
                                </div>
                            </div>
                            <div class="form-group row">
                                <label for="meses" class="col-md-4 col-form-label text-md-right">Duración Mensual</label>
                                <div class="col-md-6">
                                    <select name="meses" class="form-control" >

                                        <option value="">Seleccione una opción</option>
                                        @for($l=0;$l<=11;$l++)
                                            @if($carrera->meses == $l)
                                                <option value="{{ $l }}" selected>{{ $carrera->meses }}</option>
                                            @else
                                                <option value="{{ $l }}"> {{ $l }}</option>
                                            @endif
                                        @endfor
                                    </select>
                                </div>
                            </div>

                            <div class="form-group row mb-0">
                                <div class="col-md-6 offset-md-4">
                                    <button type="submit" class="btn btn-primary">
                                        <i class="fas fa-plus"></i> Agregar
                                    </button>
                                </div>
                            </div>
                        </form>
                    </div>
                    <div class="modal-footer" style="background: #000; color: #fff;">
                        <center><button type="button" class="btn btn-outline-primary" data-bs-dismiss="modal" aria-label="Close">
                                <i class="fa fa-times"></i> Cerrar
                            </button></center>
                    </div>
                </div>
            </div>
        </div>
        @php $j++; @endphp
    @endforeach

@endsection