@extends('layouts.app')
@section('titulo','Áreas')
@section('contenido')
<div class="d-flex flex-wrap justify-content-between align-items-center mb-3">
  <h4 class="mb-0"><i class="fa fa-map-location-dot"></i> Áreas de planta</h4>
  <a href="{{ route('areas.create') }}" class="btn btn-primario"><i class="fa fa-plus"></i> Nueva área</a>
</div>
<form method="GET" class="mb-3">
  <div class="input-group">
    <input name="q" value="{{ $busqueda }}" class="form-control" placeholder="Buscar...">
    <button class="btn btn-outline-primary"><i class="fa fa-search"></i></button>
  </div>
</form>
<div class="card">
  <div class="table-responsive">
    <table class="table table-hover mb-0">
      <thead><tr><th>Código</th><th>Nombre</th><th>Sistemas</th><th>Equipos</th><th>Activo</th><th></th></tr></thead>
      <tbody>
      @forelse($registros as $a)
        <tr>
          <td><strong>{{ $a->codigo }}</strong></td>
          <td>{{ $a->nombre }} <small class="text-muted d-block">{{ $a->descripcion }}</small></td>
          <td>{{ $a->sistemas_count }}</td>
          <td>{{ $a->equipos_count }}</td>
          <td><span class="badge text-bg-{{ $a->activo?'success':'secondary' }}">{{ $a->activo?'Sí':'No' }}</span></td>
          <td class="text-end">
            <a href="{{ route('areas.edit', $a) }}" class="btn btn-sm btn-outline-primary"><i class="fa fa-pen"></i></a>
            <form method="POST" action="{{ route('areas.destroy',$a) }}" class="d-inline" onsubmit="return confirm('¿Eliminar?');">
              @csrf @method('DELETE')<button class="btn btn-sm btn-outline-danger"><i class="fa fa-trash"></i></button>
            </form>
          </td>
        </tr>
      @empty
        <tr><td colspan="6" class="text-center text-muted py-4">Sin áreas</td></tr>
      @endforelse
      </tbody>
    </table>
  </div>
</div>
<div class="mt-2">{{ $registros->links() }}</div>
@endsection
