@extends('adminlte::page')

@section('content_header')
    <h1><b>Pagos del estudiante: {{ $estudiante->apellidos . ' ' . $estudiante->nombres }}</b></h1>
    <hr>
@stop

@section('content')
    <div class="row">
        <div class="col-md-8">
            <div class="accordion" id="accordionExample">
                @foreach ($matriculas as $matricula)
                    @php
                        // Ejecutar la función para actualizar pagos pendientes antes de mostrar
                        app('App\Http\Controllers\PagoController')->verificarPagosPendientes($matricula);
                    @endphp

                    <div class="card">


                        <div class="card-header" style="background-color:rgb(177, 238, 215);" id="heading{{ $matricula->id }}">
                            <h2 class="mb-0">
                                <button class="btn btn-link btn-block text-left" type="button" data-toggle="collapse"
                                    data-target="#collapseOne{{ $matricula->id }}" aria-expanded="true"
                                    aria-controls="collapseOne{{ $matricula->id }}">
                                    <b>Matricula: Gestión
                                        {{ $matricula->gestion->nombre . ' - ' . $matricula->nivel->nombre . ' - ' . $matricula->grado->nombre . ' - ' . $matricula->paralelo->nombre }}</b>
                                </button>
                            </h2>
                        </div>

                        <div id="collapseOne{{ $matricula->id }}" class="collapse show"
                            aria-labelledby="heading{{ $matricula->id }}" data-parent="#accordionExample">
                            <div class="card-body">
                                @php
                                    $fechaActual = \Carbon\Carbon::now();
                                    $mesActual = strtoupper($fechaActual->locale('es')->monthName);
                                    $diaActual = $fechaActual->day;

                                    $pagoVencido = $matricula->pagos->contains(function ($pago) use (
                                        $mesActual,
                                        $diaActual,
                                    ) {
                                        return strtoupper(trim($pago->descripcion)) === $mesActual &&
                                            $pago->estado === 'Pendiente' &&
                                            $diaActual >= 13;
                                    });
                                @endphp

                                @if ($pagoVencido)
                                    <div class="alert alert-warning">
                                        <i class="fas fa-exclamation-triangle"></i> <b>ATENCIÓN:</b> El pago del mes de
                                        <b>{{ $mesActual }}</b> se encuentra <u>pendiente y vencido</u>. Por favor
                                        regularice lo antes posible.
                                    </div>
                                @endif

                                <b>Pagos realizados</b>

                                <!-- Botón para abrir el modal -->
                                <button type="button" class="btn btn-success float-right" data-toggle="modal"
                                    data-target="#modalPago{{ $matricula->id }}">
                                    <i class="fas fa-money-bill-wave"></i> Realizar pago
                                </button>

                                <!-- Modal -->
                                <div class="modal fade" id="modalPago{{ $matricula->id }}" tabindex="-1"
                                    aria-labelledby="exampleModalLabel{{ $matricula->id }}" aria-hidden="true">
                                    <div class="modal-dialog">
                                        <div class="modal-content">
                                            <div class="modal-header" style="background-color: #211df0; color: #ffffff;">
                                                <h5 class="modal-title" id="exampleModalLabel{{ $matricula->id }}">
                                                    Registrar pago</h5>
                                                <button type="button" class="close" data-dismiss="modal"
                                                    aria-label="Close">
                                                    <span aria-hidden="true">&times;</span>
                                                </button>
                                            </div>
                                            <div class="modal-body">
                                                <form action="{{ url('/admin/pagos/create') }}" method="post">
                                                    @csrf
                                                    <input type="hidden" name="matriculacion_id"
                                                        value="{{ $matricula->id }}">

                                                    <div class="form-group">
                                                        <label for="metodo_pago">Método de pago</label><b>(*)</b>
                                                        <select class="form-control" name="metodo_pago" required>
                                                            <option value="">Seleccione</option>
                                                            <option value="Efectivo">Efectivo</option>
                                                            <option value="Transferencia">Transferencia</option>
                                                            <option value="Tarjeta">Tarjeta</option>
                                                        </select>
                                                    </div>

                                                    <div class="form-group">
                                                        <label for="">Mes a pagar</label><b>(*)</b>
                                                        <select name="descripcion" class="form-control" required>
                                                            <option value="MATRICULA">MATRICULA</option>
                                                            <option value="ENERO">ENERO</option>
                                                            <option value="FEBRERO">FEBRERO</option>
                                                            <option value="MARZO">MARZO</option>
                                                            <option value="ABRIL">ABRIL</option>
                                                            <option value="MAYO">MAYO</option>
                                                            <option value="JUNIO">JUNIO</option>
                                                            <option value="JULIO">JULIO</option>
                                                            <option value="AGOSTO">AGOSTO</option>
                                                            <option value="SEPTIEMBRE">SEPTIEMBRE</option>
                                                            <option value="OCTUBRE">OCTUBRE</option>
                                                            <option value="NOVIEMBRE">NOVIEMBRE</option>
                                                            <option value="DICIEMBRE">DICIEMBRE</option>
                                                        </select>
                                                    </div>

                                                    <div class="form-group">
                                                        <label for="">Monto</label><b>(*)</b>
                                                        <input type="number" class="form-control" name="monto" required
                                                            min="0" step="0.01"
                                                            oninput="this.value = Math.abs(this.value)"
                                                            onkeypress="if(event.key === '-' || event.key === '+') event.preventDefault();">
                                                    </div>

                                                    <div class="form-group">
                                                        <label for="">Fecha de pago</label><b>(*)</b>
                                                        <input type="date" class="form-control" name="fecha_pago"
                                                            required>
                                                    </div>

                                                    <div class="form-group text-right">
                                                        <button type="button" class="btn btn-secondary"
                                                            data-dismiss="modal">Cerrar</button>
                                                        <button type="submit" class="btn btn-primary">Guardar</button>
                                                    </div>
                                                </form>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <hr>
                                <table class="table table-bordered table-striped table-hover table-sm">
                                    <thead>
                                        <tr>
                                            <th>Nro</th>
                                            <th>Monto</th>
                                            <th>Método de pago</th>
                                            <th>Descripción</th>
                                            <th>Fecha de pago</th>
                                            <th>Estado</th>
                                            <th>Acciones</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        @foreach ($matricula->pagos as $pago)
                                            <tr>
                                                <td>{{ $loop->iteration }}</td>
                                                <td>{{ $pago->monto }}</td>
                                                <td>{{ $pago->metodo_pago }}</td>
                                                <td>{{ $pago->descripcion }}</td>
                                                <td>{{ $pago->fecha_pago }}</td>
                                                <td>
                                                    @if ($pago->estado === 'pendiente')
                                                        <span class="badge badge-warning">{{ $pago->estado }}</span>
                                                    @elseif ($pago->estado === 'cancelado')
                                                        <span class="badge badge-success">{{ $pago->estado }}</span>
                                                    @else
                                                        <span class="badge badge-secondary">{{ $pago->estado }}</span>
                                                    @endif
                                                </td>
                                                <td>
                                                    <a class="btn btn-warning btn-sm"
                                                        href="{{ url('admin/pagos/' . $pago->id . '/comprobante') }}">
                                                        <i class="fas fa-print"></i> Comprobante
                                                    </a>
                                                    <form action="{{ url('admin/pagos/' . $pago->id) }}" method="post"
                                                        id="miFormulario{{ $pago->id }}">
                                                        @csrf
                                                        @method('DELETE')
                                                        <button type="submit" class="btn btn-danger btn-sm"
                                                            onclick="preguntar{{ $pago->id }}(event)">
                                                            <i class="fas fa-trash"></i> Eliminar pago
                                                        </button>
                                                    </form>
                                                    <script>
                                                        function preguntar{{ $pago->id }}(event) {
                                                            event.preventDefault();
                                                            Swal.fire({
                                                                title: '¿Desea eliminar este registro?',
                                                                text: 'Si lo elimina No podrá revertir esta acción',
                                                                icon: 'question',
                                                                showDenyButton: true,
                                                                confirmButtonText: 'Eliminar',
                                                                confirmButtonColor: '#a5161d',
                                                                denyButtonColor: '#270a0a',
                                                                denyButtonText: 'Cancelar',
                                                            }).then((result) => {
                                                                if (result.isConfirmed) {
                                                                    document.getElementById('miFormulario{{ $pago->id }}').submit();
                                                                }
                                                            });
                                                        }
                                                    </script>
                                                </td>
                                            </tr>
                                        @endforeach
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                @endforeach
            </div>
        </div>
    </div>
@stop

@section('css')
@stop

@section('js')
    {{-- Carga SweetAlert2 si no está cargado en tu plantilla principal --}}
    <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>

    <script>
        document.addEventListener('DOMContentLoaded', function() {
            // SweetAlert para errores de validación
            @if ($errors->any())
                Swal.fire({
                    icon: 'error',
                    title: 'Error',
                    html: `{!! implode('<br>', $errors->all()) !!}`,
                    toast: true,
                    position: 'top-end',
                    showConfirmButton: false,
                    timer: 5000,
                    timerProgressBar: true,
                });
            @elseif (session('mensaje'))
                Swal.fire({
                    icon: '{{ strtolower(session('icono')) }}',
                    title: '{{ session('mensaje') }}',
                    toast: true,
                    position: 'top-end',
                    showConfirmButton: false,
                    timer: 5000,
                    timerProgressBar: true,
                });
            @endif
        });
    </script>

    @include('footer')
@stop