feat: dark/light mode + trading console BI + Chart.js local + fix themeScript

- Dark/light mode toggle across all pages (login, dashboard, corporate, admin, BI)
- BI Executive redesigned as permanent dark trading console (Bloomberg-style)
- Floating vertical nav with anchor scroll for mobile navigation
- Chart.js bundled locally (eliminates CDN dependency)
- Chart.js inlined in HTML for guaranteed loading
- Fix: themeScript </script> tag had literal backslash breaking HTML parser
- Fix: each chart wrapped in individual try/catch for graceful degradation
- No-cache headers on BI page to prevent stale HTML
- Robust init that handles DOMContentLoaded already fired

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
root
2026-02-15 10:21:05 -05:00
parent ddf016a627
commit 95958e9a96
9 changed files with 547 additions and 47 deletions

View File

@@ -2,12 +2,12 @@
* Admin Dashboard Corporate - KPIs, Tendências e Detalhes
* Filtros por período: Este Mês, Mês Anterior, Últimos 2 Meses, ou período customizado
*/
const { buildHeader, buildFooter, buildHead } = require('./ui-template');
const { buildHeader, buildFooter, buildHead, getChartJsScript } = require('./ui-template');
function buildAdminDashboardHTML(user) {
// Support both admin and corporate roles
const role = user.role || 'corporate';
const pageScripts = '<script src="https://cdn.jsdelivr.net/npm/chart.js@4.4.1/dist/chart.umd.min.js"><\/script>';
const pageScripts = getChartJsScript();
// Calculate default dates (current month)
const now = new Date();
@@ -441,6 +441,15 @@ function buildAdminDashboardHTML(user) {
.chart-wrap { height: 200px; }
.details-table th, .details-table td { padding: 6px 4px; font-size: 10px; }
}
/* Dark Mode overrides */
[data-theme="dark"] .preset-btn { background: var(--card); color: var(--text-secondary); border-color: var(--border); }
[data-theme="dark"] .preset-btn:hover { border-color: var(--admin-accent); color: var(--green); }
[data-theme="dark"] .date-inputs input { background: var(--card); color: var(--text); border-color: var(--border); }
[data-theme="dark"] .details-table tr:hover { background: rgba(255,255,255,0.04); }
[data-theme="dark"] .details-table thead th { background: var(--bg); }
[data-theme="dark"] .details-table td { border-bottom-color: var(--border); }
[data-theme="dark"] .loading-overlay { background: rgba(13,17,23,0.85); }
`;
return `<!DOCTYPE html>