804 lines
48 KiB
HTML
804 lines
48 KiB
HTML
<!-- story-summary.html -->
|
||
<!DOCTYPE html>
|
||
<html lang="zh-CN">
|
||
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
||
<meta name="apple-mobile-web-app-capable" content="yes">
|
||
<title>剧情总结 · Story Summary</title>
|
||
<link rel="stylesheet" href="story-summary.css">
|
||
</head>
|
||
|
||
<body>
|
||
<div class="container">
|
||
<!-- Header -->
|
||
<header>
|
||
<div>
|
||
<h1>剧情<span>总结</span></h1>
|
||
<div class="subtitle">Story Summary · Timeline · Character Arcs</div>
|
||
</div>
|
||
<div class="stats">
|
||
<div class="stat">
|
||
<div class="stat-val" id="stat-events">0</div>
|
||
<div class="stat-lbl">已记录事件</div>
|
||
</div>
|
||
<div class="stat">
|
||
<div class="stat-val" id="stat-summarized">0</div>
|
||
<div class="stat-lbl">已总结楼层</div>
|
||
</div>
|
||
<div class="stat">
|
||
<div class="stat-val"><span class="hl" id="stat-pending">0</span></div>
|
||
<div class="stat-lbl">待总结</div>
|
||
<div class="stat-warning hidden" id="pending-warning">再删1条将回滚</div>
|
||
</div>
|
||
</div>
|
||
</header>
|
||
|
||
<!-- Controls -->
|
||
<div class="controls">
|
||
<label class="chk-label">
|
||
<input type="checkbox" id="hide-summarized">
|
||
<span>隐藏已总结 · <strong id="summarized-count">0</strong> 楼（保留<input type="number" id="keep-visible-count"
|
||
min="0" max="50" value="3">楼）</span>
|
||
</label>
|
||
<span class="spacer"></span>
|
||
<div class="btn-group">
|
||
<button class="btn btn-icon" id="btn-settings">
|
||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||
<circle cx="12" cy="12" r="3" />
|
||
<path
|
||
d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1-2.83 2.83l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-4 0v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1 0-4h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 2.83-2.83l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 4 0v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 0 4h-.09a1.65 1.65 0 0 0-1.51 1z" />
|
||
</svg>
|
||
<span>设置</span>
|
||
</button>
|
||
<button class="btn" id="btn-clear">清空</button>
|
||
<button class="btn btn-p" id="btn-generate">总结</button>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Main Content -->
|
||
<main>
|
||
<div class="left">
|
||
<!-- Keywords -->
|
||
<section class="card">
|
||
<div class="sec-head">
|
||
<div class="sec-title">核心关键词</div>
|
||
<button class="sec-btn" data-section="keywords">编辑</button>
|
||
</div>
|
||
<div class="keywords" id="keywords-cloud"></div>
|
||
</section>
|
||
|
||
<!-- Timeline -->
|
||
<section class="card timeline">
|
||
<div class="sec-head">
|
||
<div class="sec-title">剧情时间线</div>
|
||
<button class="sec-btn" data-section="events">编辑</button>
|
||
</div>
|
||
<div class="tl-list scroll" id="timeline-list"></div>
|
||
</section>
|
||
</div>
|
||
|
||
<div class="right">
|
||
<!-- Facts -->
|
||
<section class="card facts">
|
||
<div class="sec-head">
|
||
<div class="sec-title">世界状态</div>
|
||
<button class="sec-btn" data-section="facts">编辑</button>
|
||
</div>
|
||
<div class="facts-list scroll" id="facts-list"></div>
|
||
</section>
|
||
|
||
<!-- Relations -->
|
||
<section class="card relations">
|
||
<div class="sec-head">
|
||
<div class="sec-title">人物关系</div>
|
||
<div class="sec-actions">
|
||
<button class="sec-btn sec-icon" id="btn-fullscreen-relations" title="全屏查看">
|
||
<svg viewBox="0 0 24 24" width="12" height="12" fill="none" stroke="currentColor"
|
||
stroke-width="2">
|
||
<path
|
||
d="M8 3H5a2 2 0 0 0-2 2v3m18 0V5a2 2 0 0 0-2-2h-3m0 18h3a2 2 0 0 0 2-2v-3M3 16v3a2 2 0 0 0 2 2h3" />
|
||
</svg>
|
||
</button>
|
||
<button class="sec-btn" data-section="characters">编辑</button>
|
||
</div>
|
||
</div>
|
||
<div id="relation-chart"></div>
|
||
</section>
|
||
|
||
<!-- Profile -->
|
||
<section class="card profile">
|
||
<div class="sec-head">
|
||
<div class="sec-title">人物档案</div>
|
||
<div class="sec-actions">
|
||
<div class="custom-select" id="char-sel">
|
||
<div class="sel-trigger" id="char-sel-trigger">
|
||
<span id="sel-char-text">选择角色</span>
|
||
</div>
|
||
<div class="sel-opts" id="char-sel-opts">
|
||
<div class="sel-opt" data-value="">暂无角色</div>
|
||
</div>
|
||
</div>
|
||
<button class="sec-btn" data-section="arcs">编辑</button>
|
||
</div>
|
||
</div>
|
||
<div class="profile-content scroll" id="profile-content"></div>
|
||
</section>
|
||
</div>
|
||
</main>
|
||
</div>
|
||
|
||
<!-- Editor Modal -->
|
||
<div class="modal" id="editor-modal">
|
||
<div class="modal-bg" id="editor-backdrop"></div>
|
||
<div class="modal-box">
|
||
<div class="modal-head">
|
||
<h2 id="editor-title">编辑</h2>
|
||
<button class="modal-close" id="editor-close">
|
||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||
<line x1="18" y1="6" x2="6" y2="18" />
|
||
<line x1="6" y1="6" x2="18" y2="18" />
|
||
</svg>
|
||
</button>
|
||
</div>
|
||
<div class="modal-body">
|
||
<div class="editor-hint" id="editor-hint"></div>
|
||
<div id="editor-struct" class="hidden"></div>
|
||
<textarea class="editor-ta" id="editor-ta"></textarea>
|
||
<div class="editor-err" id="editor-err"></div>
|
||
</div>
|
||
<div class="modal-foot">
|
||
<button class="btn" id="editor-cancel">取消</button>
|
||
<button class="btn btn-p" id="editor-save">保存</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Settings Modal -->
|
||
<div class="modal" id="settings-modal">
|
||
<div class="modal-bg" id="settings-backdrop"></div>
|
||
<div class="modal-box settings-modal-box">
|
||
<div class="modal-head">
|
||
<div class="settings-tabs">
|
||
<div class="settings-tab active" data-tab="tab-summary">总结设置</div>
|
||
<div class="settings-tab" data-tab="tab-vector">向量设置</div>
|
||
<div class="settings-tab" data-tab="tab-debug">调试</div>
|
||
<div class="settings-tab" data-tab="tab-guide">使用说明</div>
|
||
</div>
|
||
<button class="modal-close" id="settings-close">
|
||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||
<line x1="18" y1="6" x2="6" y2="18" />
|
||
<line x1="6" y1="6" x2="18" y2="18" />
|
||
</svg>
|
||
</button>
|
||
</div>
|
||
<div class="modal-body">
|
||
<!-- Tab 1: Summary Settings -->
|
||
<div class="tab-pane active" id="tab-summary">
|
||
<!-- API Config & Gen Params Combined -->
|
||
<div class="settings-section">
|
||
<div class="settings-section-title">API 配置</div>
|
||
<div class="settings-row">
|
||
<div class="settings-field">
|
||
<label>渠道</label>
|
||
<select id="api-provider">
|
||
<option value="st">酒馆主 API（沿用当前）</option>
|
||
<option value="openai">OpenAI 兼容</option>
|
||
<option value="google">Google (Gemini)</option>
|
||
<option value="claude">Claude (Anthropic)</option>
|
||
<option value="custom">自定义</option>
|
||
</select>
|
||
</div>
|
||
</div>
|
||
<div class="settings-row hidden" id="api-url-row">
|
||
<div class="settings-field full">
|
||
<label>API URL</label>
|
||
<input type="text" id="api-url" placeholder="https://api.openai.com 或代理地址">
|
||
<div class="settings-hint">默认端点：OpenAI：/v1，Gemini：/v1beta，Claude：/v1</div>
|
||
</div>
|
||
</div>
|
||
<div class="settings-row hidden" id="api-key-row">
|
||
<div class="settings-field full">
|
||
<label>API KEY</label>
|
||
<input type="password" id="api-key" placeholder="仅保存在本地，不会上传">
|
||
</div>
|
||
</div>
|
||
<div class="settings-row hidden" id="api-model-manual-row">
|
||
<div class="settings-field full">
|
||
<label>模型</label>
|
||
<input type="text" id="api-model-text" placeholder="如 gemini-1.5-pro、claude-3-haiku">
|
||
</div>
|
||
</div>
|
||
<div class="settings-row hidden" id="api-model-select-row">
|
||
<div class="settings-field full">
|
||
<label>可用模型</label>
|
||
<select id="api-model-select">
|
||
<option value="">请先拉取模型列表</option>
|
||
</select>
|
||
</div>
|
||
</div>
|
||
<div class="settings-btn-row hidden" id="api-connect-row"
|
||
style="display: flex; gap: 12px; align-items: center; justify-content: space-between;">
|
||
<button class="btn btn-sm btn-p" id="btn-connect" style="flex: 4;">连接 / 拉取模型列表</button>
|
||
<label class="chk-label compact"
|
||
style="margin: 0; flex: 1; display: flex; align-items: center; gap: 6px; white-space: nowrap; justify-content: center;">
|
||
<input type="checkbox" id="trigger-stream" checked>
|
||
<span>流式</span>
|
||
</label>
|
||
</div>
|
||
|
||
<!-- Collapsible Gen Params -->
|
||
<div class="settings-collapse">
|
||
<div class="settings-collapse-header" id="gen-params-toggle">
|
||
<span>生成参数</span>
|
||
<svg class="collapse-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor"
|
||
stroke-width="2">
|
||
<polyline points="6 9 12 15 18 9"></polyline>
|
||
</svg>
|
||
</div>
|
||
<div class="settings-collapse-content hidden" id="gen-params-content">
|
||
<div class="settings-row">
|
||
<div class="settings-field">
|
||
<label>Temperature</label>
|
||
<input type="number" id="gen-temp" step="0.01" min="0" max="2"
|
||
placeholder="未设置">
|
||
</div>
|
||
<div class="settings-field">
|
||
<label>Top P</label>
|
||
<input type="number" id="gen-top-p" step="0.01" min="0" max="1"
|
||
placeholder="未设置">
|
||
</div>
|
||
<div class="settings-field">
|
||
<label>Top K</label>
|
||
<input type="number" id="gen-top-k" step="1" min="1" placeholder="未设置">
|
||
</div>
|
||
</div>
|
||
<div class="settings-row">
|
||
<div class="settings-field">
|
||
<label>存在惩罚</label>
|
||
<input type="number" id="gen-presence" step="0.01" min="-2" max="2"
|
||
placeholder="未设置">
|
||
</div>
|
||
<div class="settings-field">
|
||
<label>频率惩罚</label>
|
||
<input type="number" id="gen-frequency" step="0.01" min="-2" max="2"
|
||
placeholder="未设置">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Trigger Settings -->
|
||
<div class="settings-section">
|
||
<div class="settings-section-title">总结设置</div>
|
||
<div class="settings-row">
|
||
<div class="settings-field">
|
||
<label>注入角色</label>
|
||
<select id="trigger-role">
|
||
<option value="system">System</option>
|
||
<option value="user">User</option>
|
||
<option value="assistant">Assistant</option>
|
||
</select>
|
||
</div>
|
||
<div class="settings-field">
|
||
<label>单次最大总结（楼）</label>
|
||
<select id="trigger-max-per-run">
|
||
<option value="50">50</option>
|
||
<option value="100" selected>100</option>
|
||
<option value="150">150</option>
|
||
<option value="200">200</option>
|
||
</select>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Auto Summary with sub-options -->
|
||
<div class="settings-checkbox-group">
|
||
<label class="settings-checkbox">
|
||
<input type="checkbox" id="trigger-enabled">
|
||
<span class="checkbox-mark"></span>
|
||
<span class="checkbox-label">启用自动总结</span>
|
||
</label>
|
||
<div class="settings-sub-options hidden" id="auto-summary-options">
|
||
<div class="settings-row">
|
||
<div class="settings-field">
|
||
<label>自动总结间隔（楼）</label>
|
||
<input type="number" id="trigger-interval" min="1" max="30" step="1" value="20">
|
||
</div>
|
||
<div class="settings-field">
|
||
<label>触发时机</label>
|
||
<select id="trigger-timing">
|
||
<option value="after_ai">AI 回复后</option>
|
||
<option value="before_user" selected>用户发送前</option>
|
||
<option value="manual">仅手动</option>
|
||
</select>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Force Insert with wrapper options -->
|
||
<div class="settings-checkbox-group">
|
||
<label class="settings-checkbox">
|
||
<input type="checkbox" id="trigger-insert-at-end">
|
||
<span class="checkbox-mark"></span>
|
||
<span class="checkbox-label">强制插入到聊天最后（插件冲突用）</span>
|
||
</label>
|
||
<div class="settings-sub-options hidden" id="insert-wrapper-options">
|
||
<div class="settings-row">
|
||
<div class="settings-field full">
|
||
<label>头部包裹词</label>
|
||
<input type="text" id="trigger-wrapper-head" placeholder="添加到开头（应对NoAss配置）">
|
||
</div>
|
||
</div>
|
||
<div class="settings-row">
|
||
<div class="settings-field full">
|
||
<label>尾部包裹词</label>
|
||
<input type="text" id="trigger-wrapper-tail" placeholder="添加到结尾（应对NoAss配置）">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Tab 2: Vector Settings -->
|
||
<div class="tab-pane" id="tab-vector">
|
||
<div class="settings-section">
|
||
<div class="settings-section-title">智能记忆（向量检索）</div>
|
||
|
||
<!-- 启用开关 -->
|
||
<div class="settings-checkbox-group">
|
||
<label class="settings-checkbox">
|
||
<input type="checkbox" id="vector-enabled">
|
||
<span class="checkbox-mark"></span>
|
||
<span class="checkbox-label">启用向量检索</span>
|
||
</label>
|
||
</div>
|
||
|
||
<div id="vector-config-area" class="hidden">
|
||
<!-- API Key -->
|
||
<div class="settings-row" style="margin-top:16px">
|
||
<div class="settings-field full">
|
||
<label>硅基流动 API Key</label>
|
||
<input type="password" id="vector-api-key" placeholder="sk-xxx">
|
||
<div class="settings-hint">
|
||
💡 <a href="https://siliconflow.cn" target="_blank">硅基流动</a>
|
||
内置使用的模型完全免费，注册拿 Key 即可。建议完成实名认证以获得更高并发
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 测试连接 -->
|
||
<div class="settings-row">
|
||
<div class="settings-field full">
|
||
<div class="engine-status-row">
|
||
<div class="engine-status" id="online-api-status">
|
||
<span class="status-dot"></span>
|
||
<span class="status-text">未测试</span>
|
||
</div>
|
||
<button class="btn btn-sm" id="btn-test-vector-api">测试连接</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 文本过滤规则 -->
|
||
<div class="settings-collapse" id="filter-rules-collapse">
|
||
<div class="settings-collapse-header" id="filter-rules-toggle">
|
||
<span>文本过滤规则 · <strong id="filter-rules-count">0</strong> 条</span>
|
||
<svg class="collapse-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor"
|
||
stroke-width="2">
|
||
<polyline points="6 9 12 15 18 9"></polyline>
|
||
</svg>
|
||
</div>
|
||
<div class="settings-collapse-content hidden" id="filter-rules-content">
|
||
<div class="filter-rules-section" style="margin-top:0">
|
||
<div class="filter-rules-header">
|
||
<p class="settings-hint" style="margin:0">过滤干扰内容（如思考标签）</p>
|
||
<button class="btn btn-sm btn-add" id="btn-add-filter-rule">
|
||
<svg viewBox="0 0 24 24" width="14" height="14" fill="none"
|
||
stroke="currentColor" stroke-width="2">
|
||
<line x1="12" y1="5" x2="12" y2="19"></line>
|
||
<line x1="5" y1="12" x2="19" y2="12"></line>
|
||
</svg>
|
||
添加
|
||
</button>
|
||
</div>
|
||
<div id="filter-rules-list" class="filter-rules-list"></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- ═══════════════════════════════════════════════════════════ -->
|
||
<!-- 记忆锚点（L0 文本层）-->
|
||
<!-- ═══════════════════════════════════════════════════════════ -->
|
||
<div class="anchor-section">
|
||
<div class="anchor-header">
|
||
<div class="anchor-title">
|
||
<span class="anchor-icon">📌</span>
|
||
<span>记忆锚点</span>
|
||
</div>
|
||
<div class="anchor-hint">从对话中提取叙事锚点（情绪、地点、动作、揭示等），首次提取较慢（约每百楼 2 分钟）</div>
|
||
</div>
|
||
|
||
<div class="anchor-stats" id="anchor-stats">
|
||
<div class="anchor-stat-item">
|
||
<span class="anchor-stat-label">已提取楼层:</span>
|
||
<span class="anchor-stat-value"><strong id="anchor-extracted">0</strong></span>
|
||
</div>
|
||
<span class="anchor-stat-sep">/</span>
|
||
<div class="anchor-stat-item">
|
||
<span class="anchor-stat-label">总 AI 楼层:</span>
|
||
<span class="anchor-stat-value"><strong id="anchor-total">0</strong></span>
|
||
</div>
|
||
<div class="anchor-stat-pending" id="anchor-pending-wrap">
|
||
<span>(待提取 <strong id="anchor-pending">0</strong> 楼)</span>
|
||
</div>
|
||
<span class="anchor-stat-sep">·</span>
|
||
<div class="anchor-stat-item">
|
||
<span class="anchor-stat-label">L0 Atoms:</span>
|
||
<span class="anchor-stat-value"><strong id="anchor-atoms-count">0</strong>
|
||
条</span>
|
||
</div>
|
||
<span class="anchor-stat-sep" id="anchor-extra-sep" style="display:none">·</span>
|
||
<div class="anchor-stat-item" id="anchor-extra-wrap" style="display:none">
|
||
<span id="anchor-extra"></span>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 进度条 -->
|
||
<div class="anchor-progress hidden" id="anchor-progress">
|
||
<div class="progress-bar">
|
||
<div class="progress-inner"></div>
|
||
</div>
|
||
<span class="progress-text">0/0</span>
|
||
</div>
|
||
|
||
<!-- 操作按钮 -->
|
||
<div class="anchor-actions" id="anchor-action-row">
|
||
<button class="btn btn-sm btn-p" id="btn-anchor-generate">生成</button>
|
||
<button class="btn btn-sm btn-del" id="btn-anchor-clear">清空</button>
|
||
<button class="btn btn-sm hidden" id="btn-anchor-cancel">取消</button>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- ═══════════════════════════════════════════════════════════ -->
|
||
<!-- 当前聊天向量 -->
|
||
<!-- ═══════════════════════════════════════════════════════════ -->
|
||
<div class="vector-chat-section">
|
||
<div class="settings-row">
|
||
<div class="settings-field full">
|
||
<label>当前聊天向量</label>
|
||
<div class="vector-stats" id="vector-stats">
|
||
<div class="vector-stat-col">
|
||
<span class="vector-stat-label">L0 Vectors:</span>
|
||
<span class="vector-stat-value"><strong
|
||
id="vector-atom-count">0</strong></span>
|
||
</div>
|
||
<span class="vector-stat-sep">·</span>
|
||
<div class="vector-stat-col">
|
||
<span class="vector-stat-label">L1 Chunks:</span>
|
||
<span class="vector-stat-value"><strong
|
||
id="vector-chunk-count">0</strong></span>
|
||
</div>
|
||
<span class="vector-stat-sep">·</span>
|
||
<div class="vector-stat-col">
|
||
<span class="vector-stat-label">L2 Events:</span>
|
||
<span class="vector-stat-value"><strong
|
||
id="vector-event-count">0</strong></span>
|
||
</div>
|
||
</div>
|
||
<div class="vector-mismatch-warning hidden" id="vector-mismatch-warning">
|
||
⚠ 需重新生成向量
|
||
</div>
|
||
<div class="vector-empty-warning hidden" id="vector-empty-l0-warning">
|
||
⚠ 记忆锚点为空，建议先生成
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 进度条 -->
|
||
<div class="engine-progress hidden" id="vector-gen-progress">
|
||
<div class="progress-bar">
|
||
<div class="progress-inner"></div>
|
||
</div>
|
||
<span class="progress-text">0%</span>
|
||
</div>
|
||
|
||
<!-- 操作按钮 -->
|
||
<div class="settings-btn-row" id="vector-action-row">
|
||
<button class="btn btn-sm btn-p" id="btn-gen-vectors">生成向量</button>
|
||
<button class="btn btn-sm btn-del" id="btn-clear-vectors">清除</button>
|
||
<button class="btn btn-sm hidden" id="btn-cancel-vectors">取消</button>
|
||
</div>
|
||
|
||
<div class="settings-hint" style="margin-top:8px">
|
||
向量化现有数据，生成速度很快
|
||
</div>
|
||
|
||
<!-- 导入导出 -->
|
||
<div class="vector-io-section">
|
||
<div class="settings-row">
|
||
<div class="settings-field full">
|
||
<label>向量迁移</label>
|
||
<div class="settings-btn-row" style="margin-top:8px">
|
||
<button class="btn btn-sm" id="btn-export-vectors">导出</button>
|
||
<button class="btn btn-sm" id="btn-import-vectors">导入</button>
|
||
</div>
|
||
<div class="settings-hint" id="vector-io-status"></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Tab 3: Debug -->
|
||
<div class="tab-pane" id="tab-debug">
|
||
<div class="debug-log-header">
|
||
<div class="debug-title">🔧 记忆召回日志</div>
|
||
<div class="settings-hint">显示最近一次 AI 生成时的向量检索详情</div>
|
||
</div>
|
||
<pre id="recall-log-content" class="debug-log-viewer"></pre>
|
||
</div>
|
||
|
||
<!-- Tab 4: Guide -->
|
||
<div class="tab-pane" id="tab-guide">
|
||
<div class="guide-container">
|
||
|
||
<!-- ❶ 这是什么 -->
|
||
<div class="guide-section">
|
||
<div class="guide-title">
|
||
<span class="guide-num">1</span>
|
||
<span>这是什么</span>
|
||
</div>
|
||
<div class="guide-text">
|
||
AI 聊久了会忘记前面发生过的事，角色开始前后矛盾、丢失记忆。
|
||
</div>
|
||
<div class="guide-text">
|
||
<strong>剧情总结</strong>帮 AI 记住你们的故事。开启后，AI 回复时能自然地引用之前的情节，记住角色关系，不再前后矛盾。
|
||
</div>
|
||
</div>
|
||
|
||
<!-- ❷ 三步上手 -->
|
||
<div class="guide-section">
|
||
<div class="guide-title">
|
||
<span class="guide-num">2</span>
|
||
<span>三步上手</span>
|
||
</div>
|
||
<div class="guide-steps">
|
||
<div class="guide-step">
|
||
<div class="guide-step-num">1</div>
|
||
<div class="guide-step-body">
|
||
<div class="guide-step-title">正常聊天</div>
|
||
<div class="guide-step-desc">先攒够 20 楼左右的对话内容。</div>
|
||
</div>
|
||
</div>
|
||
<div class="guide-step">
|
||
<div class="guide-step-num">2</div>
|
||
<div class="guide-step-body">
|
||
<div class="guide-step-title">点击「总结」</div>
|
||
<div class="guide-step-desc">
|
||
打开面板，点右上角的「总结」按钮。系统会自动提炼剧情要点。
|
||
之后可以在「总结设置」里开启自动总结，就不用每次手动了。
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="guide-step">
|
||
<div class="guide-step-num">3</div>
|
||
<div class="guide-step-body">
|
||
<div class="guide-step-title">开启智能记忆 <span class="guide-tag">推荐</span></div>
|
||
<div class="guide-step-desc">
|
||
在「向量设置」Tab 中勾选启用，填入
|
||
<a href="https://siliconflow.cn" target="_blank">硅基流动</a>
|
||
的 API Key，然后依次点击「生成锚点」→「生成向量」。之后全自动，每条新消息都会自动处理。
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- ❸ 基础功能 -->
|
||
<div class="guide-section">
|
||
<div class="guide-title">
|
||
<span class="guide-num">3</span>
|
||
<span>基础功能：剧情总结</span>
|
||
</div>
|
||
<div class="guide-card-list">
|
||
<div class="guide-card">
|
||
<div class="guide-card-title">📝 总结</div>
|
||
<div class="guide-card-desc">
|
||
点击按钮提炼已有对话的剧情要点。只处理新增的楼层，不会重复已有内容。
|
||
</div>
|
||
</div>
|
||
<div class="guide-card">
|
||
<div class="guide-card-title">⚡ 自动总结</div>
|
||
<div class="guide-card-desc">
|
||
在「总结设置」里开启后，每隔一定楼数自动提炼，不用手动操作。
|
||
</div>
|
||
</div>
|
||
<div class="guide-card">
|
||
<div class="guide-card-title">👁️ 隐藏已总结楼层</div>
|
||
<div class="guide-card-desc">
|
||
已经被总结过的旧楼层不再发送给 AI，节省 token 预算，让 AI 把注意力集中在新内容和记忆摘要上，回复质量更高。
|
||
</div>
|
||
</div>
|
||
<div class="guide-card">
|
||
<div class="guide-card-title">✏️ 手动编辑</div>
|
||
<div class="guide-card-desc">
|
||
面板里的关键词、事件时间线、人物关系、角色弧光、世界状态都可以点「编辑」直接修改，修改立即生效。
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- ❹ 核心功能 -->
|
||
<div class="guide-section">
|
||
<div class="guide-title">
|
||
<span class="guide-num">4</span>
|
||
<span>核心功能：智能记忆</span>
|
||
</div>
|
||
<div class="guide-highlight">
|
||
<div class="guide-highlight-title">为什么需要？</div>
|
||
<div class="guide-text">
|
||
光靠总结摘要，AI 只能看到「发生过什么」，但丢失了原文里的细节、语气和场景氛围。智能记忆让 AI
|
||
能在回复前自动从所有历史对话中找到和当前话题最相关的记忆片段，连同原文细节一起回忆起来。
|
||
</div>
|
||
</div>
|
||
|
||
<div class="guide-text" style="margin-top: 16px"><strong>开启后你会感受到：</strong></div>
|
||
<ul class="guide-list">
|
||
<li>角色在关键时刻引用了很久以前的约定</li>
|
||
<li>提到某个地点时，AI 记得那里曾经发生过什么</li>
|
||
<li>人物关系的微妙变化被一直记住</li>
|
||
<li>伏笔在很久之后被自然地呼应</li>
|
||
<li>不管故事写了多长，AI 都能精准回忆起相关的情节</li>
|
||
</ul>
|
||
|
||
<div class="guide-text" style="margin-top: 16px"><strong>需要什么：</strong></div>
|
||
<ul class="guide-list">
|
||
<li>
|
||
一个 <a href="https://siliconflow.cn" target="_blank">硅基流动</a> 的 API
|
||
Key。我们使用的三个模型全部<strong>完全免费</strong>，不限额度：
|
||
<ul class="guide-list-inner">
|
||
<li><code>bge-m3</code> — 记忆向量化</li>
|
||
<li><code>bge-reranker-v2-m3</code> — 记忆精排</li>
|
||
<li><code>Qwen3-8B</code> — 记忆锚点提取</li>
|
||
</ul>
|
||
建议完成实名认证以获得更高并发，记忆锚点提取速度会更快。
|
||
</li>
|
||
<li>
|
||
首次使用：点「生成锚点」→「生成向量」。锚点提取需要一些时间（约每百楼 2 分钟），向量生成很快。
|
||
</li>
|
||
<li>之后全自动，每条新消息都会自动处理。</li>
|
||
</ul>
|
||
|
||
<div class="guide-tip">
|
||
<div class="guide-tip-icon">💡</div>
|
||
<div class="guide-tip-text">
|
||
<strong>不开智能记忆也能用。</strong>总结功能照常工作，AI 能看到剧情摘要，但看不到原文细节。长篇故事强烈推荐开启，效果非常明显。
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- ❺ 常见问题 -->
|
||
<div class="guide-section">
|
||
<div class="guide-title">
|
||
<span class="guide-num">5</span>
|
||
<span>常见问题</span>
|
||
</div>
|
||
<div class="guide-faq-list">
|
||
<div class="guide-faq-item">
|
||
<div class="guide-faq-q">总结用的是哪个 API？</div>
|
||
<div class="guide-faq-a">默认用你酒馆当前连接的 API。也可以在「总结设置」里单独指定一个不同的 API 和模型。</div>
|
||
</div>
|
||
<div class="guide-faq-item">
|
||
<div class="guide-faq-q">删消息 / Swipe 会出问题吗？</div>
|
||
<div class="guide-faq-a">不会。系统会自动同步所有数据，不需要手动处理。</div>
|
||
</div>
|
||
<div class="guide-faq-item">
|
||
<div class="guide-faq-q">换了角色 / 聊天要重新操作吗？</div>
|
||
<div class="guide-faq-a">总结和向量都是按聊天独立保存的，切换聊天会自动加载对应的数据。</div>
|
||
</div>
|
||
<div class="guide-faq-item">
|
||
<div class="guide-faq-q">怎么知道 AI 有没有用上记忆？</div>
|
||
<div class="guide-faq-a">在「调试」Tab 可以看召回日志，会显示本次回忆了哪些内容。</div>
|
||
</div>
|
||
<div class="guide-faq-item">
|
||
<div class="guide-faq-q">总结结果不准确怎么办？</div>
|
||
<div class="guide-faq-a">面板里每个区块右上角都有「编辑」按钮，可以直接修改，修改立即生效。</div>
|
||
</div>
|
||
<div class="guide-faq-item">
|
||
<div class="guide-faq-q">会不会影响回复速度？</div>
|
||
<div class="guide-faq-a">每次回复前的记忆召回通常在 1-3 秒内完成。首次生成锚点时较慢（约每百楼 2
|
||
分钟），但只需做一次，之后新消息逐条自动处理，感知不到延迟。</div>
|
||
</div>
|
||
<div class="guide-faq-item">
|
||
<div class="guide-faq-q">硅基的 Key 要花钱吗？</div>
|
||
<div class="guide-faq-a">
|
||
不花钱。我们使用的三个模型（bge-m3、bge-reranker-v2-m3、Qwen3-8B）本身就是完全免费的模型，不存在额度限制，永久免费使用。
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- ❻ 小贴士 -->
|
||
<div class="guide-section guide-section-last">
|
||
<div class="guide-title">
|
||
<span class="guide-num">6</span>
|
||
<span>小贴士</span>
|
||
</div>
|
||
<div class="guide-tips-list">
|
||
<div class="guide-tip">
|
||
<div class="guide-tip-icon">🎯</div>
|
||
<div class="guide-tip-text">首次总结建议先手动点一次，看看效果再决定是否开启自动总结。</div>
|
||
</div>
|
||
<div class="guide-tip">
|
||
<div class="guide-tip-icon">📖</div>
|
||
<div class="guide-tip-text">长篇故事强烈推荐开启智能记忆，故事越长效果越明显。</div>
|
||
</div>
|
||
<div class="guide-tip">
|
||
<div class="guide-tip-icon">💾</div>
|
||
<div class="guide-tip-text">向量数据支持导出备份，换设备时可以导入恢复，不用重新生成。</div>
|
||
</div>
|
||
<div class="guide-tip">
|
||
<div class="guide-tip-icon">⚡</div>
|
||
<div class="guide-tip-text">锚点提取是最耗时的步骤。硅基完成实名认证后并发更高，批量处理速度会明显提升。</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="modal-foot">
|
||
<button class="btn" id="settings-cancel">取消</button>
|
||
<button class="btn btn-p" id="settings-save">保存</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Fullscreen Relations Modal -->
|
||
<div class="modal fullscreen" id="rel-fs-modal">
|
||
<div class="modal-bg" id="rel-fs-backdrop"></div>
|
||
<div class="modal-box">
|
||
<div class="modal-head">
|
||
<h2>人物关系图</h2>
|
||
<button class="modal-close" id="rel-fs-close">
|
||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||
<line x1="18" y1="6" x2="6" y2="18" />
|
||
<line x1="6" y1="6" x2="18" y2="18" />
|
||
</svg>
|
||
</button>
|
||
</div>
|
||
<div class="modal-body">
|
||
<div id="relation-chart-fullscreen"></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- HF Guide Modal -->
|
||
<div class="modal" id="hf-guide-modal">
|
||
<div class="modal-bg" id="hf-guide-backdrop"></div>
|
||
<div class="modal-box" style="max-width:900px">
|
||
<div class="modal-head">
|
||
<h2>🤗 Hugging Face Space 部署指南</h2>
|
||
<button class="modal-close" id="hf-guide-close">
|
||
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||
<line x1="18" y1="6" x2="6" y2="18" />
|
||
<line x1="6" y1="6" x2="18" y2="18" />
|
||
</svg>
|
||
</button>
|
||
</div>
|
||
<div class="modal-body" id="hf-guide-body"></div>
|
||
</div>
|
||
</div>
|
||
|
||
<script src="https://cdn.jsdelivr.net/npm/echarts@5/dist/echarts.min.js"></script>
|
||
<script src="story-summary-ui.js"></script>
|
||
</body>
|
||
|
||
</html>
|