feat(broadcast): 播报Tab添加到index.html

This commit is contained in:
xxm
2026-08-21 15:23:12 +08:00
parent 5eeb31668d
commit c549bc57df
+38
View File
@@ -116,6 +116,7 @@ body { background: #0f0f13; color: #e2e8f0; }
<button class="tab-btn px-4 py-2 text-sm rounded-lg" data-tab="principles">📐 开发原则</button>
<button class="tab-btn px-4 py-2 text-sm rounded-lg" data-tab="research">📋 研究</button>
<button class="tab-btn px-4 py-2 text-sm rounded-lg" data-tab="docs">📚 文档</button>
<button class="tab-btn px-4 py-2 text-sm rounded-lg" data-tab="broadcast">📡 Broadcast</button>
<a href="/upload" class="tab-btn px-4 py-2 text-sm rounded-lg" style="text-decoration:none;color:#fbbf24;border-color:#fbbf24">📸 上传</a>
</div>
@@ -129,6 +130,7 @@ body { background: #0f0f13; color: #e2e8f0; }
<div id="tab-health" class="tab-content hidden"></div>
<div id="tab-research" class="tab-content hidden"></div>
<div id="tab-docs" class="tab-content hidden"></div>
<div id="tab-broadcast" class="tab-content hidden"><div class="flex items-center justify-between mb-3"><h2 class="text-lg font-bold text-slate-200">📡 Broadcast</h2><a href="/broadcast.html" class="text-sm text-blue-400 hover:text-blue-300">📋 History</a></div><div id="broadcast-list" class="space-y-2"><div class="text-slate-500 text-sm">Loading...</div></div></div>
<div id="tab-principles" class="tab-content hidden">
<div class="flex gap-1 mb-4 bg-slate-900/50 rounded-xl p-1 border border-slate-800/50" id="princBar">
<button class="princ-btn active px-4 py-1.5 text-sm rounded-lg" data-princ="spec">G 规范</button>
@@ -3131,6 +3133,42 @@ function renderAlerts(alerts) {
// refreshAll 内联渲染:把 alerts 交给 renderAlerts
function loadBroadcast() {
var el = document.getElementById('broadcast-list');
if (!el) return;
fetch('/api/broadcast/recent?hours=72&limit=100').then(function(r){return r.json()}).then(function(data) {
if (!data.length) { el.innerHTML = '<div class="text-slate-500 text-sm">No messages</div>'; return; }
var h = '';
var cat_colors = {trading:'#22c55e',system_error:'#ef4444',health:'#3b82f6',market:'#f59e0b',news:'#8b5cf6',strategy:'#06b6d4',general:'#6b7280'};
var cat_labels = {trading:'Trading',system_error:'Error',health:'Health',market:'Market',news:'News',strategy:'Strategy',general:'System'};
data.forEach(function(m) {
var color = cat_colors[m.category] || '#6b7280';
var cat_label = cat_labels[m.category] || m.category;
var preview = m.content.length > 120 ? m.content.slice(0,120) + '...' : m.content;
var time = (m.ts||'').slice(0,16).replace('T',' ');
h += '<div class="bg-slate-800/60 border border-slate-700 rounded-lg p-3 cursor-pointer hover:border-slate-500" onclick="showBroadcastDetail(this)" data-content="' + m.content.replace(/"/g,'&quot;') + '" data-title="' + (m.title||'').replace(/"/g,'&quot;') + '">';
h += '<div class="flex items-center gap-2 mb-1">';
h += '<span class="text-xs px-2 py-0.5 rounded" style="background:'+color+'22;color:'+color+'">'+cat_label+'</span>';
h += '<span class="text-xs text-slate-500">'+time+'</span>';
if (m.title) h += '<span class="text-sm font-semibold text-slate-300">'+m.title+'</span>';
h += '</div>';
h += '<div class="text-xs text-slate-400 leading-relaxed">'+esc(preview)+'</div>';
h += '</div>';
});
el.innerHTML = h;
}).catch(function(e) { el.innerHTML = '<div class="text-red-400 text-sm">Error: '+e.message+'</div>'; });
}
function showBroadcastDetail(el) {
var content = el.getAttribute('data-content');
var title = el.getAttribute('data-title');
var modal = document.createElement('div');
modal.className = 'fixed inset-0 z-50 flex items-center justify-center bg-black/60';
modal.onclick = function(e) { if (e.target === modal) modal.remove(); };
modal.innerHTML = '<div class="bg-slate-800 border border-slate-600 rounded-xl p-6 max-w-2xl max-h-[80vh] overflow-y-auto shadow-2xl"><div class="flex justify-between items-center mb-4"><h3 class="text-lg font-bold text-slate-200">'+(title||'Detail')+'</h3><button onclick="this.closest(\'div.fixed\').remove()" class="text-slate-400 hover:text-white text-xl">&times;</button></div><pre class="text-sm text-slate-300 whitespace-pre-wrap leading-relaxed">'+esc(content)+'</pre></div>';
document.body.appendChild(modal);
}
</script>
</body>
</html>