Ajustes gerais: overlay visual, validação por banco e limpeza segura em homologação

app/templates/upload.html

@@ -17,8 +17,12 @@
   <button class="btn btn-danger" onclick="limpar()">Limpar Tudo</button>
   <button class="btn btn-success" onclick="baixarPlanilha()">📅 Abrir Planilha</button>
   <button class="btn btn-success" onclick="gerarRelatorio()">📊 Gerar Relatório</button>
+  {% if app_env != "producao" %}
+    <button class="btn btn-warning" onclick="limparFaturas()">🧹 Limpar Faturas (Teste)</button>
+  {% endif %}
 </div>
 
+
 <table>
   <thead>
     <tr>
@@ -124,38 +128,54 @@ function renderTable(statusList = []) {
     window.open('/generate-report', '_blank');
   }
 
-  const dropZone = document.body;
-  dropZone.addEventListener('dragover', (e) => {
-    e.preventDefault();
-    dropZone.classList.add('dragover');
+window.addEventListener('DOMContentLoaded', () => {
+  updateStatus();
+
+  const dragOverlay = document.getElementById("drag-overlay");
+  let dragCounter = 0;
+
+  window.addEventListener("dragenter", e => {
+    dragCounter++;
+    dragOverlay.classList.add("active");
   });
-  dropZone.addEventListener('dragleave', () => {
-    dropZone.classList.remove('dragover');
+
+  window.addEventListener("dragleave", e => {
+    dragCounter--;
+    if (dragCounter <= 0) {
+      dragOverlay.classList.remove("active");
+      dragCounter = 0;
+    }
   });
-  dropZone.addEventListener('drop', (e) => {
+
+  window.addEventListener("dragover", e => {
     e.preventDefault();
-    dropZone.classList.remove('dragover');
+  });
+
+  window.addEventListener("drop", e => {
+    e.preventDefault();
+    dragOverlay.classList.remove("active");
+    dragCounter = 0;
     handleFiles(e.dataTransfer.files);
   });
+});
 
-  window.addEventListener('DOMContentLoaded', updateStatus);
 
-  // Adiciona destaque visual à caixa ao arrastar arquivos na tela toda
-  window.addEventListener('dragover', (e) => {
-    e.preventDefault();
-    document.getElementById('upload-box').classList.add('dragover');
-  });
+async function limparFaturas() {
+  if (!confirm("Deseja realmente limpar todas as faturas e arquivos (somente homologação)?")) return;
 
-  window.addEventListener('dragleave', () => {
-    document.getElementById('upload-box').classList.remove('dragover');
-  });
+  const res = await fetch("/limpar-faturas", { method: "POST" });
+  const data = await res.json();
+  alert(data.message || "Concluído");
+  updateStatus(); // atualiza visual
+}
 
-  window.addEventListener('drop', (e) => {
-    e.preventDefault();
-    document.getElementById('upload-box').classList.remove('dragover');
-    handleFiles(e.dataTransfer.files);
-  });
+window.addEventListener("dragover", e => {
+  e.preventDefault();
+});
 
+window.addEventListener("drop", e => {
+  e.preventDefault();
+});
 </script>
 
 <style>
@@ -224,6 +244,62 @@ function renderTable(statusList = []) {
   font-weight: bold;
 }
 
+.drag-overlay {
+  position: fixed;
+  top: 0; left: 0; right: 0; bottom: 0;
+  background-color: rgba(67, 97, 238, 0.7); /* institucional */
+  z-index: 9999;
+  display: none;
+  align-items: center;
+  justify-content: center;
+  transition: opacity 0.2s ease-in-out;
+  opacity: 0;
+}
+
+.drag-overlay.active {
+  display: flex;
+  opacity: 1;
+}
+
+.drag-overlay-content {
+  text-align: center;
+  color: white;
+  font-size: 1.1rem;
+  font-weight: 600;
+  animation: fadeInUp 0.3s ease;
+  text-shadow: 1px 1px 6px rgba(0, 0, 0, 0.4);
+  margin-top: 0;
+}
+
+.drag-overlay-content svg {
+  margin-bottom: 1rem;
+  width: 72px;
+  height: 72px;
+  fill: white;
+  filter: drop-shadow(0 0 4px rgba(0, 0, 0, 0.4));
+}
+
+@keyframes fadeInUp {
+  from {
+    transform: translateY(10px);
+    opacity: 0;
+  }
+  to {
+    transform: translateY(0);
+    opacity: 1;
+  }
+}
+
+
 </style>
 
+<div class="drag-overlay" id="drag-overlay">
+  <div class="drag-overlay-content">
+    <svg xmlns="http://www.w3.org/2000/svg" width="64" height="64" fill="#fff" viewBox="0 0 24 24">
+      <path d="M12 2C6.477 2 2 6.477 2 12c0 5.522 4.477 10 10 10s10-4.478 10-10c0-5.523-4.477-10-10-10Zm0 13a1 1 0 0 1-1-1v-2.586l-.293.293a1 1 0 0 1-1.414-1.414l2.707-2.707a1 1 0 0 1 1.414 0l2.707 2.707a1 1 0 0 1-1.414 1.414L13 11.414V14a1 1 0 0 1-1 1Z"/>
+    </svg>
+    <p>Solte os arquivos para enviar</p>
+  </div>
+</div>
+
 {% endblock %}