{% extends "base.html" %}
{% block titulo %}Catálogo de Productos{% endblock %}
{% block encabezado %}Catálogo de Productos{% endblock %}
{% block contenido %}

<form class="barra" method="get">
  <input class="crece" type="search" name="q" value="{{ q }}" placeholder="Buscar por SKU o descripción…">
  <button class="btn btn--fantasma">Buscar</button>
  <a class="btn btn--primario" href="{{ url_for('catalogo.form') }}">+ Nuevo ítem</a>
</form>

<div class="tarjeta">
  <div style="overflow-x:auto">
  <table class="tabla">
    <thead><tr><th>SKU</th><th>Categoría</th><th>Descripción</th><th class="der">Precio</th><th class="der">Acciones</th></tr></thead>
    <tbody>
      {% for id, cod, cat, desc, precio in filas %}
      <tr>
        <td><span class="chip">{{ cod }}</span></td>
        <td>{{ cat }}</td>
        <td>{{ desc }}</td>
        <td class="der">${{ fmt(precio) }}</td>
        <td class="der">
          <a class="btn btn--fantasma mini" href="{{ url_for('catalogo.form', id_prod=id) }}">Editar</a>
          <form method="post" action="{{ url_for('catalogo.eliminar', id_prod=id) }}" style="display:inline"
                onsubmit="return confirm('¿Eliminar este ítem?')">
            <button class="btn btn--peligro mini">Eliminar</button>
          </form>
        </td>
      </tr>
      {% else %}
      <tr><td colspan="5" class="muted">Catálogo vacío.</td></tr>
      {% endfor %}
    </tbody>
  </table>
  </div>
</div>
{% endblock %}