@extends('layouts.admin')

@section('title', "View user")

@push('css')
    <style>
        .admin-user-metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-bottom:18px; }
        .admin-user-metric { padding:18px; background:var(--loot-surface); border:1px solid var(--loot-border); border-radius:8px; }
        .admin-user-metric strong,.admin-user-metric span,.admin-user-metric small { display:block; }
        .admin-user-metric strong { color:var(--loot-text); font-size:1.45rem; }
        .admin-user-metric span,.admin-user-metric small { color:var(--loot-muted); }
        .admin-money-coins { display:block; color:var(--loot-muted); font-size:.72rem; }
        @media (max-width:991px) { .admin-user-metrics { grid-template-columns:repeat(2,1fr); } }
        @media (max-width:575px) { .admin-user-metrics { grid-template-columns:1fr; } }
    </style>
@endpush

@section('content')
    <section class="admin-user-metrics" aria-label="User performance overview">
        <div class="admin-user-metric"><strong>{{ number_format($stats['completed_offers']) }}</strong><span>Completed offers</span></div>
        <div class="admin-user-metric"><strong>{{ format_coins_as_usd($stats['total_cashout']) }}</strong><span>Total cashout</span><small>{{ number_format($stats['total_cashout'], 0) }} coins</small></div>
        <div class="admin-user-metric"><strong>{{ format_coins_as_usd($stats['lifetime_income']) }}</strong><span>Lifetime income</span><small>{{ number_format($stats['lifetime_income'], 0) }} coins</small></div>
        <div class="admin-user-metric"><strong>#{{ number_format($stats['rank']) }}</strong><span>Leaderboard rank</span></div>
    </section>
    <div class="row">
        <div class="col-12">
            <div class="card">
                <div class="card-header">
                    <h4 class="card-title">{{ $user->username }}</h4>
                </div>

                <div class="table-responsive">
                    <table class="table table-hover">
                        <thead>
                        <tr class="text-truncate">
                            <th>User</th>
                            <th>Balance</th>
                            <th>registered IP</th>
                            <th>Last IP</th>
                            <th>User Agent</th>
                            <th>Last Active</th>
                            <th>Created at</th>
                        </tr>
                        </thead>
                        <tbody>
                        <tr>
                            <td class="text-truncate">
                                <div class="d-flex align-items-center">
                                    <div class="avatar" style="margin-right: 1.5rem; font-size: calc(12.8px);">
                                        <img src="{{ $user->avatar() }}" alt="{{ $user->name() }}" height="30"
                                             width="30">
                                    </div>
                                    <div>
                                        <div class="font-weight-bolder">{{ $user->username }}</div>
                                        <div class="font-small-2 text-muted">{{ $user->name() }}</div>
                                    </div>
                                </div>
                            </td>
                            <td class="text-truncate"><strong>{{ format_coins_as_usd($user->current_points) }}</strong><span class="admin-money-coins" title="Stored reward balance">{{ number_format($user->current_points, 0) }} coins</span></td>
                            <td class="text-truncate">{{ $user->registered_ip }}</td>
                            <td class="text-truncate">{{ $user->last_login_ip }}</td>
                            <td>{{ $user->user_agent }}</td>
                            <td class="text-truncate">{{ \Carbon\Carbon::parse($user->last_seen_at)->diffForHumans() }}</td>
                            <td class="text-truncate">{{ \Carbon\Carbon::parse($user->created_at)->diffForHumans() }}</td>
                        </tr>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>

    <div class="row">
        <div class="col-12">
            <div class="card">
                <div class="card-header">
                    <h4 class="card-title">Face Verification</h4>
                </div>
                <div class="card-body">
                    @forelse($user->faceVerifications as $verification)
                        <div class="row align-items-center border-bottom py-1">
                            <div class="col-md-3 mb-1 mb-md-0">
                                <img src="{{ route('face-verifications.image', $verification) }}" alt="Face verification"
                                     style="width:100%;max-width:220px;border-radius:8px;border:1px solid rgba(255,255,255,.12);">
                            </div>
                            <div class="col-md-5 mb-1 mb-md-0">
                                <p class="mb-50">
                                    <span class="loot-status {{ $verification->status === 'approved' ? 'success' : ($verification->status === 'rejected' ? 'danger' : 'warning') }}">
                                        {{ ucfirst(str_replace('_', ' ', $verification->status)) }}
                                    </span>
                                </p>
                                <p class="loot-muted mb-50">Submitted {{ $verification->created_at->diffForHumans() }}</p>
                                <p class="loot-muted mb-50">IP: {{ $verification->ip ?: 'Unknown' }}</p>
                                @if($verification->duplicateOfUser)
                                    <p class="text-warning mb-50">
                                        Exact image replay matched user #{{ $verification->duplicateOfUser->id }}
                                        ({{ $verification->duplicateOfUser->username }}).
                                    </p>
                                @endif
                                @if($verification->admin_note)
                                    <p class="mb-0">{{ $verification->admin_note }}</p>
                                @endif
                            </div>
                            <div class="col-md-4">
                                <form method="POST" action="{{ route('admin.face-verifications.update', $verification) }}">
                                    @csrf
                                    @method('PATCH')
                                    <textarea class="form-control mb-1" name="admin_note" rows="2" placeholder="Admin note">{{ $verification->admin_note }}</textarea>
                                    <div class="d-flex flex-wrap gap-50">
                                        <button class="btn btn-sm btn-success" name="action" value="approve">Approve</button>
                                        <button class="btn btn-sm btn-warning" name="action" value="review">Needs review</button>
                                        <button class="btn btn-sm btn-danger" name="action" value="reject">Reject</button>
                                    </div>
                                </form>
                            </div>
                        </div>
                    @empty
                        <p class="loot-muted mb-0">No face verification has been submitted by this user.</p>
                    @endforelse
                </div>
            </div>
        </div>
    </div>

    <div class="row">
        <div class="col-12">
            <div class="card">
                <div class="card-header">
                    <h4 class="card-title">Leads</h4>
                </div>

                <div class="table-responsive">
                    <table class="table table-hover">
                        <thead>
                        <tr class="text-truncate">
                            <th>User</th>
                            <th>Company</th>
                            <th>User IP</th>
                            <th>Offer ID</th>
                            <th>Offer name</th>
                            <th>Reward</th>
                            <th>Payout</th>
                            <th>FINISHED ON</th>
                        </tr>
                        </thead>
                        <tbody>
                        @foreach($user->leads as $lead)
                            <tr>
                                <td class="text-truncate">
                                    <div class="d-flex align-items-center">
                                        <div class="avatar" style="margin-right: 1.5rem; font-size: calc(12.8px);">
                                            <img
                                                src="{{ $user->avatar() }}"
                                                alt="Avatar" height="30" width="30">
                                        </div>
                                        <div>
                                            <div class="font-weight-bolder">{{ $user->username }}</div>
                                            <div class="font-small-2 text-muted">
                                                {{ $user->email }}
                                            </div>
                                        </div>
                                    </div>
                                </td>
                                <td class="text-truncate">{{ $lead->company }}</td>
                                <td class="text-truncate">{{ $lead->user_ip }}</td>
                                <td class="text-truncate">{{ $lead->offer_id }}</td>
                                <td>{{ $lead->offer_name }}</td>
                                <td class="text-truncate"><strong>{{ format_coins_as_usd($lead->credited_points) }}</strong><span class="admin-money-coins">{{ number_format($lead->credited_points, 0) }} coins</span></td>
                                <td class="text-truncate">${{ number_format((float) $lead->payout, 2) }}</td>
                                <td class="text-truncate">{{ \Carbon\Carbon::createFromDate($lead->created_at)->diffForHumans() }}</td>
                            </tr>
                        @endforeach
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>

    <div class="row">
        <div class="col-12">
            <div class="card">
                <div class="card-header">
                    <h4 class="card-title">Transactions</h4>
                </div>

                <div class="table-responsive">
                    <table class="table table-hover">
                        <thead>
                        <tr>
                            <th>Method</th>
                            <th>Amount</th>
                            <th>Destination</th>
                            <th>Status</th>
                            <th>Requested on</th>
                            <th>Responded on</th>
                        </tr>
                        </thead>

                        <tbody>
                        @foreach($user->withdrawals as $withdrawal)
                            <tr class="text-truncate">
                                <td>{{ $withdrawal->method }}</td>
                                <td><strong>{{ format_coins_as_usd($withdrawal->amount) }}</strong><span class="admin-money-coins">{{ number_format($withdrawal->amount, 0) }} coins</span></td>
                                <td>{{ $withdrawal->account }}</td>
                                <td>
                                    <span class="loot-status {{ $withdrawal->status === 'approved' ? 'success' : ($withdrawal->status === 'rejected' ? 'danger' : 'warning') }}">{{ ucfirst($withdrawal->status) }}</span>
                                </td>
                                <td>{{ \Carbon\Carbon::createFromDate($withdrawal->created_at)->diffForHumans() }}</td>
                                <td>{{ \Carbon\Carbon::createFromDate($withdrawal->updated_at)->diffForHumans() }}</td>
                            </tr>
                        @endforeach
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>

    <div class="row">
        <div class="col">
            <div class="card">
                <div class="card-header">
                    <h4 class="card-title">Edit User</h4>
                </div>
                <div class="card-body">
                    @if(session('success'))
                        <div class="alert alert-success">
                            <div class="alert-body">
                                <p>{{ session('success') }}</p>
                            </div>
                        </div>
                    @endif

                    <form method="POST" action="{{ route('admin.users.update', ['id' => $user->id]) }}">
                        @csrf

                        <div class="col">
                            <label for="balance_usd">Current balance (USD)</label>
                            <input class="form-control" type="number" min="0" step="0.001" name="balance_usd"
                                   value="{{ coins_to_usd($user->current_points) }}" id="balance_usd">
                            <small class="admin-money-coins">{{ number_format($user->current_points, 0) }} coins at {{ number_format(coins_per_usd()) }} coins = $1</small>
                        </div>

                        <div class="col mt-2">
                            <label for="password">Password</label>
                            <input class="form-control" type="password" name="password" id="password">
                        </div>

                        <div class="col">
                            <button class="btn btn-sm-block btn-success mt-1" name="action" value="save">Save</button>

                            @if($user->is_banned)
                                <button class="btn btn-sm-block btn-warning mt-1" name="action" value="ban">Unban
                                </button>
                            @else
                                <button class="btn btn-sm-block btn-danger mt-1" name="action" value="ban">Ban</button>
                            @endif
                        </div>
                    </form>
                </div>

            </div>

            @if(auth()->user()->is_admin && $user->id !== auth()->id())
                <div class="card">
                    <div class="card-header">
                        <h4 class="card-title">Role &amp; permissions</h4>
                    </div>
                    <div class="card-body">
                        <form method="POST" action="{{ route('admin.users.update', ['id' => $user->id]) }}" id="roleForm">
                            @csrf
                            <label class="form-label" for="roleSelect">Role</label>
                            <select class="form-select" name="role" id="roleSelect"
                                    onchange="document.getElementById('rolePerms').style.display = ['support','moderator'].includes(this.value) ? '' : 'none'">
                                @foreach(['user' => 'User', 'support' => 'Support', 'moderator' => 'Moderator', 'admin' => 'Admin (full access)'] as $value => $label)
                                    <option value="{{ $value }}" {{ ($user->role ?? 'user') === $value ? 'selected' : '' }}>{{ $label }}</option>
                                @endforeach
                            </select>

                            <div id="rolePerms" class="mt-1" style="{{ in_array($user->role, ['support', 'moderator']) ? '' : 'display:none' }}">
                                <label class="form-label">Can access</label>
                                <div class="row">
                                    @foreach(array_keys(\App\Models\User::ADMIN_SECTIONS) as $section)
                                        <div class="col-6">
                                            <label class="d-flex align-items-center gap-25" style="cursor:pointer;">
                                                <input type="checkbox" name="permissions[]" value="{{ $section }}"
                                                    {{ in_array($section, $user->admin_permissions ?? [], true) ? 'checked' : '' }}>
                                                <span class="ms-25">{{ ucfirst($section) }}</span>
                                            </label>
                                        </div>
                                    @endforeach
                                </div>
                            </div>

                            <button class="btn btn-sm-block btn-success mt-1" name="action" value="role">Update role</button>
                        </form>
                    </div>
                </div>
            @endif
        </div>
    </div>

@endsection

@push('scripts')

@endpush
