@extends('layouts.admin')

@section('content')
<br>
<br>
<style>
    .container {
            margin-top: 20px;
        }

    label {
        display: block;
        margin-bottom: 5px;
    }
    
    select,
    input[type="datetime-local"] {
        padding: 8px;
            border: 1px solid #ccc;
            border-radius: 5px;
            margin-bottom: 10px;
            width: 100%;
            max-width: 300px;
    }

    button[type="submit"] {
        padding: 8px 15px;
        background-color: #007bff;
        color: #fff;
        border: none;
        border-radius: 5px;
        cursor: pointer;
    }

    button[type="submit"]:hover {
        background-color: #0056b3;
    }

    .top-ganhandor {
        border: 1px solid #ccc;
        border-radius: 5px;
        padding: 10px;
        margin-top: 20px;
    }

    .top-ganhandor h3 {
        color: #007bff;
        margin-bottom: 10px;
    }

    .top-ganhandor p {
        margin-bottom: 5px;
    }

    .top-ganhandor p strong {
        color: #007bff;
    }

    .top-ganhandor p:first-child {
        margin-top: 0;
    }

    .top-ganhandor p:last-child {
        margin-bottom: 0;
    }
</style>
<section class="content">
    <div class="container">
        <form method="GET" action="{{ route('topGanhandores') }}">
                <label for="product_id">Selecione o Produto:</label>
                <select id="product_id" name="product_id">
                @foreach($products as $product)
                @if ($product->status == 'Ativo')
                <option value="{{ $product->id }}">{{ $product->name }}</option>
                @endif
                @endforeach
                </select>
                <label for="start_date">Data de Início:</label>
                <input type="datetime-local" id="start_date" name="start_date" value="{{ $startDate->setTimezone('America/Sao_Paulo')->format('Y-m-d\TH:i') }}">
                <label for="end_date">Data de Fim:</label>
                <input type="datetime-local" id="end_date" name="end_date" value="{{ $endDate->setTimezone('America/Sao_Paulo')->format('Y-m-d\TH:i') }}">
                <button type="submit">Buscar</button>
                <button type="submit" name="top_type" value="daily">Top 24 Hrs</button>
                <button type="submit" name="top_type" value="weekly">Top 7 Dias</button>
        </form>

    @if($topClientes->isNotEmpty())
    @foreach($topClientes as $key => $cliente)
    @if($cliente->total_pagos > 0)
        <div class="top-ganhandor">
            <h3>Top {{ $key + 1 }} Comprador</h3>
            <p>Cliente: {{ $cliente->name }}</p>
            <p>Total de Cotas: {{ $cliente->total_pagos }}</p>
            <p>Período: {{ $startDate->format('d/m/Y H:i:s') }} - {{ $endDate->format('d/m/Y H:i:s') }}</p>
        </div>
    @endif
    @endforeach
@else
    <div class="top-ganhandor">
        <p>Nenhum ganhador encontrado para o período especificado.</p>
    </div>
@endif
    </div>
</section>
@endsection