@extends('layouts.app')

@section('title', 'Comissões – ' . $guide->name)

@section('content')
<div class="page-header">
    <div>
        <h1 class="page-title">Comissões — {{ $guide->name }}</h1>
        <p class="page-subtitle">Histórico e pagamentos de comissões do guia</p>
    </div>
    <a href="{{ route('guides.index') }}" class="btn btn-ghost">← Guias</a>
</div>

@if(session('success'))
    <div class="alert alert-success" style="margin-bottom:1rem;">{{ session('success') }}</div>
@endif

<div style="display:grid;grid-template-columns:1fr 380px;gap:1.5rem;margin-bottom:1.5rem;">
    <div>
        {{-- Summary card --}}
        <div class="card" style="margin-bottom:1rem;">
            <div class="card-body" style="display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;">
                <div style="text-align:center;">
                    <div style="font-size:1.5rem;font-weight:700;color:var(--warning);">R$ {{ number_format($pending, 2, ',', '.') }}</div>
                    <div style="font-size:.8rem;color:var(--text-muted);">Pendente</div>
                </div>
                <div style="text-align:center;">
                    <div style="font-size:1.5rem;font-weight:700;color:var(--success);">{{ $commissions->where('status','paid')->count() }}</div>
                    <div style="font-size:.8rem;color:var(--text-muted);">Pagas</div>
                </div>
                <div style="text-align:center;">
                    <div style="font-size:1.3rem;font-weight:700;">{{ $guide->commission_type === 'percent' ? $guide->commission_percent.'%' : 'R$ '.number_format($guide->commission_fixed,2,',','.') }}</div>
                    <div style="font-size:.8rem;color:var(--text-muted);">Taxa Padrão</div>
                </div>
                <div style="text-align:center;">
                    <div style="font-size:1.3rem;font-weight:700;">{{ $guide->pix_key ?? '—' }}</div>
                    <div style="font-size:.8rem;color:var(--text-muted);">Chave Pix</div>
                </div>
            </div>
        </div>

        {{-- Commissions table --}}
        <div class="card">
            <div class="card-body" style="padding:0;">
                <table class="data-table">
                    <thead>
                        <tr>
                            <th>Data</th>
                            <th>Venda #</th>
                            <th style="text-align:right;">Valor Venda</th>
                            <th style="text-align:right;">% Comissão</th>
                            <th style="text-align:right;">Valor</th>
                            <th>Status</th>
                        </tr>
                    </thead>
                    <tbody>
                        @forelse($commissions as $c)
                        @php $statusColors = ['pending'=>'badge-warning','approved'=>'badge-info','paid'=>'badge-success','cancelled'=>'badge-danger']; @endphp
                        <tr>
                            <td>{{ $c->commission_at->format('d/m/Y') }}</td>
                            <td>{{ $c->sale?->number ?? '—' }}</td>
                            <td style="text-align:right;">R$ {{ number_format($c->sale_total, 2, ',', '.') }}</td>
                            <td style="text-align:right;">{{ number_format($c->commission_percent, 2, ',', '.') }}%</td>
                            <td style="text-align:right;font-weight:600;">R$ {{ number_format($c->commission_amount, 2, ',', '.') }}</td>
                            <td><span class="badge {{ $statusColors[$c->status] ?? 'badge-gray' }}">{{ ucfirst($c->status) }}</span></td>
                        </tr>
                        @empty
                        <tr><td colspan="6" style="text-align:center;padding:2rem;color:var(--text-muted);">Nenhuma comissão registrada.</td></tr>
                        @endforelse
                    </tbody>
                </table>
            </div>
        </div>
        <div style="margin-top:1rem;">{{ $commissions->links() }}</div>
    </div>

    {{-- Payment panel --}}
    @if($pending > 0)
    <div class="card" style="align-self:start;">
        <div class="card-header"><h3 class="card-title" style="color:var(--success);">Registrar Pagamento</h3></div>
        <form method="POST" action="{{ route('guides.pay', $guide) }}" class="card-body form-grid">
            @csrf
            <div class="form-group" style="grid-column:span 2;">
                <label class="form-label">Valor a Pagar (R$) *</label>
                <input type="number" name="amount" class="form-control" step="0.01" min="0.01" max="{{ $pending }}" value="{{ number_format($pending, 2, '.', '') }}" required>
                <small class="text-muted">Pendente: R$ {{ number_format($pending, 2, ',', '.') }}</small>
            </div>
            <div class="form-group" style="grid-column:span 2;">
                <label class="form-label">Forma de Pagamento *</label>
                <select name="payment_method" class="form-control" required>
                    <option value="pix">Pix</option>
                    <option value="dinheiro">Dinheiro</option>
                    <option value="transferencia">Transferência</option>
                    <option value="cheque">Cheque</option>
                </select>
            </div>
            <div class="form-group" style="grid-column:span 2;">
                <label class="form-label">Comprovante / Referência</label>
                <input type="text" name="reference" class="form-control" placeholder="ID da transação, número do cheque...">
            </div>
            <div style="grid-column:span 2;">
                <button type="submit" class="btn btn-primary" style="width:100%;">Confirmar Pagamento</button>
            </div>
        </form>
    </div>
    @else
    <div class="card" style="align-self:start;">
        <div class="card-body" style="text-align:center;padding:2rem;color:var(--text-muted);">
            <div style="font-size:2rem;">✓</div>
            <div style="margin-top:.5rem;">Sem comissões pendentes</div>
        </div>
    </div>
    @endif
</div>
@endsection