164 lines
11 KiB
Plaintext
164 lines
11 KiB
Plaintext
<%# app/views/consolidacoes/index.html.erb %>
|
|
<% content_for :title, 'Consolidações' %>
|
|
|
|
<div data-controller="nota-avulsa"
|
|
data-nota-avulsa-buscar-url-value="<%= buscar_nf_consolidacoes_path %>">
|
|
<%# `flex-wrap` nos DOIS níveis: no celular o título mais os três botões
|
|
("Arquivadas", "Nota avulsa", "+ Nova Consolidação") somam mais de 450px e
|
|
não cabem nos 393px da tela. Sem a quebra, eles esticavam a PÁGINA INTEIRA
|
|
para 732px e tudo — incluindo a lista de consolidações — passava a exigir
|
|
rolagem lateral. Medido em 28/08/2026 no iPhone. %>
|
|
<div class="flex flex-wrap items-center justify-between gap-3 mb-6">
|
|
<h1 class="text-2xl font-bold text-white flex items-center gap-2"><%= icone :consolidacoes, espaco: false %> Consolidações</h1>
|
|
<div class="flex flex-wrap gap-2">
|
|
<%= link_to rotulo(:arquivadas, 'Arquivadas', cor: nil), arquivadas_consolidacoes_path,
|
|
class: 'text-gray-400 hover:text-white border border-[#2a2a2a] px-4 py-3 rounded-lg min-h-[48px] flex items-center transition-colors' %>
|
|
<% if policy(Consolidacao).create? %>
|
|
<button type="button" data-action="nota-avulsa#abrir"
|
|
class="text-white border border-dashed border-orange-500/60 hover:border-orange-500 font-semibold px-4 py-3 rounded-lg min-h-[48px] flex items-center gap-2 transition-colors">
|
|
<%= icone :adicionar %> Nota avulsa
|
|
</button>
|
|
<% end %>
|
|
<%= link_to '+ Nova Consolidação', new_consolidacao_path,
|
|
class: 'bg-orange-500 hover:bg-orange-600 text-black font-bold px-5 py-3 rounded-lg min-h-[48px] flex items-center transition-colors' %>
|
|
</div>
|
|
</div>
|
|
|
|
<%# ── Modal "Nota avulsa" — cria a consolidação direto a partir da NF ── %>
|
|
<% if policy(Consolidacao).create? %>
|
|
<div data-nota-avulsa-target="modal" data-action="click->nota-avulsa#fundo"
|
|
class="hidden fixed inset-0 z-50 bg-black/70 flex items-center justify-center p-4">
|
|
<div class="bg-[#1a1a1a] border border-[#2a2a2a] rounded-2xl w-full max-w-lg p-6 max-h-[90vh] overflow-y-auto text-left">
|
|
<div class="flex items-center justify-between mb-1">
|
|
<h2 class="text-xl font-bold text-white flex items-center gap-2"><%= icone :adicionar, espaco: false %> Nota avulsa</h2>
|
|
<button type="button" data-action="nota-avulsa#fechar"
|
|
class="text-gray-500 hover:text-white leading-none" aria-label="Fechar"><%= icone :fechar, cor: nil, tamanho: 'w-6 h-6', espaco: false %></button>
|
|
</div>
|
|
<p class="text-gray-400 text-sm mb-4">Para uma nota que chegou por fora: busque a NF e crie uma consolidação já com o apontamento do motorista.</p>
|
|
|
|
<p data-nota-avulsa-target="erro" class="hidden bg-red-500/10 text-red-400 border border-red-500/30 rounded-lg px-3 py-2 text-sm mb-3"></p>
|
|
|
|
<%# Busca da NF %>
|
|
<div class="flex gap-2 mb-4">
|
|
<input data-nota-avulsa-target="nf" type="text" inputmode="numeric"
|
|
data-action="keydown.enter->nota-avulsa#buscar"
|
|
placeholder="Número da nota (NF)"
|
|
class="flex-1 bg-[#0a0a0a] border border-[#2a2a2a] text-white rounded-lg px-3 py-3 text-base focus:border-orange-500 focus:outline-none">
|
|
<button type="button" data-action="nota-avulsa#buscar"
|
|
class="bg-orange-500 hover:bg-orange-600 text-black font-bold px-5 rounded-lg min-h-[48px]">Buscar</button>
|
|
</div>
|
|
|
|
<%# Form de criação — radios (tracking_id) e tipos[] são enviados nativamente %>
|
|
<%= form_with url: avulsa_consolidacoes_path, method: :post, data: { action: 'submit->nota-avulsa#validar' } do %>
|
|
<div data-nota-avulsa-target="resultados" class="space-y-2 mb-4"></div>
|
|
|
|
<div data-nota-avulsa-target="confirmar" class="hidden border-t border-[#2a2a2a] pt-4">
|
|
<label class="block text-gray-400 text-sm mb-2">Classificar como <span class="text-gray-600">(pode marcar mais de uma)</span></label>
|
|
<div class="grid grid-cols-2 gap-2 mb-4">
|
|
<% [['entrega_normal', :caminhao, 'Entrega Normal', Configuracao.preco_entrega],
|
|
['retirada', :retirada, 'Retirada', Configuracao.preco_retirada],
|
|
['bonus', :bonus, 'Bônus', Configuracao.preco_bonus],
|
|
['desconto', :desconto, 'Desconto', Configuracao.preco_desconto],
|
|
['extraordinaria', :extraordinaria, 'Entrega Extraordinária', Configuracao.preco_extraordinaria]].each do |tipo, ic, label, preco| %>
|
|
<label class="flex items-center gap-2 bg-[#0a0a0a] border border-[#2a2a2a] rounded-lg px-3 py-3 cursor-pointer hover:border-orange-500 text-sm text-white">
|
|
<%= check_box_tag 'tipos[]', tipo, tipo == 'entrega_normal', id: nil, class: 'accent-orange-500' %>
|
|
<span><%= icone ic %> <%= label %><br><span class="text-gray-500 text-xs"><%= moeda(preco) %></span></span>
|
|
</label>
|
|
<% end %>
|
|
</div>
|
|
<%= submit_tag 'Criar consolidação avulsa →',
|
|
class: 'w-full bg-green-600 hover:bg-green-500 text-white font-bold py-3.5 rounded-lg min-h-[48px] cursor-pointer' %>
|
|
</div>
|
|
<% end %>
|
|
</div>
|
|
</div>
|
|
<% end %>
|
|
</div>
|
|
|
|
<%# ── Modo de visualização ──────────────────────────────
|
|
A mesma tela lida de dois jeitos: por CONSOLIDAÇÃO (como o trabalho é
|
|
organizado) e por MOTORISTA (como o pagamento sai). Os filtros abaixo valem
|
|
para os dois — por isso eles viajam junto no link da aba. %>
|
|
<% ctx_filtros = { nome: params[:nome], motorista: params[:motorista], status: params[:status],
|
|
pagamento: params[:pagamento], vehicle: params[:vehicle],
|
|
inicio: params[:inicio], fim: params[:fim] }.compact_blank %>
|
|
<div class="flex flex-wrap items-center gap-2 border-b border-[#2a2a2a] pb-3 mb-5">
|
|
<% [['lista', :consolidacoes, 'Consolidações'], ['motoristas', :motorista, 'Por motorista']].each do |modo, ic, label| %>
|
|
<% ativo = @visao == modo %>
|
|
<%= link_to rotulo(ic, label, cor: (ativo ? nil : 'text-brand-laranja')),
|
|
consolidacoes_path(ctx_filtros.merge(visao: modo)),
|
|
class: "px-4 py-2.5 rounded-xl text-sm font-semibold whitespace-nowrap #{ativo ? 'bg-orange-500 text-black' : 'bg-[#1a1a1a] text-gray-300 border border-[#2a2a2a] hover:border-orange-500'}" %>
|
|
<% end %>
|
|
<span class="text-gray-500 text-xs ml-auto hidden sm:block">
|
|
<%= @visao == 'motoristas' ? 'Quanto cada motorista fechou no período — clique num deles para ver de onde vem o valor' : 'Uma linha por consolidação' %>
|
|
</span>
|
|
</div>
|
|
|
|
<%# ── Filtros ──────────────────────────────────────────── %>
|
|
<%# Filtros em flex-wrap, NÃO em grade de 6 colunas fixas.
|
|
Motivo: os breakpoints do Tailwind (md:, lg:…) enxergam a JANELA, mas o
|
|
conteúdo perde 256px para a sidebar (`main.md:ml-64`). A mesma janela de
|
|
1280px tem duas larguras conforme o menu esteja aberto ou recolhido, então
|
|
`md:grid-cols-6` espremia os campos a ~150px e o texto do botão "Filtrar"
|
|
vazava para fora do fundo. Com flex-wrap + largura mínima, cada campo mantém
|
|
tamanho legível e a linha quebra sozinha conforme o espaço REAL. %>
|
|
<%= form_with url: consolidacoes_path, method: :get,
|
|
class: 'bg-[#1a1a1a] border border-[#2a2a2a] rounded-xl p-4 mb-6 flex flex-wrap items-center gap-3' do |f| %>
|
|
<%# O modo de visualização é mantido ao filtrar (senão filtrar jogava o
|
|
operador de volta para a lista). %>
|
|
<%= hidden_field_tag :visao, @visao %>
|
|
|
|
<% if @visao == 'motoristas' %>
|
|
<%= f.text_field :motorista, value: params[:motorista], placeholder: 'Buscar motorista…',
|
|
class: 'flex-1 basis-48 min-w-0 bg-[#0a0a0a] border border-[#2a2a2a] text-white rounded-lg px-3 py-2.5 focus:border-orange-500 focus:outline-none' %>
|
|
<% else %>
|
|
<%= f.text_field :nome, value: params[:nome], placeholder: 'Buscar por nome…',
|
|
class: 'flex-1 basis-48 min-w-0 bg-[#0a0a0a] border border-[#2a2a2a] text-white rounded-lg px-3 py-2.5 focus:border-orange-500 focus:outline-none' %>
|
|
<% end %>
|
|
|
|
<% if @visao == 'motoristas' %>
|
|
<%# "Consolidado" x "Geral" — a pergunta que o número responde muda com isso:
|
|
Consolidado é o valor JÁ FECHADO (o mesmo do card "Consolidado / Pago" do
|
|
Dashboard); Geral soma também os rascunhos, que ainda mudam de valor. %>
|
|
<%= f.select :status,
|
|
options_for_select([['Consolidado (fechadas)', 'finalizada'],
|
|
['Geral (com rascunhos)', 'todos'],
|
|
['Só rascunhos', 'rascunho']], @status_totais),
|
|
{}, class: 'flex-1 basis-52 min-w-0 bg-[#0a0a0a] border border-[#2a2a2a] text-white rounded-lg px-3 py-2.5' %>
|
|
<% else %>
|
|
<%= f.select :status,
|
|
options_for_select([['Todos os status', ''], ['Rascunho', 'rascunho'], ['Finalizada', 'finalizada']], params[:status]),
|
|
{}, class: 'flex-1 basis-40 min-w-0 bg-[#0a0a0a] border border-[#2a2a2a] text-white rounded-lg px-3 py-2.5' %>
|
|
<% end %>
|
|
|
|
<%# "Pagamento" é status DA CONSOLIDAÇÃO (todos os motoristas dela); no modo
|
|
Por motorista cada linha já mostra pago/a receber, então o filtro sairia
|
|
confuso — some. %>
|
|
<% if @visao != 'motoristas' %>
|
|
<%= f.select :pagamento,
|
|
options_for_select([['Pagamento (todos)', ''], ['Pagas', 'pago'], ['Parciais', 'parcial'], ['Pendentes', 'pendente']], params[:pagamento]),
|
|
{}, class: 'flex-1 basis-44 min-w-0 bg-[#0a0a0a] border border-[#2a2a2a] text-white rounded-lg px-3 py-2.5' %>
|
|
<% end %>
|
|
|
|
<%# No modo Por motorista o período SEMPRE vale (default: mês corrente
|
|
inteiro), então os campos já vêm preenchidos com o que está sendo somado. %>
|
|
<%= f.date_field :inicio, value: (@visao == 'motoristas' ? @inicio.strftime('%Y-%m-%d') : params[:inicio]),
|
|
class: 'flex-1 basis-36 max-w-[13rem] min-w-0 bg-[#0a0a0a] border border-[#2a2a2a] text-white rounded-lg px-3 py-2.5' %>
|
|
|
|
<%= f.date_field :fim, value: (@visao == 'motoristas' ? @fim.strftime('%Y-%m-%d') : params[:fim]),
|
|
class: 'flex-1 basis-36 max-w-[13rem] min-w-0 bg-[#0a0a0a] border border-[#2a2a2a] text-white rounded-lg px-3 py-2.5' %>
|
|
|
|
<%# shrink-0 + whitespace-nowrap: os botões nunca são espremidos a ponto de
|
|
cortar o texto — se faltar espaço, a linha quebra e eles descem inteiros. %>
|
|
<div class="flex gap-2 shrink-0">
|
|
<%= f.submit 'Filtrar', class: 'bg-orange-500 hover:bg-orange-600 text-black font-bold rounded-lg cursor-pointer px-5 py-2.5 whitespace-nowrap' %>
|
|
<%= link_to 'Limpar', consolidacoes_path(visao: @visao), class: 'px-4 py-2.5 text-gray-400 hover:text-white border border-[#2a2a2a] rounded-lg whitespace-nowrap' %>
|
|
</div>
|
|
<% end %>
|
|
|
|
<% if @visao == 'motoristas' %>
|
|
<%= render 'por_motorista' %>
|
|
<% else %>
|
|
<%= render 'lista' %>
|
|
<% end %>
|