@extends('appshell::layouts.private')

@section('title')
    Affiliate: {{ $affiliate->code }}
@stop

@section('content')

    @if(session('success'))
        <div class="alert alert-success">{{ session('success') }}</div>
    @endif
    @if(session('error'))
        <div class="alert alert-danger">{{ session('error') }}</div>
    @endif

    {{-- ── Header card ──────────────────────────────────── --}}
    <div class="card mb-4">
        <div class="card-body">
            <div class="d-flex justify-content-between align-items-start">
                <div>
                    <h4 class="mb-1">
                        <span class="text-monospace">{{ $affiliate->code }}</span>
                        @php
                            $badgeClass = match($affiliate->status) {
                                'active'    => 'badge-success',
                                'pending'   => 'badge-warning',
                                'suspended' => 'badge-danger',
                                default     => 'badge-secondary',
                            };
                        @endphp
                        <span class="badge {{ $badgeClass }} ml-2">{{ ucfirst($affiliate->status) }}</span>
                    </h4>
                    <p class="mb-0 text-muted">{{ optional($affiliate->user)->email ?? '(no user)' }}</p>
                    <p class="mb-0 text-muted small">
                        Commission:
                        {{ ucfirst($affiliate->commission_type) }}
                        @if($affiliate->commission_type === 'percent')
                            {{ $affiliate->commission_value }}%
                        @else
                            ${{ number_format($affiliate->commission_value, 2) }} flat
                        @endif
                    </p>
                    <p class="mb-0 text-muted small">
                        Member since: {{ $affiliate->created_at->format('d M Y') }}
                    </p>
                </div>

                {{-- Actions --}}
                <div class="d-flex gap-2">
                    @if($affiliate->status !== 'active')
                        <form method="POST"
                              action="{{ route('admin.affiliates.approve', $affiliate->id) }}"
                              class="d-inline">
                            @csrf
                            <button class="btn btn-success btn-sm">Approve</button>
                        </form>
                    @endif
                    @if($affiliate->status !== 'suspended')
                        <form method="POST"
                              action="{{ route('admin.affiliates.suspend', $affiliate->id) }}"
                              class="d-inline">
                            @csrf
                            <button class="btn btn-danger btn-sm"
                                    onclick="return confirm('Suspend this affiliate?')">Suspend</button>
                        </form>
                    @endif
                    <form method="POST"
                          action="{{ route('admin.affiliates.payouts.create', $affiliate->id) }}"
                          class="d-inline">
                        @csrf
                        <button class="btn btn-primary btn-sm"
                                onclick="return confirm('Create payout from all approved un-paid conversions?')">
                            Create Payout
                        </button>
                    </form>
                    <a href="{{ route('admin.affiliates.index') }}"
                       class="btn btn-outline-secondary btn-sm">← Back</a>
                </div>
            </div>

            @if($affiliate->payout_instructions)
                <hr>
                <h6 class="text-muted">Payment Details (affiliate-supplied)</h6>
                <pre class="bg-light p-2 rounded">{{ $affiliate->payout_instructions }}</pre>
            @endif
        </div>
    </div>

    {{-- ── Tabs ─────────────────────────────────────────── --}}
    <ul class="nav nav-tabs mb-3" id="aff-tabs" role="tablist">
        <li class="nav-item">
            <a class="nav-link" id="conv-tab" data-toggle="tab" href="#conversions" role="tab">
                Conversions
                <span class="badge badge-secondary ml-1">{{ $affiliate->conversions->count() }}</span>
            </a>
        </li>
        <li class="nav-item">
            <a class="nav-link" id="clicks-tab" data-toggle="tab" href="#clicks" role="tab">
                Clicks
                <span class="badge badge-secondary ml-1">{{ $affiliate->clicks->count() }}</span>
            </a>
        </li>
        <li class="nav-item">
            <a class="nav-link" id="payouts-tab" data-toggle="tab" href="#payouts" role="tab">
                Payouts
                <span class="badge badge-secondary ml-1">{{ $affiliate->payouts->count() }}</span>
            </a>
        </li>
        <li class="nav-item">
            <a class="nav-link" id="tier2-tab" data-toggle="tab" href="#tier2" role="tab">
                Tier 2 Recruits
                <span class="badge badge-info ml-1">{{ $affiliate->recruits->count() }}</span>
            </a>
        </li>
    </ul>

    <div class="tab-content" id="aff-tab-content">
        {{-- Conversions tab --}}
        <div class="tab-pane fade" id="conversions" role="tabpanel">
            <div class="card">
                <div class="card-body p-0">
                    <table class="table table-hover mb-0">
                        <thead>
                        <tr>
                            <th>Recruit</th>
                            <th>Email</th>
                            <th>Status</th>
                            <th>Joined</th>
                            <th>Order</th>
                            <th>Tier</th>
                            <th class="text-right">Amount</th>
                            <th class="text-right">Commission</th>
                            <th>Actions</th>
                        </tr>
                        </thead>
                        <tbody>
                        @forelse($affiliate->conversions as $conversion)
                            @php
                                $convBadge = match($conversion->status) {
                                    'approved' => 'badge-success',
                                    'pending'  => 'badge-warning',
                                    'rejected' => 'badge-danger',
                                    'paid'     => 'badge-primary',
                                    default    => 'badge-secondary',
                                };
                            @endphp
                            @php
                                $convUser  = $conversion->user ?? optional($conversion->order)->user;
                                $convEmail = optional($convUser)->email
                                    ?? optional(optional($conversion->order)->billpayer)->getEmail()
                                    ?? null;
                            @endphp
                            <tr>
                                <td>
                                    @if($convUser)
                                        <a href="{{ route('admin.people.show', $convUser->id) }}">
                                            {{ $convUser->name ?? $convUser->email }}
                                        </a>
                                    @else
                                        <span class="text-muted">—</span>
                                    @endif
                                </td>
                                <td class="text-muted small">{{ $convEmail ?? '—' }}</td>
                                <td><span class="badge {{ $convBadge }}">{{ ucfirst($conversion->status) }}</span></td>
                                <td class="small">{{ $conversion->created_at->format('d M Y') }}</td>
                                <td>
                                    @if($conversion->order)
                                        <a href="{{ route('vanilo.admin.order.show', $conversion->order) }}">
                                            {{ $conversion->order->number }}
                                        </a>
                                    @else
                                        <span class="text-muted">—</span>
                                    @endif
                                </td>
                                <td>
                                    <span class="badge {{ $conversion->tier === 2 ? 'badge-info' : 'badge-secondary' }}">
                                        Tier {{ $conversion->tier ?? 1 }}
                                    </span>
                                </td>
                                <td class="text-right">${{ number_format($conversion->amount, 2) }}</td>
                                <td class="text-right">${{ number_format($conversion->commission, 2) }}</td>
                                <td>
                                    @if($conversion->status === 'pending')
                                        <form method="POST"
                                              action="{{ route('admin.affiliates.conversions.approve', $conversion->id) }}"
                                              class="d-inline">
                                            @csrf
                                            <button class="btn btn-xs btn-success">Approve</button>
                                        </form>
                                        <form method="POST"
                                              action="{{ route('admin.affiliates.conversions.reject', $conversion->id) }}"
                                              class="d-inline">
                                            @csrf
                                            <button class="btn btn-xs btn-outline-danger">Reject</button>
                                        </form>
                                    @else
                                        <span class="text-muted small">—</span>
                                    @endif
                                </td>
                            </tr>
                        @empty
                            <tr>
                                <td colspan="9" class="text-center py-4">
                                    <div class="text-muted">📊 <strong>Conversions tab</strong> — no conversions recorded for this affiliate yet.</div>
                                </td>
                            </tr>
                        @endforelse
                        </tbody>
                        <tfoot>
                        <tr class="font-weight-bold">
                            <td colspan="7" class="text-right">Total Commission:</td>
                            <td class="text-right">
                                ${{ number_format($affiliate->conversions->sum('commission'), 2) }}
                            </td>
                            <td></td>
                        </tr>
                        </tfoot>
                    </table>
                </div>
            </div>
        </div>

        {{-- Clicks tab --}}
        <div class="tab-pane fade" id="clicks" role="tabpanel">
            <div class="card">
                <div class="card-body p-0">
                    <table class="table table-hover mb-0">
                        <thead>
                        <tr>
                            <th>#</th>
                            <th>IP</th>
                            <th>Landing URL</th>
                            <th>Referrer</th>
                            <th>Converted</th>
                            <th>Date</th>
                        </tr>
                        </thead>
                        <tbody>
                        @forelse($affiliate->clicks as $click)
                            <tr>
                                <td>{{ $click->id }}</td>
                                <td>{{ $click->ip }}</td>
                                <td class="text-truncate" style="max-width:200px;"
                                    title="{{ $click->landing_url }}">{{ $click->landing_url }}</td>
                                <td class="text-truncate" style="max-width:150px;"
                                    title="{{ $click->referrer }}">{{ $click->referrer ?? '—' }}</td>
                                <td>
                                    @if($click->converted_at)
                                        <span class="badge badge-success">Yes</span>
                                    @else
                                        <span class="badge badge-light">No</span>
                                    @endif
                                </td>
                                <td>{{ $click->created_at->format('d M Y H:i') }}</td>
                            </tr>
                        @empty
                            <tr>
                                <td colspan="6" class="text-center py-4">
                                    <div class="text-muted">🖱️ <strong>Clicks tab</strong> — no click tracking data for this affiliate yet.</div>
                                </td>
                            </tr>
                        @endforelse
                        </tbody>
                    </table>
                </div>
            </div>
        </div>

        {{-- Payouts tab --}}
        <div class="tab-pane fade" id="payouts" role="tabpanel">
            <div class="card">
                <div class="card-body p-0">
                    <table class="table table-hover mb-0">
                        <thead>
                        <tr>
                            <th>#</th>
                            <th class="text-right">Amount</th>
                            <th>Status</th>
                            <th>Reference</th>
                            <th>Paid At</th>
                            <th>Actions</th>
                        </tr>
                        </thead>
                        <tbody>
                        @forelse($affiliate->payouts as $payout)
                            <tr>
                                <td>{{ $payout->id }}</td>
                                <td class="text-right">${{ number_format($payout->amount, 2) }}</td>
                                <td>
                                    <span class="badge {{ $payout->isPaid() ? 'badge-success' : 'badge-warning' }}">
                                        {{ ucfirst($payout->status) }}
                                    </span>
                                </td>
                                <td>{{ $payout->reference ?? '—' }}</td>
                                <td>{{ optional($payout->paid_at)->format('d M Y') ?? '—' }}</td>
                                <td>
                                    <a href="{{ route('admin.affiliates.payouts.show', $payout->id) }}"
                                       class="btn btn-xs btn-outline-secondary">Details</a>
                                    <a href="{{ route('admin.affiliates.payouts.export.csv', $payout->id) }}"
                                       class="btn btn-xs btn-outline-secondary">CSV</a>
                                </td>
                            </tr>
                        @empty
                            <tr>
                                <td colspan="6" class="text-center py-4">
                                    <div class="text-muted">💸 <strong>Payouts tab</strong> — no payouts have been created for this affiliate yet.</div>
                                </td>
                            </tr>
                        @endforelse
                        </tbody>
                    </table>
                </div>
            </div>
        </div>

        {{-- Tier 2 Recruits tab --}}
        <div class="tab-pane fade" id="tier2" role="tabpanel">
            <div class="card">
                <div class="card-body p-0">
                    <table class="table table-hover mb-0">
                        <thead>
                        <tr>
                            <th>Recruit</th>
                            <th>Email</th>
                            <th>Status</th>
                            <th>Joined</th>
                            <th class="text-right">Tier 1 Conversions</th>
                            <th class="text-right">Tier 1 Commission</th>
                            <th class="text-right">Tier 2 Conversions</th>
                            <th class="text-right">Tier 2 Commission Earned</th>
                            <th></th>
                        </tr>
                        </thead>
                        <tbody>
                        @forelse($affiliate->recruits as $recruit)
                            @php
                                $rb = match($recruit->status) {
                                    'active'    => 'badge-success',
                                    'pending'   => 'badge-warning',
                                    'suspended' => 'badge-danger',
                                    default     => 'badge-secondary',
                                };
                                $t1Convs    = $recruit->conversions->where('tier', 1);
                                $t2Convs    = $recruit->conversions->where('tier', 2);
                            @endphp
                            <tr>
                                <td><span class="text-monospace">{{ $recruit->code }}</span></td>
                                <td class="text-muted small">{{ optional($recruit->user)->email ?? '—' }}</td>
                                <td><span class="badge {{ $rb }}">{{ ucfirst($recruit->status) }}</span></td>
                                <td class="small">{{ $recruit->created_at->format('d M Y') }}</td>
                                <td class="text-right">{{ $t1Convs->count() }}</td>
                                <td class="text-right">${{ number_format($t1Convs->sum('commission'), 2) }}</td>
                                <td class="text-right">{{ $t2Convs->count() }}</td>
                                <td class="text-right">
                                    @if($t2Convs->count())
                                        ${{ number_format($t2Convs->sum('commission'), 2) }}
                                    @else
                                        <span class="text-muted">—</span>
                                    @endif
                                </td>
                                <td>
                                    <a href="{{ route('admin.affiliates.show', $recruit->id) }}"
                                       class="btn btn-xs btn-outline-secondary">View →</a>
                                </td>
                            </tr>
                        @empty
                            <tr>
                                <td colspan="9" class="text-center py-4">
                                    <div class="text-muted">👥 <strong>Recruits tab</strong> — this affiliate has not referred any sub-affiliates yet.</div>
                                </td>
                            </tr>
                        @endforelse
                        </tbody>
                        @if($affiliate->recruits->count())
                            <tfoot>
                            <tr class="font-weight-bold">
                                <td colspan="4" class="text-right">Totals:</td>
                                <td class="text-right">{{ $affiliate->recruits->sum(fn($r) => $r->conversions->where('tier',1)->count()) }}</td>
                                <td class="text-right">${{ number_format($affiliate->recruits->sum(fn($r) => $r->conversions->where('tier',1)->sum('commission')), 2) }}</td>
                                <td class="text-right">{{ $affiliate->recruits->sum(fn($r) => $r->conversions->where('tier',2)->count()) }}</td>
                                <td class="text-right">${{ number_format($affiliate->recruits->sum(fn($r) => $r->conversions->where('tier',2)->sum('commission')), 2) }}</td>
                                <td></td>
                            </tr>
                            </tfoot>
                        @endif
                    </table>
                </div>
            </div>
        </div>
    </div>

@push('footer-scripts')
<script>
document.addEventListener('DOMContentLoaded', function () {
    var tabs  = document.querySelectorAll('#aff-tabs [data-toggle="tab"]');
    var panes = document.querySelectorAll('#aff-tab-content .tab-pane');

    function activate(hash) {
        var target = hash && hash.length > 1 ? hash : '#conversions';
        tabs.forEach(function (t) { t.classList.remove('active'); });
        panes.forEach(function (p) { p.classList.remove('active', 'show'); });
        var link = document.querySelector('#aff-tabs a[href="' + target + '"]');
        var pane = document.querySelector('#aff-tab-content ' + target);
        if (link) link.classList.add('active');
        if (pane) pane.classList.add('active', 'show');
    }

    tabs.forEach(function (tab) {
        tab.addEventListener('click', function (e) {
            e.preventDefault();
            var href = this.getAttribute('href');
            activate(href);
            history.replaceState(null, null, href);
        });
    });

    activate(window.location.hash);
});
</script>
@endpush

@stop