@extends('layouts.app')

@section('titulo', 'Productos / Precios')

@section('contenido')
  <div class="topbar">
    <div>
      <div class="eyebrow">Catálogo</div>
      <h2>Productos / Precios</h2>
    </div>
    <a href="{{ route('productos.create') }}" class="btn-gold">＋ Nuevo producto</a>
  </div>

  @include('partials.alertas')

  <div class="kpis" style="grid-template-columns:repeat(3,1fr);">
    <div class="kpi"><div class="lbl">Productos activos</div><div class="val">{{ $activos }}</div></div>
    <div class="kpi"><div class="lbl">Margen promedio</div><div class="val g">{{ $margenPromedio !== null ? \App\Support\Montos::porcentaje(round((float) $margenPromedio)) : '—' }}</div></div>
    <div class="kpi"><div class="lbl">Sin costo asignado</div><div class="val {{ $sinCosto ? 'r' : '' }}">{{ $sinCosto }}</div></div>
  </div>

  <div class="panel">
    <div class="panel-head">
      <h3>{{ $q !== '' ? "Resultados para «{$q}»" : 'Todo el catálogo' }}</h3>
      <form class="search" method="get" action="{{ route('productos.index') }}">
        <input type="text" name="q" placeholder="Buscar por código, descripción o P/N…" value="{{ $q }}">
        <button type="submit">Buscar</button>
        @if ($q !== '')<a class="clear" href="{{ route('productos.index') }}">Limpiar</a>@endif
      </form>
    </div>
    <table>
      <thead>
        <tr><th>Código</th><th>Descripción</th><th>Unid.</th><th style="text-align:right;">Costo</th><th style="text-align:right;">Margen</th><th style="text-align:right;">Precio venta</th><th>Estado</th><th></th></tr>
      </thead>
      <tbody>
        @forelse ($productos as $producto)
        @php($precio = $producto->precioVenta())
        <tr>
          <td class="fol">{{ $producto->codigo }}</td>
          <td class="cliente"><b>{{ $producto->descripcion }}</b><span>{{ $producto->pn ? "P/N {$producto->pn}" : 'Sin P/N' }}</span></td>
          <td>{{ $producto->unidad }}</td>
          <td class="monto" style="text-align:right;">
            @if ($producto->costo_unitario !== null)
              {{ \App\Support\Montos::formatear((float) $producto->costo_unitario, $producto->moneda) }}
            @else
              <span class="sin-dato">—</span>
            @endif
          </td>
          <td class="monto" style="text-align:right; color:var(--gold-dark);">
            {!! $producto->margen_porcentaje !== null ? e(\App\Support\Montos::porcentaje((float) $producto->margen_porcentaje)) : '<span class="sin-dato">—</span>' !!}
          </td>
          <td class="monto" style="text-align:right;">
            {!! $precio !== null ? e(\App\Support\Montos::formatear($precio, $producto->moneda)) : '<span class="sin-dato">—</span>' !!}
          </td>
          <td>
            @if (! $producto->activo)
              <span class="badge neutral"><span class="dot"></span>Inactivo</span>
            @elseif ($producto->costo_unitario === null)
              <span class="badge pend"><span class="dot"></span>Sin costo</span>
            @else
              <span class="badge apr"><span class="dot"></span>Activo</span>
            @endif
          </td>
          <td><a class="icon-btn icono-enlace" href="{{ route('productos.edit', $producto) }}" title="Editar producto">✎</a></td>
        </tr>
        @empty
        <tr><td colspan="8" class="tabla-vacia">No se encontraron productos.</td></tr>
        @endforelse
      </tbody>
    </table>
    @include('partials.paginacion', ['paginador' => $productos])
  </div>
@endsection