victor/Reem-Notas
SHA256
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fases 7 e 8 — PDFs Prawn + QR + Painel Motorista + Notificações

Browse Source
This commit is contained in:
victor
2026-06-11 18:31:38 -03:00
parent 90ed705ed8
commit 8b3d4bc87f
21 changed files with 942 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

41
app/views/consolidacao_mailer/pagamento_fechado.html.erb Normal file
View File

@@ -0,0 +1,41 @@
<%# app/views/consolidacao_mailer/pagamento_fechado.html.erb %>
<div style="font-family: Arial, sans-serif; max-width: 520px; margin: 0 auto; background: #0a0a0a; border-radius: 12px; overflow: hidden;">
<div style="background: #0a0a0a; padding: 24px; border-left: 6px solid #f97316;">
<h1 style="color: #ffffff; margin: 0; font-size: 20px;">GADE HOSPITALAR</h1>
<p style="color: #f97316; margin: 4px 0 0; font-size: 13px;">Sistema de Logística</p>
</div>
<div style="background: #ffffff; padding: 28px;">
<h2 style="color: #0a0a0a; margin-top: 0;">Olá, <%= @user.nome.split.first %>! 👋</h2>
<p style="color: #374151; font-size: 15px; line-height: 1.6;">
Seu pagamento de entregas foi fechado pela empresa.
</p>
<table style="width: 100%; margin: 20px 0; border-collapse: collapse;">
<tr>
<td style="background: #f3f4f6; padding: 10px 14px; font-weight: bold; color: #374151;">Período</td>
<td style="padding: 10px 14px; color: #0a0a0a;"><%= @consolidacao.nome %></td>
</tr>
</table>
<div style="background: #f97316; border-radius: 10px; padding: 20px; text-align: center; margin: 20px 0;">
<p style="color: rgba(0,0,0,0.6); margin: 0; font-size: 12px; font-weight: bold;">VALOR A RECEBER</p>
<p style="color: #0a0a0a; margin: 6px 0 0; font-size: 32px; font-weight: 900;">
R$ <%= format('%.2f', @valor).gsub('.', ',') %>
</p>
</div>
<p style="text-align: center; margin: 24px 0;">
<a href="<%= @link_painel %>"
style="background: #0a0a0a; color: #f97316; text-decoration: none; padding: 14px 28px; border-radius: 8px; font-weight: bold; display: inline-block;">
Ver meu painel e baixar holerite →
</a>
</p>
<p style="color: #9ca3af; font-size: 12px; text-align: center;">
Entre com seu PIN de 4 números ou escaneie o QR Code do seu holerite.
</p>
</div>
</div>

63
app/views/consolidacoes/preview_holerite.html.erb Normal file
View File

@@ -0,0 +1,63 @@
<%# app/views/consolidacoes/preview_holerite.html.erb — renderizado sem layout, dentro do modal %>
<div class="bg-white text-black rounded-xl p-6 font-sans">
<%# Cabeçalho estilo PDF %>
<div class="bg-[#0a0a0a] rounded-lg p-4 mb-5 flex items-center gap-3">
<div class="w-2 h-12 bg-orange-500 rounded"></div>
<div>
<p class="text-white font-black text-lg leading-tight">GADE HOSPITALAR</p>
<p class="text-orange-500 text-xs">Holerite de Pagamento — Entregas</p>
</div>
</div>
<%# Identificação %>
<table class="w-full text-sm mb-5 border border-gray-200 rounded">
<tr class="border-b border-gray-200">
<td class="bg-gray-100 font-bold px-3 py-2 w-32">Motorista</td>
<td class="px-3 py-2"><%= @motorista %></td>
</tr>
<tr class="border-b border-gray-200">
<td class="bg-gray-100 font-bold px-3 py-2">Consolidação</td>
<td class="px-3 py-2"><%= @consolidacao.nome %></td>
</tr>
<tr>
<td class="bg-gray-100 font-bold px-3 py-2">Período</td>
<td class="px-3 py-2"><%= l @consolidacao.data_inicio, format: :short %> a <%= l @consolidacao.data_fim, format: :short %></td>
</tr>
</table>
<%# Proventos %>
<table class="w-full text-sm mb-5">
<thead>
<tr class="bg-[#0a0a0a] text-white">
<th class="text-left px-3 py-2">Descrição</th>
<th class="text-right px-3 py-2">Qtd</th>
<th class="text-right px-3 py-2">Valor</th>
</tr>
</thead>
<tbody class="divide-y divide-gray-200">
<% ConsolidacaoEntrega::TIPO_CORES.each do |tipo, cfg| %>
<% qtd = @resumo[tipo] || 0 %>
<% next if qtd.zero? %>
<% valor = @entregas.where(tipo: tipo).sum(:valor_aplicado) %>
<tr>
<td class="px-3 py-2"><%= cfg[:label] %></td>
<td class="px-3 py-2 text-right"><%= qtd %></td>
<td class="px-3 py-2 text-right font-semibold <%= tipo == 'desconto' ? 'text-red-600' : '' %>">
<%= tipo == 'desconto' ? '-' : '+' %> <%= moeda(valor) %>
</td>
</tr>
<% end %>
</tbody>
</table>
<%# Total %>
<div class="bg-orange-500 rounded-lg p-4 text-center">
<p class="text-xs font-bold text-black/70">VALOR LÍQUIDO A RECEBER</p>
<p class="text-3xl font-black text-black"><%= moeda(@total) %></p>
</div>
<p class="text-gray-400 text-xs text-center mt-4">
O PDF final inclui o QR Code de acesso rápido ao painel do motorista.
</p>
</div>

114
app/views/consolidacoes/show.html.erb Normal file
View File

@@ -0,0 +1,114 @@
<%# app/views/consolidacoes/show.html.erb %>
<% content_for :title, @consolidacao.nome %>
<div class="max-w-4xl mx-auto">
<div class="mb-6">
<%= link_to '← Consolidações', consolidacoes_path, class: 'text-gray-500 hover:text-orange-500 text-sm' %>
<div class="flex flex-col md:flex-row md:items-center md:justify-between gap-3 mt-2">
<div>
<div class="flex items-center gap-3">
<h1 class="text-2xl font-bold text-white"><%= @consolidacao.nome %></h1>
<%= badge_status(@consolidacao.status) %>
</div>
<p class="text-gray-400 text-sm mt-1">
📅 <%= l @consolidacao.data_inicio, format: :short %> → <%= l @consolidacao.data_fim, format: :short %>
· Criada por <%= @consolidacao.criador.nome_display %>
<% if @consolidacao.finalizada? %>
· Finalizada por <%= @consolidacao.finalizador&.nome_display %> em <%= l @consolidacao.finalizado_em, format: :short %>
<% end %>
</p>
</div>
<div class="flex gap-2">
<% if @consolidacao.rascunho? %>
<%= link_to '✏️ Continuar validação', wizard_consolidacao_path(@consolidacao),
class: 'bg-orange-500 hover:bg-orange-600 text-black font-bold px-5 py-3 rounded-lg min-h-[48px] flex items-center' %>
<% end %>
<% if policy(@consolidacao).destroy? && !@consolidacao.arquivada? %>
<%= button_to '📁 Arquivar', arquivar_consolidacao_path(@consolidacao), method: :post,
data: { turbo_confirm: 'Arquivar esta consolidação? Ela não será excluída, apenas movida para o arquivo.' },
class: 'text-gray-400 hover:text-white border border-[#2a2a2a] px-4 py-3 rounded-lg min-h-[48px]' %>
<% end %>
</div>
</div>
</div>
<%# Total geral %>
<div class="bg-[#1a1a1a] border border-orange-500 rounded-xl p-6 mb-6 text-center">
<p class="text-gray-400 text-sm">Valor total da consolidação</p>
<p class="text-orange-500 font-black text-4xl"><%= moeda(@consolidacao.valor_total) %></p>
</div>
<%# Motoristas + botões de PDF %>
<h2 class="text-white font-bold text-lg mb-3">👥 Motoristas</h2>
<div class="space-y-3">
<% @motoristas.each do |cm| %>
<div class="bg-[#1a1a1a] border border-[#2a2a2a] rounded-xl p-5">
<div class="flex flex-col md:flex-row md:items-center md:justify-between gap-4">
<div>
<p class="text-white font-bold text-lg"><%= cm.motorista_nome %></p>
<p class="text-orange-500 font-black text-xl"><%= moeda(cm.valor_total) %></p>
</div>
<div class="flex flex-wrap gap-2">
<%# Preview abre modal %>
<button onclick="abrirPreview('<%= preview_holerite_consolidacao_path(@consolidacao, motorista: cm.motorista_nome) %>')"
class="bg-[#0a0a0a] hover:bg-[#2a2a2a] text-white border border-orange-500 font-semibold px-4 py-3 rounded-lg text-sm min-h-[48px]">
👁️ Ver antes de gerar
</button>
<%= link_to '📄 Relatório Individual',
gerar_pdf_relatorio_consolidacao_path(@consolidacao, motorista: cm.motorista_nome),
class: 'bg-orange-800 hover:bg-orange-700 text-white font-semibold px-4 py-3 rounded-lg text-sm min-h-[48px] flex items-center' %>
<%= link_to '🧾 Gerar Holerite',
gerar_pdf_holerite_consolidacao_path(@consolidacao, motorista: cm.motorista_nome),
class: 'bg-orange-500 hover:bg-orange-600 text-black font-bold px-4 py-3 rounded-lg text-sm min-h-[48px] flex items-center' %>
</div>
</div>
</div>
<% end %>
</div>
</div>
<%# ── Modal de Preview ─────────────────────────────────── %>
<div id="modal-preview" class="fixed inset-0 bg-black/80 z-50 hidden items-center justify-center p-4">
<div class="bg-[#1a1a1a] border border-[#2a2a2a] rounded-2xl max-w-2xl w-full max-h-[85vh] flex flex-col">
<div class="flex items-center justify-between px-6 py-4 border-b border-[#2a2a2a]">
<h3 class="text-white font-bold">👁️ Pré-visualização do Holerite</h3>
<button onclick="fecharPreview()" class="text-gray-400 hover:text-white text-2xl min-w-[44px] min-h-[44px]">✕</button>
</div>
<div id="modal-preview-conteudo" class="overflow-y-auto p-6 flex-1">
<div class="flex justify-center py-10"><div class="spinner w-10 h-10"></div></div>
</div>
<div class="flex gap-3 px-6 py-4 border-t border-[#2a2a2a]">
<a id="modal-confirmar" href="#"
class="flex-1 bg-orange-500 hover:bg-orange-600 text-black font-bold py-3 rounded-lg text-center min-h-[48px] flex items-center justify-center">
✓ Confirmar e baixar PDF
</a>
<button onclick="fecharPreview()"
class="px-6 py-3 text-gray-400 hover:text-white border border-[#2a2a2a] rounded-lg min-h-[48px]">
← Voltar
</button>
</div>
</div>
</div>
<script>
async function abrirPreview(url) {
const modal = document.getElementById('modal-preview');
const conteudo = document.getElementById('modal-preview-conteudo');
modal.classList.remove('hidden');
modal.classList.add('flex');
conteudo.innerHTML = '<div class="flex justify-center py-10"><div class="spinner w-10 h-10"></div></div>';
const resp = await fetch(url);
conteudo.innerHTML = await resp.text();
// O link de confirmar aponta para o PDF do mesmo motorista
document.getElementById('modal-confirmar').href =
url.replace('preview_holerite', 'gerar_pdf_holerite');
}
function fecharPreview() {
const modal = document.getElementById('modal-preview');
modal.classList.add('hidden');
modal.classList.remove('flex');
}
</script>

10
app/views/layouts/mailer.html.erb Normal file
View File

@@ -0,0 +1,10 @@
<%# app/views/layouts/mailer.html.erb %>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body style="margin: 0; padding: 20px; background: #f3f4f6;">
<%= yield %>
</body>
</html>

73
app/views/motorista/dashboard/index.html.erb Normal file
View File

@@ -0,0 +1,73 @@
<%# app/views/motorista/dashboard/index.html.erb — Painel do Motorista %>
<% content_for :title, 'Meu Painel' %>
<div class="max-w-2xl mx-auto">
<h1 class="text-2xl font-bold text-white mb-1">Olá, <%= current_user.nome.split.first %>! 👋</h1>
<p class="text-gray-400 mb-6">Aqui estão seus valores de entregas.</p>
<%# ── 2 Cards grandes ─────────────────────────────────── %>
<div class="grid grid-cols-1 md:grid-cols-2 gap-4 mb-8">
<%# Card 1 — Valor Estimado (LARANJA) %>
<div class="bg-orange-500 rounded-2xl p-6">
<p class="text-black/70 font-bold text-sm uppercase tracking-wide">💰 Valor estimado deste mês</p>
<p class="text-black font-black text-4xl mt-2"><%= moeda(@valor_estimado) %></p>
<p class="text-black/70 text-sm mt-2">
<%= @entregas_mes %> entregas feitas e confirmadas
</p>
<p class="text-black/50 text-xs mt-3">
⚠️ Valor aproximado. O valor certo sai quando a empresa fechar o pagamento.
</p>
</div>
<%# Card 2 — Valor Consolidado (BRANCO) %>
<div class="bg-white rounded-2xl p-6">
<p class="text-gray-500 font-bold text-sm uppercase tracking-wide">✅ Valor fechado para pagamento</p>
<p class="text-black font-black text-4xl mt-2"><%= moeda(@valor_consolidado) %></p>
<p class="text-gray-500 text-sm mt-2">
Soma dos pagamentos já confirmados pela empresa
</p>
</div>
</div>
<%# ── Lista de consolidações ──────────────────────────── %>
<h2 class="text-white font-bold text-lg mb-3">📋 Meus pagamentos</h2>
<% if @minhas_consolidacoes.any? %>
<div class="space-y-3">
<% @minhas_consolidacoes.each do |c| %>
<% cm = c.consolidacao_motoristas.find_by(motorista_nome: current_user.nome) %>
<div class="bg-[#1a1a1a] border border-[#2a2a2a] rounded-xl p-5">
<div class="flex flex-col md:flex-row md:items-center md:justify-between gap-3">
<div>
<div class="flex items-center gap-2">
<p class="text-white font-bold"><%= c.nome %></p>
<%= badge_status(c.status) %>
</div>
<p class="text-gray-400 text-sm mt-1">
📅 <%= l c.data_inicio, format: :short %> a <%= l c.data_fim, format: :short %>
</p>
<p class="text-orange-500 font-black text-xl mt-1"><%= moeda(cm&.valor_total || 0) %></p>
</div>
<% if c.finalizada? %>
<%= link_to '⬇️ Baixar meu holerite',
gerar_pdf_holerite_consolidacao_path(c, motorista: current_user.nome),
class: 'bg-orange-500 hover:bg-orange-600 text-black font-bold px-5 py-3.5 rounded-lg min-h-[48px] flex items-center justify-center text-center' %>
<% else %>
<span class="text-gray-500 text-sm px-4 py-3 border border-[#2a2a2a] rounded-lg text-center">
⏳ Aguardando fechamento
</span>
<% end %>
</div>
</div>
<% end %>
</div>
<% else %>
<div class="bg-[#1a1a1a] border border-[#2a2a2a] rounded-xl p-10 text-center">
<p class="text-4xl mb-3">📭</p>
<p class="text-gray-400">Você ainda não aparece em nenhum pagamento.</p>
<p class="text-gray-500 text-sm mt-1">Quando a empresa fechar um período com suas entregas, ele aparece aqui.</p>
</div>
<% end %>
</div>

75
app/views/motorista/sessoes/new.html.erb Normal file
View File

@@ -0,0 +1,75 @@
<%# app/views/motorista/sessoes/new.html.erb — Login por PIN (mobile-first, público baixo tech) %>
<% content_for :title, 'Entrar — Motorista' %>
<div class="min-h-screen flex items-center justify-center p-4">
<div class="w-full max-w-sm">
<%# Logo %>
<div class="text-center mb-8">
<div class="w-16 h-16 bg-orange-500 rounded-2xl flex items-center justify-center font-black text-black text-3xl mx-auto mb-3">G</div>
<h1 class="text-white font-bold text-2xl">Gade Logística</h1>
<p class="text-gray-400 text-base mt-1">Digite seu PIN de 4 números</p>
</div>
<%= form_with url: motorista_login_path, method: :post, id: 'form-pin' do |f| %>
<%# Mostradores do PIN %>
<div class="flex justify-center gap-3 mb-8" id="pin-display">
<% 4.times do |i| %>
<div class="pin-dot w-14 h-16 bg-[#1a1a1a] border-2 border-[#2a2a2a] rounded-xl flex items-center justify-center text-white text-3xl font-black"></div>
<% end %>
</div>
<%= hidden_field_tag :pin, '', id: 'pin-valor' %>
<%# Teclado numérico grande %>
<div class="grid grid-cols-3 gap-3">
<% [1,2,3,4,5,6,7,8,9].each do |n| %>
<button type="button" onclick="digitar('<%= n %>')"
class="bg-[#1a1a1a] hover:bg-[#2a2a2a] active:bg-orange-500 active:text-black text-white font-bold text-2xl rounded-xl py-5 min-h-[64px] transition-colors">
<%= n %>
</button>
<% end %>
<button type="button" onclick="apagar()"
class="bg-[#1a1a1a] hover:bg-red-900 text-white font-bold text-xl rounded-xl py-5 min-h-[64px]">
⌫
</button>
<button type="button" onclick="digitar('0')"
class="bg-[#1a1a1a] hover:bg-[#2a2a2a] active:bg-orange-500 active:text-black text-white font-bold text-2xl rounded-xl py-5 min-h-[64px]">
0
</button>
<button type="submit" id="btn-entrar" disabled
class="bg-orange-500 disabled:bg-[#2a2a2a] disabled:text-gray-600 text-black font-bold text-xl rounded-xl py-5 min-h-[64px] transition-colors">
✓
</button>
</div>
<% end %>
<p class="text-gray-500 text-sm text-center mt-6">
💡 Você também pode escanear o QR Code do seu holerite para entrar direto.
</p>
<p class="text-center mt-4">
<%= link_to 'Sou administrador/gerente →', new_user_session_path, class: 'text-orange-500 hover:text-orange-400 text-sm' %>
</p>
</div>
</div>
<script>
let pin = '';
function digitar(n) {
if (pin.length >= 4) return;
pin += n;
atualizar();
if (pin.length === 4) {
// Envia automaticamente após o 4º dígito
setTimeout(() => document.getElementById('form-pin').requestSubmit(), 250);
}
}
function apagar() { pin = pin.slice(0, -1); atualizar(); }
function atualizar() {
document.getElementById('pin-valor').value = pin;
document.querySelectorAll('.pin-dot').forEach((d, i) => {
d.textContent = pin[i] ? '●' : '';
d.classList.toggle('border-orange-500', !!pin[i]);
});
document.getElementById('btn-entrar').disabled = pin.length !== 4;
}
</script>