From 0a9713c298943c7e9ad44552f0cc351f553bbff55d11d4e2141d9d149e37c773 Mon Sep 17 00:00:00 2001
From: victor <victor@paravatti.com.br>
Date: Tue, 30 Jun 2026 17:15:23 -0300
Subject: [PATCH] =?UTF-8?q?Coloca=C3=A7=C3=A3o=20da=20lupa=20para=20pesqui?=
 =?UTF-8?q?sa=20na=20consolida=C3=A7=C3=A3o=20do=20motorista=20e=20melhor?=
 =?UTF-8?q?=20suporte=20para=20telas=20pequenas?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../controllers/validacao_controller.js       | 23 ++++++++++++++++---
 .../consolidacao_entregas/validar.html.erb    | 23 ++++++++++++++-----
 2 files changed, 37 insertions(+), 9 deletions(-)

diff --git a/app/javascript/controllers/validacao_controller.js b/app/javascript/controllers/validacao_controller.js
index 3e34c95..c984400 100644
--- a/app/javascript/controllers/validacao_controller.js
+++ b/app/javascript/controllers/validacao_controller.js
@@ -6,7 +6,7 @@ import { Controller } from "@hotwired/stimulus"
 
 export default class extends Controller {
   static targets = [
-    "linha", "checkbox", "selecionarTodos",
+    "linha", "checkbox", "selecionarTodos", "busca", "buscaVazia",
     "toggles", "barra", "barraManuais", "percentual", "chipVeiculo",
     "contadorClassificadas", "contadorTotal", "contadorManuais", "manuaisInfo",
     "qtdNormal", "qtdRetirada", "qtdBonus", "qtdDesconto", "qtdExtraordinaria",
@@ -64,10 +64,27 @@ export default class extends Controller {
     }
   }
 
-  // ── Selecionar / desmarcar todos os checkboxes ─────────────
+  // ── Busca na listagem de notas (filtra os cards por NF/local/endereço/veículo) ──
+  filtrarBusca(event) {
+    const q = (event.currentTarget.value || "").trim().toLowerCase()
+    let visiveis = 0
+    this.linhaTargets.forEach(l => {
+      const ok = q === "" || (l.dataset.busca || "").includes(q)
+      l.classList.toggle("hidden", !ok)
+      if (ok) visiveis++
+    })
+    if (this.hasBuscaVaziaTarget)
+      this.buscaVaziaTarget.classList.toggle("hidden", q === "" || visiveis > 0)
+  }
+
+  // ── Selecionar / desmarcar todos os checkboxes (só os visíveis na busca) ──
   selecionarTodos(event) {
     const marcar = event.currentTarget.checked
-    this.checkboxTargets.forEach(c => { c.checked = marcar })
+    this.checkboxTargets.forEach(c => {
+      const linha = c.closest("[data-busca]")
+      if (linha && linha.classList.contains("hidden")) return
+      c.checked = marcar
+    })
   }
 
   // O pilar está ativo (ring-2) na entrega indicada?
diff --git a/app/views/consolidacao_entregas/validar.html.erb b/app/views/consolidacao_entregas/validar.html.erb
index cef8dbc..736afdb 100644
--- a/app/views/consolidacao_entregas/validar.html.erb
+++ b/app/views/consolidacao_entregas/validar.html.erb
@@ -13,7 +13,7 @@
   <div class="lg:shrink-0">
 
   <%# Header %>
-  <div class="mb-6">
+  <div class="mb-3">
     <%= link_to '← Voltar (Passo 1)', wizard_consolidacao_path(@consolidacao),
         class: 'inline-flex items-center gap-1 bg-[#1a1a1a] hover:bg-[#2a2a2a] text-white border border-[#2a2a2a] hover:border-orange-500 font-semibold px-4 py-2.5 rounded-lg text-sm min-h-[44px]' %>
     <div class="flex items-center justify-between mt-2">
@@ -28,7 +28,7 @@
   </div>
 
   <%# Barra de progresso (reflete o veículo selecionado, se houver) %>
-  <div class="bg-[#1a1a1a] border border-[#2a2a2a] rounded-xl p-4 mb-4">
+  <div class="bg-[#1a1a1a] border border-[#2a2a2a] rounded-xl p-3 mb-3">
     <div class="flex justify-between text-sm mb-2">
       <span class="text-white font-semibold">
         <% if @veiculos_sel.any? %>🚚 <%= @veiculos_sel.join(', ') %> — <% end %>
@@ -49,7 +49,7 @@
   <%# Fechar por veículo — filtra a tela por carro e mostra quais já estão fechados.
       Só aparece quando o motorista usou mais de um veículo no período. %>
   <% if @veiculos_status.size > 1 %>
-    <div class="bg-[#1a1a1a] border border-[#2a2a2a] rounded-xl p-4 mb-4">
+    <div class="bg-[#1a1a1a] border border-[#2a2a2a] rounded-xl p-3 mb-3">
       <div class="flex items-center gap-2 mb-2">
         <span class="text-gray-400 text-sm font-semibold">🚗 Fechar por veículo:</span>
         <span class="text-gray-600 text-xs">clique para filtrar/somar um ou vários carros (clique de novo p/ tirar)</span>
@@ -82,7 +82,7 @@
   <% end %>
 
   <%# Ações em massa + filtro %>
-  <div class="bg-[#1a1a1a] border border-[#2a2a2a] rounded-xl p-4 mb-4 flex flex-wrap items-center gap-3">
+  <div class="bg-[#1a1a1a] border border-[#2a2a2a] rounded-xl p-3 mb-3 flex flex-wrap items-center gap-3">
     <label class="flex items-center gap-2 text-gray-300 text-sm cursor-pointer select-none">
       <input type="checkbox" data-validacao-target="selecionarTodos"
              data-action="change->validacao#selecionarTodos"
@@ -116,7 +116,7 @@
       entrega e entrega de termo) num único botão com menu suspenso. Os modais e
       controllers existentes são reaproveitados; só o gatilho mudou. %>
   <% unless @consolidacao.finalizada? && current_user.operador? %>
-    <div class="relative mb-4"
+    <div class="relative mb-3"
          data-controller="ferramentas apontamento-manual apontamento-termo"
          data-apontamento-manual-apontar-manual-url-value="<%= apontar_manual_consolidacao_consolidacao_entregas_path(@consolidacao) %>"
          data-apontamento-termo-apontar-termo-url-value="<%= apontar_termo_consolidacao_consolidacao_entregas_path(@consolidacao) %>"
@@ -259,16 +259,27 @@
   </div>
   <%# Fim do cabeçalho fixo — abaixo só a lista de NFs rola. %>
 
-  <div class="grid grid-cols-1 lg:grid-cols-4 gap-4 lg:flex-1 lg:min-h-0">
+  <div class="grid grid-cols-1 lg:grid-cols-4 gap-3 lg:flex-1 lg:min-h-0">
 
     <%# ── Lista de entregas (3 colunas) — área rolável ──── %>
     <div class="lg:col-span-3 space-y-2 lg:overflow-y-auto lg:pr-1">
+      <%# 🔍 Busca na listagem — filtra os cards por NF, local, endereço ou veículo %>
+      <div class="sticky top-0 z-20 bg-[#0a0a0a] pb-2">
+        <div class="relative">
+          <span class="absolute left-3 top-1/2 -translate-y-1/2 text-gray-500 pointer-events-none">🔍</span>
+          <input type="search" data-validacao-target="busca" data-action="input->validacao#filtrarBusca"
+                 placeholder="Buscar NF, local, endereço ou veículo…" autocomplete="off"
+                 class="w-full bg-[#1a1a1a] border border-[#2a2a2a] rounded-lg pl-10 pr-3 py-2.5 text-sm text-gray-200 placeholder-gray-500 focus:border-orange-500 focus:outline-none">
+        </div>
+        <p data-validacao-target="buscaVazia" class="hidden text-gray-500 text-xs mt-2 px-1">Nenhuma nota encontrada para a busca.</p>
+      </div>
       <% if @entregas.any? %>
         <% @entregas.each do |e| %>
           <% tipos_ativos = (@classificacoes[e.tracking_id] || []).map(&:tipo) %>
           <div class="bg-[#1a1a1a] border <%= e.falhada? ? 'border-red-500/50' : 'border-[#2a2a2a]' %> rounded-xl p-4 flex flex-col lg:flex-row lg:items-center gap-3"
                data-validacao-target="linha" data-tracking="<%= e.tracking_id %>"
                data-vehicle="<%= e.vehicle.presence || '(sem veículo)' %>"
+               data-busca="<%= [e.numero_nf, e.local, e.address, e.vehicle].compact.join(' ').downcase %>"
                data-classificada="<%= tipos_ativos.any? ? '1' : '0' %>">
 
             <%# Checkbox seleção em massa %>