@extends('layouts.admin')

@section('content')
<div class="pt-3 pb-2 mb-3 border-bottom">
    <h1 class="h2 fw-bold">Gestión de Usuarios y Roles</h1>
    <p class="text-muted">Cambia los privilegios de los usuarios de la plataforma de forma visual.</p>
</div>

@if(session('success'))
    <div class="alert alert-success border-0 shadow-sm mb-4">{{ session('success') }}</div>
@endif

<div class="card border-0 shadow-sm">
    <div class="table-responsive">
        <table class="table table-hover align-middle mb-0">
            <thead class="table-light">
                <tr>
                    <th>Nombre</th>
                    <th>Email</th>
                    <th>Rol Actual</th>
                    <th style="width: 280px;">Asignar Nuevo Rol</th>
                </tr>
            </thead>
            <tbody>
                @foreach($users as $user)
                <tr>
                    <td>
                        <div class="fw-bold text-dark">{{ $user->name }}</div>
                    </td>
                    <td>{{ $user->email }}</td>
                    <td>
                        @foreach($user->roles as $role)
                            @if($role->name == 'superadmin')
                                <span class="badge bg-danger text-white px-2 py-1">Superadmin</span>
                            @elseif($role->name == 'admin')
                                <span class="badge bg-warning text-dark px-2 py-1">Admin</span>
                            @else
                                <span class="badge bg-secondary-subtle text-secondary px-2 py-1">Usuario</span>
                            @endif
                        @endforeach
                    </td>
                    <td>
                        <!-- Formulario en línea para actualizar el rol al instante -->
                        <form action="{{ route('admin.users.update-role', $user->id) }}" method="POST" class="d-flex gap-2">
                            @csrf
                            @method('PUT')
                            <select name="role" class="form-select form-select-sm">
                                @foreach($roles as $role)
                                    <option value="{{ $role->name }}" {{ $user->hasRole($role->name) ? 'selected' : '' }}>
                                        {{ ucfirst($role->name) }}
                                    </option>
                                @endforeach
                            </select>
                            <button type="submit" class="btn btn-dark btn-sm px-3">Actualizar</button>
                        </form>
                    </td>
                </tr>
                @endforeach
            </tbody>
        </table>
    </div>
</div>

<div class="mt-3">
    {{ $users->links() }}
</div>
@endsection