Files
Reem-Notas/app/views/admin/romaneios/show.html.erb

90 lines
4.6 KiB
Plaintext

<%# app/views/admin/romaneios/show.html.erb
Editor do romaneio: tabela editável à esquerda, o PDF REAL à direita.
A prévia é um <iframe> de mesma origem, e isso não é preferência: o CSP deste
app está em modo enforcing com `object_src :none` (config/initializers/
content_security_policy.rb), o que bloqueia <embed> e <object>; não há
`frame_src`, então ele cai em `default_src :self` e o iframe passa. Uma data:
URL seria barrada pelo mesmo fallback. %>
<div class="space-y-5"
data-controller="romaneio"
data-romaneio-url-value="<%= admin_romaneio_path(@romaneio) %>"
data-romaneio-pdf-url-value="<%= pdf_admin_romaneio_path(@romaneio) %>"
data-romaneio-veiculo-value="<%= @veiculo %>">
<div class="flex flex-col sm:flex-row sm:items-start sm:justify-between gap-3">
<div>
<h1 class="text-2xl font-bold text-white">
Romaneio de <%= l @romaneio.planned_date, format: '%d/%m/%Y' %>
</h1>
<p class="text-gray-400 text-sm mt-0.5">
<%= @romaneio.operacao_label || 'Sem operação vinculada' %> ·
<%= @romaneio.contagem_por_veiculo.values.sum %> paradas em
<%= @veiculos.size %> veículo(s) ·
importado de <%= @romaneio.origem %>
<%= "em #{l @romaneio.importado_em, format: '%d/%m %H:%M'}" if @romaneio.importado_em %>
</p>
</div>
<div class="flex flex-wrap gap-2">
<%= link_to rotulo(:baixar, 'Baixar todos'),
pdf_admin_romaneio_path(@romaneio),
class: 'px-4 py-2.5 bg-[#f97316] hover:bg-orange-500 text-white font-semibold rounded-xl min-h-[44px] inline-flex items-center' %>
<%# Em BLOCO: button_to sem bloco gera <input type="submit">, que não aceita
o SVG do ícone (ver ApplicationHelper#rotulo). %>
<%= button_to reimportar_admin_romaneio_path(@romaneio, veiculo: @veiculo), method: :post,
form: { data: { turbo_confirm: 'Rebuscar o plano? Os campos que você editou são preservados.' } },
class: 'px-4 py-2.5 bg-[#1a1a1a] hover:bg-[#242424] text-white border border-white/10 rounded-xl min-h-[44px]' do %>
<%= icone :restaurar, cor: nil %> Reimportar plano
<% end %>
<%= link_to 'Voltar', admin_romaneios_path,
class: 'px-4 py-2.5 text-gray-400 hover:text-white min-h-[44px] inline-flex items-center' %>
</div>
</div>
<%= render 'shared/flash' %>
<% if @veiculos.empty? %>
<div class="bg-[#111] border border-white/5 rounded-2xl p-8 text-center">
<p class="text-gray-400">Este romaneio está sem paradas.</p>
<p class="text-gray-500 text-sm mt-1">Clique em “Reimportar plano” ou envie a planilha do plano na tela anterior.</p>
</div>
<% else %>
<%= render 'avisos' %>
<div class="grid grid-cols-1 lg:grid-cols-[minmax(0,1fr)_minmax(0,560px)] gap-5 items-start">
<div class="space-y-4">
<%= render 'controles' %>
<%= render 'tabela', linhas: @linhas %>
<%= render 'removidas', linhas: @removidas %>
</div>
<%# Prévia — no celular vira um bloco recolhido: 6 colunas em tela pequena
exigiriam zoom, e o que importa ali é editar, não conferir o layout. %>
<div class="lg:sticky lg:top-4">
<details class="lg:hidden bg-[#111] border border-white/5 rounded-2xl p-4 mb-4">
<summary class="cursor-pointer text-white font-medium select-none min-h-[44px] flex items-center">
<%= icone :visualizar %> Ver prévia do PDF
</summary>
<%= link_to 'Abrir o PDF deste veículo',
pdf_admin_romaneio_path(@romaneio, veiculo: @veiculo),
class: 'block mt-3 text-orange-400 hover:text-orange-300', target: '_blank', rel: 'noopener' %>
</details>
<div class="hidden lg:block bg-[#111] border border-white/5 rounded-2xl p-4">
<div class="flex items-center justify-between mb-3">
<h2 class="text-white font-semibold text-sm">Prévia — <%= @veiculo %></h2>
<button type="button" data-action="romaneio#atualizarPreview"
class="text-xs text-gray-400 hover:text-white px-3 py-2 rounded-lg hover:bg-white/5">
<%= icone :restaurar, tamanho: 'w-4 h-4' %> Atualizar prévia
</button>
</div>
<iframe data-romaneio-target="preview"
src="<%= pdf_admin_romaneio_path(@romaneio, veiculo: @veiculo) %>"
class="w-full h-[78vh] rounded-xl border border-white/10 bg-white"
title="Pré-visualização do romaneio do veículo <%= @veiculo %>"></iframe>
</div>
</div>
</div>
<% end %>
</div>