@extends('layouts.app')
@section('title', 'Usuarios — Configuración')
@section('page-title', 'Gestión de Usuarios')
@section('breadcrumb')
    <li class="breadcrumb-item active">Usuarios</li>
@endsection
@section('content')

@if(session('success'))
<div class="alert alert-success alert-dismissible fade show">
    <i class="fas fa-check-circle mr-1"></i> {{ session('success') }}
    <button type="button" class="close" data-dismiss="alert"><span>&times;</span></button>
</div>
@endif
@if(session('error'))
<div class="alert alert-danger alert-dismissible fade show">
    <i class="fas fa-exclamation-circle mr-1"></i> {{ session('error') }}
    <button type="button" class="close" data-dismiss="alert"><span>&times;</span></button>
</div>
@endif

{{-- Filtros --}}
<div class="card card-outline card-primary">
    <div class="card-header d-flex justify-content-between align-items-center">
        <h3 class="card-title"><i class="fas fa-filter mr-1"></i> Filtros</h3>
        <div>
            <a href="{{ route('configuracion.usuarios.pdf') }}" target="_blank" class="btn btn-danger btn-sm mr-1">
                <i class="fas fa-file-pdf mr-1"></i> PDF
            </a>
            <a href="{{ route('configuracion.usuarios.create') }}" class="btn btn-primary btn-sm">
                <i class="fas fa-user-plus mr-1"></i> Nuevo Usuario
            </a>
        </div>
    </div>
    <div class="card-body">
        <form method="GET" action="{{ route('configuracion.usuarios.index') }}">
            <div class="row">
                <div class="col-md-4">
                    <div class="form-group mb-0">
                        <label class="small mb-1">Buscar</label>
                        <input type="text" name="buscar" value="{{ request('buscar') }}"
                               placeholder="Nombre, email o cargo…"
                               class="form-control form-control-sm">
                    </div>
                </div>
                <div class="col-md-2">
                    <div class="form-group mb-0">
                        <label class="small mb-1">Área</label>
                        <select name="area" class="form-control form-control-sm">
                            <option value="">— Todas —</option>
                            @foreach($areas as $a)
                            <option value="{{ $a }}" {{ request('area') === $a ? 'selected' : '' }}>{{ $a }}</option>
                            @endforeach
                        </select>
                    </div>
                </div>
                <div class="col-md-2">
                    <div class="form-group mb-0">
                        <label class="small mb-1">Rol</label>
                        <select name="rol" class="form-control form-control-sm">
                            <option value="">— Todos —</option>
                            @foreach($roles as $r)
                            <option value="{{ $r->name }}" {{ request('rol') === $r->name ? 'selected' : '' }}>{{ $r->name }}</option>
                            @endforeach
                        </select>
                    </div>
                </div>
                <div class="col-md-2">
                    <div class="form-group mb-0">
                        <label class="small mb-1">Estado</label>
                        <select name="activo" class="form-control form-control-sm">
                            <option value="">— Todos —</option>
                            <option value="1" {{ request('activo') === '1' ? 'selected' : '' }}>Activos</option>
                            <option value="0" {{ request('activo') === '0' ? 'selected' : '' }}>Inactivos</option>
                        </select>
                    </div>
                </div>
                <div class="col-md-2 d-flex align-items-end">
                    <button type="submit" class="btn btn-primary btn-sm mr-2"><i class="fas fa-search mr-1"></i>Filtrar</button>
                    <a href="{{ route('configuracion.usuarios.index') }}" class="btn btn-secondary btn-sm">Limpiar</a>
                </div>
            </div>
        </form>
    </div>
</div>

{{-- Tabla --}}
<div class="card">
    <div class="card-header">
        <h3 class="card-title"><i class="fas fa-users mr-1"></i> Usuarios ({{ $usuarios->total() }})</h3>
    </div>
    <div class="card-body p-0">
        <table class="table table-sm table-hover mb-0">
            <thead class="thead-light">
                <tr>
                    <th>Nombre</th>
                    <th>Email</th>
                    <th>DNI</th>
                    <th>Cargo</th>
                    <th>Área</th>
                    <th>Rol</th>
                    <th class="text-center">Estado</th>
                    <th class="text-center">Acciones</th>
                </tr>
            </thead>
            <tbody>
                @forelse($usuarios as $u)
                <tr class="{{ !$u->activo ? 'table-secondary text-muted' : '' }}">
                    <td>
                        <strong>{{ $u->name }}</strong>
                        @if($u->id === auth()->id())
                            <span class="badge badge-info ml-1">Tú</span>
                        @endif
                    </td>
                    <td><small>{{ $u->email }}</small></td>
                    <td><small>{{ $u->dni ?? '—' }}</small></td>
                    <td><small>{{ $u->cargo ?? '—' }}</small></td>
                    <td><small>{{ $u->area ?? '—' }}</small></td>
                    <td>
                        @foreach($u->roles as $rol)
                            <span class="badge badge-primary">{{ $rol->name }}</span>
                        @endforeach
                    </td>
                    <td class="text-center">
                        <form method="POST" action="{{ route('configuracion.usuarios.toggle', $u) }}" class="d-inline">
                            @csrf @method('PATCH')
                            <button type="submit"
                                class="btn btn-xs {{ $u->activo ? 'btn-success' : 'btn-secondary' }}"
                                {{ $u->id === auth()->id() ? 'disabled' : '' }}
                                title="{{ $u->activo ? 'Desactivar' : 'Activar' }}">
                                <i class="fas {{ $u->activo ? 'fa-toggle-on' : 'fa-toggle-off' }}"></i>
                                {{ $u->activo ? 'Activo' : 'Inactivo' }}
                            </button>
                        </form>
                    </td>
                    <td class="text-center">
                        <a href="{{ route('configuracion.usuarios.edit', $u) }}"
                           class="btn btn-xs btn-outline-primary" title="Editar">
                            <i class="fas fa-edit"></i>
                        </a>
                        @if($u->id !== auth()->id())
                        <form method="POST" action="{{ route('configuracion.usuarios.destroy', $u) }}"
                              class="d-inline"
                              onsubmit="return confirm('¿Eliminar usuario {{ addslashes($u->name) }}? Esta acción no se puede deshacer.')">
                            @csrf @method('DELETE')
                            <button type="submit" class="btn btn-xs btn-outline-danger" title="Eliminar">
                                <i class="fas fa-trash"></i>
                            </button>
                        </form>
                        @endif
                    </td>
                </tr>
                @empty
                <tr><td colspan="8" class="text-center text-muted py-3">No hay usuarios con los filtros aplicados.</td></tr>
                @endforelse
            </tbody>
        </table>
    </div>
    @if($usuarios->hasPages())
    <div class="card-footer">{{ $usuarios->links() }}</div>
    @endif
</div>
@endsection