@extends('tenant.layouts.app')

@section('content')
<div class="page-headers pe-0">
    <ol class="breadcrumbs">
        <li class="breadcrumb-item"><a><i data-feather="gift" class="stroke-icon"></i> <span>Vendedores</span></a></li>
        <li class="breadcrumb-item"><a><span class="text-primary">Premios canjeables</span></a></li>
    </ol>
</div>

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

<div class="row">
    {{-- Canjear --}}
    <div class="col-12 col-lg-5 mb-3">
        <div class="card h-100 border-0 shadow-sm">
            <div class="card-header"><h5 class="my-0"><i class="fas fa-exchange-alt" style="margin-right:6px;color:#67C23A;"></i> Canjear premio</h5></div>
            <div class="card-body">
                <form method="POST" action="{{ route('tenant.seller_reward.redeem') }}">
                    @csrf
                    <div class="mb-3">
                        <label class="control-label">Vendedor</label>
                        <select name="seller_id" class="form-control" required>
                            <option value="">Seleccione…</option>
                            @foreach($sellers as $s)
                                <option value="{{ $s->id }}">{{ $s->name }} — saldo {{ number_format($s->balance, 2) }} pts</option>
                            @endforeach
                        </select>
                    </div>
                    <div class="mb-3">
                        <label class="control-label">Premio</label>
                        <select name="seller_reward_id" class="form-control" required>
                            <option value="">Seleccione…</option>
                            @foreach($rewards->where('active', true) as $r)
                                <option value="{{ $r->id }}">{{ $r->name }} — {{ number_format($r->points_cost, 2) }} pts @if($r->stock !== null)(stock {{ $r->stock }})@endif</option>
                            @endforeach
                        </select>
                    </div>
                    <button type="submit" class="btn btn-primary w-100"><i class="fas fa-gift"></i> Registrar canje</button>
                </form>
            </div>
        </div>
    </div>

    {{-- Nuevo premio --}}
    <div class="col-12 col-lg-7 mb-3">
        <div class="card h-100 border-0 shadow-sm">
            <div class="card-header"><h5 class="my-0"><i class="fas fa-plus-circle" style="margin-right:6px;color:#409EFF;"></i> Nuevo premio</h5></div>
            <div class="card-body">
                <form method="POST" action="{{ route('tenant.seller_reward.store') }}" class="row g-2">
                    @csrf
                    <div class="col-12 col-md-5">
                        <label class="control-label">Nombre</label>
                        <input type="text" name="name" class="form-control" required>
                    </div>
                    <div class="col-6 col-md-3">
                        <label class="control-label">Costo (pts)</label>
                        <input type="number" step="0.01" min="0.01" name="points_cost" class="form-control" required>
                    </div>
                    <div class="col-6 col-md-2">
                        <label class="control-label">Stock</label>
                        <input type="number" min="0" name="stock" class="form-control" placeholder="∞">
                    </div>
                    <div class="col-12 col-md-2 d-flex align-items-end">
                        <button type="submit" class="btn btn-primary w-100">Crear</button>
                    </div>
                    <div class="col-12">
                        <input type="text" name="description" class="form-control" placeholder="Descripción (opcional)">
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>

{{-- Catálogo --}}
<div class="card mb-3 border-0 shadow-sm">
    <div class="card-header"><h5 class="my-0"><i class="fas fa-trophy" style="margin-right:6px;color:#E6A23C;"></i> Catálogo de premios</h5></div>
    <div class="card-body">
        <div class="table-responsive">
            <table class="table table-hover align-middle">
                <thead><tr><th>Premio</th><th class="text-end">Costo (pts)</th><th class="text-center">Stock</th><th class="text-center">Estado</th><th class="text-end">Acción</th></tr></thead>
                <tbody>
                    @forelse($rewards as $r)
                        <tr>
                            <td>{{ $r->name }}<br><small class="text-muted">{{ $r->description }}</small></td>
                            <td class="text-end fw-bold">{{ number_format($r->points_cost, 2) }}</td>
                            <td class="text-center">{{ $r->stock === null ? '∞' : $r->stock }}</td>
                            <td class="text-center">
                                @if($r->active)<span class="badge bg-success">Activo</span>@else<span class="badge bg-secondary">Inactivo</span>@endif
                            </td>
                            <td class="text-end">
                                <form method="POST" action="{{ route('tenant.seller_reward.toggle', $r->id) }}" class="d-inline">
                                    @csrf
                                    <button class="btn btn-xs {{ $r->active ? 'btn-light' : 'btn-success' }}">{{ $r->active ? 'Desactivar' : 'Activar' }}</button>
                                </form>
                            </td>
                        </tr>
                    @empty
                        <tr><td colspan="5" class="text-center text-muted py-3">Aún no hay premios. Creá uno arriba.</td></tr>
                    @endforelse
                </tbody>
            </table>
        </div>
    </div>
</div>

{{-- Canjes recientes --}}
<div class="card mb-0 border-0 shadow-sm">
    <div class="card-header"><h5 class="my-0"><i class="fas fa-history" style="margin-right:6px;"></i> Canjes recientes</h5></div>
    <div class="card-body">
        <div class="table-responsive">
            <table class="table align-middle">
                <thead><tr><th>Vendedor</th><th>Premio</th><th class="text-end">Puntos</th><th>Fecha</th></tr></thead>
                <tbody>
                    @forelse($redemptions as $rd)
                        <tr>
                            <td>{{ optional($rd->seller)->name ?? ('#'.$rd->seller_id) }}</td>
                            <td>{{ $rd->reward_name }}</td>
                            <td class="text-end text-danger fw-bold">−{{ number_format($rd->points_cost, 2) }}</td>
                            <td class="text-muted">{{ $rd->created_at }}</td>
                        </tr>
                    @empty
                        <tr><td colspan="4" class="text-center text-muted py-3">Sin canjes todavía.</td></tr>
                    @endforelse
                </tbody>
            </table>
        </div>
    </div>
</div>
@endsection