@extends('layouts.admin')

@section('title', 'Fidélité - ' . $user->name)

@section('content')
<div class="container-fluid">
    <!-- En-tête -->
    <div class="d-flex justify-content-between align-items-center mb-4">
        <div>
            <nav aria-label="breadcrumb">
                <ol class="breadcrumb mb-1">
                    <li class="breadcrumb-item"><a href="{{ route('admin.loyalty.index') }}">Programme Fidélité</a></li>
                    <li class="breadcrumb-item active">{{ $user->name }}</li>
                </ol>
            </nav>
            <h1 class="h3 mb-0">
                <i class="bi bi-person-badge text-primary me-2"></i>{{ $user->name }}
            </h1>
        </div>
        <a href="{{ route('admin.loyalty.index') }}" class="btn btn-outline-secondary">
            <i class="bi bi-arrow-left me-1"></i> Retour
        </a>
    </div>

    @if(session('success'))
        <div class="alert alert-success alert-dismissible fade show">
            {{ session('success') }}
            <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
        </div>
    @endif

    @if(session('error'))
        <div class="alert alert-danger alert-dismissible fade show">
            {{ session('error') }}
            <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
        </div>
    @endif

    <div class="row">
        <!-- Colonne principale -->
        <div class="col-lg-8">
            <!-- Statistiques utilisateur -->
            <div class="row mb-4">
                <div class="col-md-3">
                    <div class="card bg-success text-white h-100">
                        <div class="card-body text-center">
                            <i class="bi bi-plus-circle fs-2 mb-2"></i>
                            <h4 class="mb-0">{{ number_format($stats['earned']) }}</h4>
                            <small>Points Gagnés</small>
                        </div>
                    </div>
                </div>
                <div class="col-md-3">
                    <div class="card bg-warning text-dark h-100">
                        <div class="card-body text-center">
                            <i class="bi bi-cart-check fs-2 mb-2"></i>
                            <h4 class="mb-0">{{ number_format(abs($stats['redeemed'])) }}</h4>
                            <small>Points Utilisés</small>
                        </div>
                    </div>
                </div>
                <div class="col-md-3">
                    <div class="card bg-danger text-white h-100">
                        <div class="card-body text-center">
                            <i class="bi bi-x-circle fs-2 mb-2"></i>
                            <h4 class="mb-0">{{ number_format(abs($stats['expired'])) }}</h4>
                            <small>Points Expirés</small>
                        </div>
                    </div>
                </div>
                <div class="col-md-3">
                    <div class="card bg-primary text-white h-100">
                        <div class="card-body text-center">
                            <i class="bi bi-wallet2 fs-2 mb-2"></i>
                            <h4 class="mb-0">{{ number_format($stats['available']) }}</h4>
                            <small>Solde Actuel</small>
                        </div>
                    </div>
                </div>
            </div>

            <!-- Historique des transactions -->
            <div class="card">
                <div class="card-header d-flex justify-content-between align-items-center">
                    <h5 class="mb-0"><i class="bi bi-clock-history me-2"></i>Historique des Points</h5>
                    <span class="badge bg-secondary">{{ $points->total() }} transactions</span>
                </div>
                <div class="card-body">
                    <div class="table-responsive">
                        <table class="table table-hover">
                            <thead class="table-light">
                                <tr>
                                    <th>Date</th>
                                    <th>Type</th>
                                    <th>Points</th>
                                    <th>Source</th>
                                    <th>Description</th>
                                </tr>
                            </thead>
                            <tbody>
                                @forelse($points as $point)
                                <tr>
                                    <td>
                                        <small>{{ $point->created_at->format('d/m/Y') }}</small><br>
                                        <small class="text-muted">{{ $point->created_at->format('H:i') }}</small>
                                    </td>
                                    <td>
                                        @php
                                            $typeColors = [
                                                'earned' => 'success',
                                                'bonus' => 'info',
                                                'redeemed' => 'warning',
                                                'expired' => 'danger',
                                                'adjustment' => 'secondary'
                                            ];
                                            $typeLabels = [
                                                'earned' => 'Gagné',
                                                'bonus' => 'Bonus',
                                                'redeemed' => 'Utilisé',
                                                'expired' => 'Expiré',
                                                'adjustment' => 'Ajustement'
                                            ];
                                        @endphp
                                        <span class="badge bg-{{ $typeColors[$point->type] ?? 'secondary' }}">
                                            {{ $typeLabels[$point->type] ?? ucfirst($point->type) }}
                                        </span>
                                    </td>
                                    <td>
                                        <span class="{{ in_array($point->type, ['earned', 'bonus']) ? 'text-success' : 'text-danger' }} fw-bold fs-5">
                                            {{ in_array($point->type, ['earned', 'bonus']) ? '+' : '-' }}{{ number_format(abs($point->points)) }}
                                        </span>
                                    </td>
                                    <td>
                                        @php
                                            $sourceLabels = [
                                                'purchase' => 'Achat',
                                                'admin_bonus' => 'Bonus Admin',
                                                'referral' => 'Parrainage',
                                                'order' => 'Commande',
                                                'admin_deduction' => 'Retrait Admin',
                                                'redemption' => 'Utilisation'
                                            ];
                                        @endphp
                                        <small class="text-muted">{{ $sourceLabels[$point->source] ?? ucfirst($point->source ?? 'N/A') }}</small>
                                    </td>
                                    <td>
                                        <small>{{ Str::limit($point->description, 50) }}</small>
                                    </td>
                                </tr>
                                @empty
                                <tr>
                                    <td colspan="5" class="text-center py-4">
                                        <i class="bi bi-inbox fs-1 text-muted d-block mb-2"></i>
                                        Aucune transaction de points
                                    </td>
                                </tr>
                                @endforelse
                            </tbody>
                        </table>
                    </div>
                    <div class="d-flex justify-content-center mt-3">
                        {{ $points->links() }}
                    </div>
                </div>
            </div>
        </div>

        <!-- Sidebar -->
        <div class="col-lg-4">
            <!-- Informations utilisateur -->
            <div class="card mb-4">
                <div class="card-header">
                    <h5 class="mb-0"><i class="bi bi-person me-2"></i>Informations</h5>
                </div>
                <div class="card-body">
                    <div class="text-center mb-3">
                        <div class="avatar-lg bg-primary bg-opacity-10 rounded-circle mx-auto d-flex align-items-center justify-content-center mb-2" style="width: 80px; height: 80px;">
                            <span class="fs-2 fw-bold text-primary">{{ strtoupper(substr($user->name, 0, 2)) }}</span>
                        </div>
                        <h5 class="mb-1">{{ $user->name }}</h5>
                        <p class="text-muted mb-0">{{ $user->email }}</p>
                    </div>
                    <hr>
                    <ul class="list-unstyled mb-0">
                        <li class="mb-2">
                            <small class="text-muted">Code Membre</small><br>
                            <strong>{{ $user->member_code ?? 'N/A' }}</strong>
                        </li>
                        <li class="mb-2">
                            <small class="text-muted">Téléphone</small><br>
                            <strong>{{ $user->phone ?? 'N/A' }}</strong>
                        </li>
                        <li class="mb-2">
                            <small class="text-muted">Inscrit le</small><br>
                            <strong>{{ $user->created_at->format('d/m/Y') }}</strong>
                        </li>
                    </ul>
                </div>
            </div>

            <!-- Niveau de fidélité -->
            <div class="card mb-4">
                <div class="card-header bg-warning text-dark">
                    <h5 class="mb-0"><i class="bi bi-award me-2"></i>Niveau de Fidélité</h5>
                </div>
                <div class="card-body text-center">
                    @if($currentLevel)
                        <i class="bi bi-trophy fs-1 text-warning mb-2"></i>
                        <h4 class="mb-2">{{ $currentLevel->name }}</h4>
                        <p class="text-muted mb-3">{{ $currentLevel->benefits ?? 'Membre fidèle' }}</p>
                        @if($currentLevel->discount_percent > 0)
                            <span class="badge bg-success fs-6">{{ $currentLevel->discount_percent }}% de réduction</span>
                        @endif
                    @else
                        <i class="bi bi-star fs-1 text-muted mb-2"></i>
                        <h4 class="mb-2">Bronze</h4>
                        <p class="text-muted">Niveau de départ</p>
                    @endif
                    
                    @if($nextLevel)
                        <hr>
                        <small class="text-muted">Prochain niveau: <strong>{{ $nextLevel->name }}</strong></small>
                        @php
                            $pointsNeeded = $nextLevel->min_points - $stats['available'];
                            $progress = ($stats['available'] / $nextLevel->min_points) * 100;
                        @endphp
                        <div class="progress mt-2" style="height: 8px;">
                            <div class="progress-bar bg-success" style="width: {{ min($progress, 100) }}%"></div>
                        </div>
                        <small class="text-muted">Encore {{ number_format($pointsNeeded) }} points</small>
                    @endif
                </div>
            </div>

            <!-- Actions Admin -->
            <div class="card">
                <div class="card-header">
                    <h5 class="mb-0"><i class="bi bi-gear me-2"></i>Actions Admin</h5>
                </div>
                <div class="card-body">
                    <!-- Ajouter des points -->
                    <form action="{{ route('admin.loyalty.add', $user) }}" method="POST" class="mb-3">
                        @csrf
                        <label class="form-label fw-semibold text-success">
                            <i class="bi bi-plus-circle me-1"></i>Ajouter des Points
                        </label>
                        <div class="input-group mb-2">
                            <input type="number" name="points" class="form-control" placeholder="Points" min="1" required>
                            <button type="submit" class="btn btn-success">
                                <i class="bi bi-check"></i>
                            </button>
                        </div>
                        <input type="text" name="description" class="form-control form-control-sm" placeholder="Raison (ex: Bonus fidélité)" required>
                    </form>

                    <hr>

                    <!-- Retirer des points -->
                    <form action="{{ route('admin.loyalty.deduct', $user) }}" method="POST">
                        @csrf
                        <label class="form-label fw-semibold text-danger">
                            <i class="bi bi-dash-circle me-1"></i>Retirer des Points
                        </label>
                        <div class="input-group mb-2">
                            <input type="number" name="points" class="form-control" placeholder="Points" min="1" max="{{ $stats['available'] }}" required>
                            <button type="submit" class="btn btn-danger">
                                <i class="bi bi-check"></i>
                            </button>
                        </div>
                        <input type="text" name="description" class="form-control form-control-sm" placeholder="Raison (ex: Correction)" required>
                        <small class="text-muted">Max: {{ number_format($stats['available']) }} points</small>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection
