@extends('layouts.panel')

@section('title', 'Audiência — '.$campaign->name)
@section('heading', $campaign->name)
@section('lede', 'Sessões, visitantes e interações desta campanha')

@section('content')
<div class="page-toolbar">
    <a href="{{ route('panel.impressions.index') }}" class="btn-link">← Voltar às impressões</a>
    <a href="{{ route('panel.campaigns.show', $campaign) }}" class="btn-link">Abrir campanha</a>
</div>

<section class="metric-strip" aria-label="Resumo da campanha">
    <div class="metric-cell">
        <span>Impressões</span>
        <strong>{{ number_format($summary['impressions'], 0, ',', '.') }}</strong>
    </div>
    <div class="metric-cell">
        <span>Visitantes</span>
        <strong>{{ number_format($summary['visitors'], 0, ',', '.') }}</strong>
    </div>
    <div class="metric-cell">
        <span>Concluídos</span>
        <strong>{{ number_format($summary['completions'], 0, ',', '.') }}</strong>
    </div>
    <div class="metric-cell">
        <span>Cliques</span>
        <strong>{{ number_format($summary['clicks'], 0, ',', '.') }}</strong>
    </div>
    <div class="metric-cell">
        <span>CTR</span>
        <strong>{{ $summary['ctr'] !== null ? number_format($summary['ctr'], 1, ',', '.').'%' : '—' }}</strong>
    </div>
</section>

<div class="page-toolbar">
    <form method="GET" class="filter-bar">
        <div class="field">
            <label for="q">Busca</label>
            <input id="q" name="q" value="{{ $filters['q'] }}" placeholder="Ponto ou visitante">
        </div>
        <div class="field">
            <label for="playback">Reprodução</label>
            <select id="playback" name="playback">
                <option value="">Todas</option>
                <option value="pending" @selected($filters['playback'] === 'pending')>Aguardando início</option>
                <option value="started" @selected($filters['playback'] === 'started')>Em reprodução</option>
                <option value="completed" @selected($filters['playback'] === 'completed')>Concluída</option>
                <option value="abandoned" @selected($filters['playback'] === 'abandoned')>Abandonada</option>
            </select>
        </div>
        <button type="submit" class="btn-secondary">Filtrar</button>
    </form>
</div>

@if ($impressions->isEmpty())
    <section class="work-panel">
        <div class="empty-state">
            <h3>Nenhuma sessão nesta campanha</h3>
            <p>Ajuste os filtros ou aguarde exibições no portal.</p>
        </div>
    </section>
@else
    <div class="data-table-wrap">
        <table class="data-table">
            <thead>
                <tr>
                    <th scope="col">Quando</th>
                    <th scope="col">Ponto</th>
                    <th scope="col">Vídeo</th>
                    <th scope="col">Visitante</th>
                    <th scope="col">Reprodução</th>
                    <th scope="col">Assistido</th>
                    <th scope="col">Cliques</th>
                </tr>
            </thead>
            <tbody>
                @foreach ($impressions as $impression)
                    <tr>
                        <td>
                            <a class="btn-link" href="{{ route('panel.impressions.show', $impression) }}">
                                {{ $impression->occurred_at?->format('d/m/Y H:i') }}
                            </a>
                        </td>
                        <td>{{ $impression->wifiPoint?->name ?? '—' }}</td>
                        <td>{{ $impression->video?->title ?? '—' }}</td>
                        <td><code>{{ $impression->visitorHint() ?? '—' }}</code></td>
                        <td><span class="badge">{{ $impression->playbackStatusLabel() }}</span></td>
                        <td>{{ $impression->watchedLabel() ?? '—' }}</td>
                        <td>{{ $impression->clicks_count }}</td>
                    </tr>
                @endforeach
            </tbody>
        </table>
    </div>
    @if ($impressions->hasPages())
        <div class="pagination-wrap">{{ $impressions->links() }}</div>
    @endif
@endif
@endsection