diff --git a/static/script.js b/static/script.js
index 7fa3977..beca84e 100644
--- a/static/script.js
+++ b/static/script.js
@@ -7,13 +7,44 @@
let autoMode = false;
let autoInterval = null;
let pollInterval = null;
+let currentAsset = 'btc'; // 'btc', 'usd', 'xau'
const AGENT_EMOJIS = { brief: "π", decio: "π―", papert: "β‘", audit: "π" };
const AGENT_COLORS = { brief: "#4fc3f7", decio: "#ffd54f", papert: "#69f0ae", audit: "#b388ff" };
+// ββ Asset Switching βββββββββββββββββββββββββββββββββββββββββββββββββββββββββββ
+const ASSET_SYMBOLS = { btc: 'βΏ', usd: 'π΅', xau: 'πͺ' };
+const ASSET_LABELS = { btc: 'Bitcoin', usd: 'DΓ³lar', xau: 'Ouro' };
+const ASSET_PAIRS = { btc: 'BTC/USD', usd: 'USD/BRL', xau: 'XAU/USD' };
+
+function switchAsset(asset, btnEl) {
+ if (asset === currentAsset) return;
+ currentAsset = asset;
+
+ // Update sidebar buttons
+ document.querySelectorAll('.sidebar-btn').forEach(b => b.classList.remove('active'));
+ if (btnEl) btnEl.classList.add('active');
+
+ // Update header title dynamically
+ const titleEl = document.querySelector('.logo-text strong');
+ if (titleEl) titleEl.textContent = asset.toUpperCase();
+
+ // Reload data for new asset
+ loadConfig();
+ loadPortfolio();
+ loadMultiStratChart('live');
+ addLog('SYS', `Ativo alterado para ${ASSET_LABELS[asset]} (${ASSET_PAIRS[asset]})`);
+}
+
// ββ Init βββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββ
document.addEventListener('DOMContentLoaded', () => {
updateClock();
setInterval(updateClock, 1000);
+ // Sidebar clock
+ setInterval(() => {
+ const now = new Date();
+ const el = document.getElementById('sidebarClock');
+ if (el) el.textContent = now.toLocaleTimeString('pt-BR', { hour: '2-digit', minute: '2-digit' });
+ }, 1000);
startPolling();
loadAgentRegistry();
loadMetrics();
@@ -75,6 +106,11 @@ function updateStatus(text, type) {
const txt = document.getElementById('statusText');
if (dot) dot.className = `status-dot ${type}`;
if (txt) txt.textContent = text;
+ // Sync sidebar status
+ const sidebarDot = document.getElementById('sidebarStatusDot');
+ const sidebarTxt = document.getElementById('sidebarStatusText');
+ if (sidebarDot) sidebarDot.className = `status-dot ${type}`;
+ if (sidebarTxt) sidebarTxt.textContent = text;
}
// ββ Pipeline βββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββ
diff --git a/static/style.css b/static/style.css
index 8ca068c..373c3ce 100644
--- a/static/style.css
+++ b/static/style.css
@@ -15,27 +15,104 @@
--shadow: 0 8px 32px rgba(0,0,0,0.4);
}
-/* ββ Reset & Base βββββββββββββββββββββββββββββββββββββββββ */
+/* ββ Reset & Base βββββββββββββββββββββββββββββββββββββ */
* { margin: 0; padding: 0; box-sizing: border-box; }
+
+/* ββ Sidebar Layout ββββββββββββββββββββββββββββββββββββ */
body {
+ display: flex;
+ min-height: 100vh;
font-family: 'Exo 2', 'Noto Sans JP', sans-serif;
background: var(--bg-dark);
color: var(--text-primary);
- min-height: 100vh;
overflow-x: hidden;
}
-/* ββ Dashboard Layout βββββββββββββββββββββββββββββββββββββ */
-.dashboard {
+/* ββ Sidebar βββββββββββββββββββββββββββββββββββββββββββ */
+.sidebar {
+ width: 200px;
+ min-height: 100vh;
+ background: var(--bg-card);
+ border-right: 1px solid rgba(79,195,247,0.1);
+ display: flex;
+ flex-direction: column;
+ padding: 20px 0;
+ position: fixed;
+ left: 0;
+ top: 0;
+ bottom: 0;
+ z-index: 100;
+}
+.sidebar-logo {
+ display: flex;
+ align-items: center;
+ gap: 10px;
+ padding: 0 16px 20px;
+ border-bottom: 1px solid rgba(255,255,255,0.05);
+ margin-bottom: 20px;
+}
+.sidebar-logo-icon { font-size: 1.8rem; }
+.sidebar-logo-text { font-size: 0.9rem; line-height: 1.2; color: var(--text-primary); }
+.sidebar-logo-text strong { color: var(--accent-blue); }
+
+.sidebar-nav {
+ display: flex;
+ flex-direction: column;
+ gap: 4px;
+ padding: 0 10px;
+ flex: 1;
+}
+.sidebar-btn {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ gap: 2px;
+ padding: 14px 8px;
+ border: none;
+ border-radius: 12px;
+ background: transparent;
+ color: var(--text-secondary);
+ cursor: pointer;
+ transition: all 0.2s;
+ text-align: center;
+}
+.sidebar-btn:hover {
+ background: var(--bg-card-hover);
+ color: var(--text-primary);
+}
+.sidebar-btn.active {
+ background: rgba(79,195,247,0.1);
+ color: var(--accent-blue);
+ border: 1px solid rgba(79,195,247,0.2);
+}
+.sidebar-icon { font-size: 1.6rem; }
+.sidebar-label { font-size: 0.8rem; font-weight: 600; }
+.sidebar-pair { font-size: 0.65rem; opacity: 0.6; }
+
+.sidebar-footer {
+ padding: 16px;
+ border-top: 1px solid rgba(255,255,255,0.05);
+ text-align: center;
+}
+.sidebar-clock { font-size: 1.1rem; color: var(--accent-blue); margin-bottom: 8px; }
+.sidebar-status { display: flex; align-items: center; justify-content: center; gap: 6px; font-size: 0.75rem; color: var(--text-secondary); }
+
+/* ββ Main Content ββββββββββββββββββββββββββββββββββββββ */
+.main-content {
+ margin-left: 200px;
+ flex: 1;
+ padding: 20px;
+ max-width: calc(100vw - 200px);
+}
+.main-content .dashboard {
max-width: 1400px;
margin: 0 auto;
- padding: 20px;
display: flex;
flex-direction: column;
gap: 24px;
}
-/* ββ Header ββββββββββββββββββββββββββββββββββββββββββββββββ */
+/* ββ Header ββββββββββββββββββββββββββββββββββββββββββββ */
.header {
display: flex;
align-items: center;
diff --git a/templates/index.html b/templates/index.html
index cb4367e..2a02b3e 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -8,7 +8,40 @@
-