@extends('layouts.app')
@section('title', 'Usuários · '.config('app.name'))
@section('content')
<div class="row between" style="margin-bottom:18px">
    <div><h1 style="margin-bottom:4px">Usuários</h1><div class="muted">Controle quem pode acessar o sistema desta empresa.</div></div>
    <span class="badge">{{ $users->count() }} usuário(s)</span>
</div>

<div class="grid grid-2" style="align-items:start">
    <div class="card">
        <h2>Novo usuário</h2>
        <p class="small muted">Administradores acessam configurações, integrações e usuários. Operadores usam os módulos operacionais.</p>
        <form method="POST" action="{{ route('users.store') }}">@csrf
            <div class="grid grid-2">
                <div class="field"><label>Nome *</label><input name="name" value="{{ old('name') }}" required></div>
                <div class="field"><label>E-mail *</label><input type="email" name="email" value="{{ old('email') }}" required></div>
                <div class="field"><label>Perfil *</label><select name="role" required><option value="operator" @selected(old('role','operator') === 'operator')>Operador</option><option value="admin" @selected(old('role') === 'admin')>Administrador</option></select></div>
                <div class="field"><label>Situação</label><select name="active"><option value="1" @selected(old('active','1') == '1')>Ativo</option><option value="0" @selected(old('active') === '0')>Inativo</option></select></div>
                <div class="field"><label>Senha *</label><input type="password" name="password" minlength="8" required autocomplete="new-password"></div>
                <div class="field"><label>Confirmar senha *</label><input type="password" name="password_confirmation" minlength="8" required autocomplete="new-password"></div>
            </div>
            <button class="btn primary" type="submit">Criar usuário</button>
        </form>
    </div>

    <div class="grid">
        @forelse($users as $user)
            <div class="card">
                <div class="row between" style="margin-bottom:12px">
                    <div><h3 style="margin-bottom:3px">{{ $user->name }}</h3><div class="small muted">{{ $user->email }}</div></div>
                    <div class="row"><span class="badge {{ $user->active ? 'ok' : 'bad' }}">{{ $user->active ? 'Ativo' : 'Inativo' }}</span><span class="badge">{{ $user->role === 'admin' ? 'Administrador' : 'Operador' }}</span></div>
                </div>
                <form method="POST" action="{{ route('users.update', $user) }}">@csrf @method('PUT')
                    <div class="grid grid-2">
                        <div class="field"><label>Nome</label><input name="name" value="{{ $user->name }}" required></div>
                        <div class="field"><label>E-mail</label><input type="email" name="email" value="{{ $user->email }}" required></div>
                        <div class="field"><label>Perfil</label><select name="role" @disabled($user->is(auth()->user()))><option value="operator" @selected($user->role === 'operator')>Operador</option><option value="admin" @selected($user->role === 'admin')>Administrador</option></select>@if($user->is(auth()->user()))<input type="hidden" name="role" value="admin">@endif</div>
                        <div class="field"><label>Situação</label><select name="active" @disabled($user->is(auth()->user()))><option value="1" @selected($user->active)>Ativo</option><option value="0" @selected(!$user->active)>Inativo</option></select>@if($user->is(auth()->user()))<input type="hidden" name="active" value="1">@endif</div>
                        <div class="field"><label>Nova senha</label><input type="password" name="password" minlength="8" autocomplete="new-password" placeholder="Deixe em branco para manter"></div>
                        <div class="field"><label>Confirmar nova senha</label><input type="password" name="password_confirmation" minlength="8" autocomplete="new-password"></div>
                    </div>
                    <button class="btn secondary" type="submit">Salvar alterações</button>
                </form>
            </div>
        @empty
            <div class="card empty-state">Nenhum usuário cadastrado.</div>
        @endforelse
    </div>
</div>
@endsection