@extends('layouts.panel')

@section('title', 'Audiência — '.$video->title)
@section('heading', $video->title)
@section('lede', 'Sessões e interações deste vídeo em todas as campanhas')

@section('content')
<div class="page-toolbar">
    <a href="{{ route('panel.impressions.index', ['group_by' => 'video']) }}" class="btn-link">← Voltar às impressões</a>
    <a href="{{ route('panel.videos.show', $video) }}" class="btn-link">Abrir vídeo</a>
</div>

<section class="metric-strip" aria-label="Resumo do vídeo">
    <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="Campanha, 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 para este vídeo</h3>
        </div>
    </section>
@else
    <div class="data-table-wrap">
        <table class="data-table">
            <thead>
                <tr>
                    <th scope="col">Quando</th>
                    <th scope="col">Campanha</th>
                    <th scope="col">Ponto</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>
                            @if ($impression->campaign)
                                <a class="btn-link" href="{{ route('panel.impressions.campaign', $impression->campaign) }}">{{ $impression->campaign->name }}</a>
                            @else
                                —
                            @endif
                        </td>
                        <td>{{ $impression->wifiPoint?->name ?? '—' }}</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