@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">Programas</li>
                        <li class="breadcrumb-item active" aria-current="page"><i class="fas fa-list"></i> Gestión de Programas</li>
                    </ol>
                </nav>
                <hr>
            </div>
            <div class="col-lg-11">
                <h3 class="contexto"> <i class="fas fa-users-cog"></i> Programas de {{$carrera->nombre}}</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>Carrera</th>
                        <th width="5%">Cuatrimestre</th>
                        <th width="35%">Nombre</th>
                        <th width="20%">Clave</th>
                        <th>Acciones</th>
                    </tr>
                    </thead>
                    <tbody>
                    @php $m=0; @endphp
                    @foreach($programas as $row)
                        <tr>
                            <td>{{ $carrera->nombre ?? ''}}</td>
                            <td>{{ $row->cuatrimestre ?? 'S/N' }}</td>
                            <td>{{ $row->nombre ?? 'S/N' }}</td>
                            <td>{{ $row->clave ?? 'S/N' }}</td>
                            <td>
                                <a href="" data-bs-toggle="modal" data-bs-target="#Modal_{{$m}}" class="btn btn-outline-warning" title="Editar Programa"><i class="far fa-edit"></i></a>
                                <a href="{{ route('usuarios.eliminarPrograma',$row->id) }}" class="btn btn-outline-danger" onclick="event.preventDefault(); if(eliminarPrograma()){ location.href = this.href; }" title="Eliminar Programa"><i class="fas fa-trash"></i></a>
                            </td>
                        </tr>
                        @php $m++ @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 modal-lg" role="document">
            <div class="modal-content">
                <div class="modal-header" style="background: #000; color: #fff;">
                    <h4 class="modal-title" id="myModalLabel">Agregar Nuevo Programa</h4>
                </div>
                <div class="modal-body">
                    <form method="POST" action="{{ route('usuarios.programaStore') }}">
                        @csrf
                        <input name="idCarrera" value="{{$carrera->id}}" hidden>
                        <div class="form-group row">
                            <label for="cuatrimestre" class="col-md-4 col-form-label text-md-right">Cuatrimestre</label>
                            <div class="col-md-6">
                                <select name="cuatrimestre" class="form-control">
                                    <option value="">Seleccione una opción</option>
                                    @for($i=1;$i<=9;$i++)
                                            <option value="{{ $i }}">{{ $i }}</option>
                                    @endfor
                                </select>
                            </div>
                        </div>
                        <div class="form-group row">
                            <label for="nombre" class="col-md-4 col-form-label text-md-right">Programa</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="clave" class="col-md-4 col-form-label text-md-right">Clave</label>

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

                                @error('clave')
                                <span class="invalid-feedback" role="alert">
                                        <strong>{{ $message }}</strong>
                                    </span>
                                @enderror
                            </div>
                        </div>
                        <div class="form-group row">
                            <label for="temario" class="col-md-4 col-form-label text-md-right">Temario</label>

                            <div class="col-md-6">
                                <textarea id="temario" rows="5" class="form-control @error('temario') is-invalid @enderror" name="temario" value="{{ old('temario') }}" required autocomplete="temario"></textarea>

                                @error('temario')
                                <span class="invalid-feedback" role="alert">
                                        <strong>{{ $message }}</strong>
                                    </span>
                                @enderror
                            </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($programas as $row)
        @php
            $programa = \App\Programa::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 modal-lg" role="document">
                <div class="modal-content">
                    <div class="modal-header" style="background: #000; color: #fff;">
                        <h4 class="modal-title" id="myModalLabel">Editar Programa</h4>
                    </div>
                    <div class="modal-body">
                        <form method="POST" action="{{ route('usuarios.updatePrograma') }}">
                            @csrf
                            <div class="form-group row">
                                <input name="id" value="{{$carrera->id}}" hidden>
                                <input name="idP" value="{{$programa->id}}" hidden>
                                <label for="cuatrimestre" class="col-md-4 col-form-label text-md-right">Cuatrimestre</label>
                                <div class="col-md-6">
                                    <select name="cuatrimestre" class="form-control">
                                        <option value="">Seleccione una opción</option>
                                        @for($k=1;$k<=9;$k++)
                                            @if($programa->cuatrimestre == $k)
                                                <option value="{{ $k }}" selected>{{ $k }}</option>
                                            @else
                                                <option value="{{ $k }}"> {{$k}}</option>
                                            @endif
                                        @endfor
                                    </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="{{ $programa->nombre }}" required autocomplete="nombre">
                                </div>
                            </div>
                            <div class="form-group row">
                                <label for="clave" class="col-md-4 col-form-label text-md-right">Editar Clave</label>

                                <div class="col-md-6">
                                    <input id="clave" type="text" class="form-control" name="clave" value="{{ $programa->clave }}" required autocomplete="clave">
                                </div>
                            </div>
                            <div class="form-group row">
                                <label for="temario" class="col-md-4 col-form-label text-md-right">Temario</label>

                                <div class="col-md-6">
                                    <textarea id="temario" rows="5" cols="45" class="form-contro" name="temario"  required autocomplete="temario">{{$programa->temario}}</textarea>
                                </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> Actualizar
                                    </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