Ajustes de UX
This commit is contained in:
@@ -110,7 +110,7 @@
|
||||
<span class="text-xs text-gray-500 uppercase tracking-wider">Filtros ativos:</span>
|
||||
<% @chips.each do |chip| %>
|
||||
<span class="inline-flex items-center gap-2 px-3 py-1.5 rounded-full bg-orange-500/15 border border-orange-500/30 text-orange-300 text-xs">
|
||||
<%= chip[:rotulo] %>: <strong class="text-white"><%= chip[:valor] %></strong>
|
||||
<%= chip[:rotulo] %>: <strong class="text-white"><%= chip[:display] || chip[:valor] %></strong>
|
||||
<%= link_to '✕', operacoes_dashboard_path(request.query_parameters.except(chip[:param])),
|
||||
data: { turbo: false }, class: 'hover:text-white font-bold', title: 'Remover filtro' %>
|
||||
</span>
|
||||
@@ -269,6 +269,19 @@
|
||||
const COR_A = '#f97316'; // comparativo: A = laranja da marca
|
||||
const COR_B = '#3b82f6'; // comparativo: B = azul (contraste)
|
||||
|
||||
// Cross-filter por clique nos gráficos: recarrega a página com o filtro,
|
||||
// preservando os demais parâmetros (mesma lógica dos links das tabelas).
|
||||
function aplicarFiltroDash(novos) {
|
||||
const url = new URL(window.location.href);
|
||||
Object.keys(novos).forEach(function (k) {
|
||||
const v = novos[k];
|
||||
if (v === null || v === '') url.searchParams.delete(k);
|
||||
else url.searchParams.set(k, v);
|
||||
});
|
||||
window.location.assign(url.toString());
|
||||
}
|
||||
function cursorPonteiro(e, els) { e.native.target.style.cursor = els.length ? 'pointer' : 'default'; }
|
||||
|
||||
// ── Charts (donut + barras + comparativo) ──
|
||||
function initCharts() {
|
||||
if (typeof Chart === 'undefined') return;
|
||||
@@ -285,7 +298,15 @@
|
||||
borderColor: '#1a1a1a', borderWidth: 2
|
||||
}]
|
||||
},
|
||||
options: { responsive: true, maintainAspectRatio: false, cutout: '62%', plugins: { legend: { display: false } } }
|
||||
options: {
|
||||
responsive: true, maintainAspectRatio: false, cutout: '62%',
|
||||
plugins: { legend: { display: false } },
|
||||
onHover: cursorPonteiro,
|
||||
onClick: function (e, els) {
|
||||
if (!els.length) return;
|
||||
aplicarFiltroDash({ f_resultado: els[0].index === 0 ? 'completed' : 'failed' });
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
@@ -302,6 +323,13 @@
|
||||
},
|
||||
options: {
|
||||
responsive: true, maintainAspectRatio: false,
|
||||
onHover: cursorPonteiro,
|
||||
onClick: function (e, els) {
|
||||
if (!els.length) return;
|
||||
const el = els[0];
|
||||
const iso = String(this.data.labels[el.index]).split('/').reverse().join('-');
|
||||
aplicarFiltroDash({ f_data: iso, f_resultado: el.datasetIndex === 0 ? 'completed' : 'failed' });
|
||||
},
|
||||
scales: {
|
||||
x: { stacked: true, ticks: { color: '#6b7280', maxTicksLimit: 12 }, grid: { color: 'rgba(255,255,255,0.04)' } },
|
||||
y: { stacked: true, beginAtZero: true, ticks: { color: '#6b7280' }, grid: { color: 'rgba(255,255,255,0.04)' } }
|
||||
|
||||
Reference in New Issue
Block a user