From 9802550ae8bdb3604e6d29145afba02dadbb2cf8 Mon Sep 17 00:00:00 2001 From: 18628386721 <18628386721@163.com> Date: Tue, 28 Jul 2026 11:27:52 +0800 Subject: [PATCH] =?UTF-8?q?=E5=AE=A1=E6=89=B9=20/=20=E6=B6=88=E6=81=AF=20/?= =?UTF-8?q?=20=E7=BA=AA=E8=A6=81=20/=20=E6=B1=87=E6=8A=A5=E8=A1=A5?= =?UTF-8?q?=E4=B8=8A=E5=8A=A9=E7=90=86=E6=A0=8F=20=E2=80=94=E2=80=94=20?= =?UTF-8?q?=E9=82=A3=E4=B8=8D=E6=98=AF=E7=A9=BA=E6=80=81,=E6=98=AF?= =?UTF-8?q?=E6=95=B4=E6=A0=8F=E6=B2=A1=E6=B8=B2=E6=9F=93?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit `.workspace` 是**三列**网格(侧栏 · 工作区 · 助理栏 440px)。这四个模块只渲染了 两栏,右边就空出一条 **234px 的白带** —— 里面什么都没有,不是「空态没写好」, 是这一栏根本没画。实测四面皆然。 那一栏该摆什么,按 OS 4.1 定:「对话流 / 视图区」是**工作台-任务**的交互结构、 是回环输入的唯一入口。这四个要素各有自己的形态 —— 审批是通过/驳回附依据、 消息是就地答(MessageDesk 自己那条 NoteBand 早写着「不开放任务对话流」)、 纪要靠人记、汇报是确认即提交 —— 都不经对话流。 所以**不摆能打字的输入框**:那是在许诺聊得起来。只如实说这一栏是什么、 这一面该怎么用、想说话该去哪儿。共用件 `AssistantAside`,色调 `muted` (通路不在这儿,灰着就不许诺),章也不打彩色渐变 —— 亮着像在待命。 四句文案各说各的事,不是同一句复制四遍: 审批 拍板不用先商量 —— 看依据就够了,想先问一句就去那一单的任务里说 消息 这儿不用聊 —— 就地答完即可,作答只及卡面,不用跑进别人的任务 纪要 会得你自己开 —— 你写下来最准,写完登记起单责任才落到人 汇报 不用你写一个字 —— 按任务日志自动聚合,要数字好看得回任务里干活 顺带治了题头被截:一行摆四件(章 · 任务助理 · Agent · 说明句),对话区压到 212px 时说明句只剩 29px,被省略号截成「汇…」,一个字都读不出来。改为按**本栏宽度** 容器查询,挤了就让说明句换到第二行拿整行说完。任务面的「盯着这单推进 · 有事随时说」 以前也是截的,这下一并读全了。容器上下文落在 `.jc-tch` 不是 `.session-chat` —— 后者带拖拽调宽的负偏移柄,不给它加 containment。 补 3 个缺失图标(gavel / pencil-line / chart-column)—— 不补就是空 SVG,这坑踩过。 typecheck ✓ lint ✓ depcruise 374 模块 ✓ api:check ✓ 490 测试 ✓ Co-Authored-By: Claude Opus 5 (1M context) Claude-Session: https://claude.ai/code/session_01KeDBx2PHLavbURXB8LJJ7m --- apps/web/src/app/styles/app.css | 20 +++++++++ .../desk-approval/internal/ApprovalDesk.tsx | 9 +++- .../desk-message/internal/MessageDesk.tsx | 9 +++- .../desk-minute/internal/MinuteDesk.tsx | 9 +++- .../desk-report/internal/ReportDesk.tsx | 9 +++- apps/web/src/shared/desk/module-kit.tsx | 44 +++++++++++++++++++ packages/ui-kit/src/Ico.tsx | 3 ++ 7 files changed, 99 insertions(+), 4 deletions(-) diff --git a/apps/web/src/app/styles/app.css b/apps/web/src/app/styles/app.css index 4a367b2..c527146 100644 --- a/apps/web/src/app/styles/app.css +++ b/apps/web/src/app/styles/app.css @@ -2958,3 +2958,23 @@ .proto-root .jc-empty.t-muted .r1 { background: radial-gradient(circle, var(--line-soft), transparent 72%); } .proto-root .jc-empty.t-muted .r2 { background: var(--line-soft); } .proto-root .jc-empty.t-muted .jc-empty-ico { color: var(--ink-3); } + +/* ── 助理栏的「不在岗」态(补充,非原型)────────────────────────────── + 审批 / 消息 / 纪要 / 汇报四面的助理栏:对话流按 OS 4.1 只长在任务上, + 这四面用不到它。章不打彩色渐变 —— 亮着像在待命,灰着才说得清「这儿不说话」。 */ +.proto-root .jc-tch-mark.t-idle { background: var(--line-soft); color: var(--ink-3); box-shadow: none; } + +/* ── 助理栏题头的抗压(补充,非原型)──────────────────────────────── + 题头一行摆四件:章 · 任务助理 · Agent · 说明句。对话区被压到 ~210px 时, + 说明句只剩 29px 宽,被省略号截成「汇…」—— 一个字都读不出来,等于白占地方。 + 让它在挤的时候**换到第二行**,拿整行说完;右对齐也一并取消(自己一行就不用靠边)。 + + 按**自己这一栏的宽度**判断,不按视口 —— 对话区宽度还受收起状态影响, + 视口断点管不住它。容器上下文落在 `.jc-tch`(内层壳)而不是 `.session-chat`: + 后者带着拖拽调宽的柄(负偏移),不给它加 containment。 */ +.proto-root .jc-tch { container-type: inline-size; } + +@container (max-width: 300px) { + .proto-root .jc-tch-head { flex-wrap: wrap; row-gap: 2px; } + .proto-root .jc-tch-desc { flex: 1 0 100%; text-align: left; white-space: normal; } +} diff --git a/apps/web/src/features/desk-approval/internal/ApprovalDesk.tsx b/apps/web/src/features/desk-approval/internal/ApprovalDesk.tsx index a99499b..7ddf2ea 100644 --- a/apps/web/src/features/desk-approval/internal/ApprovalDesk.tsx +++ b/apps/web/src/features/desk-approval/internal/ApprovalDesk.tsx @@ -12,7 +12,7 @@ import { decideApprovalRoute, listApprovalsForMeRoute } from '@contracts'; import { Ico } from '@web-shared/Ico.tsx'; import ScrollArea from '@web-shared/ScrollArea.tsx'; import { call } from '@web-shared/typed-fetch.ts'; -import { Chip, DocPanel, Hero, EmptyState, ListEmpty, NoteBand, Section, SidebarHead } from '@web-shared/desk/module-kit.tsx'; +import { AssistantAside, Chip, DocPanel, Hero, EmptyState, ListEmpty, NoteBand, Section, SidebarHead } from '@web-shared/desk/module-kit.tsx'; const STATE_CHIP = { pending: { tone: 'todo' as const, label: '待审批', pulse: true }, @@ -188,6 +188,13 @@ export function ApprovalDesk() { )} )} + + ); } diff --git a/apps/web/src/features/desk-message/internal/MessageDesk.tsx b/apps/web/src/features/desk-message/internal/MessageDesk.tsx index cd88920..3d7d13f 100644 --- a/apps/web/src/features/desk-message/internal/MessageDesk.tsx +++ b/apps/web/src/features/desk-message/internal/MessageDesk.tsx @@ -13,7 +13,7 @@ import { answerMessageRoute, listMessagesRoute, markMessageReadRoute } from '@co import { Ico } from '@web-shared/Ico.tsx'; import ScrollArea from '@web-shared/ScrollArea.tsx'; import { call } from '@web-shared/typed-fetch.ts'; -import { Chip, DocPanel, Hero, EmptyState, ListEmpty, NoteBand, Section, SidebarHead } from '@web-shared/desk/module-kit.tsx'; +import { AssistantAside, Chip, DocPanel, Hero, EmptyState, ListEmpty, NoteBand, Section, SidebarHead } from '@web-shared/desk/module-kit.tsx'; const KIND_META: Readonly> = { notice: { icon: 'bell', grad: ['#7f3bf5', '#5b21cf'], kicker: '系统 · 通知' }, @@ -151,6 +151,13 @@ export function MessageDesk() { )} )} + + ); } diff --git a/apps/web/src/features/desk-minute/internal/MinuteDesk.tsx b/apps/web/src/features/desk-minute/internal/MinuteDesk.tsx index f3a3c3f..15dbdeb 100644 --- a/apps/web/src/features/desk-minute/internal/MinuteDesk.tsx +++ b/apps/web/src/features/desk-minute/internal/MinuteDesk.tsx @@ -12,7 +12,7 @@ import { appendResolutionRoute, createMinuteRoute, listMinutesRoute, registerRes import { Ico } from '@web-shared/Ico.tsx'; import ScrollArea from '@web-shared/ScrollArea.tsx'; import { call } from '@web-shared/typed-fetch.ts'; -import { Avatar, AvatarStack, Chip, DocPanel, Hero, EmptyState, ListEmpty, NoteBand, Section, SidebarHead } from '@web-shared/desk/module-kit.tsx'; +import { AssistantAside, Avatar, AvatarStack, Chip, DocPanel, Hero, EmptyState, ListEmpty, NoteBand, Section, SidebarHead } from '@web-shared/desk/module-kit.tsx'; export function MinuteDesk() { const queryClient = useQueryClient(); @@ -269,6 +269,13 @@ export function MinuteDesk() { )} + + ); } diff --git a/apps/web/src/features/desk-report/internal/ReportDesk.tsx b/apps/web/src/features/desk-report/internal/ReportDesk.tsx index 10dbd97..4f443e9 100644 --- a/apps/web/src/features/desk-report/internal/ReportDesk.tsx +++ b/apps/web/src/features/desk-report/internal/ReportDesk.tsx @@ -12,7 +12,7 @@ import { REPORT_PERIOD_LABEL, draftReportRoute, submitReportRoute } from '@contr import { Ico } from '@web-shared/Ico.tsx'; import ScrollArea from '@web-shared/ScrollArea.tsx'; import { call } from '@web-shared/typed-fetch.ts'; -import { Chip, DocPanel, Hero, EmptyState, ListEmpty, NoteBand, Section, SidebarHead } from '@web-shared/desk/module-kit.tsx'; +import { AssistantAside, Chip, DocPanel, Hero, EmptyState, ListEmpty, NoteBand, Section, SidebarHead } from '@web-shared/desk/module-kit.tsx'; const PERIODS: ReadonlyArray<{ k: ReportPeriodName; ico: string }> = [ { k: 'day', ico: 'calendar-days' }, @@ -191,6 +191,13 @@ export function ReportDesk() { )} + + ); } diff --git a/apps/web/src/shared/desk/module-kit.tsx b/apps/web/src/shared/desk/module-kit.tsx index 144414d..9731e9d 100644 --- a/apps/web/src/shared/desk/module-kit.tsx +++ b/apps/web/src/shared/desk/module-kit.tsx @@ -229,3 +229,47 @@ export function EmptyState({ ); } + +/** + * 助理栏 —— 审批 / 消息 / 纪要 / 汇报四面右侧那一栏。 + * + * `.workspace` 是**三列**网格(侧栏 · 工作区 · 助理栏)。这四个模块原来只渲染两栏, + * 右边就空出一条 234px 的白带 —— 不是空态,是**什么都没有**,看着像坏了。 + * + * 那一栏摆什么?按 OS 4.1,「对话流」是**工作台-任务**的交互结构、是回环输入的唯一入口; + * 这四个要素各有自己的形态:审批是通过/驳回附依据、消息是就地答、纪要靠人记、 + * 汇报是确认即提交 —— 都不经对话流。所以这里不摆一个能打字的输入框(那是许诺聊得起来), + * 只如实说明这一栏是什么、这一面该怎么用、想说话该去哪儿。 + * + * 色调用 `muted`:通路不在这儿,灰着就不许诺。 + */ +export function AssistantAside({ + ico, + title, + desc, + note, +}: { + ico: string; + title: string; + desc: string; + /** 题头右侧那半句 —— 一句话说清这一栏在本面的角色 */ + note: string; +}) { + return ( +
+
+
+ + + + 任务助理 + Agent + {note} +
+
+ +
+
+
+ ); +} diff --git a/packages/ui-kit/src/Ico.tsx b/packages/ui-kit/src/Ico.tsx index b26b8c2..f11eac5 100644 --- a/packages/ui-kit/src/Ico.tsx +++ b/packages/ui-kit/src/Ico.tsx @@ -75,6 +75,9 @@ export function Ico({ name, s = 18 }: { name: string; s?: number }) { "shield-check": (<>), scan: (<>), "file-check": (<>), + gavel: (<>), + "pencil-line": (<>), + "chart-column": (<>), "trending-up": (<>), ban: (<>), key: (<>),