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

Arrumar a tela do dashboard e correção dos graficos

Browse Source
This commit is contained in:
victor
2026-07-13 17:35:04 -03:00
parent b55b602eb5
commit 8e73bbe0ed
2 changed files with 68 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

55
app/views/dashboard/index.html.erb
View File

@@ -219,14 +219,16 @@
<canvas id="grafico-diario"></canvas>
</div>
<%# Entregas por dia (volume) — complementa o valor acima %>
<%# Resultado por dia (entregue x falhada x pendente) — mostra a taxa de insucesso %>
<div class="flex items-center justify-between mt-6 mb-4 pt-6 border-t border-white/5">
<div>
<h2 class="text-lg font-semibold text-white">Entregas por dia</h2>
<p class="text-gray-400 text-sm">Volume de entregas no período</p>
<h2 class="text-lg font-semibold text-white">Resultado por dia</h2>
<p class="text-gray-400 text-sm">Entregues, falhadas e pendentes no período</p>
</div>
<div class="flex items-center gap-2 text-xs text-gray-400">
<span class="inline-block w-3 h-2 bg-[#f97316]/60 rounded-sm"></span> Entregas
<div class="flex items-center gap-3 text-xs text-gray-400">
<span class="flex items-center gap-1.5"><span class="inline-block w-3 h-2 bg-green-500 rounded-sm"></span> Entregues</span>
<span class="flex items-center gap-1.5"><span class="inline-block w-3 h-2 bg-red-500 rounded-sm"></span> Falhadas</span>
<span class="flex items-center gap-1.5"><span class="inline-block w-3 h-2 bg-yellow-500 rounded-sm"></span> Pendentes</span>
</div>
</div>
<div class="relative flex-1 min-h-48">
@@ -640,29 +642,36 @@
})();
</script>
<%# Barras de entregas por dia (volume — complementa a evolução do custo) %>
<%# Barras empilhadas: resultado das entregas por dia (entregue/falhada/pendente) %>
<script>
(function () {
const ctx = document.getElementById('grafico-entregas-dia');
if (!ctx || typeof Chart === 'undefined') return;
Chart.getChart(ctx)?.destroy();
const labels = <%= raw @grafico_diario[:labels].to_json %>;
const qtds = <%= raw @grafico_diario[:qtds].to_json %>;
const labels = <%= raw @grafico_status[:labels].to_json %>;
const entregues = <%= raw @grafico_status[:entregues].to_json %>;
const falhadas = <%= raw @grafico_status[:falhadas].to_json %>;
const pendentes = <%= raw @grafico_status[:pendentes].to_json %>;
const barra = (label, data, cor) => ({
label: label,
data: data,
backgroundColor: cor,
borderRadius: 4,
borderSkipped: false,
maxBarThickness: 28
});
new Chart(ctx, {
type: 'bar',
data: {
labels: labels,
datasets: [{
label: 'Entregas',
data: qtds,
backgroundColor: 'rgba(249, 115, 22, 0.55)',
hoverBackgroundColor: '#f97316',
borderRadius: 6,
borderSkipped: false,
maxBarThickness: 28
}]
datasets: [
barra('Entregues', entregues, 'rgba(34, 197, 94, 0.75)'),
barra('Falhadas', falhadas, 'rgba(239, 68, 68, 0.85)'),
barra('Pendentes', pendentes, 'rgba(234, 179, 8, 0.70)')
]
},
options: {
responsive: true,
@@ -678,16 +687,24 @@
bodyColor: '#ffffff',
padding: 12,
callbacks: {
label: (c) => ` Entregas: ${c.parsed.y}`
}
label: (c) => ` ${c.dataset.label}: ${c.parsed.y}`,
footer: (items) => {
const total = items.reduce((s, i) => s + i.parsed.y, 0);
const falha = items.find(i => i.dataset.label === 'Falhadas')?.parsed.y || 0;
return total > 0 ? `Total: ${total} · Insucesso: ${(falha / total * 100).toFixed(1)}%` : '';
}
},
footerColor: '#9ca3af'
}
},
scales: {
x: {
stacked: true,
grid: { display: false, drawBorder: false },
ticks: { color: '#6b7280', font: { size: 11 }, maxTicksLimit: 10 }
},
y: {
stacked: true,
beginAtZero: true,
grid: { color: 'rgba(255,255,255,0.04)', drawBorder: false },
ticks: { color: '#6b7280', font: { size: 11 }, precision: 0 }