优化:AI对话改为公开广播,所有人可见

- ChatBotController 将用户提问和AI回复都广播到聊天室
- 前端不再本地渲染AI消息,由WebSocket广播统一处理
- AI小助手加入系统用户列表(公告样式展示)
- 思考中提示延迟500ms显示在包厢窗口,避免排序混乱
This commit is contained in:
2026-02-26 22:11:11 +08:00
parent 362ecdd8ab
commit f5d8a593c9
2 changed files with 49 additions and 46 deletions

View File

@@ -264,7 +264,7 @@
const timeStr = msg.sent_at || '';
// 系统用户名列表(不可被选为聊天对象)
const systemUsers = ['钓鱼播报', '星海小博士', '系统传音', '系统公告'];
const systemUsers = ['钓鱼播报', '星海小博士', '系统传音', '系统公告', 'AI小助手'];
// 用户名(单击切换发言对象,双击查看资料;系统用户仅显示文本)
const clickableUser = (uName, color) => {
if (systemUsers.includes(uName)) {
@@ -1011,26 +1011,15 @@
}
chatBotSending = true;
const now = new Date();
const timeStr = now.getHours().toString().padStart(2, '0') + ':' +
now.getMinutes().toString().padStart(2, '0') + ':' +
now.getSeconds().toString().padStart(2, '0');
// 显示用户发送的消息
const userDiv = document.createElement('div');
userDiv.className = 'msg-line';
userDiv.innerHTML = `<span class="msg-user" style="color: #000099;">${window.chatContext.username}</span>` +
`对<span style="color: #16a34a; font-weight: bold;">🤖AI小助手</span>说:` +
`<span class="msg-content">${escapeHtml(content)}</span>` +
` <span class="msg-time">(${timeStr})</span>`;
container2.appendChild(userDiv);
// 显示"思考中"提示
// 延迟显示"思考中",让广播消息先到达
const thinkDiv = document.createElement('div');
thinkDiv.className = 'msg-line';
thinkDiv.innerHTML = '<span style="color: #16a34a;">🤖 <b>AI小助手</b> 正在思考中...</span>';
container2.appendChild(thinkDiv);
if (autoScroll) container2.scrollTop = container2.scrollHeight;
setTimeout(() => {
container2.appendChild(thinkDiv);
if (autoScroll) container2.scrollTop = container2.scrollHeight;
}, 500);
try {
const res = await fetch(window.chatContext.chatBotUrl, {
@@ -1049,47 +1038,25 @@
const data = await res.json();
// 移除"思考中"提示
// 移除"思考中"提示(消息已通过广播显示)
thinkDiv.remove();
const replyTime = new Date();
const replyTimeStr = replyTime.getHours().toString().padStart(2, '0') + ':' +
replyTime.getMinutes().toString().padStart(2, '0') + ':' +
replyTime.getSeconds().toString().padStart(2, '0');
if (res.ok && data.status === 'success') {
// 显示机器人回复
const botDiv = document.createElement('div');
botDiv.className = 'msg-line';
botDiv.style.background = '#f0fdf4';
botDiv.style.borderLeft = '3px solid #22c55e';
botDiv.style.padding = '4px 8px';
botDiv.style.margin = '2px 0';
botDiv.style.borderRadius = '4px';
botDiv.innerHTML = `<span style="color: #16a34a; font-weight: bold;">🤖 AI小助手</span>` +
`对<span class="msg-user" style="color: #000099;">${window.chatContext.username}</span>说:` +
`<span class="msg-content" style="color: #333;">${escapeHtml(data.reply)}</span>` +
` <span class="msg-time">(${replyTimeStr})</span>` +
` <span style="font-size:10px; color:#aaa;">[${data.provider}]</span>`;
container2.appendChild(botDiv);
} else {
// 显示错误信息
if (!res.ok || data.status !== 'success') {
const errDiv = document.createElement('div');
errDiv.className = 'msg-line';
errDiv.innerHTML = `<span style="color: #dc2626;">🤖【AI小助手】${data.message || '回复失败,请稍后重试'}</span>` +
` <span class="msg-time">(${replyTimeStr})</span>`;
container2.appendChild(errDiv);
errDiv.innerHTML = `<span style="color: #dc2626;">🤖【AI小助手】${data.message || '回复失败,请稍后重试'}</span>`;
container.appendChild(errDiv);
}
} catch (e) {
thinkDiv.remove();
const errDiv = document.createElement('div');
errDiv.className = 'msg-line';
errDiv.innerHTML = '<span style="color: #dc2626;">🤖【AI小助手】网络连接错误请稍后重试</span>';
container2.appendChild(errDiv);
container.appendChild(errDiv);
}
chatBotSending = false;
if (autoScroll) container2.scrollTop = container2.scrollHeight;
scrollToBottom();
}
/**