@extends('operations.comercial.ofertas.apertura.wizard')

@section('wizard_content')
<div class="text-center mb-4">
    <h4>Paso 5: Finalización del Proceso de Apertura</h4>
</div>

<!-- Resumen de la oferta -->
<div class="row mb-4">
    <div class="col-12">
        <div class="table-responsive">
            <table class="table table-bordered">
                <thead>
                    <tr>
                        <th>Sección</th>
                        <th>Estado</th>
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td>Oferta Introducida</td>
                        <td class="text-center">
                            @if($status->status_ofertas === 'Completa')
                                <i class="bi bi-emoji-smile text-success"></i> Completa
                            @else
                                <i class="bi bi-emoji-frown text-danger"></i> Incompleta
                            @endif
                        </td>
                    </tr>
                    <tr>
                        <td>Detalles de la Oferta</td>
                        <td class="text-center">
                            @if($status->status_details === 'Completa')
                                <i class="bi bi-emoji-smile text-success"></i> Completa
                            @else
                                <i class="bi bi-emoji-frown text-danger"></i> Incompleta
                            @endif
                        </td>
                    </tr>
                    <tr>
                        <td>Criterios de Clasificación</td>
                        <td class="text-center">
                            @if($status->status_criterios === 'Completa')
                                <i class="bi bi-emoji-smile text-success"></i> Completa
                            @else
                                <i class="bi bi-emoji-frown text-danger"></i> Incompleta
                            @endif
                        </td>
                    </tr>
                    <tr>
                        <td>Competidores Presentados</td>
                        <td class="text-center">
                            {{ $competitorsAdmitted }} Admitidos / {{ $competitorsExcluded }} Excluidos de un total de {{ $totalCompetitors }}
                        </td>
                    </tr>
                    <tr>
                        <td>Puntuaciones de Competidores</td>
                        <td class="text-center">
                            @if($status->status_competitors_cuantitativas === 'Completa')
                                <i class="bi bi-emoji-smile text-success"></i> Completa
                            @else
                                <i class="bi bi-emoji-frown text-danger"></i> Incompleta
                            @endif
                        </td>
                    </tr>
                </tbody>
            </table>
        </div>
    </div>
</div>

<!-- Cambiar estado de la oferta -->
<div class="row mb-4">
    <div class="col-12">
      <form method="POST" action="{{ route('operations.comercial.ofertas.apertura.save.step', ['ofertaId' => $oferta->id, 'step' => 5]) }}">
          @csrf
          <!-- Contenido del formulario -->
          <div class="mb-3">
              <label for="estado" class="form-label">Estado de la Oferta</label>
              <select id="estado" name="estado" class="form-control">
                  @foreach($estadoOptions as $option)
                      <option value="{{ $option }}" {{ $status->status_ofertas === $option ? 'selected' : '' }}>
                          {{ $option }}
                      </option>
                  @endforeach
              </select>
          </div>

          <!-- Mensajes dinámicos -->
          <div id="mensaje-estado" class="text-center my-3"></div>

          <!-- Preguntar por el ganador y posición -->
          <div id="ganador-section" class="d-none">
              <div class="row mb-3 align-items-center">
                  <!-- Pregunta por el ganador -->
                  <div class="col-md-6">
                      <label for="ganador" class="form-label">¿Sabemos el Ganador?</label>
                      <select id="ganador" name="ganador" class="form-control">
                          <option value="">No informado</option> <!-- Opción predeterminada -->
                          @foreach ($competitors as $competitor)
                              <option value="{{ $competitor->id }}" {{ $ganador && $ganador->ganador_id == $competitor->id ? 'selected' : '' }}>
                                  {{ $competitor->competitor_nombre }}
                              </option>
                          @endforeach
                      </select>
                  </div>

                  <!-- Campo para posición de Autoritas -->
                  <div class="col-md-6">
                      <label for="posicion" class="form-label">¿En qué posición quedó Autoritas?</label>
                      <select id="posicion" name="posicion" class="form-control">
                          <option value="">No se sabe</option> <!-- Opción predeterminada -->
                          @for ($i = 1; $i <= 100; $i++)
                              <option value="{{ $i }}" {{ $ganador && $ganador->posicion_autoritas == $i ? 'selected' : '' }}>
                                  {{ $i }}
                              </option>
                          @endfor
                      </select>
                  </div>
              </div>
          </div>

          <!-- Botones -->
          <div class="d-flex justify-content-between">
              <a href="{{ route('operations.comercial.ofertas.apertura.step', ['ofertaId' => $oferta->id, 'step' => 4]) }}" class="btn btn-secondary">Anterior</a>
              <button type="submit" class="btn btn-primary">Finalizar</button>
          </div>
      </form>
    </div>
</div>

<script>
    const estadoSelect = document.getElementById('estado');
    const mensajeEstado = document.getElementById('mensaje-estado');
    const ganadorSection = document.getElementById('ganador-section');

    estadoSelect.addEventListener('change', () => {
        const estado = estadoSelect.value;

        if (estado === 'Desestimado') {
            mensajeEstado.innerHTML = '<p class="text-danger">Otra vez será.</p>';
            ganadorSection.classList.add('d-none');
        } else if (estado === 'Ganado') {
            mensajeEstado.innerHTML = '<p class="text-success">¡Enhorabuena!</p>';
            ganadorSection.classList.remove('d-none');
        } else if (estado === 'Perdido') {
            mensajeEstado.innerHTML = '<p class="text-warning">Otra vez será.</p>';
            ganadorSection.classList.remove('d-none');
        } else {
            mensajeEstado.innerHTML = '';
            ganadorSection.classList.add('d-none');
        }
    });
</script>
@endsection