@extends('layouts.comercio')
@section('title','Servicios')
@section('content')
<div class="container-fluid">
  <div class="d-flex justify-content-between align-items-center mb-3">
    <h1 class="mb-0">Servicios</h1>
    <a href="{{ route('admin.services.create') }}" class="btn btn-primary">Nuevo</a>
  </div>

  <form class="row g-2 mb-3" method="get">
    <div class="col-md-4">
      <input class="form-control" type="search" name="q" value="{{ request('q') }}" placeholder="Buscar por nombre...">
    </div>
    <div class="col-md-3">
      <select name="activo" class="form-select form-control">
        <option value="">— Estado —</option>
        <option value="1" @selected(request('activo')==='1')>Activos</option>
        <option value="0" @selected(request('activo')==='0')>Inactivos</option>
      </select>
    </div>
    <div class="col-md-3">
      <input class="form-control" type="number" name="comercio_id" value="{{ request('comercio_id') }}" placeholder="Comercio ID">
    </div>
    <div class="col-md-2"><button class="btn btn-outline-secondary w-100">Filtrar</button></div>
  </form>

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

  <div class="table-responsive">
    <table class="table table-striped align-middle">
      <thead>
        <tr>
          <th>#</th><th>Nombre</th><th>Duración</th><th>Precio</th><th>Comercio</th><th>Estado</th><th></th>
        </tr>
      </thead>
      <tbody>
        @forelse($services as $s)
          <tr>
            <td>{{ $s->id }}</td>
            <td><a href="{{ route('admin.services.show',$s) }}">{{ $s->nombre }}</a></td>
            <td>{{ $s->duracion_min }} min</td>
            <td>${{ number_format($s->precio_base,0,',','.') }}</td>
            <td>{{ $s->comercio_id }}</td>
            <td>
              <span class="badge bg-{{ $s->activo ? 'success' : 'secondary' }}">{{ $s->activo ? 'Activo' : 'Inactivo' }}</span>
            </td>
            <td class="text-end">
              <a class="btn btn-sm btn-outline-primary" href="{{ route('admin.services.edit',$s) }}">Editar</a>
              <form method="POST" action="{{ route('admin.services.destroy',$s) }}" class="d-inline" onsubmit="return confirm('¿Eliminar servicio?')">
                @csrf @method('DELETE')
                <button class="btn btn-sm btn-outline-danger">Eliminar</button>
              </form>
            </td>
          </tr>
        @empty
          <tr><td colspan="7" class="text-center text-muted">Sin resultados</td></tr>
        @endforelse
      </tbody>
    </table>
  </div>

  {{ $services->links() }}
</div>
@endsection