<div>
    <h3>Gestión de Usuarios</h3>

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

    <form wire:submit.prevent="{{ $modoEdicion ? 'actualizar' : 'guardar' }}">
        <form wire:submit.prevent="guardar">
    <div class="mb-3">
        <label for="name">Nombre</label>
        <input type="text" id="name" class="form-control" wire:model="name">
    </div>

    <div class="mb-3">
        <label for="email">Correo</label>
        <input type="email" id="email" class="form-control" wire:model="email">
    </div>

    <div class="mb-3">
        <label for="password">Contraseña</label>
        <input type="password" id="password" class="form-control" wire:model="password">
    </div>

    <div class="mb-3">
        <label for="password_confirmation">Confirmar Contraseña</label>
        <input type="password" id="password_confirmation" class="form-control" wire:model="password_confirmation">
    </div>

    <div class="mb-3">
        <label for="rol">Rol</label>
        <select id="rol" class="form-control" wire:model="rol">
            <option value="">Seleccione un rol</option>
            @foreach(\Spatie\Permission\Models\Role::all() as $r)
                <option value="{{ $r->name }}">{{ ucfirst($r->name) }}</option>
            @endforeach
        </select>
    </div>

    <button class="btn btn-primary">Guardar</button>
</form>


    <table class="table table-bordered">
        <thead class="table-dark">
            <tr>
                <th>Nombre</th>
                <th>Correo</th>
                <th>Acciones</th>
            </tr>
        </thead>
        <tbody>
            @foreach($usuarios as $user)
                <tr>
                    <td>{{ $user->name }}</td>
                    <td>{{ $user->email }}</td>
                    <td>
                        <button wire:click="editar({{ $user->id }})" class="btn btn-sm btn-info">Editar</button>
                        <button wire:click="eliminar({{ $user->id }})" class="btn btn-sm btn-danger"
                                onclick="return confirm('¿Eliminar este usuario?')">Eliminar</button>
                    </td>
                </tr>
            @endforeach
        </tbody>
    </table>

    <div class="d-flex justify-content-center">
        {{ $usuarios->links() }}
    </div>
</div>
