@extends('layouts.panel')
@section('content')
<link rel="stylesheet" href="{{ url('css/numerosGanadores.css') }}">

<!-- Nota Importante sobre Rifa Activa - Fuera del módulo -->
<div class="nota-rifa-activa">
    <i class="material-icons">warning</i>
    <strong>Nota Importante</strong>
    Los números asignados se visualizan dependiendo de la "RIFA ACTIVA"
    <span class="label-rifa">RIFA ACTIVA ACTUAL:</span>
    <span class="nombre-rifa">{{ $dataRifa->nombre }}</span>
</div>

<div class="numganadores-container">
    <!-- Header -->
    <div class="numganadores-header">
        <h2 class="numganadores-titulo">Números Ganadores</h2>
    </div>

    <!-- Grid de 2 columnas -->
    <div class="numganadores-grid">
        <!-- Sección de Checkboxes para Seleccionar Números -->
        <div class="checkboxes-section">
            <h3 class="seccion-titulo">Seleccione los números que desea buscar</h3>
            <div class="checkboxes-grid">
                @php
                    $numerosSeleccionados = request('numero_generado') ? explode(',', request('numero_generado')) : [];
                @endphp
                @forelse ($parametros as $parametro)
                    <div class="checkbox-item">
                        <input class="form-check-input" type="checkbox" value="{{ $parametro->numeroPremiados }}"
                               id="numero_{{ $parametro->id }}" onchange="updateInput()"
                               {{ in_array($parametro->numeroPremiados, $numerosSeleccionados) ? 'checked' : '' }}>
                        <label class="form-check-label" for="numero_{{ $parametro->id }}">
                            {{ $parametro->numeroPremiados }}
                        </label>
                    </div>
                @empty
                    <div class="sin-resultados">Sin números disponibles</div>
                @endforelse
            </div>
        </div>

        <!-- Sección de Búsqueda -->
        <div class="busqueda-section">
            <h3 class="seccion-titulo">Buscar Números Ganadores</h3>
            <form action="{{ route('numGanadores.index') }}" method="GET">
                <div class="busqueda-form">
                    <div class="form-group">
                        <label for="validationSample01">Ingrese el número que desea ver</label>
                        <input type="text" name="numero_generado" class="form-control"
                               id="validationSample01" placeholder="Ej: 1234,5678"
                               value="{{ request('numero_generado') }}" required>
                        <small class="busqueda-ayuda">Puede ingresar uno o varios números separados por comas</small>
                    </div>
                    <button type="submit" class="btn-buscar">
                        <i class="material-icons">search</i>
                        Buscar Números
                    </button>
                </div>
            </form>
        </div>
    </div>

    <!-- Resultados de Búsqueda -->
    @if ($search == true)
    <div class="resultados-section">
        <h3 class="seccion-titulo">Resultados de la Búsqueda</h3>
        <div class="table-responsive">
            <table class="tabla-resultados">
                <thead>
                    <tr>
                        <th>#</th>
                        <th>Nombre Completo</th>
                        <th>Celular</th>
                        <th>Correo Electrónico</th>
                        <th>Número Ganador</th>
                        <th>Acciones</th>
                    </tr>
                </thead>
                <tbody>
                    @forelse ($numGenerados as $numGenerado)
                        <tr>
                            <td><strong>{{ $loop->iteration }}</strong></td>
                            <td>{{ $numGenerado->cliente->nombre . ' ' . $numGenerado->cliente->apellido }}</td>
                            <td>{{ $numGenerado->cliente->celular }}</td>
                            <td>{{ $numGenerado->cliente->correo }}</td>
                            <td><span class="numero-ganador">{{ $numGenerado->numero_generado }}</span></td>
                            <td>
                                <a href="{{ url('clientes/' . $numGenerado->cliente_id . '/numeroAsignados?estado=NG') }}"
                                   class="btn-ver-comprados">
                                    <i class="material-icons">confirmation_number</i>
                                    Ver Comprados
                                </a>
                            </td>
                        </tr>
                    @empty
                        <tr>
                            <td colspan="6" class="sin-resultados">Sin resultados</td>
                        </tr>
                    @endforelse
                </tbody>
            </table>
        </div>
    </div>
    @endif
</div>

<script src="{{ url('js/numerosGanadores.js') }}"></script>
@endsection