diff --git a/app/javascript/controllers/validacao_controller.js b/app/javascript/controllers/validacao_controller.js index 3b1245c..87708b1 100644 --- a/app/javascript/controllers/validacao_controller.js +++ b/app/javascript/controllers/validacao_controller.js @@ -7,6 +7,7 @@ import { Controller } from "@hotwired/stimulus" export default class extends Controller { static targets = [ "linha", "checkbox", "selecionarTodos", "busca", "buscaVazia", + "barraSelecao", "contadorSelecao", "resumo", "listaCol", "btnResumoLabel", "toggles", "barra", "barraManuais", "percentual", "chipVeiculo", "consolidarBtn", "consolidarHint", @@ -98,6 +99,22 @@ export default class extends Controller { if (linha && linha.classList.contains("hidden")) return c.checked = marcar }) + this.atualizarSelecao() + } + + // ── Barra de ações em massa: só existe quando há seleção ── + // Sem isto os 5 botões de pilar ficavam fixos no topo o tempo todo, comendo + // a altura da lista para não fazer nada (clicar sem seleção só alertava). + atualizarSelecao() { + const n = this.checkboxTargets.filter(c => c.checked).length + if (this.hasContadorSelecaoTarget) this.contadorSelecaoTarget.textContent = n + if (this.hasBarraSelecaoTarget) this.barraSelecaoTarget.classList.toggle("hidden", n === 0) + } + + limparSelecao() { + this.checkboxTargets.forEach(c => (c.checked = false)) + if (this.hasSelecionarTodosTarget) this.selecionarTodosTarget.checked = false + this.atualizarSelecao() } // O pilar está ativo (ring-2) na entrega indicada? @@ -137,8 +154,7 @@ export default class extends Controller { valor: valor }) ids.forEach(id => this.setToggle(id, tipo, !remover)) - this.checkboxTargets.forEach(c => c.checked = false) - if (this.hasSelecionarTodosTarget) this.selecionarTodosTarget.checked = false + this.limparSelecao() // some a barra de ações junto com a seleção this.atualizarResumo(resp) } diff --git a/app/views/consolidacao_entregas/validar.html.erb b/app/views/consolidacao_entregas/validar.html.erb index d5a7407..9b7253e 100644 --- a/app/views/consolidacao_entregas/validar.html.erb +++ b/app/views/consolidacao_entregas/validar.html.erb @@ -12,38 +12,43 @@ <%# Cabeçalho + controles fixos no topo (no desktop); só a lista de NFs rola. %>
- <%# Header %> -
- <%= 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]' %> -
-
-

<%= icone :caminhao, espaco: false %> <%= @motorista %>

-

<%= @consolidacao.nome %> · <%= l @consolidacao.data_inicio, format: :short %> → <%= l @consolidacao.data_fim, format: :short %>

-
- <%= link_to safe_join(['Revisar (Passo 3)', icone(:avancar, cor: nil)], ' '), - revisar_consolidacao_consolidacao_entregas_path(@consolidacao, motorista: @motorista), - class: 'bg-orange-500 hover:bg-orange-600 text-black font-bold px-5 py-3 rounded-lg min-h-[48px] flex items-center' %> + <%# Cabeçalho compacto: voltar, identificação e progresso numa faixa só. + Espaço vertical aqui é CARO — tudo isto fica fixo e é subtraído da lista, + que é o que o ADM realmente precisa ver. Antes eram 178px em dois cards. %> +
+ <%= link_to wizard_consolidacao_path(@consolidacao), title: 'Voltar (Passo 1)', + class: 'shrink-0 inline-flex items-center justify-center gap-1 bg-[#1a1a1a] hover:bg-[#2a2a2a] text-white border border-[#2a2a2a] hover:border-orange-500 font-semibold px-3 h-11 rounded-lg text-sm' do %> + ← + <% end %> + + <%# basis-40: o nome não pode ser espremido até virar "P…" — se não couber + com o resto, a linha quebra em vez de esmagar a identificação. %> +
+

<%= icone :caminhao, espaco: false %> <%= @motorista %>

+

<%= @consolidacao.nome %> · <%= l @consolidacao.data_inicio, format: :short %> → <%= l @consolidacao.data_fim, format: :short %>

+ + <%# Progresso ao lado do título (em vez de um card de 70px só p/ ele). No + celular vai para uma linha própria, no fim, para não brigar pelo espaço. %> +

+ <% if @veiculos_sel.any? %><%= icone :caminhao %> <%= @veiculos_sel.join(', ') %> — <% end %> + <%= @classificadas %>/<%= @total_entregas %> + + · + +<%= @manuais %> manuais + +

+ + <%= link_to revisar_consolidacao_consolidacao_entregas_path(@consolidacao, motorista: @motorista), + class: 'shrink-0 bg-orange-500 hover:bg-orange-600 text-black font-bold px-4 h-11 rounded-lg flex items-center gap-1 text-sm' do %> + Revisar<%= icone :avancar, cor: nil %> + <% end %>
- <%# Barra de progresso (reflete o veículo selecionado, se houver) %> -
-
- - <% if @veiculos_sel.any? %><%= icone :caminhao %> <%= @veiculos_sel.join(', ') %> — <% end %> - <%= @classificadas %> - de <%= @total_entregas %> entregas classificadas - · - +<%= @manuais %> manuais - - -
- <%# Barra com 2 segmentos: laranja/verde = elegíveis classificadas · azul = lançamentos manuais %> -
-
-
-
+ <%# Barra com 2 segmentos: laranja = elegíveis classificadas · azul = manuais %> +
+
+
<%# Fechar por veículo — filtra a tela por carro, mostra o estado (pronto/ @@ -136,47 +141,36 @@
<% end %> - <%# Ações em massa + filtro %> -
-
+ <%# Fim da barra de ações %> + + <%# Ações em massa — SÓ aparecem quando há entregas selecionadas. Ocupavam + 160px fixos para botões que, sem seleção, respondiam com um alerta + pedindo para selecionar algo. %> + +
<%# Fim do cabeçalho fixo — abaixo só a lista de NFs rola. %> @@ -375,6 +397,7 @@ <%# Checkbox seleção em massa %> <%# Dados da entrega %>