dsh-project-room 0.2.1 → 0.2.2

package/client.js

@@ -387,15 +387,44 @@ window.__ModuleLoader__.load({
 }
 .pr-loose-msg { font-size: 10px; color: var(--dsw-alias-label-secondary); padding: 0 6px 6px; line-height: 1.5; flex: 0 0 auto; }
 
-/* 运行中快捷栏（对齐 AI-Agent-Hub）：一行可折行的 pill，完成未读排在前面 */
-.pr-runbar { display: flex; flex-wrap: wrap; gap: 3px; padding: 2px 4px 6px; flex: 0 0 auto; }
+/* 运行中快捷栏（对齐 AI-Agent-Hub）：两段竖排 —— 上「运行中」、下「完成未读」 */
+.pr-runbar { display: flex; flex-direction: column; gap: 4px; padding: 2px 4px 6px; flex: 0 0 auto; min-width: 0; }
+/* 2026-11-11 用户令「快捷栏正在运行和完成未读的分开放」：
+   每段 = 一行小标题（色点/✓ + 文案 + 计数）+ 可折行的 pill 区，段间用极细线分隔。 */
+.pr-runbar-sec { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
+.pr-runbar-sec + .pr-runbar-sec {
+  border-top: 1px solid var(--dsw-alias-border-l1);
+  padding-top: 3px;
+}
+.pr-runbar-sec-title {
+  display: flex; align-items: center; gap: 4px; min-width: 0;
+  padding: 0 2px; font-size: 9px; line-height: 1.4;
+  color: var(--dsw-alias-label-secondary); letter-spacing: .03em;
+}
+.pr-runbar-sec[data-kind="done"] .pr-runbar-sec-title { color: var(--dsw-alias-brand-primary); }
+.pr-runbar-sec-dot {
+  width: 5px; height: 5px; border-radius: 50%; flex: 0 0 auto;
+  background: var(--dsw-alias-state-success-primary);
+}
+.pr-runbar-sec-check {
+  width: 10px; height: 10px; border-radius: 50%; flex: 0 0 auto;
+  display: inline-flex; align-items: center; justify-content: center;
+  background: var(--dsw-alias-brand-primary); color: #fff;
+  font-size: 8px; font-weight: 700; line-height: 1;
+}
+.pr-runbar-sec-label { flex: 0 0 auto; white-space: nowrap; }
+.pr-runbar-sec-count {
+  flex: 0 0 auto; font-variant-numeric: tabular-nums; opacity: .75;
+}
+.pr-runbar-sec-body { display: flex; flex-wrap: wrap; gap: 3px; min-width: 0; }
 /* 快捷栏 pill 也显示分身：每个 pill 变成「按钮 + 树状子行」的竖排小单元，
    子行样式与侧栏芯片的 pr-clone-row / pr-tree-rail 完全一致。 */
 .pr-run-wrap { display: inline-flex; flex-direction: column; gap: 1px; align-items: flex-start; }
 .pr-run-clones { display: flex; flex-direction: column; gap: 1px; padding-left: 6px; margin: 0 0 1px; }
 .pr-run-clones .pr-clone-row { font-size: 9px; line-height: 1.4; }
 .pr-readall {
-  flex: 0 0 auto; margin: 0 2px 0 0; padding: 1px 6px; border-radius: 8px;
+  /* 2026-11-11：一键已读搬进「完成未读」区的小标题里，靠右对齐 */
+  flex: 0 0 auto; margin: 0 0 0 auto; padding: 1px 6px; border-radius: 8px;
   border: 1px solid var(--dsw-alias-border-l1); background: transparent;
   color: var(--dsw-alias-brand-primary); font-size: 9.5px; line-height: 1.4;
   white-space: nowrap; cursor: pointer;
@@ -1078,8 +1107,13 @@ function summarizeMessage(raw) {
         });
       }, [groups, unreadMap]);
 
+      // 2026-11-11 用户令「快捷栏正在运行和完成未读的分开放」：
+      // 原来两种 pill 混在一个 flex 行里（完成未读还置顶排最前），用户扫一眼分不清谁在跑。
+      // 现在拆成两个区、各带标题；渲染顺序按用户第二次要求 = **完成未读在上、运行中在下**。
+      const runningGroups = runGroups.filter((group) => group.mode === 'running');
+      const doneUnreadGroups = runGroups.filter((group) => group.mode === 'done');
       // 完成未读的组数（决定是否显示「全部已读」按钮）
-      const doneGroups = runGroups.filter((group) => group.mode === 'done').length;
+      const doneGroups = doneUnreadGroups.length;
 
       const setPin = (name) => {
         const next = pinned.includes(name) ? pinned.filter((n) => n !== name) : [...pinned, name];
@@ -1494,19 +1528,37 @@ function summarizeMessage(raw) {
         renderNewProject(),
         renderSettings(),
         h('div', { className: 'pr-runbar' },
-          // 一键已读：仅当存在「✓完成」pill 时出现，点一下清空未读表（等价逐个点开）
-          doneGroups > 0
-            ? h('button', {
-              className: 'pr-readall',
-              title: `全部已读（清掉 ${doneGroups} 个完成待查看）`,
-              onClick: (event) => {
-                event.stopPropagation();
-                saveJson('projectRoom.unread', {});
-                setUnread({});
-              },
-            }, '全部已读')
+          // ── 区①：完成未读（2026-11-11 用户令：这一区排在运行中前面；一键已读只清这一区）──
+          doneUnreadGroups.length
+            ? h('div', { className: 'pr-runbar-sec', 'data-kind': 'done' },
+              h('div', { className: 'pr-runbar-sec-title' },
+                h('span', { className: 'pr-runbar-sec-check' }, '✓'),
+                h('span', { className: 'pr-runbar-sec-label' }, '完成未读'),
+                h('span', { className: 'pr-runbar-sec-count' }, String(doneUnreadGroups.length)),
+                h('button', {
+                  className: 'pr-readall',
+                  title: `全部已读（清掉 ${doneGroups} 个完成待查看）`,
+                  onClick: (event) => {
+                    event.stopPropagation();
+                    saveJson('projectRoom.unread', {});
+                    setUnread({});
+                  },
+                }, '全部已读'),
+              ),
+              h('div', { className: 'pr-runbar-sec-body' }, doneUnreadGroups.map(renderRunPill)),
+            )
+            : null,
+          // ── 区②：运行中 ──
+          runningGroups.length
+            ? h('div', { className: 'pr-runbar-sec', 'data-kind': 'running' },
+              h('div', { className: 'pr-runbar-sec-title' },
+                h('span', { className: 'pr-runbar-sec-dot', title: '有 agent 正在运行' }),
+                h('span', { className: 'pr-runbar-sec-label' }, '运行中'),
+                h('span', { className: 'pr-runbar-sec-count' }, String(runningGroups.length)),
+              ),
+              h('div', { className: 'pr-runbar-sec-body' }, runningGroups.map(renderRunPill)),
+            )
             : null,
-          runGroups.map(renderRunPill),
         ),
         h('div', { className: 'pr-head' },
           h('span', { className: 'pr-head-title' }, 'Projects'),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dsh-project-room",
-  "version": "0.2.1",
+  "version": "0.2.2",
   "type": "module",
   "description": "Project rooms for DeepSeek Harness: group sessions into projects, see per-project runtime, and open a room with a shared board, task list, todo queue and message delivery to member sessions.",
   "main": "index.js",