{% extends "base.html" %}
{% block title %}Archivo de facturas{% endblock %}
{% block page_title %}Archivo de facturas{% endblock %}

{% block topbar_actions %}
<a href="{{ url_for('facturas.masivo_subir') }}" class="btn btn-primary btn-sm">
  <i class="bi bi-cloud-upload me-1"></i>Subir facturas
</a>
{% endblock %}

{% block content %}
{% if not por_proveedor %}
<div class="text-center py-5">
  <i class="bi bi-archive text-muted" style="font-size:4rem"></i>
  <h5 class="mt-3 text-muted">El archivo está vacío</h5>
  <p class="text-muted small">Sube facturas en lote y se organizarán aquí por proveedor.</p>
  <a href="{{ url_for('facturas.masivo_subir') }}" class="btn btn-primary mt-2">
    <i class="bi bi-cloud-upload me-1"></i>Subir facturas
  </a>
</div>
{% else %}

<div class="row g-3 mb-4">
  <div class="col-auto">
    <div class="stat-card" style="background:linear-gradient(135deg,#4f86f7,#3a6fd8);min-width:160px">
      <div class="small opacity-75">Proveedores</div>
      <div class="fs-3 fw-bold">{{ por_proveedor|length }}</div>
    </div>
  </div>
  <div class="col-auto">
    <div class="stat-card" style="background:linear-gradient(135deg,#28a745,#1e7e34);min-width:160px">
      <div class="small opacity-75">Facturas archivadas</div>
      <div class="fs-3 fw-bold">{{ por_proveedor.values()|map('length')|sum }}</div>
    </div>
  </div>
</div>

{% for proveedor, archivos in por_proveedor.items() %}
<div class="card mb-3">
  <div class="card-header py-3 d-flex justify-content-between align-items-center">
    <div class="d-flex align-items-center gap-2">
      <i class="bi bi-truck text-primary"></i>
      <span class="fw-semibold">{{ proveedor.replace('_', ' ') }}</span>
      <span class="badge bg-secondary rounded-pill">{{ archivos|length }}</span>
    </div>
  </div>
  <div class="card-body p-0">
    <div class="table-responsive">
      <table class="table table-hover mb-0">
        <thead>
          <tr>
            <th style="width:3rem"></th>
            <th>Archivo</th>
            <th class="text-end no-print">Acciones</th>
          </tr>
        </thead>
        <tbody>
          {% for archivo in archivos %}
          <tr>
            <td class="ps-3">
              {% if archivo.lower().endswith('.pdf') %}
                <i class="bi bi-file-earmark-pdf text-danger fs-5"></i>
              {% else %}
                <i class="bi bi-file-earmark-image text-primary fs-5"></i>
              {% endif %}
            </td>
            <td class="align-middle small">{{ archivo }}</td>
            <td class="text-end align-middle">
              <button type="button" class="btn btn-sm btn-outline-primary"
                data-url="{{ url_for('facturas.ver_archivo', filepath=proveedor + '/' + archivo) }}"
                data-nombre="{{ archivo }}"
                onclick="verArchivo(this.dataset.url, this.dataset.nombre)">
                <i class="bi bi-eye me-1"></i>Ver
              </button>
            </td>
          </tr>
          {% endfor %}
        </tbody>
      </table>
    </div>
  </div>
</div>
{% endfor %}
{% endif %}
{% endblock %}