diff --git a/static/app.js b/static/app.js
index 9765a1b..a469bd2 100644
--- a/static/app.js
+++ b/static/app.js
@@ -6,6 +6,36 @@ const esc = (s) => String(s ?? "").replace(/[&<>"']/g, (c) => ({ "&": "&", "
const chatHistory = [];
let chatBusy = false;
+/* 简洁版当前时间 HH:MM */
+function nowTime() {
+ const d = new Date();
+ return `${String(d.getHours()).padStart(2, "0")}:${String(d.getMinutes()).padStart(2, "0")}`;
+}
+
+/* 轻提示 */
+function toast(msg) {
+ let t = document.getElementById("toast");
+ if (!t) { t = document.createElement("div"); t.id = "toast"; document.body.appendChild(t); }
+ t.textContent = msg;
+ t.classList.add("show");
+ clearTimeout(t._timer);
+ t._timer = setTimeout(() => t.classList.remove("show"), 1800);
+}
+
+/* 复制文本(Clipboard API + 降级) */
+async function copyText(text) {
+ try {
+ await navigator.clipboard.writeText(text);
+ } catch (e) {
+ const ta = document.createElement("textarea");
+ ta.value = text; ta.style.position = "fixed"; ta.style.opacity = "0";
+ document.body.appendChild(ta); ta.select();
+ document.execCommand("copy");
+ ta.remove();
+ }
+ toast("✅ 已复制");
+}
+
/* ================= Markdown 渲染(marked 本地库,先转义防 XSS) ================= */
function md(text) {
if (window.marked) {
@@ -61,10 +91,14 @@ function loadView(v) {
}
/* ================= 对话 ================= */
-function addMsg(role, html) {
+function addMsg(role, html, opts = {}) {
const div = document.createElement("div");
div.className = `msg ${role}`;
- div.innerHTML = `
${role === "user" ? "🧑" : "🤖"}
${html}
`;
+ if (opts.idx !== undefined) div.dataset.idx = opts.idx;
+ const actions = role === "bot"
+ ? `${nowTime()}
`
+ : `${nowTime()}
`;
+ div.innerHTML = `${role === "user" ? "🧑" : "🤖"}
`;
$("#chat-list").appendChild(div);
$("#chat-list").scrollTop = $("#chat-list").scrollHeight;
return div;
@@ -72,7 +106,7 @@ function addMsg(role, html) {
function showTyping() {
const div = document.createElement("div");
div.className = "msg bot";
- div.innerHTML = `🤖
`;
+ div.innerHTML = `🤖
`;
$("#chat-list").appendChild(div);
$("#chat-list").scrollTop = $("#chat-list").scrollHeight;
return div;
@@ -90,6 +124,28 @@ function cardHtml(c) {
return "";
}
+/* 组装回答气泡 HTML(参考资讯 + markdown实体 + 卡片 + 来源) */
+function buildBotHtml(d) {
+ let html = "";
+ // 需求4:参考资讯(新闻/百科链接),默认折叠,位于回答块上方
+ if (d.news_refs && d.news_refs.length) {
+ html += `📰 参考资讯(${d.news_refs.length})
` +
+ d.news_refs.map((n) => `- ${esc(n.title)}` +
+ (n.source ? `${esc(n.source)}${n.publish_time ? " · " + esc(n.publish_time.slice(0, 10)) : ""}` : "") + `
`).join("") +
+ `
`;
+ }
+ // 需求3:markdown 渲染 + 需求5:实体特殊标记
+ html += `${renderMdWithEntities(d.reply, d.entities)}
`;
+ // 需求5:快速查看入口卡片
+ if (d.cards && d.cards.length) {
+ html += `${d.cards.map(cardHtml).join("")}
`;
+ }
+ if (d.sources && d.sources.length) {
+ html += "" + d.sources.map((s) => `来源:${esc(s.tool)}`).join("") + "
";
+ }
+ return html;
+}
+
async function sendChat(text) {
if (chatBusy) return;
chatBusy = true;
@@ -102,26 +158,18 @@ async function sendChat(text) {
const d = await r.json();
typing.remove();
if (d.error) { addMsg("bot", `⚠️ ${esc(d.error)}`); return; }
- let html = "";
- // 需求4:参考资讯(新闻/百科链接),默认折叠,位于回答块上方
- if (d.news_refs && d.news_refs.length) {
- html += `📰 参考资讯(${d.news_refs.length})
` +
- d.news_refs.map((n) => `- ${esc(n.title)}` +
- (n.source ? `${esc(n.source)}${n.publish_time ? " · " + esc(n.publish_time.slice(0, 10)) : ""}` : "") + `
`).join("") +
- `
`;
- }
- // 需求3:markdown 渲染 + 需求5:实体特殊标记
- html += `${renderMdWithEntities(d.reply, d.entities)}
`;
- // 需求5:快速查看入口卡片
- if (d.cards && d.cards.length) {
- html += `${d.cards.map(cardHtml).join("")}
`;
- }
- if (d.sources && d.sources.length) {
- html += "" + d.sources.map((s) => `来源:${esc(s.tool)}`).join("") + "
";
- }
- addMsg("bot", html);
chatHistory.push({ user: text, assistant: d.reply });
- if (chatHistory.length > 20) chatHistory.splice(0, chatHistory.length - 20);
+ const idx = chatHistory.length - 1;
+ addMsg("bot", buildBotHtml(d), { idx });
+ if (chatHistory.length > 20) {
+ const removed = chatHistory.length - 20;
+ chatHistory.splice(0, removed);
+ document.querySelectorAll("#chat-list .msg[data-idx]").forEach((m) => {
+ const i = parseInt(m.dataset.idx);
+ if (i < removed) m.remove();
+ else m.dataset.idx = i - removed;
+ });
+ }
// 大模型预测下一轮快捷问题(异步刷新底部 chips)
const mark = chatHistory.length;
refreshChips(mark);
@@ -136,6 +184,79 @@ async function sendChat(text) {
$("#send-btn").addEventListener("click", () => { const v = $("#chat-input").value.trim(); if (v) { $("#chat-input").value = ""; sendChat(v); } });
$("#chat-input").addEventListener("keydown", (e) => { if (e.key === "Enter") $("#send-btn").click(); });
+/* 复制当前回答(纯文本) */
+function copyMsg(btn) {
+ const bubble = btn.closest(".msg").querySelector(".bubble");
+ copyText(bubble.innerText.trim());
+}
+
+/* 重新生成:以该轮之前的上下文重新提问,替换本条回答,截断后续对话 */
+async function regenerate(btn) {
+ const msgEl = btn.closest(".msg");
+ const idx = parseInt(msgEl.dataset.idx);
+ if (isNaN(idx) || chatBusy) return;
+ if (idx >= chatHistory.length) return;
+ // 截断:删除该条之后的对话(上下文已变)
+ chatHistory.splice(idx + 1);
+ document.querySelectorAll("#chat-list .msg[data-idx]").forEach((m) => {
+ if (parseInt(m.dataset.idx) > idx) m.remove();
+ });
+ const userText = chatHistory[idx].user;
+ const body = msgEl.querySelector(".msg-body");
+ const bubble = msgEl.querySelector(".bubble");
+ bubble.innerHTML = ``;
+ msgEl.querySelector(".msg-actions")?.remove();
+ chatBusy = true;
+ try {
+ const r = await fetch("/api/chat", { method: "POST", headers: { "Content-Type": "application/json" },
+ body: JSON.stringify({ message: userText, history: chatHistory.slice(0, idx).map((h) => ({ user: h.user, assistant: h.assistant })) }) });
+ const d = await r.json();
+ if (d.error) { bubble.innerHTML = `⚠️ ${esc(d.error)}`; return; }
+ bubble.innerHTML = buildBotHtml(d);
+ const actions = document.createElement("div");
+ actions.className = "msg-actions";
+ actions.innerHTML = `${nowTime()}`;
+ body.appendChild(actions);
+ chatHistory[idx] = { user: userText, assistant: d.reply };
+ refreshChips(chatHistory.length);
+ } catch (e) {
+ bubble.innerHTML = "⚠️ 网络异常,请稍后再试。";
+ } finally {
+ chatBusy = false;
+ }
+}
+
+/* 分享:弹窗展示对话全文 + 一键复制 */
+function shareChat() {
+ if (!chatHistory.length) { toast("还没有对话内容"); return; }
+ const text = chatHistory.map((h) => `🧑 ${h.user}\n🤖 ${h.assistant}`).join("\n\n");
+ openModal(`
+ 🔗 分享对话
+ 共 ${chatHistory.length} 轮 · 复制后粘贴到任意聊天或文档
+
+
+ `);
+}
+function copyShare() {
+ const ta = document.querySelector(".share-box");
+ if (ta) copyText(ta.value);
+}
+
+/* 清空对话从头开始 */
+function clearChat() {
+ if (!chatHistory.length) { toast("对话已经是空的"); return; }
+ if (!confirm("确定清空当前对话吗?将从头开始。")) return;
+ chatHistory.length = 0;
+ const list = $("#chat-list");
+ const welcome = document.getElementById("welcome-msg");
+ const w = welcome ? welcome.outerHTML : "";
+ list.innerHTML = w;
+ loadBoot();
+ toast("🗑️ 对话已清空");
+}
+$("#share-btn").addEventListener("click", shareChat);
+$("#clear-btn").addEventListener("click", clearChat);
+
/* 快捷问题:点击 → 自动填入输入框并自动提交(需求2) */
function askQuick(q) {
$("#chat-input").value = q;
@@ -155,8 +276,14 @@ async function refreshChips(mark) {
} catch (e) {}
}
-/* 聊天区事件委托:快捷语句 / 实体标记 / 新闻链接 / 卡片 */
+/* 聊天区事件委托:快捷语句 / 操作按钮(复制·重新生成) / 实体标记 / 新闻链接 / 卡片 */
$("#chat-list").addEventListener("click", (e) => {
+ const act = e.target.closest(".act-btn");
+ if (act) {
+ if (act.title.includes("复制")) copyMsg(act);
+ else if (act.title.includes("重新生成")) regenerate(act);
+ return;
+ }
const q = e.target.closest(".quick-q");
if (q) { e.preventDefault(); askQuick(q.textContent); return; }
const ent = e.target.closest(".entity, .ecard");
diff --git a/static/index.html b/static/index.html
index 5de3b98..822604a 100644
--- a/static/index.html
+++ b/static/index.html
@@ -31,6 +31,13 @@
+
🤖
diff --git a/static/style.css b/static/style.css
index 02e5635..39fb612 100644
--- a/static/style.css
+++ b/static/style.css
@@ -25,6 +25,18 @@ main { flex: 1; width: 100%; max-width: 1200px; margin: 0 auto; padding: 20px 16
/* ---------- 对话 ---------- */
.chat-wrap { display: flex; flex-direction: column; height: calc(100vh - 190px); min-height: 480px; }
+.chat-toolbar { display: flex; align-items: center; justify-content: space-between; margin-bottom: 6px; padding: 0 4px; }
+.ct-title { color: var(--sub); font-size: 13px; font-weight: 600; letter-spacing: 1px; }
+.tool-btn { background: var(--bg2); border: 1px solid var(--line); color: var(--sub); border-radius: 999px; padding: 5px 12px; font-size: 12.5px; cursor: pointer; margin-left: 6px; transition: .15s; }
+.tool-btn:hover { color: var(--orange2); border-color: var(--orange2); }
+.msg-body { flex: 1; min-width: 0; }
+.msg-actions { display: flex; align-items: center; gap: 2px; margin-top: 5px; padding-left: 4px; opacity: .8; }
+.msg.user .msg-actions { justify-content: flex-end; padding-left: 0; padding-right: 4px; }
+.act-btn { background: transparent; border: none; color: var(--sub); font-size: 13px; cursor: pointer; padding: 3px 6px; border-radius: 6px; line-height: 1; transition: .15s; }
+.act-btn:hover { color: var(--orange2); background: rgba(249,115,22,.12); }
+.msg-time { font-size: 11px; color: var(--sub); margin-left: 6px; }
+#toast { position: fixed; left: 50%; bottom: 100px; transform: translateX(-50%) translateY(12px); background: var(--bg2); border: 1px solid var(--line); color: var(--txt); padding: 9px 20px; border-radius: 999px; font-size: 13px; opacity: 0; pointer-events: none; transition: .25s; z-index: 300; box-shadow: 0 6px 24px rgba(0,0,0,.5); }
+#toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }
.chat-list { flex: 1; overflow-y: auto; padding: 8px 4px 16px; display: flex; flex-direction: column; gap: 14px; scroll-behavior: smooth; }
.msg { display: flex; gap: 10px; max-width: 88%; }
.msg.user { align-self: flex-end; flex-direction: row-reverse; }