动态记忆区
Last updated
Last updated
<MemoryArea>
<KeyMilestones>这里是关键里程碑</KeyMilestones>
<LongTermMemory>这里是长期记忆内容</LongTermMemory>
<ShortTermMemory>这里是短期记忆内容</ShortTermMemory>
</MemoryArea>```html
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>粉色像素风UI</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=DotGothic16&family=VT323&display=swap" rel="stylesheet">
<style>
/* --- 全局基础设置 --- */
:root {
/* 核心色板 - 草莓牛奶复古盘 */
--pixel-bg-color: #FFC2CE; /* 背景底色 */
--pixel-win-bg: #FFF0F5; /* 窗口背景 */
--pixel-light: #FFFFFF; /* 高光 */
--pixel-shadow: #D68A9C; /* 阴影 */
--pixel-border: #AE697B; /* 深褐色轮廓 */
--pixel-accent: #FBA5BC; /* 强调色（热粉） */
--pixel-highlight-text: #FBA5BC;/* 深粉文字 */
}
body {
font-family: 'VT323', 'DotGothic16', sans-serif;
background-color: transparent;
background-image: none;
color: var(--pixel-border);
padding: 20px;
line-height: 1.5;
margin: 0;
min-height: 100vh;
font-weight: 400;
box-sizing: border-box;
}
.s-bar::-webkit-scrollbar {
width: 14px;
height: 14px;
}
.s-bar::-webkit-scrollbar-track {
background: var(--pixel-win-bg);
border-left: 2px solid var(--pixel-border);
}
.s-bar::-webkit-scrollbar-thumb {
background-color: var(--pixel-accent);
border-top: 2px solid var(--pixel-light);
border-left: 2px solid var(--pixel-light);
border-right: 2px solid var(--pixel-border);
border-bottom: 2px solid var(--pixel-border);
}
details.box {
background: var(--pixel-win-bg);
margin-bottom: 25px;
border: 3px solid var(--pixel-border); /* 最外层黑框 */
position: relative;
box-shadow:
inset 3px 3px 0px var(--pixel-light), /* 左上高光 */
inset -3px -3px 0px var(--pixel-shadow); /* 右下阴影 */
}
details.box > summary {
list-style: none;
padding: 8px 12px;
background: var(--pixel-accent);
color: #fff;
font-weight: bold;
font-size: 1.3em;
cursor: pointer;
/* 标题栏的立体效果 */
border-bottom: 3px solid var(--pixel-border);
border-top: 3px solid var(--pixel-light); /* 内部高光 */
border-left: 3px solid var(--pixel-light);
border-right: 3px solid var(--pixel-shadow);
display: flex;
align-items: center;
justify-content: space-between;
text-shadow: 2px 2px 0px rgba(0,0,0,0.2);
}
details.box > summary::-webkit-details-marker {
display: none;
}
details.box > summary:after {
content: '[+]';
font-family: inherit;
background: #fff;
color: var(--pixel-border);
padding: 0 4px;
border: 2px solid var(--pixel-border);
box-shadow: 2px 2px 0px rgba(0,0,0,0.2);
font-size: 0.8em;
}
details.box[open] > summary:after {
content: '[-]';
background: var(--pixel-border);
color: #fff;
border-color: #fff;
}
.con {
padding: 15px;
max-height: 400px;
overflow-y: auto;
background: var(--pixel-win-bg);
}
/* --- 记忆组件 (Memory) 样式 --- */
.sub-box {
margin-bottom: 15px;
border: 2px solid var(--pixel-border);
background: #fff;
box-shadow: 2px 2px 0px rgba(0,0,0,0.1);
}
.sub-box summary {
padding: 8px 12px;
cursor: pointer;
font-size: 1.1em; /* 记忆栏标题字号 */
color: var(--pixel-border);
background: #FFD1DC; /* 柔和的粉色 */
border-bottom: 2px solid var(--pixel-border);
list-style: none;
font-weight: bold;
}
.sub-box:not([open]) summary {
border-bottom: none;
}
.sub-box summary:hover {
background: #FFC0CB;
}
.list {
padding: 12px;
font-size: 0.95em;
}
.evt {
display: block;
margin-bottom: 10px;
padding-left: 15px;
position: relative;
border-left: 2px solid var(--pixel-shadow);
line-height: 1.4;
}
.evt::before {
content: '';
position: absolute;
left: -6px;
top: 6px;
width: 8px;
height: 8px;
background: var(--pixel-accent);
border: 1px solid var(--pixel-border);
}
</style>
</head>
<body>
<!-- 记忆组件 -->
<details class="box c3">
<summary class="t"><span class="t-txt">梦境的记忆区</span></summary>
<div class="con s-bar">
<details class="sub-box">
<summary>[+] 关键里程碑 </summary>
<div class="list s-bar">
$1
</div>
</details>
<details class="sub-box">
<summary>[+] 永久记忆 </summary>
<div class="list s-bar">
$2
</div>
</details>
<details class="sub-box">
<summary>[+] 短期记忆 </summary>
<div class="list s-bar">
$3
</div>
</details>
</div>
</details>
<script>
// 监听所有折叠面板的切换事件
document.querySelectorAll('details.box').forEach((detail) => {
detail.addEventListener('toggle', function() {
// 当面板展开时
if (this.open) {
// 找到内部的内容容器
const content = this.querySelector('.con');
if (content) {
// 强制滚动条回到顶部
content.scrollTop = 0;
}
}
});
});
</script>
</body>
</html>
```【记忆系统规则】 你拥有一个记忆系统，由“ShortTermMemory（短期记忆）”、“LongTermMemory（长期记忆）”及“KeyMilestones（关键里程碑）”组成。在每次对话结束后，你必须严格遵循以下规则，更新并输出记忆内容。
【核心规则】
1.总结短期记忆：在每次回复的最后，将当前对话的核心内容总结为一条新的短期记忆（20字以内）。
2.累加与触发：
读取历史短期记忆列表，将新的一条追加到末尾。
如果 短期记忆列表少于 9 条：直接追加。
3.清空与归档：
如果 短期记忆积累满 10 条，你必须：
a. 将这 10 条短期记忆概括为 1 条新的“长期记忆”。
b. 将该条长期记忆追加到 <永久记忆> 标签中。
c. 清空 短期记忆区。
4.关键里程碑：仅在发生重大事件（如：击败BOSS、确立关系、获得核心道具、地图转换等）时，在 <关键里程碑> 中追加新内容。非必要不更新。
【输出格式】 严格按照以下 XML 结构输出。为了确保前端正确显示像素风样式，每一条独立的记忆内容必须单独包裹在 <span class="evt">...</span> 标签中：
<MemoryArea>
<KeyMilestones>
<span class="evt">历史里程碑1</span><span class="evt">...新里程碑(如果有)</span>
</KeyMilestones>
<LongTermMemory>
<span class="evt">历史长期记忆1</span><span class="evt">...新长期记忆(如果触发总结)</span>
</LongTermMemory>
<ShortTermMemory>
<span class="evt">历史短期记忆1</span><span class="evt">...本轮新总结</span>
</ShortTermMemory>
</MemoryArea>
【重要约束】
-必须在每次对话后都执行记忆更新并输出 XML。
-严格遵守“满 10 条触发总结并清空”的逻辑。
-标签内部的每一个条目必须由 <span class="evt"> 标签包裹。
-长期记忆需保留旧内容并追加新内容，不可直接覆盖。