@extends("admin.layout.layout")
@section("styles")
    @php
        $titulo = "Becas del estudiante";
        $modulo = "Estudiante";
        $vista="Becas";
    @endphp
    <title>{{getenv("APP_NAME")}} | {{$titulo}}</title>
@endsection

@section("contenido")
    <div id="kt_app_content_container" class="app-container container-fluid">
        @include("estudiante.perfil.components.header")
        @include("admin.estudiante.components.links")
        <div class="row g-5 g-xxl-12">
            <div class="col-xl-12">
                <div class="card mb-5 mb-xxl-12">
                    <div class="card-body pb-0">
                        @if ($errors->any())
                            <div class="alert alert-danger">
                                <h4>El registro tiene los siguientes errores.</h4>
                                <ul>
                                    @foreach ($errors->all() as $error)
                                        <li>{{ $error }}</li>
                                    @endforeach
                                </ul>
                            </div>
                        @endif
                        @if (session('success'))
                            <div class="alert alert-success alert-dismissible fade show" role="alert">
                                <strong>{{ session('success') }}</strong>
                                <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
                            </div>
                        @endif
                        <form class="form" action="{{route("admin::estudiante.beca.insertar",$estudiante->id)}}" method="post">
                            @csrf
                            <div class="row mb-4">
                                <div class="col-md-2">
                                    <label class="form-label required" for="tipo_beca_id">Beca</label>
                                    <select name="tipo_beca_id" id="tipo_beca_id" class="form-select form-select-lg mt-1" data-control="select2" data-placeholder="Seleccione..." data-allow-clear="false" data-hide-search="true">
                                        <option value="">-</option>
                                        @foreach($tiposBecas as $tipoBeca)
                                            <option value="{{$tipoBeca->id}}">{{$tipoBeca->tipo_beca}}</option>
                                        @endforeach
                                    </select>
                                </div>
                                <div class="col-md-3">
                                    <label for="inicio" class="form-label  required">Inicio</label>
                                    <input type="date" class="form-control form-control-lg" name="inicio" id="inicio"  value="{{date("Y-m-d")}}" required/>
                                </div>
                                <div class="col-md-3">
                                    <label for="vence" class="form-label  required">Vence</label>
                                    <input type="date" class="form-control form-control-lg" name="vence" id="vence"  value="{{date("Y-m-d")}}" required/>
                                </div>

                            </div>
                            <div class="d-flex justify-content-center my-10">
                                @can("Estudiante beca agregar")
                                    <button type="submit" id="bnt_submit" class="btn btn-primary">
                                        <span class="indicator-label">Agregar Beca</span>
                                        <span class="indicator-progress">Por favor espera...
                                    <span class="spinner-border spinner-border-sm align-middle ms-2"></span>
                                </span>
                                    </button>
                                @endcan
                            </div>
                        </form>
                        <table class="table table-hover table-condensed">
                            <thead>
                            <tr>
                                <th><b>Beca</b></th>
                                <th><b>Asignada por</b></th>
                                <th><b>Inicio</b></th>
                                <th><b>Vence</b></th>
                            </tr>
                            </thead>
                            <tbody>
                            @foreach($becas as $beca)
                                <tr>
                                    <td>{{$beca->tipo_beca->tipo_beca}}</td>
                                    <td>{{$beca->user_crea->nombre}}</td>
                                    <td>{{$beca->inicio}}</td>
                                    <td>{{$beca->vence}}</td>
                                    @can("Estudiante beca borrar")
                                        <td><button class="btn btn-sm btn-danger btnBorrar" value="{{$beca->id}}"> <i class="fas fa-trash-alt"></i></button></td>
                                    @endcan
                                </tr>
                            @endforeach
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection
@section("scripts")
    @vite(['resources/js/global/validaciones.js'])

    <script>
        $(document).on('click', '.btnBorrar', function(e) {
            let id = $(this).val();
            let url="{{route('admin::estudiante.beca.eliminar',":id")}}";
            url = url.replace(":id", id);
            $(this).prop('disabled', true);
            $.ajax({
                url: url,
                type: 'DELETE',
                dataType: 'json',
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },
                success: function(response) {
                    location.reload();
                },
                error: function(error) {
                    console.error('Error al eliminar', error);
                }
            });
        });
    </script>
@endsection