dekun/crypto_monitor
0
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(hub): polish AI coach UI with PnL colors and chat roles

Browse Source 
Equal-height summary/chat panels, colored closed/float PnL, owner/coach labels, and optimistic thinking state.

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
dekun
2026-06-07 00:10:50 +08:00
parent cee641ba5d
commit ebadcb1119
3 changed files with 174 additions and 47 deletions
Download Patch File Download Diff File Expand all files Collapse all files
manual_trading_hub/static/app.js
+70 -24
View File
@@ -2941,14 +2941,29 @@
let aiMeta = null;
let aiSummaryLoading = false;
let aiChatLoading = false;
let aiChatSessionCache = null;
function aiPnlClass(v) {
const n = Number(v);
if (!Number.isFinite(n) || Math.abs(n) < 1e-9) return "";
return n > 0 ? "pos" : "neg";
}
function aiPnlSigned(v, digits) {
const n = Number(v);
if (!Number.isFinite(n)) return "—";
const abs = fmt(Math.abs(n), digits);
if (Math.abs(n) < 1e-9) return `${abs}U`;
return `${n > 0 ? "+" : "-"}${abs}U`;
}
function renderAiMarkdown(text) {
const esc = (s) =>
const escLocal = (s) =>
String(s || "")
.replace(/&/g, "&amp;")
.replace(/</g, "&lt;")
.replace(/>/g, "&gt;");
return esc(text)
return escLocal(text)
.replace(/\*\*(.+?)\*\*/g, "<strong>$1</strong>")
.replace(/\n/g, "<br>");
}
@@ -2961,17 +2976,33 @@
return;
}
const t = snapshot.totals;
const pnl = Number(t.total_pnl_u);
const pnlCls = pnl > 0 ? "pos" : pnl < 0 ? "neg" : "";
const closedPnl = Number(t.total_pnl_u);
const floatPnl = Number(t.float_pnl_u);
const closedCls = aiPnlClass(closedPnl);
const floatCls = aiPnlClass(floatPnl);
el.innerHTML = [
`<span class="ai-stat-chip"><strong>交易日</strong>${esc(t.trading_day || "—")}</span>`,
`<span class="ai-stat-chip ${pnlCls}"><strong>平仓盈亏</strong>${fmt(pnl, 2)}U</span>`,
`<span class="ai-stat-chip ${closedCls}"><strong>平仓盈亏</strong><span class="ai-stat-val ${closedCls}">${aiPnlSigned(closedPnl, 2)}</span></span>`,
`<span class="ai-stat-chip"><strong>笔数</strong>${t.closed_count || 0}（胜${t.win_count || 0}/负${t.loss_count || 0}）</span>`,
`<span class="ai-stat-chip"><strong>浮盈亏</strong>${fmt(Number(t.float_pnl_u), 2)}U</span>`,
`<span class="ai-stat-chip ${floatCls}"><strong>浮盈亏</strong><span class="ai-stat-val ${floatCls}">${aiPnlSigned(floatPnl, 2)}</span></span>`,
].join("");
}
function renderAiChatMessages(session) {
function renderAiChatRow(role, content, extraClass) {
const isUser = role === "user";
const label = isUser ? "主人" : "AI教练";
const rowCls = isUser ? "ai-msg-row-user" : "ai-msg-row-coach";
const bubbleCls = isUser ? "ai-bubble-user" : "ai-bubble-assistant";
return (
`<div class="ai-msg-row ${rowCls}">` +
`<span class="ai-msg-role">${label}</span>` +
`<div class="ai-bubble ${bubbleCls}${extraClass ? " " + extraClass : ""}">${esc(content || "")}</div>` +
`</div>`
);
}
function renderAiChatMessages(session, opts) {
const options = opts || {};
const box = document.getElementById("ai-chat-messages");
const title = document.getElementById("ai-chat-title");
if (!box) return;
@@ -2979,20 +3010,34 @@
if (title) {
title.textContent = session && session.title ? `聊天 · ${session.title}` : "聊天";
}
if (!msgs.length) {
const showPlaceholder =
!msgs.length && !options.pendingUser && !options.thinking;
if (showPlaceholder) {
box.innerHTML =
'<p class="ai-placeholder">随便聊：行情、心态、纪律、执行都行。我会先看四户监控数据，用搭档口吻回你。</p>';
'<p class="ai-placeholder">主人发消息会立刻出现在右侧；AI教练 会先显示「正在思考…」再回复。</p>';
return;
}
box.innerHTML = msgs
.map((m) => {
const role = m.role === "user" ? "user" : "assistant";
return `<div class="ai-bubble ai-bubble-${role}">${esc(m.content || "")}</div>`;
})
let html = msgs
.map((m) => renderAiChatRow(m.role === "user" ? "user" : "assistant", m.content || ""))
.join("");
if (options.pendingUser) {
html += renderAiChatRow("user", options.pendingUser);
}
if (options.thinking) {
html += renderAiChatRow("assistant", "正在思考…", "ai-bubble-thinking");
}
box.innerHTML = html;
box.scrollTop = box.scrollHeight;
}
function setAiChatBusy(busy) {
aiChatLoading = !!busy;
const btn = document.getElementById("btn-ai-chat-send");
const input = document.getElementById("ai-chat-input");
if (btn) btn.disabled = busy;
if (input) input.disabled = busy;
}
async function loadAiMeta() {
const r = await apiFetch("/api/ai/meta");
aiMeta = await r.json();
@@ -3026,7 +3071,8 @@
async function loadAiChatSession() {
const r = await apiFetch("/api/ai/chat/session");
const j = await r.json();
renderAiChatMessages(j.session);
aiChatSessionCache = j.session || null;
renderAiChatMessages(aiChatSessionCache);
}
async function loadAiPage() {
@@ -3074,7 +3120,8 @@
body: JSON.stringify({}),
});
const j = await r.json();
renderAiChatMessages(j.session);
aiChatSessionCache = j.session || null;
renderAiChatMessages(aiChatSessionCache);
showToast("已开始新对话");
} catch (e) {
showToast(String(e), true);
@@ -3087,9 +3134,9 @@
const input = document.getElementById("ai-chat-input");
const text = (input && input.value || "").trim();
if (!text) return;
aiChatLoading = true;
const btn = document.getElementById("btn-ai-chat-send");
if (btn) btn.disabled = true;
if (input) input.value = "";
setAiChatBusy(true);
renderAiChatMessages(aiChatSessionCache, { pendingUser: text, thinking: true });
try {
const r = await apiFetch("/api/ai/chat/send", {
method: "POST",
@@ -3098,14 +3145,13 @@
});
const j = await r.json();
if (!r.ok) throw new Error(j.detail || j.msg || "发送失败");
if (j.detail) throw new Error(j.detail);
if (input) input.value = "";
renderAiChatMessages(j.session);
aiChatSessionCache = j.session || null;
renderAiChatMessages(aiChatSessionCache);
} catch (e) {
showToast(String(e), true);
renderAiChatMessages(aiChatSessionCache);
} finally {
aiChatLoading = false;
if (btn) btn.disabled = false;
setAiChatBusy(false);
}
}