@extends('layouts.finance')

@section('title', ($report['selected_product']->product_name ?? 'Item').' Points')
@section('subtitle', 'Agent point activity from Examism vouchers')

@section('content')
@php
    $filters = $report['filters'];
    $agentSummaries = $report['agent_summaries'];
    $selectedProduct = $report['selected_product'];
    $summary = $report['item_summary'];
    $baseParams = [
        'type' => $report['type'],
        'mode' => $filters['mode'],
        'month' => $filters['month'],
        'year' => $filters['year'],
        'from' => $filters['from'],
        'to' => $filters['to'],
    ];
@endphp

<div class="flex items-center justify-between mb-4">
    <a href="{{ route('dashboard.cards.agent-points', ['type' => $report['type'], 'mode' => $filters['mode'], 'month' => $filters['month'], 'year' => $filters['year'], 'from' => $filters['from'], 'to' => $filters['to']]) }}" class="btn">
        <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="15 18 9 12 15 6"/></svg>
        Back to Points
    </a>
</div>

<section class="card mb-4">
    <div class="section-head">
        <div>
            <h2>{{ $selectedProduct->product_name ?? 'Item' }} Details</h2>
            <div class="muted text-xs">Selected Range: {{ $summary['from'] }} to {{ $summary['to'] }}</div>
        </div>
        <span class="pill pill-blue">{{ number_format($report['total']) }} points</span>
    </div>
    <div class="p-4">
        <form method="GET" action="{{ route('dashboard.cards.agent-points.item', ['item' => $filters['product_id']]) }}" class="grid gap-3" style="grid-template-columns:1.1fr 0.9fr 1fr 1fr 1fr auto;align-items:end">
            <input type="hidden" name="type" value="{{ $report['type'] }}">
            <div>
                <label class="label">View</label>
                <select name="mode" class="field">
                    <option value="quarter" @selected($filters['mode'] === 'quarter')>Quarter</option>
                    <option value="month" @selected($filters['mode'] === 'month')>Month</option>
                    <option value="year" @selected($filters['mode'] === 'year')>Year</option>
                    <option value="date" @selected($filters['mode'] === 'date')>Date Range</option>
                </select>
            </div>
            <div>
                <label class="label">Month</label>
                <input type="month" name="month" value="{{ $filters['month'] }}" class="field">
            </div>
            <div>
                <label class="label">Year</label>
                <input type="number" name="year" value="{{ $filters['year'] }}" class="field" min="2020" max="2100">
            </div>
            <div>
                <label class="label">From</label>
                <input type="date" name="from" value="{{ $filters['from'] }}" class="field">
            </div>
            <div>
                <label class="label">To</label>
                <input type="date" name="to" value="{{ $filters['to'] }}" class="field">
            </div>
            <button type="submit" class="btn btn-primary">Filter</button>
        </form>
    </div>
</section>

<section class="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-4 gap-3 mb-4">
    <div class="card kpi-card">
        <div class="kpi-label">Sold Vouchers</div>
        <div class="kpi-value">{{ number_format($summary['sold_vouchers']) }}</div>
        <div class="muted text-xs">{{ $summary['from'] }} to {{ $summary['to'] }}</div>
    </div>
    @php $pointWord = $report['type'] === 'redeemed' ? 'Redeemed' : 'Points'; @endphp
    <div class="card kpi-card">
        <div class="kpi-label">Quarterly {{ $pointWord }}</div>
        <div class="kpi-value">{{ number_format($summary['quarterly_points'], 2) }}</div>
    </div>
    <div class="card kpi-card">
        <div class="kpi-label">Yearly {{ $pointWord }}</div>
        <div class="kpi-value">{{ number_format($summary['yearly_points'], 2) }}</div>
    </div>
    <div class="card kpi-card">
        <div class="kpi-label">Total {{ $pointWord }}</div>
        <div class="kpi-value">{{ number_format($summary['total_points'], 2) }}</div>
    </div>
</section>

<section class="card">
    <div class="section-head">
        <h2>Agents</h2>
        <span class="muted text-xs">{{ $agentSummaries->total() }} agents</span>
    </div>
    <table>
        <thead>
            <tr>
                <th>Agent ID</th>
                <th>Business Name</th>
                <th>Agent</th>
                <th>Email</th>
                <th>Vouchers</th>
                <th>Orders</th>
                <th>Rows</th>
                <th class="right">Points</th>
            </tr>
        </thead>
        <tbody>
            @forelse($agentSummaries as $agent)
                <tr class="row-hover">
                    <td>{{ $agent->agent_id ?: '-' }}</td>
                    <td>{{ $agent->agent_business_name ?: '-' }}</td>
                    <td>
                        @if($agent->agent_id)
                            <a href="{{ route('dashboard.cards.agent-points.item.agent', array_merge(['item' => $filters['product_id'], 'agent' => $agent->agent_id], $baseParams)) }}" class="font-semibold" style="color:inherit;text-decoration:none">
                                {{ $agent->agent_name }}
                            </a>
                        @else
                            {{ $agent->agent_name }}
                        @endif
                    </td>
                    <td class="muted text-xs">{{ $agent->agent_email ?: '-' }}</td>
                    <td>{{ number_format($agent->vouchers ?? 0) }}</td>
                    <td>{{ number_format($agent->orders_count) }}</td>
                    <td>{{ number_format($agent->rows_count) }}</td>
                    <td class="right font-semibold">{{ number_format($agent->points) }}</td>
                </tr>
            @empty
                <tr>
                    <td colspan="8" class="text-center muted" style="padding:24px">No agent point activity found for this filter.</td>
                </tr>
            @endforelse
        </tbody>
    </table>
    @if($agentSummaries->hasPages())
        <div class="p-4 flex items-center justify-between gap-3" style="border-top:1px solid var(--border-2);flex-wrap:wrap">
            <div class="muted text-xs">
                Showing {{ number_format($agentSummaries->firstItem()) }} to {{ number_format($agentSummaries->lastItem()) }} of {{ number_format($agentSummaries->total()) }} agents
            </div>
            <div class="flex items-center gap-1" style="flex-wrap:wrap">
                @if($agentSummaries->onFirstPage())
                    <span class="btn btn-sm" style="opacity:.45;pointer-events:none">Previous</span>
                @else
                    <a href="{{ $agentSummaries->previousPageUrl() }}" class="btn btn-sm">Previous</a>
                @endif

                @foreach($agentSummaries->getUrlRange(max(1, $agentSummaries->currentPage() - 2), min($agentSummaries->lastPage(), $agentSummaries->currentPage() + 2)) as $page => $url)
                    @if($page === $agentSummaries->currentPage())
                        <span class="btn btn-sm btn-primary">{{ $page }}</span>
                    @else
                        <a href="{{ $url }}" class="btn btn-sm">{{ $page }}</a>
                    @endif
                @endforeach

                @if($agentSummaries->hasMorePages())
                    <a href="{{ $agentSummaries->nextPageUrl() }}" class="btn btn-sm">Next</a>
                @else
                    <span class="btn btn-sm" style="opacity:.45;pointer-events:none">Next</span>
                @endif
            </div>
        </div>
    @endif
</section>
@endsection