完善前端

design/agent-workspace.html

@@ -0,0 +1,169 @@
+<!DOCTYPE html>
+<html lang="zh-CN" data-theme="dark">
+<head>
+<meta charset="UTF-8">
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
+<title>天工阁 · Agent 任务工作台 — 魂镜 Hunjing</title>
+<link rel="stylesheet" href="assets/app.css?v=10">
+</head>
+<body>
+<svg style="display:none" aria-hidden="true"><symbol id="i-moon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z"/></symbol><symbol id="i-home" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/><path d="M9 22V12h6v10"/></symbol><symbol id="i-branch" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="6" y1="3" x2="6" y2="15"/><circle cx="18" cy="6" r="3"/><circle cx="6" cy="18" r="3"/><path d="M18 9a9 9 0 0 1-9 9"/></symbol><symbol id="i-user" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"/><circle cx="12" cy="7" r="4"/></symbol><symbol id="i-book" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M4 19.5A2.5 2.5 0 0 1 6.5 17H20"/><path d="M6.5 2H20v20H6.5A2.5 2.5 0 0 1 4 19.5v-15A2.5 2.5 0 0 1 6.5 2z"/></symbol><symbol id="i-layers" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polygon points="12 2 2 7 12 12 22 7 12 2"/><polyline points="2 17 12 22 22 17"/><polyline points="2 12 12 17 22 12"/></symbol><symbol id="i-kanban" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M5 3h4v18H5z"/><path d="M10 3h4v12h-4z"/><path d="M15 3h4v8h-4z"/></symbol><symbol id="i-package" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z"/><polyline points="3.27 6.96 12 12.01 20.73 6.96"/><line x1="12" y1="22.08" x2="12" y2="12"/></symbol><symbol id="i-users" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"/><circle cx="9" cy="7" r="4"/><path d="M23 21v-2a4 4 0 0 0-3-3.87"/><path d="M16 3.13a4 4 0 0 1 0 7.75"/></symbol><symbol id="i-route" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="6" cy="19" r="3"/><circle cx="18" cy="5" r="3"/><path d="M12 19h4.5a3.5 3.5 0 0 0 0-7h-9a3.5 3.5 0 0 1 0-7H12"/></symbol><symbol id="i-globe" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><line x1="2" y1="12" x2="22" y2="12"/><path d="M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z"/></symbol><symbol id="i-bag" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M6 2 3 6v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V6l-3-4z"/><line x1="3" y1="6" x2="21" y2="6"/><path d="M16 10a4 4 0 0 1-8 0"/></symbol><symbol id="i-shield" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z"/></symbol><symbol id="i-monitor" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="2" y="3" width="20" height="14" rx="2"/><line x1="8" y1="21" x2="16" y2="21"/><line x1="12" y1="17" x2="12" y2="21"/></symbol><symbol id="i-sliders" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="4" y1="21" x2="4" y2="14"/><line x1="4" y1="10" x2="4" y2="3"/><line x1="12" y1="21" x2="12" y2="12"/><line x1="12" y1="8" x2="12" y2="3"/><line x1="20" y1="21" x2="20" y2="16"/><line x1="20" y1="12" x2="20" y2="3"/><line x1="1" y1="14" x2="7" y2="14"/><line x1="9" y1="8" x2="15" y2="8"/><line x1="17" y1="16" x2="23" y2="16"/></symbol><symbol id="i-plus" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="12" y1="5" x2="12" y2="19"/><line x1="5" y1="12" x2="19" y2="12"/></symbol><symbol id="i-pause" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="6" y="4" width="4" height="16"/><rect x="14" y="4" width="4" height="16"/></symbol><symbol id="i-square" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="3" width="18" height="18" rx="2"/></symbol><symbol id="i-clock" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="Line truncated
+</svg>
+<div class="app">
+  <aside class="sidebar">
+    <div class="brand">
+      <div class="brand__mark" aria-hidden="true"></div>
+      <div class="brand__text">
+        <div class="brand__name">魂镜</div>
+        <div class="brand__sub">Hunjing</div>
+      </div>
+    </div>
+    <nav class="side-nav" aria-label="主导航"><div class="nav-group"><div class="nav-group__title">常用</div><a class="nav-item" href="home.html"><svg><use href="#i-home"/></svg><span class="cn">镜庭</span><span class="nav-plain">首页</span></a><a class="nav-item" href="conversation.html"><svg><use href="#i-branch"/></svg><span class="cn">镜树</span><span class="nav-plain">对话</span></a><a class="nav-item" href="characters.html"><svg><use href="#i-user"/></svg><span class="cn">镜生</span><span class="nav-plain">角色</span></a><a class="nav-item" href="memory.html"><svg><use href="#i-book"/></svg><span class="cn">息壤</span><span class="nav-plain">记忆</span></a><a class="nav-item" href="avatar.html"><svg><use href="#i-layers"/></svg><span class="cn">形仪</span><span class="nav-plain">形象</span></a></div><div class="nav-group"><div class="nav-group__title">创造</div><a class="nav-item is-active" aria-current="page" href="agent-workspace.html"><svg><use href="#i-kanban"/></svg><span class="cn">天工阁</span><span class="nav-plain">任务</span></a><a class="nav-item" href="plugins.html"><svg><use href="#i-package"/></svg><span class="cn">百工坊</span><span class="nav-plain">插件</span></a><a class="nav-item" href="collaboration.html"><svg><use href="#i-users"/></svg><span class="cn">同契台</span><span class="nav-plain">协作</span></a><a class="nav-item" href="model-gateway.html"><svg><use href="#i-route"/></svg><span class="cn">神识阁</span><span class="nav-plain">模型</span></a></div><div class="nav-group"><div class="nav-group__title">世界</div><a class="nav-item" href="community.html"><svg><use href="#i-globe"/></svg><span class="cn">雅集</span><span class="nav-plain">社区</span></a><a class="nav-item" href="marketplace.html"><svg><use href="#i-bag"/></svg><span class="cn">云市</span><span class="nav-plain">市场</span></a></div><div class="nav-group"><div class="nav-group__title">治理与账户</div><a class="nav-item" href="governance.html"><svg><use href="#i-shield"/></svg><span class="cn">司命台</span><span class="nav-plain">治理</span></a><a class="nav-item" href="devices.html"><svg><use href="#i-monitor"/></svg><span class="cn">器谱</span><span class="nav-plain">设备</span></a><a class="nav-item" href="settings.html"><svg><use href="#i-sliders"/></svg><span class="cn">设置</span><span class="nav-plain">账户</span></a></div></nav>
+    <div class="side-foot">
+      <button class="icon-btn side-fold-btn" data-sidebar-fold aria-label="收起侧栏" title="收起 / 展开侧栏（记忆偏好）"><svg><use href="#i-chevrons"/></svg></button>
+      <span class="avatar avatar--sm avatar--user">舟</span>
+      <span style="font-size:12.5px">云舟</span>
+      <button class="icon-btn" data-theme-toggle style="margin-left:auto" aria-label="切换到月白主题"><svg><use href="#i-moon"/></svg></button>
+    </div>
+  </aside>
+  <main class="main">
+    <header class="topbar">
+      <div class="crumbs"><span class="cn">天工阁</span><span class="crumbs__sep">·</span><span class="here">Agent 任务工作台</span></div>
+      <div class="topbar__spacer"></div>
+      <span class="prototype-tag">静态原型 · 待审查</span>
+      <button class="icon-btn" data-theme-toggle aria-label="切换到月白主题"><svg><use href="#i-moon"/></svg></button>
+    </header>
+    <div class="content">
+
+      <div class="realm-banner" role="note">
+        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><line x1="12" y1="16" x2="12" y2="12"/><line x1="12" y1="8" x2="12.01" y2="8"/></svg>
+        天工是功能执行者，不冒充角色身份；后台任务不构成第二个角色主体。任务可暂停、取消、审计。
+      </div>
+
+      <div class="char-layout">
+        <div>
+          <div class="card" style="padding:10px">
+            <div style="display:flex;justify-content:space-between;align-items:center;padding:4px 8px 10px">
+              <span class="cn" style="font-size:15px;font-weight:600">天工<span class="cn__plain">任务</span></span>
+              <button class="btn btn--outline btn--sm"><svg><use href="#i-plus"/></svg>新建</button>
+            </div>
+            <div class="char-list-item is-active" aria-current="page">
+              <div style="flex:1">
+                <div class="char-list-item__name" style="font-family:var(--font-ui)">整理性灵 newsletter 书单</div>
+                <div class="char-list-item__sub">青梧 · 分工使 2</div>
+              </div>
+              <span class="badge badge--info" style="font-size:11px;padding:1px 8px"><span class="badge__dot"></span>运转</span>
+            </div>
+            <div class="char-list-item">
+              <div style="flex:1">
+                <div class="char-list-item__name" style="font-family:var(--font-ui)">书房照片归档命名</div>
+                <div class="char-list-item__sub">青梧 · 已成</div>
+              </div>
+              <span class="badge badge--ok" style="font-size:11px;padding:1px 8px"><span class="badge__dot"></span>已成</span>
+            </div>
+            <div class="char-list-item">
+              <div style="flex:1">
+                <div class="char-list-item__name" style="font-family:var(--font-ui)">周报草稿 · 第 37 周</div>
+                <div class="char-list-item__sub">任务 Agent · 无角色身份</div>
+              </div>
+              <span class="badge badge--muted" style="font-size:11px;padding:1px 8px"><span class="badge__dot"></span>待启</span>
+            </div>
+            <div class="char-list-item">
+              <div style="flex:1">
+                <div class="char-list-item__name" style="font-family:var(--font-ui)">远洋航线资料校对</div>
+                <div class="char-list-item__sub">观澜 · 已止（你取消）</div>
+              </div>
+              <span class="badge badge--muted" style="font-size:11px;padding:1px 8px"><span class="badge__dot"></span>已止</span>
+            </div>
+          </div>
+        </div>
+
+        <div>
+          <div class="section card">
+            <div class="card__head" style="align-items:center">
+              <span class="cn" style="font-size:17px">整理性灵 newsletter 书单</span>
+              <span class="badge badge--info" style="margin-left:4px"><span class="badge__dot"></span>运转 · 运行中 <span class="mono">running</span></span>
+              <div style="margin-left:auto;display:flex;gap:8px">
+                <button class="btn btn--outline btn--sm"><svg><use href="#i-pause"/></svg>暂停</button>
+                <button class="btn btn--danger btn--sm"><svg><use href="#i-square"/></svg>取消</button>
+              </div>
+            </div>
+            <div style="font-size:12px;color:var(--text-3);display:flex;gap:16px;flex-wrap:wrap">
+              <span>Run <span class="mono">run_9f31c2</span></span><span>发起 · 镜树「选篇」主题</span><span>开始于 19:52</span><span>插件快照已固定</span>
+            </div>
+          </div>
+
+          <section class="section card">
+            <div class="card__head"><span class="cn">工筹<span class="cn__plain">执行计划</span></span><span style="margin-left:auto;font-size:11.5px;color:var(--text-3)">计划不是不可更改命令</span></div>
+            <div class="step step--done">
+              <span class="step__dot"><svg style="width:13px;height:13px" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"><polyline points="20 6 9 17 4 12"/></svg></span>
+              <div><div class="step__t">收集来源 <span class="badge badge--ok" style="font-size:10.5px;padding:0 7px"><span class="badge__dot"></span>已成</span></div><div class="step__d">检索使 · 性灵 newsletter 近 12 期 · ModelCall ×2 · 1.8k token</div></div>
+            </div>
+            <div class="step step--run">
+              <span class="step__dot">二</span>
+              <div><div class="step__t">去重与筛选 <span class="badge badge--info" style="font-size:10.5px;padding:0 7px"><span class="badge__dot"></span>运转中</span></div><div class="step__d">按共读偏好排序 · 依赖步骤一 · 已 62%</div></div>
+            </div>
+            <div class="step">
+              <span class="step__dot">三</span>
+              <div><div class="step__t">生成摘要 <span class="badge badge--muted" style="font-size:10.5px;padding:0 7px"><span class="badge__dot"></span>待启</span></div><div class="step__d">每本 100 字以内 · 依赖步骤二</div></div>
+            </div>
+            <div class="step">
+              <span class="step__dot">四</span>
+              <div><div class="step__t">写入草稿 <span class="badge badge--muted" style="font-size:10.5px;padding:0 7px"><span class="badge__dot"></span>待启</span></div><div class="step__d">笔记库写入需请命朱批（行契未覆盖新目录）</div></div>
+            </div>
+          </section>
+
+          <section class="section card">
+            <div class="card__head"><span class="cn">预算<span class="cn__plain">RunBudget</span></span></div>
+            <div class="drive-row"><span class="drive-row__label">Token</span><div class="progress"><div class="progress__bar" style="width:62%"></div></div><span class="drive-row__val">12.4k/20k</span></div>
+            <div class="drive-row"><span class="drive-row__label">费用</span><div class="progress"><div class="progress__bar" style="width:60%"></div></div><span class="drive-row__val">¥0.42/0.70</span></div>
+            <div class="drive-row"><span class="drive-row__label">时间</span><div class="progress progress--warn"><div class="progress__bar" style="width:42%"></div></div><span class="drive-row__val">4:12/10:00</span></div>
+            <p style="font-size:12px;color:var(--text-3);margin-top:8px">深度 3 层 · 并发分工使上限 4 · 任一硬上限触发即停，可续跑。</p>
+          </section>
+
+          <section class="section card">
+            <div class="card__head"><span class="cn">分工使<span class="cn__plain">子 Agent · 权限只能收窄</span></span></div>
+            <div class="list-row">
+              <span class="avatar avatar--sm">梧</span>
+              <div class="list-row__body"><div class="list-row__title">检索使 A</div><div class="list-row__sub">只读快照 · 无审批权 · 不写长期记忆</div></div>
+              <span class="badge badge--ok" style="font-size:11px"><span class="badge__dot"></span>已成</span>
+            </div>
+            <div class="list-row">
+              <span class="avatar avatar--sm">梧</span>
+              <div class="list-row__body"><div class="list-row__title">检索使 B（外部信源）</div><div class="list-row__sub">网络白名单 api.xingling.app · 工具结果只是观察，采用前需验证</div></div>
+              <span class="badge badge--info" style="font-size:11px"><span class="badge__dot"></span>运转</span>
+            </div>
+            <div class="list-row">
+              <span class="avatar avatar--sm">梧</span>
+              <div class="list-row__body"><div class="list-row__title">摘要使</div><div class="list-row__sub">token 上限 3k · 等待步骤二</div></div>
+              <span class="badge badge--muted" style="font-size:11px"><span class="badge__dot"></span>待启</span>
+            </div>
+          </section>
+
+          <section class="section card">
+            <div class="card__head"><span class="cn">轨迹<span class="cn__plain">可审计事件</span></span><a class="more" href="governance.html">完整诊断需双重授权 →</a></div>
+            <div class="timeline">
+              <div class="timeline__item"><div class="timeline__date">19:52:04</div><div class="timeline__title">Run 创建</div><div class="timeline__sub">镜像树消息触发 · 幂等键 idem_3c8e</div></div>
+              <div class="timeline__item"><div class="timeline__date">19:52:31</div><div class="timeline__title">ModelCall ×2（检索规划）</div><div class="timeline__sub">TTFT 0.9s · cache 命中 1.2k · 无重试</div></div>
+              <div class="timeline__item"><div class="timeline__date">19:53:10</div><div class="timeline__title">ToolCall · notes.read</div><div class="timeline__sub">读取授权目录 · Schema 校验通过 · 0.8s</div></div>
+              <div class="timeline__item"><div class="timeline__date">19:55:48</div><div class="timeline__title">小周天信号累积</div><div class="timeline__sub">完成信号将作为青梧大周天的唯一输入面</div></div>
+            </div>
+          </section>
+
+          <section class="section card" style="opacity:.75">
+            <div class="card__head"><span class="cn">验收<span class="cn__plain">完成后你来决定</span></span></div>
+            <div style="display:flex;gap:10px;align-items:center">
+              <button class="btn btn--primary" disabled>接受结果</button>
+              <button class="btn btn--outline" disabled>要求重做</button>
+              <span style="font-size:12px;color:var(--text-3)">完成后开放 · 接受前可随时取消，无副作用残留（幂等保障）</span>
+            </div>
+          </section>
+        </div>
+      </div>
+
+    </div>
+  </main>
+</div>
+<script src="assets/app.js?v=3"></script>
+</body>
+</html>