{% extends "base.html" %}
{% block title %}Trabajos en Cola - Metafoliador v2{% endblock %}
{% block breadcrumb %}Trabajos en Cola{% endblock %}
{% block content %}
<div class="page-header"><h2 class="page-title">Trabajos en Cola</h2>
<div style="display:flex;gap:8px">
<button class="btn btn-secondary" onclick="loadJobs()"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" style="width:16px;height:16px"><polyline points="23 4 23 10 17 10"/><path d="M20.49 15a9 9 0 1 1-2.12-9.36L23 10"/></svg>Actualizar</button>
<button class="btn btn-danger" id="btnPurge" style="display:none" onclick="purgeAll()"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" style="width:16px;height:16px"><polyline points="3 6 5 6 21 6"/><path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"/></svg>Limpiar Cola</button>
</div></div>
<div class="card"><div class="card-body"><div class="table-responsive"><table class="table"><thead><tr>
<th data-sort="site_name" onclick="sortJobs('site_name')" style="cursor:pointer">Sitio</th>
<th data-sort="folder_name" onclick="sortJobs('folder_name')" style="cursor:pointer">Serie, Subserie o Expediente</th>
<th data-sort="status" onclick="sortJobs('status')" style="cursor:pointer">Estado</th>
<th data-sort="progress" onclick="sortJobs('progress')" style="cursor:pointer">Progreso</th>
<th data-sort="message" onclick="sortJobs('message')" style="cursor:pointer">Mensaje</th>
<th data-sort="created_at" onclick="sortJobs('created_at')" style="cursor:pointer">Inicio</th>
<th>Acciones</th>
</tr></thead><tbody id="jobsTable"></tbody></table></div></div></div>
{% endblock %}
{% block extra_js %}<script src="/static/js/jobs.js"></script>
<script>document.addEventListener("DOMContentLoaded",function(){if(hasPerm("jobs.purge"))document.getElementById("btnPurge").style.display="";});</script>{% endblock %}