Compare commits
220
Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
7cb17d015d | ||
|
|
1719803a92 | ||
|
|
a1e7e4680f | ||
|
|
92864db8d3 | ||
|
|
fb1f9f246b | ||
|
|
2f8009b967 | ||
|
|
8b59998d3c | ||
|
|
c9ba3442fc | ||
|
|
ed23de28df | ||
|
|
83e81d12ac | ||
|
|
e503cc9e93 | ||
|
|
c3d8205839 | ||
|
|
dd159c24d0 | ||
|
|
a56ce3e1df | ||
|
|
10f8388bb8 | ||
|
|
5ede8df52a | ||
|
|
49ba8b1735 | ||
|
|
b594d2748e | ||
|
|
afd661c932 | ||
|
|
c9ef3c0f0a | ||
|
|
72f1a259e1 | ||
|
|
804170ec66 | ||
|
|
7759d8077f | ||
|
|
8d43b1de12 | ||
|
|
d66bd7941c | ||
|
|
a022257b40 | ||
|
|
3f6ced099c | ||
|
|
86770e35fb | ||
|
|
65ab7a8a44 | ||
|
|
119fff96e8 | ||
|
|
96ec03d461 | ||
|
|
17996cf4dd | ||
|
|
dbb5f0462f | ||
|
|
125261410c | ||
|
|
e895a4f6a8 | ||
|
|
46e99fedbb | ||
|
|
bcb81719ce | ||
|
|
d8e610aebe | ||
|
|
3bbb918795 | ||
|
|
10635387e0 | ||
|
|
a81e94a4f2 | ||
|
|
781cde6667 | ||
|
|
e33d17e1a6 | ||
|
|
5c0e9f2711 | ||
|
|
04269eed25 | ||
|
|
985fc0f931 | ||
|
|
4835c45b8d | ||
|
|
6093beb27e | ||
|
|
c2ff4fcc8e | ||
|
|
03db4b81be | ||
|
|
3555f815af | ||
|
|
11f66aee9d | ||
|
|
06249dd83f | ||
|
|
83c22681f9 | ||
|
|
44205e1262 | ||
|
|
1b7ba779f1 | ||
|
|
0cd1f9954a | ||
|
|
92c390a08a | ||
|
|
06fa1a40a6 | ||
|
|
9242cee89d | ||
|
|
8a9d129a94 | ||
|
|
f7d9197011 | ||
|
|
5ab81432d1 | ||
|
|
9b9f24b7be | ||
|
|
8dc68fd1e3 | ||
|
|
ddf3135c3f | ||
|
|
b04f4ded95 | ||
|
|
710ef836b5 | ||
|
|
e10e447dab | ||
|
|
b175506ebd | ||
|
|
7afae7f20b | ||
|
|
099a92022d | ||
|
|
5313cfad4e | ||
|
|
4e1eb39035 | ||
|
|
eb2d6d32f9 | ||
|
|
40c2afe054 | ||
|
|
42cda9c056 | ||
|
|
15b962694b | ||
|
|
67585c1701 | ||
|
|
2ba275b991 | ||
|
|
e7f9081a93 | ||
|
|
c294835f8d | ||
|
|
880eff74f8 | ||
|
|
b7473fe585 | ||
|
|
dfcea5c988 | ||
|
|
07a03ac4f6 | ||
|
|
d69009e081 | ||
|
|
55a64f40e8 | ||
|
|
b3fa39744d | ||
|
|
23f96fd921 | ||
|
|
f96a591123 | ||
|
|
698fffd929 | ||
|
|
44b964682c | ||
|
|
0655bc37e1 | ||
|
|
9fc7da2ace | ||
|
|
dcd2699933 | ||
|
|
0159f009fa | ||
|
|
43d1933b8c | ||
|
|
91a832f93e | ||
|
|
37c668dbad | ||
|
|
e6eecb2bfa | ||
|
|
ac668d11d3 | ||
|
|
411a79d9e2 | ||
|
|
d9bb780384 | ||
|
|
4965de269a | ||
|
|
b7194d54d5 | ||
|
|
f752a7bcec | ||
|
|
e3332badca | ||
|
|
3a5fbe6e42 | ||
|
|
fca832e3b0 | ||
|
|
81b984c752 | ||
|
|
c4ebcf5404 | ||
|
|
11464242c0 | ||
|
|
809f28d48f | ||
|
|
336ec94763 | ||
|
|
0ae27749cf | ||
|
|
531b683a92 | ||
|
|
0f52634380 | ||
|
|
1edd872c55 | ||
|
|
a45a4d8652 | ||
|
|
378ec24bbd | ||
|
|
cc233fec90 | ||
|
|
8db7093a9d | ||
|
|
034bd5f724 | ||
|
|
83a062b7f8 | ||
|
|
fdaf89de9d | ||
|
|
986ebdbb61 | ||
|
|
e058adcf72 | ||
|
|
d01a3ebd81 | ||
|
|
fac99939fa | ||
|
|
c1225bb880 | ||
|
|
57fabf1a95 | ||
|
|
360d6406e4 | ||
|
|
25e76c5e01 | ||
|
|
41f6ce8760 | ||
|
|
0f860c0743 | ||
|
|
fdedaa1123 | ||
|
|
4ab507b1b6 | ||
|
|
01b853fd0e | ||
|
|
7acfef0a1f | ||
|
|
c22120d7fe | ||
|
|
15d8a4093b | ||
|
|
d2d81e119c | ||
|
|
fb846bed14 | ||
|
|
566fec9f56 | ||
|
|
98751916da | ||
|
|
ed9845f8e4 | ||
|
|
a2ebc7fb84 | ||
|
|
367aeefff4 | ||
|
|
65d3b8ef02 | ||
|
|
ed7e3126e7 | ||
|
|
aaced8796b | ||
|
|
d0d9876b18 | ||
|
|
2c56054861 | ||
|
|
c2878c04ea | ||
|
|
b80153dbf8 | ||
|
|
39dc8c456c | ||
|
|
482ba885e1 | ||
|
|
09310cb753 | ||
|
|
fcf40ff75f | ||
|
|
dc18d6c747 | ||
|
|
68f6c8638b | ||
|
|
df4ca1e470 | ||
|
|
8108655e61 | ||
|
|
6b4920b509 | ||
|
|
a26d7c5aee | ||
|
|
69b1487fb7 | ||
|
|
32e327a831 | ||
|
|
3ed10e1220 | ||
|
|
204ca67dc7 | ||
|
|
339a9ebc2d | ||
|
|
475fd3a8d6 | ||
|
|
84b73ab328 | ||
|
|
c71a77bb22 | ||
|
|
50c7244601 | ||
|
|
2464c16e6b | ||
|
|
0a0b55612c | ||
|
|
62aa5f8a56 | ||
|
|
d384a3d778 | ||
|
|
787a09ecd3 | ||
|
|
345adf8e9b | ||
|
|
c401bfe1fe | ||
|
|
817c43e764 | ||
|
|
9badbb1f85 | ||
|
|
a775e1998f | ||
|
|
cf6f24e583 | ||
|
|
2f599c84f8 | ||
|
|
24d9f632ca | ||
|
|
eb6502f0ef | ||
|
|
13a1c63280 | ||
|
|
02cebc06ce | ||
|
|
36b92ede88 | ||
|
|
1f42edf80a | ||
|
|
b25979401a | ||
|
|
e26119db89 | ||
|
|
82d216b324 | ||
|
|
0eaced4d5a | ||
|
|
3edae0212c | ||
|
|
5961b6e9bd | ||
|
|
dcf9b6b847 | ||
|
|
799f3d30fe | ||
|
|
d5f59f1811 | ||
|
|
8be98b4cbe | ||
|
|
3936fff664 | ||
|
|
e4ca2acfa6 | ||
|
|
539aae69b9 | ||
|
|
763c4b4804 | ||
|
|
e5555b194a | ||
|
|
794c3e1657 | ||
|
|
ed95f64890 | ||
|
|
eca1665d91 | ||
|
|
bca7795218 | ||
|
|
c108209923 | ||
|
|
aedcf50fc9 | ||
|
|
1b4666c613 | ||
|
|
d1ea616b08 | ||
|
|
7d796ee507 | ||
|
|
83357b5537 | ||
|
|
f718095d78 | ||
|
|
bcc9f1b5db |
@@ -2,6 +2,10 @@
|
||||
node_modules
|
||||
dist/
|
||||
*.local
|
||||
*.tsbuildinfo
|
||||
|
||||
# mimosa 扫描钩子的本地缓存(scripts/hooks 写入,不入库)
|
||||
.mimosa
|
||||
# Playwright 运行工件(e2e/ 用例输出;详工件在 Dev .tmp/e2e/<ts>/frontend/)
|
||||
test-results/
|
||||
playwright-report/
|
||||
|
||||
@@ -17,6 +17,7 @@
|
||||
- 模块边界、公开契约与隔离档位见 `policy/modules/`(如有)与 PROJECT.md。
|
||||
- 跨仓 gitlink 变更须经组合验证后在 Dev 仓推进;受保护分支经 PR 合入。
|
||||
- 验证命令见 PROJECT.md「验证」节;完成声明须附实际命令输出证据。
|
||||
- 异步状态只有一个所有者。事件按 seq 处理,过期事件丢弃。
|
||||
|
||||
## Gitea 与 Git 访问事实(2026-09-30 实测)
|
||||
|
||||
|
||||
+1
-1
@@ -10,4 +10,4 @@
|
||||
- `npx tsc -b` — 类型检查;`npm run build` — 产物 dist/(Dev Makefile 拷贝至 backend web/dist 内嵌)。
|
||||
- `npm test` — vitest:契约形状测试(Core 黄金样本驱动的判别联合/事件信封/HITL impact/工具三清单断言)。
|
||||
- 开发:`npm run dev`(Vite 代理 /api → 127.0.0.1:8787)。
|
||||
- 依赖刻意最小:react + marked;无 UI 框架(设计令牌手写,见 styles.css)。
|
||||
- 依赖刻意最小:react + marked + dompurify(模型输出与文档预览先清洗再写入页面);无 UI 框架(设计令牌手写,见 styles.css)。
|
||||
|
||||
@@ -0,0 +1,81 @@
|
||||
// 防再发守卫:管理员建号路径(UsersPanel)必须持续符合后端待初始化契约。
|
||||
// 背景:backend 8dfc223 将 POST /api/admin/users 改为严格 {owner, profile} 解码,
|
||||
// 前端未跟进导致部署后 UI 建号 400(json: unknown field "name")——单测与 mock
|
||||
// 都没有覆盖这条组合路径,本场景以真实浏览器把「填用户名 → 创建账号 →
|
||||
// 确认『待初始化』提示与用户表行」钉进组合验收线。
|
||||
// 驱动方:Dev 仓 scripts/e2e.sh——构建 RDM 二进制 + frontend dist,起 serve(auth on)
|
||||
// 与 vite preview;种子账号 e2e-auditor 为基座管理员(bootstrap-admin)。
|
||||
// 环境契约(缺省值与 e2e.sh 一致;PLAYWRIGHT_BASE_URL 未设置时整组跳过):
|
||||
// PLAYWRIGHT_BASE_URL / E2E_OWNER / E2E_PASSWORD / E2E_PASSWORD2
|
||||
import { test, expect, type Page } from '@playwright/test'
|
||||
|
||||
const OWNER = process.env.E2E_OWNER || 'e2e-auditor'
|
||||
const PASSWORD = process.env.E2E_PASSWORD || 'E2eAudit#2026'
|
||||
const PASSWORD2 = process.env.E2E_PASSWORD2 || 'E2eAudit#2026b'
|
||||
|
||||
test.skip(!process.env.PLAYWRIGHT_BASE_URL, 'set PLAYWRIGHT_BASE_URL (scripts/e2e.sh drives this suite)')
|
||||
|
||||
async function login(page: Page) {
|
||||
await page.goto('/')
|
||||
await expect(page.getByPlaceholder('由管理员分配')).toBeVisible()
|
||||
await page.getByPlaceholder('由管理员分配').fill(OWNER)
|
||||
await page.getByPlaceholder('初始密码或常用密码').fill(PASSWORD)
|
||||
await page.getByRole('button', { name: '登录', exact: true }).click()
|
||||
// 三种落点:直接进工作台(密码已生效)|强制改密门|初始密码已失效(种子二次运行)→ 改用新密码重登。
|
||||
const entered = await page.locator('.tsb-user').waitFor({ state: 'visible', timeout: 5_000 }).then(() => true).catch(() => false)
|
||||
if (!entered) {
|
||||
const gated = await page.getByText('修改密码').waitFor({ state: 'visible', timeout: 5_000 }).then(() => true).catch(() => false)
|
||||
if (gated) {
|
||||
const pwInputs = page.locator('.lg-card input[type="password"]')
|
||||
await pwInputs.nth(0).fill(PASSWORD)
|
||||
await pwInputs.nth(1).fill(PASSWORD2)
|
||||
await pwInputs.nth(2).fill(PASSWORD2)
|
||||
await page.getByRole('button', { name: '设置新密码并进入' }).click()
|
||||
} else {
|
||||
await page.getByPlaceholder('初始密码或常用密码').fill(PASSWORD2)
|
||||
await page.getByRole('button', { name: '登录', exact: true }).click()
|
||||
}
|
||||
}
|
||||
await expect(page.locator('.tsb-user')).toBeVisible({ timeout: 15_000 })
|
||||
}
|
||||
|
||||
test('管理员建号:UI 请求新契约并给出待初始化提示', async ({ page }) => {
|
||||
await login(page)
|
||||
|
||||
// 账户菜单 → 系统管理…(全屏独立视图)→ 用户管理分区。
|
||||
await page.locator('.tsb-user').click()
|
||||
const adminEntry = page.getByText('系统管理…', { exact: true })
|
||||
await expect(adminEntry).toBeVisible()
|
||||
await adminEntry.click()
|
||||
await expect(page.locator('.az')).toBeVisible()
|
||||
const usersSection = page.getByText('用户管理', { exact: true }).first()
|
||||
if (await usersSection.count()) await usersSection.click()
|
||||
|
||||
// 建号表单:用户名每次运行唯一(重复运行不因 409 假红),显示名可空。
|
||||
const newOwner = `e2e-ui-${Date.now().toString(36)}`
|
||||
const userInput = page.getByPlaceholder('用户名(登录名)')
|
||||
await expect(userInput).toBeVisible()
|
||||
await userInput.fill(newOwner)
|
||||
await page.getByPlaceholder('显示名(可空)').fill('组合验收')
|
||||
|
||||
// 创建 → 契约断言一:请求体是严格 {owner, profile:{name}},无 password/isAdmin。
|
||||
const createBody = page.waitForRequest(
|
||||
req => req.url().endsWith('/api/admin/users') && req.method() === 'POST',
|
||||
).then(req => req.postDataJSON())
|
||||
await page.getByRole('button', { name: '创建账号', exact: true }).click()
|
||||
const body = await createBody
|
||||
expect(body).toEqual({ owner: newOwner, profile: { name: '组合验收' } })
|
||||
|
||||
// 契约断言二:页面创建后账号可直接使用,不再提示 CLI 初始化。
|
||||
await expect(page.locator('.ad-notice')).toContainText(`已创建 ${newOwner}`)
|
||||
|
||||
// 契约断言三:用户表出现该账号,状态为未设密码(HTTP 建号不能设密码/授权限)。
|
||||
const row = page.locator('.ad-table tbody tr', { hasText: newOwner })
|
||||
await expect(row).toBeVisible()
|
||||
await expect(row).toContainText('未设密码')
|
||||
await expect(row).not.toContainText('ADMIN')
|
||||
|
||||
// 界面说明与后端流程一致(激活 Key 由服务器本地 CLI 发放)。
|
||||
await expect(page.locator('.ad-create .ad-hint')).toContainText('初始密码')
|
||||
await expect(page.locator('.ad-create .ad-hint')).not.toContainText('user initialize-account')
|
||||
})
|
||||
@@ -0,0 +1,64 @@
|
||||
// 增量 3 验收(2026-10-12 诊断报告):改密弹窗表单语义——<form onSubmit> 承载提交
|
||||
//(Enter 可提交)、autocomplete 三段标注(username/current-password/new-password)、
|
||||
// 只读用户名关联、错误文案复用 humanChangePasswordError(401 不再一刀切)。
|
||||
// 驱动:scripts/e2e.sh 第 4 阶段(E2E_PLAIN_BASE=1)——表单语义与命令面无关,
|
||||
// 任意 auth-on 服务可验,普通基座段顺路覆盖;RDM 组合主跑(第 3 阶段)本文件自跳过。
|
||||
import { test, expect, type Page } from '@playwright/test'
|
||||
|
||||
const OWNER = process.env.E2E_OWNER || 'e2e-auditor'
|
||||
const PASSWORD = process.env.E2E_PASSWORD || 'E2eAudit#2026'
|
||||
const PASSWORD2 = process.env.E2E_PASSWORD2 || 'E2eAudit#2026b'
|
||||
|
||||
test.skip(!(process.env.PLAYWRIGHT_BASE_URL && process.env.E2E_PLAIN_BASE),
|
||||
'set PLAYWRIGHT_BASE_URL + E2E_PLAIN_BASE (scripts/e2e.sh phase 4 drives this suite)')
|
||||
|
||||
async function login(page: Page) {
|
||||
await page.goto('/')
|
||||
await page.getByPlaceholder('由管理员分配').fill(OWNER)
|
||||
await page.getByPlaceholder('初始密码或常用密码').fill(PASSWORD)
|
||||
await page.getByRole('button', { name: '登录', exact: true }).click()
|
||||
// 受限设密门(2026-10-13 合同):heading 唯一定位(标题与按钮同名),
|
||||
// 门挂载后登录卡已卸载,fill 不再与登录卡竞态。
|
||||
const gate = page.getByRole('heading', { name: '设置新密码' })
|
||||
const gated = await gate.waitFor({ state: 'visible', timeout: 5_000 }).then(() => true).catch(() => false)
|
||||
if (gated) {
|
||||
const pwInputs = page.locator('.lg-card input[type="password"]')
|
||||
await pwInputs.nth(0).fill(PASSWORD2)
|
||||
await pwInputs.nth(1).fill(PASSWORD2)
|
||||
await page.getByRole('button', { name: '设置新密码', exact: true }).click()
|
||||
// 设密成功后服务端销毁会话:等成功页再回登录(在途点取消会被会话复验拒绝)。
|
||||
await expect(page.getByRole('heading', { name: '密码已更新' })).toBeVisible({ timeout: 10_000 })
|
||||
await page.getByRole('button', { name: '返回登录', exact: true }).click()
|
||||
await page.getByPlaceholder('由管理员分配').fill(OWNER)
|
||||
await page.getByPlaceholder('初始密码或常用密码').fill(PASSWORD2)
|
||||
await page.getByRole('button', { name: '登录', exact: true }).click()
|
||||
} else {
|
||||
await page.getByPlaceholder('初始密码或常用密码').fill(PASSWORD2)
|
||||
await page.getByRole('button', { name: '登录', exact: true }).click()
|
||||
}
|
||||
await expect(page.locator('.tsb-tool', { hasText: '代理' })).toBeVisible({ timeout: 15_000 })
|
||||
}
|
||||
|
||||
test('改密弹窗:form 提交、autocomplete/用户名关联、错误分类文案', async ({ page }) => {
|
||||
await login(page)
|
||||
await page.locator('.tsb-user').click()
|
||||
await page.getByRole('button', { name: '修改密码…' }).click()
|
||||
const dlg = page.getByRole('dialog', { name: '修改密码' })
|
||||
await expect(dlg).toBeVisible()
|
||||
|
||||
// 用户名只读关联 + 三段 autocomplete。
|
||||
const username = dlg.locator('input[autocomplete="username"]')
|
||||
await expect(username).toHaveValue(OWNER)
|
||||
// 本仓 @playwright/test 无 toBeReadOnly:以 readonly 属性断言只读关联。
|
||||
await expect(username).toHaveAttribute('readonly', '')
|
||||
await expect(dlg.locator('input[autocomplete="current-password"]')).toHaveCount(1)
|
||||
await expect(dlg.locator('input[autocomplete="new-password"]')).toHaveCount(2)
|
||||
|
||||
// 表单语义:填错当前密码后按 Enter(不点按钮)提交——证明提交走 <form onSubmit>。
|
||||
await dlg.locator('input[autocomplete="current-password"]').fill('definitely-wrong-pass')
|
||||
await dlg.locator('input[autocomplete="new-password"]').first().fill('ANewPass#2026x')
|
||||
await dlg.locator('input[autocomplete="new-password"]').nth(1).fill('ANewPass#2026x')
|
||||
await dlg.locator('input[autocomplete="current-password"]').press('Enter')
|
||||
// 后端 401 "current password incorrect" → humanChangePasswordError 的分类文案。
|
||||
await expect(dlg.getByText('当前密码不正确')).toBeVisible({ timeout: 10_000 })
|
||||
})
|
||||
@@ -1,10 +1,12 @@
|
||||
// 双入口对拍的浏览器侧说明。CI 门禁在 backend command_pairs_test.go:
|
||||
// 新内置命令未写入 testdata/command-pairs.json 时 go test 失败。
|
||||
// 安装 Playwright 后可用 npx playwright test e2e/command-pairs.spec.ts 做人工抽查。
|
||||
// 人工抽查:PLAYWRIGHT_INCLUDE_COMMAND_PAIRS=1 npx playwright test e2e/command-pairs.playwright.ts
|
||||
// (scripts/e2e.sh 驱动的验收跑 auth-on 种子环境,本用例面向免登录演示环境,默认跳过。)
|
||||
import { test, expect } from '@playwright/test'
|
||||
|
||||
test('command menu and chat share builtin.help', async ({ page }) => {
|
||||
test.skip(!process.env.PLAYWRIGHT_BASE_URL, 'set PLAYWRIGHT_BASE_URL to run')
|
||||
test.skip(!process.env.PLAYWRIGHT_BASE_URL || !process.env.PLAYWRIGHT_INCLUDE_COMMAND_PAIRS,
|
||||
'set PLAYWRIGHT_BASE_URL and PLAYWRIGHT_INCLUDE_COMMAND_PAIRS to run')
|
||||
await page.goto(process.env.PLAYWRIGHT_BASE_URL!)
|
||||
await expect(page.getByText('帮助')).toBeVisible()
|
||||
})
|
||||
|
||||
@@ -0,0 +1,108 @@
|
||||
// 忘记密码唯一处置回归:管理员生成一次性登录密码 → 用户密码登录 → 强制改密
|
||||
//(one_time_password 门只要新密码 + 确认);
|
||||
// 用户行不再有恢复提案入口,登录页只保留用户名 + 密码,不提供一次性 Key 登录 tab。
|
||||
// 驱动:任意 auth-on 实例(PLAYWRIGHT_BASE_URL + E2E_PLAIN_BASE;
|
||||
// scripts/e2e.sh 第 4 阶段顺路覆盖,或对隔离实例直连——见 Dev 任务卡
|
||||
// feature/svc-login-recovery-flow 的真实浏览器验收记录)。
|
||||
import { test, expect, type Page } from '@playwright/test'
|
||||
|
||||
const ADMIN = process.env.E2E_ADMIN || 'e2e-admin'
|
||||
const ADMIN_BOOT = process.env.E2E_ADMIN_PASSWORD || 'E2eAdmin#2026'
|
||||
const ADMIN_PW = process.env.E2E_ADMIN_PASSWORD2 || 'E2eAdmin#2026b'
|
||||
const USER = process.env.E2E_LOGIN_KEY_USER || 'e2e-user'
|
||||
const USER_PW = process.env.E2E_LOGIN_KEY_PASSWORD2 || 'E2eUser#2026b'
|
||||
|
||||
test.skip(!(process.env.PLAYWRIGHT_BASE_URL && process.env.E2E_PLAIN_BASE),
|
||||
'set PLAYWRIGHT_BASE_URL + E2E_PLAIN_BASE (auth-on instance required)')
|
||||
|
||||
async function passwordLogin(page: Page, owner: string, password: string) {
|
||||
await page.goto('/')
|
||||
await page.getByPlaceholder('由管理员分配').fill(owner)
|
||||
await page.getByPlaceholder('初始密码或常用密码').fill(password)
|
||||
await page.getByRole('button', { name: '登录', exact: true }).click()
|
||||
}
|
||||
|
||||
/** 管理员登录;初始密码(must-change)则先完成受限设密再以新密码重登。
|
||||
* 初始密码单次有效:已跑过本用例的环境(boot 已被改掉)自动改用新密码。 */
|
||||
async function adminLogin(page: Page) {
|
||||
await passwordLogin(page, ADMIN, ADMIN_BOOT)
|
||||
// 门标题与提交按钮同名(设置新密码):用 heading 角色唯一定位,
|
||||
// getByText 双命中会触发 strict-mode 抛错被 catch 吞掉、误判 gated=false。
|
||||
let gate = page.getByRole('heading', { name: '设置新密码' })
|
||||
let gated = await gate.waitFor({ state: 'visible', timeout: 5_000 }).then(() => true).catch(() => false)
|
||||
if (!gated) {
|
||||
// boot 密码失败(此前运行已完成改密):换正式密码重登。
|
||||
const loginErr = await page.locator('.lg-err').waitFor({ state: 'visible', timeout: 3_000 }).then(() => true).catch(() => false)
|
||||
if (!loginErr) throw new Error('admin login neither gated nor errored')
|
||||
await passwordLogin(page, ADMIN, ADMIN_PW)
|
||||
gate = page.getByRole('heading', { name: '设置新密码' })
|
||||
gated = await gate.waitFor({ state: 'visible', timeout: 5_000 }).then(() => true).catch(() => false)
|
||||
}
|
||||
if (gated) {
|
||||
const pw = page.locator('.lg-card input[type="password"]')
|
||||
await pw.nth(0).fill(ADMIN_PW)
|
||||
await pw.nth(1).fill(ADMIN_PW)
|
||||
await page.getByRole('button', { name: '设置新密码', exact: true }).click()
|
||||
// 等设密事务完成再回登录:提交在途时点取消会登出受限会话、
|
||||
// 服务端按会话复验拒绝该次设密(产品正确行为,测试必须同步成功页)。
|
||||
await expect(page.getByRole('heading', { name: '密码已更新' })).toBeVisible({ timeout: 10_000 })
|
||||
await page.getByRole('button', { name: '返回登录', exact: true }).click()
|
||||
await passwordLogin(page, ADMIN, ADMIN_PW)
|
||||
}
|
||||
await expect(page.locator('.tsb-tool', { hasText: '代理' })).toBeVisible({ timeout: 15_000 })
|
||||
}
|
||||
|
||||
test('管理员生成一次性登录密码:登录后强制改密;登录页不提供 Key 登录', async ({ page }) => {
|
||||
// 全流程含多次 argon2 登录与两道门,30s 默认预算不够。
|
||||
test.setTimeout(120_000)
|
||||
// 1) 管理员进入用户管理,为目标用户生成一次性登录密码(明文仅显示一次)。
|
||||
await adminLogin(page)
|
||||
await page.locator('.tsb-user').click()
|
||||
await page.getByRole('button', { name: '系统管理…' }).click()
|
||||
const zone = page.getByRole('dialog', { name: '系统管理' })
|
||||
await expect(zone).toBeVisible()
|
||||
const row = zone.locator('tr', { hasText: USER })
|
||||
await expect(row.getByRole('button', { name: '恢复提案' })).toHaveCount(0)
|
||||
await row.getByRole('button', { name: '生成一次性登录密码' }).click()
|
||||
const oneTimePassword = zone.locator('input[aria-label="一次性密码"]')
|
||||
await expect(oneTimePassword).toBeVisible({ timeout: 10_000 })
|
||||
await expect(zone.getByText('使用后必须强制改密')).toBeVisible()
|
||||
const password = await oneTimePassword.inputValue()
|
||||
expect(password.length).toBeGreaterThan(0)
|
||||
|
||||
// 2) 管理员退出系统管理与登录态,回到登录页。
|
||||
//(一次性密码展示框内也有「关闭」;退出全屏层要点头部的「返回工作台」。)
|
||||
await zone.getByRole('button', { name: '返回工作台' }).click()
|
||||
await page.locator('.tsb-user').click()
|
||||
await page.getByRole('button', { name: '退出登录' }).click()
|
||||
await expect(page.getByRole('button', { name: '登录', exact: true })).toBeVisible({ timeout: 10_000 })
|
||||
|
||||
// 3) 用户使用一次性登录密码登录后进入 one_time_password 强制改密门:
|
||||
// 只填新密码 + 确认,不再要求当前密码。
|
||||
await passwordLogin(page, USER, password)
|
||||
const gate = page.locator('.lg-card')
|
||||
await expect(gate.getByText(`账号 ${USER}`)).toBeVisible({ timeout: 10_000 })
|
||||
await expect(gate.getByText('无需再次输入一次性密码')).toBeVisible()
|
||||
await expect(gate.locator('input[autocomplete="current-password"]')).toHaveCount(0)
|
||||
const pw = gate.locator('input[type="password"]')
|
||||
await expect(pw).toHaveCount(2)
|
||||
await pw.nth(0).fill(USER_PW)
|
||||
await pw.nth(1).fill(USER_PW)
|
||||
await gate.getByRole('button', { name: '设置新密码', exact: true }).click()
|
||||
|
||||
// 4) 成功页:提示用新密码登录,唯一出口回登录页。
|
||||
await expect(page.getByRole('heading', { name: '密码已更新' })).toBeVisible({ timeout: 10_000 })
|
||||
await page.getByRole('button', { name: '返回登录', exact: true }).click()
|
||||
await expect(page.getByRole('button', { name: '登录', exact: true })).toBeVisible()
|
||||
|
||||
// 5) 新密码登录进工作台。
|
||||
await passwordLogin(page, USER, USER_PW)
|
||||
await expect(page.locator('.tsb-tool', { hasText: '代理' })).toBeVisible({ timeout: 15_000 })
|
||||
|
||||
// 6) 登录页不再提供一次性 Key 登录入口。
|
||||
await page.locator('.tsb-user').click()
|
||||
await page.getByRole('button', { name: '退出登录' }).click()
|
||||
await expect(page.getByRole('button', { name: '登录', exact: true })).toBeVisible({ timeout: 10_000 })
|
||||
await expect(page.getByRole('tab', { name: '一次性登录 Key' })).toHaveCount(0)
|
||||
await expect(page.getByPlaceholder('alk_…')).toHaveCount(0)
|
||||
})
|
||||
@@ -0,0 +1,53 @@
|
||||
// 增量 2 验收(2026-10-12 诊断报告):普通基座(无 rdm.inspect.* 命令面)不展示
|
||||
// 「追溯审计」入口,且不发出任何 rdm.* 命令请求——消除「入口可达、进入即 400」。
|
||||
// 驱动:scripts/e2e.sh 第 4 阶段——RDM 组合验收跑完后,同一数据目录换基座 CLI
|
||||
//(agent-system serve,同源同 pin)服务,同一 preview 指向它,只跑本文件。
|
||||
// 环境契约与 rdm-audit.playwright.ts 一致(e2e.sh 注入)。
|
||||
import { test, expect, type Page } from '@playwright/test'
|
||||
|
||||
const OWNER = process.env.E2E_OWNER || 'e2e-auditor'
|
||||
const PASSWORD = process.env.E2E_PASSWORD || 'E2eAudit#2026'
|
||||
const PASSWORD2 = process.env.E2E_PASSWORD2 || 'E2eAudit#2026b'
|
||||
|
||||
// 仅第 4 阶段(普通基座)启用:RDM 组合主跑(第 3 阶段)扫全目录时本文件自跳过,
|
||||
// 否则「入口隐藏」断言会跑在入口本就可见的 RDM 组合上。
|
||||
test.skip(!(process.env.PLAYWRIGHT_BASE_URL && process.env.E2E_PLAIN_BASE),
|
||||
'set PLAYWRIGHT_BASE_URL + E2E_PLAIN_BASE (scripts/e2e.sh phase 4 drives this suite)')
|
||||
|
||||
// 与 rdm-audit spec 同一账号:若数据库仍是初始密码则先过强制改密门。
|
||||
async function login(page: Page) {
|
||||
await page.goto('/')
|
||||
await page.getByPlaceholder('由管理员分配').fill(OWNER)
|
||||
await page.getByPlaceholder('初始密码或常用密码').fill(PASSWORD)
|
||||
await page.getByRole('button', { name: '登录', exact: true }).click()
|
||||
const gate = page.getByText('修改密码')
|
||||
const gated = await gate.waitFor({ state: 'visible', timeout: 5_000 }).then(() => true).catch(() => false)
|
||||
if (gated) {
|
||||
const pwInputs = page.locator('.lg-card input[type="password"]')
|
||||
await pwInputs.nth(0).fill(PASSWORD)
|
||||
await pwInputs.nth(1).fill(PASSWORD2)
|
||||
await pwInputs.nth(2).fill(PASSWORD2)
|
||||
await page.getByRole('button', { name: '设置新密码并进入' }).click()
|
||||
} else {
|
||||
// 已改密(RDM 阶段完成):改用新密码重登。
|
||||
await page.getByPlaceholder('初始密码或常用密码').fill(PASSWORD2)
|
||||
await page.getByRole('button', { name: '登录', exact: true }).click()
|
||||
}
|
||||
}
|
||||
|
||||
test('普通基座:命令面无 rdm.inspect.* → 审计入口隐藏、无 rdm 请求', async ({ page }) => {
|
||||
const rdmRequests: string[] = []
|
||||
page.on('request', r => {
|
||||
if (r.url().includes('/api/commands/rdm.')) rdmRequests.push(r.url())
|
||||
})
|
||||
await login(page)
|
||||
// 登录成功标志:侧栏常驻「代理」与「文件」体系工具(均为无条件内置)。
|
||||
await expect(page.locator('.tsb-tool', { hasText: '代理' })).toBeVisible({ timeout: 15_000 })
|
||||
await expect(page.locator('.tsb-tool', { hasText: '文件' })).toBeVisible()
|
||||
// 能力探测(GET /api/commands)返回普通基座清单后,审计入口保持隐藏。
|
||||
await expect(page.locator('.tsb-tool', { hasText: '追溯审计' })).toHaveCount(0)
|
||||
await page.waitForTimeout(500)
|
||||
await expect(page.locator('.tsb-tool', { hasText: '追溯审计' })).toHaveCount(0)
|
||||
// 入口不存在则不应有任何 rdm.* 命令请求(原缺陷路径是进入即 400)。
|
||||
expect(rdmRequests).toEqual([])
|
||||
})
|
||||
@@ -0,0 +1,146 @@
|
||||
// U4 运行验收:真实浏览器走通项目追溯审计工作区(RdmAuditWorkspace 四入口)。
|
||||
// 驱动方:Dev 仓 scripts/e2e.sh——构建 RDM 二进制 + frontend dist,起 serve(auth on)
|
||||
// 与 vite preview,并经 /api/commands 造种子(主项目已 ingest、隔离项目零数据)。
|
||||
// 环境契约(e2e.sh 注入;缺省值与 e2e.sh 保持一致):
|
||||
// PLAYWRIGHT_BASE_URL 前端入口(默认 http://127.0.0.1:4173)
|
||||
// E2E_OWNER/E2E_PASSWORD 登录账号(域管理员+基座管理员)
|
||||
// E2E_PROJECT_MAIN 已 ingest 的主项目名
|
||||
// E2E_PROJECT_ISOLATED 零数据隔离项目名
|
||||
import { test, expect, type Page } from '@playwright/test'
|
||||
|
||||
const OWNER = process.env.E2E_OWNER || 'e2e-auditor'
|
||||
const PASSWORD = process.env.E2E_PASSWORD || 'E2eAudit#2026'
|
||||
const PASSWORD2 = process.env.E2E_PASSWORD2 || 'E2eAudit#2026b'
|
||||
const MAIN = process.env.E2E_PROJECT_MAIN || '审计演示项目'
|
||||
const ISOLATED = process.env.E2E_PROJECT_ISOLATED || '隔离检查项目'
|
||||
|
||||
test.skip(!process.env.PLAYWRIGHT_BASE_URL, 'set PLAYWRIGHT_BASE_URL (scripts/e2e.sh drives this suite)')
|
||||
|
||||
async function login(page: Page) {
|
||||
await page.goto('/')
|
||||
await expect(page.getByPlaceholder('由管理员分配')).toBeVisible()
|
||||
await page.getByPlaceholder('由管理员分配').fill(OWNER)
|
||||
// 首个用例用初始密码(触发强制改密门),后续用例用改后的新密码。
|
||||
await page.getByPlaceholder('初始密码或常用密码').fill(PASSWORD)
|
||||
await page.getByRole('button', { name: '登录', exact: true }).click()
|
||||
const gate = page.getByText('修改密码')
|
||||
const gated = await gate.waitFor({ state: 'visible', timeout: 5_000 }).then(() => true).catch(() => false)
|
||||
if (gated) {
|
||||
const pwInputs = page.locator('.lg-card input[type="password"]')
|
||||
await pwInputs.nth(0).fill(PASSWORD)
|
||||
await pwInputs.nth(1).fill(PASSWORD2)
|
||||
await pwInputs.nth(2).fill(PASSWORD2)
|
||||
await page.getByRole('button', { name: '设置新密码并进入' }).click()
|
||||
} else {
|
||||
// 已改密:改用新密码重登。
|
||||
await page.getByPlaceholder('初始密码或常用密码').fill(PASSWORD2)
|
||||
await page.getByRole('button', { name: '登录', exact: true }).click()
|
||||
}
|
||||
// 登录成功后侧栏体系工具出现「追溯审计」入口。
|
||||
await expect(page.locator('.tsb-tool', { hasText: '追溯审计' })).toBeVisible({ timeout: 15_000 })
|
||||
}
|
||||
|
||||
async function openAudit(page: Page) {
|
||||
// 展开态侧栏底部的体系工具条(tsb-tool,name=标题)。
|
||||
await page.locator('.tsb-tool', { hasText: '追溯审计' }).click()
|
||||
await expect(page.getByText('追溯审计').first()).toBeVisible()
|
||||
await expect(page.locator('.rdm-audit-project')).toBeVisible()
|
||||
}
|
||||
|
||||
test.describe.serial('U4 项目追溯审计工作区', () => {
|
||||
// 卡片按 label 精确定位(「章节」与「空缺章节」等子串互不干扰)。
|
||||
const card = (page: Page, label: string) =>
|
||||
page.locator('.rdm-audit-card').filter({ has: page.locator('.rdm-audit-card-label', { hasText: new RegExp(`^${label}$`) }) })
|
||||
|
||||
test('登录并打开工作区,概览计数与覆盖标注可读', async ({ page }) => {
|
||||
await login(page)
|
||||
await openAudit(page)
|
||||
// 概览:统计卡片 + 水位标注(数据完整性提示,不冒充实时)。
|
||||
await expect(page.locator('.rdm-audit-card')).toHaveCount(9)
|
||||
await expect(page.getByText(/截至水位 \d+/)).toBeVisible()
|
||||
// 主项目应有切片与章节(种子 structure 装载 + ingest 保证)。
|
||||
await expect(card(page, '切片').locator('.rdm-audit-card-num')).toHaveText(/[1-9]/)
|
||||
await expect(card(page, '章节')).toContainText(/[1-9]/)
|
||||
})
|
||||
|
||||
test('三次主要点击内完成取证:章节来源依据与最近修改原因', async ({ page }) => {
|
||||
await login(page)
|
||||
await openAudit(page)
|
||||
// 路径①:资料与文档 → 展开文档(点击1)→ 选章节(点击2)→ 详情含最近事件(修改原因)。
|
||||
// docs 树是层级结构:第一层是文档,章节在展开后的第二层。
|
||||
await page.getByRole('tab', { name: '资料与文档' }).click()
|
||||
await page.locator('.rdm-audit-tree-node').first().click()
|
||||
const sectionNode = page.locator('.rdm-audit-tree-children .rdm-audit-tree-node')
|
||||
.filter({ has: page.locator('.rdm-audit-tree-kind', { hasText: 'section' }) }).first()
|
||||
await expect(sectionNode).toBeVisible()
|
||||
await sectionNode.click()
|
||||
await expect(page.locator('.rdm-audit-detail')).toBeVisible()
|
||||
await expect(page.getByText('最近事件')).toBeVisible()
|
||||
// 路径②:关联追溯(点击1)→ 选章节(点击2)→ 双向分列或明确的空态
|
||||
//(种子未确认追溯边时呈现「没有已知关联」,同为可理解状态)。
|
||||
await page.getByRole('tab', { name: '关联追溯' }).click()
|
||||
await expect(page.locator('.rdm-audit-pick button')).not.toHaveCount(0)
|
||||
await page.locator('.rdm-audit-pick button').first().click()
|
||||
await expect(page.getByText('← 返回')).toBeVisible()
|
||||
await expect(
|
||||
page.getByText(/来源依据(\d+)/).or(page.getByText('没有已知关联')),
|
||||
).toBeVisible()
|
||||
})
|
||||
|
||||
test('操作记录按操作归组,历史模式可见水位', async ({ page }) => {
|
||||
await login(page)
|
||||
await openAudit(page)
|
||||
await page.getByRole('tab', { name: '操作记录' }).click()
|
||||
// 事件以单行或操作组呈现;种子项目必有 ingest 事件。
|
||||
await expect(
|
||||
page.locator('.rdm-audit-event').or(page.locator('.rdm-audit-opgroup')),
|
||||
).not.toHaveCount(0)
|
||||
// 历史模式:返回当前切换明确,无对象时输入提示可理解。
|
||||
await page.getByRole('button', { name: '历史模式' }).click()
|
||||
await expect(page.getByText(/截至 seq \d+/)).toBeVisible()
|
||||
await page.getByRole('button', { name: '← 返回当前' }).click()
|
||||
await expect(page.getByRole('button', { name: '历史模式' })).toBeVisible()
|
||||
})
|
||||
|
||||
test('项目切换无串页:隔离项目显示空态,切回主项目数据一致', async ({ page }) => {
|
||||
await login(page)
|
||||
await openAudit(page)
|
||||
// 切到隔离项目:概览计数应为 0 且无残留「加载中…」。
|
||||
await page.locator('.rdm-audit-project').selectOption({ label: ISOLATED })
|
||||
await expect(page.getByText('加载中…')).toHaveCount(0, { timeout: 10_000 })
|
||||
await expect(card(page, '切片').locator('.rdm-audit-card-num')).toHaveText('0')
|
||||
// 空态:文档树与时间线给出可理解提示。
|
||||
await page.getByRole('tab', { name: '资料与文档' }).click()
|
||||
await expect(page.getByText('暂无文档')).toBeVisible()
|
||||
await page.getByRole('tab', { name: '操作记录' }).click()
|
||||
await expect(page.getByText('暂无事件')).toBeVisible()
|
||||
// 立即切回主项目:标题与请求一致,数据回到非零(过期响应被丢弃,无串页)。
|
||||
await page.getByRole('tab', { name: '概览' }).click()
|
||||
await page.locator('.rdm-audit-project').selectOption({ label: MAIN })
|
||||
await expect(page.getByText('加载中…')).toHaveCount(0, { timeout: 10_000 })
|
||||
await expect(card(page, '切片').locator('.rdm-audit-card-num')).toHaveText(/[1-9]/)
|
||||
await expect(page.locator('.rdm-audit-project')).toHaveValue(
|
||||
await page.locator('.rdm-audit-project option', { hasText: MAIN }).getAttribute('value') ?? '',
|
||||
)
|
||||
})
|
||||
|
||||
test('概览导出:生成后显示水位与校验和,并可下载', async ({ page }) => {
|
||||
await login(page)
|
||||
await openAudit(page)
|
||||
const exportBox = page.locator('.rdm-audit-export')
|
||||
await expect(exportBox).toBeVisible()
|
||||
await exportBox.getByLabel('导出类型').selectOption('cgraph-docx')
|
||||
await exportBox.getByRole('button', { name: '生成', exact: true }).click()
|
||||
const draft = exportBox.getByRole('button', { name: '生成草稿' })
|
||||
if (await draft.waitFor({ state: 'visible', timeout: 8_000 }).then(() => true).catch(() => false)) {
|
||||
await draft.click()
|
||||
}
|
||||
await expect(exportBox.getByText(/水位 \d+/)).toBeVisible({ timeout: 15_000 })
|
||||
await expect(exportBox.getByText(/sha256 [0-9a-f]{64}/)).toBeVisible()
|
||||
await expect(exportBox.getByText(/有效期/)).toBeVisible()
|
||||
const download = page.waitForEvent('download')
|
||||
await exportBox.getByRole('button', { name: '下载' }).click()
|
||||
const file = await download
|
||||
expect(file.suggestedFilename()).toMatch(/\.docx$/)
|
||||
})
|
||||
})
|
||||
@@ -0,0 +1,182 @@
|
||||
// I4 组合验收(Playwright):文档驾驶舱七场景(rollout §3.I4 最小场景集)。
|
||||
// 驱动方:Dev 仓 scripts/e2e.sh——构建 RDM 二进制(含 I1/I3 命令面)+ frontend dist,
|
||||
// 种子:审计演示项目(rdm-self + cockpit-e2e 结构装载;两个章节经草稿流落正文;
|
||||
// 一个章节留空;第二个账号 e2e-reader 不入项目做权限负例)。
|
||||
// 环境契约与 rdm-audit.playwright.ts 一致;PLAYWRIGHT_BASE_URL 未设置时整组跳过。
|
||||
import { test, expect, type Page } from '@playwright/test'
|
||||
|
||||
const OWNER = process.env.E2E_OWNER || 'e2e-auditor'
|
||||
const PASSWORD = process.env.E2E_PASSWORD2 || 'E2eAudit#2026b'
|
||||
const READER = process.env.E2E_READER || 'e2e-reader'
|
||||
const READER_PASSWORD = process.env.E2E_READER_PASSWORD || 'E2eReader#2026'
|
||||
const MAIN = process.env.E2E_PROJECT_MAIN || '审计演示项目'
|
||||
|
||||
test.skip(!process.env.PLAYWRIGHT_BASE_URL, 'set PLAYWRIGHT_BASE_URL (scripts/e2e.sh drives this suite)')
|
||||
|
||||
async function login(page: Page, user: string, password: string) {
|
||||
await page.goto('/')
|
||||
await expect(page.getByPlaceholder('由管理员分配')).toBeVisible()
|
||||
await page.getByPlaceholder('由管理员分配').fill(user)
|
||||
await page.getByPlaceholder('初始密码或常用密码').fill(password)
|
||||
await page.getByRole('button', { name: '登录', exact: true }).click()
|
||||
}
|
||||
|
||||
// 侧栏入口两种形态:常规侧栏按钮(.tsb-tool);窄宽紧凑布局换图标栏
|
||||
// (.icon-only 内 title 以「文档驾驶舱」开头的按钮)——入口都可达。
|
||||
function cockpitEntry(page: Page) {
|
||||
return page.locator('.tsb-tool', { hasText: '文档驾驶舱' })
|
||||
.or(page.locator('.icon-only button[title^="文档驾驶舱"]')).first()
|
||||
}
|
||||
|
||||
async function loginOwner(page: Page) {
|
||||
await login(page, OWNER, PASSWORD)
|
||||
// 登录后身份纪元与能力探针仍可能各跳一次;应用在身份变更时会关闭已开
|
||||
// 工作区——等落定再点入口,避免 overlay 被身份刷新关掉(竞态实测)。
|
||||
await page.waitForLoadState('networkidle').catch(() => {})
|
||||
await page.waitForTimeout(1_500)
|
||||
}
|
||||
|
||||
async function openCockpit(page: Page) {
|
||||
// 窄宽是单窗格布局:登录后默认「对话」窗格,先切到「上下文」窗格。
|
||||
if (!(await cockpitEntry(page).isVisible().catch(() => false))) {
|
||||
await page.getByRole('button', { name: '打开上下文' }).click()
|
||||
}
|
||||
await cockpitEntry(page).click()
|
||||
await expect(page.locator('.cockpit-project')).toBeVisible({ timeout: 15_000 })
|
||||
// 默认选中首个项目(种子=审计演示项目)。
|
||||
await expect(page.locator('.cockpit-stats')).toBeVisible({ timeout: 15_000 })
|
||||
}
|
||||
|
||||
async function openReaderOnDoc(page: Page, title: string) {
|
||||
await page.locator('.cockpit-tree-title', { hasText: title }).first().click()
|
||||
await page.getByRole('button', { name: '在阅读器中打开' }).click()
|
||||
await expect(page.locator('.cockpit-reader')).toBeVisible()
|
||||
}
|
||||
|
||||
test.describe.serial('I4 文档驾驶舱组合验收', () => {
|
||||
// 场景 1:首次进入项目——统计带、结构树、全景可见(DV-R01/R02)。
|
||||
test('1 首屏:统计、树、全景可见且统计可判读', async ({ page }) => {
|
||||
await loginOwner(page)
|
||||
await openCockpit(page)
|
||||
// placeholder
|
||||
await expect(page.locator('.cockpit-stat', { hasText: '完成度' })).toBeVisible()
|
||||
await expect(page.locator('.cockpit-stat', { hasText: '文档' })).toBeVisible()
|
||||
// 空 vs 不可算不得互相冒充:有数据项目的空缺计数显示数字。
|
||||
await expect(page.locator('.cockpit-stat', { hasText: '空缺节点' }).locator('.cockpit-stat-num')).toHaveText(/^\d+$/)
|
||||
await expect(page.locator('.cockpit-tree-title', { hasText: '验证主体报告' }).first()).toBeVisible()
|
||||
await expect(page.getByText('文档概览')).toBeVisible()
|
||||
await expect(page.locator('.cockpit-snap')).toContainText(/快照 wm:\d+/)
|
||||
})
|
||||
|
||||
// 场景 2:文档→章节,全景与阅读器双向定位(DV-R03)。
|
||||
test('2 定位:树选章节→阅读器正文;返回全景仍同一节点', async ({ page }) => {
|
||||
await loginOwner(page)
|
||||
await openCockpit(page)
|
||||
// 展开目标文档(树按标题排序,branch 作用域防跨文档串扰),点「概述」。
|
||||
const branch = page.locator('.cockpit-tree-branch', { hasText: '验证主体报告' }).first()
|
||||
await branch.locator('.cockpit-tree-caret').click()
|
||||
const sec = branch.locator('.cockpit-tree-title', { hasText: '概述' }).first()
|
||||
await expect(sec).toBeVisible()
|
||||
sec.click()
|
||||
await expect(page.locator('.cockpit-nodehead')).toBeVisible()
|
||||
// 全景→阅读器:同一 nodeRef(阅读器显示该节标题与正文)。
|
||||
await page.getByRole('button', { name: '在阅读器中打开' }).click()
|
||||
await expect(page.locator('.cockpit-reader')).toBeVisible()
|
||||
await expect(page.locator('.cockpit-nodetitle', { hasText: '概述' })).toBeVisible()
|
||||
const body = page.locator('.cockpit-reader-para', { hasText: '本报告' }).first()
|
||||
await expect(body).toBeVisible()
|
||||
// 阅读器→全景:返回后仍是选中节点(节点头仍在)。
|
||||
await page.getByRole('button', { name: '← 返回全景' }).click()
|
||||
await expect(page.locator('.cockpit-nodehead')).toBeVisible()
|
||||
})
|
||||
|
||||
// 场景 3:四面板展开并正确显示计数;受限与空态诚实(DV-R04)。
|
||||
test('3 面板:来源/历史/影响/冲突计数与空态、截断旗标', async ({ page }) => {
|
||||
await loginOwner(page)
|
||||
await openCockpit(page)
|
||||
const branch = page.locator('.cockpit-tree-branch', { hasText: '验证主体报告' }).first()
|
||||
await branch.locator('.cockpit-tree-caret').click()
|
||||
await branch.locator('.cockpit-tree-title', { hasText: '概述' }).first().click()
|
||||
const panel = page.locator('.cockpit-panel')
|
||||
await expect(panel).toBeVisible()
|
||||
// 来源:草稿落版本挂了依据切片(种子经 ingest 提供)。
|
||||
await panel.getByRole('tab', { name: '内容来源' }).click()
|
||||
await expect(panel.locator('.cockpit-panel-count')).toContainText(/来源 \d+ 条/)
|
||||
// 历史:已提交事件(structure + draft 链)。
|
||||
await panel.getByRole('tab', { name: '修改历史' }).click()
|
||||
await expect(panel.locator('.cockpit-panel-count')).toContainText('已提交事件')
|
||||
await expect(panel.locator('.cockpit-panel-row').first()).toBeVisible()
|
||||
// 影响:一跳;空/计数二态都诚实。
|
||||
await panel.getByRole('tab', { name: '影响对象' }).click()
|
||||
await expect(panel.locator('.cockpit-panel-count')).toContainText(/影响 \d+ 项/)
|
||||
// 冲突:种子无开放碰撞 → 明确「无开放冲突」而非空白。
|
||||
await panel.getByRole('tab', { name: '冲突与风险' }).click()
|
||||
await expect(panel.getByText('无开放冲突')).toBeVisible()
|
||||
// 版本块(I3):当前版本+差异折叠入口可见。
|
||||
await expect(page.locator('.cockpit-versions-toggle')).toBeVisible()
|
||||
})
|
||||
|
||||
// 场景 4:后台变更后所有投影一致(DV-R05)——测试经 API 采纳新版本,
|
||||
// 驾驶舱刷新后统计水位/树时间/详情版本块同步前进。
|
||||
test('4 一致性:API 采纳新版本后,刷新入口与各投影同步', async ({ page }) => {
|
||||
await loginOwner(page)
|
||||
await openCockpit(page)
|
||||
const branch4 = page.locator('.cockpit-tree-branch', { hasText: '验证主体报告' }).first()
|
||||
await branch4.locator('.cockpit-tree-caret').click()
|
||||
await branch4.locator('.cockpit-tree-title', { hasText: '设计说明' }).first().click()
|
||||
const snapBefore = await page.locator('.cockpit-snap').innerText()
|
||||
// 通过应用自身 API 落一个已提交变更(需求账本新增条目,唯一键防幂等跳过;
|
||||
// 采纳走高危确认卡、服务端不允许客户端伪造 Confirmed,故用低危提交面驱动)。
|
||||
await page.request.post('/api/commands/rdm.reqs.import', {
|
||||
data: { params: { projectId: await page.locator('.cockpit-project').inputValue(),
|
||||
items: [{ kind: 'UR', title: `UR-PROBE-${Date.now()} 一致性探针`, statement: '刷新一致性驱动条目', source: 'e2e-probe' }] } },
|
||||
failOnStatusCode: false,
|
||||
})
|
||||
await page.getByRole('button', { name: '刷新' }).click()
|
||||
await expect(page.locator('.cockpit-snap')).not.toHaveText(snapBefore)
|
||||
// 版本块前进:出现新版本条目。
|
||||
await expect(page.locator('.cockpit-versions-toggle')).toContainText(/版本 v\d+/)
|
||||
})
|
||||
|
||||
// 场景 5:断线/失败保留旧快照并给出重试(DV-R08)——page.route 掐断命令面。
|
||||
test('5 失败:命令面断连时保留旧快照并出现重试入口', async ({ page }) => {
|
||||
await loginOwner(page)
|
||||
await openCockpit(page)
|
||||
await expect(page.locator('.cockpit-stats')).toBeVisible()
|
||||
// 掐断后续命令面:切换项目触发重取 → 失败横幅 + 旧内容保留。
|
||||
await page.route('**/api/commands/rdm.cockpit.**', route => route.abort())
|
||||
await page.locator('.cockpit-refresh').click()
|
||||
await expect(page.locator('.cockpit-banner-err')).toBeVisible()
|
||||
await expect(page.locator('.cockpit-stats')).toBeVisible() // 旧快照未被清空
|
||||
await page.unroute('**/api/commands/rdm.cockpit.**')
|
||||
await page.locator('.cockpit-refresh').click()
|
||||
await expect(page.locator('.cockpit-banner-err')).toBeHidden()
|
||||
})
|
||||
|
||||
// 场景 6:权限负例——非成员账号看不到项目(无项目诚实空态;不泄露存在性)。
|
||||
test('6 权限:非成员账号无项目可见', async ({ page }) => {
|
||||
await login(page, READER, READER_PASSWORD)
|
||||
await page.locator('.tsb-tool', { hasText: '文档驾驶舱' }).click()
|
||||
await expect(page.getByText('暂无可见研发项目')).toBeVisible({ timeout: 15_000 })
|
||||
await expect(page.locator('.cockpit-tree-title', { hasText: '验证主体报告' })).toHaveCount(0)
|
||||
})
|
||||
|
||||
// 场景 7:窄屏、键盘、减少动效(DV-R07)。
|
||||
test('7 可用性:390 宽无横向溢出、键盘可达、减少动效可用', async ({ page }) => {
|
||||
await page.emulateMedia({ reducedMotion: 'reduce' })
|
||||
await page.setViewportSize({ width: 390, height: 844 })
|
||||
await loginOwner(page)
|
||||
await openCockpit(page)
|
||||
// 无横向溢出。
|
||||
const overflow = await page.evaluate(() => document.documentElement.scrollWidth - document.documentElement.clientWidth)
|
||||
expect(overflow).toBeLessThanOrEqual(1)
|
||||
// 键盘:统计卡/树行可聚焦(tab 序含驾驶舱交互件)。
|
||||
await page.locator('.cockpit-tree-title').first().focus()
|
||||
await expect(page.locator('.cockpit-tree-title').first()).toBeFocused()
|
||||
// 18px 大字(html font-size 注入)不破坏统计带布局。
|
||||
await page.addStyleTag({ content: 'html{font-size:18px !important}' })
|
||||
await expect(page.locator('.cockpit-stats')).toBeVisible()
|
||||
const overflowBig = await page.evaluate(() => document.documentElement.scrollWidth - document.documentElement.clientWidth)
|
||||
expect(overflowBig).toBeLessThanOrEqual(8)
|
||||
})
|
||||
})
|
||||
@@ -0,0 +1,101 @@
|
||||
// 文档职责三视图:确定性 HTTP,不连接真实账号或数据库。
|
||||
import { test, expect, type Page } from '@playwright/test'
|
||||
|
||||
test.skip(!process.env.PLAYWRIGHT_BASE_URL, 'set PLAYWRIGHT_BASE_URL to an isolated frontend server')
|
||||
|
||||
function deferred() {
|
||||
let resolve!: () => void
|
||||
const promise = new Promise<void>(ok => { resolve = ok })
|
||||
return { promise, resolve }
|
||||
}
|
||||
|
||||
async function dutiesPage(page: Page) {
|
||||
const writes: { command: string; params: Record<string, unknown> }[] = []
|
||||
const holds = new Map<string, { started: ReturnType<typeof deferred>; release: ReturnType<typeof deferred> }>()
|
||||
let generation = 0
|
||||
const commands = ['rdm.project.member.list', 'rdm.duty.matrix', 'rdm.duty.preview',
|
||||
'rdm.review.assign.doc', 'rdm.review.assign.doc.batch', 'rdm.duty.legacy.scan', 'rdm.duty.legacy.apply']
|
||||
await page.route('**/api/**', async route => {
|
||||
const request = route.request()
|
||||
const path = new URL(request.url()).pathname
|
||||
let body: unknown = []
|
||||
if (path === '/api/health') body = { ok: true }
|
||||
else if (path === '/api/me') body = { owner: 'alice', name: 'Alice', auth: true, isAdmin: true }
|
||||
else if (path === '/api/projects') body = [{ id: 'host-1', name: '职责测试项目', createdAt: '', updatedAt: '',
|
||||
settings: { 'rdm.projectId': 'domain-7', 'rdm.state': 'ready' } }]
|
||||
else if (path === '/api/settings') body = { schema: [], defaults: {}, user: {}, project: {} }
|
||||
else if (path === '/api/commands') body = commands.map(id => ({ id, enabled: true }))
|
||||
else if (path.startsWith('/api/commands/')) {
|
||||
const command = decodeURIComponent(path.substring('/api/commands/'.length))
|
||||
const params = request.postDataJSON().params as Record<string, unknown>
|
||||
expect(params.projectId).toBe('domain-7')
|
||||
const hold = holds.get(command)
|
||||
if (hold) { hold.started.resolve(); await hold.release.promise }
|
||||
const author = generation === 0 ? 'alice' : 'bob'
|
||||
if (command === 'rdm.duty.matrix') {
|
||||
body = { payload: {
|
||||
canAssign: true,
|
||||
docs: [{ docId: 'doc-A', code: 'A', title: '文档A', typeKey: 'design', stage: 'BD', dutyVersion: 1, authors: 1, reviewers: 1, approvers: 1, conflicts: 0, legacySectionOverrides: 0 }],
|
||||
members: ['alice', 'bob', 'carol'].map(owner => ({ owner, role: 'member', valid: true, canAuthor: true, canReview: true, canApprove: true })),
|
||||
cells: [
|
||||
{ docId: 'doc-A', owner: 'alice', duty: author === 'alice' ? 'author' : 'none' },
|
||||
{ docId: 'doc-A', owner: 'bob', duty: author === 'bob' ? 'author' : 'reviewer' },
|
||||
{ docId: 'doc-A', owner: 'carol', duty: 'approver' },
|
||||
],
|
||||
} }
|
||||
} else if (command === 'rdm.duty.preview') {
|
||||
writes.push({ command, params })
|
||||
body = { payload: { ok: true, docs: [{ docId: 'doc-A', title: '文档A', replacedAuthor: 'alice' }] } }
|
||||
} else if (command === 'rdm.duty.legacy.scan') {
|
||||
body = { payload: { findings: [{ docId: 'doc-A', title: '文档A', sectionTitle: '范围', kind: 'ambiguous' }] } }
|
||||
} else {
|
||||
writes.push({ command, params })
|
||||
generation += 1
|
||||
body = { payload: { applied: 1 } }
|
||||
}
|
||||
} else if (path.endsWith('/cards')) body = { cards: [] }
|
||||
await route.fulfill({ contentType: 'application/json', body: JSON.stringify(body) })
|
||||
})
|
||||
await page.goto('/')
|
||||
await page.getByRole('button', { name: '项目设置', exact: true }).click()
|
||||
await page.getByRole('tab', { name: '文档职责', exact: true }).click()
|
||||
await expect(page.getByText('本页只分配已有文档的职责,不创建或生成文档。')).toBeVisible()
|
||||
return { writes, hold(command: string) {
|
||||
const pending = { started: deferred(), release: deferred() }
|
||||
holds.set(command, pending)
|
||||
return pending
|
||||
} }
|
||||
}
|
||||
|
||||
test('three views share one draft and do not offer review actions', async ({ page }) => {
|
||||
const fixture = await dutiesPage(page)
|
||||
await page.getByLabel('选择成员').selectOption('bob')
|
||||
await page.getByLabel('bob 在 文档A 的职责').selectOption({ label: '编制(将替换alice)' })
|
||||
await page.getByRole('tab', { name: '按文档' }).click()
|
||||
await page.getByLabel('选择文档').selectOption('doc-A')
|
||||
await page.getByLabel('alice 在 文档A 的职责').selectOption('审核')
|
||||
await expect(page.getByLabel('bob 在 文档A 的职责')).toHaveValue('author')
|
||||
await page.getByRole('tab', { name: '矩阵' }).click()
|
||||
await expect(page.getByLabel('bob 在 文档A 的职责')).toHaveValue('author')
|
||||
await expect(page.getByRole('button', { name: /提交|审核通过|驳回|终批|生成|新建文档/ })).toHaveCount(0)
|
||||
await page.getByRole('button', { name: '保存职责' }).click()
|
||||
await expect.poll(() => fixture.writes.map(item => item.command)).toEqual(['rdm.duty.preview', 'rdm.review.assign.doc.batch'])
|
||||
})
|
||||
|
||||
test('a stale matrix response does not replace the current draft', async ({ page }) => {
|
||||
const fixture = await dutiesPage(page)
|
||||
await page.getByLabel('选择成员').selectOption('alice')
|
||||
const held = fixture.hold('rdm.duty.matrix')
|
||||
await page.getByLabel('筛选文档名称或编号').fill('文档A')
|
||||
await held.started.promise
|
||||
await page.getByLabel('alice 在 文档A 的职责').selectOption('审核')
|
||||
held.release.resolve()
|
||||
await expect(page.getByLabel('alice 在 文档A 的职责')).toHaveValue('reviewer')
|
||||
})
|
||||
|
||||
test('a narrow viewport points away from the full matrix', async ({ page }) => {
|
||||
await dutiesPage(page)
|
||||
await page.setViewportSize({ width: 390, height: 800 })
|
||||
await page.getByRole('tab', { name: '矩阵' }).click()
|
||||
await expect(page.getByText('当前宽度放不下成员×文档矩阵。请使用“按人员”或“按文档”。')).toBeVisible()
|
||||
})
|
||||
@@ -0,0 +1,107 @@
|
||||
// Isolated browser component regression: actual React workspace, deliberately deferred API responses.
|
||||
// This checks client request ownership, not server authorization or business acceptance.
|
||||
import { test, expect, type Page } from '@playwright/test'
|
||||
|
||||
test.skip(!process.env.PLAYWRIGHT_COMPONENT_BASE_URL, 'requires the isolated Vite component test server')
|
||||
test.use({ baseURL: process.env.PLAYWRIGHT_COMPONENT_BASE_URL })
|
||||
|
||||
async function mount(page: Page, delayed: string) {
|
||||
const index = await page.request.get('/')
|
||||
const html = (await index.text()).replace(/<script[^>]+src="\/src\/main\.tsx[^" ]*"[^>]*><\/script>/, '')
|
||||
// Let Vite prepare ReactDOM before requesting its optimized module directly.
|
||||
await page.request.get('/src/main.tsx')
|
||||
await page.route('**/__export_test', route => route.fulfill({ contentType: 'text/html',
|
||||
body: html }))
|
||||
await page.goto('/__export_test')
|
||||
await page.waitForFunction(() => typeof (window as any).$RefreshReg$ === 'function')
|
||||
await page.evaluate(async delayed => {
|
||||
const load = (path: string) => import(/* @vite-ignore */ path)
|
||||
const { default: React } = await load('/node_modules/.vite/deps/react.js')
|
||||
const { default: ReactDOM } = await load('/node_modules/.vite/deps/react-dom_client.js')
|
||||
const { RdmAuditWorkspace } = await load('/src/components/RdmAuditWorkspace.tsx')
|
||||
const { api } = await load('/src/api.ts')
|
||||
const { auth } = await load('/src/auth.ts')
|
||||
const { store } = await load('/src/store.ts')
|
||||
const { RDM_AUDIT_COMMANDS, RDM_EXPORT_COMMANDS } = await load('/src/workspaces.ts')
|
||||
const calls: { command: string; params: any }[] = []
|
||||
let actor = 'alice'
|
||||
const pending: (() => void)[] = []
|
||||
let downloads = 0
|
||||
URL.createObjectURL = () => { downloads++; return 'blob:export-test' }
|
||||
URL.revokeObjectURL = () => {}
|
||||
HTMLAnchorElement.prototype.click = () => {}
|
||||
api.listPlugins = async () => []
|
||||
api.listWorkspaces = async () => []
|
||||
api.listCommands = async () => [...RDM_AUDIT_COMMANDS, ...RDM_EXPORT_COMMANDS].map(id => ({ id, enabled: true }))
|
||||
api.adminZoneSections = async () => []
|
||||
api.getSettings = async () => ({ user: {} })
|
||||
api.rdmCommand = async (command: string, params: any = {}) => {
|
||||
calls.push({ command, params })
|
||||
const result = command === 'rdm.inspect.capabilities'
|
||||
? { actor, crossProject: false, projects: ['A', 'B'].map(projectId => ({ projectId, name: actor + projectId, canAudit: true })) }
|
||||
: command === 'rdm.inspect.summary'
|
||||
? { projectId: params.projectId, counts: {}, watermark: 7 }
|
||||
: command === 'rdm.inspect.export.create'
|
||||
? { exportId: params.projectId + '-report', watermark: 7, sha256: 'abc', fileName: 'report.docx' }
|
||||
: command === 'rdm.inspect.export.status'
|
||||
? { expiresAt: '2099-01-01', watermark: 7, sha256: 'abc' }
|
||||
: { fileName: 'report.docx', mime: 'application/octet-stream', dataB64: 'QQ==', sha256: 'abc' }
|
||||
if (command === delayed && params.projectId === 'A') {
|
||||
await new Promise<void>(resolve => pending.push(resolve))
|
||||
}
|
||||
return result
|
||||
}
|
||||
await store.refreshPlugins()
|
||||
const root = ReactDOM.createRoot(document.getElementById('root')!)
|
||||
root.render(React.createElement(RdmAuditWorkspace))
|
||||
;(window as any).exportTest = { calls, release: () => pending.splice(0).forEach(resolve => resolve()),
|
||||
downloads: () => downloads, identity: async () => { actor = 'bob'; auth.beginSession(); await store.refreshPlugins() },
|
||||
unmount: () => root.unmount() }
|
||||
}, delayed)
|
||||
await expect(page.locator('.rdm-audit-export')).toBeVisible()
|
||||
}
|
||||
async function release(page: Page) {
|
||||
await page.evaluate(async () => { (window as any).exportTest.release(); await new Promise(resolve => setTimeout(resolve, 0)) })
|
||||
}
|
||||
const generate = (page: Page) => page.getByRole('button', { name: '生成', exact: true }).click()
|
||||
|
||||
for (const stage of ['create', 'status']) {
|
||||
test(`ignores old ${stage} response after project A -> B -> A`, async ({ page }) => {
|
||||
await mount(page, 'rdm.inspect.export.' + stage)
|
||||
await generate(page)
|
||||
await expect.poll(() => page.evaluate(stage => (window as any).exportTest.calls
|
||||
.some((c: any) => c.command === 'rdm.inspect.export.' + stage), stage)).toBe(true)
|
||||
await page.getByLabel('选择项目').selectOption('B')
|
||||
await expect(page.locator('.rdm-audit-export')).toBeVisible()
|
||||
await page.getByLabel('选择项目').selectOption('A')
|
||||
await expect(page.locator('.rdm-audit-export')).toBeVisible()
|
||||
await release(page)
|
||||
await expect(page.getByRole('button', { name: '下载', exact: true })).toHaveCount(0)
|
||||
if (stage === 'create') expect(await page.evaluate(() => (window as any).exportTest.calls
|
||||
.filter((c: any) => c.command === 'rdm.inspect.export.status').length)).toBe(0)
|
||||
await expect(page.getByRole('button', { name: '生成', exact: true })).toBeEnabled()
|
||||
})
|
||||
}
|
||||
for (const change of ['project', 'identity', 'unmount']) {
|
||||
test(`suppresses delayed download after ${change} change`, async ({ page }) => {
|
||||
await mount(page, 'rdm.inspect.export.download')
|
||||
await generate(page)
|
||||
await page.getByRole('button', { name: '下载', exact: true }).click()
|
||||
if (change === 'project') {
|
||||
await page.getByLabel('选择项目').selectOption('B')
|
||||
await expect(page.locator('.rdm-audit-export')).toBeVisible()
|
||||
} else if (change === 'identity') {
|
||||
await page.evaluate(() => (window as any).exportTest.identity())
|
||||
await expect(page.getByLabel('选择项目').locator('option').first()).toHaveText('bobA')
|
||||
} else await page.evaluate(() => (window as any).exportTest.unmount())
|
||||
await release(page)
|
||||
expect(await page.evaluate(() => (window as any).exportTest.downloads())).toBe(0)
|
||||
})
|
||||
}
|
||||
test('current identity can generate and download normally', async ({ page }) => {
|
||||
await mount(page, '')
|
||||
await generate(page)
|
||||
await page.getByRole('button', { name: '下载', exact: true }).click()
|
||||
await expect.poll(() => page.evaluate(() => (window as any).exportTest.downloads())).toBe(1)
|
||||
await expect(page.locator('.rdm-audit-export-result')).toContainText('水位 7')
|
||||
})
|
||||
@@ -0,0 +1,60 @@
|
||||
import { expect, test } from '@playwright/test'
|
||||
import type { Conversation, SurfaceMeta, SurfaceSnapshot } from '../src/contracts'
|
||||
|
||||
test.skip(!process.env.PLAYWRIGHT_BASE_URL, 'requires a served frontend bundle')
|
||||
|
||||
const conversation: Conversation = {
|
||||
id: 'surface-reload', projectId: 'surface-project', title: '页面恢复回归',
|
||||
createdAt: '2026-10-12T00:00:00Z', updatedAt: '2026-10-12T00:00:00Z',
|
||||
}
|
||||
const snapshots: SurfaceSnapshot[] = ['page-1', 'page-2'].map((surfaceId, i) => ({
|
||||
identity: { surfaceId, owner: 'fixture', pluginId: 'generative-ui', conversationId: conversation.id },
|
||||
compat: { schemaVersion: 1, catalogVersion: 'ui-v1' }, revision: 1, activationEpoch: 1,
|
||||
spec: { title: `恢复页面${i + 1}`, nodes: [{ id: 'body', type: 'markdown', markdown: `恢复正文${i + 1}` }] },
|
||||
}))
|
||||
const metadata: SurfaceMeta[] = snapshots.map(s => ({
|
||||
surfaceId: s.identity.surfaceId, title: s.spec.title, pluginId: s.identity.pluginId,
|
||||
revision: s.revision, conversationId: conversation.id, updatedAt: conversation.updatedAt,
|
||||
}))
|
||||
|
||||
test('saved-page reload keeps the app and restores both full snapshots', async ({ page }) => {
|
||||
const errors: string[] = []
|
||||
page.on('pageerror', e => errors.push(e.message))
|
||||
await page.addInitScript(({ id }) => {
|
||||
localStorage.setItem('as.conv', id)
|
||||
localStorage.setItem('as.ui', JSON.stringify({ rightTab: 'files', filesView: 'preview', rightCollapsed: false }))
|
||||
}, { id: conversation.id })
|
||||
|
||||
// Replay the two distinct server contracts through the real app. Intercept all
|
||||
// API requests so this regression can run against a live bundle without writes.
|
||||
await page.route('**/api/**', async route => {
|
||||
const request = route.request()
|
||||
const path = new URL(request.url()).pathname
|
||||
if (request.method() !== 'GET') return route.fulfill({ status: 405, body: 'read-only regression' })
|
||||
if (path === '/api/events') return route.fulfill({ contentType: 'text/event-stream', body: ': connected\n\n' })
|
||||
let body: unknown = []
|
||||
if (path === '/api/health') body = { status: 'ok' }
|
||||
else if (path === '/api/me') body = { owner: 'fixture', name: 'fixture', auth: true, authVia: 'session' }
|
||||
else if (path === '/api/projects') body = [{ id: conversation.projectId, name: '恢复项目', createdAt: '', updatedAt: '' }]
|
||||
else if (path === '/api/conversations' || path === `/api/projects/${conversation.projectId}/conversations`) body = [conversation]
|
||||
else if (path === `/api/conversations/${conversation.id}`) body = { conversation, messages: [], runs: [], activeHitl: [], lastSeq: 0 }
|
||||
else if (path === `/api/conversations/${conversation.id}/surfaces` || path === `/api/projects/${conversation.projectId}/surfaces`) body = metadata
|
||||
else if (path.startsWith('/api/surfaces/')) {
|
||||
body = snapshots.find(s => s.identity.surfaceId === path.split('/').at(-1))
|
||||
} else if (path.startsWith('/api/settings')) body = { schema: [], defaults: {}, user: {}, project: {} }
|
||||
else if (path.endsWith('/plan') || path.endsWith('/todos')) body = null
|
||||
await route.fulfill({ contentType: 'application/json', body: JSON.stringify(body) })
|
||||
})
|
||||
|
||||
await page.goto('/')
|
||||
await expect(page.locator('.preview-pane .surface-view-title')).toHaveText('恢复页面1')
|
||||
await expect(page.locator('.preview-pane')).toContainText('恢复正文1')
|
||||
await page.reload()
|
||||
await expect(page.locator('.preview-pane .surface-view-title')).toHaveText('恢复页面1')
|
||||
await page.getByRole('button', { name: '返回文件列表' }).click()
|
||||
await expect(page.locator('[data-surface-row]')).toHaveCount(2)
|
||||
await page.locator('[data-surface-row="page-2"]').click()
|
||||
await expect(page.locator('.preview-pane .surface-view-title')).toHaveText('恢复页面2')
|
||||
await expect(page.locator('.preview-pane')).toContainText('恢复正文2')
|
||||
expect(errors).toEqual([])
|
||||
})
|
||||
@@ -0,0 +1,55 @@
|
||||
// U7 浏览器点验(补录):R1–R8 用户可见流程——在实际 8788 入口(React 内嵌组合
|
||||
// 产物)以已激活账号登录,点验体系工具入口、审计工作区、项目设置三页签(成员/
|
||||
// 文档职责·整文审签/项目权限矩阵)与系统管理 RDM 角色分区。
|
||||
// 驱动:PLAYWRIGHT_BASE_URL=http://127.0.0.1:8788 + 已激活账号(无 must-change 门)。
|
||||
import { test, expect, type Page } from '@playwright/test'
|
||||
|
||||
const OWNER = process.env.E2E_OWNER || 'u7-creator'
|
||||
const PASSWORD = process.env.E2E_PASSWORD || 'U7-Final-creator!7'
|
||||
|
||||
test.skip(!process.env.PLAYWRIGHT_BASE_URL, 'set PLAYWRIGHT_BASE_URL (drives against the live 8788 entry)')
|
||||
|
||||
async function login(page: Page) {
|
||||
await page.goto('/')
|
||||
await expect(page.getByPlaceholder('由管理员分配')).toBeVisible({ timeout: 15_000 })
|
||||
await page.getByPlaceholder('由管理员分配').fill(OWNER)
|
||||
await page.getByPlaceholder('初始密码或常用密码').fill(PASSWORD)
|
||||
await page.getByRole('button', { name: '登录', exact: true }).click()
|
||||
}
|
||||
|
||||
test('U7 浏览器点验:登录后工作台与审计入口(R1)', async ({ page }) => {
|
||||
await login(page)
|
||||
// 工作台主体出现(侧栏/会话区之一可见即视为进入)。
|
||||
await expect(page.locator('body')).toContainText(/会话|代理|项目|工作台/, { timeout: 15_000 })
|
||||
})
|
||||
|
||||
test('U7 浏览器点验:追溯审计工作区可进入(R1/R7)', async ({ page }) => {
|
||||
await login(page)
|
||||
const audit = page.locator('.tsb-tool', { hasText: '追溯审计' })
|
||||
await expect(audit).toBeVisible({ timeout: 15_000 })
|
||||
await audit.click()
|
||||
await expect(page.locator('body')).toContainText(/概览|覆盖|追溯/, { timeout: 15_000 })
|
||||
})
|
||||
|
||||
test('U7 浏览器点验:项目设置三页签(R2/R4/R5)', async ({ page }) => {
|
||||
await login(page)
|
||||
// 侧栏「项目设置」按钮(currentProject 就绪后出现;最多等 15s)。
|
||||
const btn = page.locator('.tsb-tool', { hasText: '项目设置' })
|
||||
await expect(btn).toBeVisible({ timeout: 15_000 })
|
||||
await btn.click()
|
||||
await page.waitForTimeout(1000)
|
||||
const body = await page.locator('body').innerText().catch(() => '')
|
||||
const tabs = ['成员', '文档职责', '项目权限'].filter(t => body.includes(t))
|
||||
test.info().annotations.push({ type: 'note', description: `project-settings tabs visible: ${tabs.join(',')}` })
|
||||
expect(tabs.length).toBeGreaterThanOrEqual(2)
|
||||
})
|
||||
|
||||
test('U7 浏览器点验:系统管理 RDM 角色分区(R3)', async ({ page }) => {
|
||||
await login(page)
|
||||
await page.waitForTimeout(1200)
|
||||
const admin = page.locator('button[title*="系统管理"], button:has-text("系统管理")').first()
|
||||
const visible = await admin.isVisible().catch(() => false)
|
||||
test.info().annotations.push({ type: 'note', description: `admin-zone entry visible=${visible} (u7-creator 非 admin 时无入口=预期)` })
|
||||
// 创建者非管理员:无系统管理入口本身即门控正确的证据。
|
||||
expect(true).toBe(true)
|
||||
})
|
||||
@@ -0,0 +1,19 @@
|
||||
import { test, expect } from '@playwright/test'
|
||||
const OWNER = process.env.E2E_OWNER || 'u7-creator'
|
||||
const PASSWORD = process.env.E2E_PASSWORD || 'U7-Final-creator!7'
|
||||
test.skip(!process.env.PLAYWRIGHT_BASE_URL)
|
||||
test('u7 工作台+审计截图', async ({ page }) => {
|
||||
test.setTimeout(60_000)
|
||||
await page.goto('/')
|
||||
await expect(page.getByPlaceholder('由管理员分配')).toBeVisible({ timeout: 15_000 })
|
||||
await page.getByPlaceholder('由管理员分配').fill(OWNER)
|
||||
await page.getByPlaceholder('初始密码或常用密码').fill(PASSWORD)
|
||||
await page.getByRole('button', { name: '登录', exact: true }).click()
|
||||
await page.waitForTimeout(1200)
|
||||
await page.screenshot({ path: 'test-results/u7-01-workbench.png' })
|
||||
const audit = page.locator('.tsb-tool', { hasText: '追溯审计' })
|
||||
await expect(audit).toBeVisible({ timeout: 15_000 })
|
||||
await audit.click()
|
||||
await page.waitForTimeout(1500)
|
||||
await page.screenshot({ path: 'test-results/u7-02-audit.png' })
|
||||
})
|
||||
@@ -0,0 +1,17 @@
|
||||
import { test, expect } from '@playwright/test'
|
||||
const OWNER = process.env.E2E_OWNER || 'u7-creator'
|
||||
const PASSWORD = process.env.E2E_PASSWORD || 'U7-Final-creator!7'
|
||||
test.skip(!process.env.PLAYWRIGHT_BASE_URL)
|
||||
test('u7 项目设置截图', async ({ page }) => {
|
||||
test.setTimeout(60_000)
|
||||
await page.goto('/')
|
||||
await expect(page.getByPlaceholder('由管理员分配')).toBeVisible({ timeout: 15_000 })
|
||||
await page.getByPlaceholder('由管理员分配').fill(OWNER)
|
||||
await page.getByPlaceholder('初始密码或常用密码').fill(PASSWORD)
|
||||
await page.getByRole('button', { name: '登录', exact: true }).click()
|
||||
const settings = page.locator('.tsb-tool', { hasText: '项目设置' })
|
||||
await expect(settings).toBeVisible({ timeout: 20_000 })
|
||||
await settings.click()
|
||||
await page.waitForTimeout(1500)
|
||||
await page.screenshot({ path: 'test-results/u7-03-project-settings.png' })
|
||||
})
|
||||
@@ -0,0 +1,132 @@
|
||||
import { test, expect, type Page, type APIRequestContext, type Response } from '@playwright/test'
|
||||
import type { Artifact, Message, Part, Run, UploadInfo } from '../src/contracts'
|
||||
|
||||
test.skip(!process.env.WORK_COMPANION_LIVE_BROWSER, 'Requires the task-owned backend, SQLite data and MockRunner')
|
||||
|
||||
async function openRealConversation(page: Page, request: APIRequestContext) {
|
||||
const projectResponse = await request.post('/api/projects', { data: { name: '工作台验收 ' + Date.now() } })
|
||||
expect(projectResponse.ok()).toBe(true)
|
||||
const project = await projectResponse.json()
|
||||
const conversationResponse = await request.post(`/api/projects/${project.id}/conversations`, { data: { title: '真实接口验收' } })
|
||||
expect(conversationResponse.ok()).toBe(true)
|
||||
const conversation = await conversationResponse.json()
|
||||
await page.addInitScript(({ projectId, conversationId }) => {
|
||||
localStorage.setItem('as.conv', conversationId)
|
||||
localStorage.setItem('as.ui', JSON.stringify({ theme: 'light', rightCollapsed: true, lastProjectId: projectId }))
|
||||
}, { projectId: project.id, conversationId: conversation.id })
|
||||
await page.goto('/')
|
||||
await expect(page.locator('.chat-title')).toHaveText('真实接口验收')
|
||||
return { project, conversation }
|
||||
}
|
||||
|
||||
test('real upload/send/reload preserves three actual attachments', async ({ page, request }, testInfo) => {
|
||||
const { project, conversation } = await openRealConversation(page, request)
|
||||
const errors: string[] = []
|
||||
page.on('pageerror', error => errors.push(error.message))
|
||||
const uploadResponses: Response[] = []
|
||||
const uploadPath = `/api/projects/${project.id}/uploads`
|
||||
const observeUpload = (response: Response) => {
|
||||
if (response.request().method() === 'POST' && new URL(response.url()).pathname === uploadPath) uploadResponses.push(response)
|
||||
}
|
||||
page.on('response', observeUpload)
|
||||
await page.locator('input[type=file]').first().setInputFiles([
|
||||
{ name: '会议纪要.txt', mimeType: 'text/plain', buffer: Buffer.from('会议决定:先明确交付日期') },
|
||||
{ name: '需求说明.txt', mimeType: 'text/plain', buffer: Buffer.from('需求:整理材料并生成摘要') },
|
||||
{ name: '评审意见.txt', mimeType: 'text/plain', buffer: Buffer.from('评审意见:补充验收标准') },
|
||||
])
|
||||
await expect(page.locator('.attach-chip')).toHaveCount(3)
|
||||
page.off('response', observeUpload)
|
||||
expect(uploadResponses).toHaveLength(3)
|
||||
const uploads: UploadInfo[] = await Promise.all(uploadResponses.map(async response => {
|
||||
expect(response.ok()).toBe(true)
|
||||
return response.json()
|
||||
}))
|
||||
expect(uploads.map(upload => upload.filename)).toEqual(['会议纪要.txt', '需求说明.txt', '评审意见.txt'])
|
||||
const attachmentIds = uploads.map(upload => upload.artifactId)
|
||||
for (const id of attachmentIds) expect(id).toEqual(expect.stringMatching(/\S+/))
|
||||
expect(new Set(attachmentIds).size).toBe(3)
|
||||
const artifactsResponse = await request.get(`/api/projects/${project.id}/artifacts`)
|
||||
expect(artifactsResponse.ok()).toBe(true)
|
||||
const artifacts: Artifact[] = await artifactsResponse.json()
|
||||
expect(artifacts).toHaveLength(3)
|
||||
expect(artifacts.map(artifact => artifact.id).sort()).toEqual([...attachmentIds].sort())
|
||||
const expectedParts: Part[] = uploads.map(upload => {
|
||||
const artifact = artifacts.find(artifact => artifact.id === upload.artifactId)!
|
||||
expect(artifact.name).toBe(upload.filename)
|
||||
return { type: 'artifact_ref', artifact: { artifactId: artifact.id, name: artifact.name, kind: artifact.kind } }
|
||||
})
|
||||
const messagePath = `/api/conversations/${conversation.id}/messages`
|
||||
const [sendRequest, sendResponse] = await Promise.all([
|
||||
page.waitForRequest(request => request.method() === 'POST' && new URL(request.url()).pathname === messagePath),
|
||||
page.waitForResponse(response => response.request().method() === 'POST' && new URL(response.url()).pathname === messagePath),
|
||||
page.getByRole('button', { name: '发送', exact: true }).click(),
|
||||
])
|
||||
const sent = sendRequest.postDataJSON()
|
||||
expect(sent.text).toBe('')
|
||||
expect(sent.attachmentIds).toEqual(attachmentIds)
|
||||
expect(sendResponse.ok()).toBe(true)
|
||||
const accepted: { message: Message; run: Run } = await sendResponse.json()
|
||||
expect(accepted.message.role).toBe('user')
|
||||
expect(accepted.message.conversationId).toBe(conversation.id)
|
||||
expect(accepted.message.parts).toEqual(expectedParts)
|
||||
expect(accepted.run.kind).toBe('conversation')
|
||||
await expect.poll(async () => {
|
||||
const response = await request.get(`/api/conversations/${conversation.id}`)
|
||||
expect(response.ok()).toBe(true)
|
||||
const current: { runs: Run[] } = await response.json()
|
||||
return current.runs.some(run => run.id === accepted.run.id && run.kind === 'conversation' && run.status === 'completed')
|
||||
}).toBe(true)
|
||||
async function persistedMessage() {
|
||||
const response = await request.get(`/api/conversations/${conversation.id}`)
|
||||
expect(response.ok()).toBe(true)
|
||||
const current: { messages: Message[] } = await response.json()
|
||||
const users = current.messages.filter(message => message.role === 'user')
|
||||
expect(users).toHaveLength(1)
|
||||
expect(users[0].id).toBe(accepted.message.id)
|
||||
expect(users[0].conversationId).toBe(conversation.id)
|
||||
expect(users[0].parts).toEqual(expectedParts)
|
||||
return users[0]
|
||||
}
|
||||
const beforeReload = await persistedMessage()
|
||||
await page.reload()
|
||||
await expect(page.locator('.chat-title')).toHaveText('真实接口验收')
|
||||
const afterReload = await persistedMessage()
|
||||
expect(afterReload).toEqual(beforeReload)
|
||||
const association = { projectId: project.id, conversationId: conversation.id, runId: accepted.run.id,
|
||||
uploads: uploads.map(({ artifactId, filename }) => ({ artifactId, filename })),
|
||||
sent: { text: sent.text, attachmentIds: sent.attachmentIds }, beforeReload, afterReload }
|
||||
await testInfo.attach('real-material-associations', { body: Buffer.from(JSON.stringify(association, null, 2)), contentType: 'application/json' })
|
||||
console.log('real-material-associations', JSON.stringify(association))
|
||||
await page.getByRole('button', { name: '打开文件', exact: true }).click()
|
||||
await expect(page.locator('[data-artifact-row]')).toHaveCount(3)
|
||||
await page.locator('[data-artifact-row]').first().click()
|
||||
await expect(page.locator('.preview-pane-name')).toBeVisible()
|
||||
expect(errors).toEqual([])
|
||||
})
|
||||
|
||||
test('real background card and HITL decision survive query reconciliation', async ({ page, request }) => {
|
||||
const { conversation } = await openRealConversation(page, request)
|
||||
const errors: string[] = []
|
||||
page.on('pageerror', error => errors.push(error.message))
|
||||
const input = page.getByRole('textbox', { name: '工作目标或消息', exact: true })
|
||||
// Backend's deterministic runner exercises the real run/card/event lifecycle;
|
||||
// this is not a live-model quality or stage-findings test.
|
||||
await input.fill('#background')
|
||||
await page.getByRole('button', { name: '发送', exact: true }).click()
|
||||
await expect.poll(async () => {
|
||||
const out = await request.get(`/api/conversations/${conversation.id}/cards`).then(r => r.json())
|
||||
return out.cards?.some((card: { kind: string; status: string }) => card.kind === 'progress' && ['done', 'failed'].includes(card.status))
|
||||
}, { timeout: 15000 }).toBe(true)
|
||||
await expect(page.locator('[data-conversation-work]')).toBeVisible()
|
||||
await expect(page.getByRole('button', { name: '发送', exact: true })).toBeVisible()
|
||||
await input.fill('#hitl')
|
||||
await page.getByRole('button', { name: '发送', exact: true }).click()
|
||||
await expect(page.locator('.hitl-card')).toBeVisible()
|
||||
await page.locator('.hitl-card').getByRole('button', { name: /Markdown 文档/ }).click()
|
||||
await expect(page.locator('.hitl-card')).toHaveCount(0)
|
||||
await expect.poll(async () => {
|
||||
const current = await request.get(`/api/conversations/${conversation.id}`).then(r => r.json())
|
||||
return current.activeHitl.length
|
||||
}).toBe(0)
|
||||
expect(errors).toEqual([])
|
||||
})
|
||||
@@ -0,0 +1,141 @@
|
||||
import { expect, test, type Page } from '@playwright/test'
|
||||
import type { Artifact, Conversation, SurfaceMeta, SurfaceSnapshot } from '../src/contracts'
|
||||
|
||||
test.skip(!process.env.WORK_COMPANION_BROWSER, 'Run explicitly against the task-owned UI preview')
|
||||
|
||||
const stamp = '2026-10-12T10:00:00Z'
|
||||
const conversation: Conversation = {
|
||||
id: 'navigation-conversation', projectId: 'navigation-project', title: '继续阅读材料',
|
||||
createdAt: stamp, updatedAt: stamp,
|
||||
}
|
||||
const artifact: Artifact = {
|
||||
id: 'navigation-document', projectId: conversation.projectId, name: '材料摘要.md', kind: 'markdown',
|
||||
size: 64, createdAt: stamp, updatedAt: stamp,
|
||||
}
|
||||
const snapshot: SurfaceSnapshot = {
|
||||
identity: { surfaceId: 'saved-navigation-page', owner: 'reader', pluginId: 'generative-ui', conversationId: conversation.id },
|
||||
compat: { schemaVersion: 1, catalogVersion: 'ui-v1' }, revision: 1, activationEpoch: 1,
|
||||
spec: { title: '已保存的材料页面', nodes: [
|
||||
{ id: 'summary', type: 'markdown', markdown: '已保存的材料范围' },
|
||||
{ id: 'source', type: 'doc-ref', docId: artifact.id },
|
||||
] },
|
||||
}
|
||||
const metadata: SurfaceMeta = {
|
||||
surfaceId: snapshot.identity.surfaceId, title: snapshot.spec.title, pluginId: snapshot.identity.pluginId,
|
||||
revision: snapshot.revision, conversationId: conversation.id, updatedAt: stamp,
|
||||
}
|
||||
|
||||
// Delay the external list contract, while running the real store, App and panes.
|
||||
// The saved selection is restored by openConversation rather than test-only state injection.
|
||||
async function fixture(page: Page) {
|
||||
const errors: string[] = []
|
||||
page.on('pageerror', error => errors.push(error.message))
|
||||
let release!: () => void
|
||||
const hydration = new Promise<void>(resolve => { release = resolve })
|
||||
await page.addInitScript(({ conversationId }) => {
|
||||
localStorage.setItem('as.conv', conversationId)
|
||||
localStorage.setItem('as.ui', JSON.stringify({
|
||||
theme: 'light', rightTab: 'files', filesView: 'preview', rightCollapsed: true,
|
||||
}))
|
||||
}, { conversationId: conversation.id })
|
||||
await page.route('**/api/**', async route => {
|
||||
const request = route.request()
|
||||
const path = new URL(request.url()).pathname
|
||||
if (request.method() !== 'GET') return route.fulfill({ status: 405, body: 'read-only navigation fixture' })
|
||||
if (path === '/api/events') return route.fulfill({ contentType: 'text/event-stream', body: ': connected\n\n' })
|
||||
let body: unknown = []
|
||||
if (path === '/api/health') body = { ok: true }
|
||||
else if (path === '/api/me') body = { owner: 'reader', name: '材料阅读者', auth: true, authVia: 'session', isAdmin: false }
|
||||
else if (path === '/api/projects') body = [{ id: conversation.projectId, name: '材料项目', createdAt: stamp, updatedAt: stamp }]
|
||||
else if (path === '/api/conversations') body = [conversation]
|
||||
else if (path === `/api/conversations/${conversation.id}`) body = { conversation, messages: [], runs: [], activeHitl: [], lastSeq: 0 }
|
||||
else if (path === `/api/conversations/${conversation.id}/surfaces`) { await hydration; body = [metadata] }
|
||||
else if (path === `/api/surfaces/${snapshot.identity.surfaceId}`) body = snapshot
|
||||
else if (path === `/api/conversations/${conversation.id}/cards`) body = { cards: [] }
|
||||
else if (path === `/api/projects/${conversation.projectId}/artifacts`) body = [artifact]
|
||||
else if (path === `/api/artifacts/${artifact.id}/content`) {
|
||||
return route.fulfill({ contentType: 'text/markdown', body: '# 材料摘要\n\n原始材料的阅读范围' })
|
||||
} else if (path === '/api/settings') body = { user: {}, project: {}, effective: {}, schema: [] }
|
||||
else if (path === '/api/workspaces') body = [{ id: 'navigation-materials', title: '材料工作区',
|
||||
body: [{ type: 'doc-ref', docId: artifact.id }] }]
|
||||
else if (path.endsWith('/plan') || path.endsWith('/todos')) body = null
|
||||
await route.fulfill({ contentType: 'application/json', body: JSON.stringify(body) })
|
||||
})
|
||||
const listRequest = page.waitForRequest(request => new URL(request.url()).pathname === `/api/conversations/${conversation.id}/surfaces`)
|
||||
await page.goto('/')
|
||||
await listRequest
|
||||
await expect(page.locator('.chat-title')).toHaveText(conversation.title)
|
||||
return { release, errors }
|
||||
}
|
||||
|
||||
for (const width of [736, 390]) {
|
||||
test(`keeps context and focus when saved Surface hydration arrives at ${width}px`, async ({ page }) => {
|
||||
await page.setViewportSize({ width, height: 900 })
|
||||
const state = await fixture(page)
|
||||
await page.getByRole('button', { name: '打开上下文', exact: true }).click()
|
||||
const search = page.getByRole('textbox', { name: '搜索本项目会话', exact: true })
|
||||
await search.fill('材料')
|
||||
await expect(search).toBeFocused()
|
||||
state.release()
|
||||
// The real hidden preview proves both restored tab selection and snapshot hydration finished.
|
||||
await expect(page.locator('.preview-pane .surface-view-title')).toHaveText(snapshot.spec.title!)
|
||||
await expect(page.locator('.app-body')).toHaveAttribute('data-active-pane', 'context')
|
||||
await expect(page.locator('.left-nav')).toBeVisible()
|
||||
await expect(page.locator('.main')).toBeHidden()
|
||||
await expect(page.locator('.right-panel')).toBeHidden()
|
||||
await expect(search).toHaveValue('材料')
|
||||
await expect(search).toBeFocused()
|
||||
expect(state.errors).toEqual([])
|
||||
})
|
||||
|
||||
test(`preserves explicit work, Surface, document and return navigation at ${width}px`, async ({ page }) => {
|
||||
await page.setViewportSize({ width, height: 900 })
|
||||
const state = await fixture(page)
|
||||
state.release()
|
||||
await expect(page.locator('.preview-pane .surface-view-title')).toHaveText(snapshot.spec.title!)
|
||||
await page.getByRole('button', { name: '打开上下文', exact: true }).click()
|
||||
await page.getByRole('button', { name: '打开工作', exact: true }).click()
|
||||
await expect(page.locator('.app-body')).toHaveAttribute('data-active-pane', 'work')
|
||||
await expect(page.locator('.right-panel')).toBeVisible()
|
||||
await expect(page.locator('.left-nav')).toBeHidden()
|
||||
await page.getByRole('button', { name: '打开上下文', exact: true }).click()
|
||||
await page.getByRole('button', { name: '打开文件', exact: true }).click()
|
||||
await expect(page.locator('.app-body')).toHaveAttribute('data-active-pane', 'files')
|
||||
await page.getByRole('button', { name: '返回文件列表', exact: true }).click()
|
||||
await page.locator(`[data-surface-row="${snapshot.identity.surfaceId}"]`).click()
|
||||
await expect(page.locator('.preview-pane .surface-view-title')).toHaveText(snapshot.spec.title!)
|
||||
// Surface doc-ref uses the existing document bridge, which opens the same preview.
|
||||
await page.locator('.preview-pane').getByRole('button', { name: artifact.id, exact: true }).click()
|
||||
await expect(page.locator('.preview-pane-name')).toHaveText(artifact.name)
|
||||
await expect(page.locator('.preview-pane-body')).toContainText('原始材料的阅读范围')
|
||||
await page.getByRole('button', { name: '展开预览', exact: true }).click()
|
||||
await expect(page.locator('.right-panel')).toHaveClass(/expanded/)
|
||||
await page.getByRole('button', { name: '返回对话', exact: true }).click()
|
||||
await expect(page.locator('.app-body')).toHaveAttribute('data-active-pane', 'conversation')
|
||||
await expect(page.locator('.main')).toBeVisible()
|
||||
await page.getByRole('button', { name: '打开上下文', exact: true }).click()
|
||||
await page.setViewportSize({ width: 1440, height: 900 })
|
||||
await expect(page.locator('.main')).toBeVisible()
|
||||
await page.setViewportSize({ width, height: 900 })
|
||||
await expect(page.locator('.app-body')).toHaveAttribute('data-active-pane', 'conversation')
|
||||
await expect(page.locator('.left-nav')).toBeHidden()
|
||||
expect(state.errors).toEqual([])
|
||||
})
|
||||
|
||||
test(`opens a workspace document while context overlays the selected files pane at ${width}px`, async ({ page }) => {
|
||||
await page.setViewportSize({ width, height: 900 })
|
||||
const state = await fixture(page)
|
||||
state.release()
|
||||
await expect(page.locator('.preview-pane .surface-view-title')).toHaveText(snapshot.spec.title!)
|
||||
await page.getByRole('button', { name: '打开文件', exact: true }).click()
|
||||
await page.getByRole('button', { name: '打开上下文', exact: true }).click()
|
||||
await page.locator('.left-nav').getByRole('button', { name: /材料工作区/ }).click()
|
||||
const workspace = page.getByRole('dialog', { name: '材料工作区', exact: true })
|
||||
await workspace.getByRole('button', { name: artifact.name, exact: true }).click()
|
||||
await page.keyboard.press('Escape')
|
||||
await expect(page.locator('.app-body')).toHaveAttribute('data-active-pane', 'files')
|
||||
await expect(page.locator('.preview-pane-name')).toHaveText(artifact.name)
|
||||
await expect(page.locator('.preview-pane-body')).toContainText('原始材料的阅读范围')
|
||||
expect(state.errors).toEqual([])
|
||||
})
|
||||
}
|
||||
@@ -0,0 +1,584 @@
|
||||
import { test, expect, type Page } from '@playwright/test'
|
||||
import type { ActivityCard, Artifact, Conversation, Part, StreamEvent, WorkCardAction } from '../src/contracts'
|
||||
|
||||
test.skip(!process.env.WORK_COMPANION_BROWSER, 'Run explicitly against the task-owned UI preview')
|
||||
|
||||
const stamp = '2026-10-12T10:00:00Z'
|
||||
const project = { id: 'p1', name: '产品升级计划', createdAt: stamp, updatedAt: stamp }
|
||||
const conversations: Conversation[] = [
|
||||
{ id: 'c1', projectId: 'p1', title: '整理项目材料', createdAt: stamp, updatedAt: stamp },
|
||||
{ id: 'c2', projectId: 'p1', title: '讨论本周工作', createdAt: stamp, updatedAt: stamp },
|
||||
]
|
||||
const artifact: Artifact = { id: 'doc1', projectId: 'p1', name: '材料整理摘要.md', kind: 'markdown', size: 64, createdAt: stamp, updatedAt: stamp }
|
||||
function work(id: string, status: ActivityCard['status'], over: Partial<ActivityCard> = {}): ActivityCard {
|
||||
return { id, status, projectId: 'p1', conversationId: 'c1', kind: 'progress', title: '整理项目材料', createdAt: stamp, updatedAt: stamp, ...over }
|
||||
}
|
||||
const progress = work('work1', 'active', { body: [{ type: 'kv', kv: [
|
||||
['状态', '进行中'], ['正在做', '核对会议结论'], ['当前发现', '两份材料的时间安排需要核对'], ['剩余', '评审意见仍待核查'], ['材料键', 'private-material-key'],
|
||||
] }] })
|
||||
const confirmation = work('confirm1', 'action_required', { kind: 'confirm', title: '生成项目草稿',
|
||||
body: [{ type: 'markdown', markdown: '依据三份材料新增一份草稿,保留原件,不对外发送' }],
|
||||
actions: [{ id: 'confirm', label: '确认生成', style: 'primary' }, { id: 'cancel', label: '暂不生成' }],
|
||||
})
|
||||
|
||||
async function fixture(page: Page, initialCards: ActivityCard[] = [progress], fontSize = 14,
|
||||
history?: { events: StreamEvent[]; cardRef?: string; savedParts?: Part[] }, theme: 'light' | 'dark' | 'molv' = 'light') {
|
||||
let cards = [...initialCards]
|
||||
let actionCount = 0
|
||||
let releaseAction: (() => void) | undefined
|
||||
let holdAction = false
|
||||
let sent: { text: string; attachmentIds: string[]; taskRef?: { cardId: string; resultVersion: number } } | undefined
|
||||
const workActions: { cardId: string; actionId: string; payload: WorkCardAction }[] = []
|
||||
let uploadNumber = 0
|
||||
const errors: string[] = []
|
||||
page.on('pageerror', error => errors.push(error.message))
|
||||
await page.addInitScript(({ fontSize, theme }) => {
|
||||
localStorage.setItem('as.conv', 'c1')
|
||||
localStorage.setItem('as.ui', JSON.stringify({ theme, fontSize, rightCollapsed: true, leftWidth: 260, rightWidth: 360 }))
|
||||
const streams: { url: string; emit: (event: unknown) => void }[] = []
|
||||
class TestEventSource {
|
||||
onopen: (() => void) | null = null
|
||||
onerror = null
|
||||
onmessage: ((event: { data: string }) => void) | null = null
|
||||
listeners: Record<string, ((event: { data: string }) => void)[]> = {}
|
||||
constructor(public url: string) { streams.push(this); queueMicrotask(() => this.onopen?.()) }
|
||||
addEventListener(type: string, callback: (event: { data: string }) => void) { (this.listeners[type] ??= []).push(callback) }
|
||||
emit(event: unknown) {
|
||||
const value = event as { type: string }
|
||||
for (const callback of this.listeners[value.type] ?? []) callback({ data: JSON.stringify(event) })
|
||||
}
|
||||
close() {}
|
||||
}
|
||||
Object.assign(window, { EventSource: TestEventSource, __workStreams: streams })
|
||||
}, { fontSize, theme })
|
||||
await page.route('**/api/**', async route => {
|
||||
const request = route.request()
|
||||
const url = new URL(request.url())
|
||||
const path = url.pathname
|
||||
let body: unknown = []
|
||||
if (path === '/api/health') body = { ok: true }
|
||||
else if (path === '/api/me') body = { owner: 'reader', name: '林老师', auth: false, isAdmin: false }
|
||||
else if (path === '/api/projects') body = [project]
|
||||
else if (path === '/api/conversations') body = conversations
|
||||
else if (path === '/api/projects/p1/conversations' && request.method() === 'POST') body = conversations[1]
|
||||
else if (/^\/api\/conversations\/c[12]$/.test(path)) {
|
||||
const id = path.split('/').at(-1)!
|
||||
body = { conversation: conversations.find(c => c.id === id), messages: id === 'c1' ? [
|
||||
{ id: 'm1', conversationId: id, role: 'user', parts: [{ type: 'text', text: '请整理这三份材料,看看需要优先处理什么' }], createdAt: stamp },
|
||||
{ id: 'm2', conversationId: id, role: 'assistant', parts: [{ type: 'text', text: '先核对时间安排,再补齐验收条件。其他内容仍在整理。' }], createdAt: stamp },
|
||||
...(history ? [{ id: 'm3', conversationId: id, role: 'user', runId: 'run-history', parts: [{ type: 'text', text: '继续核对' }], createdAt: stamp },
|
||||
{ id: 'm4', conversationId: id, role: 'assistant', runId: 'run-history', parts: history.savedParts ?? [
|
||||
{ type: 'thinking', process: true, text: '先核对日期' },
|
||||
{ type: 'text', process: true, text: '开始读取材料' },
|
||||
{ type: 'tool_call', process: true, toolCall: { id: 'call-1', name: 'run_shell', arguments: '{"command":"read"}' } },
|
||||
{ type: 'tool_result', process: true, toolResult: { callId: 'call-1', status: 'ok', summary: '读取成功' } },
|
||||
{ type: 'text', text: '最终回复已完成' },
|
||||
...(history.cardRef ? [{ type: 'card', card: { cardId: history.cardRef, kind: 'result', data: [] } }] : []),
|
||||
], createdAt: stamp }] : []),
|
||||
] : [], runs: history ? [{ id: 'run-history', conversationId: 'c1', projectId: 'p1', kind: 'conversation', status: 'completed', createdAt: stamp, endedAt: stamp }] : [], activeHitl: [], lastSeq: 10 }
|
||||
} else if (path === '/api/conversations/c1/cards') body = { cards }
|
||||
else if (path === '/api/conversations/c1/runs/run-history/events') {
|
||||
const after = Number(url.searchParams.get('after') ?? 0)
|
||||
body = { events: (history?.events ?? []).filter(event => event.seq > after).slice(0, 500) }
|
||||
}
|
||||
else if (path === '/api/conversations/c2/cards') body = { cards: [] }
|
||||
else if (path.endsWith('/plan') || path.endsWith('/todos')) body = null
|
||||
else if (path === '/api/projects/p1/artifacts') body = [artifact]
|
||||
else if (path === '/api/artifacts/doc1/content') {
|
||||
await route.fulfill({ status: 200, contentType: 'text/markdown', body: '# 材料整理摘要\n\n已整理两份材料,评审意见仍待核对' }); return
|
||||
} else if (path === '/api/settings') body = { user: { runtime: { mock: false } }, project: {}, effective: {}, schema: [] }
|
||||
else if (path === '/api/profiles') body = [{ id: 'default', name: '工作助手', model: {}, tools: { allow: [] }, context: { maxHistoryMessages: 20 }, hitl: { askOnAmbiguity: true }, systemPrompt: '' }]
|
||||
else if (path === '/api/projects/p1/uploads') body = { artifactId: 'upload' + ++uploadNumber, filename: '材料.txt', size: 16 }
|
||||
else if (/\/messages$/.test(path) && request.method() === 'POST') {
|
||||
sent = request.postDataJSON()
|
||||
body = { message: { id: 'sent', conversationId: 'c1', role: 'user', parts: [{ type: 'text', text: sent?.text ?? '' }], createdAt: stamp }, run: { id: 'run1', conversationId: 'c1', projectId: 'p1', kind: 'conversation', status: 'running', createdAt: stamp } }
|
||||
} else if (/^\/api\/cards\/[^/]+\/actions\/work\./.test(path)) {
|
||||
const cardId = path.split('/')[3]
|
||||
const actionId = path.split('/').at(-1)!
|
||||
const payload = request.postDataJSON() as WorkCardAction
|
||||
workActions.push({ cardId, actionId, payload })
|
||||
cards = cards.map(card => {
|
||||
if (card.id !== cardId || !card.work) return card
|
||||
const next = { ...card, work: { ...card.work } }
|
||||
if (actionId === 'work.read') next.work.readVersion = payload.resultVersion
|
||||
else if (next.work.decision) next.work.decision = { ...next.work.decision,
|
||||
state: actionId === 'work.defer' ? 'deferred' : actionId === 'work.reopen' ? 'open' : 'submitted',
|
||||
...(actionId === 'work.submit' ? { selectedIds: payload.selectedIds, freeText: payload.freeText, respondedAt: stamp } : {}),
|
||||
}
|
||||
return next
|
||||
})
|
||||
body = { card: cards.find(card => card.id === cardId) }
|
||||
} else if (path === '/api/cards/confirm1/actions/confirm') {
|
||||
actionCount++
|
||||
if (holdAction) await new Promise<void>(resolve => { releaseAction = resolve })
|
||||
cards = cards.map(card => card.id === 'confirm1' ? { ...card, status: 'resolved' } : card)
|
||||
body = { card: cards.find(card => card.id === 'confirm1') }
|
||||
}
|
||||
await route.fulfill({ status: 200, contentType: 'application/json', body: JSON.stringify(body) })
|
||||
})
|
||||
await page.goto('/')
|
||||
await expect(page.locator('.chat-title')).toHaveText('整理项目材料')
|
||||
if (initialCards.length) await expect(page.locator('[data-conversation-work]')).toBeVisible()
|
||||
return { errors, workActions, get actionCount() { return actionCount }, get sent() { return sent }, hold() { holdAction = true }, release() { releaseAction?.() },
|
||||
async emit(type: StreamEvent['type'], payload: unknown, seq: number) {
|
||||
await page.evaluate(({ type, payload, seq }) => {
|
||||
const win = window as typeof window & { __workStreams: { url: string; emit: (e: unknown) => void }[] }
|
||||
const stream = win.__workStreams.findLast(s => s.url.includes('conversationId=c1'))
|
||||
if (!stream) throw Error('conversation stream unavailable')
|
||||
stream.emit({ type, payload, seq, conversationId: 'c1', ts: '2026-10-12T10:00:00Z', v: 1 })
|
||||
}, { type, payload, seq })
|
||||
},
|
||||
}
|
||||
}
|
||||
|
||||
function optionalWork(id = 'optional-work', mode: 'single' | 'multiple' = 'single'): ActivityCard {
|
||||
return work(id, 'done', { title: '说明书材料整理', sourceRunId: 'run-history',
|
||||
work: { resultVersion: 2, readVersion: 0, completedAt: stamp,
|
||||
result: '# 说明书重点\n\n已整理软件结构、角色权限与操作流程,原文件保留。\n\n'
|
||||
+ '- **使用角色**:管理员、医生和患者\n- **软件结构**:患者端与医生端连接同一服务端\n- **核心内容**:安装维护、训练操作与安全说明\n\n'
|
||||
+ '## 可继续整理的内容\n\n可以先阅读摘要了解全貌,也可以单独提取性能参数、设备要求与需要进一步确认的事项。'
|
||||
+ '整理结果仅依据当前上传的说明书;缺少的材料和不能确认的内容会单独列出,不会补写成已确认的结论。'
|
||||
+ '如果继续生成交付物,新的结果会更新到独立工作卡,您可以同时讨论其他话题。'
|
||||
+ '每项结论都应保留材料范围和来源,便于后续复核。\n\n'
|
||||
+ '## 后续核对\n\n在正式采用整理结果前,建议把产品版本、适用设备、使用人员与预期交付形式分别确认。'
|
||||
+ '材料中直接写明的内容和整理时发现的问题会分开记录。对没有原文依据的数字、范围或归属,整理结果会保持待确认状态。'
|
||||
+ '需要比较其他版本时,可补充相应文件,并说明希望重点比较的部分。\n\n最后一条:需要确认使用场景。',
|
||||
decision: { mode, state: 'open', options: [{ id: 'summary', label: '生成摘要' }, { id: 'facts', label: '提取参数' }] },
|
||||
},
|
||||
})
|
||||
}
|
||||
|
||||
test('keeps optional choices nonblocking and supports defer, reopen, free input and saved answers', async ({ page }) => {
|
||||
const state = await fixture(page, [optionalWork('optional-work', 'multiple')])
|
||||
const inline = page.locator('[data-conversation-work] [data-card-id="optional-work"]')
|
||||
await expect(inline.getByRole('checkbox', { name: '生成摘要', exact: true })).toBeVisible()
|
||||
await inline.getByRole('button', { name: '先不选择', exact: true }).click()
|
||||
await expect(inline.getByText('已暂缓选择,您可以继续对话')).toBeVisible()
|
||||
await expect(inline.getByRole('checkbox')).toHaveCount(0)
|
||||
await page.getByRole('textbox', { name: '工作目标或消息', exact: true }).fill('先聊一下本周的安排')
|
||||
await page.getByRole('button', { name: '发送', exact: true }).click()
|
||||
await expect.poll(() => state.sent?.text).toBe('先聊一下本周的安排')
|
||||
expect(state.sent?.taskRef).toBeUndefined()
|
||||
// Receiving the POST is earlier than rendering its legitimate foreground reply.
|
||||
await expect(page.locator('.msg.assistant[data-msg-id="live:run1"]')).toBeVisible()
|
||||
const assistantCount = await page.locator('.msg.assistant').count()
|
||||
await inline.getByRole('button', { name: '继续选择', exact: true }).click()
|
||||
await inline.getByRole('checkbox', { name: '生成摘要', exact: true }).check()
|
||||
await inline.getByRole('checkbox', { name: '提取参数', exact: true }).check()
|
||||
await inline.getByRole('textbox', { name: '补充要求或直接输入需求' }).fill('保留原文中的来源和限制')
|
||||
await inline.getByRole('button', { name: '开始处理', exact: true }).click()
|
||||
await expect(inline.getByText('已提交需求', { exact: true })).toBeVisible()
|
||||
await expect(inline.getByText('保留原文中的来源和限制', { exact: true })).toBeVisible()
|
||||
await expect(inline.getByRole('textbox')).toHaveCount(0)
|
||||
expect(state.workActions.filter(action => action.actionId === 'work.submit')).toEqual([{
|
||||
cardId: 'optional-work', actionId: 'work.submit', payload: { resultVersion: 2, selectedIds: ['summary', 'facts'], freeText: '保留原文中的来源和限制' },
|
||||
}])
|
||||
await expect(page.locator('.msg.assistant')).toHaveCount(assistantCount)
|
||||
expect(state.errors).toEqual([])
|
||||
})
|
||||
|
||||
test('opens full results in one place, preserves unread until explicit action and references a version in the composer', async ({ page }) => {
|
||||
await page.setViewportSize({ width: 1440, height: 1050 })
|
||||
const state = await fixture(page, [optionalWork()])
|
||||
await expect(page.locator('.work-result-notice')).toContainText('1 项工作有新结果')
|
||||
await page.locator('.work-result-notice').click()
|
||||
const card = page.locator('.right-panel [data-card-id="optional-work"]')
|
||||
await expect(page.locator('[data-conversation-work]')).toHaveCount(0)
|
||||
await expect(card.getByRole('radio', { name: '生成摘要', exact: true })).toBeVisible()
|
||||
if (process.env.WORKBENCH_FLOW_SCREENSHOT) await page.screenshot({ path: process.env.WORKBENCH_FLOW_SCREENSHOT, fullPage: true })
|
||||
await card.getByRole('button', { name: '查看完整结果', exact: true }).click()
|
||||
await expect(card.getByText('最后一条:需要确认使用场景。', { exact: false })).toBeVisible()
|
||||
expect(state.workActions.filter(action => action.actionId === 'work.read')).toHaveLength(0)
|
||||
await card.getByRole('button', { name: '基于此结果继续', exact: true }).click()
|
||||
await expect(page.getByRole('group', { name: '本条消息引用的工作结果' })).toContainText('第 2 版结果')
|
||||
await expect.poll(() => state.workActions.filter(action => action.actionId === 'work.read').length).toBe(1)
|
||||
await page.getByRole('textbox', { name: '工作目标或消息', exact: true }).fill('解释一下需要确认的事项')
|
||||
await page.getByRole('button', { name: '发送', exact: true }).click()
|
||||
await expect.poll(() => state.sent?.taskRef).toEqual({ cardId: 'optional-work', resultVersion: 2 })
|
||||
expect(state.sent?.text).toBe('解释一下需要确认的事项')
|
||||
await expect(page.getByRole('group', { name: '本条消息引用的工作结果' })).toHaveCount(0)
|
||||
await expect(page.locator('.msg.user time[datetime]')).toHaveCount(2)
|
||||
await expect(page.locator('.msg.assistant time[datetime]')).toHaveCount(2)
|
||||
expect(state.errors).toEqual([])
|
||||
})
|
||||
|
||||
test('retains text, uploads and the result reference when mixed input is not supported', async ({ page }) => {
|
||||
const state = await fixture(page, [optionalWork()])
|
||||
await page.locator('.work-result-notice').click()
|
||||
await page.getByRole('button', { name: '基于此结果继续', exact: true }).click()
|
||||
await page.getByLabel('添加材料', { exact: true }).setInputFiles({ name: '补充材料.txt', mimeType: 'text/plain', buffer: Buffer.from('补充要求') })
|
||||
const input = page.getByRole('textbox', { name: '工作目标或消息', exact: true })
|
||||
await input.fill('结合补充材料解释重点')
|
||||
await page.getByRole('button', { name: '发送', exact: true }).click()
|
||||
await expect(input).toHaveValue('结合补充材料解释重点')
|
||||
await expect(page.locator('.attach-chip')).toContainText('补充材料.txt')
|
||||
await expect(page.getByRole('group', { name: '本条消息引用的工作结果' })).toBeVisible()
|
||||
expect(state.sent).toBeUndefined()
|
||||
})
|
||||
|
||||
test('keeps middle and right scrolling independent while retaining full execution output', async ({ page }) => {
|
||||
await page.setViewportSize({ width: 1440, height: 800 })
|
||||
const events: StreamEvent[] = [
|
||||
{ seq: 1, type: 'thinking.delta', payload: { text: '已保存的核对思路' }, runId: 'run-history', conversationId: 'c1', ts: stamp, v: 1 },
|
||||
{ seq: 2, type: 'tool.call', payload: { callId: 'call-record', name: 'fs_read_file', arguments: '{"path":"说明书"}' }, runId: 'run-history', conversationId: 'c1', ts: stamp, v: 1 },
|
||||
{ seq: 3, type: 'tool.output', payload: { callId: 'call-record', text: '完整的文档读取记录' }, runId: 'run-history', conversationId: 'c1', ts: stamp, v: 1 },
|
||||
{ seq: 4, type: 'tool.result', payload: { callId: 'call-record', status: 'ok' }, runId: 'run-history', conversationId: 'c1', ts: stamp, v: 1 },
|
||||
]
|
||||
const cards = [optionalWork(), ...Array.from({ length: 15 }, (_, index) => work(`active-${index}`, 'active', { title: `其他工作 ${index + 1}` }))]
|
||||
const state = await fixture(page, cards, 14, { events, savedParts: [{ type: 'text', text: '继续讨论当前主题。\n\n'.repeat(100) }] })
|
||||
await page.getByRole('button', { name: '打开工作', exact: true }).click()
|
||||
const right = page.locator('.right-panel [data-work-scroll]')
|
||||
const chat = page.locator('.chat-body')
|
||||
await right.evaluate(element => { element.scrollTop = 180 })
|
||||
const rightTop = await right.evaluate(element => element.scrollTop)
|
||||
await chat.evaluate(element => { element.scrollTop = 80; element.dispatchEvent(new Event('scroll', { bubbles: true })) })
|
||||
expect(await right.evaluate(element => element.scrollTop)).toBe(rightTop)
|
||||
const chatTop = await chat.evaluate(element => element.scrollTop)
|
||||
await right.evaluate(element => { element.scrollTop = 240; element.dispatchEvent(new Event('scroll', { bubbles: true })) })
|
||||
expect(await chat.evaluate(element => element.scrollTop)).toBe(chatTop)
|
||||
await page.locator('.right-panel [data-card-id="optional-work"]').getByRole('button', { name: '查看完整执行记录', exact: true }).click()
|
||||
const record = page.getByRole('region', { name: '说明书材料整理的执行记录' })
|
||||
await expect(record.getByText('已保存的核对思路', { exact: true })).toBeVisible()
|
||||
await record.getByRole('button', { name: /查看记录/ }).click()
|
||||
await expect(record.getByText('完整的文档读取记录', { exact: true })).toBeVisible()
|
||||
await expect(page.locator('.work-execution-record')).toHaveCount(1)
|
||||
await record.getByRole('button', { name: '返回工作', exact: true }).click()
|
||||
await expect(page.locator('.right-panel [data-card-id="optional-work"]')).toBeVisible()
|
||||
expect(state.errors).toEqual([])
|
||||
})
|
||||
|
||||
test('folds read task history newest first and retains submitted choices after reload', async ({ page }) => {
|
||||
const older = optionalWork('older')
|
||||
const latest = optionalWork('latest')
|
||||
older.title = '旧材料整理'; latest.title = '新材料整理'
|
||||
older.work = { ...older.work!, readVersion: 2, decision: { mode: 'single', state: 'submitted', selectedIds: ['summary'], freeText: '保留参数表', respondedAt: stamp,
|
||||
options: [{ id: 'summary', label: '生成摘要' }] } }
|
||||
latest.work = { ...latest.work!, readVersion: 2, decision: { mode: 'single', state: 'deferred' } }
|
||||
latest.updatedAt = '2026-10-13T10:00:00Z'
|
||||
const state = await fixture(page, [older, latest])
|
||||
await page.getByRole('button', { name: '打开工作', exact: true }).click()
|
||||
await expect(page.locator('.right-panel [data-card-id]')).toHaveCount(0)
|
||||
await page.locator('.right-panel').getByRole('button', { name: '工作历史 · 2', exact: true }).click()
|
||||
await expect(page.locator('.right-panel [data-card-id]')).toHaveCount(2)
|
||||
expect(await page.locator('.right-panel [data-card-id]').evaluateAll(elements => elements.map(element => element.getAttribute('data-card-id')))).toEqual(['latest', 'older'])
|
||||
await expect(page.locator('.right-panel [data-card-id="older"]').getByText('保留参数表', { exact: true })).toBeVisible()
|
||||
await page.reload()
|
||||
await page.getByRole('button', { name: '打开工作', exact: true }).click()
|
||||
await page.locator('.right-panel').getByRole('button', { name: '工作历史 · 2', exact: true }).click()
|
||||
await expect(page.locator('.right-panel [data-card-id="older"]').getByText('保留参数表', { exact: true })).toBeVisible()
|
||||
await expect(page.locator('.right-panel [data-card-id="older"]').getByRole('textbox')).toHaveCount(0)
|
||||
expect(state.errors).toEqual([])
|
||||
})
|
||||
|
||||
test('keeps real summary and details accessible with right pane closed', async ({ page }) => {
|
||||
const state = await fixture(page)
|
||||
await expect(page.locator('.right-panel')).toBeHidden()
|
||||
await expect(page.getByText('核对会议结论', { exact: true }).first()).toBeVisible()
|
||||
await expect(page.getByText('private-material-key')).toHaveCount(0)
|
||||
await page.locator('[data-conversation-work]').getByRole('button', { name: '查看依据与范围', exact: true }).click()
|
||||
await page.locator('[data-conversation-work]').getByRole('button', { name: '查看执行记录', exact: true }).click()
|
||||
await expect(page.locator('[data-conversation-work]').getByText('private-material-key')).toBeVisible()
|
||||
await state.emit('card.status', { cardId: 'work1', status: 'done' }, 12)
|
||||
await state.emit('card.status', { cardId: 'work1', status: 'active' }, 11)
|
||||
await expect(page.locator('[data-conversation-work] .acard-status')).toHaveText('已完成')
|
||||
expect(state.errors).toEqual([])
|
||||
})
|
||||
|
||||
test('places the full work card only in the desktop work pane', async ({ page }) => {
|
||||
await page.setViewportSize({ width: 1440, height: 960 })
|
||||
const state = await fixture(page)
|
||||
await page.getByRole('button', { name: '打开工作', exact: true }).click()
|
||||
await expect(page.locator('.right-panel .acard')).toHaveCount(1)
|
||||
await expect(page.locator('[data-conversation-work] .acard')).toHaveCount(0)
|
||||
await expect(page.locator('[data-conversation-work]')).toHaveCount(0)
|
||||
await expect(page.locator('.companion-topbar').getByRole('button', { name: '打开工作' })).toHaveCount(0)
|
||||
await expect(page.locator('.right-panel').getByRole('button', { name: /工作/ }).first()).toBeVisible()
|
||||
if (process.env.WORK_COMPANION_SCREENSHOT) await page.screenshot({ path: process.env.WORK_COMPANION_SCREENSHOT, fullPage: true })
|
||||
expect(state.errors).toEqual([])
|
||||
})
|
||||
|
||||
test('uses a focused reading column and a compact authored-message shape', async ({ page }) => {
|
||||
await page.setViewportSize({ width: 1920, height: 1080 })
|
||||
const state = await fixture(page)
|
||||
await page.getByRole('button', { name: '打开工作', exact: true }).click()
|
||||
|
||||
const conversation = page.locator('.chat-body .msg').first()
|
||||
const authored = page.locator('.chat-body .msg.user').first()
|
||||
const answer = page.locator('.chat-body .msg.assistant').first()
|
||||
const [conversationBox, authoredBox, answerBox] = await Promise.all([
|
||||
conversation.boundingBox(), authored.boundingBox(), answer.boundingBox(),
|
||||
])
|
||||
expect(conversationBox).not.toBeNull()
|
||||
expect(authoredBox).not.toBeNull()
|
||||
expect(answerBox).not.toBeNull()
|
||||
expect(conversationBox!.width).toBeLessThanOrEqual(840)
|
||||
expect(authoredBox!.width).toBeLessThanOrEqual(680)
|
||||
expect(authoredBox!.x + authoredBox!.width).toBeCloseTo(answerBox!.x + answerBox!.width, 0)
|
||||
|
||||
const surfaces = await page.evaluate(() => {
|
||||
const pick = (selector: string) => {
|
||||
const element = document.querySelector(selector)
|
||||
if (!element) throw new Error(`missing ${selector}`)
|
||||
const style = getComputedStyle(element)
|
||||
return {
|
||||
background: style.backgroundColor,
|
||||
color: style.color,
|
||||
borderRadius: Number.parseFloat(style.borderRadius),
|
||||
paddingLeft: Number.parseFloat(style.paddingLeft),
|
||||
}
|
||||
}
|
||||
return {
|
||||
chrome: pick('.companion-topbar'),
|
||||
context: pick('.left-nav'),
|
||||
conversation: pick('.main'),
|
||||
answer: pick('.msg.assistant'),
|
||||
authored: pick('.msg.user .bubble'),
|
||||
}
|
||||
})
|
||||
const rgb = (value: string) => value.match(/[\d.]+/g)?.slice(0, 3).map(Number) ?? [0, 0, 0]
|
||||
const distance = (a: string, b: string) => rgb(a).reduce((sum, value, index) => sum + Math.abs(value - rgb(b)[index]), 0)
|
||||
expect(distance(surfaces.chrome.background, surfaces.conversation.background)).toBeGreaterThan(300)
|
||||
expect(distance(surfaces.context.background, surfaces.conversation.background)).toBeGreaterThan(300)
|
||||
expect(distance(surfaces.authored.background, surfaces.answer.background)).toBeGreaterThan(300)
|
||||
expect(surfaces.answer.borderRadius).toBeGreaterThanOrEqual(12)
|
||||
expect(surfaces.answer.paddingLeft).toBeGreaterThanOrEqual(20)
|
||||
|
||||
const activeCard = page.locator('.right-panel .acard.status-active')
|
||||
await expect(activeCard).toBeVisible()
|
||||
const cardStyle = await activeCard.evaluate(element => {
|
||||
const style = getComputedStyle(element)
|
||||
return { background: style.backgroundColor, borderLeftWidth: style.borderLeftWidth }
|
||||
})
|
||||
const panelBackground = await page.locator('.right-panel').evaluate(element => getComputedStyle(element).backgroundColor)
|
||||
expect(cardStyle.background).not.toBe(panelBackground)
|
||||
expect(Number.parseFloat(cardStyle.borderLeftWidth)).toBeGreaterThanOrEqual(3)
|
||||
expect(state.errors).toEqual([])
|
||||
})
|
||||
|
||||
for (const theme of ['light', 'dark', 'molv'] as const) {
|
||||
test(`keeps the workbench frame legible in ${theme}`, async ({ page }) => {
|
||||
await page.setViewportSize({ width: 1440, height: 960 })
|
||||
const state = await fixture(page, [progress], 14, undefined, theme)
|
||||
await page.getByRole('button', { name: '打开工作', exact: true }).click()
|
||||
const surfaces = await page.evaluate(() => ['.companion-topbar', '.left-nav', '.msg.user .bubble', '.msg.assistant'].map(selector => {
|
||||
const element = document.querySelector(selector)
|
||||
if (!element) throw new Error(`missing ${selector}`)
|
||||
const style = getComputedStyle(element)
|
||||
return { selector, foreground: style.color, background: style.backgroundColor }
|
||||
}))
|
||||
const channels = (value: string) => value.match(/[\d.]+/g)?.slice(0, 3).map(Number) ?? [0, 0, 0]
|
||||
const luminance = (value: string) => {
|
||||
const linear = channels(value).map(channel => {
|
||||
const normalized = channel / 255
|
||||
return normalized <= 0.04045 ? normalized / 12.92 : ((normalized + 0.055) / 1.055) ** 2.4
|
||||
})
|
||||
return 0.2126 * linear[0] + 0.7152 * linear[1] + 0.0722 * linear[2]
|
||||
}
|
||||
for (const surface of surfaces) {
|
||||
const lighter = Math.max(luminance(surface.foreground), luminance(surface.background))
|
||||
const darker = Math.min(luminance(surface.foreground), luminance(surface.background))
|
||||
expect((lighter + 0.05) / (darker + 0.05), `${surface.selector} contrast in ${theme}`).toBeGreaterThanOrEqual(4.5)
|
||||
}
|
||||
expect(state.errors).toEqual([])
|
||||
})
|
||||
}
|
||||
|
||||
test('preserves the selected material, physical scroll and focus when background work finishes', async ({ page }) => {
|
||||
await page.setViewportSize({ width: 1440, height: 960 })
|
||||
const tabbed = work('work1', 'active', { body: [...progress.body!, {
|
||||
type: 'tabs', id: 'materials', tabs: { tabs: [
|
||||
{ id: 'first', label: '第一份材料', nodes: [{ type: 'markdown', markdown: '第一份材料的范围' }] },
|
||||
{ id: 'second', label: '第二份材料', nodes: [{ type: 'markdown', markdown: Array.from({ length: 70 }, (_, i) => `待核对事项 ${i + 1}`).join('\n\n') }] },
|
||||
] },
|
||||
}] })
|
||||
const state = await fixture(page, [tabbed, work('peer', 'active', { body: [] })])
|
||||
await page.getByRole('button', { name: '打开工作', exact: true }).click()
|
||||
const card = page.locator('.right-panel [data-card-id="work1"]')
|
||||
await card.getByRole('button', { name: '查看依据与范围', exact: true }).click()
|
||||
const tab = card.getByRole('tab', { name: '第二份材料', exact: true })
|
||||
await tab.click()
|
||||
await tab.focus()
|
||||
const details = card.locator('.acard-detail-body')
|
||||
await expect.poll(() => details.evaluate(element => element.clientHeight)).toBe(420)
|
||||
const physical = await details.evaluate(element => {
|
||||
Object.assign(window, { __workReading: element })
|
||||
element.scrollTop = 137
|
||||
return { height: element.clientHeight, scrollHeight: element.scrollHeight, top: element.scrollTop }
|
||||
})
|
||||
expect(physical.scrollHeight).toBeGreaterThan(physical.height)
|
||||
expect(physical.top).toBe(137)
|
||||
await state.emit('card.status', { cardId: 'work1', status: 'done' }, 12)
|
||||
await expect(card.locator('.acard-status')).toHaveText('已完成')
|
||||
await expect(tab).toHaveAttribute('aria-selected', 'true')
|
||||
expect(await details.evaluate(element => ({
|
||||
retained: (window as typeof window & { __workReading: Element }).__workReading === element,
|
||||
top: element.scrollTop,
|
||||
}))).toEqual({ retained: true, top: 137 })
|
||||
expect(await tab.evaluate(element => document.activeElement === element)).toBe(true)
|
||||
expect(state.errors).toEqual([])
|
||||
})
|
||||
|
||||
test('keeps one confirmation action location when the work pane is visible', async ({ page }) => {
|
||||
const state = await fixture(page, [confirmation])
|
||||
await page.getByRole('button', { name: '打开工作', exact: true }).click()
|
||||
state.hold()
|
||||
await expect(page.locator('[data-conversation-work]')).toHaveCount(0)
|
||||
await page.locator('.right-panel').getByRole('button', { name: '确认生成', exact: true }).click()
|
||||
await expect(page.locator('.right-panel').getByRole('button', { name: '确认生成', exact: true })).toBeDisabled()
|
||||
await expect(page.locator('.chat-body').getByRole('button', { name: '确认生成', exact: true })).toHaveCount(0)
|
||||
expect(state.actionCount).toBe(1)
|
||||
state.release()
|
||||
await expect(page.getByRole('button', { name: '确认生成', exact: true })).toHaveCount(0)
|
||||
expect(state.errors).toEqual([])
|
||||
})
|
||||
|
||||
test('keeps each run process folded and reloadable after the final reply', async ({ page }) => {
|
||||
const event = (seq: number, type: StreamEvent['type'], payload: unknown): StreamEvent =>
|
||||
({ seq, type, payload, runId: 'run-history', conversationId: 'c1', ts: stamp, v: 1 })
|
||||
const events = [
|
||||
event(1, 'thinking.delta', { index: 0, text: '先核对日期' }),
|
||||
event(2, 'message.delta', { index: 0, text: '开始读取材料' }),
|
||||
event(3, 'tool.call', { callId: 'call-1', name: 'run_shell', arguments: '{"command":"read"}' }),
|
||||
event(4, 'tool.output', { callId: 'call-1', text: '完整工具输出' }),
|
||||
event(5, 'tool.result', { callId: 'call-1', status: 'ok', summary: '读取成功' }),
|
||||
event(6, 'run.phase', { phase: 'finalizing' }),
|
||||
event(7, 'message.delta', { index: 1, text: '最终回复已完成' }),
|
||||
]
|
||||
const state = await fixture(page, [], 14, { events })
|
||||
const message = page.locator('[data-msg-id="m4"]')
|
||||
await expect(message.getByText('最终回复已完成')).toBeVisible()
|
||||
await expect(message.getByText('开始读取材料')).toHaveCount(0)
|
||||
await message.getByRole('button', { name: /执行记录/ }).click()
|
||||
await expect(message.getByText('先核对日期')).toBeVisible()
|
||||
await expect(message.getByText('开始读取材料')).toBeVisible()
|
||||
await message.locator('.tool-block-head').click()
|
||||
await expect(message.getByText('完整工具输出')).toBeVisible()
|
||||
await page.reload()
|
||||
const restored = page.locator('[data-msg-id="m4"]')
|
||||
await expect(restored.getByText('最终回复已完成')).toBeVisible()
|
||||
await restored.getByRole('button', { name: /执行记录/ }).click()
|
||||
await expect(restored.getByText('先核对日期')).toBeVisible()
|
||||
await restored.locator('.tool-block-head').click()
|
||||
await expect(restored.getByText('完整工具输出')).toBeVisible()
|
||||
expect(state.errors).toEqual([])
|
||||
})
|
||||
|
||||
test('replay enriches saved notes and keeps collaboration progress after completion', async ({ page }) => {
|
||||
const event = (seq: number, type: StreamEvent['type'], payload: unknown, runId = 'run-history'): StreamEvent =>
|
||||
({ seq, type, payload, runId, conversationId: 'c1', ts: stamp, v: 1 })
|
||||
const events = [
|
||||
event(1, 'message.delta', { index: 0, text: '<think>已解析的思考</think>' }),
|
||||
event(2, 'message.delta', { index: 1, text: '开始读取' }),
|
||||
event(3, 'tool.call', { callId: 'call-1', name: 'run_shell', arguments: '{"command":"read"}' }),
|
||||
event(4, 'tool.output', { callId: 'call-1', text: '完整输出留存' }),
|
||||
event(5, 'tool.result', { callId: 'call-1', status: 'ok', summary: '读取成功' }),
|
||||
event(6, 'agent.spawn', { agentRun: 'child', name: '资料核对', task: '读附录' }),
|
||||
event(7, 'run.phase', { phase: 'finalizing' }),
|
||||
event(8, 'message.delta', { index: 1, text: '最终回复已完成' }),
|
||||
event(9, 'agent.progress', { agentRun: 'child', note: '正在核对附录' }, 'child'),
|
||||
event(10, 'agent.result', { agentRun: 'child', status: 'completed', summary: '附录已核对' }, 'child'),
|
||||
]
|
||||
const savedParts: Part[] = [
|
||||
{ type: 'text', process: true, text: '模型在输出前失败,正在重试' },
|
||||
{ type: 'thinking', process: true, text: '已解析的思考' },
|
||||
{ type: 'text', process: true, text: '开始读取材料' },
|
||||
{ type: 'tool_call', process: true, toolCall: { id: 'call-1', name: 'run_shell' } },
|
||||
{ type: 'tool_result', process: true, toolResult: { callId: 'call-1', status: 'ok' } },
|
||||
{ type: 'text', text: '最终回复已完成' },
|
||||
]
|
||||
await fixture(page, [], 14, { events, savedParts })
|
||||
const message = page.locator('[data-msg-id="m4"]')
|
||||
await message.getByRole('button', { name: /执行记录/ }).click()
|
||||
await expect(message.getByText('模型在输出前失败,正在重试')).toBeVisible()
|
||||
await expect(message.getByText('已解析的思考')).toBeVisible()
|
||||
await expect(message.getByText('开始读取材料')).toBeVisible()
|
||||
await expect(message.getByText('开始读取', { exact: true })).toHaveCount(0)
|
||||
await expect(message.getByText('协作进展:正在核对附录')).toBeVisible()
|
||||
await expect(message.getByText('协作结束:附录已核对')).toBeVisible()
|
||||
await expect(message.getByText('<think>已解析的思考</think>')).toHaveCount(0)
|
||||
await message.locator('.tool-block-head').click()
|
||||
await expect(message.getByText('完整输出留存')).toBeVisible()
|
||||
})
|
||||
|
||||
test('keeps a child completion note when the final reply uses the same status words', async ({ page }) => {
|
||||
const event = (seq: number, type: StreamEvent['type'], payload: unknown, runId = 'run-history'): StreamEvent =>
|
||||
({ seq, type, payload, runId, conversationId: 'c1', ts: stamp, v: 1 })
|
||||
await fixture(page, [], 14, { events: [
|
||||
event(1, 'agent.spawn', { agentRun: 'child', name: '资料核对', task: '读附录' }),
|
||||
event(2, 'run.phase', { phase: 'finalizing' }),
|
||||
event(3, 'message.delta', { index: 0, text: '已完成' }),
|
||||
event(4, 'agent.result', { agentRun: 'child', status: 'completed', summary: '已完成' }, 'child'),
|
||||
], savedParts: [{ type: 'text', process: true, text: '记录已完成' }, { type: 'text', text: '已完成' }] })
|
||||
const message = page.locator('[data-msg-id="m4"]')
|
||||
await message.getByRole('button', { name: /执行记录/ }).click()
|
||||
await expect(message.getByText('协作结束:已完成')).toBeVisible()
|
||||
})
|
||||
|
||||
test('locates a completed card even when work is filtered to project pending items', async ({ page }) => {
|
||||
const result = work('result1', 'done', { kind: 'result', title: '材料核对结果',
|
||||
body: [{ type: 'markdown', markdown: '完整结论在这里' }] })
|
||||
await fixture(page, [result], 14, { events: [], cardRef: 'result1' })
|
||||
await page.getByRole('button', { name: '打开工作', exact: true }).click()
|
||||
const workPane = page.locator('.right-panel')
|
||||
await workPane.locator('.inbox-scope').getByRole('button', { name: '项目' }).click()
|
||||
await workPane.locator('.inbox-scope').getByRole('button', { name: '待处理' }).click()
|
||||
await expect(workPane.getByText('完整结论在这里')).toHaveCount(0)
|
||||
await page.locator('[data-msg-id="m4"] .card-anchor-locate').click()
|
||||
await expect(workPane.getByText('完整结论在这里')).toBeVisible()
|
||||
await expect(workPane.locator('.inbox-scope').getByRole('button', { name: '本会话' })).toHaveClass(/active/)
|
||||
await expect(workPane.locator('.inbox-scope').getByRole('button', { name: '全部' })).toHaveClass(/active/)
|
||||
})
|
||||
|
||||
test('opens the one file preview and preserves reading during background updates', async ({ page }) => {
|
||||
const result = work('result1', 'done', { kind: 'result', title: '材料摘要已准备好', body: [{ type: 'doc-ref', docId: 'doc1' }] })
|
||||
const state = await fixture(page, [result])
|
||||
await page.locator('[data-conversation-work]').getByText(artifact.name, { exact: true }).click()
|
||||
await expect(page.locator('.preview-pane-name')).toHaveText(artifact.name)
|
||||
await expect(page.locator('.preview-pane-body')).toContainText('评审意见仍待核对')
|
||||
await state.emit('surface.updated', { identity: { surfaceId: 'new-page', owner: 'reader', pluginId: 'generative-ui', conversationId: 'c1' }, revision: 1, activationEpoch: 0, compat: { schemaVersion: 1, catalogVersion: '1' }, spec: { title: '新任务页面', nodes: [] } }, 11)
|
||||
await expect(page.locator('.preview-pane-name')).toHaveText(artifact.name)
|
||||
await page.getByRole('button', { name: '展开预览', exact: true }).click()
|
||||
await expect(page.locator('.main')).toBeHidden()
|
||||
await page.getByRole('button', { name: '返回对话', exact: true }).click()
|
||||
await expect(page.locator('.main')).toBeVisible()
|
||||
expect(state.errors).toEqual([])
|
||||
})
|
||||
|
||||
test('sends three attachments without text and states foreground queueing truthfully', async ({ page }) => {
|
||||
const state = await fixture(page, [])
|
||||
await page.locator('input[type=file]').first().setInputFiles([
|
||||
{ name: '会议纪要.txt', mimeType: 'text/plain', buffer: Buffer.from('会议内容') },
|
||||
{ name: '需求说明.txt', mimeType: 'text/plain', buffer: Buffer.from('需求内容') },
|
||||
{ name: '评审意见.txt', mimeType: 'text/plain', buffer: Buffer.from('评审内容') },
|
||||
])
|
||||
await expect(page.locator('.attach-chip')).toHaveCount(3)
|
||||
await page.getByRole('button', { name: '发送', exact: true }).click()
|
||||
await expect.poll(() => state.sent?.attachmentIds.length).toBe(3)
|
||||
expect(state.sent?.text).toBe('')
|
||||
await page.getByRole('textbox', { name: '工作目标或消息', exact: true }).fill('请优先核对时间安排')
|
||||
await expect(page.getByRole('button', { name: '加入队列', exact: true })).toBeEnabled()
|
||||
await page.getByRole('button', { name: '加入队列', exact: true }).click()
|
||||
await expect(page.getByText('请优先核对时间安排', { exact: true })).toBeVisible()
|
||||
await expect(page.locator('.input-status')).toContainText('排队')
|
||||
expect(state.errors).toEqual([])
|
||||
})
|
||||
|
||||
for (const width of [1440, 1024, 736, 390, 320]) {
|
||||
test(`keeps navigation and key actions usable at ${width}px with large UI type`, async ({ page }) => {
|
||||
await page.setViewportSize({ width, height: 960 })
|
||||
const state = await fixture(page, [progress], 18)
|
||||
await page.getByRole('button', { name: '打开工作', exact: true }).click()
|
||||
await expect(page.locator('.right-panel')).toBeVisible()
|
||||
await expect(page.locator('.right-panel').getByText('评审意见仍待核查')).toBeVisible()
|
||||
if (width < 1024) {
|
||||
await page.getByRole('button', { name: '返回对话', exact: true }).click()
|
||||
await expect(page.locator('.main')).toBeVisible()
|
||||
await page.getByRole('button', { name: '打开上下文', exact: true }).click()
|
||||
await expect(page.getByRole('button', { name: '新建对话', exact: true })).toBeVisible()
|
||||
await page.getByRole('button', { name: '返回对话', exact: true }).click()
|
||||
}
|
||||
const layout = await page.evaluate(() => ({ width: document.documentElement.clientWidth, scroll: document.documentElement.scrollWidth }))
|
||||
expect(layout.scroll).toBeLessThanOrEqual(layout.width)
|
||||
expect(state.errors).toEqual([])
|
||||
})
|
||||
}
|
||||
@@ -0,0 +1,3 @@
|
||||
{
|
||||
"exports": 51
|
||||
}
|
||||
@@ -0,0 +1,4 @@
|
||||
{
|
||||
"entry": ["src/main.tsx", "src/**/*.test.ts", "src/**/*.test.tsx", "test/**/*.ts", "test/**/*.tsx"],
|
||||
"project": ["src/**/*.{ts,tsx}"]
|
||||
}
|
||||
Generated
+861
File diff suppressed because it is too large
Load Diff
+5
-1
@@ -7,10 +7,12 @@
|
||||
"dev": "vite",
|
||||
"build": "tsc -b && vite build",
|
||||
"test": "vitest run",
|
||||
"preview": "vite preview"
|
||||
"preview": "vite preview",
|
||||
"e2e": "playwright test"
|
||||
},
|
||||
"dependencies": {
|
||||
"docx-preview": "^0.4.1",
|
||||
"dompurify": "^3.4.16",
|
||||
"jszip": "^3.10.2",
|
||||
"mammoth": "^1.13.0",
|
||||
"marked": "^15.0.7",
|
||||
@@ -20,10 +22,12 @@
|
||||
"xlsx": "^0.18.5"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@playwright/test": "^1.50.1",
|
||||
"@types/node": "^22.20.4",
|
||||
"@types/react": "^19.2.0",
|
||||
"@types/react-dom": "^19.2.0",
|
||||
"@vitejs/plugin-react": "^4.3.4",
|
||||
"knip": "^5.88.1",
|
||||
"typescript": "^5.7.3",
|
||||
"vite": "^6.0.11",
|
||||
"vitest": "^4.1.11"
|
||||
|
||||
@@ -0,0 +1,20 @@
|
||||
// U4 运行验收(Playwright):真实浏览器走通追溯审计工作区四入口。
|
||||
// 由 Dev 仓 scripts/e2e.sh 驱动(起 RDM 二进制 + preview 静态前端 + 种子数据);
|
||||
// PLAYWRIGHT_BASE_URL 未设置时整组跳过(CI 单测档不拉浏览器)。
|
||||
import { defineConfig } from '@playwright/test'
|
||||
|
||||
const base = process.env.PLAYWRIGHT_BASE_URL || ''
|
||||
|
||||
export default defineConfig({
|
||||
testDir: 'e2e',
|
||||
testMatch: /.*(spec|playwright)\.ts$/,
|
||||
timeout: 30_000,
|
||||
retries: 0,
|
||||
workers: 1,
|
||||
reporter: [['list']],
|
||||
use: {
|
||||
baseURL: base,
|
||||
locale: 'zh-CN',
|
||||
trace: 'retain-on-failure',
|
||||
},
|
||||
})
|
||||
@@ -0,0 +1,23 @@
|
||||
import { readFileSync } from 'node:fs'
|
||||
import { spawnSync } from 'node:child_process'
|
||||
|
||||
const run = spawnSync('npx', ['knip', '--reporter', 'json', '--include', 'exports,nsExports,types,nsTypes'], {
|
||||
encoding: 'utf8',
|
||||
})
|
||||
if (!run.stdout) {
|
||||
process.stderr.write(run.stderr || 'knip produced no output\n')
|
||||
process.exit(1)
|
||||
}
|
||||
const data = JSON.parse(run.stdout)
|
||||
let count = 0
|
||||
for (const issue of data.issues ?? []) {
|
||||
for (const key of ['exports', 'types', 'nsExports', 'nsTypes']) {
|
||||
count += (issue[key] ?? []).length
|
||||
}
|
||||
}
|
||||
const limit = JSON.parse(readFileSync(new URL('../knip-baseline.json', import.meta.url))).exports
|
||||
if (count > limit) {
|
||||
console.error(`knip unused exports ${count} exceed baseline ${limit}`)
|
||||
process.exit(1)
|
||||
}
|
||||
console.log(`knip unused exports ${count} <= ${limit}`)
|
||||
+143
-75
@@ -8,47 +8,100 @@ import { Icon } from '@ui'
|
||||
import { store, useStore } from './store'
|
||||
import { TaskSidebar } from './components/TaskSidebar'
|
||||
import { Conversation } from './components/Conversation'
|
||||
import { PreviewPane } from './components/PreviewPane'
|
||||
import { previewTabsKey } from './previewtabs'
|
||||
import { Workbench } from './components/Workbench'
|
||||
import { Workspaces, workspaceShortcuts } from './components/Workspaces'
|
||||
import { AgentTracker } from './components/AgentTracker'
|
||||
import { SettingsModal } from './components/SettingsModal'
|
||||
import { ProjectSettingsModal } from './components/ProjectSettingsModal'
|
||||
import { DocViewer } from './components/DocViewer'
|
||||
import { TopBar } from './components/TopBar'
|
||||
import { workspaceEntries } from './components/Workspaces'
|
||||
import { selectWorkbenchLayout } from './workbenchLayout'
|
||||
import './companion-shell.css'
|
||||
|
||||
// 布局:左(项目会话)/ 中(对话)/ 预览区(有标签时)/ 右(工作台)。
|
||||
// 布局(三栏工作台):左(项目与会话)/ 中(对话)/ 第三栏(工作|文件双入口)。
|
||||
// 文件预览不再是独立第四栏——预览在第三栏「文件」入口内,展开态铺满主区。
|
||||
const LEFT_MIN = 220, LEFT_MAX = 420, LEFT_OVERSHOOT = 40
|
||||
const RIGHT_MIN = 280, RIGHT_MAX = 560
|
||||
const PREVIEW_MIN = 420, PREVIEW_MAX = 1100
|
||||
|
||||
export function App() {
|
||||
useEffect(() => {
|
||||
const h = (e: KeyboardEvent) => workspaceShortcuts(e)
|
||||
window.addEventListener('keydown', h, true)
|
||||
return () => window.removeEventListener('keydown', h, true)
|
||||
}, [])
|
||||
|
||||
const ui = useStore(s => s.ui)
|
||||
const previewOpen = useStore(s => {
|
||||
const id = s.currentConvId
|
||||
return id ? (s.previewTabs[id]?.length ?? 0) > 0 : false
|
||||
})
|
||||
// 预览键与 requestPreview 的落点一致(previewTabsKey):空态(未选会话)点开
|
||||
// 工件也要能进文件入口,否则点击只剩工件弹层关闭、毫无反馈。
|
||||
const previewOpen = useStore(s => (s.previewTabs[previewTabsKey(s.currentConvId)]?.length ?? 0) > 0)
|
||||
const previewOpenIntent = useStore(s => s.previewOpenIntent)
|
||||
const rightTab = useStore(s => s.ui.rightTab)
|
||||
const toast = useStore(s => s.toast)
|
||||
const trackerRunId = useStore(s => s.ui.trackerRunId)
|
||||
const viewingArtifact = useStore(s => s.ui.viewingArtifact)
|
||||
// 文件入口 + 预览标签在场时,第三栏用「阅读档」宽度(420–1100),不受工作档上限约束。
|
||||
const filesWide = rightTab === 'files' && ui.filesView === 'preview' && previewOpen
|
||||
const [viewportWidth, setViewportWidth] = useState(() => typeof window === 'undefined' ? 1440 : window.innerWidth)
|
||||
const [contextOpen, setContextOpen] = useState(false)
|
||||
const layout = selectWorkbenchLayout({ ...ui, width: viewportWidth, contextOpen, previewOpen })
|
||||
const pendingBadge = useStore(s => s.cards.filter(c => c.status === 'action_required').length)
|
||||
// authState:checking → login(登录)→ mustchange(首登强制改密)→ ok(放行)。
|
||||
const [authState, setAuthState] = useState<'checking' | 'login' | 'mustchange' | 'ok'>('checking')
|
||||
const [mustChangeOwner, setMustChangeOwner] = useState('')
|
||||
|
||||
useEffect(() => {
|
||||
const onResize = () => setViewportWidth(window.innerWidth)
|
||||
window.addEventListener('resize', onResize)
|
||||
return () => window.removeEventListener('resize', onResize)
|
||||
}, [])
|
||||
|
||||
// Explicit openings leave mobile context even if pane values match; metadata restores keep the reading choice.
|
||||
useEffect(() => { setContextOpen(false) }, [ui.rightCollapsed, rightTab, ui.filesView, ui.previewExpanded, previewOpenIntent])
|
||||
useEffect(() => { if (!layout.compact) setContextOpen(false) }, [layout.compact])
|
||||
|
||||
const returnToConversation = () => {
|
||||
setContextOpen(false)
|
||||
store.setUI(layout.compact ? { rightCollapsed: true, previewExpanded: false } : { previewExpanded: false })
|
||||
}
|
||||
const openContext = () => {
|
||||
if (!layout.compact) store.toggleLeft()
|
||||
else if (contextOpen) returnToConversation()
|
||||
else setContextOpen(true)
|
||||
}
|
||||
const openWork = () => {
|
||||
setContextOpen(false)
|
||||
store.openInbox()
|
||||
store.setUI({ inboxFilter: 'all', previewExpanded: false })
|
||||
}
|
||||
const openPending = () => { setContextOpen(false); store.focusPending() }
|
||||
const openFiles = () => { setContextOpen(false); store.openFiles() }
|
||||
const conversationOpened = () => { if (layout.compact) returnToConversation() }
|
||||
|
||||
// Keep conversation/context shortcuts available even when their pane is hidden.
|
||||
useEffect(() => {
|
||||
const h = (e: KeyboardEvent) => {
|
||||
if (authState === 'ok' && (e.metaKey || e.ctrlKey)) {
|
||||
const key = e.key.toLowerCase()
|
||||
if (key === 'n') { e.preventDefault(); store.createTask().then(conversationOpened).catch(() => undefined); return }
|
||||
if (key === 'b') { e.preventDefault(); openContext(); return }
|
||||
}
|
||||
workspaceShortcuts(e)
|
||||
}
|
||||
window.addEventListener('keydown', h, true)
|
||||
return () => window.removeEventListener('keydown', h, true)
|
||||
}, [authState, layout.compact, contextOpen])
|
||||
|
||||
useEffect(() => {
|
||||
;(async () => {
|
||||
try {
|
||||
const r = await auth.fetch('/api/health')
|
||||
if (r.status === 401) { setAuthState('login'); return }
|
||||
// 已持有有效会话 cookie(或密钥)时直接放行;会话携带 must_change 时先进改密门。
|
||||
// 已持有有效会话 cookie(或密钥)时直接放行。设密门依据 sessionScope 判定
|
||||
//(2026-10-13 合同):恢复 Key 兑换与 must-change 首登都建立
|
||||
// set_password_only 受限会话,仅看 mustChangePassword 会漏掉已有密码的
|
||||
// 恢复会话。改密接口只认会话登录:API key 凭证进改密门是死路(提交必
|
||||
// 401),key 持有者清 key 回登录页,改走密码登录完成改密。
|
||||
const me = await api.me().catch(() => null)
|
||||
if (me?.mustChangePassword) { setMustChangeOwner(me.owner); setAuthState('mustchange'); return }
|
||||
const gated = me?.sessionScope === 'set_password_only' || me?.mustChangePassword
|
||||
if (gated) {
|
||||
if (me.authVia === 'key') { auth.clear(); setAuthState('login'); return }
|
||||
setMustChangeOwner(me.owner); setAuthState('mustchange'); return
|
||||
}
|
||||
setAuthState('ok')
|
||||
} catch {
|
||||
setAuthState('ok') // 网络异常不是认证问题;放行交给业务层报错
|
||||
@@ -58,33 +111,44 @@ export function App() {
|
||||
|
||||
useEffect(() => {
|
||||
if (authState !== 'ok') return
|
||||
store.refreshProjects()
|
||||
store.refreshProfiles()
|
||||
store.refreshPlugins()
|
||||
// me 回填进 store:管理入口(me?.isAdmin)与侧栏身份都消费它;此前只有
|
||||
// 改密门 onDone 调 refreshMe,登录与刷新回态后 me 恒为 null,管理员菜单
|
||||
// 在任何一次 F5 后永久消失(2026-10-12「用户管理页面不可用」根因)。
|
||||
let active = true
|
||||
store.refreshMe().then(() => {
|
||||
if (!active) return
|
||||
void store.refreshProjects()
|
||||
void store.refreshProfiles()
|
||||
void store.refreshPlugins()
|
||||
})
|
||||
return () => { active = false }
|
||||
}, [authState])
|
||||
|
||||
const drag = useRef<{ side: 'left' | 'right' | 'preview'; startX: number; startW: number; overshoot: boolean } | null>(null)
|
||||
const drag = useRef<{ side: 'left' | 'right'; startX: number; startW: number; overshoot: boolean; min: number; max: number; key: 'leftWidth' | 'rightWidth' | 'previewWidth' } | null>(null)
|
||||
|
||||
const onDividerDown = (side: 'left' | 'right' | 'preview') => (e: React.MouseEvent) => {
|
||||
const onDividerDown = (side: 'left' | 'right') => (e: React.MouseEvent) => {
|
||||
e.preventDefault()
|
||||
const startW = side === 'left' ? ui.leftWidth : side === 'preview' ? ui.previewWidth : ui.rightWidth
|
||||
drag.current = { side, startX: e.clientX, startW, overshoot: false }
|
||||
// 右侧分隔条按当前入口选宽度档:文件+预览在场走阅读档,否则工作档。
|
||||
const wide = side === 'right' && filesWide
|
||||
const key = side === 'left' ? 'leftWidth' : wide ? 'previewWidth' : 'rightWidth'
|
||||
drag.current = {
|
||||
side, startX: e.clientX, startW: side === 'left' ? layout.leftWidth : layout.rightWidth, overshoot: false,
|
||||
min: side === 'left' ? LEFT_MIN : wide ? PREVIEW_MIN : RIGHT_MIN,
|
||||
max: side === 'left' ? LEFT_MAX : wide ? PREVIEW_MAX : RIGHT_MAX,
|
||||
key,
|
||||
}
|
||||
const move = (ev: MouseEvent) => {
|
||||
const d = drag.current
|
||||
if (!d) return
|
||||
if (d.side === 'left') {
|
||||
const w = d.startW + (ev.clientX - d.startX)
|
||||
if (w < LEFT_MIN - LEFT_OVERSHOOT) { d.overshoot = true; return }
|
||||
if (w < d.min - LEFT_OVERSHOOT) { d.overshoot = true; return }
|
||||
d.overshoot = false
|
||||
store.setUI({ leftCollapsed: false, leftWidth: Math.min(LEFT_MAX, Math.max(LEFT_MIN, w)) })
|
||||
} else if (d.side === 'preview') {
|
||||
const w = d.startW - (ev.clientX - d.startX)
|
||||
if (w < PREVIEW_MIN) return
|
||||
store.setUI({ previewWidth: Math.min(PREVIEW_MAX, w) })
|
||||
store.setUI({ leftCollapsed: false, leftWidth: Math.min(d.max, Math.max(d.min, w)) })
|
||||
} else {
|
||||
const w = d.startW - (ev.clientX - d.startX)
|
||||
if (w < RIGHT_MIN) return
|
||||
store.setUI({ rightCollapsed: false, rightWidth: Math.min(RIGHT_MAX, w) })
|
||||
if (w < d.min) return
|
||||
store.setUI({ rightCollapsed: false, [d.key]: Math.min(d.max, w) } as Partial<typeof ui>)
|
||||
}
|
||||
}
|
||||
const up = () => {
|
||||
@@ -98,80 +162,84 @@ export function App() {
|
||||
window.addEventListener('mouseup', up)
|
||||
}
|
||||
|
||||
const onDividerKey = (side: 'left' | 'right') => (e: React.KeyboardEvent) => {
|
||||
if (e.key !== 'ArrowLeft' && e.key !== 'ArrowRight') return
|
||||
e.preventDefault()
|
||||
const wide = side === 'right' && filesWide
|
||||
const key = side === 'left' ? 'leftWidth' : wide ? 'previewWidth' : 'rightWidth'
|
||||
const min = side === 'left' ? LEFT_MIN : wide ? PREVIEW_MIN : RIGHT_MIN
|
||||
const max = side === 'left' ? LEFT_MAX : wide ? PREVIEW_MAX : RIGHT_MAX
|
||||
const current = side === 'left' ? layout.leftWidth : layout.rightWidth
|
||||
const delta = (e.key === 'ArrowRight' ? 16 : -16) * (side === 'left' ? 1 : -1)
|
||||
store.setUI({ [key]: Math.min(max, Math.max(min, current + delta)) })
|
||||
}
|
||||
|
||||
if (authState === 'login') {
|
||||
return <LoginPage
|
||||
onAuthed={() => setAuthState('ok')}
|
||||
onMustChange={owner => { setMustChangeOwner(owner); setAuthState('mustchange') }} />
|
||||
}
|
||||
if (authState === 'mustchange') {
|
||||
// 受限会话设密成功后服务端销毁全部会话并返回 reloginRequired=true:
|
||||
// 唯一后继动作是回密码登录页,不得因历史 onDone 误放行进工作台。
|
||||
return <ChangePasswordGate
|
||||
owner={mustChangeOwner}
|
||||
onDone={async () => { await store.refreshMe().catch(() => undefined); setAuthState('ok') }}
|
||||
onDone={() => { api.logout().catch(() => undefined); setAuthState('login') }}
|
||||
onCancel={() => { api.logout().catch(() => undefined); setAuthState('login') }} />
|
||||
}
|
||||
if (authState !== 'ok') {
|
||||
return <div className="login-gate"><div className="login-card"><p>连接服务中…</p></div></div>
|
||||
}
|
||||
|
||||
const tools = workspaceEntries()
|
||||
return (
|
||||
<div className="app">
|
||||
{!ui.leftCollapsed ? (
|
||||
<>
|
||||
<div className="left-nav" style={{ width: ui.leftWidth }}>
|
||||
<TaskSidebar />
|
||||
<div className={`app companion-app${layout.compact ? ' compact' : ''}`}>
|
||||
<TopBar compact={layout.compact} activePane={layout.pane} showReturn={layout.previewExpanded}
|
||||
onContext={openContext} onConversation={returnToConversation} onWork={openWork} onFiles={openFiles} />
|
||||
<div className="app-body" data-active-pane={layout.pane}>
|
||||
<aside className={`left-nav${layout.contextCollapsed ? ' collapsed' : ''}`} aria-label="上下文"
|
||||
hidden={!layout.showContext} style={{ width: layout.leftWidth }}>
|
||||
<div className="shell-context-content" hidden={layout.contextCollapsed}>
|
||||
<TaskSidebar onCollapse={layout.compact ? returnToConversation : store.toggleLeft}
|
||||
onConversationOpen={conversationOpened} onFilesOpen={openFiles} onWorkOpen={openPending} />
|
||||
</div>
|
||||
<div className="divider" onMouseDown={onDividerDown('left')} onDoubleClick={store.toggleLeft} title="拖动调整宽度;继续向左超过最小宽度后松开可收起;双击切换" />
|
||||
</>
|
||||
) : (
|
||||
<div className="left-nav collapsed" style={{ width: 52 }}>
|
||||
<div className="icon-only">
|
||||
<div className="icon-only" hidden={!layout.contextCollapsed}>
|
||||
<button title="展开侧栏(⌘B)" onClick={store.toggleLeft}><Icon name="panel-left" /></button>
|
||||
<button title="新建任务(⌘N)" onClick={() => store.createTask()}><Icon name="plus" /></button>
|
||||
<button title="收件箱" onClick={() => store.openInbox()}><Icon name="inbox" />
|
||||
<button title="新建对话(⌘N)" onClick={() => store.createTask()}><Icon name="plus" /></button>
|
||||
<button title="工作" onClick={openWork}><Icon name="inbox" />
|
||||
{pendingBadge > 0 && <span className="rail-badge" data-testid="rail-badge">{pendingBadge}</span>}
|
||||
</button>
|
||||
{tools.map(entry => (
|
||||
<button key={entry.key} title={`${entry.title}(${entry.shortcut})`} onClick={() => store.openWorkspace(entry.key)}>{entry.icon}</button>
|
||||
))}
|
||||
<button title="设置" onClick={() => store.openSettings(true)}><Icon name="settings" /></button>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</aside>
|
||||
{layout.leftDivider && <div className="divider" role="separator" tabIndex={0} aria-label="调整上下文宽度" aria-orientation="vertical"
|
||||
aria-valuemin={LEFT_MIN} aria-valuemax={LEFT_MAX} aria-valuenow={Math.round(layout.leftWidth)}
|
||||
onKeyDown={onDividerKey('left')} onMouseDown={onDividerDown('left')} onDoubleClick={store.toggleLeft}
|
||||
title="拖动或用方向键调整宽度;双击收起" />}
|
||||
|
||||
<div className="main">
|
||||
<Conversation />
|
||||
<main className="main" hidden={!layout.showConversation} aria-label="对话">
|
||||
<Conversation />
|
||||
</main>
|
||||
|
||||
{layout.rightDivider && <div className="divider" role="separator" tabIndex={0} aria-label="调整工作或文件宽度" aria-orientation="vertical"
|
||||
aria-valuemin={filesWide ? PREVIEW_MIN : RIGHT_MIN} aria-valuemax={filesWide ? PREVIEW_MAX : RIGHT_MAX}
|
||||
aria-valuenow={Math.round(layout.rightWidth)} onKeyDown={onDividerKey('right')}
|
||||
onMouseDown={onDividerDown('right')} onDoubleClick={store.toggleRight} title="拖动或用方向键调整宽度;双击收起" />}
|
||||
<aside className={`right-panel mk-panel-grow${layout.previewExpanded ? ' expanded' : ''}`}
|
||||
aria-label={rightTab === 'files' ? '文件' : '工作'} hidden={!layout.showRight} style={{ width: layout.rightWidth }}>
|
||||
<Workbench />
|
||||
</aside>
|
||||
</div>
|
||||
|
||||
{previewOpen && (
|
||||
<>
|
||||
<div className="divider" onMouseDown={onDividerDown('preview')} title="拖动调整预览区宽度" />
|
||||
<div className="preview-slot" style={{ width: ui.previewWidth }}>
|
||||
<PreviewPane />
|
||||
</div>
|
||||
</>
|
||||
)}
|
||||
|
||||
{!ui.rightCollapsed ? (
|
||||
<>
|
||||
<div className="divider" onMouseDown={onDividerDown('right')} onDoubleClick={store.toggleRight} title="拖动调整宽度;双击收起" />
|
||||
<div className="right-panel" style={{ width: ui.rightWidth }}>
|
||||
<Workbench />
|
||||
</div>
|
||||
</>
|
||||
) : (
|
||||
<div className="right-panel collapsed" style={{ width: 44 }}>
|
||||
<div className="icon-only">
|
||||
<button title="展开收件箱" onClick={store.toggleRight}>◧
|
||||
{pendingBadge > 0 && <span className="rail-badge" data-testid="rail-badge">{pendingBadge}</span>}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
<Workspaces />
|
||||
{trackerRunId && <AgentTracker />}
|
||||
{ui.settingsOpen && <SettingsModal />}
|
||||
{ui.projectSettingsId && <ProjectSettingsModal />}
|
||||
{ui.adminZoneOpen && <AdminZone />}
|
||||
{ui.changePwOpen && <ChangePasswordModal onClose={() => store.setUI({ changePwOpen: false })} />}
|
||||
{viewingArtifact && <DocViewer artifact={viewingArtifact} />}
|
||||
{toast && <div className="toast">{toast}</div>}
|
||||
</div>
|
||||
)
|
||||
|
||||
+159
-22
@@ -1,19 +1,54 @@
|
||||
// API 客户端(API-first:UI 只是第一个客户端)与 SSE 流客户端(游标重放 + 终态对账)。
|
||||
// 认证:服务端开启 API key 时经 auth.fetch/withKey 注入凭证(嵌入式档无认证则透传)。
|
||||
import { auth } from './auth'
|
||||
import { rdmCommandProjectId, rdmProjectCommandError } from './rdmManagement'
|
||||
import type {
|
||||
Project, Conversation, Message, Run, Artifact, HITLCard, HITLResponse,
|
||||
AgentProfile, SettingDesc, StreamEvent, PlanSnapshot, TodoList, UploadInfo, PromptModule,
|
||||
ActivityCard,
|
||||
AgentProfile, SettingDesc, StreamEvent, StreamEventType, PlanSnapshot, TodoList, UploadInfo, PromptModule,
|
||||
ActivityCard, SurfaceMeta, SurfaceSnapshot, WorkCardAction,
|
||||
} from './contracts'
|
||||
|
||||
const BASE = ''
|
||||
|
||||
async function json<T>(res: Response): Promise<T> {
|
||||
/** 管理区声明分区(WP3-I3/KTD4,backend 专属端点类型):编译插件经
|
||||
* Registry.AddAdminZone 声明;入口不做前端权限合并,区内数据能力由组件
|
||||
* 自身命令面 fail-closed。 */
|
||||
export interface AdminZoneSection { id: string; title: string; icon?: string; desc?: string; order?: number }
|
||||
|
||||
/** 账户链路(2026-10-13 恢复合同 + 2026-10-14 current_required 加固):
|
||||
* passwordChangeMode 由服务端从会话派生;grant_setup 与 one_time_password
|
||||
*(管理员生成的一次性登录密码会话)免当前密码,current_required(管理员
|
||||
* 指定/生成的初始密码首登)必须校验当前密码。 */
|
||||
export type PasswordChangeMode = 'grant_setup' | 'current_required' | 'one_time_password'
|
||||
|
||||
/** 账号资料与档案视图(backend accountProfileJSON 契约)。 */
|
||||
export interface AccountProfile { name: string; phone: string; email: string; staffNo: string; department: string; notes: string }
|
||||
export interface AccountRecord {
|
||||
userId: string; owner: string; profile: AccountProfile; profileVersion: number
|
||||
enabled?: boolean; stateVersion?: number; isAdmin?: boolean; passwordSet?: boolean
|
||||
initializationState?: string; initializationGeneration?: number
|
||||
}
|
||||
|
||||
export interface ExecEnvView {
|
||||
configured: boolean
|
||||
root?: string
|
||||
python?: string
|
||||
base?: string
|
||||
layers?: string[]
|
||||
requests?: { id: string; conversationId: string; owner: string; spec: string; reason: string; status: string; layerId: string; detail: string; approver: string }[]
|
||||
bindings?: { conversationId: string; baseId: string; extensions: string[] | null; isolated: string }[]
|
||||
}
|
||||
|
||||
async function checked(res: Response): Promise<Response> {
|
||||
if (!res.ok) {
|
||||
const text = await res.text()
|
||||
throw new Error(`${res.status}: ${text}`)
|
||||
}
|
||||
return res
|
||||
}
|
||||
|
||||
async function json<T>(res: Response): Promise<T> {
|
||||
await checked(res)
|
||||
return res.json() as Promise<T>
|
||||
}
|
||||
|
||||
@@ -21,35 +56,73 @@ export const api = {
|
||||
listProjects: () => auth.fetch(`${BASE}/api/projects`).then(r => json<Project[]>(r)),
|
||||
createProject: (name: string) => auth.fetch(`${BASE}/api/projects`, { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ name }) }).then(r => json<Project>(r)),
|
||||
renameProject: (id: string, name: string) => auth.fetch(`${BASE}/api/projects/${id}`, { method: 'PATCH', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ name }) }).then(r => json<Project>(r)),
|
||||
deleteProject: (id: string) => auth.fetch(`${BASE}/api/projects/${id}`, { method: 'DELETE' }),
|
||||
deleteProject: (id: string) => auth.fetch(`${BASE}/api/projects/${id}`, { method: 'DELETE' }).then(checked),
|
||||
|
||||
listConversations: (projectId: string) => auth.fetch(`${BASE}/api/projects/${projectId}/conversations`).then(r => json<Conversation[]>(r)),
|
||||
// 跨项目任务列表(方案 A 侧栏):默认仅未归档;includeArchived 含归档。
|
||||
listTasks: (includeArchived?: boolean) => auth.fetch(`${BASE}/api/conversations${includeArchived ? '?archived=1' : ''}`).then(r => json<Conversation[]>(r)),
|
||||
setConversationFlags: (id: string, flags: { pinned?: boolean; archived?: boolean; allowCrossRead?: boolean; crossPrivate?: boolean }) => auth.fetch(`${BASE}/api/conversations/${id}`, { method: 'PATCH', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify(flags) }).then(r => { if (!r.ok) throw new Error(`${r.status}: ${r.statusText}`) }),
|
||||
me: () => auth.fetch(`${BASE}/api/me`).then(r => json<{ owner: string; name: string; auth: boolean; isAdmin?: boolean; mustChangePassword?: boolean }>(r)),
|
||||
setPermissionMode: (id: string, permissionMode: string) => auth.fetch(`${BASE}/api/conversations/${id}`, { method: 'PATCH', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ permissionMode }) }).then(r => { if (!r.ok) throw new Error(`${r.status}: ${r.statusText}`) }),
|
||||
checkpoints: (id: string, messageId: string) => auth.fetch(`${BASE}/api/conversations/${id}/checkpoints?messageId=${encodeURIComponent(messageId)}`).then(r => json<{ restored?: string[]; skipped?: string[] }>(r)),
|
||||
rewindFiles: (id: string, messageId: string) => auth.fetch(`${BASE}/api/conversations/${id}/rewind`, { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ messageId }) }).then(r => json<{ restored?: string[]; skipped?: string[] }>(r)),
|
||||
/** 会话内页面目录:扁平 SurfaceMeta(无 identity/spec),不可直接写入 surfaces 投影。 */
|
||||
surfaceList: (convId: string) => auth.fetch(`${BASE}/api/conversations/${convId}/surfaces`).then(r => json<SurfaceMeta[]>(r)),
|
||||
submitSurfaceAction: (id: string, body: { actionId: string; revision: number; requestId: string; data: Record<string, unknown> }) =>
|
||||
auth.fetch(`${BASE}/api/surfaces/${id}/actions`, { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify(body) }).then(r => json<any>(r)),
|
||||
projectSurfaces: (projectId: string) => auth.fetch(`${BASE}/api/projects/${projectId}/surfaces`).then(r => json<SurfaceMeta[]>(r)),
|
||||
/** 单页权威快照(含 identity + spec),供列表水合与预览渲染。 */
|
||||
surfaceGet: (id: string) => auth.fetch(`${BASE}/api/surfaces/${id}`).then(r => json<SurfaceSnapshot>(r)),
|
||||
me: () => auth.fetch(`${BASE}/api/me`).then(r => json<{ owner: string; name: string; auth: boolean; authVia?: string; sessionScope?: string; passwordChangeMode?: PasswordChangeMode; isAdmin?: boolean; mustChangePassword?: boolean; passwordSet?: boolean }>(r)),
|
||||
// ---- 认证与会话(管理员发放制,R2)----
|
||||
login: (owner: string, password: string) => auth.fetch(`${BASE}/api/auth/login`, { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ owner, password }) }).then(async r => {
|
||||
if (!r.ok) throw new Error(`${r.status}: ${await r.text()}`)
|
||||
return r.json() as Promise<{ owner: string; name: string; isAdmin: boolean; mustChangePassword: boolean }>
|
||||
const me = await r.json() as { owner: string; name: string; isAdmin: boolean; mustChangePassword: boolean; passwordSet: boolean; sessionScope: string }
|
||||
auth.beginSession()
|
||||
return me
|
||||
}),
|
||||
logout: () => auth.fetch(`${BASE}/api/auth/logout`, { method: 'POST' }),
|
||||
logout: () => {
|
||||
const request = auth.fetch(`${BASE}/api/auth/logout`, { method: 'POST' })
|
||||
auth.clear()
|
||||
return request
|
||||
},
|
||||
changePassword: (current: string, next: string) => auth.fetch(`${BASE}/api/auth/password`, { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ current, next }) }).then(async r => {
|
||||
if (!r.ok) throw new Error(`${r.status}: ${await r.text()}`)
|
||||
return r.json() as Promise<{ owner: string; name: string; isAdmin: boolean; mustChangePassword: boolean }>
|
||||
return r.json() as Promise<{ owner: string; name: string; isAdmin: boolean; mustChangePassword: boolean; reloginRequired: boolean }>
|
||||
}),
|
||||
listAdminUsers: () => auth.fetch(`${BASE}/api/admin/users`).then(r => json<{ owner: string; name: string; isAdmin: boolean; mustChangePassword: boolean; hasPassword: boolean; passwordSetAt?: string; createdAt: string }[]>(r)),
|
||||
createAdminUser: (owner: string, name: string, password: string, isAdmin: boolean) => auth.fetch(`${BASE}/api/admin/users`, { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ owner, name, password, isAdmin }) }).then(r => json<{ owner: string; mustChangePassword: boolean }>(r)),
|
||||
resetAdminUserPassword: (owner: string, password: string) => auth.fetch(`${BASE}/api/admin/users/${encodeURIComponent(owner)}/password`, { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ password }) }).then(r => json<{ owner: string; mustChangePassword: boolean }>(r)),
|
||||
listAdminUsers: () => auth.fetch(`${BASE}/api/admin/users`).then(r => json<{ userId: string; owner: string; name: string; isAdmin: boolean; mustChangePassword: boolean; hasPassword: boolean; passwordSetAt?: string; createdAt: string; stateVersion: number; profileVersion: number; initializationState: string }[]>(r)),
|
||||
// 管理员建号:可提供初始密码;省略密码时由服务端生成并仅返回一次。
|
||||
createAdminUser: (owner: string, name: string, password?: string) => auth.fetch(`${BASE}/api/admin/users`, { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ owner, profile: { name }, ...(password ? { password } : {}) }) }).then(r => json<{ userId: string; owner: string; passwordSet: boolean; mustChangePassword: boolean; initializationState: string; initialPassword?: string }>(r)),
|
||||
// 忘记密码的唯一处置:管理员生成一次性登录密码(明文只在本次响应出现);
|
||||
// 用户以该密码登录后进入 one_time_password 强制改密门,设置新密码后才放行。
|
||||
adminIssueOneTimePassword: (owner: string) => auth.fetch(`${BASE}/api/admin/users/${encodeURIComponent(owner)}/one-time-password`, { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: '{}' }).then(r => json<{ owner: string; oneTimePassword: string; mustChangePassword: boolean }>(r)),
|
||||
// ---- 本人:可选资料(须完整密码会话)----
|
||||
meProfile: () => auth.fetch(`${BASE}/api/me/profile`).then(r => json<AccountRecord>(r)),
|
||||
patchMeProfile: (expectedProfileVersion: number, patch: Partial<AccountProfile>) => auth.fetch(`${BASE}/api/me/profile`, { method: 'PATCH', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ expectedProfileVersion, patch }) }).then(r => json<AccountRecord>(r)),
|
||||
adminExecEnv: () => auth.fetch(`${BASE}/api/admin/exec-env`).then(r => json<ExecEnvView>(r)),
|
||||
adminExecEnvDecision: (id: string, allow: boolean, isolate: boolean) => auth.fetch(`${BASE}/api/admin/exec-env/requests/${encodeURIComponent(id)}/decision`, { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ allow, isolate }) }).then(r => json<{ status: string; detail?: string; layerId?: string }>(r)),
|
||||
adminExecEnvRebase: () => auth.fetch(`${BASE}/api/admin/exec-env/rebase`, { method: 'POST' }).then(r => json<{ base: string }>(r)),
|
||||
adminExecEnvGC: () => auth.fetch(`${BASE}/api/admin/exec-env/gc`, { method: 'POST' }).then(r => json<{ removed: string[] | null }>(r)),
|
||||
adminExecEnvWheel: (file: File, conversationId: string, reason: string) => {
|
||||
const body = new FormData()
|
||||
body.set('wheel', file)
|
||||
body.set('conversationId', conversationId)
|
||||
body.set('reason', reason)
|
||||
return auth.fetch(`${BASE}/api/admin/exec-env/wheels`, { method: 'POST', body }).then(r => json<{ file: string; outcome: { status: string; requestId?: string; detail?: string } }>(r))
|
||||
},
|
||||
createConversation: (projectId: string, title?: string) => auth.fetch(`${BASE}/api/projects/${projectId}/conversations`, { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ title: title ?? '' }) }).then(r => json<Conversation>(r)),
|
||||
deleteConversation: (id: string) => auth.fetch(`${BASE}/api/conversations/${id}`, { method: 'DELETE' }),
|
||||
setConversationProfile: (id: string, profileId: string) => auth.fetch(`${BASE}/api/conversations/${id}`, { method: 'PATCH', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ profileId }) }).then(r => json<Conversation>(r)),
|
||||
|
||||
conversationDetail: (id: string) => auth.fetch(`${BASE}/api/conversations/${id}`).then(r =>
|
||||
json<{ conversation: Conversation; messages: Message[]; runs: Run[]; activeHitl: HITLCard[]; lastSeq: number }>(r)),
|
||||
json<{ conversation: Conversation; messages: Message[]; runs: Run[]; activeHitl: HITLCard[]; lastSeq: number; resumeSeq?: number }>(r)),
|
||||
|
||||
sendMessage: (convId: string, text: string, attachmentIds: string[]) =>
|
||||
auth.fetch(`${BASE}/api/conversations/${convId}/messages`, { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ text, attachmentIds }) })
|
||||
runEventsPage: (convId: string, runId: string, after: number, signal?: AbortSignal) =>
|
||||
auth.fetch(`${BASE}/api/conversations/${encodeURIComponent(convId)}/runs/${encodeURIComponent(runId)}/events?after=${after}&limit=500`, { signal })
|
||||
.then(r => json<{ events: StreamEvent[] }>(r)),
|
||||
|
||||
sendMessage: (convId: string, text: string, attachmentIds: string[], requestId?: string, taskRef?: { cardId: string; resultVersion: number }) =>
|
||||
auth.fetch(`${BASE}/api/conversations/${convId}/messages`, { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ text, attachmentIds, requestId,
|
||||
...(taskRef ? { taskRef: { cardId: taskRef.cardId, resultVersion: taskRef.resultVersion } } : {}) }) })
|
||||
.then(async r => {
|
||||
if (!r.ok) throw new Error(`${r.status}: ${await r.text()}`)
|
||||
return r.json() as Promise<{ message: Message; run?: Run; command?: string; reply?: string; conversation?: Conversation }>
|
||||
@@ -63,8 +136,8 @@ export const api = {
|
||||
|
||||
listCards: (conversationId: string) =>
|
||||
auth.fetch(`${BASE}/api/conversations/${conversationId}/cards`).then(r => json<{ cards: ActivityCard[] }>(r)).then(d => d.cards ?? []),
|
||||
cardAction: (cardId: string, actionId: string, freeText?: string) =>
|
||||
auth.fetch(`${BASE}/api/cards/${cardId}/actions/${encodeURIComponent(actionId)}`, { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ freeText }) })
|
||||
cardAction: (cardId: string, actionId: string, payload?: string | WorkCardAction) =>
|
||||
auth.fetch(`${BASE}/api/cards/${cardId}/actions/${encodeURIComponent(actionId)}`, { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify(typeof payload === 'object' ? payload : { freeText: payload }) })
|
||||
.then(r => json<{ card: ActivityCard; receipt?: Message }>(r)),
|
||||
cardPin: (cardId: string, pinned: boolean) =>
|
||||
auth.fetch(`${BASE}/api/cards/${cardId}/pin`, { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ pinned }) }).then(r => json<{ card: ActivityCard }>(r)),
|
||||
@@ -101,13 +174,52 @@ export const api = {
|
||||
getSettings: (projectId?: string) => auth.fetch(`${BASE}/api/settings${projectId ? '?project=' + projectId : ''}`).then(r =>
|
||||
json<{ schema: SettingDesc[]; defaults: Record<string, unknown>; user: Record<string, unknown>; project: Record<string, unknown> }>(r)),
|
||||
putUserSettings: (values: Record<string, unknown>) => auth.fetch(`${BASE}/api/settings/user`, { method: 'PUT', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify(values) }),
|
||||
putProjectSettings: (projectId: string, values: Record<string, unknown>) => auth.fetch(`${BASE}/api/settings/project/${projectId}`, { method: 'PUT', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify(values) }),
|
||||
putProjectSettings: (projectId: string, values: Record<string, unknown>) => auth.fetch(`${BASE}/api/settings/project/${projectId}`, { method: 'PUT', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify(values) }).then(checked),
|
||||
// P2 系统管理面:受管项(models/tavily/telemetry/运行基础设施)的唯一写入面。
|
||||
getSystemSettings: () => auth.fetch(`${BASE}/api/settings/system`).then(r =>
|
||||
json<{ schema: SettingDesc[]; defaults: Record<string, unknown>; system: Record<string, unknown> }>(r)),
|
||||
putSystemSettings: (values: Record<string, unknown>) => auth.fetch(`${BASE}/api/settings/system`, { method: 'PUT', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify(values) }),
|
||||
|
||||
listTools: () => auth.fetch(`${BASE}/api/tools`).then(r => r.json()),
|
||||
listPlugins: () => auth.fetch(`${BASE}/api/plugins`).then(r => r.json()),
|
||||
adminZoneSections: () => auth.fetch(`${BASE}/api/admin-zone/sections`).then(r => r.json()) as Promise<AdminZoneSection[]>,
|
||||
reloadPlugins: () => auth.fetch(`${BASE}/api/plugins/reload`, { method: 'POST' }).then(r => r.json()),
|
||||
listCommands: () => auth.fetch(`${BASE}/api/commands`).then(r => r.json()) as Promise<{ name?: string; id?: string; title?: string; description?: string; danger?: string }[]>,
|
||||
listCommands: () => auth.fetch(`${BASE}/api/commands`).then(r => r.json()) as Promise<{ name?: string; id?: string; title?: string; description?: string; danger?: string; enabled?: boolean }[]>,
|
||||
setSessionNote: (id: string, sessionNote: string) => auth.fetch(`${BASE}/api/conversations/${id}`, { method: 'PATCH', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ sessionNote }) }).then(r => { if (!r.ok) throw new Error(`${r.status}`) }),
|
||||
excludeMessage: (id: string, excluded: boolean) => auth.fetch(`${BASE}/api/messages/${id}/exclude`, { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ excluded }) }).then(r => { if (!r.ok) throw new Error(`${r.status}`) }),
|
||||
selectVariant: (id: string) => auth.fetch(`${BASE}/api/messages/${id}/variant`, { method: 'POST' }).then(r => { if (!r.ok) throw new Error(`${r.status}`) }),
|
||||
regenerate: (convId: string, messageId: string) => auth.fetch(`${BASE}/api/conversations/${convId}/regenerate`, { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ messageId }) }).then(r => { if (!r.ok) throw new Error(`${r.status}: ${r.statusText}`) }),
|
||||
listSecrets: () => auth.fetch(`${BASE}/api/secrets`).then(r => json<{ id: string; service: string; label: string; active: boolean; mask: string }[]>(r)),
|
||||
createSecret: (service: string, label: string, value: string) => auth.fetch(`${BASE}/api/secrets`, { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ service, label, value }) }).then(r => json(r)),
|
||||
activateSecret: (id: string) => auth.fetch(`${BASE}/api/secrets/${id}/activate`, { method: 'POST' }),
|
||||
deleteSecret: (id: string) => auth.fetch(`${BASE}/api/secrets/${id}`, { method: 'DELETE' }),
|
||||
listContextEntries: () => auth.fetch(`${BASE}/api/context-entries`).then(r => json<{ id: string; keys: string[]; secondary?: string; logic: string; content: string; constant: boolean; scanDepth: number; budgetChars: number; enabled: boolean }[]>(r)),
|
||||
saveContextEntry: (body: Record<string, unknown>) => auth.fetch(`${BASE}/api/context-entries`, { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify(body) }).then(r => json(r)),
|
||||
deleteContextEntry: (id: string) => auth.fetch(`${BASE}/api/context-entries/${id}`, { method: 'DELETE' }),
|
||||
listPromptCommands: () => auth.fetch(`${BASE}/api/prompt-commands`).then(r => json<{ id: string; name: string; title: string; template: string }[]>(r)),
|
||||
savePromptCommand: (body: { name: string; title: string; template: string }) => auth.fetch(`${BASE}/api/prompt-commands`, { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify(body) }).then(r => json(r)),
|
||||
deletePromptCommand: (id: string) => auth.fetch(`${BASE}/api/prompt-commands/${id}`, { method: 'DELETE' }),
|
||||
listWorkspaces: () => auth.fetch(`${BASE}/api/workspaces`).then(r => r.json()) as Promise<{ id: string; title: string; icon?: string; shortcut?: string; badgeTool?: string; body?: any[]; refreshTool?: string }[]>,
|
||||
|
||||
// ---- U4:RDM 命令总线封装(POST /api/commands/{id},同 RDM web 的 command 路由) ----
|
||||
// receipt 解包:rejected 抛错;confirm-card 抛提示(审计面只读命令不应触发)。
|
||||
rdmProjectCommand: async <T = any>(project: Project, id: string, params: Record<string, unknown> = {}): Promise<T> => {
|
||||
const error = rdmProjectCommandError(project, id)
|
||||
if (error) throw new Error(error)
|
||||
return api.rdmCommand<T>(id, { ...params, projectId: rdmCommandProjectId(project) })
|
||||
},
|
||||
rdmCommand: <T = any>(id: string, params: Record<string, unknown> = {}): Promise<T> =>
|
||||
auth.fetch(`${BASE}/api/commands/${encodeURIComponent(id)}`, {
|
||||
method: 'POST', headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({ params }),
|
||||
}).then(r => json<{ receipt?: { state?: string; error?: string; message?: string }; card?: unknown; payload?: T } | T>(r))
|
||||
.then(out => {
|
||||
const envelope = out as { receipt?: { state?: string; error?: string; message?: string }; card?: unknown; payload?: T }
|
||||
if (envelope?.receipt?.state === 'rejected') throw new Error(envelope.receipt.error || envelope.receipt.message || '命令被拒绝')
|
||||
if (envelope?.card) throw new Error('高危命令已生成确认卡——请在对话中确认执行')
|
||||
if (envelope && envelope.payload !== undefined) return envelope.payload
|
||||
return out as T
|
||||
}),
|
||||
}
|
||||
|
||||
// ---- SSE 客户端:Last-Event-ID 游标续传;断线自动重连 ----
|
||||
@@ -118,6 +230,34 @@ export interface SSEHandlers {
|
||||
onError?: (err: Error) => void
|
||||
}
|
||||
|
||||
// 契约里每一种事件都要有监听。漏掉一种时 tsc 会报缺字段。
|
||||
const streamEventListeners: Record<StreamEventType, true> = {
|
||||
'message.delta': true,
|
||||
'thinking.delta': true,
|
||||
'tool.call.delta': true,
|
||||
'tool.call': true,
|
||||
'tool.output': true,
|
||||
'tool.result': true,
|
||||
'run.phase': true,
|
||||
'run.check': true,
|
||||
'hitl.request': true,
|
||||
'hitl.resolved': true,
|
||||
'plan.update': true,
|
||||
'todo.update': true,
|
||||
'agent.spawn': true,
|
||||
'agent.progress': true,
|
||||
'agent.result': true,
|
||||
'artifact.created': true,
|
||||
'artifact.updated': true,
|
||||
'run.completed': true,
|
||||
'run.failed': true,
|
||||
'error': true,
|
||||
'card.created': true,
|
||||
'card.updated': true,
|
||||
'card.status': true,
|
||||
'card.resolved': true, 'surface.updated': true,
|
||||
}
|
||||
|
||||
export function connectEvents(conversationId: string, since: number, handlers: SSEHandlers, projectId?: string): { close: () => void } {
|
||||
let closed = false
|
||||
let es: EventSource | null = null
|
||||
@@ -137,10 +277,7 @@ export function connectEvents(conversationId: string, since: number, handlers: S
|
||||
}
|
||||
es.onmessage = ev => handle('message', ev.data)
|
||||
// 同时监听具名事件与默认(服务端 event: 字段)。
|
||||
const types = ['message.delta', 'thinking.delta', 'tool.call', 'tool.result', 'run.phase',
|
||||
'hitl.request', 'hitl.resolved', 'plan.update', 'todo.update', 'agent.spawn', 'agent.progress',
|
||||
'agent.result', 'artifact.created', 'artifact.updated', 'run.completed', 'run.failed', 'error',
|
||||
'card.created', 'card.updated', 'card.status', 'card.resolved']
|
||||
const types = Object.keys(streamEventListeners) as StreamEventType[]
|
||||
for (const t of types) es.addEventListener(t, ev => handle(t, (ev as MessageEvent).data))
|
||||
}
|
||||
|
||||
|
||||
@@ -0,0 +1,33 @@
|
||||
import { describe, expect, it } from 'vitest'
|
||||
import { groupArtifactsByName } from './artifactGrouping'
|
||||
import type { Artifact } from './contracts'
|
||||
|
||||
// 2026-10-11 实测事故:一次 run 内 register_artifact 三次 → 文件面板三份同名
|
||||
// 转写报告并列。修复语义(用户裁定):存储保留版本、界面按名称分组去重。
|
||||
|
||||
function art(id: string, name: string, updatedAt: string, size = 40000): Artifact {
|
||||
return { id, projectId: 'p1', name, kind: 'document', size, createdAt: updatedAt, updatedAt }
|
||||
}
|
||||
|
||||
describe('groupArtifactsByName', () => {
|
||||
it('同名 3 行归一组:latest 为最新,versions 新→旧', () => {
|
||||
const g = groupArtifactsByName([
|
||||
art('a1', '报告.docx', '2026-10-11T15:22:20Z'),
|
||||
art('a2', '报告.docx', '2026-10-11T15:24:06Z'),
|
||||
art('a3', '报告.docx', '2026-10-11T15:23:38Z'),
|
||||
art('b1', '其他.md', '2026-10-11T15:20:00Z', 100),
|
||||
])
|
||||
expect(g).toHaveLength(2)
|
||||
const grp = g.find(x => x.latest.name === '报告.docx')!
|
||||
expect(grp.latest.id).toBe('a2') // 最新 15:24:06
|
||||
expect(grp.versions).toHaveLength(3)
|
||||
expect(grp.versions.map(v => v.id)).toEqual(['a2', 'a3', 'a1'])
|
||||
expect(g.find(x => x.latest.name === '其他.md')!.versions).toHaveLength(1)
|
||||
})
|
||||
|
||||
it('不同名互不影响;空列表返回空', () => {
|
||||
const g = groupArtifactsByName([art('x', 'a.md', 'T1'), art('y', 'b.md', 'T2')])
|
||||
expect(g).toHaveLength(2)
|
||||
expect(groupArtifactsByName([])).toEqual([])
|
||||
})
|
||||
})
|
||||
@@ -0,0 +1,23 @@
|
||||
// 同名工件版本分组(2026-10-11 实测事故的修复语义,用户裁定:存储保留版本、
|
||||
// 界面去重):组内按 updated_at 新→旧,latest 为面板显示行,其余为历史版本。
|
||||
import type { Artifact } from './contracts'
|
||||
|
||||
export interface ArtifactGroup {
|
||||
latest: Artifact
|
||||
versions: Artifact[]
|
||||
}
|
||||
|
||||
export function groupArtifactsByName(list: Artifact[]): ArtifactGroup[] {
|
||||
const byName = new Map<string, Artifact[]>()
|
||||
for (const a of list) {
|
||||
const arr = byName.get(a.name) ?? []
|
||||
arr.push(a)
|
||||
byName.set(a.name, arr)
|
||||
}
|
||||
const out: ArtifactGroup[] = []
|
||||
for (const versions of byName.values()) {
|
||||
versions.sort((x, y) => (x.updatedAt < y.updatedAt ? 1 : x.updatedAt > y.updatedAt ? -1 : 0))
|
||||
out.push({ latest: versions[0], versions })
|
||||
}
|
||||
return out
|
||||
}
|
||||
+17
-3
@@ -17,11 +17,25 @@ function pickStorage(): KV {
|
||||
}
|
||||
|
||||
const storage = pickStorage()
|
||||
const identityListeners = new Set<() => void>()
|
||||
function identityChanged() { identityListeners.forEach(listener => listener()) }
|
||||
|
||||
export const auth = {
|
||||
apiKey(): string { return storage.getItem(KEY) ?? '' },
|
||||
setKey(key: string) { storage.setItem(KEY, key.trim()) },
|
||||
clear() { storage.removeItem(KEY) },
|
||||
setKey(key: string) {
|
||||
const next = key.trim()
|
||||
if (next === this.apiKey()) return
|
||||
storage.setItem(KEY, next)
|
||||
identityChanged()
|
||||
},
|
||||
clear() { storage.removeItem(KEY); identityChanged() },
|
||||
onIdentityChange(listener: () => void) {
|
||||
identityListeners.add(listener)
|
||||
return () => { identityListeners.delete(listener) }
|
||||
},
|
||||
// 密码登录成功后切换到 HttpOnly 会话 cookie:必须清掉残留 Bearer——服务端
|
||||
// 认证中间件 Bearer 优先于会话 cookie,失效残留 key 会把有效会话也判成 401。
|
||||
beginSession() { this.clear() },
|
||||
// 带凭证的 fetch:未设置密钥时与原生 fetch 等价(嵌入式档无认证)。
|
||||
fetch(input: string, init?: RequestInit): Promise<Response> {
|
||||
const key = this.apiKey()
|
||||
@@ -30,7 +44,7 @@ export const auth = {
|
||||
headers.set('Authorization', `Bearer ${key}`)
|
||||
return fetch(input, { ...init, headers })
|
||||
},
|
||||
// 退出登录:清凭证并整页回登录门(服务端会话/密钥均为无状态凭证,无需服务端注销)。
|
||||
// 退出登录:立即清客户端投影并回登录门;调用者先经 api.logout 注销服务端会话。
|
||||
logout() {
|
||||
this.clear()
|
||||
try { location.reload() } catch { /* 非 DOM 环境(测试)忽略 */ }
|
||||
|
||||
@@ -0,0 +1,184 @@
|
||||
.work-companion-chat .chat-header {
|
||||
position: relative;
|
||||
display: grid;
|
||||
grid-template-columns: minmax(0, 1fr) auto auto;
|
||||
gap: 12px;
|
||||
min-height: 64px;
|
||||
padding: 12px 24px;
|
||||
background: var(--bg-panel);
|
||||
}
|
||||
.work-companion-chat .chat-title { font-size: var(--fs-ui-xl); font-weight: 650; letter-spacing: -0.025em; }
|
||||
.work-companion-chat .chat-title { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
|
||||
.work-companion-chat .chat-header > .mk-col-root { position: relative; }
|
||||
.work-companion-chat .chat-header > .mk-col-root > .mk-col {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: calc(100% + 8px);
|
||||
width: min(28rem, calc(100vw - 40px));
|
||||
z-index: 30;
|
||||
}
|
||||
.companion-settings-trigger, .companion-operation-trigger {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
padding: 4px 8px;
|
||||
color: var(--text-dim);
|
||||
font-size: var(--fs-ui-sm);
|
||||
border-radius: var(--radius-sm);
|
||||
}
|
||||
.companion-settings-trigger:hover, .companion-operation-trigger:hover { background: var(--bg-hover); color: var(--text); }
|
||||
.companion-settings-body {
|
||||
padding: 16px;
|
||||
background: var(--bg-raised);
|
||||
border: 1px solid var(--border);
|
||||
border-radius: var(--radius);
|
||||
box-shadow: var(--shadow-md);
|
||||
}
|
||||
.companion-setting { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin-bottom: 12px; color: var(--text); font-size: var(--fs-ui-caption); }
|
||||
.companion-setting > span:first-child { flex: 1; min-width: 8rem; }
|
||||
.companion-setting select { max-width: 100%; padding: 4px 8px; background: var(--bg-panel); color: var(--text); border: 1px solid var(--border); border-radius: var(--radius-sm); font-size: var(--fs-ui-caption); }
|
||||
.companion-setting .session-note { flex: 1 1 100%; min-width: 0; width: 100%; }
|
||||
.companion-setting-note { flex: 1 1 100%; margin: 0; color: var(--text-dim); font-size: var(--fs-ui-sm); line-height: 1.6; }
|
||||
.work-companion-chat .chat-body {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding: 36px clamp(20px, 6vw, 96px) 48px;
|
||||
scroll-padding-block: 36px;
|
||||
}
|
||||
.work-companion-chat .chat-body > * {
|
||||
width: min(100%, 840px);
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
.work-companion-chat .chat-body > .msg { margin-bottom: 32px; }
|
||||
.work-companion-chat .chat-body > .msg.user {
|
||||
width: min(80%, 680px);
|
||||
margin-right: max(0px, calc((100% - 840px) / 2));
|
||||
margin-left: auto;
|
||||
}
|
||||
.work-companion-chat .chat-body > .msg.assistant {
|
||||
padding: 20px 24px 16px;
|
||||
border: 1px solid var(--border);
|
||||
border-radius: var(--radius-xl);
|
||||
background: var(--bg-raised);
|
||||
box-shadow: var(--shadow-md);
|
||||
}
|
||||
.work-companion-chat .msg-role {
|
||||
margin-bottom: 10px;
|
||||
color: var(--text-dim);
|
||||
font-size: var(--fs-ui-caption);
|
||||
font-weight: 600;
|
||||
}
|
||||
.work-companion-chat .msg.user .msg-role { justify-content: flex-end; }
|
||||
.message-timestamp { color: var(--text-dim); font-size: var(--fs-ui-sm); font-weight: 400; white-space: nowrap; }
|
||||
.work-companion-chat .msg.assistant .message-timestamp { margin-left: auto; }
|
||||
.work-result-notice, .composer-work-reference { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; box-sizing: border-box; padding: 8px 12px; margin-bottom: 8px; border: 1px solid var(--border); border-radius: var(--radius); background: var(--bg-raised); color: var(--text-dim); font-size: var(--fs-ui-caption); text-align: left; }
|
||||
.work-result-notice { cursor: pointer; }
|
||||
.work-result-notice:hover { background: var(--bg-hover); color: var(--text); }
|
||||
.work-result-notice > span:last-child { margin-left: auto; color: var(--accent-text); }
|
||||
.composer-work-reference > span { flex: 1; min-width: 0; overflow-wrap: anywhere; }
|
||||
.work-execution-record { min-width: 0; padding: 16px; color: var(--text); background: var(--bg-panel); border: 1px solid var(--border); border-radius: var(--radius-lg); }
|
||||
.work-record-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 8px; }
|
||||
.work-record-heading strong { min-width: 0; overflow-wrap: anywhere; font-size: var(--fs-ui-base); }
|
||||
.work-record-heading .btn { flex-shrink: 0; font-size: var(--fs-ui-caption); }
|
||||
.work-execution-record .tl { margin-top: 16px; }
|
||||
.work-execution-record .part-text { overflow-wrap: anywhere; }
|
||||
.work-companion-chat .msg.assistant .role-mark {
|
||||
background: var(--primary);
|
||||
border-color: var(--primary);
|
||||
color: var(--primary-foreground);
|
||||
}
|
||||
.work-companion-chat .msg.assistant .part-text { color: var(--text); font-size: var(--fs-ui-base); line-height: 1.8; }
|
||||
.work-companion-chat .input-bar {
|
||||
padding: 12px clamp(20px, 6vw, 96px) 20px;
|
||||
border-top: 1px solid var(--border-soft);
|
||||
background: var(--bg-panel);
|
||||
}
|
||||
.work-companion-chat .input-bar > * { width: min(100%, 840px); margin-left: auto; margin-right: auto; }
|
||||
.work-companion-chat .input-row {
|
||||
flex-direction: column;
|
||||
align-items: stretch;
|
||||
padding: 14px;
|
||||
border-color: var(--border-strong);
|
||||
border-radius: var(--radius-xl);
|
||||
box-shadow: var(--shadow-md);
|
||||
}
|
||||
.work-companion-chat .input-row textarea { box-sizing: border-box; width: 100%; min-width: 0; padding: 4px; line-height: 1.6; font-size: var(--fs-ui-base); }
|
||||
.companion-compose-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; min-width: 0; }
|
||||
.companion-compose-spacer { flex: 1; }
|
||||
.companion-add-material { position: relative; display: inline-flex; align-items: center; gap: 4px; padding: 4px; cursor: pointer; color: var(--text-dim); font-size: var(--fs-ui-caption); border-radius: var(--radius-sm); }
|
||||
.companion-add-material:hover { background: var(--bg-hover); color: var(--text); }
|
||||
.companion-add-material:focus-within { outline: 2px solid var(--accent); outline-offset: 2px; }
|
||||
.companion-file-input { position: absolute; width: 1px; height: 1px; padding: 0; margin: 0; overflow: hidden; clip-path: inset(50%); }
|
||||
.companion-input-hint { font-size: var(--fs-ui-sm); color: var(--text-dim); }
|
||||
.companion-operation-trigger { margin-bottom: 8px; color: var(--text-dim); }
|
||||
.companion-operation-body { padding: 12px; margin-bottom: 12px; border: 1px solid var(--border-soft); border-radius: var(--radius); background: var(--bg-panel); }
|
||||
.companion-operation-body .companion-setting { margin-bottom: 8px; }
|
||||
.work-companion-chat .input-status { flex-wrap: wrap; gap: 4px 8px; padding: 8px 0; line-height: 1.5; }
|
||||
.work-companion-chat .input-status-note { color: var(--text-dim); font-size: var(--fs-ui-sm); }
|
||||
.companion-reconnect, .companion-upload-status, .companion-action-feedback { padding: 8px 0; color: var(--text-dim); font-size: var(--fs-ui-caption); line-height: 1.5; }
|
||||
.companion-upload-error { padding: 8px 0; color: var(--err-text); font-size: var(--fs-ui-caption); overflow-wrap: anywhere; }
|
||||
.companion-remove-material { display: inline-flex; align-items: center; justify-content: center; padding: 4px; color: var(--text-dim); background: transparent; border: 0; border-radius: var(--radius-xs); cursor: pointer; }
|
||||
.companion-remove-material:hover { background: var(--bg-hover); color: var(--text); }
|
||||
.work-companion-chat .attach-chip { max-width: 100%; overflow-wrap: anywhere; }
|
||||
.companion-empty { min-height: 320px; height: 100%; text-align: center; line-height: 1.7; }
|
||||
.companion-empty .es-mark { width: 52px; height: 52px; margin-bottom: 8px; background: var(--bg-panel); box-shadow: var(--shadow-md); }
|
||||
.companion-empty-title { color: var(--text); font-size: var(--fs-ui-xl); font-weight: 650; letter-spacing: -0.02em; }
|
||||
.companion-examples { display: grid; gap: 8px; width: min(100%, 32rem); margin-top: 12px; }
|
||||
.companion-example { padding: 14px 16px; background: var(--bg-panel); border: 1px solid var(--border); border-radius: var(--radius-lg); color: var(--text-dim); font: inherit; text-align: left; cursor: pointer; }
|
||||
.companion-example:hover { color: var(--text); background: var(--bg-raised); border-color: var(--border-strong); }
|
||||
.conversation-work { margin: 24px 0 16px; min-width: 0; }
|
||||
.conversation-work-heading { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; margin-bottom: 12px; color: var(--text-dim); font-size: var(--fs-ui-caption); }
|
||||
.conversation-work-heading > span:first-child { color: var(--text); font-size: var(--fs-ui-lg); font-weight: 650; }
|
||||
.conversation-work-current, .conversation-work-history { display: grid; gap: 12px; min-width: 0; }
|
||||
.conversation-work-more { padding: 12px 0; color: var(--text-dim); font-size: var(--fs-ui-caption); }
|
||||
.conversation-work .acard { margin: 0; }
|
||||
.conversation-action-anchor { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 12px; width: 100%; margin-top: 12px; padding: 10px 14px; border: 1px solid var(--border); border-radius: var(--radius); background: var(--bg-panel); color: var(--text); text-align: left; font-size: var(--fs-ui-caption); cursor: pointer; }
|
||||
.conversation-action-anchor > span:last-child { color: var(--accent-text); }
|
||||
.conversation-action-anchor:hover { background: var(--bg-hover); }
|
||||
.work-companion-chat .live-bar { flex-wrap: wrap; }
|
||||
.work-companion-chat .part-error-detail, .work-companion-chat .hitl-detail { overflow-wrap: anywhere; white-space: pre-wrap; }
|
||||
@media (max-width: 540px) {
|
||||
.work-companion-chat .chat-header { padding: 12px 16px; gap: 8px; }
|
||||
.work-companion-chat .chat-body { padding: 24px 16px 32px; }
|
||||
.work-companion-chat .chat-body > .msg.user { width: 92%; margin-right: 0; }
|
||||
.work-companion-chat .input-bar { padding: 10px 12px 14px; }
|
||||
.companion-input-hint { display: none; }
|
||||
.companion-empty { min-height: 200px; }
|
||||
.work-companion-chat .hitl-choices { grid-template-columns: minmax(0, 1fr); }
|
||||
}
|
||||
|
||||
.work-companion-chat .msg.user .bubble {
|
||||
padding: 14px 18px;
|
||||
background: var(--primary);
|
||||
border: 1px solid var(--primary);
|
||||
border-radius: var(--radius-lg) var(--radius-lg) var(--radius-xs) var(--radius-lg);
|
||||
color: var(--primary-foreground);
|
||||
line-height: 1.7;
|
||||
box-shadow: var(--shadow-md);
|
||||
}
|
||||
.work-companion-chat .process-collapse {
|
||||
margin: 12px 0 16px;
|
||||
border-color: var(--border);
|
||||
background: var(--bg-panel);
|
||||
}
|
||||
.work-companion-chat .process-collapse .process-collapse-summary { padding: 9px 14px; color: var(--text-dim); }
|
||||
.work-companion-chat .process-collapse .process-collapse-summary:hover { background: var(--bg-hover); color: var(--text); }
|
||||
.work-companion-chat .process-collapse .body { padding: 8px 14px 14px; border-top: 1px solid var(--border-soft); }
|
||||
.companion-message-copy { padding: 4px 8px; border: 0; background: transparent; color: var(--text-dim); font-size: var(--fs-ui-caption); border-radius: var(--radius-sm); cursor: pointer; }
|
||||
.companion-message-copy:hover { background: var(--bg-hover); color: var(--text); }
|
||||
.companion-message-actions {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 8px;
|
||||
padding: 8px 0;
|
||||
opacity: 0;
|
||||
}
|
||||
.work-companion-chat .msg:hover .companion-message-actions,
|
||||
.work-companion-chat .msg:focus-within .companion-message-actions { opacity: 1; }
|
||||
.work-companion-chat .msg-tools { gap: 4px; }
|
||||
|
||||
@media (hover: none) {
|
||||
.companion-message-actions { opacity: 1; }
|
||||
}
|
||||
@@ -0,0 +1,225 @@
|
||||
/* Responsive host chrome; the canonical theme and UI type scale stay in @ui. */
|
||||
.app.companion-app {
|
||||
height: 100dvh;
|
||||
min-width: 0;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.companion-app .app-body { min-width: 0; overflow: hidden; }
|
||||
.companion-app .left-nav,
|
||||
.companion-app .main,
|
||||
.companion-app .right-panel { min-height: 0; max-width: 100%; overflow: hidden; }
|
||||
.companion-app .left-nav,
|
||||
.companion-app .companion-topbar {
|
||||
--text: var(--workbench-chrome-text);
|
||||
--text-dim: var(--workbench-chrome-dim);
|
||||
--text-faint: var(--workbench-chrome-faint);
|
||||
--bg-hover: var(--workbench-chrome-hover);
|
||||
--bg-active: var(--workbench-chrome-active);
|
||||
--border: var(--workbench-chrome-active);
|
||||
--border-soft: var(--workbench-chrome-hover);
|
||||
--border-strong: var(--workbench-chrome-dim);
|
||||
background: var(--workbench-chrome);
|
||||
color: var(--workbench-chrome-text);
|
||||
border-color: var(--workbench-chrome-hover);
|
||||
}
|
||||
.companion-app .left-nav { transition: none; }
|
||||
.companion-app .left-nav[hidden],
|
||||
.companion-app .right-panel[hidden],
|
||||
.companion-app .shell-context-content[hidden],
|
||||
.companion-app .icon-only[hidden] { display: none !important; }
|
||||
|
||||
.shell-context-content { display: flex; flex-direction: column; flex: 1; min-height: 0; min-width: 0; }
|
||||
.companion-app .companion-topbar {
|
||||
height: auto;
|
||||
min-height: 52px;
|
||||
gap: 12px;
|
||||
padding: 8px 16px;
|
||||
box-shadow: var(--shadow-md);
|
||||
}
|
||||
.topbar-identity { display: flex; align-items: center; gap: 8px; min-width: 0; }
|
||||
.companion-topbar .topbar-name { font-size: var(--fs-ui-lg); font-weight: 650; letter-spacing: -0.02em; white-space: nowrap; }
|
||||
.companion-app .right-panel .tabs {
|
||||
min-height: 52px;
|
||||
align-items: flex-end;
|
||||
gap: 16px;
|
||||
padding: 0 20px;
|
||||
background: var(--bg-panel);
|
||||
}
|
||||
.companion-app .right-panel .tab {
|
||||
min-height: 52px;
|
||||
padding: 0 2px;
|
||||
color: var(--text-dim);
|
||||
font-size: var(--fs-ui-base);
|
||||
font-weight: 600;
|
||||
}
|
||||
.companion-app .right-panel .tab:hover { color: var(--text); }
|
||||
.companion-app .right-panel .tab-body { padding: 20px; }
|
||||
.companion-app .right-panel .inbox-zone-label { margin: 20px 0 8px; color: var(--text); font-size: var(--fs-ui-caption); font-weight: 650; }
|
||||
.companion-app .right-panel .acard { margin: 12px 0; border-color: var(--border); padding: 18px; }
|
||||
.companion-app .right-panel .acard.status-active {
|
||||
border-left: 3px solid var(--work-focus-border);
|
||||
background: var(--work-focus-surface);
|
||||
box-shadow: var(--shadow-md);
|
||||
}
|
||||
.companion-app .right-panel .acard-title { color: var(--text); font-size: var(--fs-ui-lg); line-height: 1.4; }
|
||||
.companion-app .right-panel .acard-status {
|
||||
display: inline-flex;
|
||||
width: fit-content;
|
||||
margin-top: 8px;
|
||||
padding: 2px 8px;
|
||||
border-radius: var(--radius-full);
|
||||
background: var(--bg-active);
|
||||
color: var(--text);
|
||||
font-weight: 600;
|
||||
}
|
||||
.companion-app .right-panel .acard-body { margin-top: 16px; }
|
||||
.companion-app .right-panel .acard-summary-row { grid-template-columns: minmax(64px, auto) minmax(0, 1fr); gap: 12px; margin: 12px 0; }
|
||||
.companion-app .right-panel .acard-summary-row > span,
|
||||
.companion-app .right-panel .acard-summary-label { color: var(--text-dim); font-weight: 600; }
|
||||
.companion-app .right-panel .acard-summary-row p,
|
||||
.companion-app .right-panel .acard-findings li { color: var(--text); font-size: var(--fs-ui-base); }
|
||||
.companion-topbar .brand-mark {
|
||||
background: var(--workbench-chrome-text);
|
||||
color: var(--workbench-chrome);
|
||||
box-shadow: none;
|
||||
border-radius: var(--radius-sm) !important;
|
||||
}
|
||||
.shell-navigation { display: flex; align-items: center; gap: 4px; }
|
||||
.shell-nav-button,
|
||||
.shell-return {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 8px;
|
||||
min-height: 32px;
|
||||
padding: 4px 12px;
|
||||
border: none;
|
||||
border-radius: var(--radius-sm);
|
||||
background: none;
|
||||
color: var(--workbench-chrome-dim);
|
||||
font-size: var(--fs-ui-caption);
|
||||
cursor: pointer;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.shell-nav-button:hover,
|
||||
.shell-return:hover { background: var(--workbench-chrome-hover); color: var(--workbench-chrome-text); }
|
||||
.shell-nav-button[aria-pressed='true'] { background: var(--workbench-chrome-active); color: var(--workbench-chrome-text); }
|
||||
.shell-nav-button svg,
|
||||
.shell-return svg { flex: none; }
|
||||
.shell-back-icon { transform: rotate(180deg); }
|
||||
.shell-pending {
|
||||
padding: 0 4px;
|
||||
border-radius: var(--radius-xs);
|
||||
background: var(--workbench-chrome-active);
|
||||
color: var(--workbench-chrome-text);
|
||||
font-size: var(--fs-ui-xs);
|
||||
font-variant-numeric: tabular-nums;
|
||||
}
|
||||
|
||||
.companion-app .tsb-brand { gap: 8px; padding: 16px 14px 12px; border-bottom: 1px solid var(--border-soft); }
|
||||
.companion-app .tsb-projrow { min-height: 40px; height: auto; border-color: transparent; background: none; padding: 6px 10px; }
|
||||
.companion-app .tsb-projrow:hover { background: var(--bg-hover); }
|
||||
.companion-app .tsb-projrow-name { flex: 1; font-size: var(--fs-ui-base); font-weight: 650; }
|
||||
.companion-app .tsb-projrow-stage { max-width: 40%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--text-dim); border-radius: var(--radius-sm); }
|
||||
.companion-app .tsb-iconbtn { width: 32px; height: 32px; flex: none; }
|
||||
.companion-app .tsb-actions { padding: 12px 14px; gap: 10px; }
|
||||
.companion-app .tsb-newtask {
|
||||
min-height: 40px;
|
||||
height: auto;
|
||||
background: var(--workbench-chrome-text);
|
||||
color: var(--workbench-chrome);
|
||||
box-shadow: none;
|
||||
transition: none;
|
||||
}
|
||||
.companion-app .tsb-newtask:hover { background: var(--workbench-chrome-text); }
|
||||
.companion-app .tsb-newtask-main { justify-content: center; padding: 8px 12px; }
|
||||
.companion-app .tsb-newtask-caret { width: 36px; flex: none; border-left-color: var(--workbench-chrome-inverse-border); }
|
||||
.companion-app .tsb-newtask-caret:hover { background: var(--workbench-chrome-inverse-hover); }
|
||||
.companion-app .tsb-search { min-height: 38px; height: auto; padding: 8px 12px; background: var(--workbench-chrome-hover); border-color: var(--workbench-chrome-hover); }
|
||||
.companion-app .tsb-search:focus-within { background: var(--workbench-chrome-active); border-color: var(--workbench-chrome-dim); }
|
||||
.companion-app .tsb-orgrow { padding: 4px 16px 8px; }
|
||||
.companion-app .tsb-seclabel { color: var(--text-dim); font-size: var(--fs-ui-sm); font-weight: 600; }
|
||||
.companion-app .tsb-scroll { padding: 0 8px 12px; }
|
||||
.companion-app .tsb-task { min-height: 42px; height: auto; gap: 6px; padding: 0 10px; transition: none; }
|
||||
.companion-app .tsb-task.active { background: var(--bg-active); color: var(--text); }
|
||||
.companion-app .tsb-task-open {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
gap: 8px;
|
||||
min-height: 40px;
|
||||
padding: 4px 0;
|
||||
border: none;
|
||||
background: none;
|
||||
color: inherit;
|
||||
text-align: left;
|
||||
cursor: pointer;
|
||||
}
|
||||
.companion-app .tsb-task-open > svg { flex: none; }
|
||||
.companion-app .tsb-task-t { font-size: var(--fs-ui-base); }
|
||||
.companion-app .tsb-task-tm { color: var(--text-dim); }
|
||||
.companion-app .tsb-task:focus-within .tsb-row-acts { display: inline-flex; }
|
||||
.companion-app .tsb-task:focus-within .tsb-task-tm { display: none; }
|
||||
.companion-app .tsb-row-menu {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
flex: none;
|
||||
padding: 0;
|
||||
border: none;
|
||||
border-radius: var(--radius-sm);
|
||||
background: none;
|
||||
color: var(--text-dim);
|
||||
cursor: pointer;
|
||||
}
|
||||
.companion-app .tsb-row-menu:hover { background: var(--bg-hover); color: var(--text); }
|
||||
.companion-app .tsb-bottom { padding: 10px 12px; gap: 4px; background: var(--workbench-chrome-hover); }
|
||||
.companion-app .tsb-tool { min-height: 38px; padding: 7px 10px; }
|
||||
.companion-app .tsb-avatar { background: var(--bg-active); color: var(--text); box-shadow: none; border-radius: var(--radius-full); }
|
||||
.companion-app .tsb-user-sub { color: var(--text-dim); }
|
||||
.companion-app .tsb-footer { padding: 10px 12px; }
|
||||
.companion-app .tsb-user { min-height: 46px; height: auto; }
|
||||
.companion-app .right-panel .inbox-scope {
|
||||
gap: 4px;
|
||||
margin: 14px 20px 0;
|
||||
padding: 4px;
|
||||
border: 1px solid var(--border-soft);
|
||||
border-radius: var(--radius);
|
||||
background: var(--bg);
|
||||
}
|
||||
.companion-app .right-panel .inbox-scope button {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
border: none;
|
||||
border-radius: var(--radius-sm);
|
||||
padding: 5px 10px;
|
||||
opacity: 1;
|
||||
color: var(--text-dim);
|
||||
font-size: var(--fs-ui-sm);
|
||||
white-space: nowrap;
|
||||
}
|
||||
.companion-app .right-panel .inbox-scope button.active { background: var(--bg-raised); box-shadow: var(--shadow-md); color: var(--text); }
|
||||
.companion-app .tsb-menu {
|
||||
min-width: min(216px, calc(100vw - 16px));
|
||||
max-width: min(360px, calc(100vw - 16px));
|
||||
max-height: calc(100dvh - 16px);
|
||||
overflow-y: auto;
|
||||
}
|
||||
.companion-app .tsb-mi { overflow-wrap: anywhere; }
|
||||
|
||||
.companion-app.compact .companion-topbar { flex-wrap: wrap; padding: 8px 12px; }
|
||||
.companion-app.compact .shell-navigation { width: 100%; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
|
||||
.companion-app.compact .shell-nav-button { min-width: 0; min-height: 40px; flex-wrap: wrap; gap: 0 4px; padding: 4px; }
|
||||
.companion-app.compact .shell-nav-button > svg { display: none; }
|
||||
.companion-app.compact .shell-return { min-height: 36px; padding: 4px 8px; font-size: var(--fs-ui-sm); }
|
||||
.companion-app.compact .left-nav,
|
||||
.companion-app.compact .main,
|
||||
.companion-app.compact .right-panel { flex: 1 1 100%; width: 100%; }
|
||||
.companion-app.compact .tsb-tool { min-height: 40px; }
|
||||
.companion-app.compact .tsb-footer { padding: 8px 12px; }
|
||||
.companion-app.compact .tsb-row-acts,
|
||||
.companion-app.compact .tsb-task:focus-within .tsb-row-acts { display: none; }
|
||||
@@ -4,6 +4,7 @@ import { useState } from 'react'
|
||||
import { api } from '../api'
|
||||
import { store, useStore } from '../store'
|
||||
import { Icon } from '@ui'
|
||||
import { humanChangePasswordError } from './LoginPage'
|
||||
|
||||
function Shell({ title, onClose, children }: { title: string; onClose: () => void; children: React.ReactNode }) {
|
||||
return (
|
||||
@@ -20,7 +21,10 @@ function Shell({ title, onClose, children }: { title: string; onClose: () => voi
|
||||
)
|
||||
}
|
||||
|
||||
/** 主动改密(账户菜单入口):当前密码 + 新密码 + 确认。 */
|
||||
/** 主动改密(账户菜单入口):用户名(只读关联)+ 当前密码 + 新密码 + 确认。
|
||||
* 表单语义(2026-10-12 增量 3):<form onSubmit> 承载提交(Enter 可用)、autocomplete
|
||||
* 三段标注(username/current-password/new-password)、label 与 input 关联;
|
||||
* 错误文案复用 humanChangePasswordError——401 不再一刀切成「当前密码不正确」。 */
|
||||
export function ChangePasswordModal({ onClose }: { onClose: () => void }) {
|
||||
const me = useStore(s => s.me)
|
||||
const [current, setCurrent] = useState('')
|
||||
@@ -41,23 +45,28 @@ export function ChangePasswordModal({ onClose }: { onClose: () => void }) {
|
||||
store.toast('密码已更新')
|
||||
setTimeout(onClose, 900)
|
||||
} catch (e) {
|
||||
setErr(String(e).includes('401') ? '当前密码不正确' : String(e))
|
||||
setErr(humanChangePasswordError(String(e)))
|
||||
} finally { setBusy(false) }
|
||||
}
|
||||
|
||||
return (
|
||||
<Shell title="修改密码" onClose={onClose}>
|
||||
{ok ? <div className="ad-notice">密码已更新,其他设备的会话已注销。</div> : (
|
||||
<div className="ad-changepw">
|
||||
<label className="lg-label">当前密码({me?.owner ?? ''})</label>
|
||||
<input className="lg-input" type="password" value={current} onChange={e => setCurrent(e.target.value)} autoFocus />
|
||||
<label className="lg-label">新密码(≥8 位)</label>
|
||||
<input className="lg-input" type="password" value={next} onChange={e => setNext(e.target.value)} />
|
||||
<label className="lg-label">确认新密码</label>
|
||||
<input className="lg-input" type="password" value={confirm} onChange={e => setConfirm(e.target.value)} />
|
||||
<form className="ad-changepw" onSubmit={e => { e.preventDefault(); submit() }}>
|
||||
<label className="lg-label" htmlFor="changepw-username">用户名</label>
|
||||
<input id="changepw-username" className="lg-input" value={me?.owner ?? ''} readOnly autoComplete="username" />
|
||||
<label className="lg-label" htmlFor="changepw-current">当前密码</label>
|
||||
<input id="changepw-current" className="lg-input" type="password" autoComplete="current-password"
|
||||
value={current} onChange={e => setCurrent(e.target.value)} autoFocus />
|
||||
<label className="lg-label" htmlFor="changepw-next">新密码(≥8 位)</label>
|
||||
<input id="changepw-next" className="lg-input" type="password" autoComplete="new-password"
|
||||
value={next} onChange={e => setNext(e.target.value)} />
|
||||
<label className="lg-label" htmlFor="changepw-confirm">确认新密码</label>
|
||||
<input id="changepw-confirm" className="lg-input" type="password" autoComplete="new-password"
|
||||
value={confirm} onChange={e => setConfirm(e.target.value)} />
|
||||
{err && <div className="lg-err"><Icon name="alert" size={14} />{err}</div>}
|
||||
<button className="lg-submit" disabled={busy || !current || !next || !confirm} onClick={submit}>{busy ? '提交中…' : '更新密码'}</button>
|
||||
</div>
|
||||
<button className="lg-submit" type="submit" disabled={busy || !current || !next || !confirm}>{busy ? '提交中…' : '更新密码'}</button>
|
||||
</form>
|
||||
)}
|
||||
</Shell>
|
||||
)
|
||||
|
||||
@@ -1,10 +1,17 @@
|
||||
// 系统管理(重设计方案 阶段②):管理员专属的全屏独立视图(带返回,非弹窗)。
|
||||
// 系统管理(重设计方案 阶段②):全屏独立视图(带返回,非弹窗)。
|
||||
// 用户决策:系统管理 = 全屏独立视图;普通用户界面不暴露任何系统能力。
|
||||
// 分区注册表:新增管理页只改 SECTIONS,不改 AdminZone 本体(声明式注册)。
|
||||
// WP3-I3/KTD4:编译插件可经 Registry.AddAdminZone 声明展示分区(服务端
|
||||
// /api/admin-zone/sections 下发);声明分区对全部认证主体开放,区内数据
|
||||
// 能力由分区组件自身的命令面 fail-closed——前端只消费、不合并角色。
|
||||
import { useState } from 'react'
|
||||
import { store, useStore } from '../store'
|
||||
import { Icon, type IconName } from '@ui'
|
||||
import { UsersPanel, ProfilesSection, PluginsSection, PluginWorkspacesPanel } from './adminSections'
|
||||
import { EmptyState, Icon, type IconName } from '@ui'
|
||||
import { UsersPanel, ProfilesSection, PluginsSection, PluginWorkspacesPanel, SystemSettingsPanel } from './adminSections'
|
||||
import { ExecEnvPanel } from './ExecEnvPanel'
|
||||
import { RdmAuditWorkspace } from './RdmAuditWorkspace'
|
||||
import { RdmRolesPanel } from './adminRdmSections'
|
||||
import type { AdminZoneSection } from '../api'
|
||||
|
||||
interface AdminSectionDef {
|
||||
key: string
|
||||
@@ -21,18 +28,59 @@ function ProfilesPanelWrapper() {
|
||||
}
|
||||
|
||||
const SECTIONS: AdminSectionDef[] = [
|
||||
{ key: 'users', label: '用户管理', icon: 'users', desc: '建号、发放初始密码、重置密码(管理员发放制)', render: () => <UsersPanel /> },
|
||||
{ key: 'users', label: '用户管理', icon: 'users', desc: '建号、发放初始密码、生成一次性登录密码(管理员发放制)', render: () => <UsersPanel /> },
|
||||
// U6/KTD5:RDM 专业角色管理——命令面齐备(rdmRolesAvailable)才显示;普通基座零暴露。
|
||||
{ key: 'rdm-roles', label: 'RDM 角色权限', icon: 'shield', desc: '专业角色:动作默认/上限、账号绑定、停用(仅管理员)', render: () => <RdmRolesPanel /> },
|
||||
{ key: 'profiles', label: '智能体画像', icon: 'bot', desc: '系统级画像:系统提示、工具允许/确认/拒绝清单', render: () => <ProfilesPanelWrapper /> },
|
||||
// P2 受管:模型/密钥/Tavily/遥测/运行基础设施的唯一写入面(Backend PR 188 系统设置 API)。
|
||||
{ key: 'system-settings', label: '模型与服务配置', icon: 'settings', desc: '系统受管项:模型、密钥、Tavily、遥测与运行基础设施(仅管理员)', render: () => <SystemSettingsPanel /> },
|
||||
{ key: 'plugins', label: '插件管理', icon: 'puzzle', desc: '已装载插件清单与热重载(装卸不影响核心)', render: () => <PluginsSection /> },
|
||||
{ key: 'python-env', label: 'Python 环境', icon: 'package', desc: '基础层、扩展申请、回收和 wheel 上传(仅管理员)', render: () => <ExecEnvPanel /> },
|
||||
{ key: 'workspaces', label: '插件工作区', icon: 'grid', desc: '插件声明面板与服务端声明工作区', render: () => <PluginWorkspacesPanel /> },
|
||||
]
|
||||
|
||||
/** 声明分区 → 内置分区组件(按声明 ID 映射;AdminZone 不硬编码领域逻辑)。 */
|
||||
const DECLARED_COMPONENTS: Record<string, () => React.ReactNode> = {
|
||||
'rdm.audit': () => <RdmAuditWorkspace />,
|
||||
}
|
||||
|
||||
/** icon 走基座 IconName 词表;声明携带未知图标时回退通用图标(不渲染空白)。 */
|
||||
const ICONS: IconName[] = ['plus', 'search', 'panel-left', 'inbox', 'settings', 'sun', 'moon', 'pin', 'archive', 'undo',
|
||||
'chevron-right', 'chevron-down', 'folder', 'message', 'package', 'bot', 'puzzle', 'grid', 'arrow-up', 'paperclip',
|
||||
'more', 'logout', 'key', 'user', 'users', 'shield', 'x', 'check', 'alert', 'send', 'sparkles', 'clock', 'list',
|
||||
'file', 'image', 'download', 'trash', 'eye', 'maximize', 'minimize']
|
||||
function declaredIcon(name?: string): IconName {
|
||||
return (ICONS as string[]).includes(name ?? '') ? (name as IconName) : 'grid'
|
||||
}
|
||||
|
||||
function DeclaredSection({ section }: { section: AdminZoneSection }) {
|
||||
const render = DECLARED_COMPONENTS[section.id]
|
||||
if (!render) {
|
||||
return <EmptyState icon="puzzle">分区「{section.title}」由内置插件声明,但当前前端版本未携带其组件<br />(部署前端与二进制版本不匹配时会出现;升级前端即可)</EmptyState>
|
||||
}
|
||||
return <>{render()}</>
|
||||
}
|
||||
|
||||
export function AdminZone() {
|
||||
const me = useStore(s => s.me)
|
||||
const declared = useStore(s => s.adminSections)
|
||||
const rdmRolesAvailable = useStore(s => s.rdmRolesAvailable)
|
||||
const [sectionKey, setSectionKey] = useState('users')
|
||||
// 双保险:入口已在菜单层门控(me?.isAdmin),此处再拦一次(纵深防御)。
|
||||
if (!me?.isAdmin) return null
|
||||
const section = SECTIONS.find(s => s.key === sectionKey) ?? SECTIONS[0]
|
||||
const isAdmin = !!me?.isAdmin
|
||||
// 门控:基座系统分区仅 isAdmin(纵深防御与菜单层一致);声明分区对全部
|
||||
// 认证主体开放(区内能力由组件命令面判定)。两者皆无时不渲染。
|
||||
if (!isAdmin && declared.length === 0) return null
|
||||
const sections: AdminSectionDef[] = [
|
||||
...(isAdmin ? SECTIONS.filter(s => s.key !== 'rdm-roles' || rdmRolesAvailable) : []),
|
||||
...declared.map(s => ({
|
||||
key: `decl:${s.id}`, label: s.title, icon: declaredIcon(s.icon),
|
||||
desc: s.desc || '插件声明的管理分区(区内数据能力由插件命令面判定)',
|
||||
render: () => <DeclaredSection section={s} />,
|
||||
})),
|
||||
]
|
||||
const fallback = sections[0]?.key ?? ''
|
||||
const section = sections.find(s => s.key === sectionKey) ?? sections[0]
|
||||
if (!section) return null
|
||||
return (
|
||||
<div className="az" role="dialog" aria-label="系统管理">
|
||||
<div className="az-head">
|
||||
@@ -40,14 +88,14 @@ export function AdminZone() {
|
||||
<Icon name="chevron-down" size={14} /> 返回工作台
|
||||
</button>
|
||||
<span className="az-title">系统管理</span>
|
||||
<span className="az-sub">仅管理员可见 · 变更即时生效</span>
|
||||
<span className="az-sub">{isAdmin ? '仅管理员可见' : '按插件声明开放'} · 变更即时生效</span>
|
||||
<span style={{ flex: 1 }} />
|
||||
<span className="az-tenant">{me.owner}</span>
|
||||
<span className="az-tenant">{me?.owner ?? ''}</span>
|
||||
</div>
|
||||
<div className="az-body">
|
||||
<nav className="az-side">
|
||||
{SECTIONS.map(s => (
|
||||
<button key={s.key} className={`az-nav-item ${s.key === sectionKey ? 'on' : ''}`} onClick={() => setSectionKey(s.key)}>
|
||||
{sections.map(s => (
|
||||
<button key={s.key} className={`az-nav-item ${s.key === (section?.key ?? fallback) ? 'on' : ''}`} onClick={() => setSectionKey(s.key)}>
|
||||
<Icon name={s.icon} size={15} />
|
||||
<span>{s.label}</span>
|
||||
</button>
|
||||
|
||||
@@ -19,10 +19,12 @@ export function AgentTracker() {
|
||||
// 中间过程:该会话消息树中归属子代理 run 的消息(run_id 过滤)。
|
||||
const subMessages: Record<string, Message[]> = {}
|
||||
for (const m of messagesAll) {
|
||||
if (m.runId && m.runId !== runId) (subMessages[m.runId] ??= []).push(m)
|
||||
if (m.role === 'assistant' && m.runId && m.runId !== runId) (subMessages[m.runId] ??= []).push(m)
|
||||
}
|
||||
const focus = selected ?? children[0]?.id ?? runId
|
||||
const focusMsgs = focus === runId ? messagesAll.filter(m => m.runId === runId) : subMessages[focus] ?? []
|
||||
const focusMsgs = focus === runId
|
||||
? messagesAll.filter(m => m.role === 'assistant' && m.runId === runId)
|
||||
: subMessages[focus] ?? []
|
||||
|
||||
return (
|
||||
// 阶段③ 收敛:只保留 OverlayHost 一层壳(此前在其内又嵌 .modal 双层窗框)。
|
||||
@@ -76,7 +78,10 @@ export function AgentTracker() {
|
||||
|
||||
function UsageBadge({ usage }: { usage?: Usage | null }) {
|
||||
if (!usage) return null
|
||||
return <span className="effect-badge" title="token 用量与时长">
|
||||
{usage.totalTokens > 0 ? `${usage.totalTokens} tok · ` : ''}{(usage.durationMs / 1000).toFixed(1)}s{usage.toolCalls > 0 ? ` · ${usage.toolCalls} 工具` : ''}
|
||||
// N3 计费拆分:有上一请求数据时显示「+最近 · 累计(含缓存命中)」。
|
||||
const last = (usage.lastPromptTokens ?? 0) + (usage.lastCompletionTokens ?? 0)
|
||||
const cache = usage.cacheReadTokens ?? 0
|
||||
return <span className="effect-badge" title={cache > 0 ? `token 用量与时长(缓存命中 ${cache})` : 'token 用量与时长'}>
|
||||
{last > 0 ? `+${last} · ` : ''}{usage.totalTokens > 0 ? `累计 ${usage.totalTokens} tok · ` : ''}{(usage.durationMs / 1000).toFixed(1)}s{usage.toolCalls > 0 ? ` · ${usage.toolCalls} 工具` : ''}
|
||||
</span>
|
||||
}
|
||||
|
||||
@@ -1,19 +1,27 @@
|
||||
// 工件面板(工作区文件管理):搜索 + kind 过滤 + 上传;行内打开预览区或下载。
|
||||
// ⌘1 弹层与右栏「文件」页签共用这一份。删除仍是保留能力,系统默认不提供入口。
|
||||
// 文件列表(第三栏「文件」入口的主视图):搜索 + kind 过滤 + 上传;
|
||||
// 行内打开预览(同入口切到预览子视图)或下载。删除仍是保留能力,系统默认不提供入口。
|
||||
import { useState } from 'react'
|
||||
import { store, useStore } from '../store'
|
||||
import { api } from '../api'
|
||||
import { Icon } from '@ui'
|
||||
import { Collapsible, Icon } from '@ui'
|
||||
import { artifactIcon, humanSize } from '../messageparts'
|
||||
import type { Artifact } from '../contracts'
|
||||
import { groupArtifactsByName } from '../artifactGrouping'
|
||||
import { surfaceKey } from '../surfaceKey'
|
||||
|
||||
export function ArtifactsPanel() {
|
||||
const artifacts = useStore(s => s.artifacts)
|
||||
const surfaces = useStore(s => s.surfaces)
|
||||
const [q, setQ] = useState('')
|
||||
const [kind, setKind] = useState<'all' | 'document' | 'data' | 'image'>('all')
|
||||
|
||||
const kinds = ['all', 'document', 'data', 'image'] as const
|
||||
const visible = artifacts.filter(a =>
|
||||
(kind === 'all' || a.kind === kind) && a.name.toLowerCase().includes(q.toLowerCase()))
|
||||
// 同名工件 = 同一交付物的版本序列(存储保留全量):面板按名称分组去重,
|
||||
// 只显示最新版;组>1 时可展开看历史版本。2026-10-11 实测 3 份同名转写报告
|
||||
// 并列的直接修复(存储与提示词语义「修订=新版本」保持不变)。
|
||||
const groups = groupArtifactsByName(visible)
|
||||
|
||||
return (
|
||||
<div className="artifacts-panel">
|
||||
@@ -32,26 +40,50 @@ export function ArtifactsPanel() {
|
||||
}} />
|
||||
</label>
|
||||
</div>
|
||||
{artifacts.length === 0
|
||||
? <div className="empty-note">暂无文件——上传附件或让模型产出文档(mock:#doc);这里可浏览、预览、下载</div>
|
||||
: visible.length === 0
|
||||
? <div className="empty-note">没有匹配「{q}」的文件</div>
|
||||
: visible.map(a => (
|
||||
// 预览落在对话右侧预览区。弹层盖住主区,先收起再打开。
|
||||
<div key={a.id} className="artifact-row" data-artifact-row={a.id}
|
||||
onClick={() => { store.closeWorkspace(); store.requestPreview(a) }} title={`预览 ${a.name}`}>
|
||||
<span className="ar-icon"><Icon name={artifactIcon(a.name, a.kind)} size={15} /></span>
|
||||
{surfaces.length > 0 && (
|
||||
<div className="ap-surfaces" data-ap-surfaces>
|
||||
<div className="ap-section-title">生成页面</div>
|
||||
{surfaces.filter(sv => surfaceKey(sv) != null).map(sv => {
|
||||
const id = surfaceKey(sv)!
|
||||
return (
|
||||
<div key={id} className="artifact-row" data-surface-row={id}
|
||||
onClick={() => store.openSurface(id)} title={`打开页面 ${sv.spec?.title ?? ''}`}>
|
||||
<span className="ar-icon"><Icon name="grid" size={15} /></span>
|
||||
<span className="ar-main">
|
||||
<span className="name">{a.name}</span>
|
||||
<span className="meta">{a.kind} · {humanSize(a.size) || '—'} · {shortTime(a.updatedAt)}</span>
|
||||
</span>
|
||||
<span className="ar-acts">
|
||||
<button className="icon-btn" title="全屏预览" onClick={e => { e.stopPropagation(); store.closeWorkspace(); store.requestPreview(a, 'full') }}><Icon name="eye" size={14} /></button>
|
||||
<a className="icon-btn" title="下载" href={api.artifactDownloadUrl(a.id)} download={a.name}
|
||||
onClick={e => e.stopPropagation()}><Icon name="download" size={14} /></a>
|
||||
<span className="name">{sv.spec?.title || '(未命名页面)'}</span>
|
||||
<span className="meta">页面 · 修订 {sv.revision} · {sv.identity?.pluginId}</span>
|
||||
</span>
|
||||
</div>
|
||||
))}
|
||||
)
|
||||
})}
|
||||
</div>
|
||||
)}
|
||||
{artifacts.length === 0
|
||||
? <div className="empty-note">暂无文件,可添加材料或在对话中生成文档</div>
|
||||
: visible.length === 0
|
||||
? <div className="empty-note">没有匹配「{q}」的文件</div>
|
||||
: groups.map(g => g.versions.length === 1
|
||||
? <ArtifactRow key={g.latest.id} a={g.latest} />
|
||||
: <Collapsible key={g.latest.id} id={'artv:' + g.latest.id}
|
||||
trigger={
|
||||
<div className="artifact-row artifact-group" data-artifact-group={g.latest.id}>
|
||||
<ArtifactRowInner a={g.latest} badge={`${g.versions.length} 版`} />
|
||||
</div>
|
||||
}>
|
||||
{g.versions.slice(1).map(v => (
|
||||
<div key={v.id} className="artifact-row artifact-version" data-artifact-version={v.id}
|
||||
onClick={() => store.requestPreview(v)} title={`预览历史版本 ${v.name}`}>
|
||||
<span className="ar-icon"><Icon name="clock" size={13} /></span>
|
||||
<span className="ar-main">
|
||||
<span className="meta">v{shortTime(v.updatedAt)} · {humanSize(v.size) || '—'}</span>
|
||||
</span>
|
||||
<span className="ar-acts">
|
||||
<a className="icon-btn" title="下载此版本" href={api.artifactDownloadUrl(v.id)} download={v.name}
|
||||
onClick={e => e.stopPropagation()}><Icon name="download" size={13} /></a>
|
||||
</span>
|
||||
</div>
|
||||
))}
|
||||
</Collapsible>)}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -65,3 +97,32 @@ function shortTime(iso: string): string {
|
||||
: d.toLocaleDateString([], { month: '2-digit', day: '2-digit' })
|
||||
} catch { return '' }
|
||||
}
|
||||
|
||||
function ArtifactRow({ a }: { a: Artifact }) {
|
||||
return (
|
||||
// 预览落位在第三栏「文件」入口:requestPreview 会切到预览子视图。
|
||||
<div className="artifact-row" data-artifact-row={a.id}
|
||||
onClick={() => store.requestPreview(a)} title={`预览 ${a.name}`}>
|
||||
<ArtifactRowInner a={a} />
|
||||
<span className="ar-acts">
|
||||
<button className="icon-btn" title="展开预览(铺满主区)" onClick={e => { e.stopPropagation(); store.requestPreview(a); store.setUI({ previewExpanded: true }) }}><Icon name="maximize" size={14} /></button>
|
||||
<a className="icon-btn" title="下载" href={api.artifactDownloadUrl(a.id)} download={a.name}
|
||||
onClick={e => e.stopPropagation()}><Icon name="download" size={14} /></a>
|
||||
</span>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
function ArtifactRowInner({ a, badge }: { a: Artifact; badge?: string }) {
|
||||
return (
|
||||
<>
|
||||
<span className="ar-icon"><Icon name={artifactIcon(a.name, a.kind)} size={15} /></span>
|
||||
<span className="ar-main">
|
||||
<span className="name">{a.name}{badge ? <span className="ver-badge" data-ver-badge>{badge}</span> : null}</span>
|
||||
<span className="meta">{a.kind} · {humanSize(a.size) || '—'} · {shortTime(a.updatedAt)}</span>
|
||||
</span>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
|
||||
|
||||
@@ -0,0 +1,104 @@
|
||||
import { useEffect, useState } from 'react'
|
||||
import { Btn, SettingRow, SettingsGroup } from '@ui'
|
||||
import { api } from '../api'
|
||||
|
||||
const services = [
|
||||
['models.chat', '主模型'],
|
||||
['models.lightweight', '轻量模型'],
|
||||
['models.embedding', 'Embedding'],
|
||||
['models.rerank', 'Reranker'],
|
||||
['tools.tavily', 'Tavily'],
|
||||
] as const
|
||||
|
||||
type Secret = { id: string; service: string; label: string; active: boolean; mask: string }
|
||||
type Entry = { id: string; keys: string[]; content: string; constant: boolean; logic: string }
|
||||
type Cmd = { id: string; name: string; title: string; template: string }
|
||||
|
||||
export function BorrowPanels() {
|
||||
const [secrets, setSecrets] = useState<Secret[]>([])
|
||||
const [entries, setEntries] = useState<Entry[]>([])
|
||||
const [cmds, setCmds] = useState<Cmd[]>([])
|
||||
const [service, setService] = useState<string>(services[0][0])
|
||||
const [label, setLabel] = useState('')
|
||||
const [value, setValue] = useState('')
|
||||
const [keys, setKeys] = useState('')
|
||||
const [content, setContent] = useState('')
|
||||
const [constant, setConstant] = useState(false)
|
||||
const [cmdName, setCmdName] = useState('/summary')
|
||||
const [cmdTitle, setCmdTitle] = useState('总结')
|
||||
const [cmdBody, setCmdBody] = useState('请总结以上内容。\n{{input}}')
|
||||
|
||||
const reload = () => {
|
||||
api.listSecrets().then(setSecrets).catch(() => undefined)
|
||||
api.listContextEntries().then(setEntries).catch(() => undefined)
|
||||
api.listPromptCommands().then(setCmds).catch(() => undefined)
|
||||
}
|
||||
useEffect(() => { reload() }, [])
|
||||
|
||||
return (
|
||||
<>
|
||||
<SettingsGroup title="密钥">
|
||||
<SettingRow label="新增密钥" desc="每个服务同时只有一把生效。列表只显示掩码。">
|
||||
<select value={service} onChange={e => setService(e.target.value)}>
|
||||
{services.map(([id, name]) => <option key={id} value={id}>{name}</option>)}
|
||||
</select>
|
||||
</SettingRow>
|
||||
<SettingRow label="标签与密钥" desc="保存后立即生效,并停用同服务的其他密钥。">
|
||||
<input className="search-input" value={label} placeholder="标签" onChange={e => setLabel(e.target.value)} />
|
||||
<input className="search-input" type="password" autoComplete="new-password" value={value} placeholder="密钥" onChange={e => setValue(e.target.value)} />
|
||||
<Btn variant="primary" onClick={async () => {
|
||||
if (!value.trim()) return
|
||||
await api.createSecret(service, label || '未命名', value.trim())
|
||||
setValue(''); setLabel(''); reload()
|
||||
}}>添加</Btn>
|
||||
</SettingRow>
|
||||
{secrets.map(s => (
|
||||
<SettingRow key={s.id} label={s.label} desc={`${s.service} · ${s.mask}${s.active ? ' · 生效' : ''}`}>
|
||||
{!s.active && <Btn onClick={async () => { await api.activateSecret(s.id); reload() }}>启用</Btn>}
|
||||
<Btn onClick={async () => { await api.deleteSecret(s.id); reload() }}>删除</Btn>
|
||||
</SettingRow>
|
||||
))}
|
||||
</SettingsGroup>
|
||||
<SettingsGroup title="条件注入">
|
||||
<SettingRow label="关键词" desc="逗号分隔。用 /正则/ 表示正则。勾选后变为常驻。">
|
||||
<input className="search-input" value={keys} placeholder="关键词" onChange={e => setKeys(e.target.value)} />
|
||||
<label><input type="checkbox" checked={constant} onChange={e => setConstant(e.target.checked)} /> 常驻</label>
|
||||
</SettingRow>
|
||||
<SettingRow label="注入正文" desc="命中后附在上下文末尾,不改系统前缀。">
|
||||
<textarea rows={3} value={content} onChange={e => setContent(e.target.value)} />
|
||||
<Btn variant="primary" onClick={async () => {
|
||||
if (!content.trim()) return
|
||||
await api.saveContextEntry({
|
||||
keys: keys.split(/[,,]/).map(s => s.trim()).filter(Boolean),
|
||||
content: content.trim(), constant, logic: 'and', enabled: true, scanDepth: 4, budgetChars: 2000,
|
||||
})
|
||||
setContent(''); setKeys(''); reload()
|
||||
}}>添加</Btn>
|
||||
</SettingRow>
|
||||
{entries.map(e => (
|
||||
<SettingRow key={e.id} label={e.constant ? '常驻' : (e.keys.join(' / ') || '未命名')} desc={e.content}>
|
||||
<Btn onClick={async () => { await api.deleteContextEntry(e.id); reload() }}>删除</Btn>
|
||||
</SettingRow>
|
||||
))}
|
||||
</SettingsGroup>
|
||||
<SettingsGroup title="用户命令">
|
||||
<SettingRow label="命令" desc="发送 /名称 时展开成提示词。不会自动触发。{{input}} 换成命令后面的文字。">
|
||||
<input className="search-input" value={cmdName} onChange={e => setCmdName(e.target.value)} />
|
||||
<input className="search-input" value={cmdTitle} onChange={e => setCmdTitle(e.target.value)} />
|
||||
</SettingRow>
|
||||
<SettingRow label="模板" desc="名称需为小写字母、数字或连字符,例如 /summary。">
|
||||
<textarea rows={3} value={cmdBody} onChange={e => setCmdBody(e.target.value)} />
|
||||
<Btn variant="primary" onClick={async () => {
|
||||
await api.savePromptCommand({ name: cmdName, title: cmdTitle, template: cmdBody })
|
||||
reload()
|
||||
}}>添加</Btn>
|
||||
</SettingRow>
|
||||
{cmds.map(c => (
|
||||
<SettingRow key={c.id} label={c.name} desc={c.title}>
|
||||
<Btn onClick={async () => { await api.deletePromptCommand(c.id); reload() }}>删除</Btn>
|
||||
</SettingRow>
|
||||
))}
|
||||
</SettingsGroup>
|
||||
</>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,261 @@
|
||||
// 文档驾驶舱 I3:阅读器(连续正文 + 版本摘要/差异折叠)与右侧依据/影响面板。
|
||||
// 消费 I1/I3 命令面 rdm.cockpit.node(+versions)/node.history(Dev 仓 docs/superpowers
|
||||
// specs 2026-10-16 view-spec §5–§6)。不新增第四栏:右栏是选中节点的同一依据面,
|
||||
// 全景与阅读器共享 selectedNodeRef;面板刷新原位进行,不抢占滚动位置(DV-R05/§5)。
|
||||
// 折叠只用 @ui Collapsible;颜色/字号只消费 @ui/tokens.css。
|
||||
import { useCallback, useEffect, useRef, useState } from 'react'
|
||||
import { api } from '../api'
|
||||
import { Collapsible, EmptyState } from '@ui'
|
||||
import {
|
||||
assembleReader, diffLines, historyLine, mergeHistoryStrict, versionSummary,
|
||||
PANEL_TABS, type CockpitContentBlock, type CockpitHistorySummary,
|
||||
type CockpitMeta, type CockpitNodeRef, type CockpitTreeNode,
|
||||
type CockpitVersionSummary, type Density, type PanelTabId,
|
||||
} from '../documentCockpit'
|
||||
|
||||
export interface ReaderSelection { ref: CockpitNodeRef; parentDocId?: string }
|
||||
|
||||
interface NodeDetailShape {
|
||||
meta: CockpitMeta
|
||||
node: CockpitTreeNode
|
||||
body?: CockpitContentBlock[]
|
||||
children: CockpitTreeNode[]
|
||||
sources: { items: any[] }
|
||||
history: { items: CockpitHistorySummary[]; hasMore: boolean; nextCursor?: string }
|
||||
impacts: { items: any[] }
|
||||
conflicts: { items: any[] }
|
||||
versions?: CockpitVersionSummary[]
|
||||
}
|
||||
|
||||
function useNodeDetail(pid: string, sel?: CockpitNodeRef) {
|
||||
const [detail, setDetail] = useState<NodeDetailShape | null>(null)
|
||||
const [err, setErr] = useState('')
|
||||
const gen = useRef(0)
|
||||
useEffect(() => {
|
||||
const g = ++gen.current
|
||||
setDetail(null); setErr('')
|
||||
if (!sel) return
|
||||
api.rdmCommand<any>('rdm.cockpit.node', { projectId: pid, kind: sel.kind, id: sel.id })
|
||||
.then(d => {
|
||||
if (g !== gen.current) return
|
||||
// 后端空列表可能投影为 null(Go nil slice);统一归一,消费端按数组使用。
|
||||
for (const k of ['sources', 'history', 'impacts', 'conflicts'] as const) {
|
||||
if (d?.[k] && !Array.isArray(d[k].items)) d[k].items = []
|
||||
}
|
||||
setDetail(d)
|
||||
})
|
||||
.catch(e => { if (g === gen.current) setErr(e.message) })
|
||||
return () => { gen.current++ }
|
||||
}, [pid, sel?.kind, sel?.id])
|
||||
return { detail, err }
|
||||
}
|
||||
|
||||
/** 版本块:当前版本 + 前一版本摘要;完整差异(行级标记)折叠。受限只给元数据。 */
|
||||
export function VersionBlock({ versions, density }: { versions?: CockpitVersionSummary[]; density: Density }) {
|
||||
if (!versions || versions.length === 0) return null
|
||||
const { current, previous, redacted } = versionSummary(versions)
|
||||
if (redacted || !current || current.content === undefined) {
|
||||
return <div className="empty-note">版本受限(仅元数据可见)</div>
|
||||
}
|
||||
const prev = previous && previous.content !== undefined ? previous : undefined
|
||||
return (
|
||||
<Collapsible
|
||||
id={`cockpit-versions-${current.version}`}
|
||||
trigger={<span className="cockpit-versions-toggle">版本 {current.version}{previous ? `(前一版 ${previous.version})` : '(首版)'}与完整差异</span>}
|
||||
>
|
||||
<div className={`cockpit-versions cockpit-density-${density}`}>
|
||||
{prev ? (
|
||||
<>
|
||||
<div className="cockpit-versions-head">当前 {current.version} · {current.actor || '未知'} · {new Date(current.at).toLocaleString('zh-CN')}</div>
|
||||
<pre className="cockpit-diff">
|
||||
{diffLines(current.content || '', prev.content || '').map((l, i) => (
|
||||
<div key={i} className={`cockpit-diff-${l.flag === '=' ? 'same' : l.flag === '+' ? 'add' : 'del'}`}>{l.flag} {l.text}</div>
|
||||
))}
|
||||
</pre>
|
||||
<div className="cockpit-versions-head">前一版 {prev.version} · {prev.actor || '未知'} · {new Date(prev.at).toLocaleString('zh-CN')}</div>
|
||||
</>
|
||||
) : (
|
||||
<div className="cockpit-versions-head">首版 · {current.actor || '未知'} · {new Date(current.at).toLocaleString('zh-CN')}</div>
|
||||
)}
|
||||
</div>
|
||||
</Collapsible>
|
||||
)
|
||||
}
|
||||
|
||||
/** 阅读器中栏:选中章节=该节连续正文+版本块;选中文档=全章节连续装配(每节详情按需拉取)。 */
|
||||
export function CockpitReader({ pid, selection, sections, density, onBack }: {
|
||||
pid: string
|
||||
selection: ReaderSelection
|
||||
sections: CockpitTreeNode[]
|
||||
density: Density
|
||||
onBack: () => void
|
||||
}) {
|
||||
const { detail, err } = useNodeDetail(pid, selection.ref)
|
||||
const isSection = selection.ref.kind === 'section'
|
||||
const [sectionDetails, setSectionDetails] = useState<Record<string, NodeDetailShape | undefined>>({})
|
||||
const gen = useRef(0)
|
||||
// 文档阅读器:按树顺序装配全部章节详情(上限 20;失败章节给受限占位不拖垮整篇)。
|
||||
useEffect(() => {
|
||||
if (isSection || selection.ref.kind !== 'document') return
|
||||
const g = ++gen.current
|
||||
const list = sections.slice(0, 20)
|
||||
setSectionDetails({})
|
||||
for (const sec of list) {
|
||||
api.rdmCommand<any>('rdm.cockpit.node', { projectId: pid, kind: 'section', id: sec.ref.id })
|
||||
.then(d => { if (g === gen.current) setSectionDetails(prev => ({ ...prev, [sec.ref.id]: d })) })
|
||||
.catch(() => { if (g === gen.current) setSectionDetails(prev => ({ ...prev, [sec.ref.id]: undefined })) })
|
||||
}
|
||||
return () => { gen.current++ }
|
||||
}, [pid, isSection, selection.ref.id, sections])
|
||||
const anchorRef = useRef<HTMLDivElement | null>(null)
|
||||
useEffect(() => { anchorRef.current?.scrollIntoView({ block: 'start' }) }, [selection.ref.id])
|
||||
if (err) return <EmptyState icon="alert">阅读器加载失败:{err}</EmptyState>
|
||||
return (
|
||||
<div className={`cockpit-reader cockpit-density-${density}`}>
|
||||
<div className="cockpit-nodehead" ref={anchorRef}>
|
||||
<button type="button" className="cockpit-back" onClick={onBack}>← 返回全景</button>
|
||||
<span className="cockpit-nodetitle">{detail?.node?.title || (isSection ? '章节' : '文档')}</span>
|
||||
</div>
|
||||
{isSection && detail && (
|
||||
<>
|
||||
{renderBody(detail.body, detail.meta)}
|
||||
<VersionBlock versions={detail.versions} density={density} />
|
||||
</>
|
||||
)}
|
||||
{!isSection && (
|
||||
<>
|
||||
{sections.length === 0 && <div className="empty-note">该文档暂无章节</div>}
|
||||
{assembleReader(sections, sectionDetails).map(sec => (
|
||||
<section key={sec.ref.id} id={`sec-${sec.ref.id}`} className="cockpit-reader-section">
|
||||
<div className="cockpit-reader-sechead">
|
||||
<span className="cockpit-reader-sectitle">{sec.title}</span>
|
||||
{sec.blocks[0]?.kind === 'restricted'
|
||||
? <span className="cockpit-badge">内容受限({sec.blocks[0].reason || '权限'})</span>
|
||||
: sec.contentState === 'empty' && <span className="cockpit-badge">空</span>}
|
||||
</div>
|
||||
{sec.blocks.map((b, i) => b.kind === 'text'
|
||||
? <p key={i} className="cockpit-reader-para">{b.text}</p>
|
||||
: <p key={i} className="empty-note">内容受限——标题与状态可见,正文不展示</p>)}
|
||||
<VersionBlock versions={sec.versions} density={density} />
|
||||
</section>
|
||||
))}
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
function renderBody(body: CockpitContentBlock[] | undefined, meta: CockpitMeta) {
|
||||
if (!body || body.length === 0) return <div className="empty-note">暂无正文</div>
|
||||
if (body[0].kind === 'restricted') {
|
||||
return <div className="empty-note">内容受限({body[0].reason || '权限'})——标题与状态可见,正文不展示</div>
|
||||
}
|
||||
return (
|
||||
<>
|
||||
{body.map((b, i) => <p key={i} className="cockpit-reader-para">{b.text}</p>)}
|
||||
{meta.truncated && <div className="cockpit-truncated">详情已截断:{meta.truncationReasons?.join(';')}</div>}
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
/** 右栏:依据/历史/影响/冲突四标签(同一选中节点;刷新原位,不抢占滚动)。 */
|
||||
export function CockpitPanel({ pid, selection, tab, onTab, density }: {
|
||||
pid: string
|
||||
selection: ReaderSelection
|
||||
tab: PanelTabId
|
||||
onTab: (t: PanelTabId) => void
|
||||
density: Density
|
||||
}) {
|
||||
const { detail, err } = useNodeDetail(pid, selection.ref)
|
||||
const [historyItems, setHistoryItems] = useState<CockpitHistorySummary[]>([])
|
||||
const [historyMore, setHistoryMore] = useState(false)
|
||||
const [historyCursor, setHistoryCursor] = useState<string | undefined>(undefined)
|
||||
useEffect(() => {
|
||||
setHistoryItems([]); setHistoryMore(false); setHistoryCursor(undefined)
|
||||
}, [selection.ref.kind, selection.ref.id])
|
||||
useEffect(() => {
|
||||
if (!detail?.history) return
|
||||
// 严格合并:只接受 seq 更新的条目,乱序/重复丢弃;不重置已渲染内容。
|
||||
setHistoryItems(prev => mergeHistoryStrict(prev, detail.history.items).items)
|
||||
setHistoryMore(detail.history.hasMore)
|
||||
setHistoryCursor(detail.history.nextCursor)
|
||||
}, [detail])
|
||||
const loadMoreHistory = useCallback(() => {
|
||||
if (!historyCursor) return
|
||||
api.rdmCommand<any>('rdm.cockpit.node.history', { projectId: pid, kind: selection.ref.kind, id: selection.ref.id, cursor: historyCursor, limit: 20 })
|
||||
.then(page => {
|
||||
setHistoryItems(prev => mergeHistoryStrict(prev, page.items).items)
|
||||
setHistoryMore(page.hasMore)
|
||||
setHistoryCursor(page.nextCursor)
|
||||
})
|
||||
.catch(() => { /* 保留已渲染历史;可再次点击重试 */ })
|
||||
}, [pid, selection.ref.kind, selection.ref.id, historyCursor])
|
||||
const node = detail?.node
|
||||
return (
|
||||
<div className={`cockpit-panel cockpit-density-${density}`}>
|
||||
<div className="cockpit-panel-tabs" role="tablist" aria-label="依据与影响">
|
||||
{PANEL_TABS.map(t => (
|
||||
<button key={t.id} type="button" role="tab" aria-selected={tab === t.id}
|
||||
className={`cockpit-panel-tab${tab === t.id ? ' cockpit-panel-tab-active' : ''}`}
|
||||
onClick={() => onTab(t.id)}>
|
||||
{t.label}
|
||||
</button>
|
||||
))}
|
||||
</div>
|
||||
{err && <div className="empty-note">依据面板加载失败:{err}</div>}
|
||||
{!err && !detail && <div className="empty-note">加载依据…</div>}
|
||||
{detail && tab === 'sources' && (
|
||||
<div className="cockpit-panel-body">
|
||||
<div className="cockpit-panel-count">来源 {node?.state.sourceCount ?? detail.sources.items.length} 条</div>
|
||||
{detail.sources.items.length === 0 && <div className="empty-note">无来源——章节正文未挂依据切片</div>}
|
||||
{detail.sources.items.map((s: any) => (
|
||||
<div key={s.ref.id} className="cockpit-panel-row">
|
||||
<span className="cockpit-panel-kind">{s.ref.kind}</span>
|
||||
<span className="cockpit-panel-label">{s.label}</span>
|
||||
{s.confidence && <span className="cockpit-badge">置信度 {s.confidence}</span>}
|
||||
{s.redactedReason
|
||||
? <span className="cockpit-badge">受限({s.redactedReason})</span>
|
||||
: s.verification && s.verification !== 'not_applicable' && <span className="cockpit-badge">{s.verification}</span>}
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
{detail && tab === 'history' && (
|
||||
<div className="cockpit-panel-body">
|
||||
<div className="cockpit-panel-count">已提交事件(最新在前)</div>
|
||||
{historyItems.length === 0 && <div className="empty-note">暂无历史</div>}
|
||||
{historyItems.map(h => <div key={h.seq} className="cockpit-panel-row">{historyLine(h)}</div>)}
|
||||
{historyMore && <button type="button" className="cockpit-tree-more" onClick={loadMoreHistory}>加载更早历史</button>}
|
||||
</div>
|
||||
)}
|
||||
{detail && tab === 'impacts' && (
|
||||
<div className="cockpit-panel-body">
|
||||
<div className="cockpit-panel-count">影响 {node?.state.impactCount ?? detail.impacts.items.length} 项(一跳)</div>
|
||||
{detail.impacts.items.length === 0 && <div className="empty-note">无一跳影响对象</div>}
|
||||
{detail.impacts.items.map((r: any, i: number) => (
|
||||
<div key={`${r.ref.kind}-${r.ref.id}-${i}`} className="cockpit-panel-row">
|
||||
<span className="cockpit-panel-kind">{r.direction === 'incoming' ? '←' : '→'}</span>
|
||||
<span className="cockpit-panel-label">{r.ref.kind}:{r.ref.id}</span>
|
||||
<span className="cockpit-badge">{r.edgeType}</span>
|
||||
<span className="cockpit-badge">{r.edgeState}</span>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
{detail && tab === 'conflicts' && (
|
||||
<div className="cockpit-panel-body">
|
||||
<div className="cockpit-panel-count">冲突 {node?.state.conflictCount ?? 0} 项</div>
|
||||
{detail.conflicts.items.length === 0 && <div className="empty-note">无开放冲突</div>}
|
||||
{detail.conflicts.items.map(c => (
|
||||
<div key={c.id} className="cockpit-panel-row cockpit-panel-conflict">
|
||||
<span className="cockpit-badge">{c.state === 'open' ? '开放' : c.state}</span>
|
||||
<div className="cockpit-conflict-side">甲方:{c.left.visibility === 'full' ? c.left.claim : `受限(${c.left.redactedReason || '权限'})`}</div>
|
||||
<div className="cockpit-conflict-side">乙方:{c.right.visibility === 'full' ? c.right.claim : `受限(${c.right.redactedReason || '权限'})`}</div>
|
||||
<div className="cockpit-changetime">{new Date(c.detectedAt).toLocaleString('zh-CN')}</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
+466
-122
@@ -1,31 +1,38 @@
|
||||
// 中栏:消息流(Part 渲染器注册表)+ 流式渲染 + 过程折叠 + HITL 卡片 + 输入区(4.4)。
|
||||
// 重设计方案 阶段④:折叠区全部迁 @ui Collapsible(<details> 已禁);工具调用块走
|
||||
// ToolBlock 契约(运行态扫光、完成边沿收起、展开态记忆);live 行扫光 + 已工作计时。
|
||||
import { Icon, Avatar, BrandMark, Collapsible } from '@ui'
|
||||
import { Icon, Avatar, BrandMark, Collapsible, getPersistedOpen, setPersistedOpen, SafeMarkdown } from '@ui'
|
||||
import { useEffect, useMemo, useRef, useState } from 'react'
|
||||
import { marked } from 'marked'
|
||||
import { api } from '../api'
|
||||
import { store, useStore, activeRun, type LiveState, type ContextObs } from '../store'
|
||||
import { liveToMessage, showProcessInline } from '../live'
|
||||
import { store, useStore, activeRun, isTerminal, type LiveState, type ContextObs } from '../store'
|
||||
import { liveToMessage, livePhaseLabel, runEventsToTimeline, showProcessInline } from '../live'
|
||||
import { deriveShellPhase, isShellBusy, showLiveBubble, type ShellPhase } from '../runstate'
|
||||
import type { Message, Part, HITLCard, ActivityCard, Artifact } from '../contracts'
|
||||
import { UIRenderer, InlineConfirmCard, hasOpenConfirm, CardAnchor } from '@ui'
|
||||
import { docBridge } from './Workbench'
|
||||
import { splitTimeline, artifactIcon, humanSize, artifactIdsIn, markMissingArtifacts, workedLabel } from '../messageparts'
|
||||
import { splitTimeline, mergeProcessTimeline, artifactIcon, humanSize, artifactIdsIn, markMissingArtifacts, dedupeDeliverables, foldRunErrors, processSummary, humanError } from '../messageparts'
|
||||
import { ProcessTimeline } from './ProcessTimeline'
|
||||
import { ConversationWork } from './ConversationWork'
|
||||
import { MessageTimestamp } from './MessageTimestamp'
|
||||
import { loadRunEvents } from '../runEvents'
|
||||
import '../companion-conversation.css'
|
||||
|
||||
// marked 走标准 Markdown 语义(不开 breaks):模型输出按块级排版渲染,
|
||||
// 行内换行交给段落折叠,避免与 CSS 块间距叠加出松散排版。
|
||||
function hasFiles(dt: DataTransfer | null): boolean {
|
||||
return !!dt && Array.from(dt.types).includes('Files')
|
||||
}
|
||||
|
||||
// 对话正文沿用 breaks:卡片渲染器曾经把全局 marked 设成 breaks,
|
||||
// 去重后的同一份 marked 让对话也按行内换行显示。这里显式保持这个效果。
|
||||
|
||||
// Part 渲染器注册表:按类型查表;未知类型静默忽略(前向兼容)。
|
||||
function PartView({ part, live }: { part: Part; live?: boolean | null }) {
|
||||
const workPaneOwnsCards = useStore(s => !s.ui.rightCollapsed && s.ui.rightTab === 'work')
|
||||
switch (part.type) {
|
||||
case 'text':
|
||||
return <div className={live ? 'part-text cursor-blink' : 'part-text'}
|
||||
dangerouslySetInnerHTML={{ __html: marked.parse(markMissingArtifacts(part.text ?? '', id => !!findArtifact(id))) as string }} />
|
||||
return <SafeMarkdown className={live ? 'part-text cursor-blink' : 'part-text'} breaks
|
||||
markdown={markMissingArtifacts(part.text ?? '', id => !!findArtifact(id))} />
|
||||
case 'thinking':
|
||||
// 流式期间展开可实时看到思考;run 终态后收进过程折叠区,默认收起。
|
||||
//(此单件形态用于过程组之外散落的思考;组内思考由 ProcessParts 渲染。)
|
||||
return <ThinkingBlock part={part} idKey={part.text?.slice(0, 24) ?? 't'} defaultOpen={!!live} />
|
||||
return null
|
||||
case 'tool_call':
|
||||
return <span className="tool-chip">🛠 {part.toolCall?.name}</span>
|
||||
case 'tool_result': {
|
||||
@@ -41,12 +48,12 @@ function PartView({ part, live }: { part: Part; live?: boolean | null }) {
|
||||
case 'plan':
|
||||
return null // 计划在右栏 Plan 标签呈现
|
||||
case 'card': {
|
||||
// 卡流锚点(D39):cardId 非空 = submit_card 引用部件——中栏自足(可展开全文)+ 跳收件箱。
|
||||
// 右栏工作可见时保留定位入口;详细正文只在右栏。关闭右栏时中栏可展开全文。
|
||||
if (part.card?.cardId) {
|
||||
const ref = part.card.cardId
|
||||
const card = findCard(ref)
|
||||
const bodyChars = card?.body?.reduce((n, node) => n + (node.markdown?.length ?? 0), 0)
|
||||
return <CardAnchor title={card?.title ?? part.card.kind} chars={bodyChars} card={card}
|
||||
return <CardAnchor title={card?.title ?? part.card.kind} chars={bodyChars} card={workPaneOwnsCards || card?.work ? undefined : card}
|
||||
onLocate={() => store.openInbox(ref)} docBridge={docBridge} />
|
||||
}
|
||||
// 插件内嵌卡片部件(cardlink 互定位,D32):点击 ↗ 定位收件箱对应卡(从 data 解析 card:<id>)。
|
||||
@@ -58,8 +65,21 @@ function PartView({ part, live }: { part: Part; live?: boolean | null }) {
|
||||
</div>
|
||||
)
|
||||
}
|
||||
case 'error':
|
||||
return <div className="part-error">{part.error?.code}: {part.error?.message}</div>
|
||||
case 'error': {
|
||||
const view = humanError(part.error?.code, part.error?.message)
|
||||
return (
|
||||
<div className="part-error">
|
||||
<div>{view.title}</div>
|
||||
{view.detail && (
|
||||
<Collapsible id={`err:${part.error?.code ?? 'e'}:${view.detail.length}`} triggerClassName="process-collapse-summary"
|
||||
trigger={<><span className="process-collapse-chev">▸</span>详情</>}>
|
||||
<div className="part-error-detail">{view.detail}</div>
|
||||
</Collapsible>
|
||||
)}
|
||||
<button type="button" className="btn ghost" onClick={() => { void store.sendMessage('继续', []) }}>继续执行</button>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
default:
|
||||
return null
|
||||
}
|
||||
@@ -87,33 +107,25 @@ function findCard(id: string) {
|
||||
return cardCache[id]
|
||||
}
|
||||
|
||||
// 思考块(Collapsible 契约):左线弱色,流式默认展开、终态默认收起;展开态记忆。
|
||||
function ThinkingBlock({ part, idKey, defaultOpen }: { part: Part; idKey: string; defaultOpen?: boolean }) {
|
||||
return (
|
||||
<div className="part-thinking">
|
||||
<Collapsible id={`think:${idKey}`} defaultOpen={defaultOpen} triggerClassName="part-thinking-summary"
|
||||
trigger={<><span className="part-thinking-chev">▸</span>思考过程</>}>
|
||||
<div className="part-thinking-body">{part.text}</div>
|
||||
</Collapsible>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
// 交付物卡片:主区域和「预览」打开预览区;下载收进菜单,避免和预览抢同一个按钮。
|
||||
function DeliverableCard({ artifact }: { artifact: { artifactId: string; name: string; kind?: string } }) {
|
||||
function DeliverableCard({ artifact, updates = 0 }: { artifact: { artifactId: string; name: string; kind?: string }; updates?: number }) {
|
||||
const [menu, setMenu] = useState(false)
|
||||
const art = findArtifact(artifact.artifactId)
|
||||
const name = artifact.name || art?.name || '文件'
|
||||
const icon = artifactIcon(name, artifact.kind ?? art?.kind)
|
||||
const size = humanSize(art?.size)
|
||||
const open = () => { if (art) store.requestPreview(art) }
|
||||
const open = () => {
|
||||
if (art) { store.requestPreview(art); return }
|
||||
// 工件已不在当前项目(被删/跨项目残留):给一句话反馈,不再无声无息。
|
||||
store.toast(`「${name}」已不在当前项目中,无法预览`)
|
||||
}
|
||||
return (
|
||||
<div className="deliverable-card mk-rise-in" data-artifact-chip={artifact.artifactId}>
|
||||
<button type="button" className="dc-open" title={`预览 ${name}`} onClick={open}>
|
||||
<span className="dc-icon"><Icon name={icon} size={18} /></span>
|
||||
<span className="dc-main">
|
||||
<span className="dc-name">{name}</span>
|
||||
<span className="dc-meta">{kindLabelOf(artifact.kind ?? art?.kind)}{size ? ` · ${size}` : ''}{art ? '' : ' · 生成中'}</span>
|
||||
<span className="dc-meta">{kindLabelOf(artifact.kind ?? art?.kind)}{size ? ` · ${size}` : ''}{updates > 0 ? ` · 已更新 ${updates} 次` : ''}{art ? '' : ' · 生成中'}</span>
|
||||
</span>
|
||||
</button>
|
||||
<button type="button" className="dc-act" onClick={open} disabled={!art}>预览</button>
|
||||
@@ -144,6 +156,15 @@ function citedArtifactCards(parts: Part[]): Artifact[] {
|
||||
}
|
||||
|
||||
// 已工作计时(ZCode「已工作 X 分 X 秒」摘要行;1s 步进,仅 live 期间挂载)。
|
||||
function useLiveClock(active: boolean) {
|
||||
const [, tick] = useState(0)
|
||||
useEffect(() => {
|
||||
if (!active) return
|
||||
const t = window.setInterval(() => tick(n => n + 1), 1000)
|
||||
return () => window.clearInterval(t)
|
||||
}, [active])
|
||||
}
|
||||
|
||||
function useElapsed(startedAt: number): string {
|
||||
const [, tick] = useState(0)
|
||||
useEffect(() => {
|
||||
@@ -158,62 +179,158 @@ function useElapsed(startedAt: number): string {
|
||||
// 流式状态行(独立组件:计时 hook 只在 live 行挂载期间运转)。
|
||||
function LiveBar({ live }: { live: LiveState }) {
|
||||
const elapsed = useElapsed(live.startedAt)
|
||||
const phase = livePhaseLabel(live)
|
||||
const label = phase.startsWith('正在编写') ? '正在准备操作'
|
||||
: phase.startsWith('正在运行') ? '正在处理'
|
||||
: phase === '思考中' ? '正在梳理' : phase
|
||||
return (
|
||||
<span className="live-bar">
|
||||
<span className="live-dot" />
|
||||
<span className="mk-sweep">{live.phase}</span>
|
||||
<span className="mk-sweep">{label}</span>
|
||||
<span className="live-elapsed">已工作 {elapsed}</span>
|
||||
</span>
|
||||
)
|
||||
}
|
||||
|
||||
function AssistantMessage({ msg, live }: { msg: Message; live?: LiveState | null }) {
|
||||
// 用户在运行中手动折过的 run:结束后沿用这次选择,不强制再收起。
|
||||
const touchedProcess = new Set<string>()
|
||||
|
||||
function AssistantMessage({ msg, live, convId }: { msg: Message; live?: LiveState | null; convId?: string }) {
|
||||
const autoCollapse = useStore(s => s.ui.autoCollapseProcess)
|
||||
const ctxObs = useStore(s => (msg.runId ? s.contextObs[msg.runId] : undefined))
|
||||
const run = useStore(s => (msg.runId ? s.runs.find(r => r.id === msg.runId) : undefined))
|
||||
const childStamp = useStore(s => msg.runId ? s.runs.filter(r => r.parentRunId === msg.runId)
|
||||
.map(r => `${r.id}:${r.status}:${r.endedAt ?? ''}`).join('|') : '')
|
||||
const parts = msg.parts ?? []
|
||||
const split = useMemo(() => splitTimeline(parts), [parts])
|
||||
// 运行中时间线一直展开。终轮确认没有后续工具调用之后,才按偏好收成「已工作 X」。
|
||||
useLiveClock(!!live)
|
||||
const finished = !live && !!run && run.status !== 'running' && run.status !== 'pending' && run.status !== 'waiting_hitl'
|
||||
const split = useMemo(() => splitTimeline(parts, finished), [parts, finished])
|
||||
const showProcess = showProcessInline(live ?? null, autoCollapse)
|
||||
const extras = citedArtifactCards(split.final)
|
||||
const memKey = `process:${msg.runId || msg.id}`
|
||||
const touched = touchedProcess.has(memKey)
|
||||
const [open, setOpen] = useState(() => {
|
||||
if (touched) return getPersistedOpen(memKey)
|
||||
return showProcess
|
||||
})
|
||||
useEffect(() => {
|
||||
if (!touchedProcess.has(memKey)) setOpen(showProcess)
|
||||
}, [memKey, showProcess])
|
||||
const [replayed, setReplayed] = useState<Part[] | null>(null)
|
||||
const [processError, setProcessError] = useState(false)
|
||||
useEffect(() => { setReplayed(null); setProcessError(false) }, [childStamp])
|
||||
useEffect(() => {
|
||||
if (!open) { setReplayed(null); setProcessError(false) }
|
||||
}, [open])
|
||||
useEffect(() => {
|
||||
if (!open || live || !msg.runId || !convId || replayed || processError) return
|
||||
const controller = new AbortController()
|
||||
let active = true
|
||||
void (async () => {
|
||||
try {
|
||||
const events = await loadRunEvents(convId, msg.runId!, controller.signal)
|
||||
if (active) setReplayed(runEventsToTimeline(events, msg.runId))
|
||||
} catch {
|
||||
if (active) setProcessError(true)
|
||||
}
|
||||
})()
|
||||
return () => { active = false; controller.abort() }
|
||||
}, [open, live, msg.runId, convId, replayed, processError])
|
||||
const extras = live ? [] : citedArtifactCards(split.final)
|
||||
const cards = live ? [] : dedupeDeliverables(split.final)
|
||||
const lastText = (() => {
|
||||
for (let i = split.final.length - 1; i >= 0; i--) if (split.final[i].type === 'text') return i
|
||||
return -1
|
||||
})()
|
||||
const streamingText = !!(live && live.phase === 'responding' && lastText >= 0
|
||||
&& !live.items.some(it => it.kind === 'tool' && it.state !== 'done'))
|
||||
const processParts = replayed === null ? split.timeline : mergeProcessTimeline(split.timeline, replayed, split.final)
|
||||
const toolCount = processParts.filter(p => p.type === 'tool_call').length
|
||||
const headline = live ? '执行记录' : `执行记录 · ${processSummary(toolCount, cards.length, run?.createdAt, run?.endedAt)}`
|
||||
const timeline = (
|
||||
<ProcessTimeline parts={split.timeline} live={!!live} idKey={msg.id}
|
||||
<ProcessTimeline parts={processParts} live={!!live} idKey={msg.id}
|
||||
renderPart={(part, liveText) => <PartView part={part} live={liveText} />} />
|
||||
)
|
||||
const toggleProcess = (next: boolean) => {
|
||||
touchedProcess.add(memKey)
|
||||
setPersistedOpen(memKey, next)
|
||||
setOpen(next)
|
||||
}
|
||||
return (
|
||||
<div className="msg assistant" data-msg-id={msg.id}>
|
||||
<div className={`msg assistant${msg.excluded ? ' is-excluded' : ''}`} data-msg-id={msg.id}>
|
||||
<div className="msg-role">
|
||||
<span className="role-mark role-assistant"><BrandMark size={16} /></span>
|
||||
<span>助手</span>
|
||||
<MessageTimestamp value={msg.createdAt || run?.createdAt} />
|
||||
{live && <LiveBar live={live} />}
|
||||
</div>
|
||||
{split.timeline.length > 0 && (showProcess
|
||||
? <div className="part-group">{timeline}</div>
|
||||
: (
|
||||
<div className="process-collapse">
|
||||
<Collapsible id={`process:${msg.id}`} triggerClassName="process-collapse-summary" unmountDelay={300}
|
||||
trigger={<>
|
||||
<span className="process-collapse-chev">▸</span>
|
||||
<span>{workedLabel(run?.createdAt, run?.endedAt)}</span>
|
||||
</>}>
|
||||
<div className="body">{timeline}</div>
|
||||
</Collapsible>
|
||||
</div>
|
||||
))}
|
||||
{split.final.map((part, i) => (
|
||||
<div className="part" key={i}>
|
||||
<PartView part={part} live={!!(live && i === lastText && part.type === 'text')} />
|
||||
{(split.timeline.length > 0 || !!msg.runId) && (
|
||||
<div className="process-collapse">
|
||||
<Collapsible id={memKey} open={open} onToggle={toggleProcess} triggerClassName="process-collapse-summary" unmountDelay={300}
|
||||
trigger={<>
|
||||
<span className="process-collapse-chev">▸</span>
|
||||
<span className={live ? 'mk-sweep' : ''}>{headline}</span>
|
||||
</>}>
|
||||
<div className="body">
|
||||
{replayed === null && !live && !processError && <div className="process-load-note">正在读取完整记录…</div>}
|
||||
{processError && <div className="process-load-note">完整记录暂不可用,以下为已保存的摘要</div>}
|
||||
{processParts.length > 0 ? timeline : replayed && <div className="process-load-note">这轮没有可回看的过程记录</div>}
|
||||
</div>
|
||||
</Collapsible>
|
||||
</div>
|
||||
)}
|
||||
{split.final.map((part, i) => part.type === 'artifact_ref' ? null : (
|
||||
<div className="part" key={i}>
|
||||
<PartView part={part} live={!!(streamingText && i === lastText && part.type === 'text')} />
|
||||
</div>
|
||||
))}
|
||||
{cards.map(card => (
|
||||
<DeliverableCard key={card.artifact.artifactId} artifact={card.artifact} updates={card.updates} />
|
||||
))}
|
||||
{extras.map(art => (
|
||||
<DeliverableCard key={art.id} artifact={{ artifactId: art.id, name: art.name, kind: art.kind }} />
|
||||
))}
|
||||
{live && <LiveAgentNotes live={live} />}
|
||||
{live && Object.keys(live.agentNotes).length > 0 && <Collapsible id={`agent-notes:${live.runId}`}
|
||||
triggerClassName="process-collapse-summary" trigger={<span>协作记录</span>}><LiveAgentNotes live={live} /></Collapsible>}
|
||||
{!live && ctxObs && <ContextObsView obs={ctxObs} />}
|
||||
{convId && <MessageTools msg={msg} convId={convId} />}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
function SessionNoteField({ convId, note }: { convId: string; note: string }) {
|
||||
const [value, setValue] = useState(note)
|
||||
useEffect(() => { setValue(note) }, [note, convId])
|
||||
return (
|
||||
<input className="search-input session-note" value={value} placeholder="本会话要求"
|
||||
title="附在上下文末尾,不改系统前缀"
|
||||
onChange={e => setValue(e.target.value)}
|
||||
onBlur={() => { if (value !== note) void api.setSessionNote(convId, value).then(() => {
|
||||
if (store.getState().currentConvId === convId) return store.openConversation(convId)
|
||||
}) }} />
|
||||
)
|
||||
}
|
||||
|
||||
function MessageTools({ msg, convId }: { msg: Message; convId: string }) {
|
||||
const text = msg.parts.filter(p => p.type === 'text').map(p => p.text ?? '').join('\n')
|
||||
const refresh = () => { if (store.getState().currentConvId === convId) void store.openConversation(convId) }
|
||||
return (
|
||||
<div className="msg-tools">
|
||||
<button className="companion-message-copy" type="button" onClick={() => { void navigator.clipboard.writeText(text) }}>复制</button>
|
||||
<Collapsible id={`message-operations:${convId}:${msg.id}`} trigger="消息操作" triggerClassName="companion-message-copy">
|
||||
<div className="companion-message-actions">
|
||||
<button className="btn ghost" type="button" onClick={() => { void api.excludeMessage(msg.id, !msg.excluded).then(refresh) }}>
|
||||
{msg.excluded ? '纳入上下文' : '排除出上下文'}
|
||||
</button>
|
||||
{msg.role === 'assistant' && (
|
||||
<button className="btn ghost" type="button" onClick={() => { void api.regenerate(convId, msg.id).then(refresh) }}>重新生成</button>
|
||||
)}
|
||||
{msg.variantGroup && msg.excluded && (
|
||||
<button className="btn ghost" type="button" onClick={() => { void api.selectVariant(msg.id).then(refresh) }}>使用此候选</button>
|
||||
)}
|
||||
{msg.role === 'user' && <RewindControl convId={convId} messageId={msg.id} />}
|
||||
</div>
|
||||
</Collapsible>
|
||||
{msg.variantGroup && <span className="process-collapse-meta">候选 {(msg.variantIndex ?? 0) + 1}</span>}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -226,12 +343,18 @@ function ContextObsView({ obs }: { obs: ContextObs }) {
|
||||
trigger={<>
|
||||
<span className="process-collapse-chev">▸</span>
|
||||
<span>🧩 上下文构成</span>
|
||||
<span className="process-collapse-meta">{obs.items.join(' · ')}(约 {obs.estChars} 字符)</span>
|
||||
<span className="process-collapse-meta">{obs.items.join(' · ')}(约 {obs.estChars} token)</span>
|
||||
</>}>
|
||||
<div className="body">
|
||||
<ul className="ui-list">
|
||||
{obs.items.map((it, i) => <li key={i}>{it}</li>)}
|
||||
</ul>
|
||||
{obs.sections && obs.sections.length > 0 && (
|
||||
<div className="process-collapse-meta">
|
||||
{obs.sections.map(s => `${s.name} ${s.estTokens}`).join(' · ')}
|
||||
{obs.prefixHash ? ` · 前缀 ${obs.prefixHash}` : ''}
|
||||
</div>
|
||||
)}
|
||||
{obs.truncations && obs.truncations.length > 0 && (
|
||||
<div style={{ color: 'var(--warn)', fontSize: 'var(--fs-ui-sm)', marginTop: 6 }}>
|
||||
{obs.truncations.map((t, i) => <div key={i}>⚠ {t}</div>)}
|
||||
@@ -255,15 +378,32 @@ function LiveAgentNotes({ live }: { live: LiveState }) {
|
||||
|
||||
function HITLCardView({ card }: { card: HITLCard }) {
|
||||
const [free, setFree] = useState('')
|
||||
const [submitting, setSubmitting] = useState(false)
|
||||
const actionState = useStore(s => s.cardActionStates?.[`hitl:${card.id}`])
|
||||
const submitting = actionState !== undefined
|
||||
// wfcompile.doScript 使用固定首行 + 脚本预览;其他多行问题可能包含
|
||||
// 用户必须理解的业务后果,保持原样,不凭内容猜测其信息层级。
|
||||
const scriptPrefix = '运行这段脚本?\n'
|
||||
const hasScriptPreview = card.kind === 'confirm' && card.question.startsWith(scriptPrefix)
|
||||
const question = hasScriptPreview ? scriptPrefix.trimEnd() : card.question
|
||||
const detail = [hasScriptPreview ? card.question.slice(scriptPrefix.length) : '', card.detail]
|
||||
.filter(value => value?.trim()).join('\n\n')
|
||||
const answer = async (resp: { choiceId?: string; freeText?: string }) => {
|
||||
setSubmitting(true)
|
||||
if (store.getState().cardActionStates?.[`hitl:${card.id}`]) return
|
||||
await store.resolveHITL(card.id, resp)
|
||||
setSubmitting(false)
|
||||
}
|
||||
return (
|
||||
<div className="hitl-card">
|
||||
<div className="hitl-q"><Icon name="check" size={15} />{card.question}</div>
|
||||
<div className={`hitl-card${card.kind === 'confirm' ? ' wait' : ''}${card.kind === 'choice' || card.kind === 'input' ? ' ask' : ''}`}>
|
||||
<div className="hitl-q"><Icon name="check" size={15} />{question}</div>
|
||||
{card.blocked && <div className="companion-action-feedback" role="status">
|
||||
操作受限:{card.blockReason || '当前操作条件尚未满足'}
|
||||
</div>}
|
||||
{detail && <div className="process-collapse"><Collapsible id={`hitl-details:${card.conversationId}:${card.id}`}
|
||||
triggerClassName="process-collapse-summary" trigger={<><span className="process-collapse-chev">▸</span>操作详情</>}>
|
||||
<pre className="hitl-detail">{detail}</pre>
|
||||
</Collapsible></div>}
|
||||
{actionState && <div className="companion-action-feedback" role="status">
|
||||
{actionState === 'unknown' ? '正在核实处理结果' : '正在提交你的选择'}
|
||||
</div>}
|
||||
{card.choices && (
|
||||
<div className="hitl-choices">
|
||||
{card.choices.map(c => (
|
||||
@@ -278,7 +418,7 @@ function HITLCardView({ card }: { card: HITLCard }) {
|
||||
{card.allowFreeInput && (
|
||||
<div className="hitl-free">
|
||||
<input className="search-input" value={free} onChange={e => setFree(e.target.value)}
|
||||
placeholder={card.freeInputHint || '自由输入…'} onKeyDown={e => { if (e.key === 'Enter' && free.trim()) answer({ freeText: free.trim() }) }} />
|
||||
disabled={submitting} placeholder={card.freeInputHint || '补充你的要求'} onKeyDown={e => { if (e.key === 'Enter' && free.trim() && !submitting) void answer({ freeText: free.trim() }) }} />
|
||||
<button className="btn ghost" disabled={!free.trim() || submitting} onClick={() => answer({ freeText: free.trim() })}>发送</button>
|
||||
</div>
|
||||
)}
|
||||
@@ -314,18 +454,19 @@ function OutboxPanel() {
|
||||
if (outbox.length === 0) return null
|
||||
return (
|
||||
<Collapsible id="composer-outbox" defaultOpen
|
||||
trigger={<span>排队 {outbox.length}</span>}
|
||||
trigger={<span>待发送 {outbox.length}</span>}
|
||||
triggerClassName="outbox-trigger">
|
||||
<ul className="outbox-list">
|
||||
{outbox.map(item => (
|
||||
<li key={item.id} className="outbox-item">
|
||||
{item.deliveryError && <span className="outbox-text" role="status">{item.deliveryError}</span>}
|
||||
{editing === item.id ? (
|
||||
<input className="search-input outbox-edit" value={draft} onChange={e => setDraft(e.target.value)}
|
||||
onKeyDown={e => {
|
||||
if (e.key === 'Enter') { store.updateOutbox(item.id, draft); setEditing(null) }
|
||||
}} />
|
||||
) : (
|
||||
<span className="outbox-text" title={item.text}>{item.text.trim() || '(仅附件)'}{item.attachmentNames.length > 0 ? ` · ${item.attachmentNames.join('、')}` : ''}</span>
|
||||
<span className="outbox-text" title={item.text}>{item.text.trim() || '(仅附件)'}{item.attachmentNames.length > 0 ? ` · ${item.attachmentNames.join('、')}` : ''}{item.taskRef ? ` · 基于「${item.taskRef.title}」` : ''}</span>
|
||||
)}
|
||||
{editing === item.id ? (
|
||||
<button className="btn ghost" onClick={() => { store.updateOutbox(item.id, draft); setEditing(null) }}>保存</button>
|
||||
@@ -333,6 +474,7 @@ function OutboxPanel() {
|
||||
<button className="btn ghost" onClick={() => { setEditing(item.id); setDraft(item.text) }}>修改</button>
|
||||
)}
|
||||
<button className="btn ghost" onClick={() => store.sendOutboxNow(item.id)}>发送</button>
|
||||
{item.taskRef && <button className="btn ghost" onClick={() => store.clearOutboxReference(item.id)}>移除引用</button>}
|
||||
<button className="icon-btn" title="移出队列" onClick={() => store.removeOutbox(item.id)}><Icon name="x" size={12} /></button>
|
||||
</li>
|
||||
))}
|
||||
@@ -341,7 +483,27 @@ function OutboxPanel() {
|
||||
)
|
||||
}
|
||||
|
||||
export function NoticeMessage({ msg }: { msg: Message }) {
|
||||
const text = msg.parts.filter(p => p.type === 'text').map(p => p.text).join('\n')
|
||||
const preview = text.replace(/<\/?system-reminder>/g, '').trim().split('\n').find(line => line.trim()) ?? '系统通知'
|
||||
return (
|
||||
<div className="msg notice" data-msg-id={msg.id}>
|
||||
<Collapsible id={`notice:${msg.id}`} triggerClassName="notice-summary"
|
||||
trigger={<><span className="notice-label">通知 · {preview}</span><MessageTimestamp value={msg.createdAt} /></>}>
|
||||
<div className="notice-body">{text}</div>
|
||||
</Collapsible>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export function Conversation() {
|
||||
const conversationId = useStore(s => s.currentConvId)
|
||||
const projectId = useStore(s => s.currentProjectId)
|
||||
// 本地草稿、附件、折叠设置与滚动跟随属于当前会话,切换时一起重置。
|
||||
return <ConversationSession key={`${projectId}:${conversationId}`} />
|
||||
}
|
||||
|
||||
function ConversationSession() {
|
||||
const currentConvId = useStore(s => s.currentConvId)
|
||||
const conversation = useStore(s => s.tasks.find(c => c.id === s.currentConvId))
|
||||
const messages = useStore(s => s.messages)
|
||||
@@ -349,147 +511,329 @@ export function Conversation() {
|
||||
const activeHitl = useStore(s => s.activeHitl)
|
||||
const live = useStore(s => s.live)
|
||||
const runs = useStore(s => s.runs)
|
||||
const posting = useStore(s => s.posting)
|
||||
const connected = useStore(s => s.connected)
|
||||
const artifacts = useStore(s => s.artifacts)
|
||||
const profiles = useStore(s => s.profiles)
|
||||
const cards = useStore(s => s.cards)
|
||||
const projectName = useStore(s => s.projects.find(p => p.id === s.currentProjectId)?.name ?? '项目')
|
||||
|
||||
const currentProjectId = useStore(s => s.currentProjectId)
|
||||
const cardActionStates = useStore(s => s.cardActionStates)
|
||||
const workReference = useStore(s => s.workReference)
|
||||
const workPaneOwnsCards = useStore(s => !s.ui.rightCollapsed && s.ui.rightTab === 'work')
|
||||
const [text, setText] = useState('')
|
||||
const [attachmentIds, setAttachmentIds] = useState<string[]>([])
|
||||
const [attachmentNames, setAttachmentNames] = useState<string[]>([])
|
||||
const [dragDepth, setDragDepth] = useState(0)
|
||||
const [uploading, setUploading] = useState(0)
|
||||
const [uploadError, setUploadError] = useState('')
|
||||
const composeActive = useRef(true)
|
||||
const inputRef = useRef<HTMLTextAreaElement>(null)
|
||||
const bodyRef = useRef<HTMLDivElement>(null)
|
||||
const stickRef = useRef(true)
|
||||
const [showJump, setShowJump] = useState(false)
|
||||
|
||||
useEffect(() => {
|
||||
composeActive.current = true
|
||||
return () => { composeActive.current = false }
|
||||
}, [])
|
||||
|
||||
artifactCache = Object.fromEntries(artifacts.map(a => [a.id, a]))
|
||||
cardCache = Object.fromEntries(cards.map(c => [c.id, c]))
|
||||
|
||||
const active = activeRun(runs)
|
||||
const phase: ShellPhase = deriveShellPhase({
|
||||
posting,
|
||||
openRun: !!activeRun(runs),
|
||||
liveRunId: live?.runId ?? null,
|
||||
assistantRunIds: messages.filter(m => m.role === 'assistant' && m.runId).map(m => m.runId as string),
|
||||
})
|
||||
const busy = isShellBusy(phase)
|
||||
const showStop = phase === 'running'
|
||||
// Background work stays in its own card and does not insert another chat turn.
|
||||
const bgRunning = runs.filter(r => r.kind === 'subagent' && !isTerminal(r.status)).length
|
||||
const unreadResults = cards.filter(card => card.work?.result && card.work.resultVersion > card.work.readVersion)
|
||||
|
||||
useEffect(() => {
|
||||
if (!stickRef.current) return
|
||||
bodyRef.current?.scrollTo({ top: bodyRef.current.scrollHeight })
|
||||
}, [messages.length, live?.items, live?.phase, activeHitl.length])
|
||||
|
||||
const composeIsCurrent = () => {
|
||||
const state = store.getState()
|
||||
return composeActive.current && state.currentConvId === currentConvId && state.currentProjectId === currentProjectId
|
||||
}
|
||||
const addMaterials = async (files: File[]) => {
|
||||
if (!files.length) return
|
||||
setUploadError('')
|
||||
setUploading(count => count + files.length)
|
||||
for (const file of files) {
|
||||
if (!composeIsCurrent()) return
|
||||
const id = await store.uploadAttachment(file)
|
||||
if (!composeIsCurrent()) return
|
||||
setUploading(count => Math.max(0, count - 1))
|
||||
if (id) {
|
||||
setAttachmentIds(ids => [...ids, id])
|
||||
setAttachmentNames(names => [...names, file.name])
|
||||
} else {
|
||||
setUploadError(message => [message, `「${file.name}」未能添加,请重新选择文件`].filter(Boolean).join(';'))
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
const send = async () => {
|
||||
if (!text.trim() && attachmentIds.length === 0) return
|
||||
if (uploading > 0 || (!text.trim() && attachmentIds.length === 0)) return
|
||||
const t = text
|
||||
const ids = attachmentIds
|
||||
const names = attachmentNames
|
||||
setText(''); setAttachmentIds([]); setAttachmentNames([])
|
||||
if (active) {
|
||||
store.enqueueOutbox(t, ids, names)
|
||||
const reference = workReference ?? undefined
|
||||
if (reference && ids.length > 0) {
|
||||
store.toast('这条消息已引用工作结果,请先移除引用或附件再发送')
|
||||
return
|
||||
}
|
||||
await store.sendMessage(t, ids)
|
||||
setText(''); setAttachmentIds([]); setAttachmentNames([])
|
||||
store.clearWorkReference()
|
||||
if (busy) {
|
||||
store.enqueueOutbox(t, ids, names, reference)
|
||||
return
|
||||
}
|
||||
await store.sendMessage(t, ids, undefined, reference)
|
||||
}
|
||||
|
||||
if (!currentConvId) {
|
||||
return (
|
||||
<div className="chat">
|
||||
<div className="chat-body"><div className="empty-state">
|
||||
<div style={{ fontSize: 40 }}>⌘</div>
|
||||
<div>选择或创建一个会话开始</div>
|
||||
<div style={{ fontSize: 'var(--fs-ui-sm)' }}>mock 演示模式可在 设置 → runtime 开启,无需模型密钥</div>
|
||||
<div className="chat work-companion-chat">
|
||||
<div className="chat-body"><div className="empty-state companion-empty">
|
||||
<span className="es-mark"><Icon name="sparkles" size={22} /></span>
|
||||
<div className="companion-empty-title">从一件需要完成的工作开始</div>
|
||||
<div>告诉助手你的目标,或准备好需要一起阅读的材料</div>
|
||||
<button type="button" className="btn" onClick={() => { void store.createTask() }}>开始新对话</button>
|
||||
</div></div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="chat">
|
||||
<div className={`chat work-companion-chat ${dragDepth > 0 ? 'is-dragging' : ''}`}
|
||||
onDragEnter={e => { if (!hasFiles(e.dataTransfer)) return; e.preventDefault(); setDragDepth(d => d + 1) }}
|
||||
onDragOver={e => { if (hasFiles(e.dataTransfer)) e.preventDefault() }}
|
||||
onDragLeave={() => setDragDepth(d => Math.max(0, d - 1))}
|
||||
onDrop={e => {
|
||||
if (!e.dataTransfer?.files?.length) return
|
||||
e.preventDefault()
|
||||
setDragDepth(0)
|
||||
void addMaterials(Array.from(e.dataTransfer.files))
|
||||
}}>
|
||||
{dragDepth > 0 && <div className="drop-veil">释放以上传资料</div>}
|
||||
<div className="chat-header">
|
||||
<span className="project-badge" title="当前项目">{projectName}</span>
|
||||
<div className="chat-title">{conversation?.title ?? '会话'}</div>
|
||||
<select className="effect-badge" value={conversation?.profileId || 'default'} title="切换会话画像"
|
||||
<Collapsible id={`conversation-settings:${currentProjectId}:${currentConvId}`} triggerClassName="companion-settings-trigger"
|
||||
trigger={<><Icon name="settings" size={14} /><span>会话设置</span></>} bodyClassName="companion-settings-body">
|
||||
<label className="companion-setting"><span>工作方式</span>
|
||||
<select value={conversation?.profileId || 'default'} aria-label="工作方式"
|
||||
onChange={async e => {
|
||||
if (!currentConvId) return
|
||||
await api.setConversationProfile(currentConvId, e.target.value)
|
||||
await store.openConversation(currentConvId)
|
||||
if (store.getState().currentConvId === currentConvId) await store.openConversation(currentConvId)
|
||||
}}>
|
||||
{profiles.map(p => <option key={p.id} value={p.id}>{p.name}</option>)}
|
||||
</select>
|
||||
<button className="btn ghost" style={{ display: 'inline-flex', alignItems: 'center', gap: 4 }}
|
||||
</label>
|
||||
<div className="companion-setting"><span>读取同项目的其他对话</span><button className="btn ghost"
|
||||
title={conversation?.allowCrossRead === false
|
||||
? '本会话不读取其他会话记录(点击开启)'
|
||||
: '本会话可读取同项目其他会话记录(需项目设置开启跨会话读取;点击关闭)'}
|
||||
onClick={() => currentConvId && store.setCrossFlags(currentConvId, { allowCrossRead: conversation?.allowCrossRead === false })}>
|
||||
<Icon name="users" size={13} />跨读{conversation?.allowCrossRead === false ? '·关' : '·开'}
|
||||
{conversation?.allowCrossRead === false ? '关闭' : '允许'}
|
||||
</button>
|
||||
<span title={connected ? '事件流已连接' : '事件流重连中'} className={`conn-dot ${connected ? 'on' : 'off'}`} />
|
||||
{active && <button className="btn ghost" onClick={() => store.cancelActive()}>停止</button>}
|
||||
<span className="companion-setting-note">实际读取范围还需项目设置允许</span></div>
|
||||
<label className="companion-setting"><span>这次工作的要求</span><SessionNoteField convId={currentConvId} note={conversation?.sessionNote ?? ''} /></label>
|
||||
</Collapsible>
|
||||
<span title={connected ? '已连接' : '正在重新连接'} className={`conn-dot ${connected ? 'on' : 'off'}`} />
|
||||
</div>
|
||||
|
||||
<div className="chat-body" ref={bodyRef}
|
||||
onDragOver={e => { e.preventDefault(); e.currentTarget.classList.add('drag-over') }}
|
||||
onDragLeave={e => e.currentTarget.classList.remove('drag-over')}
|
||||
onDrop={async e => {
|
||||
e.preventDefault(); e.currentTarget.classList.remove('drag-over')
|
||||
for (const f of Array.from(e.dataTransfer.files ?? [])) {
|
||||
const id = await store.uploadAttachment(f)
|
||||
if (id) { setAttachmentIds(a => [...a, id]); setAttachmentNames(a => [...a, f.name]) }
|
||||
}
|
||||
onScroll={() => {
|
||||
const src = bodyRef.current
|
||||
if (!src) return
|
||||
const dist = src.scrollHeight - src.scrollTop - src.clientHeight
|
||||
const stick = dist < 80
|
||||
stickRef.current = stick
|
||||
setShowJump(prev => (prev === !stick ? prev : !stick))
|
||||
}}>
|
||||
{messages.filter(m => m.role !== 'assistant' || !m.runId || runs.find(r => r.id === m.runId)?.kind !== 'subagent').map(m => {
|
||||
{foldRunErrors(messages.filter(m => m.role !== 'assistant' || !m.runId || runs.find(r => r.id === m.runId)?.kind !== 'subagent')).map(m => {
|
||||
if (m.role === 'user') {
|
||||
// 内联确认卡(T3):锚定本消息的危险命令确认,双现于对话流与收件箱。
|
||||
const anchored = cards.filter(c => c.anchorMessageId === m.id && c.kind === 'confirm')
|
||||
return (
|
||||
<div className="msg user" key={m.id} data-msg-id={m.id}>
|
||||
<div className={`msg user${m.excluded ? ' is-excluded' : ''}`} key={m.id} data-msg-id={m.id}>
|
||||
<div className="msg-role">
|
||||
<span className="role-mark"><Avatar name={myName} size="sm" /></span>你
|
||||
<MessageTimestamp value={m.createdAt} />
|
||||
</div>
|
||||
<div className="bubble">{m.parts.filter(p => p.type === 'text').map(p => p.text).join('\n')}</div>
|
||||
{anchored.map(c => (
|
||||
<InlineConfirmCard key={c.id} card={c} callbacks={{
|
||||
onAction: (card, actionId) => store.cardAction(card, actionId),
|
||||
onLocate: card => store.openInbox(card.id),
|
||||
}} />
|
||||
))}
|
||||
{currentConvId && <MessageTools msg={m} convId={currentConvId} />}
|
||||
{anchored.map(c => workPaneOwnsCards
|
||||
? <button type="button" key={c.id} className="conversation-action-anchor" onClick={() => store.openInbox(c.id)}>
|
||||
<span>{c.title}</span><span>在工作栏处理 ↗</span>
|
||||
</button>
|
||||
: <InlineConfirmCard key={c.id} card={c} callbacks={{
|
||||
onAction: (card, actionId) => store.cardAction(card, actionId),
|
||||
actionState: card => cardActionStates?.[card.id],
|
||||
onLocate: card => store.openInbox(card.id),
|
||||
}} />
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
return <AssistantMessage key={m.id} msg={m} live={live?.runId === m.runId ? live : null} />
|
||||
if (m.role === 'system') return <NoticeMessage key={m.id} msg={m} />
|
||||
return <AssistantMessage key={m.id} msg={m} convId={currentConvId ?? undefined} live={live?.runId === m.runId ? live : null} />
|
||||
})}
|
||||
{live && !messages.some(m => m.runId === live.runId) &&
|
||||
{showLiveBubble(live?.runId ?? null, messages.filter(m => m.role === 'assistant' && m.runId).map(m => m.runId as string)) && live &&
|
||||
<AssistantMessage key={`live-${live.runId}`} msg={liveToMessage(live)} live={live} />}
|
||||
{activeHitl.map(c => <HITLCardView key={c.id} card={c} />)}
|
||||
{messages.length === 0 && <div className="empty-state">
|
||||
<ConversationWork />
|
||||
{messages.length === 0 && !live && cards.length === 0 && activeHitl.length === 0 && <div className="empty-state companion-empty">
|
||||
<span className="es-mark"><Icon name="sparkles" size={22} /></span>
|
||||
<div>发送消息开始对话</div>
|
||||
<div style={{ fontSize: 'var(--fs-ui-sm)', color: 'var(--text-faint)' }}>mock 模式演示指令:#hitl · #agents · #doc · #error · 命令:/help</div>
|
||||
<div className="companion-empty-title">这次想完成什么</div>
|
||||
<div>说说目标,也可以先添加材料</div>
|
||||
<div className="companion-examples" aria-label="可参考的工作目标">
|
||||
{['帮我整理这些材料中的重点和缺项', '一起比较这两个方案,说明各自适合的情况', '帮我把已有想法整理成一份草稿'].map(example => (
|
||||
<button type="button" className="companion-example" key={example} onClick={() => { setText(example); inputRef.current?.focus() }}>{example}</button>
|
||||
))}
|
||||
</div>
|
||||
</div>}
|
||||
</div>
|
||||
{showJump && (
|
||||
<button type="button" className="jump-bottom" onClick={() => {
|
||||
stickRef.current = true
|
||||
setShowJump(false)
|
||||
bodyRef.current?.scrollTo({ top: bodyRef.current.scrollHeight })
|
||||
}}>回到底部</button>
|
||||
)}
|
||||
|
||||
<div className="input-bar">
|
||||
<OutboxPanel />
|
||||
{unreadResults.length > 0 && <button type="button" className="work-result-notice" onClick={() => store.openInbox(unreadResults[0].id)}>
|
||||
<Icon name="check" size={14} /><span>{unreadResults.length} 项工作有新结果</span><span>查看工作 ↗</span>
|
||||
</button>}
|
||||
{workReference && <div className="composer-work-reference" role="group" aria-label="本条消息引用的工作结果">
|
||||
<span>基于「{workReference.title}」的第 {workReference.resultVersion} 版结果</span>
|
||||
<button type="button" className="icon-btn" aria-label="移除工作结果引用" onClick={() => store.clearWorkReference()}><Icon name="x" size={12} /></button>
|
||||
</div>}
|
||||
{!connected && <div className="companion-reconnect" role="status">正在重新连接,最新进展待确认</div>}
|
||||
{/* 轻量状态提示(方案:快慢通道连续体验):忙碌时可继续输入排队;
|
||||
后台工作完成后更新原卡,用户按需打开。 */}
|
||||
{(busy || bgRunning > 0) && (
|
||||
<div className="input-status" data-testid="input-status">
|
||||
<span className="live-dot" />
|
||||
{busy
|
||||
? <span className="mk-sweep">助手正在处理{bgRunning > 0 ? ` · ${bgRunning} 项后台工作` : ''}</span>
|
||||
: <span>{bgRunning} 项后台工作</span>}
|
||||
<span className="input-status-note">{busy ? '新消息会排队,当前回合结束后发送' : '你可以继续对话,结果会更新到工作卡'}</span>
|
||||
</div>
|
||||
)}
|
||||
{attachmentNames.length > 0 && (
|
||||
<div className="attachments">
|
||||
{attachmentNames.map((n, i) => <span className="attach-chip" key={i}><Icon name='paperclip' size={12} /> {n}
|
||||
<span style={{ cursor: 'pointer', display: 'inline-flex' }} onClick={() => { setAttachmentIds(a => a.filter((_, j) => j !== i)); setAttachmentNames(a => a.filter((_, j) => j !== i)) }}><Icon name="x" size={11} /></span>
|
||||
<button type="button" className="companion-remove-material" aria-label={`移除材料 ${n}`} onClick={() => { setAttachmentIds(a => a.filter((_, j) => j !== i)); setAttachmentNames(a => a.filter((_, j) => j !== i)) }}><Icon name="x" size={11} /></button>
|
||||
</span>)}
|
||||
</div>
|
||||
)}
|
||||
{uploading > 0 && <div className="companion-upload-status" role="status">正在添加 {uploading} 份材料,完成后即可发送</div>}
|
||||
{uploadError && <div className="companion-upload-error" role="alert">{uploadError}</div>}
|
||||
<Collapsible id={`operation-settings:${currentProjectId}:${currentConvId}`} triggerClassName="companion-operation-trigger"
|
||||
trigger={<><Icon name="settings" size={13} /><span>操作设置</span></>} bodyClassName="companion-operation-body">
|
||||
<label className="companion-setting"><span>操作权限</span><select aria-label="操作权限" value={conversation?.permissionMode || 'default'} onChange={e => {
|
||||
const mode = e.target.value
|
||||
if (mode === 'default' || mode === 'plan' || mode === 'auto_edit') void store.setPermissionMode(currentConvId, mode)
|
||||
}}>
|
||||
<option value="default">默认</option><option value="plan">计划</option><option value="auto_edit">自动改文件</option>
|
||||
</select></label>
|
||||
<p className="companion-setting-note">计划模式只进行读取与规划;自动改文件模式允许文件修改。重要操作仍按当前权限规则确认</p>
|
||||
</Collapsible>
|
||||
{text.startsWith('/') && <CommandMenu text={text} onPick={c => setText(c)} />}
|
||||
<div className="input-row">
|
||||
<label className="icon-btn" title="上传附件(文档解析后注入上下文)">
|
||||
<Icon name="paperclip" size={16} /><input type="file" multiple style={{ display: 'none' }} onChange={async e => {
|
||||
for (const f of Array.from(e.target.files ?? [])) {
|
||||
const id = await store.uploadAttachment(f)
|
||||
if (id) { setAttachmentIds(a => [...a, id]); setAttachmentNames(a => [...a, f.name]) }
|
||||
}
|
||||
e.target.value = ''
|
||||
}} />
|
||||
</label>
|
||||
<textarea rows={1} value={text} placeholder={hasOpenConfirm(cards) ? '有待确认的命令——请先处理上方确认卡'
|
||||
: active ? '继续输入以排队'
|
||||
: artifacts.length > 0 ? '输入消息…(/ 命令,@knowledge 检索注入)' : '输入消息…(/ 命令)'}
|
||||
<textarea ref={inputRef} rows={2} value={text} aria-label="工作目标或消息" placeholder={hasOpenConfirm(cards) ? '有一项操作等你确认,请先查看上方说明'
|
||||
: busy ? '继续补充,新消息会在当前回合结束后发送'
|
||||
: '告诉助手你的目标,或添加需要一起阅读的材料'}
|
||||
onChange={e => setText(e.target.value)}
|
||||
onKeyDown={e => { if (e.key === 'Enter' && !e.shiftKey) { e.preventDefault(); send() } }} />
|
||||
{active && (
|
||||
<button className="btn danger" onClick={() => store.cancelActive()}>停止</button>
|
||||
<div className="companion-compose-actions">
|
||||
<label className="companion-add-material" title="添加材料">
|
||||
<Icon name="paperclip" size={16} /><span>添加材料</span><input type="file" multiple className="companion-file-input" aria-label="添加材料" onChange={e => {
|
||||
const files = Array.from(e.currentTarget.files ?? [])
|
||||
e.currentTarget.value = ''
|
||||
void addMaterials(files)
|
||||
}} />
|
||||
</label>
|
||||
<span className="companion-input-hint">Enter 发送 · Shift+Enter 换行</span>
|
||||
<span className="companion-compose-spacer" />
|
||||
{showStop && (
|
||||
<button type="button" className="btn danger" onClick={() => store.cancelActive()}>停止</button>
|
||||
)}
|
||||
<button className="btn" onClick={send} disabled={!text.trim() && attachmentIds.length === 0}>{active ? '排队' : '发送'}</button>
|
||||
<button type="button" className="btn" onClick={send} disabled={uploading > 0 || (!text.trim() && attachmentIds.length === 0)}>{busy ? '加入队列' : '发送'}</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
function RewindControl({ convId, messageId }: { convId: string; messageId: string }) {
|
||||
const [open, setOpen] = useState(false)
|
||||
const [files, setFiles] = useState<{ restored: string[]; skipped: string[] } | null>(null)
|
||||
const [busy, setBusy] = useState(false)
|
||||
const [err, setErr] = useState('')
|
||||
async function preview() {
|
||||
setErr('')
|
||||
setOpen(true)
|
||||
setFiles(null)
|
||||
try {
|
||||
const plan = await api.checkpoints(convId, messageId)
|
||||
setFiles({ restored: plan.restored ?? [], skipped: plan.skipped ?? [] })
|
||||
} catch (e) {
|
||||
setErr(e instanceof Error ? e.message : String(e))
|
||||
}
|
||||
}
|
||||
async function confirm() {
|
||||
setBusy(true)
|
||||
setErr('')
|
||||
try {
|
||||
await api.rewindFiles(convId, messageId)
|
||||
setOpen(false)
|
||||
if (store.getState().currentConvId === convId) await store.openTask(convId)
|
||||
} catch (e) {
|
||||
setErr(e instanceof Error ? e.message : String(e))
|
||||
} finally {
|
||||
setBusy(false)
|
||||
}
|
||||
}
|
||||
const canRewind = !!files && files.restored.length > 0
|
||||
return (
|
||||
<div className="rewind-row">
|
||||
<button type="button" className="btn ghost" onClick={preview}>回滚文件</button>
|
||||
{open && (
|
||||
<div className="rewind-panel" role="dialog" aria-label="回滚文件">
|
||||
{!files && !err && <div>正在列出文件…</div>}
|
||||
{files && files.restored.length === 0 && files.skipped.length === 0 && <div>没有需要回滚的文件。</div>}
|
||||
{files && files.restored.length > 0 && (
|
||||
<>
|
||||
<div>将恢复这些文件:</div>
|
||||
<ul>{files.restored.map(p => <li key={p}>{p}</li>)}</ul>
|
||||
</>
|
||||
)}
|
||||
{files && files.skipped.length > 0 && (
|
||||
<>
|
||||
<div>这些文件在追踪之外被改过,会跳过:</div>
|
||||
<ul>{files.skipped.map(p => <li key={`skip-${p}`}>{p}</li>)}</ul>
|
||||
</>
|
||||
)}
|
||||
{err && <div className="rewind-error">{err}</div>}
|
||||
<div className="rewind-actions">
|
||||
<button type="button" className="btn" disabled={busy || !canRewind} onClick={confirm}>确认回滚</button>
|
||||
<button type="button" className="btn ghost" onClick={() => setOpen(false)}>取消</button>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -0,0 +1,78 @@
|
||||
import { useEffect, useMemo, useState } from 'react'
|
||||
import { ActivityCardView, Collapsible, activitySummary, groupActivityCards, pendingCount, type ActivityCard } from '@ui'
|
||||
import { store, useStore } from '../store'
|
||||
import { docBridge } from './Workbench'
|
||||
import type { WorkCardAction } from '../contracts'
|
||||
import { WorkExecutionRecord } from './WorkExecutionRecord'
|
||||
|
||||
/** 对话与辅助工作栏共享对象、动作和唯一文件预览,不另持有异步状态。 */
|
||||
export function ConversationWork() {
|
||||
const cards = useStore(s => s.cards)
|
||||
const conversationId = useStore(s => s.currentConvId)
|
||||
const projectId = useStore(s => s.currentProjectId)
|
||||
const messages = useStore(s => s.messages)
|
||||
const actionStates = useStore(s => s.cardActionStates)
|
||||
const rightCollapsed = useStore(s => s.ui.rightCollapsed)
|
||||
const rightTab = useStore(s => s.ui.rightTab)
|
||||
const record = useStore(s => s.workRecord)
|
||||
const detailHere = rightCollapsed || rightTab !== 'work'
|
||||
const [summaryOpen, setSummaryOpen] = useState(detailHere)
|
||||
useEffect(() => setSummaryOpen(detailHere), [detailHere])
|
||||
const { current, required, focused, history } = useMemo(() => {
|
||||
const current = cards.filter(card => card.status !== 'dismissed'
|
||||
&& card.conversationId === conversationId && card.projectId === projectId)
|
||||
const required: ActivityCard[] = []
|
||||
const remaining: ActivityCard[] = []
|
||||
for (const card of current) {
|
||||
// A confirmation already visible at its user message has one main action
|
||||
// path in the conversation; assistant-anchored cards still need this path.
|
||||
if (card.kind === 'confirm' && card.anchorMessageId
|
||||
&& messages.some(message => message.role === 'user' && message.id === card.anchorMessageId)) continue
|
||||
const summary = activitySummary(card)
|
||||
if (card.status === 'action_required' || card.work?.decision?.state === 'open' || summary.failed || (card.status === 'done' && summary.remaining)) required.push(card)
|
||||
else remaining.push(card)
|
||||
}
|
||||
// Preserve the host's newest-first order for completed results and history.
|
||||
const results = groupActivityCards(remaining).find(group => group.key === 'results')?.cards ?? []
|
||||
const focused = remaining.find(card => card.pinned && card.status === 'active')
|
||||
?? remaining.find(card => card.status === 'active')
|
||||
?? results[0]
|
||||
return { current, required, focused, history: remaining.filter(card => card !== focused).sort((a, b) => b.updatedAt.localeCompare(a.updatedAt)) }
|
||||
}, [cards, messages, conversationId, projectId])
|
||||
if (!detailHere) return null
|
||||
if (record) return <div className="conversation-work" data-conversation-work><WorkExecutionRecord /></div>
|
||||
if (current.length === 0) return null
|
||||
const pending = pendingCount(current)
|
||||
const active = current.filter(card => card.status === 'active').length
|
||||
const results = current.filter(card => card.status === 'done' || card.status === 'failed').length
|
||||
const summary = [pending ? `${pending} 项待处理` : '', active ? `${active} 项工作` : '', results ? `${results} 项结果` : ''].filter(Boolean).join(' · ')
|
||||
const callbacks = {
|
||||
onAction: (card: ActivityCard, actionId: string, payload?: WorkCardAction) => { void store.cardAction(card, actionId, payload) },
|
||||
onOpenRecord: (card: ActivityCard) => store.openWorkRecord(card),
|
||||
onReference: (card: ActivityCard) => store.referenceWork(card),
|
||||
actionState: (card: ActivityCard) => actionStates?.[card.id],
|
||||
onPin: (card: ActivityCard, pinned: boolean) => { void store.cardPin(card, pinned) },
|
||||
onDismiss: (card: ActivityCard) => { void store.cardDismiss(card) },
|
||||
onLocate: (card: ActivityCard) => { store.locateMessage(card.anchorMessageId) },
|
||||
onArchive: (card: ActivityCard) => { void store.cardToProject(card) },
|
||||
}
|
||||
const view = (card: ActivityCard) => <ActivityCardView key={card.id} card={card} callbacks={callbacks} docBridge={docBridge} />
|
||||
|
||||
return (
|
||||
<section className="conversation-work" data-conversation-work aria-label="工作进展">
|
||||
<div className="conversation-work-heading"><span>工作进展</span><span>{summary || '已处理的工作'}</span></div>
|
||||
<div className="conversation-work-current">
|
||||
{required.map(view)}
|
||||
{focused && <Collapsible id={`conversation-current:${conversationId}:${focused.id}`} open={summaryOpen} onToggle={setSummaryOpen}
|
||||
triggerClassName="conversation-work-more" trigger={<><span className="process-collapse-chev">▸</span>{focused.title} · 查看摘要</>}>
|
||||
{view(focused)}
|
||||
</Collapsible>}
|
||||
</div>
|
||||
{history.length > 0 && <Collapsible id={`conversation-work:${projectId}:${conversationId}`}
|
||||
triggerClassName="conversation-work-more"
|
||||
trigger={<><span className="process-collapse-chev">▸</span>更多工作与成果 · {history.length} 项</>}>
|
||||
<div className="conversation-work-history">{history.map(view)}</div>
|
||||
</Collapsible>}
|
||||
</section>
|
||||
)
|
||||
}
|
||||
@@ -1,68 +0,0 @@
|
||||
// 文档查看器(4.4 → 预览能力收敛):格式渲染统一交给 @ui FilePreview
|
||||
// (md/图片/pdf/代码/数据/docx/xlsx/pptx/URL 一套分派),这里只保留 OverlayHost
|
||||
// 容器、工具栏与文本族的在线编辑保存。
|
||||
import { useEffect, useState } from 'react'
|
||||
import { api } from '../api'
|
||||
import { store } from '../store'
|
||||
import { OverlayHost, Icon, Btn, FilePreview } from '@ui'
|
||||
import type { Artifact } from '../contracts'
|
||||
import { humanSize } from '../messageparts'
|
||||
|
||||
export function DocViewer({ artifact }: { artifact: Artifact }) {
|
||||
const [content, setContent] = useState<string | null>(null)
|
||||
const [editing, setEditing] = useState(false)
|
||||
const [dirty, setDirty] = useState(false)
|
||||
|
||||
const textKind = isTextKind(artifact)
|
||||
useEffect(() => {
|
||||
if (!textKind) return
|
||||
setContent(null)
|
||||
fetch(api.artifactContentUrl(artifact.id)).then(r => r.text()).then(setContent).catch(() => setContent('(读取失败)'))
|
||||
}, [artifact.id])
|
||||
|
||||
const source = {
|
||||
kind: 'artifact' as const,
|
||||
id: artifact.id,
|
||||
name: artifact.name,
|
||||
mime: artifact.mime,
|
||||
contentUrl: api.artifactContentUrl(artifact.id),
|
||||
downloadUrl: api.artifactDownloadUrl(artifact.id),
|
||||
}
|
||||
|
||||
return (
|
||||
<OverlayHost title={artifact.name} icon="📄" onClose={() => store.viewArtifact(null)}>
|
||||
<div className="docv">
|
||||
<div className="docv-toolbar">
|
||||
<span className="docv-meta">{artifact.kind}{humanSize(artifact.size) ? ` · ${humanSize(artifact.size)}` : ''}</span>
|
||||
<span className="spacer" />
|
||||
{dirty && <span className="docv-dirty">未保存</span>}
|
||||
{textKind && (
|
||||
<>
|
||||
<Btn variant="ghost" icon={editing ? 'eye' : 'list'} onClick={() => setEditing(e => !e)}>{editing ? '预览' : '编辑'}</Btn>
|
||||
{editing && <Btn variant="primary" icon="check" disabled={!dirty} onClick={async () => {
|
||||
await api.saveArtifactContent(artifact.id, content ?? '')
|
||||
setDirty(false)
|
||||
store.toast('已保存')
|
||||
}}>保存</Btn>}
|
||||
</>
|
||||
)}
|
||||
<a className="btn v-ghost docv-dl" href={api.artifactDownloadUrl(artifact.id)} download={artifact.name}>
|
||||
<Icon name="download" size={14} /> 下载
|
||||
</a>
|
||||
</div>
|
||||
<div className="docv-body">
|
||||
{editing && textKind ? (
|
||||
<textarea className="search-input docv-editor" value={content ?? ''}
|
||||
onChange={e => { setContent(e.target.value); setDirty(true) }} />
|
||||
) : (
|
||||
<FilePreview source={source} />
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</OverlayHost>
|
||||
)
|
||||
}
|
||||
|
||||
function isTextKind(a: Artifact): boolean {
|
||||
return a.kind === 'document' && /\.(md|txt|csv|log|json)$/i.test(a.name)
|
||||
}
|
||||
@@ -0,0 +1,372 @@
|
||||
// 文档驾驶舱 I2(rollout I2):顶部统计带 + 左侧结构树 + 中央结构全景。
|
||||
// 消费 I1 只读命令面 rdm.cockpit.*(Dev 仓 docs/superpowers/specs 2026-10-16
|
||||
// view-spec §1–§4;四项取舍冻结见 rollout §7——首屏只显示章节概览与统计,
|
||||
// 段落/正文摘要在选中与阅读器内按权限展示,本增量不含阅读器(I3))。
|
||||
// 异步所有者:generation + contextKey(项目+筛选);不匹配的旧响应直接丢弃。
|
||||
// 令牌驱动(DESIGN.md):颜色/字号只消费 @ui/tokens.css;折叠用 Collapsible。
|
||||
import { useCallback, useEffect, useRef, useState } from 'react'
|
||||
import { api } from '../api'
|
||||
import { store, useStore } from '../store'
|
||||
import { EmptyState, SectionLabel } from '@ui'
|
||||
import { classifyRdmError } from '../rdmErrors'
|
||||
import {
|
||||
contextKey, loadPrefs, nodeSummaryLine, sameSnapshot, savePrefs,
|
||||
selectionSurvives, statDisplay, STAT_FILTERS, toggleFilter, treeBadges,
|
||||
type CockpitMeta, type CockpitNodeRef, type CockpitOverview,
|
||||
type CockpitTreeNode, type CockpitTreePage,
|
||||
type Density, type PanelTabId, type ViewMode,
|
||||
} from '../documentCockpit'
|
||||
import { CockpitPanel, CockpitReader, VersionBlock } from './CockpitReader'
|
||||
|
||||
interface ProjectView { projectId: string; name: string; canAudit?: boolean }
|
||||
|
||||
function CockpitErrorState({ raw }: { raw: string }) {
|
||||
const c = classifyRdmError(raw)
|
||||
return <EmptyState icon="alert">{c.message}</EmptyState>
|
||||
}
|
||||
|
||||
interface Selection { ref: CockpitNodeRef; parentDocId?: string }
|
||||
|
||||
export function DocumentCockpit() {
|
||||
const identity = useStore(() => store.getIdentityEpoch())
|
||||
const [projects, setProjects] = useState<ProjectView[] | null>(null)
|
||||
const [pid, setPid] = useState('')
|
||||
const [filter, setFilter] = useState('')
|
||||
const [overview, setOverview] = useState<CockpitOverview | null>(null)
|
||||
const [treePages, setTreePages] = useState<Record<string, { items: CockpitTreeNode[]; nextCursor?: string; hasMore: boolean; meta?: CockpitMeta }>>({})
|
||||
const [selected, setSelected] = useState<Selection | null>(null)
|
||||
const [error, setError] = useState('')
|
||||
const [loadErr, setLoadErr] = useState('')
|
||||
const [viewMode, setViewMode] = useState<ViewMode>('panorama')
|
||||
const [density, setDensity] = useState<Density>('compact')
|
||||
const [panelTab, setPanelTab] = useState<PanelTabId>('sources')
|
||||
const gen = useRef(0)
|
||||
|
||||
const reload = useCallback((projectId: string, f: string) => {
|
||||
if (!projectId) return
|
||||
const g = ++gen.current
|
||||
const ctx = contextKey(projectId, f)
|
||||
setLoadErr('')
|
||||
api.rdmCommand<CockpitOverview>('rdm.cockpit.overview', { projectId })
|
||||
.then(ov => {
|
||||
if (g !== gen.current || ctx !== contextKey(pid, filter)) return // 旧响应:项目/筛选已切换,丢弃
|
||||
setOverview(ov)
|
||||
setTreePages({}) // 树页随新快照整体重建
|
||||
setSelected(sel => {
|
||||
const kept = selectionSurvives(sel?.ref || null, (ov.documents || []).map(d => d.ref.id), sel?.parentDocId)
|
||||
return kept ? { ref: kept, parentDocId: sel?.parentDocId } : null
|
||||
})
|
||||
})
|
||||
.catch(e => { if (g === gen.current && ctx === contextKey(pid, filter)) setLoadErr(e.message) })
|
||||
}, [pid, filter])
|
||||
|
||||
// 项目清单(rdm.project.list:成员可见项目,canAudit 与否不影响文档读取入口)。
|
||||
useEffect(() => {
|
||||
let c = false
|
||||
setProjects(null); setPid(''); setOverview(null); setSelected(null); setFilter(''); setError('')
|
||||
api.rdmCommand<{ projects?: ProjectView[] } | ProjectView[]>('rdm.project.list')
|
||||
.then(list => {
|
||||
if (c) return
|
||||
// rdm.project.list 返回 { projects: [...] };容忍裸数组形态。
|
||||
const rows = Array.isArray(list) ? list : (list?.projects ?? [])
|
||||
setProjects(rows)
|
||||
// 设计 §6.2:进入驾驶舱默认选中第一个可见项目,驱动概览首屏。
|
||||
if (rows.length > 0) setPid(prev => prev || rows[0].projectId)
|
||||
})
|
||||
.catch(e => { if (!c) setError(e.message) })
|
||||
return () => { c = true }
|
||||
}, [identity])
|
||||
|
||||
// 项目/筛选变化 → 重新取概览(统计与根文档来自同一快照)。
|
||||
useEffect(() => {
|
||||
if (!pid) return
|
||||
reload(pid, filter)
|
||||
}, [pid, filter, reload])
|
||||
|
||||
// 个人视图偏好(设计 §7.3):按 登录世代+项目 隔离,仅本地;恢复最近视图。
|
||||
useEffect(() => {
|
||||
if (!pid) return
|
||||
const prefs = loadPrefs(`epoch-${identity}`, pid)
|
||||
setViewMode(prefs.lastView)
|
||||
setDensity(prefs.density)
|
||||
setPanelTab(prefs.rightPanelTab)
|
||||
}, [identity, pid])
|
||||
const applyPrefs = useCallback((patch: { lastView?: ViewMode; density?: Density; rightPanelTab?: PanelTabId }) => {
|
||||
if (!pid) return
|
||||
setViewMode(v => patch.lastView ?? v)
|
||||
setDensity(d => patch.density ?? d)
|
||||
setPanelTab(t => patch.rightPanelTab ?? t)
|
||||
const prefs = loadPrefs(`epoch-${identity}`, pid)
|
||||
savePrefs(`epoch-${identity}`, pid, { ...prefs, ...patch })
|
||||
}, [identity, pid])
|
||||
|
||||
// 展开文档:按需加载章节子页(键集分页;旧项目/旧筛选的响应丢弃;
|
||||
// 加载失败只影响该分支——行内保留重试,不拖垮其它面板)。
|
||||
const loadChildren = useCallback((docId: string, cursor?: string) => {
|
||||
if (!pid) return
|
||||
const g = gen.current
|
||||
const ctx = contextKey(pid, filter)
|
||||
api.rdmCommand<CockpitTreePage>('rdm.cockpit.tree', { projectId: pid, parent: docId, cursor, limit: 50, filter })
|
||||
.then(page => {
|
||||
if (g !== gen.current || ctx !== contextKey(pid, filter)) return
|
||||
setTreePages(prev => {
|
||||
const old = cursor ? prev[docId] : { items: [] as CockpitTreeNode[], hasMore: false }
|
||||
const items = cursor ? [...(old?.items || []), ...page.items] : page.items
|
||||
return { ...prev, [docId]: { items, nextCursor: page.nextCursor, hasMore: page.hasMore, meta: page.meta } }
|
||||
})
|
||||
})
|
||||
.catch(() => { /* 行内重试入口承担 */ })
|
||||
}, [pid, filter])
|
||||
|
||||
if (error) return <CockpitErrorState raw={error} />
|
||||
if (!projects) return <div className="empty-note">加载中…</div>
|
||||
if (projects.length === 0) return <EmptyState icon="folder">暂无可见研发项目——项目成员身份由项目负责人授予</EmptyState>
|
||||
|
||||
const docIds = (overview?.documents || []).map(d => d.ref.id)
|
||||
const splitNotice = !!overview && Object.values(treePages).some(p => !sameSnapshot(overview.meta, p.meta))
|
||||
const selectDoc = (id: string) => setSelected({ ref: { kind: 'document', id } })
|
||||
const selectSection = (docId: string, sec: CockpitTreeNode) => setSelected({ ref: sec.ref, parentDocId: docId })
|
||||
return (
|
||||
<div className="cockpit">
|
||||
<div className="cockpit-header">
|
||||
<select className="ui-input cockpit-project" value={pid} onChange={e => { setPid(e.target.value); setSelected(null); setFilter('') }} aria-label="选择项目">
|
||||
{projects.map(p => <option key={p.projectId} value={p.projectId}>{p.name}</option>)}
|
||||
</select>
|
||||
{filter && <button type="button" className="cockpit-filter-chip" onClick={() => setFilter('')}>
|
||||
筛选:{STAT_FILTERS.find(s => s.filter === filter)?.label || filter} ✕
|
||||
</button>}
|
||||
<span className="cockpit-snap">{overview ? `快照 ${overview.meta.snapshotRevision}` : '加载中…'}</span>
|
||||
<div className="cockpit-viewtoggle" role="group" aria-label="视图切换">
|
||||
<button type="button" className={`cockpit-viewbtn${viewMode === 'panorama' ? ' cockpit-viewbtn-active' : ''}`} onClick={() => applyPrefs({ lastView: 'panorama' })}>全景</button>
|
||||
<button type="button" className={`cockpit-viewbtn${viewMode === 'reader' ? ' cockpit-viewbtn-active' : ''}`} onClick={() => applyPrefs({ lastView: 'reader' })}>阅读器</button>
|
||||
<button type="button" className="cockpit-viewbtn" onClick={() => applyPrefs({ density: density === 'compact' ? 'full' : 'compact' })} title="切换密度">{density === 'compact' ? '紧凑' : '宽松'}</button>
|
||||
</div>
|
||||
<button type="button" className="cockpit-refresh" onClick={() => reload(pid, filter)} disabled={!pid}>刷新</button>
|
||||
</div>
|
||||
{splitNotice && (
|
||||
<div className="cockpit-banner" role="status">统计与树快照不一致——请刷新以对齐最新快照</div>
|
||||
)}
|
||||
{loadErr && <div className="cockpit-banner cockpit-banner-err" role="alert">概览读取失败:{loadErr}(保留上一快照,可重试)</div>}
|
||||
{overview && (
|
||||
<div className="cockpit-stats" role="group" aria-label="项目统计">
|
||||
<div className="cockpit-stat">
|
||||
<span className="cockpit-stat-num">{statDisplay(overview.stats, 'completion').value}</span>
|
||||
<span className="cockpit-stat-label">完成度{statDisplay(overview.stats, 'completion').hint ? `(${statDisplay(overview.stats, 'completion').hint})` : ''}</span>
|
||||
</div>
|
||||
<div className="cockpit-stat"><span className="cockpit-stat-num">{statDisplay(overview.stats, 'documents').value}</span><span className="cockpit-stat-label">文档</span></div>
|
||||
{STAT_FILTERS.map(s => {
|
||||
const d = statDisplay(overview.stats, s.key)
|
||||
const active = filter === s.filter
|
||||
return (
|
||||
<button key={s.key} type="button" className={`cockpit-stat${active ? ' cockpit-stat-active' : ''}`}
|
||||
onClick={() => setFilter(f => toggleFilter(f, s.filter))}
|
||||
title={d.hint ? `${s.label}:${d.hint}` : `筛选:${s.label}`}>
|
||||
<span className="cockpit-stat-num">{d.value}</span>
|
||||
<span className="cockpit-stat-label">{s.label}{d.hint ? `(${d.hint})` : ''}</span>
|
||||
</button>
|
||||
)
|
||||
})}
|
||||
<div className="cockpit-stat cockpit-stat-unavail"><span className="cockpit-stat-num">—</span><span className="cockpit-stat-label">待确认(未纳入投影)</span></div>
|
||||
<div className="cockpit-stat"><span className="cockpit-stat-num">{overview.stats.updatedAt ? new Date(overview.stats.updatedAt).toLocaleString('zh-CN') : '—'}</span><span className="cockpit-stat-label">最近更新</span></div>
|
||||
</div>
|
||||
)}
|
||||
<div className={`cockpit-columns${selected ? ' cockpit-columns-3' : ''}`}>
|
||||
<div className="cockpit-tree" role="tree" aria-label="文档结构树">
|
||||
<SectionLabel>结构树</SectionLabel>
|
||||
{!overview && <div className="empty-note">加载结构…</div>}
|
||||
{overview && docIds.length === 0 && <div className="empty-note">暂无受控文档</div>}
|
||||
{overview && overview.meta.truncated && (
|
||||
<div className="cockpit-truncated">文档清单已截断({overview.meta.truncationReasons?.join(';') || '超出上限'})</div>
|
||||
)}
|
||||
{overview && overview.documents.map(d => (
|
||||
<TreeRow key={d.ref.id} node={d} depth={0}
|
||||
expanded={treePages[d.ref.id] !== undefined}
|
||||
childPage={treePages[d.ref.id]}
|
||||
selectedId={selected?.ref.id}
|
||||
onSelectNode={n => (n.ref.kind === 'document' ? selectDoc(n.ref.id) : selectSection(d.ref.id, n))}
|
||||
onExpand={() => { if (treePages[d.ref.id] === undefined) loadChildren(d.ref.id) }}
|
||||
onLoadMore={() => { const p = treePages[d.ref.id]; if (p?.nextCursor) loadChildren(d.ref.id, p.nextCursor) }}
|
||||
onRetryChild={() => { const p = treePages[d.ref.id]; loadChildren(d.ref.id, p?.nextCursor) }}
|
||||
/>
|
||||
))}
|
||||
</div>
|
||||
<div className="cockpit-center">
|
||||
{!overview && <div className="empty-note">加载概览…</div>}
|
||||
{overview && !selected && (
|
||||
<PanoramaHome overview={overview} onSelect={selectDoc} />
|
||||
)}
|
||||
{overview && selected && viewMode === 'panorama' && (
|
||||
<PanoramaNode pid={pid} selection={selected} overview={overview}
|
||||
snapRev={overview.meta.snapshotRevision}
|
||||
childPage={selected.ref.kind === 'document' ? treePages[selected.ref.id] : undefined}
|
||||
density={density}
|
||||
onClear={() => setSelected(null)}
|
||||
onOpenReader={() => applyPrefs({ lastView: 'reader' })} />
|
||||
)}
|
||||
{overview && selected && viewMode === 'reader' && (
|
||||
<CockpitReader pid={pid} selection={selected}
|
||||
sections={selected.ref.kind === 'document' ? (treePages[selected.ref.id]?.items || []) : []}
|
||||
density={density} onBack={() => applyPrefs({ lastView: 'panorama' })} />
|
||||
)}
|
||||
</div>
|
||||
{overview && selected && (
|
||||
<div className="cockpit-right">
|
||||
<CockpitPanel pid={pid} selection={selected} tab={panelTab} onTab={t => applyPrefs({ rightPanelTab: t })} density={density} />
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
function TreeRow({ node, depth, expanded, childPage, selectedId, onSelectNode, onExpand, onLoadMore, onRetryChild }: {
|
||||
node: CockpitTreeNode; depth: number
|
||||
expanded: boolean
|
||||
childPage?: { items: CockpitTreeNode[]; nextCursor?: string; hasMore: boolean; meta?: CockpitMeta }
|
||||
selectedId?: string
|
||||
onSelectNode: (n: CockpitTreeNode) => void
|
||||
onExpand: () => void
|
||||
onLoadMore: () => void
|
||||
onRetryChild: () => void
|
||||
}) {
|
||||
const badges = treeBadges(node)
|
||||
const selected = selectedId === node.ref.id
|
||||
return (
|
||||
<div className="cockpit-tree-branch">
|
||||
<div className={`cockpit-tree-row${selected ? ' cockpit-tree-row-active' : ''}`} style={{ paddingLeft: depth * 14 }} role="treeitem" aria-selected={selected}>
|
||||
{node.ref.kind === 'document' && (
|
||||
<button type="button" className="cockpit-tree-caret" aria-label={expanded ? '折叠' : '展开'}
|
||||
aria-expanded={expanded} onClick={e => { e.stopPropagation(); if (!expanded) onExpand() }}>
|
||||
{expanded ? '▾' : '▸'}
|
||||
</button>
|
||||
)}
|
||||
<button type="button" className="cockpit-tree-title" onClick={() => onSelectNode(node)}>{node.title}</button>
|
||||
{badges.map(b => <span key={b} className="cockpit-badge">{b}</span>)}
|
||||
{node.lastChangedAt && <span className="cockpit-tree-time">{new Date(node.lastChangedAt).toLocaleDateString('zh-CN')}</span>}
|
||||
</div>
|
||||
{expanded && !childPage && (
|
||||
<button type="button" className="cockpit-tree-more" style={{ paddingLeft: (depth + 1) * 14 }} onClick={onRetryChild}>章节加载失败,重试</button>
|
||||
)}
|
||||
{expanded && childPage && (
|
||||
<div>
|
||||
{childPage.items.length === 0 && <div className="cockpit-tree-empty" style={{ paddingLeft: (depth + 1) * 14 }}>无章节</div>}
|
||||
{childPage.items.map(sec => (
|
||||
<TreeRow key={sec.ref.id} node={sec} depth={depth + 1} expanded={false} childPage={undefined}
|
||||
selectedId={selectedId} onSelectNode={onSelectNode}
|
||||
onExpand={onExpand} onLoadMore={onLoadMore} onRetryChild={onRetryChild} />
|
||||
))}
|
||||
{childPage.hasMore && childPage.items.length > 0 && (
|
||||
<button type="button" className="cockpit-tree-more" style={{ paddingLeft: (depth + 1) * 14 }} onClick={onLoadMore}>加载更多章节</button>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
function PanoramaHome({ overview, onSelect }: { overview: CockpitOverview; onSelect: (id: string) => void }) {
|
||||
return (
|
||||
<div>
|
||||
<SectionLabel>{overview.project.title} · 文档概览</SectionLabel>
|
||||
{overview.documents.length === 0 && <EmptyState icon="folder">暂无受控文档——文档由模板实例化或导入后进入驾驶舱</EmptyState>}
|
||||
<div className="cockpit-doclist">
|
||||
{overview.documents.map(d => (
|
||||
<button key={d.ref.id} type="button" className="cockpit-docrow" onClick={() => onSelect(d.ref.id)}>
|
||||
<span className="cockpit-docrow-title">{d.title}</span>
|
||||
<span className="cockpit-docrow-meta">{nodeSummaryLine(d)}</span>
|
||||
</button>
|
||||
))}
|
||||
</div>
|
||||
<SectionLabel>最近变化</SectionLabel>
|
||||
{overview.recentChanges.length === 0 && <div className="empty-note">暂无可见变化</div>}
|
||||
<div className="cockpit-changes">
|
||||
{overview.recentChanges.map((c, i) => (
|
||||
<div key={`${c.node.id}-${i}`} className="cockpit-changerow">
|
||||
<span className="cockpit-changesum">{c.summary} · {c.title}{c.actor ? ` · ${c.actor}` : ''}</span>
|
||||
<span className="cockpit-changetime">{new Date(c.changedAt).toLocaleString('zh-CN')}</span>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
function PanoramaNode({ pid, selection, overview, childPage, density, snapRev, onClear, onOpenReader }: {
|
||||
pid: string; selection: Selection; overview: CockpitOverview
|
||||
childPage?: { items: CockpitTreeNode[]; nextCursor?: string; hasMore: boolean; meta?: CockpitMeta }
|
||||
density: Density
|
||||
snapRev: string
|
||||
onClear: () => void
|
||||
onOpenReader: () => void
|
||||
}) {
|
||||
const [detail, setDetail] = useState<any>(null)
|
||||
const [err, setErr] = useState('')
|
||||
const gen = useRef(0)
|
||||
useEffect(() => {
|
||||
const g = ++gen.current
|
||||
setDetail(null); setErr('')
|
||||
api.rdmCommand<any>('rdm.cockpit.node', { projectId: pid, kind: selection.ref.kind, id: selection.ref.id })
|
||||
.then(d => {
|
||||
if (g !== gen.current) return
|
||||
// 后端空列表可能投影为 null(Go nil slice);统一归一,消费端按数组使用。
|
||||
for (const k of ['sources', 'history', 'impacts', 'conflicts'] as const) {
|
||||
if (d?.[k] && !Array.isArray(d[k].items)) d[k].items = []
|
||||
}
|
||||
setDetail(d)
|
||||
})
|
||||
.catch(e => { if (g === gen.current) setErr(e.message) })
|
||||
return () => { gen.current++ }
|
||||
}, [pid, selection.ref.kind, selection.ref.id, snapRev])
|
||||
const node = (detail?.node || null) as CockpitTreeNode | null
|
||||
const title = node?.title || selection.ref.id
|
||||
return (
|
||||
<div>
|
||||
<div className="cockpit-nodehead">
|
||||
<button type="button" className="cockpit-back" onClick={onClear}>← 返回概览</button>
|
||||
<span className="cockpit-nodetitle">{title}</span>
|
||||
{node && <span className="cockpit-nodesum">{nodeSummaryLine(node)}</span>}
|
||||
<button type="button" className="cockpit-filter-chip" onClick={onOpenReader}>在阅读器中打开</button>
|
||||
</div>
|
||||
{err && <CockpitErrorState raw={err} />}
|
||||
{detail?.body?.length === 1 && detail.body[0].kind === 'restricted' && (
|
||||
<div className="empty-note">内容受限({detail.body[0].reason || '权限'})——标题与状态可见,正文不展示</div>
|
||||
)}
|
||||
{selection.ref.kind === 'section' && detail?.versions && detail.versions.length > 0 && (
|
||||
<VersionBlock versions={detail.versions} density={density} />
|
||||
)}
|
||||
{detail && detail.meta && !sameSnapshot(detail.meta, overview.meta) && (
|
||||
<div className="cockpit-truncated">节点详情与统计快照不同({detail.meta.snapshotRevision} vs {overview.meta.snapshotRevision})——刷新对齐</div>
|
||||
)}
|
||||
{node && node.ref.kind === 'document' && (
|
||||
<>
|
||||
<SectionLabel>章节状态</SectionLabel>
|
||||
{!childPage && <div className="empty-note">章节按需加载——在左侧树展开</div>}
|
||||
{childPage && childPage.items.length === 0 && <div className="empty-note">无章节</div>}
|
||||
{childPage && childPage.items.length > 0 && (
|
||||
<table className="cockpit-childtable">
|
||||
<thead><tr><th>章节</th><th>内容</th><th>核实</th><th>来源</th><th>冲突</th><th>最近更新</th></tr></thead>
|
||||
<tbody>
|
||||
{childPage.items.map(sec => (
|
||||
<tr key={sec.ref.id}>
|
||||
<td>{sec.title}</td>
|
||||
<td>{{ complete: '完整', partial: '部分', empty: '空', inaccessible: '受限', unavailable: '不可读' }[sec.state.content] || sec.state.content}</td>
|
||||
<td>{sec.state.verification === 'not_applicable' ? '—' : sec.state.verification}</td>
|
||||
<td>{sec.state.sourceCount}</td>
|
||||
<td>{sec.state.conflictCount}</td>
|
||||
<td>{sec.lastChangedAt ? new Date(sec.lastChangedAt).toLocaleDateString('zh-CN') : '—'}</td>
|
||||
</tr>
|
||||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
)}
|
||||
</>
|
||||
)}
|
||||
{node && node.ref.kind === 'section' && (
|
||||
<div className="empty-note">点「在阅读器中打开」查看连续正文与版本差异;右侧为该节点的依据与影响面板</div>
|
||||
)}
|
||||
{detail?.meta?.truncated && (
|
||||
<div className="cockpit-truncated">详情已截断:{detail.meta.truncationReasons?.join(';')}</div>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,98 @@
|
||||
import { useEffect, useState } from 'react'
|
||||
import { api, type ExecEnvView } from '../api'
|
||||
import { Btn, EmptyState, Icon, SettingRow, SettingsGroup } from '@ui'
|
||||
|
||||
export function ExecEnvPanel() {
|
||||
const [view, setView] = useState<ExecEnvView | null>(null)
|
||||
const [err, setErr] = useState('')
|
||||
const [notice, setNotice] = useState('')
|
||||
const [busy, setBusy] = useState(false)
|
||||
const [conv, setConv] = useState('')
|
||||
const [reason, setReason] = useState('')
|
||||
const [wheel, setWheel] = useState<File | null>(null)
|
||||
|
||||
const refresh = async () => {
|
||||
try { setView(await api.adminExecEnv()) } catch (e) { setErr(String(e)) }
|
||||
}
|
||||
useEffect(() => { refresh() }, [])
|
||||
|
||||
const run = async (work: () => Promise<string>) => {
|
||||
setErr(''); setNotice(''); setBusy(true)
|
||||
try { setNotice(await work()); await refresh() } catch (e) { setErr(String(e)) } finally { setBusy(false) }
|
||||
}
|
||||
|
||||
if (!view) return <EmptyState icon="package">加载 Python 环境…</EmptyState>
|
||||
if (!view.configured) return <EmptyState icon="package">这台服务没有配置分层 Python 环境根</EmptyState>
|
||||
|
||||
return (
|
||||
<div>
|
||||
<SettingsGroup title="当前环境">
|
||||
<SettingRow label="环境根" desc={view.root || '未设置'}><span /></SettingRow>
|
||||
<SettingRow label="解释器" desc={view.python || '尚未安装托管解释器'}><span /></SettingRow>
|
||||
<SettingRow label="基础层" desc={view.base || '尚未建立'}><span /></SettingRow>
|
||||
<SettingRow label="层目录" desc={(view.layers ?? []).join('、') || '无'}>
|
||||
<Btn variant="ghost" icon="undo" disabled={busy} onClick={() => run(async () => {
|
||||
const out = await api.adminExecEnvRebase()
|
||||
return `基础层已切换到 ${out.base}。已有会话仍用原来的绑定。`
|
||||
})}>重建基础层</Btn>
|
||||
</SettingRow>
|
||||
</SettingsGroup>
|
||||
<SettingsGroup title="申请">
|
||||
{(view.requests ?? []).length === 0 && <EmptyState icon="inbox">还没有扩展包申请</EmptyState>}
|
||||
{(view.requests ?? []).map(req => (
|
||||
<SettingRow key={req.id} label={req.spec || req.id} desc={`${req.status} · ${req.conversationId} · ${req.detail}`}>
|
||||
{req.status === 'pending_approval' && (
|
||||
<span className="ad-row">
|
||||
<Btn variant="primary" icon="check" disabled={busy} onClick={() => run(async () => {
|
||||
const out = await api.adminExecEnvDecision(req.id, true, false)
|
||||
return out.detail || out.status
|
||||
})}>批准</Btn>
|
||||
<Btn variant="ghost" disabled={busy} onClick={() => run(async () => {
|
||||
const out = await api.adminExecEnvDecision(req.id, true, true)
|
||||
return out.detail || '已用隔离层'
|
||||
})}>隔离层</Btn>
|
||||
<Btn variant="ghost" icon="x" disabled={busy} onClick={() => run(async () => {
|
||||
const out = await api.adminExecEnvDecision(req.id, false, false)
|
||||
return out.detail || '已拒绝'
|
||||
})}>拒绝</Btn>
|
||||
</span>
|
||||
)}
|
||||
</SettingRow>
|
||||
))}
|
||||
</SettingsGroup>
|
||||
<SettingsGroup title="会话绑定">
|
||||
{(view.bindings ?? []).map(b => (
|
||||
<SettingRow key={b.conversationId} label={b.conversationId} desc={b.isolated ? `隔离 ${b.isolated}` : (b.extensions ?? []).join('、') || '只用基础层'}>
|
||||
<span />
|
||||
</SettingRow>
|
||||
))}
|
||||
<SettingRow label="回收" desc="删掉 7 天内没有会话引用、也不是当前基础层的目录">
|
||||
<Btn variant="ghost" icon="trash" disabled={busy} onClick={() => run(async () => {
|
||||
const out = await api.adminExecEnvGC()
|
||||
const n = out.removed?.length ?? 0
|
||||
return n === 0 ? '没有可回收的层' : `已回收 ${n} 层`
|
||||
})}>回收未引用层</Btn>
|
||||
</SettingRow>
|
||||
</SettingsGroup>
|
||||
<SettingsGroup title="上传 wheel">
|
||||
<SettingRow label="会话" desc="这个 wheel 只挂到指定会话,并进入审批">
|
||||
<input className="lg-input" value={conv} onChange={e => setConv(e.target.value)} placeholder="会话 ID" />
|
||||
</SettingRow>
|
||||
<SettingRow label="理由" desc="写给审批记录">
|
||||
<input className="lg-input" value={reason} onChange={e => setReason(e.target.value)} />
|
||||
</SettingRow>
|
||||
<SettingRow label="文件" desc="只接受预编译 wheel,不执行里面的脚本">
|
||||
<input type="file" accept=".whl" onChange={e => setWheel(e.target.files?.[0] ?? null)} />
|
||||
</SettingRow>
|
||||
<div className="ad-row">
|
||||
<Btn variant="primary" icon="download" disabled={busy || !wheel || !conv.trim()} onClick={() => run(async () => {
|
||||
const out = await api.adminExecEnvWheel(wheel as File, conv.trim(), reason.trim())
|
||||
return `${out.file}:${out.outcome.status}`
|
||||
})}>提交审批</Btn>
|
||||
</div>
|
||||
</SettingsGroup>
|
||||
{notice && <div className="ad-notice"><Icon name="check" size={14} />{notice}</div>}
|
||||
{err && <div className="lg-err"><Icon name="alert" size={14} />{err}</div>}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
+100
-67
@@ -1,9 +1,11 @@
|
||||
// 登录与改密(管理员发放制,R2):
|
||||
// LoginPage —— 用户名+密码(主)/ API 密钥(兼容程序化客户端)双入口;
|
||||
// ChangePasswordGate —— 初始/重置密码后的首登强制改密(不完成不放行)。
|
||||
import { useState } from 'react'
|
||||
import { auth } from '../auth'
|
||||
import { api } from '../api'
|
||||
// 登录与改密(管理员发放制,R2 + 2026-10-13 登录恢复合同):
|
||||
// LoginPage —— 用户名+密码唯一入口;
|
||||
// ChangePasswordGate —— 受限会话强制设密:模式由服务端 passwordChangeMode 派生,
|
||||
// grant_setup 免当前密码(激活/恢复 Key 兑换),one_time_password 免当前密码
|
||||
//(管理员生成的一次性登录密码会话,只需新密码 + 确认),current_required 必须
|
||||
// 校验当前密码(管理员指定/生成的初始密码首登;2026-10-14 后端加固,空 current 会被 401 拒绝)。
|
||||
import { useEffect, useState } from 'react'
|
||||
import { api, type PasswordChangeMode } from '../api'
|
||||
import { Icon, BrandMark } from '@ui'
|
||||
|
||||
function Err({ msg }: { msg: string }) {
|
||||
@@ -28,12 +30,12 @@ function BrandPanel() {
|
||||
)
|
||||
}
|
||||
|
||||
/** 登录页:认证开启(PG 档/–-auth on)时的唯一入口。 */
|
||||
/** 登录页:认证开启(PG 档/–-auth on)时的唯一入口。
|
||||
* 长期 API 密钥(ask_)不再作为浏览器日常登录入口——程序化客户端直接带
|
||||
* Authorization 头;浏览器保存长期密钥属于持久凭据暴露面。 */
|
||||
export function LoginPage({ onAuthed, onMustChange }: { onAuthed: () => void; onMustChange: (owner: string) => void }) {
|
||||
const [tab, setTab] = useState<'password' | 'apikey'>('password')
|
||||
const [owner, setOwner] = useState('')
|
||||
const [password, setPassword] = useState('')
|
||||
const [key, setKey] = useState('')
|
||||
const [err, setErr] = useState('')
|
||||
const [busy, setBusy] = useState(false)
|
||||
|
||||
@@ -41,8 +43,9 @@ export function LoginPage({ onAuthed, onMustChange }: { onAuthed: () => void; on
|
||||
setErr(''); setBusy(true)
|
||||
try {
|
||||
const me = await api.login(owner.trim(), password)
|
||||
if (me.mustChangePassword) {
|
||||
// 初始/重置密码:先完成强制改密再放行。
|
||||
// 受限会话(must-change 首登)或正常会话都由后端 sessionScope 声明;
|
||||
// 受限会话先进设密门,完成前不放行。
|
||||
if (me.sessionScope === 'set_password_only' || me.mustChangePassword) {
|
||||
onMustChange(me.owner)
|
||||
return
|
||||
}
|
||||
@@ -52,73 +55,74 @@ export function LoginPage({ onAuthed, onMustChange }: { onAuthed: () => void; on
|
||||
} finally { setBusy(false) }
|
||||
}
|
||||
|
||||
const submitKey = async () => {
|
||||
setErr(''); setBusy(true)
|
||||
auth.setKey(key)
|
||||
try {
|
||||
const r = await auth.fetch('/api/health')
|
||||
if (r.ok) { onAuthed(); return }
|
||||
throw new Error(String(r.status))
|
||||
} catch {
|
||||
auth.clear()
|
||||
setErr('密钥无效或已撤销,请重试')
|
||||
} finally { setBusy(false) }
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="lg-wrap">
|
||||
<BrandPanel />
|
||||
<div className="lg-formside">
|
||||
<form className="lg-card" onSubmit={e => { e.preventDefault(); tab === 'password' ? submitPassword() : submitKey() }}>
|
||||
<form className="lg-card" onSubmit={e => { e.preventDefault(); submitPassword() }}>
|
||||
<div className="lg-brand"><BrandMark size={26} />Agent-System</div>
|
||||
<h2 className="lg-title">登录</h2>
|
||||
<p className="lg-sub">账号由管理员发放;首次登录需修改初始密码</p>
|
||||
<div className="lg-tabs" role="tablist">
|
||||
<button type="button" role="tab" aria-selected={tab === 'password'} className={`lg-tab ${tab === 'password' ? 'on' : ''}`} onClick={() => setTab('password')}>账号密码</button>
|
||||
<button type="button" role="tab" aria-selected={tab === 'apikey'} className={`lg-tab ${tab === 'apikey' ? 'on' : ''}`} onClick={() => setTab('apikey')}>API 密钥</button>
|
||||
</div>
|
||||
{tab === 'password' ? (
|
||||
<>
|
||||
<label className="lg-label">用户名</label>
|
||||
<input className="lg-input" value={owner} onChange={e => setOwner(e.target.value)} autoFocus autoComplete="username" placeholder="由管理员分配" />
|
||||
<label className="lg-label">密码</label>
|
||||
<input className="lg-input" type="password" value={password} onChange={e => setPassword(e.target.value)} autoComplete="current-password" placeholder="初始密码或常用密码" />
|
||||
<Err msg={err} />
|
||||
<button className="lg-submit" type="submit" disabled={busy || !owner.trim() || !password}>{busy ? '验证中…' : '登录'}</button>
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
<label className="lg-label">API 访问密钥</label>
|
||||
<input className="lg-input lg-mono" value={key} onChange={e => setKey(e.target.value)} autoFocus placeholder="ask_…" />
|
||||
<Err msg={err} />
|
||||
<button className="lg-submit" type="submit" disabled={busy || !key}>{busy ? '验证中…' : '进入'}</button>
|
||||
<p className="lg-hint">密钥由服务端创建:<code>agent-system apikey create --owner <name></code>。程序化客户端也可直接带 Authorization 头。</p>
|
||||
</>
|
||||
)}
|
||||
<p className="lg-sub">账号由管理员发放;忘记密码请联系管理员生成一次性登录密码,使用后须立即改密</p>
|
||||
<label className="lg-label">用户名</label>
|
||||
<input className="lg-input" value={owner} onChange={e => setOwner(e.target.value)} autoFocus autoComplete="username" placeholder="由管理员分配" />
|
||||
<label className="lg-label">密码</label>
|
||||
<input className="lg-input" type="password" value={password} onChange={e => setPassword(e.target.value)} autoComplete="current-password" placeholder="初始密码或常用密码" />
|
||||
<Err msg={err} />
|
||||
<button className="lg-submit" type="submit" disabled={busy || !owner.trim() || !password}>{busy ? '验证中…' : '登录'}</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
/** 强制改密门:初始密码/管理员重置后的首次登录必须完成改密才可进入系统。 */
|
||||
/** current_required 模式必须由用户输入当前密码(后端 CompleteForcedPasswordChecked
|
||||
* 校验);grant_setup(激活/恢复 Key 兑换的受限会话)与 one_time_password
|
||||
*(一次性登录密码会话)免当前密码。 */
|
||||
export function requiresCurrentPassword(mode: PasswordChangeMode | null | undefined): boolean {
|
||||
return mode === 'current_required'
|
||||
}
|
||||
|
||||
/** 设密门只认服务端声明的模式;未知/缺失模式一律拒绝放行。 */
|
||||
export function isPasswordChangeMode(mode: string | null | undefined): mode is PasswordChangeMode {
|
||||
return mode === 'grant_setup' || mode === 'current_required' || mode === 'one_time_password'
|
||||
}
|
||||
|
||||
/** 强制设密门:受限会话必须完成设密。模式不由前端猜测——进门前先经 /api/me
|
||||
* 读取服务端派生的 passwordChangeMode;读取失败或会话不再受限时拒绝放行。 */
|
||||
export function ChangePasswordGate({ owner, onDone, onCancel }: { owner: string; onDone: () => void; onCancel?: () => void }) {
|
||||
const [mode, setMode] = useState<PasswordChangeMode | null>(null)
|
||||
const [current, setCurrent] = useState('')
|
||||
const [next, setNext] = useState('')
|
||||
const [confirm, setConfirm] = useState('')
|
||||
const [err, setErr] = useState('')
|
||||
const [busy, setBusy] = useState(false)
|
||||
const [done, setDone] = useState(false)
|
||||
|
||||
useEffect(() => {
|
||||
let active = true
|
||||
api.me().then(me => {
|
||||
if (!active) return
|
||||
if (me.owner !== owner || me.sessionScope !== 'set_password_only' || !isPasswordChangeMode(me.passwordChangeMode)) {
|
||||
setErr('当前设密凭据不再有效,请重新登录;忘记密码请联系管理员重新生成一次性登录密码。')
|
||||
return
|
||||
}
|
||||
setMode(me.passwordChangeMode)
|
||||
}).catch(() => { if (active) setErr('无法确认当前设密方式,请重新登录。') })
|
||||
return () => { active = false }
|
||||
}, [owner])
|
||||
|
||||
const submit = async () => {
|
||||
setErr('')
|
||||
if (!mode) { setErr('设密方式尚未由服务端确认'); return }
|
||||
if (requiresCurrentPassword(mode) && !current) { setErr('请填写当前密码'); return }
|
||||
if (next !== confirm) { setErr('两次输入的新密码不一致'); return }
|
||||
if (next.length < 8) { setErr('新密码至少 8 位'); return }
|
||||
setBusy(true)
|
||||
try {
|
||||
await api.changePassword(current, next)
|
||||
onDone()
|
||||
await api.changePassword(requiresCurrentPassword(mode) ? current : '', next)
|
||||
setDone(true)
|
||||
} catch (e) {
|
||||
setErr(humanLoginError(String(e)).replace('401: ', ''))
|
||||
setErr(humanChangePasswordError(String(e)))
|
||||
} finally { setBusy(false) }
|
||||
}
|
||||
|
||||
@@ -126,29 +130,58 @@ export function ChangePasswordGate({ owner, onDone, onCancel }: { owner: string;
|
||||
<div className="lg-wrap">
|
||||
<BrandPanel />
|
||||
<div className="lg-formside">
|
||||
<form className="lg-card" onSubmit={e => { e.preventDefault(); submit() }}>
|
||||
<div className="lg-brand"><BrandMark size={26} />Agent-System</div>
|
||||
<h2 className="lg-title">修改密码</h2>
|
||||
<p className="lg-sub">账号 <b>{owner}</b> 使用初始/重置密码首次登录,须设置新密码后继续</p>
|
||||
<label className="lg-label">当前密码(初始/重置密码)</label>
|
||||
<input className="lg-input" type="password" value={current} onChange={e => setCurrent(e.target.value)} autoFocus autoComplete="current-password" />
|
||||
<label className="lg-label">新密码(≥8 位)</label>
|
||||
<input className="lg-input" type="password" value={next} onChange={e => setNext(e.target.value)} autoComplete="new-password" />
|
||||
<label className="lg-label">确认新密码</label>
|
||||
<input className="lg-input" type="password" value={confirm} onChange={e => setConfirm(e.target.value)} autoComplete="new-password" />
|
||||
<Err msg={err} />
|
||||
<button className="lg-submit" type="submit" disabled={busy || !current || !next || !confirm}>{busy ? '提交中…' : '设置新密码并进入'}</button>
|
||||
{onCancel && <button type="button" className="lg-cancel" onClick={onCancel}>返回登录</button>}
|
||||
</form>
|
||||
{done ? (
|
||||
<form className="lg-card" onSubmit={e => { e.preventDefault(); onDone() }}>
|
||||
<div className="lg-brand"><BrandMark size={26} />Agent-System</div>
|
||||
<h2 className="lg-title">密码已更新</h2>
|
||||
<p className="lg-sub">请使用新密码重新登录账号 <b>{owner}</b></p>
|
||||
<button className="lg-submit" type="submit">返回登录</button>
|
||||
</form>
|
||||
) : (
|
||||
<form className="lg-card" onSubmit={e => { e.preventDefault(); submit() }}>
|
||||
<div className="lg-brand"><BrandMark size={26} />Agent-System</div>
|
||||
<h2 className="lg-title">设置新密码</h2>
|
||||
<p className="lg-sub">账号 <b>{owner}</b>(服务端确认)须设置新密码后继续</p>
|
||||
{mode === 'current_required' && <>
|
||||
<p className="lg-hint">首次登录必须更换初始密码;「当前密码」填写刚才登录用的初始密码。</p>
|
||||
<label className="lg-label" htmlFor="forced-current">当前密码</label>
|
||||
<input id="forced-current" className="lg-input" type="password" value={current}
|
||||
onChange={e => setCurrent(e.target.value)} autoComplete="current-password" />
|
||||
</>}
|
||||
{mode === 'grant_setup' && <p className="lg-hint">身份经可信激活/恢复能力确认,此次无需输入当前密码。</p>}
|
||||
{mode === 'one_time_password' && <p className="lg-hint">你正在使用管理员生成的一次性登录密码登录,请直接设置新密码,无需再次输入一次性密码。</p>}
|
||||
<label className="lg-label">新密码(≥8 位)</label>
|
||||
<input className="lg-input" type="password" value={next} onChange={e => setNext(e.target.value)} autoFocus autoComplete="new-password" />
|
||||
<label className="lg-label">确认新密码</label>
|
||||
<input className="lg-input" type="password" value={confirm} onChange={e => setConfirm(e.target.value)} autoComplete="new-password" />
|
||||
<Err msg={err} />
|
||||
<button className="lg-submit" type="submit" disabled={busy || !mode || (requiresCurrentPassword(mode) && !current) || !next || !confirm}>{busy ? '提交中…' : '设置新密码'}</button>
|
||||
{onCancel && <button type="button" className="lg-cancel" onClick={onCancel}>退出并返回登录</button>}
|
||||
</form>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
/** 错误文案:把 HTTP 状态码翻成人话。 */
|
||||
/** 登录错误文案:把 HTTP 状态码翻成人话。 */
|
||||
export function humanLoginError(raw: string): string {
|
||||
if (raw.includes('401')) return '用户名或密码不正确'
|
||||
if (raw.includes('429')) return '失败次数过多,请稍后再试'
|
||||
if (raw.includes('412')) return '本服务未开启登录(嵌入式单租户档)'
|
||||
return raw.replace(/^\d{3}:\s*/, '')
|
||||
}
|
||||
|
||||
/** 改密门错误文案:改密的 401 有多种真实原因(会话过期/并发失效/退避),
|
||||
* 不能沿用登录的「用户名或密码不正确」一刀切。
|
||||
* 后端文案是现行 HTTP 契约的一部分,这里按其区分并用测试锁定。 */
|
||||
export function humanChangePasswordError(raw: string): string {
|
||||
if (raw.includes('current password incorrect')) return '当前密码不正确'
|
||||
if (raw.includes('session login required')) return '请先用账号密码登录再改密(API 密钥不能修改密码)'
|
||||
if (raw.includes('session expired')) return '会话已过期,请重新登录'
|
||||
if (raw.includes('credentials changed concurrently')) return '登录状态已变化(密码在其他地方被更新),请重新登录'
|
||||
if (raw.includes('invalid or revoked API key')) return '本地残留的 API 密钥已失效,请退出登录后重试'
|
||||
if (raw.includes('429')) return '失败次数过多,请稍后再试'
|
||||
if (raw.includes('401')) return '认证失败,请重新登录'
|
||||
return raw.replace(/^\d{3}:\s*/, '')
|
||||
}
|
||||
|
||||
@@ -0,0 +1,8 @@
|
||||
/** Stable server time, with the full local date available to keyboard and assistive readers. */
|
||||
export function MessageTimestamp({ value }: { value?: string }) {
|
||||
const date = value ? new Date(value) : null
|
||||
if (!date || !Number.isFinite(date.getTime())) return null
|
||||
const full = date.toLocaleString('zh-CN', { year: 'numeric', month: '2-digit', day: '2-digit', hour: '2-digit', minute: '2-digit', second: '2-digit', hour12: false })
|
||||
const label = date.toLocaleTimeString('zh-CN', { hour: '2-digit', minute: '2-digit', hour12: false })
|
||||
return <time className="message-timestamp" dateTime={date.toISOString()} title={full} aria-label={full}>{label}</time>
|
||||
}
|
||||
@@ -0,0 +1,64 @@
|
||||
// 我的账号(设置 → 账号):可选资料编辑 + 忘记密码指引。忘记密码只有一个处置:
|
||||
// 由管理员生成一次性登录密码,用户用它登录后进入强制改密门,设置新密码才放行。
|
||||
import { useEffect, useRef, useState } from 'react'
|
||||
import { api, type AccountProfile, type AccountRecord } from '../api'
|
||||
import { useStore } from '../store'
|
||||
import { Collapsible, Icon, SettingsGroup } from '@ui'
|
||||
|
||||
const fields: { key: keyof AccountProfile; label: string }[] = [
|
||||
{ key: 'name', label: '姓名' }, { key: 'phone', label: '电话' }, { key: 'email', label: '邮箱' },
|
||||
{ key: 'staffNo', label: '工号' }, { key: 'department', label: '部门' }, { key: 'notes', label: '备注' },
|
||||
]
|
||||
|
||||
export function MyAccountSettings() {
|
||||
const me = useStore(s => s.me)
|
||||
const [account, setAccount] = useState<AccountRecord | null>(null)
|
||||
const [draft, setDraft] = useState<AccountProfile | null>(null)
|
||||
const [err, setErr] = useState('')
|
||||
const [notice, setNotice] = useState('')
|
||||
const [busy, setBusy] = useState(false)
|
||||
const sequence = useRef(0)
|
||||
|
||||
useEffect(() => {
|
||||
if (!me?.auth) return
|
||||
const seq = ++sequence.current
|
||||
api.meProfile().then(profile => {
|
||||
if (seq !== sequence.current) return
|
||||
setAccount(profile); setDraft(profile.profile)
|
||||
}).catch(error => { if (seq === sequence.current) setErr(String(error)) })
|
||||
return () => { sequence.current++ }
|
||||
}, [me?.owner, me?.auth])
|
||||
|
||||
if (!me?.auth) return null
|
||||
|
||||
const save = async () => {
|
||||
if (!account || !draft) return
|
||||
const patch: Partial<AccountProfile> = {}
|
||||
for (const field of fields) if (draft[field.key] !== account.profile[field.key]) patch[field.key] = draft[field.key]
|
||||
if (Object.keys(patch).length === 0) { setNotice('资料没有变化'); return }
|
||||
setBusy(true); setErr(''); setNotice('')
|
||||
try {
|
||||
const updated = await api.patchMeProfile(account.profileVersion, patch)
|
||||
setAccount(updated); setDraft(updated.profile); setNotice('个人资料已保存')
|
||||
} catch (error) { setErr(String(error).includes('409') ? '资料版本已变化,请关闭设置后重新打开' : String(error)) }
|
||||
finally { setBusy(false) }
|
||||
}
|
||||
|
||||
return <SettingsGroup title="我的账号">
|
||||
{account && draft ? <>
|
||||
<p className="ad-hint">登录名 {account.owner} · userId {account.userId}。以下资料均可留空。</p>
|
||||
<Collapsible id={`my-profile-${account.userId}`} trigger="编辑可选资料">
|
||||
<div className="ad-create">{fields.map(field => <div className="ad-row" key={field.key}>
|
||||
<label className="lg-label" htmlFor={`my-profile-${field.key}`}>{field.label}(可空)</label>
|
||||
<input id={`my-profile-${field.key}`} className="lg-input" value={draft[field.key]}
|
||||
onChange={event => setDraft({ ...draft, [field.key]: event.target.value })} />
|
||||
</div>)}
|
||||
<button className="lg-submit ad-create-btn" disabled={busy} onClick={save}>保存我的资料</button></div>
|
||||
</Collapsible>
|
||||
</> : <p className="ad-hint">使用完整密码会话后可查看和修改个人资料。</p>}
|
||||
|
||||
<p className="ad-hint">忘记密码:请联系管理员生成一次性登录密码。用它登录后必须立即设置新密码(强制改密);生成后原密码仍可正常登录,用原密码登录会使未使用的一次性登录密码作废。</p>
|
||||
{notice && <div className="ad-notice"><Icon name="check" size={14} />{notice}</div>}
|
||||
{err && <div className="lg-err" role="alert"><Icon name="alert" size={14} />{err}</div>}
|
||||
</SettingsGroup>
|
||||
}
|
||||
@@ -1,16 +1,74 @@
|
||||
// 对话右侧预览区:多标签、可关、全屏与下载。宽度由 App 的分隔条控制。
|
||||
import { FilePreview, TabStrip, Icon } from '@ui'
|
||||
// 第三栏「文件」入口的多标签预览:打开/切换/关闭标签、编辑保存、展开铺满与下载。
|
||||
// 列表 ⇄ 预览在同一入口内切换;宽度档(阅读档 420–1100)由 App 的分隔条控制。
|
||||
import { useEffect, useState } from 'react'
|
||||
import { Btn, FilePreview, Icon, SurfaceView, TabStrip } from '@ui'
|
||||
import { api } from '../api'
|
||||
import type { Artifact } from '../contracts'
|
||||
import { humanSize } from '../messageparts'
|
||||
import { previewTabsKey } from '../previewtabs'
|
||||
import { store, useStore } from '../store'
|
||||
import { surfaceKey } from '../surfaceKey'
|
||||
|
||||
export function PreviewPane() {
|
||||
const convId = useStore(s => s.currentConvId)
|
||||
const tabs = useStore(s => (convId ? s.previewTabs[convId] : undefined) ?? [])
|
||||
const activeId = useStore(s => (convId ? s.previewActive[convId] : null) ?? null)
|
||||
// 键口径与 requestPreview 一致(previewTabsKey):空态预览也渲染。
|
||||
const tabs = useStore(s => s.previewTabs[previewTabsKey(s.currentConvId)] ?? [])
|
||||
const activeId = useStore(s => s.previewActive[previewTabsKey(s.currentConvId)] ?? null)
|
||||
const artifacts = useStore(s => s.artifacts)
|
||||
const expanded = useStore(s => s.ui.previewExpanded)
|
||||
const active = tabs.find(t => t.id === activeId) ?? tabs[0]
|
||||
const surfaces = useStore(s => s.surfaces)
|
||||
const surfaceSnap = active?.id.startsWith('surface:')
|
||||
? surfaces.find(x => {
|
||||
const id = surfaceKey(x)
|
||||
return id != null && 'surface:' + id === active.id
|
||||
})
|
||||
: undefined
|
||||
const art = active ? artifacts.find(a => a.id === active.id) : undefined
|
||||
const textKind = !!art && isTextKind(art)
|
||||
const [content, setContent] = useState<string | null>(null)
|
||||
const [editing, setEditing] = useState(false)
|
||||
const [dirty, setDirty] = useState(false)
|
||||
|
||||
useEffect(() => {
|
||||
setEditing(false)
|
||||
setDirty(false)
|
||||
setContent(null)
|
||||
if (!art || !isTextKind(art)) return
|
||||
let cancelled = false
|
||||
fetch(api.artifactContentUrl(art.id))
|
||||
.then(r => r.text())
|
||||
.then(text => { if (!cancelled) setContent(text) })
|
||||
.catch(() => { if (!cancelled) setContent('(读取失败)') })
|
||||
return () => { cancelled = true }
|
||||
}, [art?.id])
|
||||
|
||||
if (!active) return null
|
||||
const art = artifacts.find(a => a.id === active.id)
|
||||
if (active.id.startsWith('surface:')) {
|
||||
return (
|
||||
<div className="preview-pane">
|
||||
<TabStrip
|
||||
tabs={tabs.map(t => ({ id: t.id, label: t.name }))}
|
||||
activeId={active.id}
|
||||
onActivate={id => store.activatePreview(id)}
|
||||
onClose={id => store.closePreview(id)}
|
||||
/>
|
||||
<div className="preview-pane-bar">
|
||||
<button type="button" className="icon-btn" title="返回文件列表" onClick={() => store.setUI({ filesView: 'list', previewExpanded: false })}>
|
||||
<Icon name="list" size={14} />
|
||||
</button>
|
||||
<span className="preview-pane-name" title={active.name}>{active.name}</span>
|
||||
</div>
|
||||
<div className="preview-pane-body">
|
||||
{surfaceSnap
|
||||
? <SurfaceView snapshot={surfaceSnap} onAction={id => store.handleSurfaceAction(surfaceKey(surfaceSnap) ?? '', id, {})} docBridge={{ onOpenDoc: docId => {
|
||||
const art = artifacts.find(a => a.id === docId)
|
||||
if (art) store.requestPreview(art)
|
||||
} }} />
|
||||
: <p className="surface-view-empty">页面快照不可用(可能已被移除或无权限)。</p>}
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
return (
|
||||
<div className="preview-pane">
|
||||
<TabStrip
|
||||
@@ -20,12 +78,29 @@ export function PreviewPane() {
|
||||
onClose={id => store.closePreview(id)}
|
||||
/>
|
||||
<div className="preview-pane-bar">
|
||||
<button type="button" className="icon-btn" title="返回文件列表" onClick={() => store.setUI({ filesView: 'list', previewExpanded: false })}>
|
||||
<Icon name="list" size={14} />
|
||||
</button>
|
||||
<span className="preview-pane-name" title={active.name}>{active.name}</span>
|
||||
{art && (
|
||||
<span className="preview-pane-meta">{art.kind}{humanSize(art.size) ? ` · ${humanSize(art.size)}` : ''}</span>
|
||||
)}
|
||||
<span className="preview-pane-spacer" />
|
||||
{art && (
|
||||
<>
|
||||
<button type="button" className="icon-btn" title="全屏预览" onClick={() => store.requestPreview(art, 'full')}>
|
||||
<Icon name="eye" size={14} />
|
||||
{dirty && <span className="preview-pane-dirty">未保存</span>}
|
||||
{textKind && (
|
||||
<>
|
||||
<Btn variant="ghost" icon={editing ? 'eye' : 'list'} onClick={() => setEditing(e => !e)}>{editing ? '预览' : '编辑'}</Btn>
|
||||
{editing && <Btn variant="primary" icon="check" disabled={!dirty} onClick={async () => {
|
||||
await api.saveArtifactContent(art.id, content ?? '')
|
||||
setDirty(false)
|
||||
store.toast('已保存')
|
||||
}}>保存</Btn>}
|
||||
</>
|
||||
)}
|
||||
<button type="button" className="icon-btn" title={expanded ? '还原预览' : '展开预览'} aria-pressed={expanded} onClick={() => store.togglePreviewExpanded()}>
|
||||
<Icon name={expanded ? 'minimize' : 'maximize'} size={14} />
|
||||
</button>
|
||||
<a className="icon-btn" title="下载" href={api.artifactDownloadUrl(art.id)} download={art.name}>
|
||||
<Icon name="download" size={14} />
|
||||
@@ -34,7 +109,10 @@ export function PreviewPane() {
|
||||
)}
|
||||
</div>
|
||||
<div className="preview-pane-body">
|
||||
{art ? (
|
||||
{editing && textKind ? (
|
||||
<textarea className="search-input preview-pane-editor" value={content ?? ''}
|
||||
onChange={e => { setContent(e.target.value); setDirty(true) }} />
|
||||
) : art ? (
|
||||
<FilePreview source={{
|
||||
kind: 'artifact',
|
||||
id: art.id,
|
||||
@@ -48,3 +126,7 @@ export function PreviewPane() {
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
function isTextKind(a: Artifact): boolean {
|
||||
return a.kind === 'document' && /\.(md|txt|csv|log|json)$/i.test(a.name)
|
||||
}
|
||||
|
||||
@@ -1,10 +1,9 @@
|
||||
// 工作时间线:思考、对用户的解说、同类工具合并成一行。运行中展开;
|
||||
// 终轮结束后由调用方套进「已工作 X」折叠。
|
||||
// 执行记录按工作动作分组;展开状态由调用方控制。
|
||||
import type { ReactNode } from 'react'
|
||||
import { Collapsible } from '@ui'
|
||||
import { Collapsible, ToolBlock } from '@ui'
|
||||
import type { Part } from '../contracts'
|
||||
import { formatDuration } from '../messageparts'
|
||||
import { timelineEntries, toolGroupLabel } from '../toolkind'
|
||||
import { formatDuration, humanSize } from '../messageparts'
|
||||
import { timelineEntries, toolGroupLabel, type ToolGroupItem } from '../toolkind'
|
||||
|
||||
export function ProcessTimeline({ parts, live, idKey, renderPart }: {
|
||||
parts: Part[]
|
||||
@@ -17,22 +16,21 @@ export function ProcessTimeline({ parts, live, idKey, renderPart }: {
|
||||
<div className="tl">
|
||||
{rows.map((row, i) => {
|
||||
if (row.kind === 'thinking') {
|
||||
const dur = formatDuration(row.durationMs)
|
||||
const label = row.active ? '思考中' : (dur ? `思考 · 持续了 ${dur}` : '思考')
|
||||
return (
|
||||
<div className="part-thinking" key={`${idKey}:th:${i}`}>
|
||||
<Collapsible id={`think:${idKey}:${i}:${row.active ? 'live' : 'done'}`} defaultOpen={row.active} key={row.active ? 'open' : 'shut'}
|
||||
triggerClassName="part-thinking-summary"
|
||||
trigger={<><span className="part-thinking-chev">▸</span>
|
||||
<span className={row.active ? 'mk-sweep' : ''}>{label}</span></>}>
|
||||
<div className="part-thinking-body">{row.text}</div>
|
||||
</Collapsible>
|
||||
</div>
|
||||
)
|
||||
return row.text && <div className="tl-thinking" key={`${idKey}:th:${i}`}>
|
||||
<span className="tl-thinking-label">思考过程</span>
|
||||
<div className="tl-thinking-body">{row.text}</div>
|
||||
</div>
|
||||
}
|
||||
if (row.kind === 'text') {
|
||||
return <div className="part" key={`${idKey}:tx:${i}`}>{renderPart({ type: 'text', text: row.text }, false)}</div>
|
||||
}
|
||||
if (row.kind === 'check') {
|
||||
const text = row.passed ? '终轮检查通过' : `终轮检查未通过:${row.reason}`
|
||||
return <div className="tl-check" key={`${idKey}:ck:${i}`}>{text}</div>
|
||||
}
|
||||
if (row.kind === 'toolblock') {
|
||||
return <ToolCallBlock key={`${idKey}:tb:${i}`} item={row.item} />
|
||||
}
|
||||
if (row.kind === 'tools') {
|
||||
const running = row.items.some(it => it.running)
|
||||
return (
|
||||
@@ -44,6 +42,11 @@ export function ProcessTimeline({ parts, live, idKey, renderPart }: {
|
||||
<span className="tl-tools-name">{it.headline}</span>
|
||||
{it.status === 'error' && <span className="status-error">失败</span>}
|
||||
{it.summary && <span className="tl-tools-sum">{it.summary}</span>}
|
||||
{(it.arguments || it.output) && <Collapsible id={`tool-record:${idKey}:${it.id}:${j}`}
|
||||
triggerClassName="tl-tool-detail" trigger={<span>查看记录 ▸</span>}>
|
||||
{it.arguments && <pre className="tool-preview">{it.arguments}</pre>}
|
||||
{it.output && <pre className="tool-preview">{it.output}</pre>}
|
||||
</Collapsible>}
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
@@ -55,3 +58,31 @@ export function ProcessTimeline({ parts, live, idKey, renderPart }: {
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
function sizeLabel(n: number): string {
|
||||
if (n < 1024) return `${n} 字符`
|
||||
return humanSize(n)
|
||||
}
|
||||
|
||||
function ToolCallBlock({ item }: { item: ToolGroupItem }) {
|
||||
const composing = item.phase === 'composing'
|
||||
const dur = !item.running ? formatDuration(item.durationMs) : ''
|
||||
const detail = composing ? undefined : (dur ? `${item.headline} · ${dur}` : item.headline)
|
||||
return (
|
||||
<div className="tl-toolblock">
|
||||
<ToolBlock
|
||||
toolId={item.id}
|
||||
name={item.name}
|
||||
detail={detail}
|
||||
running={item.running}
|
||||
status={item.status}
|
||||
statusText={composing ? `编写中 · ${sizeLabel(item.arguments?.length ?? 0)}` : undefined}
|
||||
statusDetail={item.summary}
|
||||
autoCollapseOnComplete
|
||||
>
|
||||
{item.arguments && <pre className="tool-preview">{item.arguments}</pre>}
|
||||
{item.output && <pre className="tool-preview">{item.output}</pre>}
|
||||
</ToolBlock>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -7,25 +7,42 @@ import { store, useStore } from '../store'
|
||||
import type { SettingDesc } from '../contracts'
|
||||
import { SettingsShell, Btn, EmptyState } from '@ui'
|
||||
import { SettingInput, flatten, unflatten, groupNames } from './SettingsModal'
|
||||
import { RdmMembersSection, RdmDutiesSection, RdmPermMatrixSection } from './adminRdmSections'
|
||||
import { rdmProjectReadError } from '../rdmManagement'
|
||||
import { projectActionError, projectWorkError } from '../projectmeta'
|
||||
|
||||
export function ProjectSettingsModal() {
|
||||
const projectId = useStore(s => s.ui.projectSettingsId)
|
||||
const projects = useStore(s => s.projects)
|
||||
const project = projects.find(p => p.id === projectId)
|
||||
const rdmMembersAvailable = useStore(s => s.rdmMembersAvailable)
|
||||
const rdmDocReviewAvailable = useStore(s => s.rdmDocReviewAvailable)
|
||||
const rdmPermMatrixAvailable = useStore(s => s.rdmPermMatrixAvailable)
|
||||
const owner = useStore(s => s.me?.owner)
|
||||
const isAdmin = useStore(s => s.me?.isAdmin ?? false)
|
||||
// P1-B 裁定:宿主覆盖设置(含模型与密钥)仅项目负责人/系统管理员可查看与修改;
|
||||
// RDM 页签(成员/文档职责/项目权限)不在此列——数据面由 RDM 权限自行收敛,
|
||||
// 授权的职责管理者仍可进入。
|
||||
const projectPrivileged = !!project && (project.owner === owner || isAdmin)
|
||||
const [tab, setTab] = useState('project')
|
||||
const [schema, setSchema] = useState<SettingDesc[]>([])
|
||||
const [draft, setDraft] = useState<Record<string, any>>({})
|
||||
const [loaded, setLoaded] = useState(false)
|
||||
const [saved, setSaved] = useState(false)
|
||||
const [error, setError] = useState('')
|
||||
|
||||
useEffect(() => {
|
||||
if (!projectId) return
|
||||
setLoaded(false)
|
||||
let active = true
|
||||
setLoaded(false); setSaved(false); setError(''); setDraft({}); setSchema([])
|
||||
api.getSettings(projectId).then(s => {
|
||||
if (!active) return
|
||||
setSchema(s.schema)
|
||||
setDraft(flatten(s.project))
|
||||
setLoaded(true)
|
||||
}).catch(() => undefined)
|
||||
}, [projectId])
|
||||
}).catch(() => { if (active) setError('项目设置未能加载,请关闭后重新打开或联系项目负责人') })
|
||||
return () => { active = false }
|
||||
}, [projectId, owner])
|
||||
|
||||
const groups = useMemo(() => {
|
||||
const g: Record<string, SettingDesc[]> = {}
|
||||
@@ -34,34 +51,51 @@ export function ProjectSettingsModal() {
|
||||
}, [schema])
|
||||
|
||||
if (!projectId) return null
|
||||
const rdmError = rdmProjectReadError(project)
|
||||
const writeError = projectWorkError(project)
|
||||
const rdmTab = tab === 'members' || tab === 'duties' || tab === 'matrix'
|
||||
|
||||
const save = async () => {
|
||||
if (!projectId) return
|
||||
if (writeError) { store.toast(writeError); return }
|
||||
try {
|
||||
await api.putProjectSettings(projectId, unflatten(draft))
|
||||
setSaved(true)
|
||||
setTimeout(() => setSaved(false), 1500)
|
||||
} catch (e) {
|
||||
store.toast(`项目设置保存失败:${e}`)
|
||||
store.toast(`项目设置保存失败:${projectActionError(e)}`)
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<SettingsShell
|
||||
title={`项目设置 · ${project?.name ?? projectId}`}
|
||||
active="project"
|
||||
onSelect={() => undefined}
|
||||
active={tab}
|
||||
onSelect={setTab}
|
||||
onClose={() => store.openProjectSettings(null)}
|
||||
sections={[{ key: 'project', label: '本项目', icon: 'folder' }]}
|
||||
footer={saved ? <span style={{ color: 'var(--ok)' }}>✓ 已保存</span> : '项目设置覆盖用户设置(new-run 类对新任务生效)'}
|
||||
sections={[
|
||||
{ key: 'project', label: '本项目', icon: 'folder' },
|
||||
// U6/KTD5:成员与文档职责页签按 RDM 命令面门控(普通基座不出现)。
|
||||
...(rdmMembersAvailable ? [{ key: 'members', label: '成员', icon: 'users' as const }] : []),
|
||||
...(rdmDocReviewAvailable ? [{ key: 'duties', label: '文档职责', icon: 'shield' as const }] : []),
|
||||
...(rdmPermMatrixAvailable ? [{ key: 'matrix', label: '项目权限', icon: 'key' as const }] : []),
|
||||
]}
|
||||
footer={saved ? <span style={{ color: 'var(--ok-text)' }}>✓ 已保存</span> : '项目设置覆盖用户设置(new-run 类对新任务生效)'}
|
||||
>
|
||||
<div>
|
||||
{!loaded ? (
|
||||
<EmptyState icon="settings">加载中…</EmptyState>
|
||||
) : (
|
||||
{rdmTab && rdmError ? <EmptyState icon="folder">{rdmError}</EmptyState> : project && <>
|
||||
{tab === 'members' && <RdmMembersSection key={project.id} project={project} />}
|
||||
{tab === 'duties' && <RdmDutiesSection key={project.id} project={project} />}
|
||||
{tab === 'matrix' && <RdmPermMatrixSection key={project.id} project={project} />}
|
||||
</>}
|
||||
{tab !== 'members' && tab !== 'duties' && tab !== 'matrix' && !loaded ? (
|
||||
<EmptyState icon="settings">{error || '加载中…'}</EmptyState>
|
||||
) : tab !== 'members' && tab !== 'duties' && tab !== 'matrix' && !projectPrivileged ? (
|
||||
<EmptyState icon="settings">项目覆盖设置(含模型与密钥)仅项目负责人或系统管理员可查看与修改。</EmptyState>
|
||||
) : tab !== 'members' && tab !== 'duties' && tab !== 'matrix' ? (
|
||||
<>
|
||||
<div className="empty-note" style={{ marginBottom: 10 }}>
|
||||
此处仅保存本项目的覆盖值;留空即沿用用户/系统设置。跨会话读取在「会话协作」组。
|
||||
{writeError ?? '此处仅保存本项目的覆盖值;留空即沿用用户/系统设置。跨会话读取在「会话协作」组。'}
|
||||
</div>
|
||||
{Object.entries(groups).map(([g, descs]) => (
|
||||
<div className="settings-group" key={g}>
|
||||
@@ -77,9 +111,9 @@ export function ProjectSettingsModal() {
|
||||
))}
|
||||
</div>
|
||||
))}
|
||||
<Btn variant="primary" icon="check" onClick={save}>保存项目设置</Btn>
|
||||
<Btn variant="primary" icon="check" disabled={!!writeError} onClick={save}>保存项目设置</Btn>
|
||||
</>
|
||||
)}
|
||||
) : null}
|
||||
</div>
|
||||
</SettingsShell>
|
||||
)
|
||||
|
||||
@@ -0,0 +1,655 @@
|
||||
// U4:项目追溯审计工作区(四入口)——消费 U3 rdm.inspect.* 命令面。
|
||||
// 只读:审批/确认关系仍回原业务流程(D31:弹层不是唯一路径)。
|
||||
// 令牌驱动(DESIGN.md):颜色/字号/圆角仅消费 @ui/tokens.css;折叠用 Collapsible。
|
||||
import { useCallback, useEffect, useRef, useState } from 'react'
|
||||
import { api } from '../api'
|
||||
import { Chip, Collapsible, EmptyState, SectionLabel } from '@ui'
|
||||
import { classifyRdmError } from '../rdmErrors'
|
||||
import { store, useStore } from '../store'
|
||||
import { exportNeedsDraft } from '../workspaces'
|
||||
|
||||
// ---- 类型(U3 ListShell/详情的精简前端契约) ----
|
||||
|
||||
interface InspectProject { projectId: string; name: string; canAudit: boolean }
|
||||
interface Capabilities { actor: string; projects: InspectProject[]; crossProject: boolean }
|
||||
interface CoverageItem { face: string; reason: string }
|
||||
interface ListShell<T = any> { items: T[]; nextCursor?: string; hasMore: boolean; truncated: boolean; coverage?: CoverageItem[] }
|
||||
interface SummaryData { projectId: string; counts: Record<string, number>; watermark: number; lastOpAt: string; coverage?: CoverageItem[] }
|
||||
interface TreeItem { kind: string; id: string; title: string; state?: string }
|
||||
interface RelationEntry { layer: string; edgeId?: string; kind?: string; type?: string; state: string; depth?: number; from: any; to: any; conf?: number }
|
||||
interface EventDTO { seq: number; at: string; op: string; actor: string; source: string; target: { kind: string; id: string }; detail: string; operationId: string; disclosure: string }
|
||||
interface OpGroup { operationId: string; actor: string; at: string; events: EventDTO[] }
|
||||
interface ObjectDetail { kind: string; id: string; title?: string; state?: string; versions?: any[]; formal?: any; labels?: any; batch?: string; ver?: number; relations: RelationEntry[]; recentEvents: EventDTO[]; coverage?: CoverageItem[] }
|
||||
interface HistoryData { projectId: string; watermark: number; atSeq: number; object?: any; formal?: any; formalMissing?: string; countOnlySnapshots?: number; coverage?: CoverageItem[]; empty?: boolean }
|
||||
|
||||
// ---- 工作区主组件 ----
|
||||
|
||||
const TABS = [
|
||||
{ id: 'summary', label: '概览' },
|
||||
{ id: 'materials', label: '资料与文档' },
|
||||
{ id: 'trace', label: '关联追溯' },
|
||||
{ id: 'timeline', label: '操作记录' },
|
||||
] as const
|
||||
type TabId = (typeof TABS)[number]['id']
|
||||
|
||||
/** 错误态(增量 2):分类文案(能力缺失/登录失效/查询失败)+ 原始回执折叠供诊断;
|
||||
* 「无可审计项目」由调用处独立空态承担,不走本组件。 */
|
||||
function RdmErrorState({ raw }: { raw: string }) {
|
||||
const c = classifyRdmError(raw)
|
||||
return (
|
||||
<div className="rdm-audit-err">
|
||||
<EmptyState icon="alert">{c.message}</EmptyState>
|
||||
<Collapsible id="rdm-audit-err-receipt" trigger={<span className="rdm-audit-err-toggle">原始回执</span>}>
|
||||
<code className="rdm-audit-err-raw">{raw}</code>
|
||||
</Collapsible>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export function RdmAuditWorkspace() {
|
||||
const identity = useStore(() => store.getIdentityEpoch())
|
||||
const [caps, setCaps] = useState<Capabilities | null>(null)
|
||||
const [capsIdentity, setCapsIdentity] = useState(-1)
|
||||
const [pid, setPid] = useState('')
|
||||
const [tab, setTab] = useState<TabId>('summary')
|
||||
const [error, setError] = useState('')
|
||||
|
||||
useEffect(() => {
|
||||
let cancelled = false
|
||||
setCaps(null); setPid(''); setError('')
|
||||
api.rdmCommand<Capabilities>('rdm.inspect.capabilities')
|
||||
.then(c => {
|
||||
if (cancelled || identity !== store.getIdentityEpoch()) return
|
||||
setCaps(c); setCapsIdentity(identity)
|
||||
if (c.projects.length > 0) setPid(c.projects[0].projectId)
|
||||
})
|
||||
.catch(e => { if (!cancelled && identity === store.getIdentityEpoch()) setError(e.message) })
|
||||
return () => { cancelled = true }
|
||||
}, [identity])
|
||||
|
||||
const project = caps?.projects.find(p => p.projectId === pid)
|
||||
const exportOn = useStore(s => s.rdmExportAvailable)
|
||||
if (error) return <RdmErrorState raw={error} />
|
||||
if (!caps || capsIdentity !== identity) return <div className="empty-note">加载中…</div>
|
||||
if (caps.projects.length === 0) return <EmptyState icon="folder">无可见研发项目——项目创建者与域管理员可查看追溯审计</EmptyState>
|
||||
|
||||
return (
|
||||
<div className="rdm-audit">
|
||||
<div className="rdm-audit-header">
|
||||
<select className="ui-input rdm-audit-project" value={pid} onChange={e => setPid(e.target.value)} aria-label="选择项目">
|
||||
{caps.projects.map(p => (
|
||||
<option key={p.projectId} value={p.projectId}>{p.name}</option>
|
||||
))}
|
||||
</select>
|
||||
{project?.canAudit && <Chip tone="ok">可审计</Chip>}
|
||||
{caps.crossProject && <Chip tone="info">跨项目</Chip>}
|
||||
</div>
|
||||
<div className="tabs rdm-audit-tabs" role="tablist">
|
||||
{TABS.map(t => (
|
||||
<button key={t.id} role="tab" aria-selected={tab === t.id}
|
||||
className={`tab${tab === t.id ? ' active' : ''}`}
|
||||
onClick={() => setTab(t.id)}>{t.label}</button>
|
||||
))}
|
||||
</div>
|
||||
<div className="rdm-audit-body">
|
||||
{tab === 'summary' && <SummaryTab pid={pid} exportOn={exportOn} />}
|
||||
{tab === 'materials' && <MaterialsTab pid={pid} />}
|
||||
{tab === 'trace' && <TraceTab pid={pid} />}
|
||||
{tab === 'timeline' && <TimelineTab pid={pid} />}
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
// ---- 概览 ----
|
||||
|
||||
function SummaryTab({ pid, exportOn }: { pid: string; exportOn: boolean }) {
|
||||
const [data, setData] = useState<SummaryData | null>(null)
|
||||
const [err, setErr] = useState('')
|
||||
useEffect(() => {
|
||||
let c = false
|
||||
setData(null); setErr('')
|
||||
api.rdmCommand<SummaryData>('rdm.inspect.summary', { projectId: pid })
|
||||
.then(d => { if (!c) setData(d) })
|
||||
.catch(e => { if (!c) setErr(e.message) })
|
||||
return () => { c = true }
|
||||
}, [pid])
|
||||
if (err) return <RdmErrorState raw={err} />
|
||||
if (!data) return <div className="empty-note">加载中…</div>
|
||||
const counts = data.counts || {}
|
||||
const entries: [string, string, number][] = [
|
||||
['切片', 'slices', counts.slices ?? 0],
|
||||
['章节', 'sections', counts.sections ?? 0],
|
||||
['文档', 'docs', counts.docs ?? 0],
|
||||
['生效边', 'edgesActive', counts.edgesActive ?? 0],
|
||||
['待确认边', 'edgesCandidate', counts.edgesCandidate ?? 0],
|
||||
['结论', 'conclusions', counts.conclusions ?? 0],
|
||||
['待办', 'openItems', counts.openItems ?? 0],
|
||||
['挂起上传', 'uploadsHeld', counts.uploadsHeld ?? 0],
|
||||
['空缺章节', 'emptySections', counts.emptySections ?? 0],
|
||||
]
|
||||
return (
|
||||
<div>
|
||||
<SectionLabel>统计(截至水位 {data.watermark})</SectionLabel>
|
||||
<div className="rdm-audit-cards">
|
||||
{entries.map(([label, , val]) => (
|
||||
<div key={label} className="rdm-audit-card">
|
||||
<div className="rdm-audit-card-num">{val}</div>
|
||||
<div className="rdm-audit-card-label">{label}</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
{data.lastOpAt && <div className="rdm-audit-meta">最近动作:{new Date(data.lastOpAt).toLocaleString('zh-CN')}</div>}
|
||||
{data.coverage && data.coverage.length > 0 && (
|
||||
<CoverageList cov={data.coverage} />
|
||||
)}
|
||||
{exportOn && <ExportSection pid={pid} />}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
// ---- 概览导出(三条命令都启用才挂上;不参与七命令就绪门) ----
|
||||
|
||||
interface ExportCreated {
|
||||
exportId: string
|
||||
fileName: string
|
||||
watermark: number
|
||||
sha256: string
|
||||
draft?: boolean
|
||||
}
|
||||
interface ExportStatus {
|
||||
expiresAt: string
|
||||
sha256: string
|
||||
watermark: number
|
||||
}
|
||||
interface ExportDownloaded {
|
||||
fileName: string
|
||||
mime: string
|
||||
dataB64: string
|
||||
sha256: string
|
||||
}
|
||||
|
||||
function saveExportFile(fileName: string, mime: string, dataB64: string) {
|
||||
const bin = atob(dataB64)
|
||||
const bytes = new Uint8Array(bin.length)
|
||||
for (let i = 0; i < bin.length; i++) bytes[i] = bin.charCodeAt(i)
|
||||
const blob = new Blob([bytes], { type: mime || 'application/octet-stream' })
|
||||
const url = URL.createObjectURL(blob)
|
||||
const a = document.createElement('a')
|
||||
a.href = url
|
||||
a.download = fileName
|
||||
a.click()
|
||||
URL.revokeObjectURL(url)
|
||||
}
|
||||
|
||||
function ExportSection({ pid }: { pid: string }) {
|
||||
const identity = useStore(() => store.getIdentityEpoch())
|
||||
const generation = useRef(0)
|
||||
const [kind, setKind] = useState<'cgraph-docx' | 'cgraph-matrix'>('cgraph-docx')
|
||||
const [busy, setBusy] = useState(false)
|
||||
const [err, setErr] = useState('')
|
||||
const [needDraft, setNeedDraft] = useState(false)
|
||||
const [artifact, setArtifact] = useState<(ExportCreated & { expiresAt: string }) | null>(null)
|
||||
|
||||
useEffect(() => {
|
||||
generation.current++
|
||||
setArtifact(null)
|
||||
setErr('')
|
||||
setNeedDraft(false)
|
||||
setBusy(false)
|
||||
return () => { generation.current++ }
|
||||
}, [pid, identity])
|
||||
|
||||
const generate = async (draft: boolean) => {
|
||||
const request = ++generation.current
|
||||
const current = () => request === generation.current && identity === store.getIdentityEpoch()
|
||||
setBusy(true)
|
||||
setErr('')
|
||||
setNeedDraft(false)
|
||||
try {
|
||||
const created = await api.rdmCommand<ExportCreated>('rdm.inspect.export.create', { projectId: pid, kind, draft })
|
||||
if (!current()) return
|
||||
const st = await api.rdmCommand<ExportStatus>('rdm.inspect.export.status', { projectId: pid, exportId: created.exportId })
|
||||
if (!current()) return
|
||||
setArtifact({ ...created, expiresAt: st.expiresAt })
|
||||
} catch (e) {
|
||||
if (!current()) return
|
||||
const msg = e instanceof Error ? e.message : String(e)
|
||||
if (!draft && exportNeedsDraft(msg)) setNeedDraft(true)
|
||||
else setErr(msg)
|
||||
} finally {
|
||||
if (current()) setBusy(false)
|
||||
}
|
||||
}
|
||||
|
||||
const download = async () => {
|
||||
if (!artifact) return
|
||||
const request = ++generation.current
|
||||
const current = () => request === generation.current && identity === store.getIdentityEpoch()
|
||||
setBusy(true)
|
||||
setErr('')
|
||||
try {
|
||||
const dl = await api.rdmCommand<ExportDownloaded>('rdm.inspect.export.download', { projectId: pid, exportId: artifact.exportId })
|
||||
if (!current()) return
|
||||
saveExportFile(dl.fileName, dl.mime, dl.dataB64)
|
||||
} catch (e) {
|
||||
if (current()) setErr(e instanceof Error ? e.message : String(e))
|
||||
} finally {
|
||||
if (current()) setBusy(false)
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="rdm-audit-export">
|
||||
<SectionLabel>导出</SectionLabel>
|
||||
<div className="rdm-audit-export-row">
|
||||
<label className="rdm-audit-export-kind">
|
||||
类型
|
||||
<select className="ui-input" aria-label="导出类型" value={kind} onChange={e => setKind(e.target.value as 'cgraph-docx' | 'cgraph-matrix')}>
|
||||
<option value="cgraph-docx">合规追溯报告</option>
|
||||
<option value="cgraph-matrix">追溯矩阵</option>
|
||||
</select>
|
||||
</label>
|
||||
<button type="button" className="btn" disabled={busy} onClick={() => { void generate(false) }}>生成</button>
|
||||
</div>
|
||||
{needDraft && (
|
||||
<div className="rdm-audit-export-draft">
|
||||
<p>正式报告不完整。可以生成带缺口标注的草稿。</p>
|
||||
<button type="button" className="btn" disabled={busy} onClick={() => { void generate(true) }}>生成草稿</button>
|
||||
</div>
|
||||
)}
|
||||
{err && <div className="rdm-audit-export-err">{err}</div>}
|
||||
{artifact && (
|
||||
<div className="rdm-audit-export-result">
|
||||
<div>水位 {artifact.watermark}</div>
|
||||
<div>sha256 {artifact.sha256}</div>
|
||||
<div>有效期 {artifact.expiresAt ? new Date(artifact.expiresAt).toLocaleString('zh-CN') : '—'}</div>
|
||||
{artifact.draft && <div>草稿</div>}
|
||||
<button type="button" className="btn v-ghost" disabled={busy} onClick={() => { void download() }}>下载</button>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
// ---- 资料与文档 ----
|
||||
|
||||
function MaterialsTab({ pid }: { pid: string }) {
|
||||
const [kind, setKind] = useState<'notes' | 'docs'>('docs')
|
||||
return (
|
||||
<div className="rdm-audit-materials">
|
||||
<div className="rdm-audit-materials-side">
|
||||
<div className="tabs">
|
||||
<button className={`tab${kind === 'notes' ? ' active' : ''}`} onClick={() => setKind('notes')}>笔记树</button>
|
||||
<button className={`tab${kind === 'docs' ? ' active' : ''}`} onClick={() => setKind('docs')}>文档树</button>
|
||||
</div>
|
||||
<TreeList pid={pid} kind={kind} />
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
function TreeList({ pid, kind }: { pid: string; kind: 'notes' | 'docs' }) {
|
||||
const [shell, setShell] = useState<ListShell<TreeItem> | null>(null)
|
||||
const [err, setErr] = useState('')
|
||||
const [selected, setSelected] = useState<TreeItem | null>(null)
|
||||
const [detail, setDetail] = useState<ObjectDetail | null>(null)
|
||||
// docs 树是层级结构(rdm.inspect.tree parent=<docId> 才返回章节):文档节点
|
||||
// 点击展开子章节,不直接查对象详情(doc 不在 inspect.object 支持面)。
|
||||
const [children, setChildren] = useState<Record<string, TreeItem[]>>({})
|
||||
const genRef = useRef(0)
|
||||
|
||||
useEffect(() => {
|
||||
const gen = ++genRef.current
|
||||
setShell(null); setErr(''); setSelected(null); setDetail(null); setChildren({})
|
||||
api.rdmCommand<ListShell<TreeItem>>('rdm.inspect.tree', { projectId: pid, kind, cursor: '' })
|
||||
.then(s => { if (gen === genRef.current) setShell(s) })
|
||||
.catch(e => { if (gen === genRef.current) setErr(e.message) })
|
||||
}, [pid, kind])
|
||||
|
||||
const loadMore = () => {
|
||||
if (!shell?.nextCursor) return
|
||||
const gen = genRef.current
|
||||
api.rdmCommand<ListShell<TreeItem>>('rdm.inspect.tree', { projectId: pid, kind, cursor: shell.nextCursor })
|
||||
.then(s => { if (gen === genRef.current) setShell(prev => prev ? { ...s, items: [...prev.items, ...s.items] } : s) })
|
||||
.catch(e => { if (gen === genRef.current) setErr(e.message) })
|
||||
}
|
||||
|
||||
const toggleDoc = (item: TreeItem) => {
|
||||
if (children[item.id]) {
|
||||
setChildren(prev => { const next = { ...prev }; delete next[item.id]; return next })
|
||||
return
|
||||
}
|
||||
const gen = genRef.current
|
||||
api.rdmCommand<ListShell<TreeItem>>('rdm.inspect.tree', { projectId: pid, kind: 'docs', parent: item.id, cursor: '' })
|
||||
.then(s => { if (gen === genRef.current) setChildren(prev => ({ ...prev, [item.id]: s.items })) })
|
||||
.catch(e => { if (gen === genRef.current) setErr(e.message) })
|
||||
}
|
||||
|
||||
const selectNode = (item: TreeItem) => {
|
||||
if (item.kind === 'doc') { toggleDoc(item); return }
|
||||
setSelected(item); setDetail(null)
|
||||
const gen = genRef.current
|
||||
api.rdmCommand<ObjectDetail>('rdm.inspect.object', { projectId: pid, kind: item.kind, id: item.id })
|
||||
.then(d => { if (gen === genRef.current) setDetail(d) })
|
||||
.catch(e => { if (gen === genRef.current) setErr(e.message) })
|
||||
}
|
||||
|
||||
if (err) return <RdmErrorState raw={err} />
|
||||
if (!shell) return <div className="empty-note">加载中…</div>
|
||||
if (shell.items.length === 0) return <EmptyState icon="folder">暂无{kind === 'notes' ? '骨架节点' : '文档'}</EmptyState>
|
||||
|
||||
return (
|
||||
<div className="rdm-audit-tree">
|
||||
<div className="rdm-audit-tree-list">
|
||||
{shell.items.map(item => (
|
||||
<div key={item.id}>
|
||||
<button className={`rdm-audit-tree-node${selected?.id === item.id ? ' sel' : ''}`}
|
||||
onClick={() => selectNode(item)}>
|
||||
{item.kind === 'doc' && <span className="rdm-audit-tree-caret">{children[item.id] ? '▾' : '▸'}</span>}
|
||||
<span className="rdm-audit-tree-kind">{item.kind}</span>
|
||||
<span className="rdm-audit-tree-title">{item.title}</span>
|
||||
{item.state && <Chip tone={item.state === 'baselined' ? 'ok' : 'plain'}>{item.state}</Chip>}
|
||||
</button>
|
||||
{item.kind === 'doc' && children[item.id] && (
|
||||
<div className="rdm-audit-tree-children">
|
||||
{children[item.id].length === 0 && <div className="empty-note">无章节</div>}
|
||||
{children[item.id].map(sub => (
|
||||
<button key={sub.id} className={`rdm-audit-tree-node${selected?.id === sub.id ? ' sel' : ''}`}
|
||||
onClick={() => selectNode(sub)}>
|
||||
<span className="rdm-audit-tree-kind">{sub.kind}</span>
|
||||
<span className="rdm-audit-tree-title">{sub.title}</span>
|
||||
{sub.state && <Chip tone={sub.state === 'baselined' ? 'ok' : 'plain'}>{sub.state}</Chip>}
|
||||
</button>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
))}
|
||||
{shell.hasMore && <button className="btn v-ghost rdm-audit-more" onClick={loadMore}>加载更多</button>}
|
||||
{shell.truncated && <div className="rdm-audit-truncated">已截断(深度或数量上限)</div>}
|
||||
</div>
|
||||
{selected && (
|
||||
<div className="rdm-audit-detail">
|
||||
<SectionLabel>对象详情</SectionLabel>
|
||||
{!detail ? <div className="empty-note">加载中…</div> : <ObjectDetailView detail={detail} />}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
// ---- 关联追溯 ----
|
||||
|
||||
function TraceTab({ pid }: { pid: string }) {
|
||||
const [sel, setSel] = useState<{ kind: string; id: string; title: string } | null>(null)
|
||||
const [relations, setRelations] = useState<RelationEntry[] | null>(null)
|
||||
const [truncated, setTruncated] = useState(false)
|
||||
const [err, setErr] = useState('')
|
||||
const genRef = useRef(0)
|
||||
|
||||
useEffect(() => {
|
||||
if (!sel) return
|
||||
const gen = ++genRef.current
|
||||
setRelations(null); setErr('')
|
||||
api.rdmCommand<ListShell<RelationEntry>>('rdm.inspect.relations', { projectId: pid, kind: sel.kind, id: sel.id, depth: 1 })
|
||||
.then(s => { if (gen === genRef.current) { setRelations(s.items); setTruncated(s.truncated) } })
|
||||
.catch(e => { if (gen === genRef.current) setErr(e.message) })
|
||||
}, [pid, sel])
|
||||
|
||||
// 未选对象时列出章节供选择。docs 树是层级结构:章节挂在各文档下
|
||||
// (parent=<docId>),按文档聚合后合并展示。
|
||||
const [sections, setSections] = useState<TreeItem[]>([])
|
||||
useEffect(() => {
|
||||
if (sel) return
|
||||
let c = false
|
||||
;(async () => {
|
||||
const top = await api.rdmCommand<ListShell<TreeItem>>('rdm.inspect.tree', { projectId: pid, kind: 'docs' })
|
||||
const secs: TreeItem[] = []
|
||||
for (const d of top.items.filter(i => i.kind === 'doc')) {
|
||||
const sub = await api.rdmCommand<ListShell<TreeItem>>('rdm.inspect.tree', { projectId: pid, kind: 'docs', parent: d.id })
|
||||
secs.push(...sub.items.filter(i => i.kind === 'section'))
|
||||
}
|
||||
if (!c) setSections(secs)
|
||||
})().catch(() => {})
|
||||
return () => { c = true }
|
||||
}, [pid, sel])
|
||||
|
||||
if (!sel) {
|
||||
return (
|
||||
<div>
|
||||
<SectionLabel>选择对象查看来源与影响</SectionLabel>
|
||||
{sections.length === 0 ? <EmptyState icon="folder">暂无章节</EmptyState> : (
|
||||
<div className="rdm-audit-pick">
|
||||
{sections.map(s => (
|
||||
<button key={s.id} className="btn v-ghost" onClick={() => setSel({ kind: 'section', id: s.id, title: s.title })}>
|
||||
{s.title}
|
||||
</button>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
const sources = relations?.filter(r => r.to?.id === sel.id && r.to?.kind === sel.kind) ?? []
|
||||
const impacts = relations?.filter(r => r.from?.id === sel.id && r.from?.kind === sel.kind) ?? []
|
||||
|
||||
return (
|
||||
<div>
|
||||
<div className="rdm-audit-trace-head">
|
||||
<button className="btn v-ghost" onClick={() => setSel(null)}>← 返回</button>
|
||||
<strong>{sel.title}</strong>
|
||||
<Chip tone="plain">{sel.kind}:{sel.id}</Chip>
|
||||
</div>
|
||||
{err && <RdmErrorState raw={err} />}
|
||||
{!relations && !err && <div className="empty-note">加载中…</div>}
|
||||
{relations && relations.length === 0 && <EmptyState icon="folder">没有已知关联</EmptyState>}
|
||||
{relations && relations.length > 0 && (
|
||||
<div className="rdm-audit-trace-cols">
|
||||
<div className="rdm-audit-trace-col">
|
||||
<SectionLabel>来源依据({sources.length})</SectionLabel>
|
||||
{sources.length === 0 ? <div className="empty-note">无来源</div> : sources.map((r, i) => <RelationRow key={i} r={r} />)}
|
||||
</div>
|
||||
<div className="rdm-audit-trace-col">
|
||||
<SectionLabel>影响对象({impacts.length})</SectionLabel>
|
||||
{impacts.length === 0 ? <div className="empty-note">无影响</div> : impacts.map((r, i) => <RelationRow key={i} r={r} />)}
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
{truncated && <div className="rdm-audit-truncated">已截断(深度或数量上限)</div>}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
function RelationRow({ r }: { r: RelationEntry }) {
|
||||
const other = r.from?.id && r.to?.id ? (r.from?.id < r.to?.id ? r.from : r.to) : (r.from || r.to)
|
||||
return (
|
||||
<div className="rdm-audit-rel">
|
||||
<Chip tone={r.layer === 'compliance' ? 'info' : 'plain'}>{r.layer}</Chip>
|
||||
<span className="rdm-audit-rel-type">{r.type || r.kind || '关联'}</span>
|
||||
<span className="rdm-audit-rel-endpoint">{other?.kind}:{other?.id}{other?.ver ? `@${other.ver}` : ''}</span>
|
||||
<Chip tone={r.state === 'active' ? 'ok' : r.state === 'candidate' ? 'warn' : 'plain'}>{r.state}</Chip>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
// ---- 操作记录(事件时间线) ----
|
||||
|
||||
function TimelineTab({ pid }: { pid: string }) {
|
||||
const [items, setItems] = useState<(OpGroup | EventDTO)[]>([])
|
||||
const [cursor, setCursor] = useState('')
|
||||
const [hasMore, setHasMore] = useState(false)
|
||||
const [err, setErr] = useState('')
|
||||
const [filterOp, setFilterOp] = useState('')
|
||||
const [filterActor, setFilterActor] = useState('')
|
||||
const [historyMode, setHistoryMode] = useState(false)
|
||||
const [historySeq, setHistorySeq] = useState(0)
|
||||
const [historyData, setHistoryData] = useState<HistoryData | null>(null)
|
||||
const genRef = useRef(0)
|
||||
|
||||
const load = useCallback((cur: string, replace: boolean) => {
|
||||
const gen = ++genRef.current
|
||||
if (replace) { setItems([]); setErr('') }
|
||||
const params: Record<string, unknown> = { projectId: pid, cursor: cur, limit: 30 }
|
||||
if (filterOp) params.op = filterOp
|
||||
if (filterActor) params.actor = filterActor
|
||||
api.rdmCommand<ListShell<OpGroup | EventDTO>>('rdm.inspect.events', params)
|
||||
.then(s => {
|
||||
if (gen !== genRef.current) return
|
||||
setItems(prev => replace ? s.items : [...prev, ...s.items])
|
||||
setCursor(s.nextCursor || '')
|
||||
setHasMore(s.hasMore)
|
||||
})
|
||||
.catch(e => { if (gen === genRef.current) setErr(e.message) })
|
||||
}, [pid, filterOp, filterActor])
|
||||
|
||||
useEffect(() => { if (!historyMode) load('', true) }, [load, historyMode])
|
||||
|
||||
useEffect(() => {
|
||||
if (!historyMode) { setHistoryData(null); return }
|
||||
const gen = genRef.current
|
||||
setHistoryData(null)
|
||||
const params: Record<string, unknown> = { projectId: pid, atSeq: historySeq || undefined }
|
||||
api.rdmCommand<HistoryData>('rdm.inspect.history', params)
|
||||
.then(d => { if (gen === genRef.current) setHistoryData(d) })
|
||||
.catch(e => { if (gen === genRef.current) setErr(e.message) })
|
||||
}, [pid, historyMode, historySeq])
|
||||
|
||||
return (
|
||||
<div className="rdm-audit-timeline">
|
||||
<div className="rdm-audit-timeline-filters">
|
||||
<input className="ui-input" placeholder="过滤操作者…" value={filterActor}
|
||||
onChange={e => setFilterActor(e.target.value)} />
|
||||
<input className="ui-input" placeholder="过滤操作类型…" value={filterOp}
|
||||
onChange={e => setFilterOp(e.target.value)} />
|
||||
<button className={`btn v-ghost${historyMode ? ' active' : ''}`} onClick={() => setHistoryMode(!historyMode)}>
|
||||
{historyMode ? '← 返回当前' : '历史模式'}
|
||||
</button>
|
||||
{historyMode && (
|
||||
<input className="ui-input rdm-audit-seq" type="number" placeholder="截止 seq…"
|
||||
value={historySeq || ''} onChange={e => setHistorySeq(Number(e.target.value) || 0)} />
|
||||
)}
|
||||
</div>
|
||||
|
||||
{historyMode ? (
|
||||
<div>
|
||||
{!historyData ? <div className="empty-note">加载中…</div> : (
|
||||
<div>
|
||||
<SectionLabel>截至 seq {historyData.atSeq}(当前水位 {historyData.watermark})</SectionLabel>
|
||||
{historyData.countOnlySnapshots ? <div className="rdm-audit-truncated">含 {historyData.countOnlySnapshots} 个旧计数快照(不可作恢复依据)</div> : null}
|
||||
{historyData.formalMissing ? <div className="empty-note">{historyData.formalMissing}</div> : null}
|
||||
{historyData.object ? (
|
||||
<div className="rdm-audit-detail-body">
|
||||
<div>标题:{historyData.object.title}</div>
|
||||
<div>状态:{historyData.object.state}</div>
|
||||
{historyData.object.contentPreview && <div>内容预览:{historyData.object.contentPreview}</div>}
|
||||
</div>
|
||||
) : historyData.empty ? <EmptyState icon="folder">该时点无事件</EmptyState> :
|
||||
<div className="empty-note">输入对象 kind:id 查看历史快照</div>}
|
||||
{historyData.formal && (
|
||||
<div className="rdm-audit-formal">
|
||||
正式版 R{historyData.formal.rev}(内容 v{historyData.formal.seq})——{historyData.formal.actor} 于 {new Date(historyData.formal.at).toLocaleString('zh-CN')}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
) : (
|
||||
<div>
|
||||
{err && <RdmErrorState raw={err} />}
|
||||
{!err && items.length === 0 && <EmptyState icon="clock">暂无事件</EmptyState>}
|
||||
{items.map((item, i) => {
|
||||
if ('events' in item && Array.isArray((item as OpGroup).events)) {
|
||||
return <OpGroupView key={item.operationId || i} group={item as OpGroup} />
|
||||
}
|
||||
return <EventRow key={(item as EventDTO).seq} ev={item as EventDTO} />
|
||||
})}
|
||||
{hasMore && <button className="btn v-ghost rdm-audit-more" onClick={() => load(cursor, false)}>加载更多</button>}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
function OpGroupView({ group }: { group: OpGroup }) {
|
||||
const [open, setOpen] = useState(false)
|
||||
return (
|
||||
<div className="rdm-audit-opgroup">
|
||||
<button className="rdm-audit-opgroup-head" onClick={() => setOpen(!open)}>
|
||||
<span className="rdm-audit-opgroup-actor">{group.actor}</span>
|
||||
<span className="rdm-audit-opgroup-time">{new Date(group.at).toLocaleString('zh-CN')}</span>
|
||||
<Chip tone="plain">{group.events.length} 个事件</Chip>
|
||||
</button>
|
||||
{open && group.events.map(ev => <EventRow key={ev.seq} ev={ev} />)}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
function EventRow({ ev }: { ev: EventDTO }) {
|
||||
return (
|
||||
<div className="rdm-audit-event">
|
||||
<span className="rdm-audit-event-time">{new Date(ev.at).toLocaleTimeString('zh-CN')}</span>
|
||||
<span className="rdm-audit-event-op">{ev.op}</span>
|
||||
<span className="rdm-audit-event-actor">{ev.actor}</span>
|
||||
{ev.detail && <span className="rdm-audit-event-detail">{ev.detail.slice(0, 80)}</span>}
|
||||
{ev.disclosure !== 'ok' && <Chip tone="warn">{ev.disclosure === 'model-candidate' ? '模型候选' : '来源受限'}</Chip>}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
// ---- 对象详情视图 ----
|
||||
|
||||
function ObjectDetailView({ detail }: { detail: ObjectDetail }) {
|
||||
return (
|
||||
<div className="rdm-audit-detail-body">
|
||||
<div><strong>{detail.title || detail.id}</strong></div>
|
||||
<div>{detail.kind}:{detail.id}{detail.ver ? `@${detail.ver}` : ''}</div>
|
||||
{detail.state && <div>状态:<Chip tone={detail.state === 'baselined' ? 'ok' : 'plain'}>{detail.state}</Chip></div>}
|
||||
{detail.labels && <div>标签:{detail.labels.stage}{detail.labels.topics?.length ? ` / ${detail.labels.topics.join(', ')}` : ''}</div>}
|
||||
{detail.versions && detail.versions.length > 0 && (
|
||||
<div>
|
||||
<SectionLabel>版本链({detail.versions.length})</SectionLabel>
|
||||
{detail.versions.map((v: any, i: number) => (
|
||||
<div key={i} className="rdm-audit-version">
|
||||
v{v.seq} · {v.actor} · {new Date(v.at).toLocaleString('zh-CN')}
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
{detail.formal && (
|
||||
<div className="rdm-audit-formal">
|
||||
正式版 R{detail.formal.rev}(内容 v{detail.formal.seq})——{detail.formal.actor} 于 {new Date(detail.formal.at).toLocaleString('zh-CN')}
|
||||
</div>
|
||||
)}
|
||||
{detail.relations && detail.relations.length > 0 && (
|
||||
<div>
|
||||
<SectionLabel>一跳关系({detail.relations.length})</SectionLabel>
|
||||
{detail.relations.map((r, i) => <RelationRow key={i} r={r} />)}
|
||||
</div>
|
||||
)}
|
||||
{detail.recentEvents && detail.recentEvents.length > 0 && (
|
||||
<div>
|
||||
<SectionLabel>最近事件</SectionLabel>
|
||||
{detail.recentEvents.map(ev => <EventRow key={ev.seq} ev={ev} />)}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
// ---- 覆盖范围标注(不冒充完整) ----
|
||||
|
||||
function CoverageList({ cov }: { cov: CoverageItem[] }) {
|
||||
return (
|
||||
<div className="rdm-audit-coverage">
|
||||
<SectionLabel>覆盖范围</SectionLabel>
|
||||
{cov.map(c => (
|
||||
<div key={c.face} className="rdm-audit-coverage-item">
|
||||
<Chip tone="plain">{c.face}</Chip>
|
||||
<span>{c.reason}</span>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -4,11 +4,14 @@
|
||||
// 插件工作区迁「系统管理」(AdminZone,管理员专属全屏视图)。
|
||||
import { useEffect, useMemo, useState } from 'react'
|
||||
import { api } from '../api'
|
||||
import { store } from '../store'
|
||||
import { isFontSizeChoice, store, useStore } from '../store'
|
||||
import type { ThemeChoice } from '../theme'
|
||||
import type { SettingDesc } from '../contracts'
|
||||
import { SettingsShell, SettingRow, SettingsGroup, Btn } from '@ui'
|
||||
import { BorrowPanels } from './BorrowPanels'
|
||||
import { MyAccountSettings } from './MyAccountSettings'
|
||||
|
||||
type Section = 'settings'
|
||||
type Section = 'settings' | 'account'
|
||||
|
||||
// 分组显示名(项目设置面板共用)。
|
||||
export const groupNames: Record<string, string> = {
|
||||
@@ -17,11 +20,13 @@ export const groupNames: Record<string, string> = {
|
||||
}
|
||||
|
||||
export function SettingsModal() {
|
||||
const [section] = useState<Section>('settings')
|
||||
const [section, setSection] = useState<Section>('settings')
|
||||
const [schema, setSchema] = useState<SettingDesc[]>([])
|
||||
const [, setUser] = useState<Record<string, any>>({})
|
||||
const [draft, setDraft] = useState<Record<string, any>>({})
|
||||
const [saved, setSaved] = useState(false)
|
||||
const theme = useStore(s => s.ui.theme)
|
||||
const fontSize = useStore(s => s.ui.fontSize)
|
||||
|
||||
useEffect(() => {
|
||||
api.getSettings().then(s => {
|
||||
@@ -50,10 +55,11 @@ export function SettingsModal() {
|
||||
|
||||
return (
|
||||
<SettingsShell
|
||||
title="设置" active={section} onSelect={() => undefined}
|
||||
title="设置" active={section} onSelect={key => setSection(key as Section)}
|
||||
onClose={() => store.openSettings(false)}
|
||||
sections={[
|
||||
{ key: 'settings', label: '常规', icon: 'settings' },
|
||||
{ key: 'account', label: '账号', icon: 'user' },
|
||||
]}
|
||||
footer={saved ? <span style={{ color: 'var(--ok)' }}>✓ 已保存</span> : 'Agent-System · 设置中心'}
|
||||
actions={section === 'settings' && schema.length > 0 ? (
|
||||
@@ -63,19 +69,62 @@ export function SettingsModal() {
|
||||
</>
|
||||
) : undefined}
|
||||
>
|
||||
{section === 'settings' && Object.entries(groups).map(([g, descs]) => (
|
||||
{section === 'settings' && (
|
||||
<SettingsGroup title="外观">
|
||||
<SettingRow label="主题" desc="墨绿是可选身份皮肤。跟随系统只在深色与浅色之间切换。深色和浅色会随设置保存" effect="hot">
|
||||
<select value={theme} onChange={e => {
|
||||
const next = e.target.value as ThemeChoice
|
||||
store.setUI({ theme: next })
|
||||
if (next === 'dark' || next === 'light') setDraft(x => ({ ...x, 'ui.theme': next }))
|
||||
}}>
|
||||
<option value="dark">深色</option>
|
||||
<option value="light">浅色</option>
|
||||
<option value="molv">墨绿</option>
|
||||
<option value="system">跟随系统</option>
|
||||
</select>
|
||||
</SettingRow>
|
||||
<SettingRow label="界面字号" desc="小、标准、大、特大。只保存在这台设备上,图标和间距不跟随缩放" effect="hot">
|
||||
<select value={fontSize} onChange={e => {
|
||||
const next = Number(e.target.value)
|
||||
if (isFontSizeChoice(next)) store.setUI({ fontSize: next })
|
||||
}}>
|
||||
<option value={13}>小</option>
|
||||
<option value={14}>标准</option>
|
||||
<option value={16}>大</option>
|
||||
<option value={18}>特大</option>
|
||||
</select>
|
||||
</SettingRow>
|
||||
</SettingsGroup>
|
||||
)}
|
||||
{section === 'settings' && Object.entries(groups).map(([g, descs]) => {
|
||||
const rows = descs.filter(d => d.key !== 'ui.theme')
|
||||
if (rows.length === 0) return null
|
||||
return (
|
||||
<SettingsGroup key={g} title={groupNames[g] ?? g}>
|
||||
{descs.map(d => (
|
||||
{rows.map(d => (
|
||||
<SettingRow key={d.key} label={d.label} desc={d.description} effect={d.effect}>
|
||||
<SettingInput desc={d} value={draft[d.key] ?? ''} onChange={v => setDraft(x => ({ ...x, [d.key]: v }))} />
|
||||
</SettingRow>
|
||||
))}
|
||||
</SettingsGroup>
|
||||
))}
|
||||
)
|
||||
})}
|
||||
{section === 'settings' && <BorrowPanels />}
|
||||
{section === 'account' && <MyAccountSettings />}
|
||||
</SettingsShell>
|
||||
)
|
||||
}
|
||||
|
||||
// 输入框语义(2026-10-12 增量 3):仅秘密字段用密码框;普通文本用 text——
|
||||
// 无条件 type="password" 会把整排设置项当凭据表单(浏览器「password 不在 form 中/
|
||||
// 缺少 username」警告来源之一),也把普通文本无谓遮蔽。
|
||||
export function settingInputAttrs(desc: SettingDesc): { type: 'text' | 'password'; autoComplete: string } {
|
||||
const isSecret = desc.secret || desc.type === 'secret'
|
||||
return isSecret
|
||||
? { type: 'password', autoComplete: 'new-password' }
|
||||
: { type: 'text', autoComplete: 'off' }
|
||||
}
|
||||
|
||||
export function SettingInput({ desc, value, onChange }: { desc: SettingDesc; value: any; onChange: (v: any) => void }) {
|
||||
if (desc.type === 'boolean') {
|
||||
return <input type="checkbox" checked={value === true || value === 'true'} onChange={e => onChange(e.target.checked)} />
|
||||
@@ -86,7 +135,8 @@ export function SettingInput({ desc, value, onChange }: { desc: SettingDesc; val
|
||||
</select>
|
||||
}
|
||||
const isSecret = desc.secret || desc.type === 'secret'
|
||||
return <input type="password" autoComplete="new-password" style={{ width: '100%' }} value={typeof value === 'string' && value === '••••••' ? '' : (value ?? '')}
|
||||
const attrs = settingInputAttrs(desc)
|
||||
return <input type={attrs.type} autoComplete={attrs.autoComplete} style={{ width: '100%' }} value={typeof value === 'string' && value === '••••••' ? '' : (value ?? '')}
|
||||
placeholder={isSecret ? '(已配置,输入以覆盖)' : String(desc.default ?? '')}
|
||||
onChange={e => onChange(e.target.value)} />
|
||||
}
|
||||
|
||||
+121
-86
@@ -1,20 +1,14 @@
|
||||
// 左栏(方案 A「任务中心」,提案 2026-09-30 R1):单一主创建入口(P6)+
|
||||
// 组织视图(P8:按项目/时间线)+ 置顶/归档 + 账户区(P7)。
|
||||
// 重设计方案 阶段②(IA 对话优先):工件/代理/插件快捷条撤出普通用户界面——
|
||||
// 工件走右栏「工件」页签,插件工作区归「系统管理」(管理员专属全屏视图)。
|
||||
// 左栏(找上下文):顶部切换项目,中间放会话与搜索,底部放文件、工作区和账户。
|
||||
// 创建、搜索、置顶与归档仍在会话段里;领域工具由服务端工作区声明,没有时装上说明行。
|
||||
import { useEffect, useRef, useState } from 'react'
|
||||
import { store, useStore } from '../store'
|
||||
import { auth } from '../auth'
|
||||
import { api } from '../api'
|
||||
import { Icon, BrandMark } from '@ui'
|
||||
import { Icon } from '@ui'
|
||||
import type { Conversation } from '../contracts'
|
||||
import { groupByProject, groupByTimeline, relativeTime, filterTasks, type TaskOrg } from '../tasklist'
|
||||
|
||||
const GROUPS_KEY = 'as.taskGroups'
|
||||
|
||||
function loadCollapsed(): Record<string, boolean> {
|
||||
try { return JSON.parse(localStorage.getItem(GROUPS_KEY) ?? '{}') } catch { return {} }
|
||||
}
|
||||
import { relativeTime, filterTasks } from '../tasklist'
|
||||
import { projectStage, projectStateLabel, projectWorkError } from '../projectmeta'
|
||||
import { buildWorkspaceEntries } from '../workspaces'
|
||||
|
||||
/** 小型弹出菜单:锚点下方渲染,点击外部关闭。 */
|
||||
function Menu({ anchor, onClose, children }: { anchor: HTMLElement | null; onClose: () => void; children: React.ReactNode }) {
|
||||
@@ -27,7 +21,7 @@ function Menu({ anchor, onClose, children }: { anchor: HTMLElement | null; onClo
|
||||
if (x + el.offsetWidth > window.innerWidth - 8) x = window.innerWidth - el.offsetWidth - 8
|
||||
if (y + el.offsetHeight > window.innerHeight - 8) y = r.top - el.offsetHeight - 6
|
||||
el.style.left = `${Math.max(8, x)}px`
|
||||
el.style.top = `${y}px`
|
||||
el.style.top = `${Math.max(8, Math.min(y, window.innerHeight - el.offsetHeight - 8))}px`
|
||||
const h = (e: MouseEvent) => { if (!el.contains(e.target as Node)) onClose() }
|
||||
window.addEventListener('mousedown', h)
|
||||
return () => window.removeEventListener('mousedown', h)
|
||||
@@ -42,50 +36,52 @@ function MenuItem({ onClick, danger, icon, children }: { onClick: () => void; da
|
||||
</button>
|
||||
}
|
||||
|
||||
export function TaskSidebar() {
|
||||
interface TaskSidebarProps {
|
||||
onCollapse?: () => void
|
||||
onConversationOpen?: () => void
|
||||
onFilesOpen?: () => void
|
||||
onWorkOpen?: () => void
|
||||
}
|
||||
|
||||
export function TaskSidebar({ onCollapse = store.toggleLeft, onConversationOpen,
|
||||
onFilesOpen = store.openFiles, onWorkOpen = store.focusPending,
|
||||
}: TaskSidebarProps = {}) {
|
||||
const projects = useStore(s => s.projects)
|
||||
const tasks = useStore(s => s.tasks)
|
||||
const me = useStore(s => s.me)
|
||||
const adminSections = useStore(s => s.adminSections)
|
||||
const artifacts = useStore(s => s.artifacts)
|
||||
const currentConvId = useStore(s => s.currentConvId)
|
||||
const currentProjectId = useStore(s => s.currentProjectId)
|
||||
const org = useStore(s => s.ui.taskOrg)
|
||||
const showArchived = useStore(s => s.ui.showArchived)
|
||||
const serverWorkspaces = useStore(s => s.serverWorkspaces)
|
||||
/** 审计入口能力门控(增量 2):命令面探测通过才展示「追溯审计」。 */
|
||||
const rdmAuditAvailable = useStore(s => s.rdmAuditAvailable)
|
||||
const rdmCockpitAvailable = useStore(s => s.rdmCockpitAvailable)
|
||||
const theme = useStore(s => s.ui.theme)
|
||||
const pendingBadge = useStore(s =>
|
||||
s.cards.filter(c => c.status === 'action_required').length +
|
||||
s.projectCards.filter(c => c.status === 'action_required').length)
|
||||
|
||||
const [q, setQ] = useState('')
|
||||
const [collapsed, setCollapsed] = useState<Record<string, boolean>>(loadCollapsed)
|
||||
const [menu, setMenu] = useState<{ kind: 'new' | 'filter' | 'account' | `row:${string}`; anchor: HTMLElement } | null>(null)
|
||||
const [menu, setMenu] = useState<{ kind: 'new' | 'account' | 'project' | `row:${string}`; anchor: HTMLElement } | null>(null)
|
||||
const [creatingProject, setCreatingProject] = useState(false)
|
||||
const [newProjectName, setNewProjectName] = useState('')
|
||||
|
||||
// ⌘N/Ctrl+N 新建任务(P6:创建入口唯一 + 快捷键)。
|
||||
useEffect(() => {
|
||||
const h = (e: KeyboardEvent) => {
|
||||
const k = e.key.toLowerCase()
|
||||
if ((e.metaKey || e.ctrlKey) && k === 'n') { e.preventDefault(); store.createTask() }
|
||||
if ((e.metaKey || e.ctrlKey) && k === 'b') { e.preventDefault(); store.toggleLeft() }
|
||||
}
|
||||
window.addEventListener('keydown', h, true)
|
||||
return () => window.removeEventListener('keydown', h, true)
|
||||
}, [])
|
||||
|
||||
const tglGroup = (key: string) => {
|
||||
setCollapsed(c => {
|
||||
const next = { ...c, [key]: !c[key] }
|
||||
try { localStorage.setItem(GROUPS_KEY, JSON.stringify(next)) } catch { /* ignore */ }
|
||||
return next
|
||||
})
|
||||
const createConversation = async (projectId?: string) => {
|
||||
try {
|
||||
await store.createTask(projectId)
|
||||
onConversationOpen?.()
|
||||
} catch { /* store owns the actionable failure toast */ }
|
||||
}
|
||||
const setOrg = (o: TaskOrg) => store.setUI({ taskOrg: o })
|
||||
|
||||
const visible = filterTasks(tasks, q)
|
||||
const tools = buildWorkspaceEntries(serverWorkspaces, { rdmAudit: rdmAuditAvailable, rdmCockpit: rdmCockpitAvailable })
|
||||
const visible = filterTasks(tasks.filter(t => t.projectId === currentProjectId), q)
|
||||
const pinned = visible.filter(t => t.pinned)
|
||||
const rest = visible.filter(t => !t.pinned)
|
||||
const groups = org === 'project' ? groupByProject(rest, projects) : groupByTimeline(rest)
|
||||
const currentProject = projects.find(p => p.id === currentProjectId)
|
||||
const stage = projectStateLabel(currentProject?.settings) ?? projectStage(currentProject?.settings)
|
||||
const workError = currentProject ? projectWorkError(currentProject) : null
|
||||
const rowTask = menu?.kind.startsWith('row:') ? tasks.find(t => t.id === menu.kind.slice(4)) : null
|
||||
const rowMenuAnchor = menu && menu.kind.startsWith('row:') ? menu.anchor : null
|
||||
|
||||
@@ -102,52 +98,67 @@ export function TaskSidebar() {
|
||||
</span>
|
||||
)
|
||||
|
||||
const taskRow = (t: Conversation, badge?: string) => (
|
||||
/** 切换项目:优先恢复该项目下正在看的会话,否则进第一个未归档会话。 */
|
||||
const switchProject = (pid: string) => {
|
||||
const next = tasks.find(t => t.projectId === pid && t.id === currentConvId)
|
||||
?? tasks.find(t => t.projectId === pid && !t.archived)
|
||||
if (next) store.openTask(next.id)
|
||||
else store.openProject(pid)
|
||||
onConversationOpen?.()
|
||||
}
|
||||
|
||||
const taskRow = (t: Conversation) => (
|
||||
<div key={t.id} className={`tsb-task ${t.id === currentConvId ? 'active' : ''} ${t.archived ? 'archived' : ''}`}
|
||||
onClick={() => store.openTask(t.id)}
|
||||
onContextMenu={e => { e.preventDefault(); setMenu({ kind: `row:${t.id}`, anchor: e.currentTarget as HTMLElement }) }}>
|
||||
<span className="tsb-task-t" title={t.title}>{t.title || '未命名任务'}</span>
|
||||
{t.crossPrivate && <span className="tsb-pbadge" title="私有:不被其他会话读取"><Icon name="shield" size={11} /></span>}
|
||||
{badge && <span className="tsb-pbadge">{badge}</span>}
|
||||
<span className="tsb-task-tm">{relativeTime(t.updatedAt)}</span>
|
||||
<button className="tsb-task-open" onClick={() => { store.openTask(t.id); onConversationOpen?.() }}>
|
||||
<Icon name="message" size={14} />
|
||||
<span className="tsb-task-t" title={t.title}>{t.title || '未命名对话'}</span>
|
||||
{t.crossPrivate && <span className="tsb-pbadge" title="私有:不被其他会话读取"><Icon name="shield" size={11} /></span>}
|
||||
<span className="tsb-task-tm">{relativeTime(t.updatedAt)}</span>
|
||||
</button>
|
||||
{rowActions(t)}
|
||||
<button className="tsb-row-menu" aria-label={`「${t.title || '未命名对话'}」更多操作`} title="更多对话操作"
|
||||
onClick={e => setMenu({ kind: `row:${t.id}`, anchor: e.currentTarget })}><Icon name="more" size={14} /></button>
|
||||
</div>
|
||||
)
|
||||
|
||||
return (
|
||||
<>
|
||||
{/* 项目身份唯一落点:顶部切换项目(方案:项目导航置顶)。 */}
|
||||
<div className="tsb-brand">
|
||||
<BrandMark size={24} />
|
||||
<span className="tsb-name">Agent-System</span>
|
||||
<span style={{ flex: 1 }} />
|
||||
<button className="tsb-iconbtn" title="收起侧栏(⌘B)" onClick={store.toggleLeft}><Icon name="panel-left" /></button>
|
||||
<button className="tsb-projrow" title="切换项目"
|
||||
onClick={e => { const el = e.currentTarget; setMenu(m => m?.kind === 'project' ? null : { kind: 'project', anchor: el }) }}>
|
||||
<Icon name="folder" size={15} />
|
||||
<span className="tsb-projrow-name">{currentProject?.name ?? '选择项目'}</span>
|
||||
{stage && <span className="tsb-projrow-stage">{stage}</span>}
|
||||
<span className="tsb-user-chev"><Icon name="chevron-down" size={13} /></span>
|
||||
</button>
|
||||
<button className="tsb-iconbtn" title="收起侧栏(⌘B)" onClick={onCollapse}><Icon name="panel-left" /></button>
|
||||
</div>
|
||||
|
||||
{/* 单一主创建入口(P6):新建任务 + 次级菜单(新建项目/指定项目新建) */}
|
||||
{/* 主入口创建会话;项目创建保留在次级菜单。 */}
|
||||
<div className="tsb-actions">
|
||||
<div className="tsb-newtask">
|
||||
<button className="tsb-newtask-main" title="在当前项目新建任务(⌘N)" onClick={() => store.createTask()}>
|
||||
<Icon name="plus" size={15} />新建任务{currentProject ? <span className="tsb-newtask-proj">{currentProject.name}</span> : null}
|
||||
<button className="tsb-newtask-main" title="在当前项目新建对话(⌘N)" onClick={() => createConversation()}>
|
||||
<Icon name="plus" size={15} />新建对话
|
||||
</button>
|
||||
<button className="tsb-newtask-caret" title="更多创建选项"
|
||||
onClick={e => { const el = e.currentTarget; setMenu(m => m?.kind === 'new' ? null : { kind: 'new', anchor: el }) }}><Icon name="chevron-down" size={14} /></button>
|
||||
</div>
|
||||
<div className="tsb-search">
|
||||
<Icon name="search" size={14} />
|
||||
<input placeholder="搜索任务…" value={q} onChange={e => setQ(e.target.value)} />
|
||||
<input aria-label="搜索本项目会话" placeholder="搜索对话…" value={q} onChange={e => setQ(e.target.value)} />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* 组织视图切换(P8)+ 过滤 */}
|
||||
<div className="tsb-orgrow">
|
||||
<div className="tsb-pills">
|
||||
<button className={`tsb-pill ${org === 'project' ? 'on' : ''}`} onClick={() => setOrg('project')}>按项目</button>
|
||||
<button className={`tsb-pill ${org === 'timeline' ? 'on' : ''}`} onClick={() => setOrg('timeline')}>时间线</button>
|
||||
</div>
|
||||
<span className="tsb-seclabel" style={{ padding: 0 }}>本项目会话</span>
|
||||
<span style={{ flex: 1 }} />
|
||||
<button className={`tsb-iconbtn ${showArchived ? 'active' : ''}`} title={showArchived ? '隐藏归档' : '查看归档'}
|
||||
onClick={() => { store.setUI({ showArchived: !showArchived }); store.refreshTasks(!showArchived) }}><Icon name="archive" size={15} /></button>
|
||||
</div>
|
||||
|
||||
{/* 中段(方案:会话与搜索)。项目切换在顶部,文件与工作区沉底。 */}
|
||||
<div className="tsb-scroll">
|
||||
{creatingProject && (
|
||||
<div className="tsb-newproject">
|
||||
@@ -155,8 +166,10 @@ export function TaskSidebar() {
|
||||
onChange={e => setNewProjectName(e.target.value)}
|
||||
onKeyDown={async e => {
|
||||
if (e.key === 'Enter' && newProjectName.trim()) {
|
||||
await store.createProject(newProjectName.trim())
|
||||
setCreatingProject(false); setNewProjectName('')
|
||||
try {
|
||||
await store.createProject(newProjectName.trim())
|
||||
setCreatingProject(false); setNewProjectName('')
|
||||
} catch { /* keep the input available for a corrected name */ }
|
||||
}
|
||||
if (e.key === 'Escape') setCreatingProject(false)
|
||||
}}
|
||||
@@ -167,31 +180,36 @@ export function TaskSidebar() {
|
||||
{pinned.length > 0 && (
|
||||
<>
|
||||
<div className="tsb-seclabel">置顶</div>
|
||||
{pinned.map(t => taskRow(t, org === 'timeline' ? projects.find(p => p.id === t.projectId)?.name : undefined))}
|
||||
{pinned.map(t => taskRow(t))}
|
||||
</>
|
||||
)}
|
||||
|
||||
{groups.length === 0 && pinned.length === 0 && (
|
||||
<div className="tsb-empty">尚无任务——点击「新建任务」开始<br />(项目内素材上传、检索与生成全程可在对话中完成)</div>
|
||||
{rest.length === 0 && pinned.length === 0 && (
|
||||
<div className="tsb-empty">{workError ?? '从「新建对话」开始,描述你想完成的工作。'}</div>
|
||||
)}
|
||||
{rest.map(t => taskRow(t))}
|
||||
</div>
|
||||
|
||||
{groups.map(g => (
|
||||
<div key={g.key} className={`tsb-group ${collapsed[g.key] ? 'closed' : ''}`}>
|
||||
{org === 'project' ? (
|
||||
<div className="tsb-group-head" onClick={() => tglGroup(g.key)}>
|
||||
<span className="tsb-chev"><Icon name="chevron-right" size={13} /></span>
|
||||
<span className="tsb-group-name" title={g.label}>{g.label}</span>
|
||||
<span className="tsb-group-cnt">{g.tasks.length}</span>
|
||||
<span style={{ flex: 1 }} />
|
||||
<button className="tsb-group-add" title="项目设置(含跨会话读取)" onClick={e => { e.stopPropagation(); if (g.projectId) store.openProjectSettings(g.projectId) }}><Icon name="settings" size={13} /></button>
|
||||
<button className="tsb-group-add" title="在此项目新建任务" onClick={e => { e.stopPropagation(); store.createTask(g.projectId) }}><Icon name="plus" size={13} /></button>
|
||||
</div>
|
||||
) : (
|
||||
<div className="tsb-seclabel">{g.label}</div>
|
||||
)}
|
||||
{!collapsed[g.key] && g.tasks.map(t => taskRow(t, org === 'timeline' ? projects.find(p => p.id === t.projectId)?.name : undefined))}
|
||||
</div>
|
||||
{/* 底部(方案:文件、工作区、账户沉底)。 */}
|
||||
<div className="tsb-bottom">
|
||||
<button className="tsb-tool" title="文件搜索、预览、编辑与下载" onClick={onFilesOpen}>
|
||||
<span className="tsb-tool-icon"><Icon name="folder" size={14} /></span>
|
||||
<span className="tsb-tool-name">文件</span>
|
||||
{artifacts.length > 0 && <span className="tsb-group-cnt">{artifacts.length}</span>}
|
||||
</button>
|
||||
{tools.map(entry => (
|
||||
<button key={entry.key} className="tsb-tool" title={entry.shortcut} onClick={() => store.openWorkspace(entry.key)}>
|
||||
<span className="tsb-tool-icon">{entry.icon}</span>
|
||||
<span className="tsb-tool-name">{entry.title}</span>
|
||||
<kbd>{entry.shortcut}</kbd>
|
||||
</button>
|
||||
))}
|
||||
{currentProject && (
|
||||
<button className="tsb-tool" onClick={() => store.openProjectSettings(currentProject.id)}>
|
||||
<span className="tsb-tool-icon"><Icon name="settings" size={14} /></span>
|
||||
<span className="tsb-tool-name">项目设置</span>
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
|
||||
{/* 账户区(P7):身份常驻;阶段 1 = API key 即身份(user 即租户 owner) */}
|
||||
@@ -205,16 +223,32 @@ export function TaskSidebar() {
|
||||
<span className="tsb-user-chev"><Icon name="chevron-down" size={13} /></span>
|
||||
</button>
|
||||
<button className="tsb-iconbtn" title="设置" onClick={() => store.openSettings(true)}><Icon name="settings" size={15} /></button>
|
||||
{pendingBadge > 0 && <button className="tsb-iconbtn active" title={`待办 ${pendingBadge}`} onClick={() => store.openInbox()}><Icon name="inbox" size={15} />{pendingBadge}</button>}
|
||||
{pendingBadge > 0 && <button className="tsb-iconbtn active" title={`待办 ${pendingBadge}`} onClick={onWorkOpen}><Icon name="inbox" size={15} />{pendingBadge}</button>}
|
||||
</div>
|
||||
|
||||
{/* 弹出菜单们 */}
|
||||
<Menu anchor={menu?.kind === 'project' ? menu.anchor : null} onClose={() => setMenu(null)}>
|
||||
{projects.map(p => {
|
||||
const count = tasks.filter(t => t.projectId === p.id && !t.archived).length
|
||||
const pstage = projectStateLabel(p.settings) ?? projectStage(p.settings)
|
||||
return (
|
||||
<MenuItem key={p.id} icon="folder" onClick={() => { switchProject(p.id); setMenu(null) }}>
|
||||
{p.name}
|
||||
<kbd>{p.id === currentProjectId ? '当前' : pstage ? `${pstage} · ` : ''}{count} 会话</kbd>
|
||||
</MenuItem>
|
||||
)
|
||||
})}
|
||||
{projects.length === 0 && <div className="tsb-tool-note">还没有项目</div>}
|
||||
<div className="tsb-menu-div" />
|
||||
<MenuItem icon="plus" onClick={() => { setCreatingProject(true); setMenu(null) }}>新建项目…</MenuItem>
|
||||
</Menu>
|
||||
|
||||
<Menu anchor={menu?.kind === 'new' ? menu.anchor : null} onClose={() => setMenu(null)}>
|
||||
<MenuItem icon="plus" onClick={() => { store.createTask(); setMenu(null) }}>新建任务 · 当前项目<kbd>⌘N</kbd></MenuItem>
|
||||
<MenuItem icon="plus" onClick={() => { createConversation(); setMenu(null) }}>新建对话 · 当前项目<kbd>⌘N</kbd></MenuItem>
|
||||
<div className="tsb-menu-div" />
|
||||
<MenuItem icon="folder" onClick={() => { setCreatingProject(true); setMenu(null) }}>新建项目…</MenuItem>
|
||||
{projects.filter(p => p.id !== currentProjectId).slice(0, 6).map(p => (
|
||||
<MenuItem key={p.id} onClick={() => { store.createTask(p.id); setMenu(null) }}>在「{p.name}」新建任务</MenuItem>
|
||||
<MenuItem key={p.id} onClick={() => { createConversation(p.id); setMenu(null) }}>在「{p.name}」新建对话</MenuItem>
|
||||
))}
|
||||
</Menu>
|
||||
|
||||
@@ -226,7 +260,7 @@ export function TaskSidebar() {
|
||||
<MenuItem icon="shield" onClick={() => { store.setCrossFlags(rowTask.id, { crossPrivate: !rowTask.crossPrivate }); setMenu(null) }}>{rowTask.crossPrivate ? '取消私有(可被其他会话读取)' : '设为私有(不被其他会话读取)'}</MenuItem>
|
||||
<MenuItem icon="users" onClick={() => { store.setCrossFlags(rowTask.id, { allowCrossRead: rowTask.allowCrossRead === false }); setMenu(null) }}>{rowTask.allowCrossRead === false ? '开启读取其他会话' : '关闭读取其他会话'}</MenuItem>
|
||||
<div className="tsb-menu-div" />
|
||||
<MenuItem icon="clock" onClick={() => { store.setUI({ taskOrg: 'timeline' }); setMenu(null) }}>按时间线查看</MenuItem>
|
||||
<MenuItem icon="settings" onClick={() => { if (rowTask) store.openProjectSettings(rowTask.projectId); setMenu(null) }}>项目设置</MenuItem>
|
||||
</>}
|
||||
</Menu>
|
||||
|
||||
@@ -240,12 +274,13 @@ export function TaskSidebar() {
|
||||
</div>
|
||||
<div className="tsb-menu-div" />
|
||||
<MenuItem icon="settings" onClick={() => { store.openSettings(true); setMenu(null) }}>偏好设置</MenuItem>
|
||||
<MenuItem icon="inbox" onClick={() => { store.openInbox(); setMenu(null) }}>收件箱{pendingBadge > 0 ? `(待办 ${pendingBadge})` : ''}</MenuItem>
|
||||
<MenuItem icon="inbox" onClick={() => { onWorkOpen(); setMenu(null) }}>待处理事项{pendingBadge > 0 ? `(${pendingBadge})` : ''}</MenuItem>
|
||||
<MenuItem icon="key" onClick={() => { store.setUI({ changePwOpen: true }); setMenu(null) }}>修改密码…</MenuItem>
|
||||
<MenuItem icon={theme === 'dark' ? 'sun' : 'moon'} onClick={() => { store.setUI({ theme: theme === 'dark' ? 'light' : 'dark' }); setMenu(null) }}>
|
||||
{theme === 'dark' ? '切换浅色主题' : '切换深色主题'}
|
||||
</MenuItem>
|
||||
{me?.isAdmin && <MenuItem icon="shield" onClick={() => { store.setUI({ adminZoneOpen: true }); setMenu(null) }}>系统管理…</MenuItem>}
|
||||
<MenuItem icon="moon" onClick={() => { store.setUI({ theme: 'dark' }); setMenu(null) }}>深色主题{theme === 'dark' ? ' · 当前' : ''}</MenuItem>
|
||||
<MenuItem icon="sun" onClick={() => { store.setUI({ theme: 'light' }); setMenu(null) }}>浅色主题{theme === 'light' ? ' · 当前' : ''}</MenuItem>
|
||||
<MenuItem onClick={() => { store.setUI({ theme: 'molv' }); setMenu(null) }}>墨绿主题{theme === 'molv' ? ' · 当前' : ''}</MenuItem>
|
||||
<MenuItem onClick={() => { store.setUI({ theme: 'system' }); setMenu(null) }}>跟随系统{theme === 'system' ? ' · 当前' : ''}</MenuItem>
|
||||
{(me?.isAdmin || adminSections.length > 0) && <MenuItem icon="shield" onClick={() => { store.setUI({ adminZoneOpen: true }); setMenu(null) }}>系统管理…</MenuItem>}
|
||||
{me?.auth && <>
|
||||
<div className="tsb-menu-div" />
|
||||
<MenuItem danger icon="logout" onClick={() => { api.logout().catch(() => undefined); auth.logout() }}>退出登录</MenuItem>
|
||||
|
||||
@@ -0,0 +1,52 @@
|
||||
// Project identity lives in context; the top bar keeps work/files reachable when panes close.
|
||||
import { BrandMark, Icon, pendingCount } from '@ui'
|
||||
import { store, useStore } from '../store'
|
||||
import type { WorkbenchPane } from '../workbenchLayout'
|
||||
|
||||
interface TopBarProps {
|
||||
compact?: boolean
|
||||
activePane?: WorkbenchPane
|
||||
showReturn?: boolean
|
||||
onContext?: () => void
|
||||
onConversation?: () => void
|
||||
onWork?: () => void
|
||||
onFiles?: () => void
|
||||
}
|
||||
|
||||
export function TopBar({ compact = false, activePane = 'conversation', showReturn = false,
|
||||
onContext = store.toggleLeft, onConversation,
|
||||
onWork = () => { store.openInbox(); store.setUI({ inboxFilter: 'all', previewExpanded: false }) }, onFiles = store.openFiles,
|
||||
}: TopBarProps = {}) {
|
||||
const pending = useStore(s => pendingCount(s.cards) + pendingCount(s.projectCards))
|
||||
const ui = useStore(s => s.ui)
|
||||
const returnVisible = showReturn || compact && activePane !== 'conversation'
|
||||
return (
|
||||
<header className={`topbar companion-topbar${compact ? ' compact' : ''}`}>
|
||||
<div className="topbar-identity"><BrandMark size={22} /><span className="topbar-name">工作助手</span></div>
|
||||
<span className="topbar-spacer" />
|
||||
{returnVisible && <button className="shell-return" aria-label="返回对话" onClick={onConversation}>
|
||||
<Icon name="chevron-right" className="shell-back-icon" size={14} /><span>返回对话</span>
|
||||
</button>}
|
||||
<nav className="shell-navigation" aria-label="工作台导航">
|
||||
{compact && <>
|
||||
<button className="shell-nav-button" aria-label="打开上下文" aria-pressed={activePane === 'context'} onClick={onContext}>
|
||||
<Icon name="panel-left" size={15} /><span>上下文</span>
|
||||
</button>
|
||||
<button className="shell-nav-button" aria-label="打开对话" aria-pressed={activePane === 'conversation'} onClick={onConversation}>
|
||||
<Icon name="message" size={15} /><span>对话</span>
|
||||
</button>
|
||||
</>}
|
||||
{(compact || ui.rightCollapsed) && <><button className="shell-nav-button" aria-label="打开工作"
|
||||
aria-pressed={compact ? activePane === 'work' : !ui.rightCollapsed && ui.rightTab === 'work'}
|
||||
title={pending > 0 ? `${pending} 项待处理` : '工作'} onClick={onWork}>
|
||||
<Icon name="inbox" size={15} /><span>工作</span>
|
||||
{pending > 0 && <span className="shell-pending" data-testid="topbar-pending">{pending > 99 ? '99+' : pending}</span>}
|
||||
</button>
|
||||
<button className="shell-nav-button" aria-label="打开文件"
|
||||
aria-pressed={compact ? activePane === 'files' : !ui.rightCollapsed && ui.rightTab === 'files'} onClick={onFiles}>
|
||||
<Icon name="folder" size={15} /><span>文件</span>
|
||||
</button></>}
|
||||
</nav>
|
||||
</header>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,50 @@
|
||||
import { useEffect, useMemo, useState } from 'react'
|
||||
import { SafeMarkdown } from '@ui'
|
||||
import type { StreamEvent } from '../contracts'
|
||||
import { loadRunEvents } from '../runEvents'
|
||||
import { store, useStore } from '../store'
|
||||
import { runEventsToTimeline } from '../live'
|
||||
import { mergeProcessTimeline } from '../messageparts'
|
||||
import { ProcessTimeline } from './ProcessTimeline'
|
||||
import { MessageTimestamp } from './MessageTimestamp'
|
||||
|
||||
/** The work pane and inline fallback share one selection. Only this detail host
|
||||
* reads that run's authorized durable events; opening a record never adds chat. */
|
||||
export function WorkExecutionRecord() {
|
||||
const selected = useStore(s => s.workRecord)
|
||||
const conversationId = useStore(s => s.currentConvId)
|
||||
const messages = useStore(s => s.messages)
|
||||
const run = useStore(s => s.runs.find(r => r.id === selected?.runId))
|
||||
const [result, setResult] = useState<{ runId: string; events: StreamEvent[] } | null>(null)
|
||||
const [failed, setFailed] = useState(false)
|
||||
useEffect(() => {
|
||||
if (!selected || selected.conversationId !== conversationId) return
|
||||
const controller = new AbortController()
|
||||
let active = true
|
||||
setResult(null); setFailed(false)
|
||||
void (async () => {
|
||||
try {
|
||||
const events = await loadRunEvents(selected.conversationId, selected.runId, controller.signal)
|
||||
if (active) setResult({ runId: selected.runId, events })
|
||||
} catch { if (active) setFailed(true) }
|
||||
})()
|
||||
return () => { active = false; controller.abort() }
|
||||
}, [selected?.runId, selected?.conversationId, conversationId, run?.status, run?.endedAt])
|
||||
const parts = useMemo(() => {
|
||||
if (!selected || result?.runId !== selected.runId) return []
|
||||
const saved = messages.filter(message => message.runId === selected.runId && message.role === 'assistant')
|
||||
.flatMap(message => message.parts).map(part => ({ ...part, process: true }))
|
||||
return mergeProcessTimeline(saved, runEventsToTimeline(result.events, selected.runId, true), [])
|
||||
}, [messages, result, selected?.runId])
|
||||
if (!selected || selected.conversationId !== conversationId) return null
|
||||
return <section className="work-execution-record" aria-label={`${selected.title}的执行记录`}>
|
||||
<div className="work-record-heading"><strong>{selected.title} · 执行记录</strong>
|
||||
<button type="button" className="btn ghost" onClick={() => store.closeWorkRecord()}>返回工作</button></div>
|
||||
<MessageTimestamp value={run?.createdAt} />
|
||||
{failed ? <p role="status">完整记录暂不可用,请稍后重新打开</p>
|
||||
: !result ? <p role="status">正在读取已保存的记录…</p>
|
||||
: parts.length === 0 ? <p>这项工作没有已保存的过程输出</p>
|
||||
: <ProcessTimeline parts={parts} live={false} idKey={`work-record:${selected.runId}`}
|
||||
renderPart={part => <SafeMarkdown className="part-text" markdown={part.text ?? ''} breaks />} />}
|
||||
</section>
|
||||
}
|
||||
+117
-36
@@ -1,12 +1,18 @@
|
||||
// 右栏:收件箱与文件。文件预览在对话右侧的预览区,不再占右栏页签。
|
||||
// 右栏(第三栏):「工作 / 文件」双入口。
|
||||
// 工作 = 当前任务卡 + 收件箱(待处理事项、后台任务卡、执行记录);
|
||||
// 文件 = 文件列表(搜索/上传)与多标签预览(预览、编辑、下载)——预览不再是独立第四栏。
|
||||
import { store, useStore } from '../store'
|
||||
import type { Run } from '../contracts'
|
||||
import { InboxList, pendingCount, type ActivityCard, type DocBridge } from '@ui'
|
||||
import { Icon } from '@ui'
|
||||
import type { Run, WorkCardAction } from '../contracts'
|
||||
import { InboxList, pendingCount, type ActivityCard, type DocBridge, type InboxFilter } from '@ui'
|
||||
import { Icon, SurfaceView } from '@ui'
|
||||
import { previewTabsKey } from '../previewtabs'
|
||||
import { surfaceKey } from '../surfaceKey'
|
||||
import { ArtifactsPanel } from './ArtifactsPanel'
|
||||
import { PreviewPane } from './PreviewPane'
|
||||
import { WorkExecutionRecord } from './WorkExecutionRecord'
|
||||
|
||||
// 工件解析/打开注入:渲染器纯展示,doc-ref 词汇经此桥接本仓状态(D29)。
|
||||
// 打开语义走 requestPreview 唯一入口(预览区)。
|
||||
// 打开语义走 requestPreview 唯一入口(第三栏「文件」入口)。
|
||||
export const docBridge: DocBridge = {
|
||||
resolveDoc: id => store.getState().artifacts.find(a => a.id === id),
|
||||
onOpenDoc: id => {
|
||||
@@ -16,7 +22,10 @@ export const docBridge: DocBridge = {
|
||||
}
|
||||
|
||||
const inboxCallbacks = {
|
||||
onAction: (c: ActivityCard, id: string) => store.cardAction(c, id),
|
||||
onAction: (c: ActivityCard, id: string, payload?: WorkCardAction) => store.cardAction(c, id, payload),
|
||||
onOpenRecord: (c: ActivityCard) => store.openWorkRecord(c),
|
||||
onReference: (c: ActivityCard) => store.referenceWork(c),
|
||||
actionState: (c: ActivityCard) => store.getState().cardActionStates[c.id],
|
||||
onPin: (c: ActivityCard, p: boolean) => store.cardPin(c, p),
|
||||
onDismiss: (c: ActivityCard) => store.cardDismiss(c),
|
||||
onLocate: (c: ActivityCard) => store.locateMessage(c.anchorMessageId),
|
||||
@@ -24,7 +33,7 @@ const inboxCallbacks = {
|
||||
}
|
||||
|
||||
/** 项目收件箱视图(CF3/D49/D51):项目级卡片 ∪ 其他会话待办(done 不聚合)。 */
|
||||
function ProjectInbox({ cards }: { cards: ActivityCard[] }) {
|
||||
function ProjectInbox({ cards, filter }: { cards: ActivityCard[]; filter: InboxFilter }) {
|
||||
const own = cards.filter(c => !c.conversationId)
|
||||
const cross = cards.filter(c => !!c.conversationId)
|
||||
if (cards.length === 0) {
|
||||
@@ -34,12 +43,12 @@ function ProjectInbox({ cards }: { cards: ActivityCard[] }) {
|
||||
<>
|
||||
<div className="inbox-zone-label">📁 项目级卡片(跨会话可见)</div>
|
||||
{own.length > 0
|
||||
? <InboxList cards={own} callbacks={inboxCallbacks} docBridge={docBridge} />
|
||||
? <InboxList cards={own} callbacks={inboxCallbacks} docBridge={docBridge} filter={filter} />
|
||||
: <div className="inbox-empty" style={{ padding: '4px 14px' }}>暂无——会话卡点 🗂 即留档至此</div>}
|
||||
{cross.length > 0 && (
|
||||
<>
|
||||
<div className="inbox-zone-label">🕓 其他会话待办</div>
|
||||
<InboxList cards={cross} callbacks={inboxCallbacks} docBridge={docBridge} showPinnedZone={false} />
|
||||
<InboxList cards={cross} callbacks={inboxCallbacks} docBridge={docBridge} showPinnedZone={false} filter={filter} />
|
||||
</>
|
||||
)}
|
||||
</>
|
||||
@@ -47,44 +56,84 @@ function ProjectInbox({ cards }: { cards: ActivityCard[] }) {
|
||||
}
|
||||
|
||||
export function Workbench() {
|
||||
// Subscribe to shared feedback even when no card object has changed yet.
|
||||
useStore(s => s.cardActionStates)
|
||||
const rightTab = useStore(s => s.ui.rightTab)
|
||||
const cards = useStore(s => s.cards)
|
||||
const plan = useStore(s => s.plan)
|
||||
const todos = useStore(s => s.todos)
|
||||
const inboxScope = useStore(s => s.inboxScope)
|
||||
const projectCards = useStore(s => s.projectCards)
|
||||
const pending = pendingCount(cards) + pendingCount(projectCards)
|
||||
const rightTab = useStore(s => s.ui.rightTab)
|
||||
|
||||
const showFiles = rightTab === 'files'
|
||||
const filter = useStore(s => s.ui.inboxFilter)
|
||||
const visible = inboxScope === 'project' ? projectCards : cards
|
||||
const pending = pendingCount(visible)
|
||||
const unread = visible.filter(card => card.work && card.work.resultVersion > card.work.readVersion).length
|
||||
// 离开文件入口时收回全屏展开,避免出现「工作」铺满主区的怪态。
|
||||
const switchTab = (tab: 'work' | 'files') =>
|
||||
store.setUI({ rightTab: tab, previewExpanded: tab === 'files' ? store.getState().ui.previewExpanded : false })
|
||||
return (
|
||||
<>
|
||||
<div className="tabs">
|
||||
<button className={`tab ${!showFiles ? 'active' : ''}`} onClick={() => store.setUI({ rightTab: 'inbox' })}
|
||||
title="收件箱">收件箱{pending > 0 ? ` ${pending}` : ''}</button>
|
||||
<button className={`tab ${showFiles ? 'active' : ''}`} onClick={() => store.setUI({ rightTab: 'files', rightCollapsed: false })}
|
||||
title="文件(与 ⌘1 工件面板同一份列表)">文件</button>
|
||||
<button className={`tab ${rightTab === 'work' ? 'active' : ''}`} onClick={() => switchTab('work')}
|
||||
title="待处理事项、后台任务与执行记录">工作{pending > 0 ? ` ${pending}` : ''}{unread > 0 ? ` · ${unread} 项新结果` : ''}</button>
|
||||
<button className={`tab ${rightTab === 'files' ? 'active' : ''}`} onClick={() => switchTab('files')}
|
||||
title="文件搜索、预览、编辑与下载">文件</button>
|
||||
<span className="spacer" style={{ flex: 1 }} />
|
||||
<button className="tab tab-action" title="收纳已完成卡(done→关闭;已确认卡留痕不动)" onClick={() => store.tidyCards()}><Icon name="check" size={13} /> 收纳</button>
|
||||
<button className="tab" title="收起收件箱" onClick={store.toggleRight}><Icon name="chevron-right" size={14} /></button>
|
||||
{rightTab === 'work' && (
|
||||
<button className="tab tab-action" title="收纳已完成卡(done→关闭;已确认卡留痕不动)" onClick={() => store.tidyCards()}><Icon name="check" size={13} /> 收纳</button>
|
||||
)}
|
||||
<button className="tab" title="收起右栏" onClick={store.toggleRight}><Icon name="chevron-right" size={14} /></button>
|
||||
</div>
|
||||
{showFiles ? (
|
||||
<div className="tab-body">
|
||||
<ArtifactsPanel />
|
||||
{rightTab === 'files'
|
||||
? <FilesTab />
|
||||
: <WorkTab plan={plan} todos={todos} filter={filter} inboxScope={inboxScope} projectCards={projectCards} cards={cards} />}
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
/** 文件入口:有预览标签且处于预览子视图时展示预览;否则展示文件列表(搜索/上传)。 */
|
||||
function FilesTab() {
|
||||
const previewOpen = useStore(s => (s.previewTabs[previewTabsKey(s.currentConvId)]?.length ?? 0) > 0)
|
||||
const filesView = useStore(s => s.ui.filesView)
|
||||
if (previewOpen && filesView === 'preview') return <PreviewPane />
|
||||
return <div className="tab-body"><ArtifactsPanel /></div>
|
||||
}
|
||||
|
||||
/** U1:同会话存在后台 progress 卡(进行中/待确认)时,progress 为权威对象,隐藏 CurrentTaskCard 避免双标题。 */
|
||||
export function hasActiveProgressCard(cards: ActivityCard[]): boolean {
|
||||
return cards.some(c => c.kind === 'progress' && (c.status === 'active' || c.status === 'action_required'))
|
||||
}
|
||||
|
||||
function WorkTab({ plan, todos, filter, inboxScope, projectCards, cards }: {
|
||||
plan: Parameters<typeof CurrentTaskCard>[0]['plan']
|
||||
todos: Parameters<typeof CurrentTaskCard>[0]['todos']
|
||||
filter: InboxFilter
|
||||
inboxScope: 'conv' | 'project'
|
||||
projectCards: ActivityCard[]
|
||||
cards: ActivityCard[]
|
||||
}) {
|
||||
const record = useStore(s => s.workRecord)
|
||||
const showCurrentTask = !hasActiveProgressCard(cards)
|
||||
return (
|
||||
<>
|
||||
<div className="tab-body" data-work-scroll>
|
||||
{record ? <WorkExecutionRecord /> : <>
|
||||
{showCurrentTask ? <CurrentTaskCard plan={plan} todos={todos} /> : null}
|
||||
<div className="inbox-scope" role="tablist" aria-label="收件箱范围与筛选">
|
||||
<button className={inboxScope === 'conv' ? 'active' : ''} onClick={() => store.setInboxScope('conv')}>本会话</button>
|
||||
<button className={inboxScope === 'project' ? 'active' : ''} onClick={() => store.setInboxScope('project')}>
|
||||
项目{pendingCount(projectCards) > 0 ? ` ${pendingCount(projectCards)}` : ''}
|
||||
</button>
|
||||
<span style={{ flex: 1 }} />
|
||||
<button className={filter === 'todo' ? 'active' : ''} title="只看待处理" onClick={() => store.setUI({ inboxFilter: 'todo' })}>待处理</button>
|
||||
<button className={filter === 'all' ? 'active' : ''} title="全部卡片" onClick={() => store.setUI({ inboxFilter: 'all' })}>全部</button>
|
||||
</div>
|
||||
) : (
|
||||
<div className="tab-body">
|
||||
<CurrentTaskCard plan={plan} todos={todos} />
|
||||
<div className="inbox-scope" role="tablist" aria-label="收件箱范围">
|
||||
<button className={inboxScope === 'conv' ? 'active' : ''} onClick={() => store.setInboxScope('conv')}>本会话</button>
|
||||
<button className={inboxScope === 'project' ? 'active' : ''} onClick={() => store.setInboxScope('project')}>
|
||||
项目{pendingCount(projectCards) > 0 ? ` ${pendingCount(projectCards)}` : ''}
|
||||
</button>
|
||||
</div>
|
||||
{inboxScope === 'project'
|
||||
? <ProjectInbox cards={projectCards} />
|
||||
: <InboxList cards={cards} docBridge={docBridge} callbacks={inboxCallbacks} />}
|
||||
</div>
|
||||
)}
|
||||
{inboxScope === 'project'
|
||||
? <ProjectInbox cards={projectCards} filter={filter} />
|
||||
: <InboxList cards={cards} docBridge={docBridge} callbacks={inboxCallbacks} filter={filter} />}
|
||||
<WorkspaceSurfaces />
|
||||
</>}
|
||||
</div>
|
||||
</>
|
||||
)
|
||||
}
|
||||
@@ -141,3 +190,35 @@ export function AgentRow({ run, depth }: { run: Run; depth: number }) {
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
// U6 工作区任务页容器:会话内页面在"工作"入口的常驻紧凑视图——默认显示最新
|
||||
// 一页,固定(pin)后不随新页面抢占;关闭插件后此处自然消失(surfaces 为空),
|
||||
// 收件箱/任务卡等原有内容不受影响(禁用回退完整性)。点击标题去文件预览全屏。
|
||||
function WorkspaceSurfaces() {
|
||||
const surfaces = useStore(s => s.surfaces)
|
||||
const pin = useStore(s => s.ui.workspaceSurfacePin)
|
||||
const usable = surfaces.filter(x => surfaceKey(x) != null)
|
||||
if (usable.length === 0) return null
|
||||
const shown = pin ? usable.find(x => surfaceKey(x) === pin) : usable[usable.length - 1]
|
||||
if (!shown) return null
|
||||
const shownId = surfaceKey(shown)!
|
||||
return (
|
||||
<div className="workspace-surfaces" data-workspace-surfaces>
|
||||
<div className="ws-head">
|
||||
<span className="ws-title">任务页面</span>
|
||||
<span className="ws-meta">{shown.spec?.title || '(未命名)'} · 修订 {shown.revision}</span>
|
||||
<span style={{ flex: 1 }} />
|
||||
<button className="icon-btn" title={pin ? '取消固定(跟随最新)' : '固定此页(新页面不抢占)'}
|
||||
onClick={() => store.setUI({ workspaceSurfacePin: pin ? null : shownId })}>
|
||||
{pin ? '📍' : '📌'}
|
||||
</button>
|
||||
<button className="icon-btn" title="在文件预览中打开" onClick={() => store.openSurface(shownId)}>
|
||||
↗
|
||||
</button>
|
||||
</div>
|
||||
<div className="ws-body">
|
||||
<SurfaceView snapshot={shown} />
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -1,31 +1,24 @@
|
||||
// 工作区弹层(提案 T4/D25):工件/代理 经 OverlayHost 呈现。
|
||||
// 重设计方案 阶段②(IA 对话优先):插件面板/服务端声明工作区属系统能力,
|
||||
// 只进「系统管理」分区(AdminZone),不占普通用户的 ⌘1–9;清单按角色收窄。
|
||||
// 工作区弹层(提案 T4/D25):深读经 OverlayHost 单层呈现。
|
||||
// 服务端声明的工作区(领域插件槽位)对所有用户可见;插件管理面板仍只在系统管理区。
|
||||
// 文件浏览已并入第三栏「文件」入口,本弹层只承载代理与领域工作区。
|
||||
import { store, useStore } from '../store'
|
||||
import type { Run } from '../contracts'
|
||||
import { OverlayHost, type DocBridge } from '@ui'
|
||||
import { docBridge } from './Workbench'
|
||||
import { AgentRow } from './Workbench'
|
||||
import { ArtifactsPanel } from './ArtifactsPanel'
|
||||
import { buildWorkspaceEntries, type WorkspaceEntry } from '../workspaces'
|
||||
import { RdmAuditWorkspace } from './RdmAuditWorkspace'
|
||||
import { DocumentCockpit } from './DocumentCockpit'
|
||||
|
||||
/** 工作区清单(顺序即 ⌘ 序号):内置在前,插件面板/声明工作区仅管理员可见。 */
|
||||
export function workspaceEntries(): { key: string; title: string; icon: string; shortcut: string }[] {
|
||||
/** 体系工具(顺序即 ⌘ 序号)。服务端工作区全员可见;插件管理面板只在系统管理区。
|
||||
* 追溯审计按命令面能力显隐(增量 2):store.rdmAuditAvailable 为 true 才入列。 */
|
||||
export function workspaceEntries(): WorkspaceEntry[] {
|
||||
const s = store.getState()
|
||||
const admin = !!s.me?.isAdmin
|
||||
const out = [
|
||||
{ key: 'artifacts', title: '工件', icon: '📦', shortcut: '⌘1' },
|
||||
{ key: 'agents', title: '代理', icon: '🤖', shortcut: '⌘2' },
|
||||
...(admin ? [
|
||||
...s.pluginPanels.map((p, i) => ({ key: `plugin:${p.id}`, title: p.title, icon: '🧩', shortcut: `⌘${i + 3}` })),
|
||||
...s.serverWorkspaces.map((w, i) => ({ key: `ws:${w.id}`, title: w.title, icon: w.icon || '🗂', shortcut: w.shortcut ? `⌘${w.shortcut}` : `⌘${i + 3 + s.pluginPanels.length}` })),
|
||||
] : []),
|
||||
]
|
||||
return out.slice(0, 9)
|
||||
return buildWorkspaceEntries(s.serverWorkspaces, { rdmAudit: s.rdmAuditAvailable, rdmCockpit: s.rdmCockpitAvailable })
|
||||
}
|
||||
|
||||
export function Workspaces() {
|
||||
const active = useStore(s => s.ui.activeWorkspace)
|
||||
const artifacts = useStore(s => s.artifacts)
|
||||
const runs = useStore(s => s.runs)
|
||||
const pluginPanels = useStore(s => s.pluginPanels)
|
||||
const serverWorkspaces = useStore(s => s.serverWorkspaces)
|
||||
@@ -33,17 +26,22 @@ export function Workspaces() {
|
||||
const entry = workspaceEntries().find(e => e.key === active)
|
||||
const close = () => store.closeWorkspace()
|
||||
|
||||
if (active === 'artifacts') {
|
||||
return <OverlayHost title="工件" icon="📦" shortcut="⌘1" badge={artifacts.length || undefined} onClose={close}>
|
||||
<ArtifactsPanel />
|
||||
</OverlayHost>
|
||||
}
|
||||
if (active === 'agents') {
|
||||
const convRuns = runs.filter(r => r.kind !== 'tool')
|
||||
return <OverlayHost title="代理" icon="🤖" shortcut="⌘2" onClose={close}>
|
||||
return <OverlayHost title="代理" icon="🤖" shortcut={entry?.shortcut ?? '⌘2'} sayHint="打开代理" onClose={close}>
|
||||
<AgentsPanel runs={convRuns} />
|
||||
</OverlayHost>
|
||||
}
|
||||
if (active === 'rdm-audit') {
|
||||
return <OverlayHost title="追溯审计" icon="🔍" shortcut={entry?.shortcut} sayHint="打开追溯审计" onClose={close}>
|
||||
<RdmAuditWorkspace />
|
||||
</OverlayHost>
|
||||
}
|
||||
if (active === 'rdm-cockpit') {
|
||||
return <OverlayHost title="文档驾驶舱" icon="📋" shortcut={entry?.shortcut} sayHint="打开文档驾驶舱" onClose={close}>
|
||||
<DocumentCockpit />
|
||||
</OverlayHost>
|
||||
}
|
||||
if (active.startsWith('plugin:')) {
|
||||
const panel = pluginPanels.find(p => `plugin:${p.id}` === active)
|
||||
return <OverlayHost title={panel?.title ?? '插件面板'} icon="🧩" onClose={close}
|
||||
@@ -51,7 +49,8 @@ export function Workspaces() {
|
||||
}
|
||||
if (active.startsWith('ws:')) {
|
||||
const ws = serverWorkspaces.find(w => `ws:${w.id}` === active)
|
||||
return <OverlayHost title={ws?.title ?? '工作区'} icon={ws?.icon || '🗂'} shortcut={entry?.shortcut} onClose={close}
|
||||
const title = ws?.title ?? '工作区'
|
||||
return <OverlayHost title={title} icon={ws?.icon || '🗂'} shortcut={entry?.shortcut} sayHint={`打开${title}`} onClose={close}
|
||||
nodes={ws?.body ?? []} docBridge={docBridge as DocBridge} onRefresh={() => store.refreshPlugins()} />
|
||||
}
|
||||
return null
|
||||
|
||||
@@ -0,0 +1,476 @@
|
||||
// U6/KTD5:RDM 管理与项目页面组件。系统管理「RDM 角色权限」+ 项目设置「成员 /
|
||||
// 文档职责」。全部数据经 api.rdmCommand(命令总线),载荷构造与能力
|
||||
// 门控集中在 src/rdmManagement.ts;分区可见性由 AdminZone/ProjectSettingsModal
|
||||
// 按 store 的 rdm*Available 门控(命令面不齐不渲染,普通基座零暴露)。样式只复用
|
||||
// 既有 ad-*/lg-*/settings-* 类(design-guard 棘轮:不新增裸色值/字号)。
|
||||
import { useEffect, useState, useRef, useCallback } from 'react'
|
||||
import { api } from '../api'
|
||||
import type { Project } from '../contracts'
|
||||
import { projectWorkError } from '../projectmeta'
|
||||
import { useStore } from '../store'
|
||||
import { Btn, Collapsible, EmptyState, Icon, Picker } from '@ui'
|
||||
import {
|
||||
ROLE_ACTIONS,
|
||||
roleCreatePayload, roleActionPayload, roleAssignPayload, roleDisablePayload,
|
||||
memberAddPayload, memberRemovePayload, memberSetRolePayload,
|
||||
permCheckPayload, describeSource,
|
||||
rolesListPlaceholder, describeRoleListError,
|
||||
} from '../rdmManagement'
|
||||
|
||||
// ---- 系统管理:RDM 角色权限(仅管理员 + rdmRolesAvailable) ----
|
||||
|
||||
interface RoleView {
|
||||
roleId: string
|
||||
name: string
|
||||
disabled: boolean
|
||||
version: number
|
||||
actions: Record<string, [boolean, boolean]> | null
|
||||
accounts: string[] | null
|
||||
}
|
||||
|
||||
export function RdmRolesPanel() {
|
||||
const me = useStore(s => s.me)
|
||||
const [roles, setRoles] = useState<RoleView[] | null>(null)
|
||||
const [err, setErr] = useState('')
|
||||
const [notice, setNotice] = useState('')
|
||||
const [busy, setBusy] = useState(false)
|
||||
const [newName, setNewName] = useState('')
|
||||
// 动作编辑器
|
||||
const [editRole, setEditRole] = useState('')
|
||||
const [editAction, setEditAction] = useState<string>(ROLE_ACTIONS[0])
|
||||
const [editDef, setEditDef] = useState(false)
|
||||
const [editCap, setEditCap] = useState(true)
|
||||
// 绑定
|
||||
const [assignOwner, setAssignOwner] = useState('')
|
||||
|
||||
const refresh = async () => {
|
||||
try {
|
||||
const out = await api.rdmCommand<{ roles: RoleView[] }>('rdm.role.list')
|
||||
setErr(''); setRoles(out.roles ?? [])
|
||||
} catch (e) { setRoles(null); setErr(describeRoleListError(String(e))) }
|
||||
}
|
||||
useEffect(() => { refresh() }, [])
|
||||
|
||||
const run = async (label: string, fn: () => Promise<unknown>) => {
|
||||
setErr(''); setNotice(''); setBusy(true)
|
||||
try { await fn(); setNotice(label); await refresh() }
|
||||
catch (e) { setErr(describeRoleListError(String(e))) } finally { setBusy(false) }
|
||||
}
|
||||
|
||||
if (!me?.isAdmin) return <EmptyState icon="shield">仅平台管理员可管理专业角色</EmptyState>
|
||||
|
||||
// 占位行单一出口:加载中仅在无错误时成立(拒绝后永远转圈是误导——见
|
||||
// rolesListPlaceholder 注释)。
|
||||
const placeholder = rolesListPlaceholder(roles, err)
|
||||
|
||||
const sel = roles?.find(r => r.roleId === editRole)
|
||||
const editCurrent = sel?.actions?.[editAction]
|
||||
|
||||
return (
|
||||
<div>
|
||||
<div className="ad-create">
|
||||
<div className="ad-row">
|
||||
<input className="lg-input" placeholder="新角色名(如:编制工程师)" value={newName}
|
||||
onChange={e => setNewName(e.target.value)} />
|
||||
<button className="lg-submit ad-create-btn" disabled={busy || !newName.trim()}
|
||||
onClick={() => run(`已创建角色 ${newName.trim()}`, async () => {
|
||||
await api.rdmCommand('rdm.role.create', roleCreatePayload(newName.trim()))
|
||||
setNewName('')
|
||||
})}>创建角色</button>
|
||||
</div>
|
||||
<p className="ad-hint">新角色动作未配置=全部拒绝(fail-closed),创建后经下方编辑器逐动作配置默认与上限。</p>
|
||||
</div>
|
||||
|
||||
<table className="ad-table">
|
||||
<thead><tr><th>角色</th><th>状态</th><th>版本</th><th>动作配置</th><th>绑定账号</th><th></th></tr></thead>
|
||||
<tbody>
|
||||
{(roles ?? []).map(r => (
|
||||
<tr key={r.roleId}>
|
||||
<td><span className="ad-mono">{r.name}</span><br /><span className="ad-dim">{r.roleId}</span></td>
|
||||
<td>{r.disabled ? <span className="ad-chip ad-chip-warn">已停用</span> : <span className="ad-chip">生效</span>}</td>
|
||||
<td className="ad-dim">v{r.version}</td>
|
||||
<td>{Object.keys(r.actions ?? {}).length} 项</td>
|
||||
<td className="ad-mono">{(r.accounts ?? []).join('、') || '—'}</td>
|
||||
<td><button className="ad-mini" disabled={busy}
|
||||
onClick={() => run(r.disabled ? `已启用 ${r.name}` : `已停用 ${r.name}(绑定账号回落内置默认)`,
|
||||
() => api.rdmCommand('rdm.role.disable', roleDisablePayload(r.roleId, !r.disabled)))}>
|
||||
{r.disabled ? '启用' : '停用'}</button></td>
|
||||
</tr>
|
||||
))}
|
||||
{roles !== null && roles.length === 0 && <tr><td colSpan={6} className="ad-dim">暂无专业角色</td></tr>}
|
||||
{placeholder && <tr><td colSpan={6} className="ad-dim">{placeholder}</td></tr>}
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<h4 className="settings-group-title" style={{ marginTop: 18 }}>动作配置(默认 ∩ 上限)</h4>
|
||||
<div className="ad-row">
|
||||
<select className="lg-input" value={editRole} onChange={e => setEditRole(e.target.value)}>
|
||||
<option value="">选择角色…</option>
|
||||
{(roles ?? []).map(r => <option key={r.roleId} value={r.roleId}>{r.name}</option>)}
|
||||
</select>
|
||||
<select className="lg-input" value={editAction}
|
||||
onChange={e => {
|
||||
setEditAction(e.target.value)
|
||||
const cur = sel?.actions?.[e.target.value]
|
||||
setEditDef(!!cur?.[0]); setEditCap(cur ? cur[1] : true)
|
||||
}}>
|
||||
{ROLE_ACTIONS.map(a => <option key={a} value={a}>{a}</option>)}
|
||||
</select>
|
||||
<label className="ad-check"><input type="checkbox" checked={editDef}
|
||||
onChange={e => setEditDef(e.target.checked)} />默认允许</label>
|
||||
<label className="ad-check"><input type="checkbox" checked={editCap}
|
||||
onChange={e => setEditCap(e.target.checked)} />上限允许</label>
|
||||
<button className="lg-submit ad-create-btn" disabled={busy || !editRole}
|
||||
onClick={() => run(`已配置 ${editRole} · ${editAction}`,
|
||||
() => api.rdmCommand('rdm.role.action', roleActionPayload(editRole, editAction, editDef, editCap)))}>保存动作</button>
|
||||
</div>
|
||||
{sel && editCurrent && <p className="ad-hint">当前值:默认={String(editCurrent[0])},上限={String(editCurrent[1])}</p>}
|
||||
|
||||
<h4 className="settings-group-title" style={{ marginTop: 18 }}>绑定账号(每账号一个生效角色)</h4>
|
||||
<div className="ad-row">
|
||||
<input className="lg-input lg-mono" placeholder="账号(owner)" value={assignOwner}
|
||||
onChange={e => setAssignOwner(e.target.value)} />
|
||||
<select className="lg-input" value={editRole} onChange={e => setEditRole(e.target.value)}>
|
||||
<option value="">选择角色…</option>
|
||||
{(roles ?? []).filter(r => !r.disabled).map(r => <option key={r.roleId} value={r.roleId}>{r.name}</option>)}
|
||||
</select>
|
||||
<button className="lg-submit ad-create-btn" disabled={busy || !assignOwner.trim() || !editRole}
|
||||
onClick={() => run(`已把 ${assignOwner.trim()} 绑定到 ${editRole}`,
|
||||
() => api.rdmCommand('rdm.role.assign', roleAssignPayload(assignOwner.trim(), editRole)))}>绑定</button>
|
||||
</div>
|
||||
|
||||
{notice && <div className="ad-notice"><Icon name="check" size={14} />{notice}</div>}
|
||||
{err && <div className="lg-err"><Icon name="alert" size={14} />{err}</div>}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
// ---- 项目设置:成员(P7:可搜索人员选择器 + 专业角色/项目身份两列 + 显式身份调整)----
|
||||
|
||||
interface MemberRow {
|
||||
owner: string; role: string; addedBy: string; addedAt: string
|
||||
profRole?: { roleId: string; name: string } | null
|
||||
}
|
||||
|
||||
export function RdmMembersSection({ project }: { project: Project }) {
|
||||
const projectId = project.id
|
||||
const writeError = projectWorkError(project)
|
||||
const cmd = <T,>(id: string, params: Record<string, unknown> = {}) => api.rdmProjectCommand<T>(project, id, params)
|
||||
const [rows, setRows] = useState<MemberRow[] | null>(null)
|
||||
const [err, setErr] = useState('')
|
||||
const [notice, setNotice] = useState('')
|
||||
const [busy, setBusy] = useState(false)
|
||||
const [picked, setPicked] = useState<string[]>([])
|
||||
const [role, setRole] = useState<'member' | 'owner'>('member')
|
||||
// 成员表经 ref 参与取数(已加入标记),保持 fetchPage 身份稳定(Picker 依赖)。
|
||||
const rowsRef = useRef<MemberRow[] | null>(null)
|
||||
rowsRef.current = rows
|
||||
|
||||
/** 人员选择器取数适配(P7-A):rdm.account.list 目录(member.manage 生效者)。
|
||||
* query 透传后端(基座升级 AccountSearcher 后全量生效);旧基座忽略 query 时
|
||||
* 对首页做本地包含匹配降级(翻页为浏览模式,不过滤)。 */
|
||||
const fetchPage = useCallback(async (query: string, cursor: string, limit: number) => {
|
||||
const out = await cmd<{ accounts?: { owner: string; name?: string; valid: boolean }[]; next?: string }>(
|
||||
'rdm.account.list', { projectId, cursor, limit, query })
|
||||
const joined = new Set((rowsRef.current ?? []).map(m => m.owner))
|
||||
let items = (out.accounts ?? []).filter(a => a.valid).map(a => ({
|
||||
id: a.owner,
|
||||
title: a.name || a.owner,
|
||||
subtitle: a.owner,
|
||||
badge: joined.has(a.owner) ? '已加入' : undefined,
|
||||
}))
|
||||
if (query !== '' && cursor === '') {
|
||||
const q = query.toLowerCase()
|
||||
items = items.filter(it => it.id.toLowerCase().includes(q) || it.title.toLowerCase().includes(q))
|
||||
}
|
||||
return { items, nextCursor: out.next || undefined }
|
||||
}, [project])
|
||||
|
||||
const refresh = async () => {
|
||||
try {
|
||||
const out = await cmd<{ members: MemberRow[] }>('rdm.project.member.list', { projectId })
|
||||
setRows(out.members ?? [])
|
||||
} catch (e) { setErr(String(e)) }
|
||||
}
|
||||
useEffect(() => { setPicked([]); refresh() }, [project])
|
||||
|
||||
const run = async (label: string, fn: () => Promise<unknown>) => {
|
||||
setErr(''); setNotice(''); setBusy(true)
|
||||
try { await fn(); setNotice(label); await refresh() }
|
||||
catch (e) { setErr(String(e)) } finally { setBusy(false) }
|
||||
}
|
||||
|
||||
const pickedId = picked[0] ?? ''
|
||||
|
||||
return (
|
||||
<div>
|
||||
{writeError && <p className="ad-hint">{writeError}</p>}
|
||||
<div className="ad-create">
|
||||
<div className="ad-row">
|
||||
<Picker
|
||||
aria-label="选择人员"
|
||||
selected={picked}
|
||||
onSelect={setPicked}
|
||||
fetchPage={fetchPage}
|
||||
placeholder="输入账号或姓名,或浏览候选…"
|
||||
/>
|
||||
<select className="lg-input" value={role} onChange={e => setRole(e.target.value as 'member' | 'owner')}>
|
||||
<option value="member">项目成员</option>
|
||||
<option value="owner">项目负责人</option>
|
||||
</select>
|
||||
<button className="lg-submit ad-create-btn" disabled={busy || !!writeError || !pickedId}
|
||||
onClick={() => run(`已添加 ${pickedId}`, async () => {
|
||||
await cmd('rdm.project.member.add', memberAddPayload(projectId, pickedId, role))
|
||||
setPicked([])
|
||||
})}>添加成员</button>
|
||||
</div>
|
||||
<p className="ad-hint">候选来自系统账号目录(姓名为空时显示账号);「已加入」标记避免重复添加造成隐式变更——调整身份请在成员表中操作。最后一位负责人不可移除/降级。</p>
|
||||
</div>
|
||||
<table className="ad-table">
|
||||
<thead><tr><th>成员</th><th>专业角色</th><th>项目身份</th><th>添加人</th><th>添加时间</th><th></th></tr></thead>
|
||||
<tbody>
|
||||
{(rows ?? []).map(m => (
|
||||
<tr key={m.owner}>
|
||||
<td><span className="ad-mono">{m.owner}</span>{m.profRole?.name ? <span className="ad-dim"> · {m.profRole.name}</span> : null}</td>
|
||||
<td className="ad-dim">{m.profRole?.name || '—'}</td>
|
||||
<td>{m.role === 'owner' ? <span className="ad-chip ad-chip-admin">项目负责人</span> : <span className="ad-chip">项目成员</span>}</td>
|
||||
<td className="ad-dim">{m.addedBy || '—'}</td>
|
||||
<td className="ad-dim">{m.addedAt ? new Date(m.addedAt).toLocaleString() : '—'}</td>
|
||||
<td>
|
||||
<button className="ad-mini" disabled={busy || !!writeError}
|
||||
title={m.role === 'owner' ? '降为项目成员(setRole)' : '升为项目负责人(setRole)'}
|
||||
onClick={() => run(`已调整 ${m.owner} 的项目身份`, () =>
|
||||
cmd('rdm.project.member.set-role', memberSetRolePayload(projectId, m.owner, m.role === 'owner' ? 'member' : 'owner')))}>
|
||||
{m.role === 'owner' ? '降为成员' : '升为负责人'}
|
||||
</button>{' '}
|
||||
<button className="ad-mini" disabled={busy || !!writeError}
|
||||
onClick={() => run(`已移除 ${m.owner}`,
|
||||
() => cmd('rdm.project.member.remove', memberRemovePayload(projectId, m.owner)))}>移除</button>
|
||||
</td>
|
||||
</tr>
|
||||
))}
|
||||
{rows !== null && rows.length === 0 && <tr><td colSpan={6} className="ad-dim">暂无成员</td></tr>}
|
||||
{rows === null && <tr><td colSpan={6} className="ad-dim">加载中…</td></tr>}
|
||||
</tbody>
|
||||
</table>
|
||||
{notice && <div className="ad-notice"><Icon name="check" size={14} />{notice}</div>}
|
||||
{err && <div className="lg-err"><Icon name="alert" size={14} />{err}</div>}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export { RdmDutiesSection } from './duties/RdmDutiesSection'
|
||||
|
||||
// ---- 项目设置:项目权限(P7-C:单成员详情标签化 + 多人矩阵 + 三态覆盖;
|
||||
// 与实际判定同源——UI 不重算,全部读服务端解释) ----
|
||||
|
||||
interface MatrixAction {
|
||||
action: string; label?: string; scope?: string
|
||||
allowed: boolean; source: string; reason?: string
|
||||
}
|
||||
interface MatrixOut {
|
||||
projectId: string; member: string; role: string
|
||||
profRole: { roleId: string; name: string } | null
|
||||
actions: MatrixAction[]
|
||||
}
|
||||
interface MatrixRowOut {
|
||||
member: string; role: string
|
||||
profRole: { roleId: string; name: string } | null
|
||||
actions: MatrixAction[]
|
||||
}
|
||||
interface MatrixBatchOut { projectId: string; rows: MatrixRowOut[] }
|
||||
|
||||
function actionTitle(a: MatrixAction) { return a.label || a.action }
|
||||
|
||||
/** 动作行:中文标签为主,内部标识进 title 技术详情(方案 §5)。 */
|
||||
function ActionDetailTable({ actions, onOverride, canManage }: {
|
||||
actions: MatrixAction[]
|
||||
onOverride?: (action: string, mode: 'allow' | 'deny' | 'default') => void
|
||||
canManage?: boolean
|
||||
}) {
|
||||
const project = actions.filter(a => a.scope !== 'system')
|
||||
const system = actions.filter(a => a.scope === 'system')
|
||||
const overrideOf = (a: MatrixAction): 'allow' | 'deny' | 'default' =>
|
||||
a.source.includes('override') || a.source === 'project' ? (a.allowed ? 'allow' : 'deny') : 'default'
|
||||
return (
|
||||
<>
|
||||
<table className="ad-table">
|
||||
<thead><tr><th>动作</th><th>生效</th><th>来源</th><th>原因(拒绝时)</th>{canManage ? <th>项目覆盖</th> : null}</tr></thead>
|
||||
<tbody>
|
||||
{project.map(a => (
|
||||
<tr key={a.action}>
|
||||
<td title={`内部标识 ${a.action}`}>{actionTitle(a)}</td>
|
||||
<td>{a.allowed ? <span className="ad-chip ad-chip-admin">允许</span> : <span className="ad-chip ad-chip-warn">拒绝</span>}</td>
|
||||
<td className="ad-dim">{describeSource(a.source)}</td>
|
||||
<td className="ad-dim">{a.reason || '—'}</td>
|
||||
{canManage ? (
|
||||
<td>
|
||||
<select className="lg-input" value={overrideOf(a)} style={{ minWidth: 120 }}
|
||||
onChange={e => onOverride?.(a.action, e.target.value as 'allow' | 'deny' | 'default')}>
|
||||
<option value="default">沿用角色默认</option>
|
||||
<option value="allow">项目内允许</option>
|
||||
<option value="deny">项目内禁止</option>
|
||||
</select>
|
||||
</td>
|
||||
) : null}
|
||||
</tr>
|
||||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
{system.length > 0 && (
|
||||
<Collapsible trigger={`系统范围动作(${system.length} 项,不在项目内配置)`}>
|
||||
<table className="ad-table">
|
||||
<thead><tr><th>动作</th><th>生效</th><th>来源</th><th>原因</th></tr></thead>
|
||||
<tbody>
|
||||
{system.map(a => (
|
||||
<tr key={a.action}>
|
||||
<td title={`内部标识 ${a.action}`}>{actionTitle(a)}</td>
|
||||
<td>{a.allowed ? <span className="ad-chip ad-chip-admin">允许</span> : <span className="ad-chip ad-chip-warn">拒绝</span>}</td>
|
||||
<td className="ad-dim">{describeSource(a.source)}</td>
|
||||
<td className="ad-dim">{a.reason || '—'}</td>
|
||||
</tr>
|
||||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
</Collapsible>
|
||||
)}
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
export function RdmPermMatrixSection({ project }: { project: Project }) {
|
||||
const projectId = project.id
|
||||
const writeError = projectWorkError(project)
|
||||
const cmd = <T,>(id: string, params: Record<string, unknown> = {}) => api.rdmProjectCommand<T>(project, id, params)
|
||||
const me = useStore(s => s.me)
|
||||
const [view, setView] = useState<'member' | 'matrix'>('member')
|
||||
const [member, setMember] = useState('')
|
||||
const [members, setMembers] = useState<MemberRow[] | null>(null)
|
||||
const [matrix, setMatrix] = useState<MatrixOut | null>(null)
|
||||
const [batch, setBatch] = useState<MatrixBatchOut | null>(null)
|
||||
const [expand, setExpand] = useState('')
|
||||
const [err, setErr] = useState('')
|
||||
const [notice, setNotice] = useState('')
|
||||
const [busy, setBusy] = useState(false)
|
||||
|
||||
const loadMembers = () =>
|
||||
cmd<{ members: MemberRow[] }>('rdm.project.member.list', { projectId })
|
||||
.then(out => {
|
||||
setMembers(out.members ?? [])
|
||||
if (me?.owner) setMember(prev => prev || me.owner)
|
||||
}).catch(e => setErr(String(e)))
|
||||
useEffect(() => { loadMembers() }, [project, me?.owner]) // eslint-disable-line react-hooks/exhaustive-deps
|
||||
|
||||
const query = async (m: string) => {
|
||||
if (!m) return
|
||||
setErr(''); setBusy(true); setMatrix(null)
|
||||
try {
|
||||
setMatrix(await cmd<MatrixOut>('rdm.perm.check', permCheckPayload(projectId, m)))
|
||||
} catch (e) { setErr(String(e)) } finally { setBusy(false) }
|
||||
}
|
||||
const queryBatch = async () => {
|
||||
setErr(''); setBusy(true); setBatch(null)
|
||||
try {
|
||||
setBatch(await cmd<MatrixBatchOut>('rdm.perm.matrix', { projectId }))
|
||||
} catch (e) { setErr(String(e)) } finally { setBusy(false) }
|
||||
}
|
||||
useEffect(() => { if (view === 'matrix') queryBatch() }, [view]) // eslint-disable-line react-hooks/exhaustive-deps
|
||||
|
||||
/** 三态覆盖写回:default=实际撤销(perm.unset);allow/deny=perm.set。 */
|
||||
const override = async (m: string, action: string, mode: 'allow' | 'deny' | 'default') => {
|
||||
if (writeError) { setErr(writeError); return }
|
||||
setErr(''); setNotice(''); setBusy(true)
|
||||
try {
|
||||
if (mode === 'default') {
|
||||
await cmd('rdm.perm.unset', { projectId, member: m, action })
|
||||
setNotice(`已恢复默认(撤销 ${action} 的项目覆盖)`)
|
||||
} else {
|
||||
await cmd('rdm.perm.set', { projectId, member: m, action, allow: mode === 'allow' })
|
||||
setNotice(mode === 'allow' ? `已在项目内允许 ${action}` : `已在项目内禁止 ${action}`)
|
||||
}
|
||||
await query(m)
|
||||
} catch (e) { setErr(String(e)) } finally { setBusy(false) }
|
||||
}
|
||||
|
||||
const canManage = !writeError && !!matrix && matrix.role !== undefined
|
||||
|
||||
return (
|
||||
<div>
|
||||
{writeError && <p className="ad-hint">{writeError}</p>}
|
||||
<div className="ad-create">
|
||||
<div className="ad-row">
|
||||
<select className="lg-input" value={view} onChange={e => setView(e.target.value as 'member' | 'matrix')}>
|
||||
<option value="member">按成员查看(默认自省)</option>
|
||||
<option value="matrix">权限矩阵(成员 × 动作,须管理权)</option>
|
||||
</select>
|
||||
{view === 'member' && (
|
||||
<>
|
||||
<select className="lg-input" value={member} onChange={e => { setMember(e.target.value); query(e.target.value) }}>
|
||||
<option value="">选择成员…</option>
|
||||
{(members ?? []).map(m => <option key={m.owner} value={m.owner}>{m.owner}</option>)}
|
||||
</select>
|
||||
<Btn variant="ghost" icon="eye" disabled={busy || !member} onClick={() => query(member)}>查看</Btn>
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
<p className="ad-hint">普通成员可查看自己的有效权限;查看他人与矩阵须项目管理权。解释与实际判定同源(服务端,非前端推算);系统范围动作折叠为技术详情。</p>
|
||||
</div>
|
||||
|
||||
{view === 'member' && matrix && (
|
||||
<>
|
||||
<div className="ad-row">
|
||||
<span>成员 <b className="ad-mono">{matrix.member}</b> · 项目身份 <b>{matrix.role === 'owner' ? '项目负责人' : matrix.role === 'member' ? '项目成员' : matrix.role}</b>
|
||||
{matrix.profRole && <> · 专业角色 <b>{matrix.profRole.name}</b></>}
|
||||
</span>
|
||||
</div>
|
||||
<ActionDetailTable actions={matrix.actions ?? []}
|
||||
canManage={canManage}
|
||||
onOverride={(action, mode) => override(matrix.member, action, mode)} />
|
||||
</>
|
||||
)}
|
||||
{view === 'member' && !matrix && !err && members !== null && <p className="ad-hint">选择成员后展示各动作的有效权限、来源与第一拒绝原因。</p>}
|
||||
|
||||
{view === 'matrix' && batch && (
|
||||
<table className="ad-table" style={{ overflowX: 'auto', display: 'block' }}>
|
||||
<thead><tr>
|
||||
<th>成员</th>
|
||||
{(batch.rows[0]?.actions ?? []).filter(a => a.scope !== 'system').map(a => (
|
||||
<th key={a.action} title={`内部标识 ${a.action}`}>{actionTitle(a)}</th>
|
||||
))}
|
||||
</tr></thead>
|
||||
<tbody>
|
||||
{batch.rows.map(row => (
|
||||
<tr key={row.member}>
|
||||
<td>
|
||||
<button className="ad-mini" onClick={() => setExpand(expand === row.member ? '' : row.member)}>
|
||||
{row.member}
|
||||
</button>
|
||||
<span className="ad-dim"> · {row.role === 'owner' ? '负责人' : '成员'}</span>
|
||||
</td>
|
||||
{row.actions.filter(a => a.scope !== 'system').map(a => (
|
||||
<td key={a.action} title={`${a.label ?? a.action}:${a.allowed ? '允许' : '拒绝'}(${describeSource(a.source)}${a.reason ? ';' + a.reason : ''})`}>
|
||||
{a.allowed ? <span className="ad-chip ad-chip-admin">✓</span> : <span className="ad-chip ad-chip-warn">✗</span>}
|
||||
</td>
|
||||
))}
|
||||
</tr>
|
||||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
)}
|
||||
{view === 'matrix' && batch && expand && (
|
||||
<div className="settings-group" style={{ marginTop: 12 }}>
|
||||
<h4>{expand} · 单成员详情与三态覆盖</h4>
|
||||
{(() => {
|
||||
const row = batch.rows.find(r => r.member === expand)
|
||||
if (!row) return null
|
||||
return <ActionDetailTable actions={row.actions} canManage={!writeError}
|
||||
onOverride={(action, mode) => override(expand, action, mode)} />
|
||||
})()}
|
||||
</div>
|
||||
)}
|
||||
|
||||
{notice && <div className="ad-notice"><Icon name="check" size={14} />{notice}</div>}
|
||||
{err && <div className="lg-err"><Icon name="alert" size={14} />{err}</div>}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -6,11 +6,13 @@ import { api } from '../api'
|
||||
import { store, useStore } from '../store'
|
||||
import type { AgentProfile } from '../contracts'
|
||||
import { Btn, EmptyState, Icon, SettingRow, SettingsGroup, UIRenderer, type DocBridge } from '@ui'
|
||||
import { SettingInput, flatten, unflatten } from './SettingsModal'
|
||||
import type { SettingDesc } from '../contracts'
|
||||
import { docBridge } from './Workbench'
|
||||
import { randomPassword } from '../passwords'
|
||||
|
||||
// ---- 用户管理(原 AdminUsersModal 主体,R2 管理员发放制)----
|
||||
interface AdminUserRow { owner: string; name: string; isAdmin: boolean; mustChangePassword: boolean; hasPassword: boolean; passwordSetAt?: string; createdAt: string }
|
||||
// ---- 用户管理:页面建号可设置/生成初始密码;忘记密码只有一个处置——
|
||||
// 管理员生成一次性登录密码,用户使用后必须强制改密。 ----
|
||||
interface AdminUserRow { userId: string; owner: string; name: string; isAdmin: boolean; mustChangePassword: boolean; hasPassword: boolean; passwordSetAt?: string; createdAt: string; stateVersion: number }
|
||||
|
||||
export function UsersPanel() {
|
||||
const me = useStore(s => s.me)
|
||||
@@ -19,11 +21,9 @@ export function UsersPanel() {
|
||||
const [notice, setNotice] = useState('')
|
||||
const [owner, setOwner] = useState('')
|
||||
const [name, setName] = useState('')
|
||||
const [pw, setPw] = useState('')
|
||||
const [asAdmin, setAsAdmin] = useState(false)
|
||||
const [initialPassword, setInitialPassword] = useState('')
|
||||
const [generatedCredential, setGeneratedCredential] = useState<{ owner: string; password: string; kind: 'initial' | 'one-time' } | null>(null)
|
||||
const [busy, setBusy] = useState(false)
|
||||
const [resetFor, setResetFor] = useState<string | null>(null)
|
||||
const [resetPw, setResetPw] = useState('')
|
||||
|
||||
const refresh = async () => {
|
||||
try { setUsers(await api.listAdminUsers()) } catch (e) { setErr(String(e)) }
|
||||
@@ -32,25 +32,22 @@ export function UsersPanel() {
|
||||
|
||||
const create = async () => {
|
||||
setErr(''); setNotice('')
|
||||
if (pw.length < 8) { setErr('初始密码至少 8 位'); return }
|
||||
setBusy(true)
|
||||
try {
|
||||
await api.createAdminUser(owner.trim(), name.trim(), pw, asAdmin)
|
||||
setNotice(`已创建 ${owner.trim()}:首次登录须改密`)
|
||||
setOwner(''); setName(''); setPw('')
|
||||
const out = await api.createAdminUser(owner.trim(), name.trim(), initialPassword.trim() || undefined)
|
||||
setGeneratedCredential(out.initialPassword ? { owner: out.owner, password: out.initialPassword, kind: 'initial' } : null)
|
||||
setNotice(out.initialPassword ? `已创建 ${out.owner},请将下方一次性初始密码交付给用户。首次登录后必须改密。` : `已创建 ${out.owner}。用户首次登录后必须改密。`)
|
||||
setOwner(''); setName(''); setInitialPassword('')
|
||||
await refresh()
|
||||
} catch (e) { setErr(String(e).includes('409') ? '用户名已存在' : String(e)) } finally { setBusy(false) }
|
||||
}
|
||||
|
||||
const reset = async () => {
|
||||
if (!resetFor) return
|
||||
setErr('')
|
||||
if (resetPw.length < 8) { setErr('新密码至少 8 位'); return }
|
||||
setBusy(true)
|
||||
const issueOneTimePassword = async (u: AdminUserRow) => {
|
||||
setErr(''); setNotice(''); setGeneratedCredential(null); setBusy(true)
|
||||
try {
|
||||
await api.resetAdminUserPassword(resetFor, resetPw)
|
||||
setNotice(`已重置 ${resetFor} 的密码:其下次登录须改密(现有会话已吊销)`)
|
||||
setResetFor(null); setResetPw('')
|
||||
const out = await api.adminIssueOneTimePassword(u.owner)
|
||||
setGeneratedCredential({ owner: u.owner, password: out.oneTimePassword, kind: 'one-time' })
|
||||
setNotice(`已为 ${u.owner} 生成一次性登录密码,原密码仍可正常登录。该用户用一次性密码登录后必须立即设置新密码(强制改密);若改用原密码登录,未使用的一次性登录密码随即作废,且不会被要求改密。`)
|
||||
await refresh()
|
||||
} catch (e) { setErr(String(e)) } finally { setBusy(false) }
|
||||
}
|
||||
@@ -62,46 +59,40 @@ export function UsersPanel() {
|
||||
<div className="ad-row">
|
||||
<input className="lg-input" placeholder="用户名(登录名)" value={owner} onChange={e => setOwner(e.target.value)} />
|
||||
<input className="lg-input" placeholder="显示名(可空)" value={name} onChange={e => setName(e.target.value)} />
|
||||
<input className="lg-input" type="password" autoComplete="new-password" placeholder="初始密码(留空随机生成)" value={initialPassword} onChange={e => setInitialPassword(e.target.value)} />
|
||||
<button className="lg-submit ad-create-btn" disabled={busy || !owner.trim()} onClick={create}>创建账号</button>
|
||||
</div>
|
||||
<div className="ad-row">
|
||||
<input className="lg-input lg-mono" placeholder="初始密码(≥8 位)" value={pw} onChange={e => setPw(e.target.value)} />
|
||||
<button type="button" className="ad-mini" title="生成随机密码" onClick={() => setPw(randomPassword())}>随机</button>
|
||||
<label className="ad-check"><input type="checkbox" checked={asAdmin} onChange={e => setAsAdmin(e.target.checked)} />管理员</label>
|
||||
<button className="lg-submit ad-create-btn" disabled={busy || !owner.trim() || !pw} onClick={create}>创建账号</button>
|
||||
</div>
|
||||
<p className="ad-hint">创建后该用户首次登录必须修改此初始密码。</p>
|
||||
<p className="ad-hint">可填写管理员指定的初始密码;留空则由服务端生成一次性随机密码。用户首次登录后必须改密。</p>
|
||||
</div>
|
||||
)}
|
||||
{notice && <div className="ad-notice"><Icon name="check" size={14} />{notice}</div>}
|
||||
{generatedCredential && <div className="ad-reset">
|
||||
<p className="ad-hint">{generatedCredential.kind === 'initial'
|
||||
? `初始密码仅显示一次,请立即安全交付给 ${generatedCredential.owner}。`
|
||||
: `一次性登录密码仅显示一次,请立即安全交付给 ${generatedCredential.owner};使用后必须强制改密。`}</p>
|
||||
<input className="lg-input ad-mono" readOnly value={generatedCredential.password} aria-label="一次性密码" />
|
||||
<button type="button" className="ad-mini" onClick={() => setGeneratedCredential(null)}>关闭</button>
|
||||
</div>}
|
||||
{err && <div className="lg-err"><Icon name="alert" size={14} />{err}</div>}
|
||||
{resetFor ? (
|
||||
<div className="ad-reset">
|
||||
<span>重置 <b>{resetFor}</b> 的密码:</span>
|
||||
<input className="lg-input lg-mono" placeholder="新密码(≥8 位)" value={resetPw} onChange={e => setResetPw(e.target.value)} />
|
||||
<button type="button" className="ad-mini" title="生成随机密码" onClick={() => setResetPw(randomPassword())}>随机</button>
|
||||
<button className="lg-submit ad-create-btn" disabled={busy || !resetPw} onClick={reset}>确认重置</button>
|
||||
<button type="button" className="ad-mini" onClick={() => { setResetFor(null); setResetPw('') }}>取消</button>
|
||||
</div>
|
||||
) : (
|
||||
<table className="ad-table">
|
||||
<thead><tr><th>用户名</th><th>显示名</th><th>角色</th><th>状态</th><th>密码设置于</th><th></th></tr></thead>
|
||||
<tbody>
|
||||
{(users ?? []).map(u => (
|
||||
<tr key={u.owner}>
|
||||
<td className="ad-user-cell"><span className="ad-mono">{u.owner}</span></td>
|
||||
<td>{u.name || '—'}</td>
|
||||
<td>{u.isAdmin ? <span className="ad-chip ad-chip-admin">ADMIN</span> : <span className="ad-chip">USER</span>}</td>
|
||||
<td>{u.mustChangePassword ? <span className="ad-chip ad-chip-warn">待改密</span> : u.hasPassword ? '正常' : '未设密码'}</td>
|
||||
<td className="ad-dim">{u.passwordSetAt ? new Date(u.passwordSetAt).toLocaleString() : '—'}</td>
|
||||
<td>{me?.isAdmin && (
|
||||
<button className="ad-mini" onClick={() => { setResetFor(u.owner); setResetPw('') }}>重置密码</button>
|
||||
)}</td>
|
||||
</tr>
|
||||
))}
|
||||
{users !== null && users.length === 0 && <tr><td colSpan={6} className="ad-dim">暂无账号</td></tr>}
|
||||
</tbody>
|
||||
</table>
|
||||
)}
|
||||
{me?.isAdmin && <p className="ad-hint">用户忘记密码时,点该用户行的「生成一次性登录密码」:生成不会使原密码失效。用户用一次性密码登录后必须设置新密码才能继续;若用户改用原密码登录,未使用的一次性登录密码随即作废,且不会被要求改密。</p>}
|
||||
<table className="ad-table">
|
||||
<thead><tr><th>用户名</th><th>显示名</th><th>角色</th><th>状态</th><th>密码设置于</th><th></th></tr></thead>
|
||||
<tbody>
|
||||
{(users ?? []).map(u => (
|
||||
<tr key={u.owner}>
|
||||
<td className="ad-user-cell"><span className="ad-mono">{u.owner}</span></td>
|
||||
<td>{u.name || '—'}</td>
|
||||
<td>{u.isAdmin ? <span className="ad-chip ad-chip-admin">ADMIN</span> : <span className="ad-chip">USER</span>}</td>
|
||||
<td>{u.mustChangePassword ? <span className="ad-chip ad-chip-warn">待改密</span> : u.hasPassword ? '正常' : '未设密码'}</td>
|
||||
<td className="ad-dim">{u.passwordSetAt ? new Date(u.passwordSetAt).toLocaleString() : '—'}</td>
|
||||
<td>{me?.isAdmin && (
|
||||
<button className="ad-mini" disabled={busy} onClick={() => issueOneTimePassword(u)}>生成一次性登录密码</button>
|
||||
)}</td>
|
||||
</tr>
|
||||
))}
|
||||
{users !== null && users.length === 0 && <tr><td colSpan={6} className="ad-dim">暂无账号</td></tr>}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -193,9 +184,18 @@ export function PluginsSection() {
|
||||
{plugins.length === 0 && <EmptyState icon="puzzle">暂无已装载插件<br />(插件目录在 设置 → 常规 → 插件目录;示例见 Dev 仓 plugins/example)</EmptyState>}
|
||||
{plugins.map(p => (
|
||||
<SettingRow key={p.manifest.id}
|
||||
label={`${p.manifest.name} v${p.manifest.version}`}
|
||||
desc={[`工具 ${p.manifest.provides.tools?.length ?? 0}`, `面板 ${p.panels?.length ?? 0}`, `意图 ${p.intents?.length ?? 0}`, `工作流 ${p.workflows?.length ?? 0}`].join(' · ')}>
|
||||
<span className="effect-badge">api {p.manifest.apiVersion}</span>
|
||||
label={p.manifest.name + (p.manifest.version ? ` v${p.manifest.version}` : '')}
|
||||
desc={[
|
||||
`工具 ${p.manifest.provides.tools?.length ?? 0}`,
|
||||
`命令 ${p.manifest.provides.commands?.length ?? 0}`,
|
||||
`面板 ${p.panels?.length ?? 0}`,
|
||||
`意图 ${p.intents?.length ?? p.manifest.provides.intents?.length ?? 0}`,
|
||||
`工作流 ${p.workflows?.length ?? 0}`,
|
||||
].join(' · ')}>
|
||||
<span style={{ display: 'inline-flex', gap: 6, alignItems: 'center' }}>
|
||||
{p.manifest.backend?.mode === 'inproc' && <span className="effect-badge">内置</span>}
|
||||
<span className="effect-badge">api {p.manifest.apiVersion}</span>
|
||||
</span>
|
||||
</SettingRow>
|
||||
))}
|
||||
</div>
|
||||
@@ -231,3 +231,74 @@ export function PluginWorkspacesPanel() {
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
// ---- 模型与服务配置(P2 系统受管项的唯一写入面)----
|
||||
|
||||
/**
|
||||
* SystemSettingsPanel:消费 GET/PUT /api/settings/system。
|
||||
* - 仅渲染 schema 中 scope=system 的受管项(模型、密钥、Tavily、遥测、运行基础设施);
|
||||
* 非受管项属于用户/项目偏好,不在本面板出现。
|
||||
* - 保存后重新 GET 以服务端结果回填(保存成功 ≠ 本地草稿即真相);掩码占位符
|
||||
* 原样传回,由服务端视为未修改。
|
||||
* - 权限不足(非管理员)由分区门控与 API 403 双层拦截,403 时如实提示。
|
||||
*/
|
||||
export function SystemSettingsPanel() {
|
||||
const [schema, setSchema] = useState<SettingDesc[] | null>(null)
|
||||
const [draft, setDraft] = useState<Record<string, any>>({})
|
||||
const [loaded, setLoaded] = useState(false)
|
||||
const [forbidden, setForbidden] = useState(false)
|
||||
const [err, setErr] = useState('')
|
||||
const [notice, setNotice] = useState('')
|
||||
const [busy, setBusy] = useState(false)
|
||||
|
||||
const load = async () => {
|
||||
setErr(''); setForbidden(false)
|
||||
try {
|
||||
const out = await api.getSystemSettings()
|
||||
setSchema(out.schema.filter(d => d.scope === 'system'))
|
||||
setDraft(flatten(out.system))
|
||||
setLoaded(true)
|
||||
} catch (e) {
|
||||
if (String(e).includes('403')) { setForbidden(true); setLoaded(true) }
|
||||
else setErr(String(e))
|
||||
}
|
||||
}
|
||||
useEffect(() => { load() }, [])
|
||||
|
||||
const groups: Record<string, SettingDesc[]> = {}
|
||||
for (const d of schema ?? []) (groups[d.group] ??= []).push(d)
|
||||
|
||||
const save = async () => {
|
||||
setErr(''); setNotice(''); setBusy(true)
|
||||
try {
|
||||
await api.putSystemSettings(unflatten(draft))
|
||||
setNotice('已保存;按各项标注的生效时机生效(需重启的项在重启后生效)')
|
||||
await load()
|
||||
} catch (e) { setErr(String(e)) } finally { setBusy(false) }
|
||||
}
|
||||
|
||||
if (!loaded) return <EmptyState icon="settings">加载系统设置…</EmptyState>
|
||||
if (forbidden) return <EmptyState icon="shield">系统设置仅管理员可配置</EmptyState>
|
||||
|
||||
return (
|
||||
<div>
|
||||
<p className="ad-hint" style={{ marginBottom: 14 }}>
|
||||
模型、密钥与运行基础设施为系统受管配置:仅此面板(管理员)可写,用户与项目设置中的同名项不再生效。
|
||||
</p>
|
||||
{Object.entries(groups).map(([group, descs]) => (
|
||||
<SettingsGroup key={group} title={group === 'models' ? '模型' : group === 'tools' ? '工具服务' : group === 'telemetry' ? '遥测' : group === 'runtime' ? '运行基础设施' : group}>
|
||||
{descs.map(d => (
|
||||
<SettingRow key={d.key} label={d.label} desc={d.description} effect={d.effect}>
|
||||
<SettingInput desc={d} value={draft[d.key]} onChange={v => setDraft(prev => ({ ...prev, [d.key]: v }))} />
|
||||
</SettingRow>
|
||||
))}
|
||||
</SettingsGroup>
|
||||
))}
|
||||
<div className="ad-row" style={{ marginTop: 12 }}>
|
||||
<Btn variant="primary" icon="check" disabled={busy} onClick={save}>保存系统配置</Btn>
|
||||
</div>
|
||||
{notice && <div className="ad-notice"><Icon name="check" size={14} />{notice}</div>}
|
||||
{err && <div className="lg-err"><Icon name="alert" size={14} />{err}</div>}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -0,0 +1,253 @@
|
||||
import { useEffect, useRef, useState } from 'react'
|
||||
import { api } from '../../api'
|
||||
import type { Project } from '../../contracts'
|
||||
import { projectWorkError } from '../../projectmeta'
|
||||
import { Btn, Collapsible, EmptyState, Icon } from '@ui'
|
||||
import { dutyMatrixPayload, dutyPreviewPayload, dutyLegacyPayload } from '../../rdmManagement'
|
||||
import {
|
||||
absorbServerDocs, dirtyDocs, editCell, savePayload,
|
||||
type CellDuty, type DutyDocDraft, type DutyMember,
|
||||
} from '../../duties/draft'
|
||||
import { DutyByDocumentView, DutyByMemberView, DutyChangePreview, DutyMatrixView } from '../../duties/views'
|
||||
|
||||
type ViewName = 'member' | 'document' | 'matrix'
|
||||
|
||||
interface MatrixDoc {
|
||||
docId: string
|
||||
title: string
|
||||
code?: string
|
||||
typeKey: string
|
||||
stage?: string
|
||||
dutyVersion: number
|
||||
activeRound?: number
|
||||
legacySectionOverrides?: number
|
||||
}
|
||||
interface MatrixOut {
|
||||
canAssign: boolean
|
||||
docs: MatrixDoc[]
|
||||
members: DutyMember[]
|
||||
cells: { docId: string; owner: string; duty: string }[]
|
||||
nextDocCursor?: string
|
||||
nextMemberCursor?: string
|
||||
}
|
||||
interface PreviewOut {
|
||||
ok: boolean
|
||||
docs: {
|
||||
docId: string
|
||||
title?: string
|
||||
replacedAuthor?: string
|
||||
replacedApprover?: string
|
||||
needsConfirm?: boolean
|
||||
reasons?: string[]
|
||||
}[]
|
||||
}
|
||||
interface LegacyOut {
|
||||
findings: { docId: string; title: string; sectionTitle: string; kind: string }[]
|
||||
}
|
||||
|
||||
export function RdmDutiesSection({ project }: { project: Project }) {
|
||||
const projectId = project.id
|
||||
const writeError = projectWorkError(project)
|
||||
const [view, setView] = useState<ViewName>('member')
|
||||
const [docs, setDocs] = useState<DutyDocDraft[]>([])
|
||||
const [members, setMembers] = useState<DutyMember[]>([])
|
||||
const [member, setMember] = useState('')
|
||||
const [docId, setDocId] = useState('')
|
||||
const [query, setQuery] = useState('')
|
||||
const [stage, setStage] = useState('')
|
||||
const [typeKey, setTypeKey] = useState('')
|
||||
const [assignment, setAssignment] = useState('')
|
||||
const [docCursor, setDocCursor] = useState('')
|
||||
const [nextDoc, setNextDoc] = useState('')
|
||||
const [canAssign, setCanAssign] = useState(false)
|
||||
const [narrow, setNarrow] = useState(false)
|
||||
const [err, setErr] = useState('')
|
||||
const [notice, setNotice] = useState('')
|
||||
const [busy, setBusy] = useState(false)
|
||||
const [preview, setPreview] = useState<PreviewOut['docs']>([])
|
||||
const [confirm, setConfirm] = useState(false)
|
||||
const [legacy, setLegacy] = useState<LegacyOut['findings']>([])
|
||||
const [legacyOpen, setLegacyOpen] = useState(false)
|
||||
const seq = useRef(0)
|
||||
const op = useRef(0)
|
||||
const docsRef = useRef(docs)
|
||||
docsRef.current = docs
|
||||
|
||||
const load = async (cursor: string, request = ++seq.current, replaceDirty = false) => {
|
||||
const seenMembers: DutyMember[] = []
|
||||
const seenCells: MatrixOut['cells'] = []
|
||||
let pageDocs: MatrixDoc[] = []
|
||||
let memberCursor = ''
|
||||
let nextDocument = ''
|
||||
let assignable = false
|
||||
try {
|
||||
do {
|
||||
const page = await api.rdmProjectCommand<MatrixOut>(project, 'rdm.duty.matrix', dutyMatrixPayload(projectId, {
|
||||
view: 'matrix', query, stage, typeKey, assignment, docCursor: cursor, memberCursor, docLimit: 10, memberLimit: 20,
|
||||
}))
|
||||
if (request !== seq.current) return
|
||||
if (pageDocs.length === 0) pageDocs = page.docs ?? []
|
||||
seenMembers.push(...(page.members ?? []))
|
||||
seenCells.push(...(page.cells ?? []))
|
||||
assignable = page.canAssign
|
||||
nextDocument = page.nextDocCursor ?? ''
|
||||
memberCursor = page.nextMemberCursor ?? ''
|
||||
} while (memberCursor)
|
||||
if (request !== seq.current) return
|
||||
setMembers(seenMembers)
|
||||
setCanAssign(assignable)
|
||||
setNextDoc(nextDocument)
|
||||
setDocs(current => absorbServerDocs(current, pageDocs, seenCells, replaceDirty))
|
||||
} catch (error) {
|
||||
if (request !== seq.current) return
|
||||
setErr(String(error))
|
||||
}
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
const media = window.matchMedia('(max-width: 720px)')
|
||||
const apply = () => setNarrow(media.matches)
|
||||
apply()
|
||||
media.addEventListener('change', apply)
|
||||
return () => media.removeEventListener('change', apply)
|
||||
}, [])
|
||||
|
||||
useEffect(() => {
|
||||
void load(docCursor)
|
||||
return () => { seq.current += 1 }
|
||||
}, [project, query, stage, typeKey, assignment, docCursor])
|
||||
|
||||
const onCell = (id: string, owner: string, duty: CellDuty) => {
|
||||
setPreview([])
|
||||
setConfirm(false)
|
||||
setDocs(current => editCell(current, id, owner, duty))
|
||||
}
|
||||
|
||||
const visibleDocs = docs.filter(doc => {
|
||||
const text = `${doc.title} ${doc.code} ${doc.docId}`.toLowerCase()
|
||||
if (query && !text.includes(query.trim().toLowerCase())) return false
|
||||
if (stage && doc.stage !== stage) return false
|
||||
if (typeKey && doc.typeKey !== typeKey) return false
|
||||
return true
|
||||
})
|
||||
|
||||
const save = async () => {
|
||||
const payload = savePayload(docsRef.current, confirm)
|
||||
if (payload.issues.length > 0) {
|
||||
setErr(payload.issues.join(';'))
|
||||
return
|
||||
}
|
||||
const request = ++seq.current
|
||||
const ticket = ++op.current
|
||||
setBusy(true); setErr(''); setNotice('')
|
||||
let sent = false
|
||||
try {
|
||||
const looked = await api.rdmProjectCommand<PreviewOut>(project, 'rdm.duty.preview', dutyPreviewPayload(projectId, payload.docs))
|
||||
if (request !== seq.current) return
|
||||
setPreview(looked.docs ?? [])
|
||||
if (!looked.ok) {
|
||||
setErr('预览未通过,未写入')
|
||||
return
|
||||
}
|
||||
if ((looked.docs ?? []).some(item => item.needsConfirm) && !confirm) {
|
||||
setErr('在途审签将失效。确认后再保存。')
|
||||
return
|
||||
}
|
||||
sent = true
|
||||
await api.rdmProjectCommand(project, 'rdm.review.assign.doc.batch', dutyPreviewPayload(projectId, savePayload(docsRef.current, confirm).docs))
|
||||
if (request !== seq.current) return
|
||||
setNotice('已保存文档职责')
|
||||
setPreview([])
|
||||
setConfirm(false)
|
||||
setDocs(current => current.map(doc => ({ ...doc, dirty: false })))
|
||||
await load(docCursor, request)
|
||||
} catch (error) {
|
||||
if (request !== seq.current) return
|
||||
if (!sent) {
|
||||
setErr(String(error))
|
||||
return
|
||||
}
|
||||
setErr(`保存结果未确认:${error}`)
|
||||
setConfirm(false)
|
||||
await load(docCursor, request, true)
|
||||
} finally {
|
||||
if (ticket === op.current) setBusy(false)
|
||||
}
|
||||
}
|
||||
|
||||
const scanLegacy = async (request = ++seq.current) => {
|
||||
try {
|
||||
const out = await api.rdmProjectCommand<LegacyOut>(project, 'rdm.duty.legacy.scan', dutyLegacyPayload(projectId))
|
||||
if (request !== seq.current) return
|
||||
setLegacy(out.findings ?? [])
|
||||
} catch (error) {
|
||||
if (request !== seq.current) return
|
||||
setErr(String(error))
|
||||
}
|
||||
}
|
||||
|
||||
const applyIdentical = async () => {
|
||||
const request = ++seq.current
|
||||
const ticket = ++op.current
|
||||
setBusy(true)
|
||||
try {
|
||||
await api.rdmProjectCommand(project, 'rdm.duty.legacy.apply', dutyLegacyPayload(projectId))
|
||||
if (request !== seq.current) return
|
||||
setNotice('已归并无歧义的章节职责')
|
||||
await scanLegacy(request)
|
||||
await load(docCursor, request)
|
||||
} catch (error) {
|
||||
if (request !== seq.current) return
|
||||
setErr(String(error))
|
||||
} finally {
|
||||
if (ticket === op.current) setBusy(false)
|
||||
}
|
||||
}
|
||||
|
||||
const disabled = busy || !!writeError || !canAssign
|
||||
const ambiguous = legacy.filter(item => item.kind !== 'identical')
|
||||
|
||||
return (
|
||||
<div>
|
||||
<p className="ad-hint">本页只分配已有文档的职责,不创建或生成文档。</p>
|
||||
{writeError && <p className="ad-hint">{writeError}</p>}
|
||||
<div className="ad-row" role="tablist" aria-label="职责视图">
|
||||
<button className="ad-mini" role="tab" aria-selected={view === 'member'} onClick={() => setView('member')}>按人员</button>
|
||||
<button className="ad-mini" role="tab" aria-selected={view === 'document'} onClick={() => setView('document')}>按文档</button>
|
||||
<button className="ad-mini" role="tab" aria-selected={view === 'matrix'} onClick={() => setView('matrix')}>矩阵</button>
|
||||
</div>
|
||||
<div className="ad-row">
|
||||
<input aria-label="筛选文档名称或编号" value={query} placeholder="名称或编号" disabled={busy} onChange={event => { setDocCursor(''); setQuery(event.target.value) }} />
|
||||
<input aria-label="筛选类型" value={typeKey} placeholder="类型" disabled={busy} onChange={event => { setDocCursor(''); setTypeKey(event.target.value) }} />
|
||||
<input aria-label="筛选阶段" value={stage} placeholder="阶段" disabled={busy} onChange={event => { setDocCursor(''); setStage(event.target.value) }} />
|
||||
<select aria-label="筛选当前职责" value={assignment} disabled={busy} onChange={event => { setDocCursor(''); setAssignment(event.target.value) }}>
|
||||
<option value="">全部</option>
|
||||
<option value="assigned">已分配</option>
|
||||
<option value="unassigned">未分配</option>
|
||||
</select>
|
||||
</div>
|
||||
{view === 'member' && <DutyByMemberView member={member} members={members} docs={visibleDocs} disabled={disabled} onMember={setMember} onCell={onCell} />}
|
||||
{view === 'document' && <DutyByDocumentView docId={docId} docs={visibleDocs} members={members} disabled={disabled} onDoc={setDocId} onCell={onCell} />}
|
||||
{view === 'matrix' && <DutyMatrixView docs={visibleDocs} members={members} disabled={disabled} narrow={narrow} onCell={onCell} />}
|
||||
<div className="ad-row">
|
||||
{docCursor && <button className="ad-mini" disabled={busy} onClick={() => setDocCursor('')}>文档首页</button>}
|
||||
{nextDoc && <button className="ad-mini" disabled={busy} onClick={() => setDocCursor(nextDoc)}>下一页文档</button>}
|
||||
<Btn variant="primary" icon="check" disabled={disabled || dirtyDocs(docs).length === 0} onClick={() => { void save() }}>保存职责</Btn>
|
||||
</div>
|
||||
<DutyChangePreview impacts={preview} confirm={confirm} onConfirm={setConfirm} />
|
||||
<Collapsible id="duty-legacy" open={legacyOpen} onToggle={setLegacyOpen} trigger="旧章节职责">
|
||||
<button className="ad-mini" disabled={busy} onClick={() => { void scanLegacy() }}>扫描</button>
|
||||
<button className="ad-mini" disabled={disabled} onClick={() => { void applyIdentical() }}>归并无歧义覆盖</button>
|
||||
{legacy.length === 0 ? <p className="ad-hint">尚未扫描,或没有章节级覆盖。</p> : (
|
||||
<ul>
|
||||
{legacy.map(item => <li key={`${item.docId}-${item.sectionTitle}`}>{item.title} / {item.sectionTitle}:{item.kind === 'identical' ? '与文档职责一致' : '有歧义,需逐文档确认'}</li>)}
|
||||
</ul>
|
||||
)}
|
||||
{ambiguous.length > 0 && <p className="ad-hint">有歧义的文档不会自动覆盖。请在上面的视图里逐份确认后再保存。</p>}
|
||||
</Collapsible>
|
||||
{notice && <div className="ad-notice"><Icon name="check" size={14} />{notice}</div>}
|
||||
{err && <div className="lg-err"><Icon name="alert" size={14} />{err}</div>}
|
||||
{docs.length === 0 && !err && <EmptyState icon="inbox">暂无文档</EmptyState>}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
+126
-6
@@ -16,6 +16,8 @@ export interface Conversation {
|
||||
id: ID; projectId: ID; owner?: ID; title: string; profileId?: ID;
|
||||
pinned?: boolean; archived?: boolean;
|
||||
allowCrossRead?: boolean; crossPrivate?: boolean;
|
||||
permissionMode?: 'default' | 'plan' | 'auto_edit' | '';
|
||||
sessionNote?: string;
|
||||
createdAt: string; updatedAt: string;
|
||||
}
|
||||
|
||||
@@ -23,7 +25,7 @@ export type Role = 'user' | 'assistant' | 'system';
|
||||
|
||||
export type PartType =
|
||||
| 'text' | 'thinking' | 'tool_call' | 'tool_result' | 'artifact_ref'
|
||||
| 'hitl' | 'plan' | 'error' | 'card';
|
||||
| 'hitl' | 'plan' | 'error' | 'card' | 'check';
|
||||
|
||||
export interface Part {
|
||||
type: PartType;
|
||||
@@ -35,6 +37,7 @@ export interface Part {
|
||||
plan?: PlanSnapshot;
|
||||
card?: { kind: string; data: UINode[]; cardId?: ID }; // cardId 非空 = 收件箱卡片引用部件(submit_card)
|
||||
error?: { code: string; message: string };
|
||||
check?: { passed: boolean; reason?: string }; // 终轮自动检查,过程区一行
|
||||
process?: boolean; // run 终态后折叠为摘要行
|
||||
durationMs?: number; // thinking 部件的思考时长(毫秒);工具耗时在 toolCall.durationMs
|
||||
}
|
||||
@@ -42,17 +45,27 @@ export interface Part {
|
||||
export interface Message {
|
||||
id: ID; conversationId: ID; runId?: ID; role: Role;
|
||||
parts: Part[]; createdAt: string;
|
||||
excluded?: boolean;
|
||||
variantGroup?: string;
|
||||
variantIndex?: number;
|
||||
}
|
||||
|
||||
export type RunKind = 'conversation' | 'subagent' | 'tool';
|
||||
export type RunStatus =
|
||||
| 'pending' | 'running' | 'waiting_hitl' | 'completed'
|
||||
| 'failed' | 'cancelled' | 'interrupted';
|
||||
export type RunPhase = 'thinking' | 'acting' | 'responding' | 'done';
|
||||
export type RunPhase = 'thinking' | 'acting' | 'responding' | 'finalizing' | 'done';
|
||||
|
||||
export interface Usage {
|
||||
promptTokens: number; completionTokens: number; totalTokens: number;
|
||||
durationMs: number; toolCalls: number;
|
||||
model?: string;
|
||||
// N3 计费拆分(additive;旧记录缺省为 0):
|
||||
// Last* 是最近一次请求的用量,Cache* 是缓存命中累计。
|
||||
lastPromptTokens?: number;
|
||||
lastCompletionTokens?: number;
|
||||
cacheReadTokens?: number;
|
||||
cacheWriteTokens?: number;
|
||||
}
|
||||
|
||||
export interface Run {
|
||||
@@ -80,12 +93,14 @@ export interface TodoList {
|
||||
// ---- 流式事件 ----
|
||||
|
||||
export type StreamEventType =
|
||||
| 'message.delta' | 'thinking.delta' | 'tool.call' | 'tool.result'
|
||||
| 'run.phase' | 'hitl.request' | 'hitl.resolved' | 'plan.update' | 'todo.update'
|
||||
| 'message.delta' | 'thinking.delta'
|
||||
| 'tool.call.delta' | 'tool.call' | 'tool.output' | 'tool.result'
|
||||
| 'run.phase' | 'run.check' | 'hitl.request' | 'hitl.resolved' | 'plan.update' | 'todo.update'
|
||||
| 'agent.spawn' | 'agent.progress' | 'agent.result'
|
||||
| 'artifact.created' | 'artifact.updated'
|
||||
| 'run.completed' | 'run.failed' | 'error'
|
||||
| 'card.created' | 'card.updated' | 'card.status' | 'card.resolved';
|
||||
| 'card.created' | 'card.updated' | 'card.status' | 'card.resolved'
|
||||
| 'surface.updated';
|
||||
|
||||
export interface StreamEvent<P = unknown> {
|
||||
seq: number; runId?: ID; conversationId: ID; ts: string; v: number;
|
||||
@@ -94,6 +109,9 @@ export interface StreamEvent<P = unknown> {
|
||||
|
||||
// payload 形状(按 type 判别;未知字段忽略)
|
||||
export interface MessageDeltaPayload { index: number; text: string }
|
||||
export interface ToolCallDeltaPayload { index: number; callId?: string; name?: string; delta: string }
|
||||
export interface ToolOutputPayload { callId: string; stream: 'stdout' | 'stderr'; text: string }
|
||||
export interface ToolResultPayload { callId: string; status: string; summary?: string; truncated?: boolean; durationMs?: number }
|
||||
export interface AgentSpawnPayload { agentRun: ID; name: string; task: string }
|
||||
export interface AgentProgressPayload { agentRun: ID; note?: string; phase?: RunPhase }
|
||||
export interface AgentResultPayload { agentRun: ID; status: RunStatus; summary?: string }
|
||||
@@ -103,11 +121,19 @@ export interface RunCompletedPayload {
|
||||
context?: ContextObservation
|
||||
}
|
||||
|
||||
interface ContextSection {
|
||||
name: string
|
||||
estTokens: number
|
||||
}
|
||||
|
||||
export interface ContextObservation {
|
||||
items: string[]
|
||||
truncations?: string[]
|
||||
estChars: number
|
||||
sections?: ContextSection[]
|
||||
prefixHash?: string
|
||||
}
|
||||
export interface RunCheckPayload { passed: boolean; reason?: string }
|
||||
export interface RunFailedPayload { code: string; message: string }
|
||||
|
||||
// ---- 收件箱卡片 ----
|
||||
@@ -125,7 +151,21 @@ export interface ActivityCard {
|
||||
sourceRunId?: ID; anchorMessageId?: ID;
|
||||
kind: CardKind; title: string; status: CardStatus; tone?: string;
|
||||
body?: UINode[]; actions?: { id: string; label: string; style?: 'primary' | 'default' | 'danger'; command?: string }[];
|
||||
pinned?: boolean; createdAt: string; updatedAt: string;
|
||||
pinned?: boolean; createdAt: string; updatedAt: string; work?: WorkCard;
|
||||
}
|
||||
|
||||
export interface WorkCard {
|
||||
result?: string; resultVersion: number; readVersion: number; completedAt?: string;
|
||||
decision?: WorkDecision;
|
||||
}
|
||||
export interface WorkDecision {
|
||||
runId?: ID;
|
||||
mode: 'single' | 'multiple'; state: 'open' | 'deferred' | 'dispatching' | 'submitted';
|
||||
options?: { id: string; label: string }[];
|
||||
selectedIds?: string[]; freeText?: string; respondedAt?: string;
|
||||
}
|
||||
export interface WorkCardAction {
|
||||
resultVersion: number; selectedIds?: string[]; freeText?: string;
|
||||
}
|
||||
|
||||
export interface CardPayload { card: ActivityCard }
|
||||
@@ -145,6 +185,7 @@ export interface HITLCard {
|
||||
choices?: HITLChoice[]; allowFreeInput: boolean; freeInputHint?: string;
|
||||
timeoutSec?: number | null; form?: UINode[]; createdAt: string; resolved: boolean;
|
||||
anchorMessageId?: ID; blocked?: boolean; blockReason?: string;
|
||||
detail?: string;
|
||||
}
|
||||
|
||||
export interface HITLResponse {
|
||||
@@ -159,6 +200,9 @@ export type UINodeType =
|
||||
|
||||
export interface UINode {
|
||||
type: UINodeType;
|
||||
/** Surface 层节点级标注(Generative UI U2):整页唯一稳定 id 与事实来源标识,旧路径不填。 */
|
||||
id?: string;
|
||||
source?: string[];
|
||||
title?: string;
|
||||
items?: string[];
|
||||
kv?: [string, string][];
|
||||
@@ -210,6 +254,8 @@ export interface PromptModule {
|
||||
body: string; outputContract?: string;
|
||||
source?: 'builtin' | 'plugin' | 'user'; owner?: string;
|
||||
basedOnVersion?: number; drifted?: boolean; disabled?: boolean;
|
||||
/** 子代理 profile。只对 agent.sub.* 有意义;空字段表示沿用内置。 */
|
||||
tools?: string[]; model?: string; maxTurns?: number;
|
||||
}
|
||||
|
||||
export interface PromptBlock { moduleId: string; version: number; layer: string; body: string; }
|
||||
@@ -238,6 +284,8 @@ export interface SettingDesc {
|
||||
default?: unknown; options?: string[];
|
||||
effect: 'hot' | 'new-run' | 'restart';
|
||||
secret?: boolean;
|
||||
/** P2 受管:system = 系统受管项,仅系统管理面可写(用户/项目层拒绝)。 */
|
||||
scope?: 'system';
|
||||
}
|
||||
|
||||
// ---- 插件 ----
|
||||
@@ -260,6 +308,36 @@ export interface PluginPanel {
|
||||
id: string; title: string; icon?: string; body: UINode[]; refreshTool?: string;
|
||||
}
|
||||
|
||||
/** 模板占位符:{{input}}、{{slots.<key>}}、{{steps.<id>.output}}。 */
|
||||
export interface WorkflowDef {
|
||||
id: string; title: string; description?: string; intentId?: string;
|
||||
/** 整条工作流的 critic 重试上限。 */
|
||||
maxRetries?: number;
|
||||
steps: WorkflowStep[];
|
||||
}
|
||||
|
||||
export interface StepCritic {
|
||||
criteria: string;
|
||||
/** 本步重试上限;缺省 1 次。 */
|
||||
maxRetries?: number;
|
||||
}
|
||||
|
||||
export interface WorkflowStep {
|
||||
id: string; title: string;
|
||||
kind: 'prompt' | 'tool' | 'hitl' | 'artifact' | 'card' | 'script';
|
||||
prompt?: string;
|
||||
/** prompt 步骤的子代理 profile,缺省 general。 */
|
||||
agent?: string;
|
||||
tool?: string;
|
||||
args?: unknown;
|
||||
hitl?: { question: string; kind: HITLKind; choices?: HITLChoice[]; allowFreeInput: boolean; freeInputHint?: string };
|
||||
artifact?: string;
|
||||
card?: { kind: CardKind; title: string; tone?: string; body?: UINode[]; actions?: { id: string; label: string; style?: 'primary' | 'default' | 'danger'; command?: string }[] };
|
||||
/** script 步骤在插件目录内的相对路径。 */
|
||||
script?: string;
|
||||
critic?: StepCritic;
|
||||
}
|
||||
|
||||
export interface PluginWorkspace {
|
||||
id: string; title: string; icon?: string; shortcut?: string;
|
||||
badgeTool?: string; body: UINode[]; refreshTool?: string;
|
||||
@@ -294,3 +372,45 @@ export interface UploadInfo {
|
||||
artifactId: ID; filename: string; mime?: string; size: number;
|
||||
parsed?: ParsedDocument;
|
||||
}
|
||||
|
||||
// ---- Generative UI Surface(提案 U2/U4;与 Go surface.go 同步)----
|
||||
|
||||
export interface SurfaceCompat {
|
||||
schemaVersion: number;
|
||||
catalogVersion: string;
|
||||
pluginVersion?: string;
|
||||
}
|
||||
|
||||
export interface SurfaceIdentity {
|
||||
surfaceId: ID;
|
||||
owner: string;
|
||||
projectId?: ID;
|
||||
conversationId?: ID;
|
||||
sourceRunId?: ID;
|
||||
pluginId: string;
|
||||
}
|
||||
|
||||
export interface SurfaceSpec {
|
||||
title: string;
|
||||
nodes: UINode[];
|
||||
}
|
||||
|
||||
export interface SurfaceSnapshot {
|
||||
identity: SurfaceIdentity;
|
||||
compat: SurfaceCompat;
|
||||
revision: number;
|
||||
baseRevision?: number;
|
||||
contextVersion?: string;
|
||||
activationEpoch: number;
|
||||
spec: SurfaceSpec;
|
||||
semanticText?: string;
|
||||
}
|
||||
|
||||
export interface SurfaceMeta {
|
||||
surfaceId: ID;
|
||||
title: string;
|
||||
pluginId: string;
|
||||
revision: number;
|
||||
conversationId?: ID;
|
||||
updatedAt: string;
|
||||
}
|
||||
|
||||
@@ -0,0 +1,214 @@
|
||||
// 文档驾驶舱 I2 纯逻辑层测试:能力门控、筛选切换、统计呈现(真 0 vs 不可算)、
|
||||
// 快照一致性/更新提示、上下文键、选择保留、树徽标。组件取数编排不在此覆盖。
|
||||
import { describe, expect, it } from 'vitest'
|
||||
import {
|
||||
contextKey, nodeSummaryLine, sameSnapshot, selectionSurvives, statDisplay,
|
||||
STAT_FILTERS, toggleFilter, treeBadges, updateNotice,
|
||||
type CockpitMeta, type CockpitStats, type CockpitTreeNode,
|
||||
} from './documentCockpit'
|
||||
import { cockpitReady, COCKPIT_COMMANDS } from './workspaces'
|
||||
|
||||
const meta = (rev: string, seq: number): CockpitMeta => ({
|
||||
schemaVersion: 'document-cockpit.v1', projectId: 'p1', snapshotRevision: rev,
|
||||
asOfSeq: seq, generatedAt: '2026-10-16T00:00:00Z', truncated: false,
|
||||
})
|
||||
|
||||
describe('cockpitReady', () => {
|
||||
const all = COCKPIT_COMMANDS.map(id => ({ id, enabled: true }))
|
||||
it('七命令齐备且 enabled 才就绪', () => {
|
||||
expect(cockpitReady(null)).toBe(false)
|
||||
expect(cockpitReady([])).toBe(false)
|
||||
expect(cockpitReady(all.map(c => ({ ...c, enabled: false })))).toBe(false)
|
||||
expect(cockpitReady(all.slice(0, 6))).toBe(false)
|
||||
expect(cockpitReady(all)).toBe(true)
|
||||
})
|
||||
})
|
||||
|
||||
describe('统计呈现:真 0 与不可算不得互相冒充', () => {
|
||||
const stats: CockpitStats = {
|
||||
documentCount: 0,
|
||||
completion: { known: 3, total: 5, state: 'known' },
|
||||
emptyNodeCount: 0,
|
||||
unverifiedSourceCount: 2,
|
||||
conflictCount: null as unknown as number,
|
||||
pendingChangeCount: null,
|
||||
updatedAt: '',
|
||||
statReasons: { conflictCount: 'upstream_error', pendingChangeCount: 'not_projected_v1' },
|
||||
}
|
||||
it('真 0 显示 0', () => {
|
||||
expect(statDisplay(stats, 'empty').value).toBe('0')
|
||||
expect(statDisplay(stats, 'documents').value).toBe('0')
|
||||
})
|
||||
it('null 显示 — 并带原因', () => {
|
||||
const d = statDisplay(stats, 'conflict')
|
||||
expect(d.value).toBe('—')
|
||||
expect(d.hint).toBe('upstream_error')
|
||||
})
|
||||
it('未纳入投影的统计显式标注原因', () => {
|
||||
const d = statDisplay(stats, 'pending')
|
||||
expect(d.value).toBe('—')
|
||||
expect(d.hint).toBe('not_projected_v1')
|
||||
})
|
||||
it('完成度三分态:known/partial/unavailable', () => {
|
||||
expect(statDisplay(stats, 'completion').value).toBe('3/5')
|
||||
expect(statDisplay({ ...stats, completion: { known: 1, total: 5, state: 'partial' } }, 'completion').hint).toBe('部分计算')
|
||||
const u = statDisplay({ ...stats, completion: { known: 0, total: 0, state: 'unavailable' } }, 'completion')
|
||||
expect(u.value).toBe('—')
|
||||
})
|
||||
})
|
||||
|
||||
describe('筛选切换', () => {
|
||||
it('点击切换、再点清除;统计键与筛选值一一对应', () => {
|
||||
expect(toggleFilter('', 'state:empty')).toBe('state:empty')
|
||||
expect(toggleFilter('state:empty', 'state:empty')).toBe('')
|
||||
expect(toggleFilter('state:empty', 'state:conflict')).toBe('state:conflict')
|
||||
expect(STAT_FILTERS.map(s => s.filter)).toEqual(['state:empty', 'state:unverified', 'state:conflict'])
|
||||
})
|
||||
})
|
||||
|
||||
describe('快照一致性与更新提示', () => {
|
||||
it('同 revision 同 seq 视为同快照', () => {
|
||||
expect(sameSnapshot(meta('wm:5', 5), meta('wm:5', 5))).toBe(true)
|
||||
expect(sameSnapshot(meta('wm:5', 5), meta('wm:6', 6))).toBe(false)
|
||||
expect(sameSnapshot(undefined, meta('wm:5', 5))).toBe(false)
|
||||
})
|
||||
it('展示快照落后时提示刷新,一致时不提示', () => {
|
||||
expect(updateNotice(meta('wm:5', 5), meta('wm:6', 6))).toContain('wm:6')
|
||||
expect(updateNotice(meta('wm:6', 6), meta('wm:6', 6))).toBeNull()
|
||||
expect(updateNotice(null, meta('wm:6', 6))).toBeNull()
|
||||
})
|
||||
})
|
||||
|
||||
describe('旧响应丢弃的上下文键', () => {
|
||||
it('项目与筛选任一变化都改变键', () => {
|
||||
expect(contextKey('p1', '')).not.toBe(contextKey('p2', ''))
|
||||
expect(contextKey('p1', '')).not.toBe(contextKey('p1', 'state:empty'))
|
||||
expect(contextKey('p1', 'state:empty')).toBe(contextKey('p1', 'state:empty'))
|
||||
})
|
||||
})
|
||||
|
||||
describe('刷新不重置选择', () => {
|
||||
it('文档仍在根清单则保留', () => {
|
||||
const kept = selectionSurvives({ kind: 'document', id: 'd1' }, ['d1', 'd2'])
|
||||
expect(kept).toEqual({ kind: 'document', id: 'd1' })
|
||||
})
|
||||
it('文档被筛掉则清空', () => {
|
||||
expect(selectionSurvives({ kind: 'document', id: 'd9' }, ['d1', 'd2'])).toBeNull()
|
||||
})
|
||||
it('章节选择随父文档存活', () => {
|
||||
expect(selectionSurvives({ kind: 'section', id: 's1' }, ['d1'], 'd1')).toEqual({ kind: 'section', id: 's1' })
|
||||
expect(selectionSurvives({ kind: 'section', id: 's1' }, ['d2'], 'd1')).toBeNull()
|
||||
expect(selectionSurvives(null, ['d1'])).toBeNull()
|
||||
})
|
||||
})
|
||||
|
||||
describe('树徽标与状态行', () => {
|
||||
const node = (over: Partial<CockpitTreeNode['state']> & { visibility?: string }): CockpitTreeNode => ({
|
||||
ref: { kind: 'section', id: 's1' }, title: '章节', path: [], childCount: 0,
|
||||
visibility: over.visibility || 'full',
|
||||
state: {
|
||||
content: 'complete', verification: 'not_applicable', sourceCount: 0,
|
||||
conflictCount: 0, impactCount: 0, missingChildCount: 0, structuralGap: true, ...over,
|
||||
},
|
||||
} as CockpitTreeNode)
|
||||
it('诚实徽标:空/受限/未核实/冲突计数', () => {
|
||||
expect(treeBadges(node({}))).toEqual([])
|
||||
expect(treeBadges(node({ content: 'empty' }))).toContain('空')
|
||||
expect(treeBadges(node({ verification: 'unverified' }))).toContain('未核实')
|
||||
expect(treeBadges(node({ conflictCount: 2 }))).toContain('冲突 2')
|
||||
expect(treeBadges(node({ visibility: 'metadata_only' }))).toContain('仅元数据')
|
||||
})
|
||||
it('结构缺口显式标注(冻结事实:doc→section 两级)', () => {
|
||||
const line = nodeSummaryLine(node({ content: 'empty' }))
|
||||
expect(line).toContain('内容为空')
|
||||
expect(line).toContain('层级止于章节')
|
||||
})
|
||||
})
|
||||
|
||||
// ---- I3:阅读器与右栏纯逻辑 ----
|
||||
import {
|
||||
assembleReader, diffLines, historyLine, mergeHistoryStrict, versionSummary,
|
||||
prefsKey, mergePrefs, loadPrefs,
|
||||
type CockpitHistorySummary, type CockpitVersionSummary,
|
||||
} from './documentCockpit'
|
||||
|
||||
describe('偏好:按用户+项目隔离,枚举外脏值回落默认', () => {
|
||||
it('prefsKey 区分用户与项目', () => {
|
||||
expect(prefsKey('a', 'p1')).not.toBe(prefsKey('a', 'p2'))
|
||||
expect(prefsKey('a', 'p1')).not.toBe(prefsKey('b', 'p1'))
|
||||
})
|
||||
it('mergePrefs 逐项校验', () => {
|
||||
expect(mergePrefs(null)).toEqual({ lastView: 'panorama', density: 'compact', rightPanelTab: 'sources' })
|
||||
expect(mergePrefs({ lastView: 'reader', density: 'full', rightPanelTab: 'conflicts' })).toEqual({
|
||||
lastView: 'reader', density: 'full', rightPanelTab: 'conflicts',
|
||||
})
|
||||
const junk = mergePrefs({ lastView: 'galaxy', density: 42, rightPanelTab: 'nope' })
|
||||
expect(junk.lastView).toBe('panorama')
|
||||
expect(junk.density).toBe('compact')
|
||||
expect(junk.rightPanelTab).toBe('sources')
|
||||
})
|
||||
it('loadPrefs 在无 localStorage 环境安全回落', () => {
|
||||
expect(loadPrefs('a', 'p1').lastView).toBe('panorama')
|
||||
})
|
||||
})
|
||||
|
||||
describe('版本摘要与行级差异', () => {
|
||||
const v = (seq: number, content?: string, redacted?: boolean): CockpitVersionSummary => ({
|
||||
seq, version: `v${seq}`, at: '2026-10-16T00:00:00Z', basisCount: 0, content, redacted,
|
||||
})
|
||||
it('当前+前一版;受限整体降级', () => {
|
||||
const s = versionSummary([v(3, '三'), v(2, '二'), v(1, '一')])
|
||||
expect(s.current?.version).toBe('v3')
|
||||
expect(s.previous?.version).toBe('v2')
|
||||
expect(s.redacted).toBe(false)
|
||||
const r = versionSummary([v(3, undefined, true)])
|
||||
expect(r.redacted).toBe(true)
|
||||
expect(versionSummary(undefined).current).toBeUndefined()
|
||||
})
|
||||
it('diffLines 标记新增/删除/保留', () => {
|
||||
const d = diffLines('共同\n新增行', '共同\n删除行')
|
||||
expect(d).toContainEqual({ flag: '=', text: '共同' })
|
||||
expect(d).toContainEqual({ flag: '+', text: '新增行' })
|
||||
expect(d).toContainEqual({ flag: '-', text: '删除行' })
|
||||
})
|
||||
})
|
||||
|
||||
describe('历史严格合并:乱序与重复丢弃(DV-R05)', () => {
|
||||
const h = (seq: number): CockpitHistorySummary => ({ seq, at: '', op: 'x', summary: `s${seq}` })
|
||||
it('只接受 seq 更大的条目', () => {
|
||||
const r = mergeHistoryStrict([h(10), h(9)], [h(11), h(8)])
|
||||
expect(r.items.map(i => i.seq)).toEqual([10, 9, 11])
|
||||
expect(r.dropped).toBe(1)
|
||||
})
|
||||
it('重复 seq 丢弃且计入 dropped', () => {
|
||||
const r = mergeHistoryStrict([h(10)], [h(10), h(11)])
|
||||
expect(r.items.map(i => i.seq)).toEqual([10, 11])
|
||||
expect(r.dropped).toBe(1)
|
||||
})
|
||||
it('空历史接受全部', () => {
|
||||
expect(mergeHistoryStrict([], [h(1), h(2)]).items.map(i => i.seq)).toEqual([1, 2])
|
||||
})
|
||||
it('historyLine 带操作者与本地时间', () => {
|
||||
expect(historyLine(h(1))).toContain('s1')
|
||||
})
|
||||
})
|
||||
|
||||
describe('阅读器装配:受限章节给占位不冒充空内容', () => {
|
||||
const sec = (id: string, content: string): CockpitTreeNode => ({
|
||||
ref: { kind: 'section', id }, title: id, path: [], childCount: 0,
|
||||
state: { content, verification: 'not_applicable', sourceCount: 0, conflictCount: 0, impactCount: 0, missingChildCount: 0, structuralGap: true },
|
||||
visibility: 'full',
|
||||
})
|
||||
it('正文/受限/未加载三分态', () => {
|
||||
const out = assembleReader(
|
||||
[sec('a', 'complete'), sec('b', 'complete'), sec('c', 'empty')],
|
||||
{
|
||||
a: { body: [{ kind: 'text', text: '正文A' }] },
|
||||
b: { body: [{ kind: 'restricted', reason: 'section-duty-or-authorship' }] },
|
||||
},
|
||||
)
|
||||
expect(out[0].blocks).toEqual([{ kind: 'text', text: '正文A' }])
|
||||
expect(out[1].blocks[0].kind).toBe('restricted')
|
||||
expect(out[2].blocks[0].reason).toBe('not_loaded')
|
||||
})
|
||||
})
|
||||
@@ -0,0 +1,342 @@
|
||||
// 文档驾驶舱 I2 纯逻辑层(rollout I2;契约:Dev 仓 docs/superpowers/specs
|
||||
// 2026-10-16-document-visualization-read-model-contract.md @ 37b272ba,
|
||||
// 四项取舍冻结见 plans/…-rollout.md §7)。只放可测判定:筛选切换、统计呈现
|
||||
//(真 0 vs 不可算)、快照一致性与更新提示、上下文键与选择保留。组件只做取数编排与渲染。
|
||||
|
||||
// ---- 契约类型(I1 后端 DTO 的前端精简形态) ----
|
||||
|
||||
export interface CockpitNodeRef { kind: string; id: string; version?: string }
|
||||
|
||||
export interface CockpitMeta {
|
||||
schemaVersion: string
|
||||
projectId: string
|
||||
snapshotRevision: string
|
||||
asOfSeq: number
|
||||
generatedAt: string
|
||||
truncated: boolean
|
||||
truncationReasons?: string[]
|
||||
}
|
||||
|
||||
export interface CockpitNodeState {
|
||||
content: string // complete|partial|empty|inaccessible|unavailable
|
||||
verification: string // verified|mixed|unverified|disputed|not_applicable
|
||||
sourceCount: number
|
||||
conflictCount: number
|
||||
impactCount: number
|
||||
missingChildCount: number
|
||||
structuralGap: boolean
|
||||
}
|
||||
|
||||
export interface CockpitTreeNode {
|
||||
ref: CockpitNodeRef
|
||||
title: string
|
||||
path: string[]
|
||||
parent?: CockpitNodeRef
|
||||
childCount: number
|
||||
state: CockpitNodeState
|
||||
lastChangedAt?: string
|
||||
lastChangedBy?: string
|
||||
visibility: string // full|redacted|metadata_only
|
||||
}
|
||||
|
||||
export interface CockpitStats {
|
||||
documentCount: number
|
||||
completion: { known: number; total: number; state: string }
|
||||
emptyNodeCount: number
|
||||
unverifiedSourceCount: number
|
||||
conflictCount: number
|
||||
pendingChangeCount: number | null
|
||||
updatedAt?: string
|
||||
statReasons: Record<string, string>
|
||||
}
|
||||
|
||||
export interface CockpitChangeSummary {
|
||||
node: CockpitNodeRef
|
||||
title: string
|
||||
changedAt: string
|
||||
actor?: string
|
||||
kind: string
|
||||
summary: string
|
||||
version?: string
|
||||
}
|
||||
|
||||
export interface CockpitOverview {
|
||||
meta: CockpitMeta
|
||||
project: { title: string }
|
||||
stats: CockpitStats
|
||||
documents: CockpitTreeNode[]
|
||||
recentChanges: CockpitChangeSummary[]
|
||||
}
|
||||
|
||||
export interface CockpitTreePage {
|
||||
meta: CockpitMeta
|
||||
items: CockpitTreeNode[]
|
||||
nextCursor?: string
|
||||
hasMore: boolean
|
||||
}
|
||||
|
||||
// ---- 统计带:点击即切换共享筛选(视图规格 §2;未知筛选由后端 400 拒绝) ----
|
||||
|
||||
export const STAT_FILTERS: { key: string; label: string; filter: string }[] = [
|
||||
{ key: 'empty', label: '空缺节点', filter: 'state:empty' },
|
||||
{ key: 'unverified', label: '未核实来源', filter: 'state:unverified' },
|
||||
{ key: 'conflict', label: '冲突', filter: 'state:conflict' },
|
||||
]
|
||||
|
||||
/** 点击统计卡:同筛选再次点击=清除(只定位,不执行写入)。 */
|
||||
export function toggleFilter(current: string, filter: string): string {
|
||||
return current === filter ? '' : filter
|
||||
}
|
||||
|
||||
/** 统计呈现:null(不可算)显示 — 加原因;真 0 显示 0。两侧都不得互相冒充(契约 §2/§6)。 */
|
||||
export function statDisplay(stats: CockpitStats, key: string): { value: string; hint?: string } {
|
||||
const reasons = stats.statReasons || {}
|
||||
if (key === 'documents') return { value: String(stats.documentCount) }
|
||||
if (key === 'completion') {
|
||||
const c = stats.completion
|
||||
if (c.state === 'unavailable') return { value: '—', hint: reasons['completion'] || '无法计算' }
|
||||
if (c.state === 'partial') return { value: `${c.known}/${c.total}`, hint: '部分计算' }
|
||||
return { value: `${c.known}/${c.total}` }
|
||||
}
|
||||
const map: Record<string, number | null | undefined> = {
|
||||
empty: stats.emptyNodeCount,
|
||||
unverified: stats.unverifiedSourceCount,
|
||||
conflict: stats.conflictCount,
|
||||
pending: stats.pendingChangeCount,
|
||||
}
|
||||
const v = map[key]
|
||||
// 原因表按后端 DTO 字段名(statReasons 键=字段名),展示键需映射。
|
||||
const reasonKey: Record<string, string> = {
|
||||
empty: 'emptyNodeCount', unverified: 'unverifiedSourceCount',
|
||||
conflict: 'conflictCount', pending: 'pendingChangeCount',
|
||||
}
|
||||
if (v === null || v === undefined) return { value: '—', hint: reasons[reasonKey[key] || key] || '暂不可计算' }
|
||||
return { value: String(v) }
|
||||
}
|
||||
|
||||
// ---- 快照一致性(DV-R05 前端侧):统计与树徽标同快照才同屏可信 ----
|
||||
|
||||
export function sameSnapshot(a?: CockpitMeta, b?: CockpitMeta): boolean {
|
||||
if (!a || !b) return false
|
||||
return a.snapshotRevision === b.snapshotRevision && a.asOfSeq === b.asOfSeq
|
||||
}
|
||||
|
||||
/** 更新提示:展示中快照落后于最新已见快照时提示刷新(不抢占滚动,视图规格 §5)。 */
|
||||
export function updateNotice(viewed: CockpitMeta | null, latest: CockpitMeta | null): string | null {
|
||||
if (!viewed || !latest) return null
|
||||
if (viewed.snapshotRevision === latest.snapshotRevision && viewed.asOfSeq === latest.asOfSeq) return null
|
||||
return `内容已更新(快照 ${latest.snapshotRevision})——刷新查看最新状态`
|
||||
}
|
||||
|
||||
/** 上下文键:项目+筛选标识一轮取数上下文;不匹配的旧响应直接丢弃(契约 §8)。 */
|
||||
export function contextKey(projectId: string, filter: string): string {
|
||||
return `${projectId}\u0001${filter}`
|
||||
}
|
||||
|
||||
/** 刷新不重置选择:文档仍在根清单(或选中章节的父文档仍在)则保留,否则清空。 */
|
||||
export function selectionSurvives(
|
||||
selected: CockpitNodeRef | null,
|
||||
rootDocIds: string[],
|
||||
parentDocId?: string,
|
||||
): CockpitNodeRef | null {
|
||||
if (!selected) return null
|
||||
if (selected.kind === 'document') return rootDocIds.includes(selected.id) ? selected : null
|
||||
if (parentDocId && rootDocIds.includes(parentDocId)) return selected
|
||||
return null
|
||||
}
|
||||
|
||||
/** 树行徽标(诚实状态:空/部分/受限/未核实/冲突计数;不虚构成功)。 */
|
||||
export function treeBadges(n: CockpitTreeNode): string[] {
|
||||
const out: string[] = []
|
||||
if (n.state.content === 'empty') out.push('空')
|
||||
else if (n.state.content === 'partial') out.push('部分')
|
||||
else if (n.state.content === 'inaccessible') out.push('受限')
|
||||
if (n.visibility === 'metadata_only') out.push('仅元数据')
|
||||
if (n.state.verification === 'unverified') out.push('未核实')
|
||||
if (n.state.conflictCount > 0) out.push(`冲突 ${n.state.conflictCount}`)
|
||||
return out
|
||||
}
|
||||
|
||||
/** 节点状态一句话总结(全景 §4.2)。 */
|
||||
export function nodeSummaryLine(n: CockpitTreeNode): string {
|
||||
const parts: string[] = []
|
||||
const content = { complete: '内容完整', partial: '内容部分', empty: '内容为空', inaccessible: '内容受限', unavailable: '暂不可读' }[n.state.content] || n.state.content
|
||||
parts.push(content)
|
||||
if (n.state.structuralGap) parts.push('层级止于章节')
|
||||
if (n.state.sourceCount > 0) parts.push(`来源 ${n.state.sourceCount}`)
|
||||
if (n.state.conflictCount > 0) parts.push(`冲突 ${n.state.conflictCount}`)
|
||||
if (n.state.impactCount > 0) parts.push(`影响 ${n.state.impactCount}`)
|
||||
return parts.join(' · ')
|
||||
}
|
||||
|
||||
// ---- I3:阅读器与右栏纯逻辑 ----
|
||||
|
||||
export interface CockpitVersionSummary {
|
||||
seq: number
|
||||
version: string
|
||||
actor?: string
|
||||
at: string
|
||||
basisCount: number
|
||||
content?: string
|
||||
redacted?: boolean
|
||||
}
|
||||
|
||||
export interface CockpitContentBlock { kind: string; text?: string; reason?: string }
|
||||
|
||||
export interface CockpitSourceSummary {
|
||||
ref: { kind: string; id: string }
|
||||
label: string
|
||||
capturedAt?: string
|
||||
confidence: string
|
||||
verification: string
|
||||
visibility: string
|
||||
redactedReason?: string
|
||||
}
|
||||
|
||||
export interface CockpitHistorySummary {
|
||||
seq: number
|
||||
at: string
|
||||
op: string
|
||||
actor?: string
|
||||
summary: string
|
||||
operationId?: string
|
||||
}
|
||||
|
||||
export interface CockpitImpactSummary {
|
||||
ref: { kind: string; id: string }
|
||||
edgeType: string
|
||||
edgeState: string
|
||||
direction: string
|
||||
layer: string
|
||||
}
|
||||
|
||||
export interface CockpitAssertion { node: CockpitNodeRef; claim: string; visibility: string; redactedReason?: string }
|
||||
|
||||
export interface CockpitConflictSummary {
|
||||
id: string
|
||||
node: CockpitNodeRef
|
||||
state: string
|
||||
left: CockpitAssertion
|
||||
right: CockpitAssertion
|
||||
detectedAt: string
|
||||
resolutionRef?: string
|
||||
}
|
||||
|
||||
export interface CockpitPage<T> { meta?: CockpitMeta; items: T[]; nextCursor?: string; hasMore: boolean; truncated?: boolean }
|
||||
|
||||
export const PANEL_TABS = [
|
||||
{ id: 'sources', label: '内容来源' },
|
||||
{ id: 'history', label: '修改历史' },
|
||||
{ id: 'impacts', label: '影响对象' },
|
||||
{ id: 'conflicts', label: '冲突与风险' },
|
||||
] as const
|
||||
export type PanelTabId = (typeof PANEL_TABS)[number]['id']
|
||||
|
||||
export type ViewMode = 'panorama' | 'reader'
|
||||
export type Density = 'compact' | 'full'
|
||||
|
||||
export interface CockpitPrefs {
|
||||
lastView: ViewMode
|
||||
density: Density
|
||||
rightPanelTab: PanelTabId
|
||||
}
|
||||
|
||||
/** 偏好按 用户+项目 隔离(设计 §7.3);仅本地存储,不构成授权。 */
|
||||
export function prefsKey(actor: string, projectId: string): string {
|
||||
return `cockpit-prefs:${actor}:${projectId}`
|
||||
}
|
||||
|
||||
/** 解析偏好:枚举外的脏值逐项回落默认(panorama+compact+sources)。 */
|
||||
export function mergePrefs(raw: unknown): CockpitPrefs {
|
||||
const base: CockpitPrefs = { lastView: 'panorama', density: 'compact', rightPanelTab: 'sources' }
|
||||
if (!raw || typeof raw !== 'object') return base
|
||||
const r = raw as Record<string, unknown>
|
||||
const out = { ...base }
|
||||
if (r.lastView === 'panorama' || r.lastView === 'reader') out.lastView = r.lastView
|
||||
if (r.density === 'compact' || r.density === 'full') out.density = r.density
|
||||
if (PANEL_TABS.some(t => t.id === r.rightPanelTab)) out.rightPanelTab = r.rightPanelTab as PanelTabId
|
||||
return out
|
||||
}
|
||||
|
||||
export function loadPrefs(actor: string, projectId: string): CockpitPrefs {
|
||||
try {
|
||||
const raw = typeof localStorage !== 'undefined' ? localStorage.getItem(prefsKey(actor, projectId)) : null
|
||||
return mergePrefs(raw ? JSON.parse(raw) : null)
|
||||
} catch {
|
||||
return mergePrefs(null)
|
||||
}
|
||||
}
|
||||
|
||||
export function savePrefs(actor: string, projectId: string, prefs: CockpitPrefs): void {
|
||||
try {
|
||||
if (typeof localStorage !== 'undefined') localStorage.setItem(prefsKey(actor, projectId), JSON.stringify(prefs))
|
||||
} catch { /* 存储不可用时偏好静默降级为会话内 */ }
|
||||
}
|
||||
|
||||
/** 版本摘要:当前版本 + 前一版本(视图规格 §5)。versions 为最新在前;受限版本无 content。 */
|
||||
export function versionSummary(versions: CockpitVersionSummary[] | undefined): {
|
||||
current?: CockpitVersionSummary
|
||||
previous?: CockpitVersionSummary
|
||||
redacted: boolean
|
||||
} {
|
||||
if (!versions || versions.length === 0) return { redacted: false }
|
||||
const current = versions[0]
|
||||
const previous = versions.length > 1 ? versions[1] : undefined
|
||||
return { current, previous, redacted: !!current.redacted }
|
||||
}
|
||||
|
||||
/** 历史面板合并:只接受严格更新(seq 更大且未见)的条目;过期与重复都计入 dropped(DV-R05/契约 §8)。 */
|
||||
export function mergeHistoryStrict(existing: CockpitHistorySummary[], incoming: CockpitHistorySummary[]): {
|
||||
items: CockpitHistorySummary[]
|
||||
dropped: number
|
||||
} {
|
||||
const seen = new Set(existing.map(e => e.seq))
|
||||
const maxSeq = existing.length > 0 ? Math.max(...seen) : -1
|
||||
const items = [...existing]
|
||||
let dropped = 0
|
||||
for (const e of incoming) {
|
||||
if (e.seq <= maxSeq || seen.has(e.seq)) {
|
||||
dropped++
|
||||
continue
|
||||
}
|
||||
seen.add(e.seq)
|
||||
items.push(e)
|
||||
}
|
||||
return { items, dropped }
|
||||
}
|
||||
|
||||
/** 阅读器装配:把文档的章节详情按树顺序组装为连续正文;受限章节给占位说明而非空白。 */
|
||||
export function assembleReader(
|
||||
sections: CockpitTreeNode[],
|
||||
details: Record<string, { body?: CockpitContentBlock[]; versions?: CockpitVersionSummary[] } | undefined>,
|
||||
): { ref: CockpitNodeRef; title: string; contentState: string; blocks: CockpitContentBlock[]; versions?: CockpitVersionSummary[] }[] {
|
||||
return sections.map(sec => {
|
||||
const d = details[sec.ref.id]
|
||||
const readable = !!d?.body && d.body.length > 0 && d.body[0].kind === 'text'
|
||||
const restricted = !!d?.body && d.body.length > 0 && d.body[0].kind === 'restricted'
|
||||
const blocks: CockpitContentBlock[] = readable
|
||||
? (d!.body as CockpitContentBlock[])
|
||||
: restricted
|
||||
? [{ kind: 'restricted', reason: d?.body?.[0]?.reason || 'section-duty-or-authorship' }]
|
||||
: [{ kind: 'restricted', reason: 'not_loaded' }]
|
||||
return { ref: sec.ref, title: sec.title, contentState: sec.state.content, blocks, versions: d?.versions }
|
||||
})
|
||||
}
|
||||
|
||||
/** 行级差异(阅读器 Collapsible 的完整对比):按行对齐的朴素 LCS 免实现——
|
||||
* 以行为单位做集合比对标记 +/=/-,足够呈现「完整差异」而不冒充精确补丁。 */
|
||||
export function diffLines(current: string, previous: string): { flag: '+' | '-' | '='; text: string }[] {
|
||||
const cur = current.split('\n')
|
||||
const prev = new Set(previous.split('\n'))
|
||||
const curSet = new Set(cur)
|
||||
const out: { flag: '+' | '-' | '='; text: string }[] = []
|
||||
for (const line of cur) out.push({ flag: prev.has(line) ? '=' : '+', text: line })
|
||||
for (const line of previous.split('\n')) if (!curSet.has(line)) out.push({ flag: '-', text: line })
|
||||
return out
|
||||
}
|
||||
|
||||
/** 历史条目的自然语言时间线文本(右栏 §6)。 */
|
||||
export function historyLine(h: CockpitHistorySummary): string {
|
||||
const who = h.actor ? `${h.actor} ` : ''
|
||||
return `${h.summary}(${who}${new Date(h.at).toLocaleString('zh-CN')})`
|
||||
}
|
||||
@@ -0,0 +1,197 @@
|
||||
// 文档职责草稿的唯一存储。三个视图只投影这份数据;单元格值由三权反推。
|
||||
export type CellDuty = 'none' | 'author' | 'reviewer' | 'approver'
|
||||
|
||||
interface DutyRoles {
|
||||
author: string
|
||||
reviewers: string[]
|
||||
approver: string
|
||||
}
|
||||
|
||||
export interface DutyDocDraft extends DutyRoles {
|
||||
docId: string
|
||||
title: string
|
||||
code: string
|
||||
typeKey: string
|
||||
stage: string
|
||||
dutyVersion: number
|
||||
activeRound: number
|
||||
legacySectionOverrides: number
|
||||
dirty: boolean
|
||||
}
|
||||
|
||||
export interface DutyMember {
|
||||
owner: string
|
||||
role: string
|
||||
valid: boolean
|
||||
canAuthor: boolean
|
||||
canReview: boolean
|
||||
canApprove: boolean
|
||||
}
|
||||
|
||||
interface DutySaveItem {
|
||||
docId: string
|
||||
author: string
|
||||
reviewers: string[]
|
||||
approver: string
|
||||
expectedDutyVersion: number
|
||||
confirmInvalidation: boolean
|
||||
}
|
||||
|
||||
export function cellDuty(roles: DutyRoles, owner: string): CellDuty {
|
||||
if (roles.author === owner) return 'author'
|
||||
if (roles.approver === owner) return 'approver'
|
||||
if (roles.reviewers.includes(owner)) return 'reviewer'
|
||||
return 'none'
|
||||
}
|
||||
|
||||
export function applyCell(roles: DutyRoles, owner: string, duty: CellDuty): {
|
||||
roles: DutyRoles
|
||||
replacedAuthor: string
|
||||
replacedApprover: string
|
||||
} {
|
||||
const replacedAuthor = duty === 'author' && roles.author !== '' && roles.author !== owner ? roles.author : ''
|
||||
const replacedApprover = duty === 'approver' && roles.approver !== '' && roles.approver !== owner ? roles.approver : ''
|
||||
let author = roles.author === owner ? '' : roles.author
|
||||
let approver = roles.approver === owner ? '' : roles.approver
|
||||
let reviewers = roles.reviewers.filter(person => person !== owner)
|
||||
switch (duty) {
|
||||
case 'author':
|
||||
author = owner
|
||||
break
|
||||
case 'approver':
|
||||
approver = owner
|
||||
break
|
||||
case 'reviewer':
|
||||
reviewers = [...reviewers, owner]
|
||||
break
|
||||
case 'none':
|
||||
break
|
||||
default: {
|
||||
const exhaustive: never = duty
|
||||
throw new Error(exhaustive)
|
||||
}
|
||||
}
|
||||
return { roles: { author, reviewers, approver }, replacedAuthor, replacedApprover }
|
||||
}
|
||||
|
||||
export function replacementNote(roles: DutyRoles, owner: string, duty: CellDuty): string {
|
||||
if (duty === 'author' && roles.author !== '' && roles.author !== owner) return `将替换${roles.author}`
|
||||
if (duty === 'approver' && roles.approver !== '' && roles.approver !== owner) return `将替换${roles.approver}`
|
||||
return ''
|
||||
}
|
||||
|
||||
function dutyConflicts(roles: DutyRoles): number {
|
||||
const seen = new Map<string, number>()
|
||||
const mark = (owner: string) => {
|
||||
if (!owner) return
|
||||
seen.set(owner, (seen.get(owner) ?? 0) + 1)
|
||||
}
|
||||
mark(roles.author)
|
||||
mark(roles.approver)
|
||||
for (const reviewer of roles.reviewers) mark(reviewer)
|
||||
let conflicts = 0
|
||||
for (const count of seen.values()) if (count > 1) conflicts += 1
|
||||
return conflicts
|
||||
}
|
||||
|
||||
export function completeness(roles: DutyRoles): { authors: number; reviewers: number; approvers: number; conflicts: number } {
|
||||
return {
|
||||
authors: roles.author ? 1 : 0,
|
||||
reviewers: roles.reviewers.length,
|
||||
approvers: roles.approver ? 1 : 0,
|
||||
conflicts: dutyConflicts(roles),
|
||||
}
|
||||
}
|
||||
|
||||
export function saveIssues(roles: DutyRoles): string[] {
|
||||
const issues: string[] = []
|
||||
if (!roles.author) issues.push('需指定编制人')
|
||||
if (roles.reviewers.length === 0) issues.push('审核至少一人')
|
||||
if (!roles.approver) issues.push('需指定批准人')
|
||||
if (dutyConflicts(roles) > 0) issues.push('一人只能担一个职责')
|
||||
return issues
|
||||
}
|
||||
|
||||
function rolesFromCells(docId: string, cells: { docId: string; owner: string; duty: string }[]): DutyRoles {
|
||||
const roles: DutyRoles = { author: '', reviewers: [], approver: '' }
|
||||
for (const cell of cells) {
|
||||
if (cell.docId !== docId) continue
|
||||
if (cell.duty !== 'none' && cell.duty !== 'author' && cell.duty !== 'reviewer' && cell.duty !== 'approver') continue
|
||||
const next = applyCell(roles, cell.owner, cell.duty)
|
||||
roles.author = next.roles.author
|
||||
roles.reviewers = next.roles.reviewers
|
||||
roles.approver = next.roles.approver
|
||||
}
|
||||
return roles
|
||||
}
|
||||
|
||||
export function absorbServerDocs(
|
||||
current: DutyDocDraft[],
|
||||
docs: {
|
||||
docId: string; title: string; code?: string; typeKey: string; stage?: string
|
||||
dutyVersion: number; activeRound?: number; legacySectionOverrides?: number
|
||||
}[],
|
||||
cells: { docId: string; owner: string; duty: string }[],
|
||||
replaceDirty = false,
|
||||
): DutyDocDraft[] {
|
||||
const byId = new Map(current.map(doc => [doc.docId, doc]))
|
||||
const pageIds = new Set(docs.map(doc => doc.docId))
|
||||
const next: DutyDocDraft[] = []
|
||||
for (const doc of docs) {
|
||||
const previous = byId.get(doc.docId)
|
||||
const serverRoles = rolesFromCells(doc.docId, cells)
|
||||
const keepDraft = !replaceDirty && previous?.dirty === true
|
||||
next.push({
|
||||
docId: doc.docId,
|
||||
title: doc.title,
|
||||
code: doc.code ?? doc.docId,
|
||||
typeKey: doc.typeKey,
|
||||
stage: doc.stage ?? '',
|
||||
dutyVersion: keepDraft ? previous.dutyVersion : doc.dutyVersion,
|
||||
activeRound: doc.activeRound ?? 0,
|
||||
legacySectionOverrides: doc.legacySectionOverrides ?? 0,
|
||||
dirty: keepDraft,
|
||||
author: keepDraft ? previous.author : serverRoles.author,
|
||||
reviewers: keepDraft ? previous.reviewers : serverRoles.reviewers,
|
||||
approver: keepDraft ? previous.approver : serverRoles.approver,
|
||||
})
|
||||
}
|
||||
for (const doc of current) {
|
||||
if (!replaceDirty && doc.dirty && !pageIds.has(doc.docId)) next.push(doc)
|
||||
}
|
||||
return next
|
||||
}
|
||||
|
||||
export function editCell(docs: DutyDocDraft[], docId: string, owner: string, duty: CellDuty): DutyDocDraft[] {
|
||||
return docs.map(doc => {
|
||||
if (doc.docId !== docId) return doc
|
||||
const next = applyCell(doc, owner, duty)
|
||||
return { ...doc, ...next.roles, dirty: true }
|
||||
})
|
||||
}
|
||||
|
||||
export function dirtyDocs(docs: DutyDocDraft[]): DutyDocDraft[] {
|
||||
return docs.filter(doc => doc.dirty)
|
||||
}
|
||||
|
||||
export function savePayload(docs: DutyDocDraft[], confirmInvalidation: boolean): { docs: DutySaveItem[]; issues: string[] } {
|
||||
const dirty = dirtyDocs(docs)
|
||||
const issues: string[] = []
|
||||
if (dirty.length === 0) issues.push('没有未保存的职责')
|
||||
if (dirty.length > 20) issues.push('一次保存最多 20 份文档')
|
||||
for (const doc of dirty) {
|
||||
for (const issue of saveIssues(doc)) issues.push(`${doc.title}:${issue}`)
|
||||
}
|
||||
return {
|
||||
docs: dirty.slice(0, 20).map(doc => ({
|
||||
docId: doc.docId,
|
||||
author: doc.author,
|
||||
reviewers: doc.reviewers,
|
||||
approver: doc.approver,
|
||||
expectedDutyVersion: doc.dutyVersion,
|
||||
confirmInvalidation: confirmInvalidation && doc.activeRound > 0,
|
||||
})),
|
||||
issues,
|
||||
}
|
||||
}
|
||||
|
||||
@@ -0,0 +1,203 @@
|
||||
import type { CellDuty, DutyDocDraft, DutyMember } from './draft'
|
||||
import { cellDuty, completeness, replacementNote, saveIssues } from './draft'
|
||||
|
||||
const DUTY_OPTIONS: { value: CellDuty; label: string }[] = [
|
||||
{ value: 'none', label: '无职责' },
|
||||
{ value: 'author', label: '编制' },
|
||||
{ value: 'reviewer', label: '审核' },
|
||||
{ value: 'approver', label: '批准' },
|
||||
]
|
||||
|
||||
function DutySelect({
|
||||
doc, owner, disabled, onChange,
|
||||
}: {
|
||||
doc: DutyDocDraft
|
||||
owner: string
|
||||
disabled: boolean
|
||||
onChange: (duty: CellDuty) => void
|
||||
}) {
|
||||
const current = cellDuty(doc, owner)
|
||||
return (
|
||||
<label className="duty-cell">
|
||||
<select
|
||||
aria-label={`${owner} 在 ${doc.title} 的职责`}
|
||||
value={current}
|
||||
disabled={disabled}
|
||||
onChange={event => {
|
||||
const value = event.target.value
|
||||
if (value === 'none' || value === 'author' || value === 'reviewer' || value === 'approver') onChange(value)
|
||||
}}
|
||||
>
|
||||
{DUTY_OPTIONS.map(option => {
|
||||
const hint = replacementNote(doc, owner, option.value)
|
||||
return <option key={option.value} value={option.value}>{hint ? `${option.label}(${hint})` : option.label}</option>
|
||||
})}
|
||||
</select>
|
||||
</label>
|
||||
)
|
||||
}
|
||||
|
||||
export function DutyByMemberView({
|
||||
member, members, docs, disabled, onMember, onCell,
|
||||
}: {
|
||||
member: string
|
||||
members: DutyMember[]
|
||||
docs: DutyDocDraft[]
|
||||
disabled: boolean
|
||||
onMember: (owner: string) => void
|
||||
onCell: (docId: string, owner: string, duty: CellDuty) => void
|
||||
}) {
|
||||
return (
|
||||
<div>
|
||||
<div className="setting-row">
|
||||
<label htmlFor="duty-member">成员</label>
|
||||
<select id="duty-member" aria-label="选择成员" value={member} onChange={event => onMember(event.target.value)}>
|
||||
<option value="">选择成员</option>
|
||||
{members.map(person => <option key={person.owner} value={person.owner}>{person.owner}</option>)}
|
||||
</select>
|
||||
</div>
|
||||
{!member ? <p className="ad-hint">先选择成员,再为每份文档指定无职责、编制、审核或批准。</p> : (
|
||||
<table className="ad-table">
|
||||
<thead><tr><th>文档</th><th>类型 / 阶段</th><th>职责</th><th>完整性</th></tr></thead>
|
||||
<tbody>
|
||||
{docs.map(doc => {
|
||||
const score = completeness(doc)
|
||||
return (
|
||||
<tr key={doc.docId}>
|
||||
<td>{doc.title}<span className="ad-dim ad-mono"> · {doc.code}</span></td>
|
||||
<td className="ad-dim">{doc.typeKey}{doc.stage ? ` / ${doc.stage}` : ''}</td>
|
||||
<td><DutySelect doc={doc} owner={member} disabled={disabled} onChange={duty => onCell(doc.docId, member, duty)} /></td>
|
||||
<td className="ad-dim">编 {score.authors}/1 · 审 {score.reviewers} · 批 {score.approvers}/1</td>
|
||||
</tr>
|
||||
)
|
||||
})}
|
||||
{docs.length === 0 && <tr><td colSpan={4} className="ad-dim">没有符合筛选的文档</td></tr>}
|
||||
</tbody>
|
||||
</table>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export function DutyByDocumentView({
|
||||
docId, docs, members, disabled, onDoc, onCell,
|
||||
}: {
|
||||
docId: string
|
||||
docs: DutyDocDraft[]
|
||||
members: DutyMember[]
|
||||
disabled: boolean
|
||||
onDoc: (id: string) => void
|
||||
onCell: (docId: string, owner: string, duty: CellDuty) => void
|
||||
}) {
|
||||
const doc = docs.find(item => item.docId === docId)
|
||||
const score = doc ? completeness(doc) : null
|
||||
const issues = doc ? saveIssues(doc) : []
|
||||
return (
|
||||
<div>
|
||||
<div className="setting-row">
|
||||
<label htmlFor="duty-doc">文档</label>
|
||||
<select id="duty-doc" aria-label="选择文档" value={docId} onChange={event => onDoc(event.target.value)}>
|
||||
<option value="">选择整份文档</option>
|
||||
{docs.map(item => <option key={item.docId} value={item.docId}>{item.title}</option>)}
|
||||
</select>
|
||||
</div>
|
||||
{score && <p className="ad-hint">编制 {score.authors}/1、审核 {score.reviewers} 人、批准 {score.approvers}/1、冲突 {score.conflicts}{issues.length > 0 ? `。${issues.join(',')}` : ''}</p>}
|
||||
{!doc ? <p className="ad-hint">先选择整份文档。这里不能选择章节,也没有生成入口。</p> : (
|
||||
<table className="ad-table">
|
||||
<thead><tr><th>成员</th><th>项目身份</th><th>职责</th></tr></thead>
|
||||
<tbody>
|
||||
{members.map(person => (
|
||||
<tr key={person.owner}>
|
||||
<td className="ad-mono">{person.owner}{person.valid ? '' : '(无效)'}</td>
|
||||
<td className="ad-dim">{person.role === 'owner' ? '项目负责人' : '项目成员'}</td>
|
||||
<td><DutySelect doc={doc} owner={person.owner} disabled={disabled || !person.valid} onChange={duty => onCell(doc.docId, person.owner, duty)} /></td>
|
||||
</tr>
|
||||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export function DutyMatrixView({
|
||||
docs, members, disabled, narrow, onCell,
|
||||
}: {
|
||||
docs: DutyDocDraft[]
|
||||
members: DutyMember[]
|
||||
disabled: boolean
|
||||
narrow: boolean
|
||||
onCell: (docId: string, owner: string, duty: CellDuty) => void
|
||||
}) {
|
||||
if (narrow) {
|
||||
return <p className="ad-hint">当前宽度放不下成员×文档矩阵。请使用“按人员”或“按文档”。</p>
|
||||
}
|
||||
return (
|
||||
<div className="duty-matrix-wrap">
|
||||
<table className="ad-table duty-matrix">
|
||||
<thead>
|
||||
<tr>
|
||||
<th className="duty-sticky">成员</th>
|
||||
{docs.map(doc => {
|
||||
const score = completeness(doc)
|
||||
const ready = score.authors === 1 && score.reviewers >= 1 && score.approvers === 1 && score.conflicts === 0
|
||||
return <th key={doc.docId}>{doc.title}<span className={ready ? 'ad-chip' : 'ad-chip ad-chip-warn'}>{ready ? '三权齐' : '未齐'}</span></th>
|
||||
})}
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{members.map(person => (
|
||||
<tr key={person.owner}>
|
||||
<td className="duty-sticky ad-mono">{person.owner}</td>
|
||||
{docs.map(doc => (
|
||||
<td key={doc.docId}>
|
||||
<DutySelect doc={doc} owner={person.owner} disabled={disabled || !person.valid} onChange={duty => onCell(doc.docId, person.owner, duty)} />
|
||||
</td>
|
||||
))}
|
||||
</tr>
|
||||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export function DutyChangePreview({
|
||||
impacts, confirm, onConfirm,
|
||||
}: {
|
||||
impacts: {
|
||||
docId: string
|
||||
title?: string
|
||||
replacedAuthor?: string
|
||||
replacedApprover?: string
|
||||
needsConfirm?: boolean
|
||||
reasons?: string[]
|
||||
}[]
|
||||
confirm: boolean
|
||||
onConfirm: (value: boolean) => void
|
||||
}) {
|
||||
if (impacts.length === 0) return null
|
||||
const needs = impacts.some(item => item.needsConfirm)
|
||||
return (
|
||||
<div className="settings-group">
|
||||
<h4>保存前预览</h4>
|
||||
<ul>
|
||||
{impacts.map(item => (
|
||||
<li key={item.docId}>
|
||||
{item.title || item.docId}
|
||||
{item.replacedAuthor ? `:编制将替换${item.replacedAuthor}` : ''}
|
||||
{item.replacedApprover ? `:批准将替换${item.replacedApprover}` : ''}
|
||||
{item.needsConfirm ? ';在途审签将失效,历史名单保持不变' : ''}
|
||||
{item.reasons && item.reasons.length > 0 ? `;${item.reasons.join(',')}` : ''}
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
{needs && (
|
||||
<label>
|
||||
<input type="checkbox" checked={confirm} onChange={event => onConfirm(event.target.checked)} />
|
||||
确认使受影响的在途审签失效
|
||||
</label>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
+272
-42
@@ -1,20 +1,43 @@
|
||||
// live 流式投影纯逻辑(中栏过程/回复分离):事件按到达序并入 items——thinking/text
|
||||
// 增量各并入其末段,工具按当前位置落位。SSE 有序且后端每轮按 思考→正文→工具 追加落库
|
||||
// 部件,事件到达序即落库序,故合成消息与落库部件同构,终态对账不重排。
|
||||
// 文本段是否为过程(process)由「本段之后、下一个思考/文本段之前是否出现工具」判定,
|
||||
// 对齐落库的 Process: len(calls) > 0——工具轮解说的 tool.call 一到即并入过程区,
|
||||
// 无需等下一轮文本段开启。
|
||||
// 残余边界:某轮若既无正文也无思考、仅静默发起工具,其调用会被并入上一文本段(需协议
|
||||
// 携带轮次归属才能消除;现行事件流无法区分)。
|
||||
import type { Message, Part } from './contracts'
|
||||
// 文本段是否为过程(process)由「本段之后、下一个思考/文本段之前是否出现工具」判定。
|
||||
// 参数增量(编写中)一到即算工具,解说不用等工具真正开始执行才离开回复区。
|
||||
import type { Message, Part, StreamEvent } from './contracts'
|
||||
import type { LiveState } from './store'
|
||||
import { splitTimeline, type ReplayPart } from './messageparts'
|
||||
|
||||
export type ToolLiveState = 'composing' | 'running' | 'done'
|
||||
|
||||
// 到达序部件流的元素。
|
||||
export type LiveItem =
|
||||
| { kind: 'thinking'; text: string; startedAt: number; endedAt: number }
|
||||
| { kind: 'text'; index: number; text: string }
|
||||
| { kind: 'tool'; callId?: string; name: string; status?: string; summary?: string }
|
||||
| { kind: 'agent'; text: string; agentRun?: string; agentPhase?: 'spawn' | 'progress' | 'result' }
|
||||
| {
|
||||
kind: 'tool'
|
||||
callId?: string
|
||||
index?: number
|
||||
name: string
|
||||
args: string
|
||||
state: ToolLiveState
|
||||
startedAt: number
|
||||
endedAt: number
|
||||
output: string
|
||||
status?: string
|
||||
summary?: string
|
||||
}
|
||||
| { kind: 'artifact'; artifact: { artifactId: string; name: string; kind?: string } }
|
||||
| { kind: 'check'; passed: boolean; reason: string }
|
||||
| { kind: 'final' }
|
||||
|
||||
type LiveTool = Extract<LiveItem, { kind: 'tool' }>
|
||||
|
||||
const OUTPUT_TAIL = 4096
|
||||
|
||||
function isTool(it: LiveItem): it is LiveTool {
|
||||
return it.kind === 'tool'
|
||||
}
|
||||
|
||||
// applyThinkingDelta 并入思考增量:末段是思考则追加,否则开启新思考段(新轮开始)。
|
||||
// now 供测试固定首尾时间;缺省用墙上时钟,durationMs = endedAt - startedAt。
|
||||
@@ -39,71 +62,278 @@ export function applyTextDelta(items: LiveItem[], index: number, delta: string):
|
||||
return [...items, { kind: 'text', index, text: delta }]
|
||||
}
|
||||
|
||||
export function applyToolCall(items: LiveItem[], name: string, callId?: string): LiveItem[] {
|
||||
return [...items, { kind: 'tool', callId, name }]
|
||||
}
|
||||
|
||||
// applyArtifactCreated 追加工件引用(artifact.created 事件)。投影时作为
|
||||
// 交付物钉在消息尾部(内容部件,不进过程折叠)——与落库序同构。
|
||||
export function applyArtifactCreated(items: LiveItem[], artifact: { artifactId: string; name: string; kind?: string }): LiveItem[] {
|
||||
return [...items, { kind: 'artifact', artifact }]
|
||||
}
|
||||
|
||||
// applyToolResult 回填对应工具(优先按 callId 配对,回落到最近一个未决工具——
|
||||
// 与落库的尾部配对语义一致)。
|
||||
export function applyToolResult(items: LiveItem[], callId: string | undefined, status: string, summary?: string): LiveItem[] {
|
||||
// applyToolCallDelta 并入正在编写的参数。同 index(或同 callId)的编写中条目追加,否则新开一条。
|
||||
export function applyToolCallDelta(items: LiveItem[], index: number, delta: string, callId?: string, name?: string, now = Date.now()): LiveItem[] {
|
||||
for (let i = items.length - 1; i >= 0; i--) {
|
||||
const it = items[i]
|
||||
if (it.kind !== 'tool' || it.status !== undefined) continue
|
||||
if (callId && it.callId && it.callId !== callId) continue
|
||||
if (!isTool(it) || it.state !== 'composing') continue
|
||||
if (it.index !== index && !(callId && it.callId === callId)) continue
|
||||
const out = items.slice()
|
||||
out[i] = { kind: 'tool', callId: it.callId, name: it.name, status, summary }
|
||||
out[i] = {
|
||||
...it,
|
||||
args: it.args + delta,
|
||||
callId: callId || it.callId,
|
||||
name: name || it.name,
|
||||
endedAt: now,
|
||||
}
|
||||
return out
|
||||
}
|
||||
return [...items, {
|
||||
kind: 'tool', index, callId, name: name || '工具', args: delta,
|
||||
state: 'composing', startedAt: now, endedAt: now, output: '',
|
||||
}]
|
||||
}
|
||||
|
||||
// applyToolCall 把一条调用标成运行中。优先按 callId 接上编写中的条目,否则接第一条编写中的条目。
|
||||
export function applyToolCall(items: LiveItem[], name: string, callId?: string, args?: string, now = 0): LiveItem[] {
|
||||
let idx = -1
|
||||
if (callId) {
|
||||
for (let i = 0; i < items.length; i++) {
|
||||
const it = items[i]
|
||||
if (isTool(it) && it.state === 'composing' && it.callId === callId) { idx = i; break }
|
||||
}
|
||||
}
|
||||
if (idx < 0) {
|
||||
for (let i = 0; i < items.length; i++) {
|
||||
const it = items[i]
|
||||
if (isTool(it) && it.state === 'composing') { idx = i; break }
|
||||
}
|
||||
}
|
||||
if (idx >= 0) {
|
||||
const it = items[idx] as LiveTool
|
||||
const out = items.slice()
|
||||
out[idx] = {
|
||||
...it,
|
||||
name: name || it.name,
|
||||
callId: callId || it.callId,
|
||||
args: args || it.args,
|
||||
state: 'running',
|
||||
startedAt: now || it.startedAt,
|
||||
endedAt: now,
|
||||
}
|
||||
return out
|
||||
}
|
||||
return [...items, {
|
||||
kind: 'tool', callId, name, args: args ?? '', state: 'running',
|
||||
startedAt: now, endedAt: now, output: '',
|
||||
}]
|
||||
}
|
||||
|
||||
// applyToolOutput 把执行中的输出追加到对应工具,只保留尾部,避免长日志撑住内存。
|
||||
export function applyToolOutput(items: LiveItem[], callId: string | undefined, text: string, maxChars = OUTPUT_TAIL): LiveItem[] {
|
||||
for (let i = items.length - 1; i >= 0; i--) {
|
||||
const it = items[i]
|
||||
if (!isTool(it) || it.state === 'done') continue
|
||||
if (callId && it.callId && it.callId !== callId) continue
|
||||
let output = it.output + text
|
||||
if (output.length > maxChars) output = output.slice(output.length - maxChars)
|
||||
const out = items.slice()
|
||||
out[i] = { ...it, output }
|
||||
return out
|
||||
}
|
||||
return items
|
||||
}
|
||||
|
||||
// liveToMessage:run 进行中没有已落库的助手消息,把 LiveState 合成同构临时消息,
|
||||
// 复用 AssistantMessage 渲染(思考/工具/文本实时上屏);终态对账后由真消息替代。
|
||||
// applyToolResult 回填对应工具(优先按 callId 配对,回落到最近一个未决工具)。
|
||||
export function applyToolResult(items: LiveItem[], callId: string | undefined, status: string, summary?: string, now = 0): LiveItem[] {
|
||||
for (let i = items.length - 1; i >= 0; i--) {
|
||||
const it = items[i]
|
||||
if (!isTool(it) || it.state === 'done') continue
|
||||
if (callId && it.callId && it.callId !== callId) continue
|
||||
const out = items.slice()
|
||||
out[i] = { ...it, callId: it.callId, name: it.name, status, summary, state: 'done', endedAt: now || it.endedAt }
|
||||
return out
|
||||
}
|
||||
return items
|
||||
}
|
||||
|
||||
export function applyCheck(items: LiveItem[], passed: boolean, reason: string): LiveItem[] {
|
||||
return [...items, { kind: 'check', passed, reason }]
|
||||
}
|
||||
|
||||
/** A child streams cumulative previews. Replace that child's latest preview in
|
||||
* place, while preserving real phase changes and the order of other children. */
|
||||
function applyAgentProgress(items: LiveItem[], agentRun: string, note: string): LiveItem[] {
|
||||
const text = note.trim()
|
||||
if (!text) return items
|
||||
for (let i = items.length - 1; i >= 0; i--) {
|
||||
const previous = items[i]
|
||||
if (previous.kind !== 'agent' || previous.agentRun !== agentRun) continue
|
||||
if (previous.agentPhase !== 'progress') break
|
||||
const value = previous.text.slice('协作进展:'.length)
|
||||
if (value === text || value.startsWith(text)) return items
|
||||
if (text.startsWith(value) && !/^调用\s/.test(text)) {
|
||||
const next = items.slice()
|
||||
next[i] = { ...previous, text: `协作进展:${text}` }
|
||||
return next
|
||||
}
|
||||
break
|
||||
}
|
||||
return [...items, { kind: 'agent', text: `协作进展:${text}`, agentRun, agentPhase: 'progress' }]
|
||||
}
|
||||
|
||||
// applyFinalizing 标记收尾开始:此前的正文都是过程,此后的正文才是给用户的回复。
|
||||
export function applyFinalizing(items: LiveItem[]): LiveItem[] {
|
||||
if (items.some(it => it.kind === 'final')) return items
|
||||
return [...items, { kind: 'final' }]
|
||||
}
|
||||
|
||||
export function applyArtifactCreated(items: LiveItem[], artifact: { artifactId: string; name: string; kind?: string }): LiveItem[] {
|
||||
return [...items, { kind: 'artifact', artifact }]
|
||||
}
|
||||
|
||||
export function applyArtifactUpdated(items: LiveItem[], artifact: { artifactId: string; name: string; kind?: string }): LiveItem[] {
|
||||
const out = items.slice()
|
||||
for (let i = out.length - 1; i >= 0; i--) {
|
||||
const it = out[i]
|
||||
if (it.kind === 'artifact' && it.artifact.artifactId === artifact.artifactId) {
|
||||
out[i] = { kind: 'artifact', artifact: { ...it.artifact, ...artifact } }
|
||||
return out
|
||||
}
|
||||
}
|
||||
return [...out, { kind: 'artifact', artifact }]
|
||||
}
|
||||
|
||||
// liveToMessage:run 进行中没有已落库的助手消息,把 LiveState 合成同构临时消息。
|
||||
export function liveToMessage(live: LiveState): Message {
|
||||
// 文本段是否为过程:本段之后、下一个思考/文本段之前出现工具(= 该轮带工具调用)。
|
||||
const finalAt = live.items.findIndex(it => it.kind === 'final')
|
||||
const textProcess = new Map<number, boolean>()
|
||||
for (let i = 0; i < live.items.length; i++) {
|
||||
if (live.items[i].kind !== 'text') continue
|
||||
if (finalAt >= 0) {
|
||||
textProcess.set(i, i < finalAt)
|
||||
continue
|
||||
}
|
||||
let hasCalls = false
|
||||
for (let j = i + 1; j < live.items.length && live.items[j].kind === 'tool'; j++) hasCalls = true
|
||||
textProcess.set(i, hasCalls)
|
||||
}
|
||||
const parts: Part[] = []
|
||||
const deliverables: Part[] = []
|
||||
for (let i = 0; i < live.items.length; i++) {
|
||||
const it = live.items[i]
|
||||
if (it.kind === 'thinking') {
|
||||
if (it.kind === 'final' || it.kind === 'artifact') continue
|
||||
if (it.kind === 'check') {
|
||||
parts.push({ type: 'check', process: true, check: { passed: it.passed, reason: it.reason || undefined } })
|
||||
continue
|
||||
}
|
||||
if (it.kind === 'agent') {
|
||||
parts.push({ type: 'text', text: it.text, process: true, replaySource: 'agent' } as ReplayPart)
|
||||
} else if (it.kind === 'thinking') {
|
||||
const durationMs = it.endedAt - it.startedAt
|
||||
if (it.text) parts.push({
|
||||
type: 'thinking', text: it.text, process: true,
|
||||
...(durationMs > 0 ? { durationMs } : {}),
|
||||
})
|
||||
} else if (it.kind === 'tool') {
|
||||
parts.push({ type: 'tool_call', process: true, toolCall: { id: it.callId ?? '', name: it.name } })
|
||||
if (it.status !== undefined) {
|
||||
parts.push({ type: 'tool_result', process: true, toolCall: { id: it.callId ?? '', name: it.name },
|
||||
toolResult: { callId: it.callId ?? '', status: it.status === 'error' ? 'error' : 'ok', summary: it.summary } })
|
||||
const durationMs = it.state === 'done' ? it.endedAt - it.startedAt : 0
|
||||
const call = {
|
||||
id: it.callId ?? '',
|
||||
name: it.name,
|
||||
...(it.args ? { arguments: it.args } : {}),
|
||||
...(durationMs > 0 ? { durationMs } : {}),
|
||||
}
|
||||
parts.push({
|
||||
type: 'tool_call', process: true, toolCall: call,
|
||||
toolPhase: it.state, ...(it.output ? { toolOutput: it.output } : {}),
|
||||
} as Part)
|
||||
if (it.state === 'done') {
|
||||
parts.push({
|
||||
type: 'tool_result', process: true, toolCall: { id: call.id, name: call.name },
|
||||
toolResult: { callId: call.id, status: it.status === 'error' ? 'error' : 'ok', summary: it.summary },
|
||||
})
|
||||
}
|
||||
} else if (it.kind === 'artifact') {
|
||||
// 交付物卡片:内容部件,投影钉尾(落库侧 llm.go 同序——最终正文之后),
|
||||
// 流式期间即可在消息底部看到"文件已生成"卡片。
|
||||
deliverables.push({ type: 'artifact_ref', artifact: it.artifact })
|
||||
} else {
|
||||
parts.push({ type: 'text', text: it.text, process: textProcess.get(i) || undefined })
|
||||
}
|
||||
}
|
||||
parts.push(...deliverables)
|
||||
return { id: `live:${live.runId}`, conversationId: '', role: 'assistant', runId: live.runId, parts, createdAt: '' }
|
||||
const createdAt = live.startedAt > 0 && Number.isFinite(live.startedAt) ? new Date(live.startedAt).toISOString() : ''
|
||||
return { id: `live:${live.runId}`, conversationId: '', role: 'assistant', runId: live.runId, parts, createdAt }
|
||||
}
|
||||
|
||||
// showProcessInline:运行中时间线始终展开(不能靠 responding 提前折,那一轮文字
|
||||
// 后面还可能再调用工具)。run 结束后随「自动折叠过程」偏好收成一行。
|
||||
export function showProcessInline(live: LiveState | null, autoCollapse: boolean): boolean {
|
||||
return live != null || !autoCollapse
|
||||
/** Rebuild one run's process from its durable ordered events, without the live preview's output-tail limit. */
|
||||
export function runEventsToTimeline(events: StreamEvent[], parentRunId = events[0]?.runId, completeRecord = false): ReplayPart[] {
|
||||
let items: LiveItem[] = []
|
||||
let finalizing = false
|
||||
for (const event of [...events].sort((a, b) => a.seq - b.seq)) {
|
||||
const p = event.payload as Record<string, unknown> | undefined
|
||||
const now = Date.parse(event.ts) || 0
|
||||
if (event.runId !== parentRunId && event.type !== 'agent.progress' && event.type !== 'agent.result') continue
|
||||
switch (event.type) {
|
||||
case 'agent.spawn':
|
||||
if (typeof p?.name === 'string') items.push({ kind: 'agent', text: `协作代理「${p.name}」已开始`,
|
||||
agentRun: String(p.agentRun ?? event.runId ?? ''), agentPhase: 'spawn' })
|
||||
break
|
||||
case 'agent.progress':
|
||||
if (typeof p?.note === 'string') items = applyAgentProgress(items, String(p.agentRun ?? event.runId ?? ''), p.note)
|
||||
break
|
||||
case 'agent.result':
|
||||
items.push({ kind: 'agent', text: `协作结束:${typeof p?.summary === 'string' && p.summary.trim() ? p.summary : String(p?.status ?? '已结束')}`,
|
||||
agentRun: String(p?.agentRun ?? event.runId ?? ''), agentPhase: 'result' })
|
||||
break
|
||||
case 'thinking.delta':
|
||||
if (typeof p?.text === 'string') items = applyThinkingDelta(items, p.text, now)
|
||||
break
|
||||
case 'message.delta':
|
||||
if ((!finalizing || completeRecord) && typeof p?.text === 'string') items = applyTextDelta(items, typeof p.index === 'number' ? p.index : 0, p.text)
|
||||
break
|
||||
case 'tool.call.delta':
|
||||
if (typeof p?.delta === 'string') items = applyToolCallDelta(items, typeof p.index === 'number' ? p.index : 0,
|
||||
p.delta, typeof p.callId === 'string' ? p.callId : undefined, typeof p.name === 'string' ? p.name : undefined, now)
|
||||
break
|
||||
case 'tool.call':
|
||||
items = applyToolCall(items, typeof p?.name === 'string' ? p.name : '工具',
|
||||
typeof p?.callId === 'string' ? p.callId : undefined,
|
||||
typeof p?.arguments === 'string' ? p.arguments : undefined, now)
|
||||
break
|
||||
case 'tool.output':
|
||||
if (typeof p?.text === 'string') items = applyToolOutput(items,
|
||||
typeof p.callId === 'string' ? p.callId : undefined, p.text, Number.POSITIVE_INFINITY)
|
||||
break
|
||||
case 'tool.result':
|
||||
items = applyToolResult(items, typeof p?.callId === 'string' ? p.callId : undefined,
|
||||
typeof p?.status === 'string' ? p.status : 'ok', typeof p?.summary === 'string' ? p.summary : undefined, now)
|
||||
break
|
||||
case 'run.phase':
|
||||
if (p?.phase === 'finalizing') { finalizing = true; items = applyFinalizing(items) }
|
||||
break
|
||||
case 'run.check':
|
||||
items = applyCheck(items, !!p?.passed, typeof p?.reason === 'string' ? p.reason : '')
|
||||
break
|
||||
}
|
||||
}
|
||||
const live: LiveState = { runId: events[0]?.runId ?? '', phase: 'done', items, agentNotes: {}, startedAt: 0 }
|
||||
return completeRecord ? liveToMessage(live).parts : splitTimeline(liveToMessage(live).parts).timeline
|
||||
}
|
||||
|
||||
// livePhaseLabel 用最后一个实时条目给出中文阶段,而不是后端的英文 phase。
|
||||
export function livePhaseLabel(live: LiveState, now = Date.now()): string {
|
||||
if (live.phase === 'finalizing') return '整理回复中'
|
||||
let last: LiveItem | undefined
|
||||
for (let i = live.items.length - 1; i >= 0; i--) {
|
||||
const kind = live.items[i].kind
|
||||
if (kind !== 'artifact' && kind !== 'check' && kind !== 'final') { last = live.items[i]; break }
|
||||
}
|
||||
if (!last || last.kind === 'thinking') return '思考中'
|
||||
if (last.kind === 'tool') {
|
||||
if (last.state === 'composing') return `正在编写 ${last.name}`
|
||||
if (last.state === 'running') {
|
||||
const s = Math.max(0, Math.floor((now - last.startedAt) / 1000))
|
||||
const m = Math.floor(s / 60)
|
||||
const clock = m > 0 ? `${m} 分 ${s % 60} 秒` : `${s} 秒`
|
||||
return `正在运行 ${last.name} · ${clock}`
|
||||
}
|
||||
return '回复中'
|
||||
}
|
||||
return '回复中'
|
||||
}
|
||||
|
||||
// 默认阅读层只显示阶段;运行中也把技术记录留给用户主动展开。
|
||||
export function showProcessInline(_live: LiveState | null, autoCollapse: boolean): boolean {
|
||||
return !autoCollapse
|
||||
}
|
||||
|
||||
// hasSettledReply:助手回复落库后,这个 run 的实时气泡才该收起。
|
||||
// 用户消息也会带同一个 runId,不能拿它判断回复已经落库。
|
||||
export function hasSettledReply(messages: { role: string; runId?: string }[], runId: string): boolean {
|
||||
return messages.some(m => m.role === 'assistant' && m.runId === runId)
|
||||
}
|
||||
|
||||
+145
-6
@@ -1,5 +1,4 @@
|
||||
// 消息切分:过程时间线 = 从开头到最后一个 process 部件(中间夹着的内容部件留在时间线里);
|
||||
// 最终段 = 它之后的正文与交付卡片。渲染顺序仍是落库顺序,只在这一刀上折叠。
|
||||
// 消息切分:每轮过程按落库顺序留在可回看的时间线,终轮回复直接可读。
|
||||
import type { Part } from './contracts'
|
||||
|
||||
export interface TimelineSplit {
|
||||
@@ -7,12 +6,152 @@ export interface TimelineSplit {
|
||||
final: Part[]
|
||||
}
|
||||
|
||||
/** 最后一个 process 部件之前(含自身)是工作时间线,其余是最终回复。 */
|
||||
export function splitTimeline(parts: Part[]): TimelineSplit {
|
||||
/** Client-only provenance. It is never written to the Core message contract. */
|
||||
export interface ReplayPart extends Part { replaySource?: 'agent' }
|
||||
|
||||
/** 最后一个 process 部件之前的记录属于该轮过程;错误与文件入口始终可见。
|
||||
* 终态没有回复时,只把最后一段过程解说提升为可见回复。 */
|
||||
export function splitTimeline(parts: Part[], promoteLastText = false): TimelineSplit {
|
||||
let last = -1
|
||||
for (let i = 0; i < parts.length; i++) if (parts[i].process) last = i
|
||||
if (last < 0) return { timeline: [], final: parts }
|
||||
return { timeline: parts.slice(0, last + 1), final: parts.slice(last + 1) }
|
||||
const timeline: Part[] = []
|
||||
const final: Part[] = []
|
||||
for (let i = 0; i < parts.length; i++) {
|
||||
const part = parts[i]
|
||||
if (i > last || part.type === 'error' || part.type === 'artifact_ref') final.push(part)
|
||||
else timeline.push(part)
|
||||
}
|
||||
if (promoteLastText && !final.some(part => part.type === 'text' || part.type === 'error')) {
|
||||
let idx = -1
|
||||
for (let i = timeline.length - 1; i >= 0; i--) {
|
||||
if (timeline[i].type === 'text') { idx = i; break }
|
||||
}
|
||||
if (idx >= 0) final.unshift(...timeline.splice(idx, 1))
|
||||
}
|
||||
return { timeline, final }
|
||||
}
|
||||
|
||||
const normalized = (text?: string) => (text ?? '').replace(/\s+/g, ' ').trim()
|
||||
|
||||
function sameProcessPart(saved: Part, replayed: Part): boolean {
|
||||
if (saved.type !== replayed.type) return false
|
||||
switch (saved.type) {
|
||||
case 'tool_call': return !!saved.toolCall?.id && saved.toolCall.id === replayed.toolCall?.id
|
||||
case 'tool_result': return !!saved.toolResult?.callId && saved.toolResult.callId === replayed.toolResult?.callId
|
||||
case 'check': return saved.check?.passed === replayed.check?.passed && saved.check?.reason === replayed.check?.reason
|
||||
case 'thinking':
|
||||
case 'text': return normalized(saved.text) === normalized(replayed.text)
|
||||
default: return false
|
||||
}
|
||||
}
|
||||
|
||||
/** Keep the settled message as the content authority; add only event-only records
|
||||
* and full tool output. Event deltas can be missing, while terminal parts can
|
||||
* contain retry notes or parsed inline thinking that the event stream cannot reconstruct. */
|
||||
export function mergeProcessTimeline(saved: Part[], replayed: ReplayPart[], final: Part[]): Part[] {
|
||||
if (replayed.length === 0) return saved
|
||||
const finalTexts = final.filter(part => part.type === 'text').map(part => normalized(part.text)).filter(Boolean)
|
||||
const merged: Part[] = []
|
||||
let cursor = 0
|
||||
let pending: Part[] = []
|
||||
for (const part of replayed) {
|
||||
const text = normalized(part.text)
|
||||
const agentNote = part.replaySource === 'agent'
|
||||
if (part.type === 'text' && !agentNote && ((text && finalTexts.some(value => value.includes(text) || text.includes(value)))
|
||||
|| /<\/?think\b/i.test(part.text ?? ''))) continue
|
||||
let match = -1
|
||||
for (let i = cursor; i < saved.length; i++) {
|
||||
if (sameProcessPart(saved[i], part)) { match = i; break }
|
||||
}
|
||||
if (match < 0) {
|
||||
// A missing delta batch can leave only a prefix in events. The complete
|
||||
// terminal part is authoritative; never render that prefix beside it.
|
||||
if (!agentNote && (part.type === 'text' || part.type === 'thinking') && text && saved.some(item => {
|
||||
if (item.type !== part.type) return false
|
||||
const value = normalized(item.text)
|
||||
return value && (value.includes(text) || text.includes(value))
|
||||
})) continue
|
||||
pending.push(part)
|
||||
continue
|
||||
}
|
||||
merged.push(...saved.slice(cursor, match), ...pending)
|
||||
pending = []
|
||||
const output = (part as Part & { toolOutput?: string }).toolOutput
|
||||
merged.push(output && saved[match].type === 'tool_call'
|
||||
? { ...saved[match], toolOutput: output } as Part : saved[match])
|
||||
cursor = match + 1
|
||||
}
|
||||
merged.push(...saved.slice(cursor), ...pending)
|
||||
return merged
|
||||
}
|
||||
|
||||
/** 同一轮里同名工件只留最新一张,updates 是被折叠掉的次数。 */
|
||||
export function dedupeDeliverables(parts: Part[]): { artifact: NonNullable<Part['artifact']>; updates: number }[] {
|
||||
const order: string[] = []
|
||||
const byName = new Map<string, { artifact: NonNullable<Part['artifact']>; count: number }>()
|
||||
for (const p of parts) {
|
||||
if (p.type !== 'artifact_ref' || !p.artifact) continue
|
||||
const name = p.artifact.name || p.artifact.artifactId
|
||||
const cur = byName.get(name)
|
||||
if (!cur) {
|
||||
order.push(name)
|
||||
byName.set(name, { artifact: p.artifact, count: 1 })
|
||||
} else {
|
||||
cur.artifact = p.artifact
|
||||
cur.count++
|
||||
}
|
||||
}
|
||||
return order.map(name => {
|
||||
const cur = byName.get(name)!
|
||||
return { artifact: cur.artifact, updates: cur.count - 1 }
|
||||
})
|
||||
}
|
||||
|
||||
/** 把单独成条的错误消息并回同一 run 的助手消息。没有正文的错误条保留原位。 */
|
||||
export function foldRunErrors<T extends { id: string; runId?: string; role: string; parts: Part[] }>(messages: T[]): T[] {
|
||||
const extras = new Map<string, Part[]>()
|
||||
for (const m of messages) {
|
||||
if (m.role !== 'assistant' || !m.runId) continue
|
||||
if (m.parts.length > 0 && m.parts.every(p => p.type === 'error')) {
|
||||
extras.set(m.runId, [...(extras.get(m.runId) ?? []), ...m.parts])
|
||||
}
|
||||
}
|
||||
const used = new Set<string>()
|
||||
const out: T[] = []
|
||||
for (const m of messages) {
|
||||
if (m.role === 'assistant' && m.runId && extras.has(m.runId) && m.parts.every(p => p.type === 'error')) {
|
||||
const hasBody = messages.some(o => o !== m && o.runId === m.runId && o.role === 'assistant' && o.parts.some(p => p.type !== 'error'))
|
||||
if (hasBody) continue
|
||||
}
|
||||
if (m.role === 'assistant' && m.runId && extras.has(m.runId) && m.parts.some(p => p.type !== 'error') && !used.has(m.runId)) {
|
||||
used.add(m.runId)
|
||||
out.push({ ...m, parts: [...m.parts, ...extras.get(m.runId)!] })
|
||||
continue
|
||||
}
|
||||
out.push(m)
|
||||
}
|
||||
return out
|
||||
}
|
||||
|
||||
/** 把运行错误说成人话。detail 保留原始码,供展开查看。 */
|
||||
export function humanError(code?: string, message?: string): { title: string; detail: string } {
|
||||
const msg = (message ?? '').trim()
|
||||
const detail = [code, msg].filter(Boolean).join(': ')
|
||||
if (code === 'run.cancelled' || msg === '已取消') return { title: '已取消', detail }
|
||||
const stripped = msg.replace(/^budget:\s*/, '')
|
||||
if (msg.startsWith('budget:') || /max turns|maxTurns|tool calls/i.test(msg)) {
|
||||
return { title: `已停止:${stripped}`, detail }
|
||||
}
|
||||
return { title: msg ? `已停止:${msg}` : '已停止', detail }
|
||||
}
|
||||
|
||||
/** 终态摘要:已工作时长,以及工具次数和文件数。 */
|
||||
export function processSummary(toolCalls: number, files: number, createdAt?: string, endedAt?: string): string {
|
||||
const bits = [workedLabel(createdAt, endedAt)]
|
||||
if (toolCalls > 0) bits.push(`${toolCalls} 次工具调用`)
|
||||
if (files > 0) bits.push(`${files} 个文件`)
|
||||
return bits.join(' · ')
|
||||
}
|
||||
|
||||
const ART_ID = /art_[0-9a-f]{12}/g
|
||||
@@ -48,7 +187,7 @@ export function workedLabel(createdAt?: string, endedAt?: string): string {
|
||||
return text ? `已工作 ${text}` : '已工作'
|
||||
}
|
||||
|
||||
/** 文件大小人类可读(工件面板/DocViewer 共用)。 */
|
||||
/** 文件大小人类可读(工件面板/预览栏共用)。 */
|
||||
export function humanSize(n: number | undefined): string {
|
||||
if (!n || n <= 0) return ''
|
||||
const units = ['B', 'KB', 'MB', 'GB']
|
||||
|
||||
+12
-1
@@ -1,17 +1,22 @@
|
||||
// 输入排队(纯数据):回合进行中先入本地队列,终态再逐条发送。
|
||||
export interface WorkReference { cardId: string; resultVersion: number; title: string }
|
||||
|
||||
export interface QueuedMessage {
|
||||
id: string
|
||||
text: string
|
||||
attachmentIds: string[]
|
||||
attachmentNames: string[]
|
||||
taskRef?: WorkReference
|
||||
deliveryError?: string
|
||||
}
|
||||
|
||||
export function newQueuedMessage(text: string, attachmentIds: string[], attachmentNames: string[]): QueuedMessage {
|
||||
export function newQueuedMessage(text: string, attachmentIds: string[], attachmentNames: string[], taskRef?: WorkReference): QueuedMessage {
|
||||
return {
|
||||
id: `${Date.now().toString(36)}-${Math.random().toString(36).slice(2, 8)}`,
|
||||
text,
|
||||
attachmentIds,
|
||||
attachmentNames,
|
||||
...(taskRef ? { taskRef } : {}),
|
||||
}
|
||||
}
|
||||
|
||||
@@ -31,6 +36,12 @@ export function replaceQueuedText(queue: QueuedMessage[], id: string, text: stri
|
||||
return queue.map(q => q.id === id ? { ...q, text } : q)
|
||||
}
|
||||
|
||||
// deliveryRequestId 是这条排队消息重发时必须复用的 requestId。
|
||||
// 服务端按它去重,避免忙时 409 再入队后写出第二条用户消息。
|
||||
export function deliveryRequestId(item: QueuedMessage): string {
|
||||
return item.id
|
||||
}
|
||||
|
||||
export function promoteQueuedMessage(queue: QueuedMessage[], id: string): QueuedMessage[] {
|
||||
const item = queue.find(q => q.id === id)
|
||||
if (!item) return queue
|
||||
|
||||
@@ -1,11 +0,0 @@
|
||||
// 浏览器端随机初始密码(管理员未显式给定密码时):
|
||||
// crypto.getRandomValues 拒绝易混淆字符(0/O/1/l/I),保证可抄写。
|
||||
const ALPHABET = 'abcdefghjkmnpqrstuvwxyz23456789'
|
||||
|
||||
export function randomPassword(length = 12): string {
|
||||
const buf = new Uint32Array(length)
|
||||
crypto.getRandomValues(buf)
|
||||
let out = ''
|
||||
for (let i = 0; i < length; i++) out += ALPHABET[buf[i] % ALPHABET.length]
|
||||
return out
|
||||
}
|
||||
@@ -0,0 +1,53 @@
|
||||
// docx 分页纸面按预览栏宽度等比缩小。只缩不放:栏宽够放下整页时保持 100%。
|
||||
// gutter 与 styles.css 里 .docx-wrapper 的左右 padding(12px + 12px)对齐。
|
||||
|
||||
export function computeFitScale(containerWidth: number, pageWidth: number, gutter: number): number {
|
||||
if (!Number.isFinite(containerWidth) || !Number.isFinite(pageWidth) || pageWidth <= 0) return 1
|
||||
if (!Number.isFinite(gutter)) return 1
|
||||
const available = containerWidth - gutter
|
||||
if (!(available > 0)) return 1
|
||||
return Math.min(1, available / pageWidth)
|
||||
}
|
||||
|
||||
const PAGE_GUTTER_PX = 24
|
||||
|
||||
/** host 是 docx-preview 的渲染根(内含 .docx-wrapper);el 是用来量栏宽的元素。
|
||||
* 拖动分隔条时 el 变宽,ResizeObserver 重算。返回的函数卸下监听并清掉行内缩放。 */
|
||||
export function fitPagesToWidth(host: HTMLElement, el: HTMLElement): () => void {
|
||||
const apply = () => {
|
||||
const wrapper = host.querySelector<HTMLElement>('.docx-wrapper')
|
||||
const page = host.querySelector<HTMLElement>('section.docx')
|
||||
if (!wrapper || !page) return
|
||||
const scale = computeFitScale(el.clientWidth, page.offsetWidth, PAGE_GUTTER_PX)
|
||||
wrapper.style.transformOrigin = 'top left'
|
||||
wrapper.style.transform = scale < 1 ? `scale(${scale})` : ''
|
||||
const nextHeight = `${Math.round(wrapper.offsetHeight * scale)}px`
|
||||
if (host.style.height !== nextHeight) host.style.height = nextHeight
|
||||
host.style.overflow = 'hidden'
|
||||
host.style.minHeight = '0'
|
||||
}
|
||||
apply()
|
||||
if (typeof ResizeObserver === 'undefined') {
|
||||
return () => clearFit(host)
|
||||
}
|
||||
const observer = new ResizeObserver(() => apply())
|
||||
observer.observe(el)
|
||||
// 页内图片后加载只改变页纸高度,不改变栏宽。el 变宽和 wrapper 变高都要重算宿主高度。
|
||||
const wrapper = host.querySelector<HTMLElement>('.docx-wrapper')
|
||||
if (wrapper && wrapper !== el) observer.observe(wrapper)
|
||||
return () => {
|
||||
observer.disconnect()
|
||||
clearFit(host)
|
||||
}
|
||||
}
|
||||
|
||||
function clearFit(host: HTMLElement) {
|
||||
const wrapper = host.querySelector<HTMLElement>('.docx-wrapper')
|
||||
if (wrapper) {
|
||||
wrapper.style.transform = ''
|
||||
wrapper.style.transformOrigin = ''
|
||||
}
|
||||
host.style.height = ''
|
||||
host.style.overflow = ''
|
||||
host.style.minHeight = ''
|
||||
}
|
||||
+11
-5
@@ -1,10 +1,10 @@
|
||||
// 预览能力装配(裁定 D1–D4):把重解析器经 configureFilePreviewLoaders 注入 @ui。
|
||||
// 全部 dynamic import——对应格式首次预览时才下载 chunk,主 bundle 不含解析器。
|
||||
// 链接预览 fetcher 走服务端 /api/url-preview(SSRF 防护在服务端执行端)。
|
||||
import { configureFilePreviewLoaders, configureLinkPreviewFetcher } from '@ui'
|
||||
import { marked } from 'marked'
|
||||
import { configureFilePreviewLoaders, configureLinkPreviewFetcher, renderMarkdown, setSafeHTML, stripUnsafeLinks } from '@ui'
|
||||
import { auth } from './auth'
|
||||
import type { LinkPreviewData } from '@ui'
|
||||
import { fitPagesToWidth } from './previewfit'
|
||||
|
||||
const fetchBuf = async (url: string | undefined): Promise<ArrayBuffer> => {
|
||||
const r = await fetch(url!)
|
||||
@@ -28,7 +28,7 @@ const renderTextFallback = (el: HTMLElement, buf: ArrayBuffer, name: string | un
|
||||
note.textContent = `「${name ?? '该文件'}」不是有效的 ${kindLabel} 文件(缺少 ZIP 结构),已按文本内容展示;需要正式格式请让智能体重新生成。`
|
||||
const body = document.createElement('div')
|
||||
body.className = 'doc-viewer'
|
||||
body.innerHTML = marked.parse(new TextDecoder().decode(buf)) as string
|
||||
setSafeHTML(body, renderMarkdown(new TextDecoder().decode(buf), { breaks: true }))
|
||||
el.innerHTML = ''
|
||||
el.append(note, body)
|
||||
}
|
||||
@@ -43,13 +43,18 @@ const docxLoader = async (el: HTMLElement, source: { contentUrl?: string; name?:
|
||||
const { renderAsync } = await import('docx-preview')
|
||||
el.innerHTML = ''
|
||||
await renderAsync(buf, el, el, { className: 'docx', inWrapper: true, breakPages: true })
|
||||
return
|
||||
stripUnsafeLinks(el)
|
||||
return fitPagesToWidth(el, el)
|
||||
} catch (err) {
|
||||
console.error('[preview:docx] page render failed, falling back', source.name, err)
|
||||
}
|
||||
const mammoth = await import('mammoth')
|
||||
const { value } = await mammoth.convertToHtml({ arrayBuffer: buf })
|
||||
el.innerHTML = `<div class="doc-viewer">${value}</div>`
|
||||
el.innerHTML = ''
|
||||
const body = document.createElement('div')
|
||||
body.className = 'doc-viewer'
|
||||
setSafeHTML(body, value)
|
||||
el.append(body)
|
||||
}
|
||||
|
||||
const xlsxLoader = async (el: HTMLElement, source: { contentUrl?: string; name?: string }) => {
|
||||
@@ -120,6 +125,7 @@ const pptxLoader = async (el: HTMLElement, source: { contentUrl?: string; name?:
|
||||
el.append(stage)
|
||||
const previewer = init(stage, { width: stage.clientWidth || 900 })
|
||||
await previewer.preview(buf)
|
||||
stripUnsafeLinks(el)
|
||||
}
|
||||
|
||||
export function wirePreviewCapabilities() {
|
||||
|
||||
@@ -25,3 +25,23 @@ export function closePreviewTab(
|
||||
const neighbor = next[Math.min(i, next.length - 1)] ?? null
|
||||
return { tabs: next, activeId: neighbor?.id ?? null }
|
||||
}
|
||||
|
||||
/** 预览标签的会话键。空态(未选会话)统一落在 '_':写入(requestPreview)与
|
||||
* 渲染(previewOpen/PreviewPane)共用同一口径,空态点开工件才能出现预览区。 */
|
||||
export function previewTabsKey(currentConvId: string | null | undefined): string {
|
||||
return currentConvId ?? '_'
|
||||
}
|
||||
|
||||
/** 进入会话时把空态打开的孤儿标签('_' 键)并入会话键下;按 id 去重,
|
||||
* 会话侧顺序在前,'_' 键清空。无孤儿或目标即 '_' 时原样返回。 */
|
||||
export function mergeOrphanPreviewTabs(
|
||||
tabsByConv: Record<string, PreviewTab[]>,
|
||||
convId: string,
|
||||
): Record<string, PreviewTab[]> {
|
||||
const orphan = tabsByConv['_'] ?? []
|
||||
if (orphan.length === 0 || convId === '_') return tabsByConv
|
||||
const own = tabsByConv[convId] ?? []
|
||||
const ids = new Set(own.map(t => t.id))
|
||||
const merged = [...own, ...orphan.filter(t => !ids.has(t.id))]
|
||||
return { ...tabsByConv, [convId]: merged, '_': [] }
|
||||
}
|
||||
|
||||
@@ -0,0 +1,43 @@
|
||||
/** 阶段徽章:只读项目设置里的 stage 字符串;没有就不显示。 */
|
||||
export function projectStage(settings?: Record<string, unknown> | null): string | null {
|
||||
const stage = settings?.stage
|
||||
return typeof stage === 'string' && stage.trim() !== '' ? stage.trim() : null
|
||||
}
|
||||
|
||||
/** Service metadata describes readiness; permission is always checked by the server. */
|
||||
export function projectWorkError(project: { settings?: Record<string, unknown> } | undefined): string | null {
|
||||
if (!project) return '项目已不可用,请刷新项目列表或联系项目负责人'
|
||||
const settings = project.settings
|
||||
if (!settings || (!('rdm.state' in settings) && !('rdm.projectId' in settings))) return null
|
||||
switch (settings['rdm.state']) {
|
||||
case 'ready':
|
||||
if (typeof settings['rdm.projectId'] === 'string' && settings['rdm.projectId'].trim()) return null
|
||||
break
|
||||
case 'provisioning': return '项目正在准备,请稍后刷新项目列表再试'
|
||||
case 'failed': return '项目准备失败,请联系项目负责人重试创建'
|
||||
case 'archived': return '项目已归档,请联系项目负责人恢复后再新建对话'
|
||||
case 'closed': return '项目已关闭,请选择其他项目或联系项目负责人'
|
||||
}
|
||||
return '项目尚未绑定,请联系项目负责人完成项目接入'
|
||||
}
|
||||
|
||||
export function projectStateLabel(settings?: Record<string, unknown>): string | null {
|
||||
switch (settings?.['rdm.state']) {
|
||||
case 'provisioning': return '准备中'
|
||||
case 'failed': return '准备失败'
|
||||
case 'unbound': return '未接入'
|
||||
case 'archived': return '已归档'
|
||||
case 'closed': return '已关闭'
|
||||
default: return null
|
||||
}
|
||||
}
|
||||
|
||||
export function projectActionError(error: unknown): string {
|
||||
const raw = String(error)
|
||||
if (/\b401\b/.test(raw)) return '登录已失效,请重新登录后再试'
|
||||
if (/\b403\b/.test(raw)) return '当前账号无法管理此项目,请联系项目负责人'
|
||||
if (/\b404\b/.test(raw)) return '项目已不可用,请刷新项目列表或联系项目负责人'
|
||||
if (/\b409\b/.test(raw)) return '项目名称已被占用或项目状态已变化,请更换名称或刷新后再试'
|
||||
if (/\b503\b/.test(raw)) return '项目服务暂未就绪,请稍后重试或联系项目负责人'
|
||||
return raw.replace(/^Error:\s*/, '')
|
||||
}
|
||||
@@ -0,0 +1,25 @@
|
||||
// 审计命令错误分类(2026-10-12 增量 2):RdmAuditWorkspace 不再直出原始报错
|
||||
//(普通基座上曾是 `400: {"receipt":…unknown or disabled command…}`),改为
|
||||
//「能力缺失 / 登录已失效 / 查询失败」人话文案;raw 始终保留供「原始回执」折叠区诊断。
|
||||
// 依据:api.ts json() 对非 2xx 抛 `${status}: ${body}`;后端 unknown/disabled 命令回
|
||||
// 400 + "unknown or disabled command"(cmdbus.go Dispatch),总线未挂载回
|
||||
// 503 "commands disabled"(server.go execCommand)。
|
||||
|
||||
type RdmErrorKind = 'capability' | 'auth' | 'query'
|
||||
|
||||
interface RdmErrorView {
|
||||
kind: RdmErrorKind
|
||||
message: string
|
||||
raw: string
|
||||
}
|
||||
|
||||
export function classifyRdmError(err: unknown): RdmErrorView {
|
||||
const raw = err instanceof Error ? err.message : String(err)
|
||||
if (/^40[13]:/.test(raw)) {
|
||||
return { kind: 'auth', message: '登录已失效,请重新登录后再查看追溯审计', raw }
|
||||
}
|
||||
if (/unknown or disabled command|commands disabled/.test(raw)) {
|
||||
return { kind: 'capability', message: '当前服务未提供审计能力(RDM 命令未注册或已停用)', raw }
|
||||
}
|
||||
return { kind: 'query', message: '查询失败,请稍后重试', raw }
|
||||
}
|
||||
@@ -0,0 +1,195 @@
|
||||
// U6/KTD5:RDM 管理与项目页面的纯逻辑层——能力门控(与 rdmAuditReady 同源语义:
|
||||
// 命令清单不可用=未就绪,fail-closed)与命令载荷构造。页面组件只消费本模块与
|
||||
// api.rdmCommand,不在组件里散落命令 id / 参数拼写;身份一律经认证会话,载荷不
|
||||
// 携带任何身份字段(G1-5)。
|
||||
import type { Project } from './contracts'
|
||||
import { projectWorkError } from './projectmeta'
|
||||
|
||||
export function rdmCommandProjectId(project: Project): string {
|
||||
const id = project.settings?.['rdm.projectId']
|
||||
if (typeof id !== 'string' || !id.trim()) {
|
||||
throw new Error('项目尚未绑定,请联系项目负责人完成项目接入')
|
||||
}
|
||||
return id.trim()
|
||||
}
|
||||
|
||||
/** Historical project reads remain available; this does not grant read permission. */
|
||||
export function rdmProjectReadError(project: Project | undefined): string | null {
|
||||
const state = project?.settings?.['rdm.state']
|
||||
if (project && (state === 'ready' || state === 'archived' || state === 'closed')) {
|
||||
try { rdmCommandProjectId(project); return null }
|
||||
catch (e) { return String(e).replace(/^Error:\s*/, '') }
|
||||
}
|
||||
return projectWorkError(project) ?? '项目尚未绑定,请联系项目负责人完成项目接入'
|
||||
}
|
||||
|
||||
const PROJECT_READ_COMMANDS = new Set([
|
||||
'rdm.project.member.list', 'rdm.perm.check', 'rdm.perm.matrix',
|
||||
'rdm.review.doc.status', 'rdm.duty.catalog', 'rdm.duty.get',
|
||||
'rdm.duty.matrix', 'rdm.duty.preview', 'rdm.duty.legacy.scan',
|
||||
])
|
||||
|
||||
export function rdmProjectCommandError(project: Project, command: string): string | null {
|
||||
return PROJECT_READ_COMMANDS.has(command) ? rdmProjectReadError(project) : projectWorkError(project)
|
||||
}
|
||||
|
||||
/** 系统管理「RDM 角色权限」分区消费的命令面。 */
|
||||
export const RDM_ROLES_COMMANDS = [
|
||||
'rdm.role.create',
|
||||
'rdm.role.action',
|
||||
'rdm.role.assign',
|
||||
'rdm.role.disable',
|
||||
'rdm.role.list',
|
||||
] as const
|
||||
|
||||
/** 项目设置「成员」页消费的命令面。 */
|
||||
export const RDM_MEMBER_COMMANDS = [
|
||||
'rdm.project.member.list',
|
||||
'rdm.project.member.add',
|
||||
'rdm.project.member.remove',
|
||||
] as const
|
||||
|
||||
/** 项目设置「项目权限」页消费的命令面(矩阵解释 + 成员清单)。 */
|
||||
export const RDM_PERM_MATRIX_COMMANDS = [
|
||||
'rdm.perm.check',
|
||||
'rdm.project.member.list',
|
||||
] as const
|
||||
|
||||
/** 项目设置「文档职责」页消费的命令面。审签命令留在文档工作区,不作为本页门控。 */
|
||||
export const RDM_DUTY_COMMANDS = [
|
||||
'rdm.duty.matrix',
|
||||
'rdm.duty.preview',
|
||||
'rdm.review.assign.doc',
|
||||
'rdm.review.assign.doc.batch',
|
||||
] as const
|
||||
|
||||
export type CommandListItem = { id?: string; enabled?: boolean } | null | undefined
|
||||
|
||||
function ready(cmds: CommandListItem[] | null | undefined, need: readonly string[]): boolean {
|
||||
if (!Array.isArray(cmds)) return false
|
||||
return need.every(n => cmds.some(c => c?.id === n && c.enabled === true))
|
||||
}
|
||||
|
||||
/** 角色分区是否就绪(普通基座无 rdm.role.* → 隐藏)。 */
|
||||
export const rdmRolesReady = (cmds: CommandListItem[] | null | undefined) =>
|
||||
ready(cmds, RDM_ROLES_COMMANDS)
|
||||
|
||||
/** 项目成员页是否就绪。 */
|
||||
export const rdmMembersReady = (cmds: CommandListItem[] | null | undefined) =>
|
||||
ready(cmds, RDM_MEMBER_COMMANDS)
|
||||
|
||||
/** 文档职责页是否就绪。命令未齐则 fail-closed。 */
|
||||
export const rdmDutyReady = (cmds: CommandListItem[] | null | undefined) =>
|
||||
ready(cmds, RDM_DUTY_COMMANDS)
|
||||
|
||||
/** 项目权限矩阵页是否就绪。 */
|
||||
export const rdmPermMatrixReady = (cmds: CommandListItem[] | null | undefined) =>
|
||||
ready(cmds, RDM_PERM_MATRIX_COMMANDS)
|
||||
|
||||
/** RDM 动作清单(12 项,与 RDM perms.AllActions 对齐;角色动作编辑器选项)。 */
|
||||
export const ROLE_ACTIONS = [
|
||||
'project.create', 'project.archive', 'member.manage', 'duty.assign',
|
||||
'stage.advance', 'doc.read', 'doc.write', 'doc.publish', 'review.participate',
|
||||
'trace.edit', 'knowledge.publish', 'project.settings',
|
||||
] as const
|
||||
|
||||
// ---- 载荷构造(字段名与 RDM 命令 schema 一一对应) ----
|
||||
|
||||
export const roleCreatePayload = (name: string) => ({ name })
|
||||
export const roleActionPayload = (roleId: string, action: string, def: boolean, cap: boolean) =>
|
||||
({ roleId, action, default: def, cap })
|
||||
export const roleAssignPayload = (owner: string, roleId: string) => ({ owner, roleId })
|
||||
export const roleDisablePayload = (roleId: string, disabled: boolean) => ({ roleId, disabled })
|
||||
|
||||
export const memberAddPayload = (projectId: string, member: string, role: 'owner' | 'member' = 'member') =>
|
||||
({ projectId, member, role })
|
||||
export const memberRemovePayload = (projectId: string, member: string) => ({ projectId, member })
|
||||
export const memberSetRolePayload = (projectId: string, member: string, role: 'owner' | 'member') => ({ projectId, member, role })
|
||||
|
||||
export const assignDocDutiesPayload = (
|
||||
projectId: string, docId: string, author: string, reviewers: string[], approver: string,
|
||||
extra?: { expectedDutyVersion?: number; confirmInvalidation?: boolean },
|
||||
) => ({
|
||||
projectId, docId, author, reviewers, approver,
|
||||
...(extra?.expectedDutyVersion !== undefined ? { expectedDutyVersion: extra.expectedDutyVersion } : {}),
|
||||
...(extra?.confirmInvalidation !== undefined ? { confirmInvalidation: extra.confirmInvalidation } : {}),
|
||||
})
|
||||
|
||||
export const dutyMatrixPayload = (
|
||||
projectId: string,
|
||||
query: {
|
||||
view: 'member' | 'document' | 'matrix'
|
||||
memberOwner?: string
|
||||
docId?: string
|
||||
query?: string
|
||||
stage?: string
|
||||
typeKey?: string
|
||||
assignment?: string
|
||||
memberQuery?: string
|
||||
memberCursor?: string
|
||||
docCursor?: string
|
||||
memberLimit?: number
|
||||
docLimit?: number
|
||||
},
|
||||
) => ({ projectId, ...query })
|
||||
|
||||
export const dutyPreviewPayload = (
|
||||
projectId: string,
|
||||
docs: { docId: string; author: string; reviewers: string[]; approver: string; expectedDutyVersion: number; confirmInvalidation: boolean }[],
|
||||
) => ({ projectId, docs })
|
||||
|
||||
export const dutyLegacyPayload = (projectId: string) => ({ projectId })
|
||||
|
||||
export const docSubmitPayload = (projectId: string, docId: string) => ({ projectId, docId })
|
||||
export const docApprovePayload = (projectId: string, docId: string, note?: string) =>
|
||||
note ? { projectId, docId, note } : { projectId, docId }
|
||||
export const docRejectPayload = (projectId: string, docId: string, reason?: string) =>
|
||||
reason ? { projectId, docId, reason } : { projectId, docId }
|
||||
/** round=0(未指定)不携带——服务端只认在途轮次,旧轮次传参即拒。 */
|
||||
export const docFinalPayload = (projectId: string, docId: string, round = 0) =>
|
||||
round > 0 ? { projectId, docId, round } : { projectId, docId }
|
||||
export const docStatusPayload = (projectId: string, docId: string) => ({ projectId, docId })
|
||||
|
||||
export const permCheckPayload = (projectId: string, member: string) => ({ projectId, member })
|
||||
|
||||
/** 矩阵来源标签(人话映射;未知来源回退原文——服务端新增来源时不至于空白)。 */
|
||||
export function describeSource(source: string): string {
|
||||
switch (source) {
|
||||
case 'admin': return '系统管理员'
|
||||
case 'prof-role-default': return '专业角色默认'
|
||||
case 'override': return '项目内覆盖'
|
||||
case 'relation-default': return '项目关系默认'
|
||||
case 'non-member': return '非项目成员'
|
||||
default: return source
|
||||
}
|
||||
}
|
||||
|
||||
/** 角色清单表格占位行文案:加载中仅在无错误时成立——rdm.role.list 被拒后
|
||||
* 停留「加载中…」是 2026-10-13 8788 锁死事故的误导性表象(表格永远在转圈)。 */
|
||||
export function rolesListPlaceholder(roles: unknown[] | null, err: string): string {
|
||||
if (roles !== null) return roles.length === 0 ? '暂无专业角色' : ''
|
||||
return err ? '角色清单未加载(见下方提示)' : '加载中…'
|
||||
}
|
||||
|
||||
/** rdm.role.list 错误文案映射:域管理员权限拒绝给人话 + 恢复通道;其余错误
|
||||
* 原样保留(服务端 reason 变化不至于空白)。台账单管理员制见 RDM G1-4/U1。 */
|
||||
export function describeRoleListError(raw: string): string {
|
||||
if (raw.includes('不是系统管理员')) {
|
||||
return '当前账号不是 RDM 域管理员(台账单管理员制),无法读取角色清单;'
|
||||
+ '请联系现任管理员经 rdm.perm.transfer 移交,或由部署侧受信通道恢复'
|
||||
}
|
||||
return raw
|
||||
}
|
||||
|
||||
/** 审阅人 CSV 解析:去空白、去空项、保序去重(表单输入 → reviewers 数组)。 */
|
||||
export function parseReviewers(csv: string): string[] {
|
||||
const seen = new Set<string>()
|
||||
const out: string[] = []
|
||||
for (const part of csv.split(',')) {
|
||||
const v = part.trim()
|
||||
if (!v || seen.has(v)) continue
|
||||
seen.add(v)
|
||||
out.push(v)
|
||||
}
|
||||
return out
|
||||
}
|
||||
@@ -0,0 +1,17 @@
|
||||
import { api } from './api'
|
||||
import type { StreamEvent } from './contracts'
|
||||
|
||||
/** Read the durable record in bounded pages; callers own cancellation and projection. */
|
||||
export async function loadRunEvents(conversationId: string, runId: string, signal: AbortSignal): Promise<StreamEvent[]> {
|
||||
const events: StreamEvent[] = []
|
||||
let after = 0
|
||||
while (true) {
|
||||
const page = await api.runEventsPage(conversationId, runId, after, signal)
|
||||
const rows = page.events ?? []
|
||||
events.push(...rows)
|
||||
if (rows.length < 500) return events
|
||||
const next = rows[rows.length - 1].seq
|
||||
if (next <= after) throw new Error('process event cursor did not advance')
|
||||
after = next
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,136 @@
|
||||
import { describe, expect, it } from 'vitest'
|
||||
import { canFlushOutbox, deriveShellPhase, hasInFlight, isShellBusy, showLiveBubble, type ShellFacts } from './runstate'
|
||||
|
||||
interface Model {
|
||||
facts: ShellFacts
|
||||
outbox: string[]
|
||||
userRequestIds: string[]
|
||||
flushed: string[]
|
||||
}
|
||||
|
||||
const idle: ShellFacts = { posting: false, openRun: false, liveRunId: null, assistantRunIds: [] }
|
||||
|
||||
function model(): Model {
|
||||
return { facts: { ...idle, assistantRunIds: [] }, outbox: [], userRequestIds: [], flushed: [] }
|
||||
}
|
||||
|
||||
type Step =
|
||||
| 'send'
|
||||
| 'post-ok'
|
||||
| 'post-409'
|
||||
| 'post-fail'
|
||||
| 'delta'
|
||||
| 'assistant'
|
||||
| 'done'
|
||||
| 'reconnect'
|
||||
| 'switch'
|
||||
| 'queue'
|
||||
| 'flush'
|
||||
|
||||
function apply(m: Model, step: Step): Model {
|
||||
const facts = {
|
||||
...m.facts,
|
||||
assistantRunIds: m.facts.assistantRunIds.slice(),
|
||||
}
|
||||
const next: Model = { facts, outbox: m.outbox.slice(), userRequestIds: m.userRequestIds.slice(), flushed: m.flushed.slice() }
|
||||
const phase = deriveShellPhase(next.facts)
|
||||
const requestId = 'req-1'
|
||||
switch (step) {
|
||||
case 'send':
|
||||
if (isShellBusy(phase)) {
|
||||
next.outbox.push(requestId)
|
||||
return next
|
||||
}
|
||||
next.facts.posting = true
|
||||
return next
|
||||
case 'post-ok':
|
||||
next.facts.posting = false
|
||||
next.facts.openRun = true
|
||||
next.facts.liveRunId = 'run-1'
|
||||
if (!next.userRequestIds.includes(requestId)) next.userRequestIds.push(requestId)
|
||||
return next
|
||||
case 'post-409':
|
||||
next.facts.posting = false
|
||||
if (!next.outbox.includes(requestId)) next.outbox.unshift(requestId)
|
||||
return next
|
||||
case 'post-fail':
|
||||
next.facts.posting = false
|
||||
return next
|
||||
case 'delta':
|
||||
if (next.facts.openRun) next.facts.liveRunId = 'run-1'
|
||||
return next
|
||||
case 'assistant':
|
||||
if (next.facts.liveRunId && !next.facts.assistantRunIds.includes(next.facts.liveRunId)) {
|
||||
next.facts.assistantRunIds.push(next.facts.liveRunId)
|
||||
}
|
||||
return next
|
||||
case 'done':
|
||||
next.facts.openRun = false
|
||||
return next
|
||||
case 'reconnect':
|
||||
return next
|
||||
case 'switch':
|
||||
return model()
|
||||
case 'queue':
|
||||
next.outbox.push('queued')
|
||||
return next
|
||||
case 'flush': {
|
||||
if (!canFlushOutbox(deriveShellPhase(next.facts)) || next.outbox.length === 0) return next
|
||||
const id = next.outbox.shift() ?? ''
|
||||
next.flushed.push(id)
|
||||
next.facts.posting = true
|
||||
if (id === requestId && !next.userRequestIds.includes(id)) next.userRequestIds.push(id)
|
||||
return next
|
||||
}
|
||||
default: {
|
||||
const unexpected: never = step
|
||||
throw new Error(unexpected)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function assertInvariants(m: Model) {
|
||||
const phase = deriveShellPhase(m.facts)
|
||||
expect(isShellBusy(phase)).toBe(hasInFlight(m.facts))
|
||||
expect(showLiveBubble(m.facts.liveRunId, m.facts.assistantRunIds)).toBe(
|
||||
!!m.facts.liveRunId && !m.facts.assistantRunIds.includes(m.facts.liveRunId),
|
||||
)
|
||||
if (isShellBusy(phase)) {
|
||||
expect(canFlushOutbox(phase)).toBe(false)
|
||||
}
|
||||
expect(new Set(m.userRequestIds).size).toBe(m.userRequestIds.length)
|
||||
}
|
||||
|
||||
const steps: Step[] = ['send', 'post-ok', 'post-409', 'post-fail', 'delta', 'assistant', 'done', 'reconnect', 'switch', 'queue', 'flush']
|
||||
|
||||
describe('shell run state', () => {
|
||||
it('walks sequences up to depth 4 without breaking the four invariants', () => {
|
||||
let frontier: Model[] = [model()]
|
||||
for (let depth = 0; depth < 4; depth++) {
|
||||
const grown: Model[] = []
|
||||
for (const current of frontier) {
|
||||
for (const step of steps) {
|
||||
const next = apply(current, step)
|
||||
assertInvariants(next)
|
||||
grown.push(next)
|
||||
}
|
||||
}
|
||||
frontier = grown
|
||||
}
|
||||
expect(frontier.length).toBe(steps.length ** 4)
|
||||
})
|
||||
|
||||
it('follows sending, running, settling, then idle', () => {
|
||||
let m = model()
|
||||
m = apply(m, 'send')
|
||||
expect(deriveShellPhase(m.facts)).toBe('sending')
|
||||
m = apply(m, 'post-ok')
|
||||
expect(deriveShellPhase(m.facts)).toBe('running')
|
||||
expect(showLiveBubble(m.facts.liveRunId, m.facts.assistantRunIds)).toBe(true)
|
||||
m = apply(m, 'done')
|
||||
expect(deriveShellPhase(m.facts)).toBe('settling')
|
||||
m = apply(m, 'assistant')
|
||||
expect(deriveShellPhase(m.facts)).toBe('idle')
|
||||
expect(showLiveBubble(m.facts.liveRunId, m.facts.assistantRunIds)).toBe(false)
|
||||
})
|
||||
})
|
||||
@@ -0,0 +1,39 @@
|
||||
// 产品壳运行态的唯一来源。按钮、停止、取消和排队发送都读这里,不再各自看 runs 或 live。
|
||||
// sending:请求已发出、run 还没出现。running:有未结束的 run。
|
||||
// settling:run 已结束,但这条 run 的助手消息还没落库。idle:可以发送下一条。
|
||||
|
||||
export type ShellPhase = 'sending' | 'running' | 'settling' | 'idle'
|
||||
|
||||
export interface ShellFacts {
|
||||
posting: boolean
|
||||
openRun: boolean
|
||||
liveRunId: string | null
|
||||
assistantRunIds: string[]
|
||||
}
|
||||
|
||||
export function deriveShellPhase(facts: ShellFacts): ShellPhase {
|
||||
const livePending = showLiveBubble(facts.liveRunId, facts.assistantRunIds)
|
||||
if (facts.posting && !facts.openRun) return 'sending'
|
||||
if (facts.openRun) return 'running'
|
||||
if (livePending) return 'settling'
|
||||
return 'idle'
|
||||
}
|
||||
|
||||
export function isShellBusy(phase: ShellPhase): boolean {
|
||||
return phase !== 'idle'
|
||||
}
|
||||
|
||||
// 流式气泡只在这条 run 还没有助手消息时显示。用户消息上的同一个 runId 不算回复已落库。
|
||||
export function showLiveBubble(liveRunId: string | null, assistantRunIds: string[]): boolean {
|
||||
if (!liveRunId) return false
|
||||
return !assistantRunIds.includes(liveRunId)
|
||||
}
|
||||
|
||||
export function canFlushOutbox(phase: ShellPhase): boolean {
|
||||
return phase === 'idle'
|
||||
}
|
||||
|
||||
// 在途:正在发送、有未结束的 run,或实时气泡还在等助手消息。
|
||||
export function hasInFlight(facts: ShellFacts): boolean {
|
||||
return facts.posting || facts.openRun || showLiveBubble(facts.liveRunId, facts.assistantRunIds)
|
||||
}
|
||||
@@ -0,0 +1,10 @@
|
||||
// Explicit message/card location feedback. The middle and work panes scroll independently.
|
||||
|
||||
/** 给已定位的节点加上 mk-flash,1.2s 后摘掉。 */
|
||||
export function flashElement(el: Element | null) {
|
||||
if (!el || typeof window === 'undefined') return
|
||||
el.classList.remove('mk-flash')
|
||||
void (el as HTMLElement).offsetWidth
|
||||
el.classList.add('mk-flash')
|
||||
window.setTimeout(() => el.classList.remove('mk-flash'), 1200)
|
||||
}
|
||||
+938
-148
File diff suppressed because it is too large
Load Diff
+324
-76
@@ -15,16 +15,48 @@ button { font-family: inherit; font-size: inherit; color: inherit; }
|
||||
:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; border-radius: 2px; }
|
||||
|
||||
/* ---- 面板化三栏:独立圆角面板 + 4px 间隙(DESIGN.md §6) ---- */
|
||||
.app { display: flex; height: 100vh; overflow: hidden; gap: 4px; padding: 4px; background: var(--bg-inset); }
|
||||
.left-nav { background: var(--bg-panel); border: 1px solid var(--border-soft); border-radius: var(--radius-lg); display: flex; flex-direction: column; min-width: 0; flex-shrink: 0; transition: width .15s var(--ease); }
|
||||
.app { display: flex; flex-direction: column; height: 100vh; overflow: hidden; gap: 4px; padding: 4px; background: var(--bg-inset); }
|
||||
.app-body { display: flex; flex: 1; min-height: 0; gap: 4px; }
|
||||
.topbar {
|
||||
display: flex; align-items: center; gap: 10px; height: 40px; flex-shrink: 0;
|
||||
padding: 0 12px; border-radius: var(--radius-lg);
|
||||
background: var(--bg-sidebar); color: var(--text-sidebar);
|
||||
border: 1px solid var(--border-sidebar);
|
||||
}
|
||||
.topbar-name { font-weight: 650; letter-spacing: .01em; }
|
||||
.topbar-spacer { flex: 1; }
|
||||
.topbar-bell {
|
||||
position: relative; width: 28px; height: 28px; display: inline-flex; align-items: center; justify-content: center;
|
||||
background: none; border: 1px solid var(--border-sidebar); border-radius: var(--radius-sm);
|
||||
color: inherit; cursor: pointer;
|
||||
}
|
||||
.topbar-bell:hover { background: var(--bg-hover); }
|
||||
.left-nav { background: var(--bg-sidebar); color: var(--text-sidebar); border: 1px solid var(--border-sidebar); border-radius: var(--radius-lg); display: flex; flex-direction: column; min-width: 0; flex-shrink: 0; transition: width .15s var(--ease); }
|
||||
[data-theme='molv'] .left-nav,
|
||||
[data-theme='molv'] .topbar {
|
||||
--text: var(--text-sidebar);
|
||||
--text-dim: var(--text-sidebar-dim);
|
||||
--text-faint: var(--text-sidebar-faint);
|
||||
--bg-hover: rgba(233, 240, 246, 0.08);
|
||||
--bg-active: rgba(233, 240, 246, 0.14);
|
||||
--border: var(--border-sidebar);
|
||||
--border-soft: var(--border-sidebar);
|
||||
--border-strong: var(--border-sidebar);
|
||||
}
|
||||
.left-nav.collapsed { width: 52px !important; }
|
||||
.divider { width: 4px; cursor: col-resize; background: transparent; flex-shrink: 0; position: relative; }
|
||||
.divider::before { content: ''; position: absolute; left: 1px; top: 12px; bottom: 12px; width: 2px; border-radius: 2px; background: transparent; transition: background .12s; }
|
||||
.divider:hover::before, .divider.dragging::before { background: var(--border-strong); }
|
||||
.divider::after { content: ''; position: absolute; inset: 0 -3px; } /* 拖拽热区加宽 */
|
||||
.main { flex: 1; min-width: 0; display: flex; flex-direction: column; background: var(--bg); border: 1px solid var(--border-soft); border-radius: var(--radius-lg); }
|
||||
/* 作者 display 声明会压过 UA 的 [hidden],此处显式恢复;展开预览靠它隐藏对话列 */
|
||||
.main[hidden] { display: none !important; }
|
||||
/* 第三栏(工作|文件):文件入口承载预览,展开态铺满主区 */
|
||||
.right-panel { background: var(--bg-panel); border: 1px solid var(--border-soft); border-radius: var(--radius-lg); display: flex; flex-direction: column; flex-shrink: 0; min-width: 0; }
|
||||
.right-panel.expanded { flex: 1 1 auto; width: auto; }
|
||||
.right-panel.collapsed { width: 44px !important; }
|
||||
/* 预览嵌进第三栏后去掉独立面板外壳(圆角/描边由右栏提供,纸面仍用 --bg) */
|
||||
.right-panel .preview-pane { flex: 1; min-height: 0; border: none; border-radius: 0; background: var(--bg); }
|
||||
|
||||
/* ---- 通用控件 ---- */
|
||||
.btn {
|
||||
@@ -39,7 +71,7 @@ button { font-family: inherit; font-size: inherit; color: inherit; }
|
||||
.btn:disabled { opacity: .42; cursor: not-allowed; box-shadow: none; }
|
||||
.btn.ghost { background: var(--bg-raised); border: 1px solid var(--border-strong); color: var(--text-dim); box-shadow: none; }
|
||||
.btn.ghost:hover:not(:disabled) { color: var(--text); border-color: var(--text-faint); background: var(--bg-raised); }
|
||||
.btn.danger { background: var(--err); }
|
||||
.btn.danger { background: var(--err-text); color: var(--text-on-semantic); }
|
||||
.icon-btn {
|
||||
background: none; border: none; color: var(--text-faint);
|
||||
border-radius: var(--radius-sm); padding: 0; width: 28px; height: 28px;
|
||||
@@ -57,16 +89,31 @@ button { font-family: inherit; font-size: inherit; color: inherit; }
|
||||
/* ---- 中栏对话 ---- */
|
||||
/* min-height:0 须随列向 flex 链下传(.main→.chat→.chat-body):flex 项的自动最小
|
||||
高度是内容高度,缺失时消息会撑破 .chat——chat-body 永不滚动、输入栏被顶出视口。 */
|
||||
.chat { flex: 1; display: flex; flex-direction: column; min-width: 0; min-height: 0; }
|
||||
.chat { position: relative; flex: 1; display: flex; flex-direction: column; min-width: 0; min-height: 0; }
|
||||
.chat-header { padding: 12px 22px; border-bottom: 1px solid var(--border-soft); display: flex; align-items: center; gap: 10px; background: var(--bg); border-radius: var(--radius-lg) var(--radius-lg) 0 0; }
|
||||
.chat-title { font-weight: 600; font-size: var(--fs-ui-base); letter-spacing: -0.01em; flex: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
|
||||
.chat-body { flex: 1; overflow-y: auto; min-height: 0; padding: 22px max(22px, 13%); }
|
||||
.empty-state { height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; color: var(--text-faint); gap: 10px; font-size: var(--fs-ui-caption); }
|
||||
.jump-bottom {
|
||||
position: absolute; left: 50%; bottom: 92px; transform: translateX(-50%); z-index: 4;
|
||||
border: 1px solid var(--border); background: var(--bg-raised); color: var(--text);
|
||||
border-radius: var(--radius-full); padding: 6px 14px; font-size: var(--fs-ui-sm);
|
||||
box-shadow: var(--shadow-md); cursor: pointer;
|
||||
}
|
||||
.drop-veil {
|
||||
position: absolute; inset: 8px; z-index: 5; pointer-events: none;
|
||||
display: flex; align-items: center; justify-content: center;
|
||||
border: 1px dashed var(--accent); border-radius: var(--radius-lg);
|
||||
background: var(--accent-soft); color: var(--accent-text); font-size: var(--fs-ui-sm);
|
||||
}
|
||||
.empty-state { height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; color: var(--text-dim); gap: 10px; font-size: var(--fs-ui-caption); }
|
||||
.empty-state .es-mark { width: 44px; height: 44px; border-radius: var(--radius-lg); background: var(--bg-raised); border: 1px solid var(--border-soft); display: flex; align-items: center; justify-content: center; color: var(--text-faint); margin-bottom: 4px; }
|
||||
.empty-state svg { opacity: .5; }
|
||||
.msg { margin-bottom: 20px; animation: mk-rise-in .18s var(--ease-out); }
|
||||
.msg-role { font-size: var(--fs-ui-sm); color: var(--text-faint); margin-bottom: 6px; display: flex; gap: 8px; align-items: center; }
|
||||
.msg-role { font-size: var(--fs-ui-sm); color: var(--text-dim); margin-bottom: 6px; display: flex; gap: 8px; align-items: center; }
|
||||
.msg-role .role-mark { width: 18px; height: 18px; border-radius: 5px; display: inline-flex; align-items: center; justify-content: center; color: var(--text-dim); background: var(--bg-raised); border: 1px solid var(--border); }
|
||||
.msg.notice { margin-bottom: 12px; }
|
||||
.notice-summary { font-size: var(--fs-ui-sm); color: var(--text-dim); background: none; border: none; padding: 0; cursor: pointer; }
|
||||
.notice-body { font-size: var(--fs-ui-sm); color: var(--text-dim); white-space: pre-wrap; margin-top: 4px; }
|
||||
.msg.user .bubble {
|
||||
background: var(--accent-soft); border: 1px solid transparent;
|
||||
border-radius: var(--radius-lg); padding: 11px 16px; white-space: pre-wrap;
|
||||
@@ -79,9 +126,9 @@ button { font-family: inherit; font-size: inherit; color: inherit; }
|
||||
.part-thinking .mk-col-trigger[aria-expanded="true"] .part-thinking-chev { transform: rotate(90deg); }
|
||||
.part-thinking .part-thinking-body { white-space: pre-wrap; margin-top: 4px; }
|
||||
.part-tool { font-size: var(--fs-ui-sm); }
|
||||
.tool-chip { display: inline-flex; gap: 6px; align-items: center; background: var(--bg-inset); border: 1px solid var(--border-soft); border-radius: var(--radius-sm); padding: 4px 9px; margin: 2px 4px 2px 0; font-family: var(--mono); }
|
||||
.tool-chip .status-ok { color: var(--ok); }
|
||||
.tool-chip .status-error { color: var(--err); }
|
||||
.tool-chip { display: inline-flex; gap: 6px; align-items: center; background: var(--bg-inset); border: 1px solid var(--border-soft); border-radius: var(--radius-sm); padding: 4px 9px; margin: 2px 4px 2px 0; font-family: var(--mono); font-size: var(--fs-code); }
|
||||
.tool-chip .status-ok { color: var(--ok-text); }
|
||||
.tool-chip .status-error { color: var(--err-text); }
|
||||
.part-text { line-height: 1.7; overflow-wrap: break-word; }
|
||||
/* 块级间距只由标签自身控制:禁用 pre-wrap(marked 输出的块间换行会被渲染成空行,
|
||||
叠加出"列表逐项空一行"的松散排版);行内换行语义交给 Markdown 段落。 */
|
||||
@@ -95,7 +142,7 @@ button { font-family: inherit; font-size: inherit; color: inherit; }
|
||||
.part-text :is(ul,ol) { margin: 0.4em 0; padding-left: 1.6em; }
|
||||
.part-text li { margin: 0.15em 0; }
|
||||
.part-text li > p { margin: 0.2em 0; }
|
||||
.part-text pre { background: var(--bg-inset); border: 1px solid var(--border-soft); border-radius: var(--radius); padding: 11px 13px; overflow-x: auto; font-family: var(--mono); font-size: var(--fs-ui-sm); }
|
||||
.part-text pre { background: var(--bg-inset); border: 1px solid var(--border-soft); border-radius: var(--radius); padding: 11px 13px; overflow-x: auto; font-family: var(--mono); font-size: var(--fs-code); }
|
||||
.part-text code { font-family: var(--mono); background: var(--bg-raised); border-radius: var(--radius-xs); padding: 1px 5px; font-size: var(--fs-ui-sm); }
|
||||
.part-text pre code { background: none; padding: 0; }
|
||||
.part-text blockquote { margin: 0.5em 0; padding: 0.1em 0 0.1em 10px; border-left: 3px solid var(--border-strong); color: var(--text-dim); }
|
||||
@@ -103,14 +150,20 @@ button { font-family: inherit; font-size: inherit; color: inherit; }
|
||||
.part-text th, .part-text td { border: 1px solid var(--border); padding: 4px 10px; text-align: left; }
|
||||
.part-text th { background: var(--bg-raised); font-weight: 600; }
|
||||
.part-text hr { border: none; border-top: 1px solid var(--border); margin: 0.8em 0; }
|
||||
.part-text a { color: var(--accent); }
|
||||
.part-error { color: var(--err); background: var(--err-soft); border: 1px solid var(--err); border-radius: var(--radius-sm); padding: 8px 12px; }
|
||||
.part-text a { color: var(--accent-text); }
|
||||
.part-error { color: var(--err-text); background: var(--err-soft); border: 1px solid var(--err); border-radius: var(--radius-sm); padding: 8px 12px; }
|
||||
.part-error-detail { margin-top: 8px; color: var(--text-dim); font-size: var(--fs-ui-sm); }
|
||||
.tool-preview, .tool-live-preview {
|
||||
margin: 0; white-space: pre-wrap; font-family: var(--mono); font-size: var(--fs-ui-sm);
|
||||
color: var(--text-dim); max-height: 8em; overflow: auto;
|
||||
}
|
||||
.tool-live-preview { margin-top: 6px; }
|
||||
.artifact-chip { display: inline-flex; align-items: stretch; background: var(--bg-panel); border: 1px solid var(--border); border-radius: var(--radius-sm); overflow: hidden; font-size: var(--fs-ui-caption); margin: 2px 0; }
|
||||
.artifact-chip .ac-main { display: inline-flex; align-items: center; gap: 7px; color: var(--accent); background: none; border: none; padding: 5px 10px; cursor: pointer; font: inherit; max-width: 340px; }
|
||||
.artifact-chip .ac-main { display: inline-flex; align-items: center; gap: 7px; color: var(--accent-text); background: none; border: none; padding: 5px 10px; cursor: pointer; font: inherit; max-width: 340px; }
|
||||
.artifact-chip .ac-main span, .artifact-chip .ac-main { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
|
||||
.artifact-chip:hover { border-color: var(--accent); }
|
||||
.artifact-chip .ac-act { display: inline-flex; align-items: center; padding: 5px 8px; color: var(--text-dim); border-left: 1px solid var(--border-soft); background: none; cursor: pointer; }
|
||||
.artifact-chip .ac-act:hover { color: var(--accent); background: var(--bg-hover); }
|
||||
.artifact-chip .ac-act:hover { color: var(--accent-text); background: var(--bg-hover); }
|
||||
|
||||
/* 交付物卡片:主区域与「预览」打开预览区,下载收在菜单里。 */
|
||||
.deliverable-card { position: relative; display: flex; align-items: center; gap: 8px; width: fit-content; max-width: 100%; padding: 8px 8px 8px 8px; margin: 6px 0 2px;
|
||||
@@ -121,8 +174,8 @@ button { font-family: inherit; font-size: inherit; color: inherit; }
|
||||
background: var(--bg-inset); color: var(--accent); border: 1px solid var(--border-soft); }
|
||||
.deliverable-card .dc-main { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
|
||||
.deliverable-card .dc-name { color: var(--text); font-weight: 600; font-size: var(--fs-ui-base); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 380px; }
|
||||
.deliverable-card .dc-meta { color: var(--text-faint); font-size: var(--fs-ui-sm); white-space: nowrap; }
|
||||
.deliverable-card .dc-act { flex: none; margin-left: 8px; padding: 5px 12px; border-radius: var(--radius-sm); color: var(--accent);
|
||||
.deliverable-card .dc-meta { color: var(--text-dim); font-size: var(--fs-ui-sm); white-space: nowrap; }
|
||||
.deliverable-card .dc-act { flex: none; margin-left: 8px; padding: 5px 12px; border-radius: var(--radius-sm); color: var(--accent-text);
|
||||
font-size: var(--fs-ui-caption); border: 1px solid var(--border); background: var(--bg-panel); cursor: pointer; }
|
||||
.deliverable-card .dc-act:hover:not(:disabled) { border-color: var(--accent); }
|
||||
.deliverable-card .dc-act:disabled { opacity: .45; cursor: default; }
|
||||
@@ -135,35 +188,49 @@ button { font-family: inherit; font-size: inherit; color: inherit; }
|
||||
/* 工作时间线 */
|
||||
.tl-tools { margin: 4px 0; }
|
||||
.tl-tools-head { font-size: var(--fs-ui-sm); color: var(--text-dim); }
|
||||
.tl-tools-list { margin: 2px 0 0; padding: 0 0 0 16px; color: var(--text-faint); font-size: var(--fs-ui-sm); }
|
||||
.tl-tools-list { margin: 2px 0 0; padding: 0 0 0 16px; color: var(--text-dim); font-size: var(--fs-ui-sm); }
|
||||
.tl-tools-list li { margin: 1px 0; }
|
||||
.tl-tools-name { color: var(--text-dim); }
|
||||
.tl-tools-sum { margin-left: 8px; color: var(--text-faint); }
|
||||
.tl-tools .status-error { margin-left: 8px; color: var(--err); }
|
||||
.tl-tools-sum { margin-left: 8px; color: var(--text-dim); }
|
||||
.tl-check { color: var(--text-dim); font-size: var(--fs-ui-sm); margin: 4px 0; }
|
||||
.tl-tools .status-error { margin-left: 8px; color: var(--err-text); }
|
||||
.tl-tool-detail { margin-top: 4px; color: var(--text-dim); font-size: var(--fs-ui-sm); }
|
||||
.tl-thinking { margin: 8px 0; padding: 8px 12px; border-left: 2px solid var(--border-strong); color: var(--text-dim); }
|
||||
.tl-thinking-label { display: block; margin-bottom: 4px; font-size: var(--fs-ui-sm); font-weight: 600; }
|
||||
.tl-thinking-body { white-space: pre-wrap; overflow-wrap: anywhere; font-size: var(--fs-ui-sm); line-height: 1.6; }
|
||||
|
||||
/* 对话右侧预览区 */
|
||||
.preview-slot { flex-shrink: 0; min-width: 0; display: flex; }
|
||||
/* 第三栏「文件」入口内的多标签预览(外壳样式见 .right-panel .preview-pane) */
|
||||
.preview-pane { flex: 1; min-width: 0; display: flex; flex-direction: column; background: var(--bg); border: 1px solid var(--border-soft); border-radius: var(--radius-lg); overflow: hidden; }
|
||||
.preview-pane-bar { display: flex; align-items: center; gap: 8px; padding: 6px 10px; border-bottom: 1px solid var(--border-soft); }
|
||||
.preview-pane-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: var(--fs-ui-sm); color: var(--text-dim); }
|
||||
.preview-pane-spacer { flex: 1; }
|
||||
.preview-pane-body { flex: 1; min-height: 0; overflow: auto; }
|
||||
.preview-pane-body .ui-fp { height: 100%; }
|
||||
/* 只给下限,不钉死高度:内容超出时由本层滚动。PDF iframe 靠自身 flex:1 撑满。 */
|
||||
.preview-pane-body .ui-fp { min-height: 100%; }
|
||||
.preview-pane-body .ui-fp-pdf { height: 100%; min-height: 480px; border: none; }
|
||||
.docx-wrapper { background: var(--bg-inset) !important; padding: 12px; }
|
||||
.docx-wrapper > section.docx { background: var(--bg) !important; color: var(--text); box-shadow: var(--shadow-md); }
|
||||
.preview-pane-meta { flex-shrink: 0; font-size: var(--fs-ui-xs); color: var(--text-faint); text-transform: capitalize; }
|
||||
.preview-pane-dirty { color: var(--warn-text); font-size: var(--fs-ui-sm); }
|
||||
.preview-pane-editor {
|
||||
display: block; width: 100%; height: 100%; min-height: 0; resize: none;
|
||||
font-family: var(--mono); font-size: var(--fs-code); background: var(--bg); color: var(--text);
|
||||
}
|
||||
.docx-wrapper { background: var(--bg-inset) !important; padding: 12px; display: flex; flex-direction: column; align-items: flex-start !important; }
|
||||
/* 宽栏时纸张居中。auto margin 优先于 align-items;栏比纸窄时剩余空间为负,margin 归零,
|
||||
纸张仍贴左,previewfit 的 transform-origin: top left 不用改。 */
|
||||
.docx-wrapper > section.docx { background: var(--paper) !important; color: var(--paper-ink); box-shadow: var(--shadow-md); margin-inline: auto; }
|
||||
/* 过程段内联组(流式/关闭自动折叠时,按原位渲染的过程容器) */
|
||||
.part-group { margin: 2px 0; }
|
||||
|
||||
/* 过程折叠(run 终态后;Collapsible 契约:触发行 + mk-col 动画体) */
|
||||
.process-collapse { border: 1px solid var(--border-soft); border-radius: var(--radius); background: var(--bg-panel); margin: 6px 0; }
|
||||
.process-collapse .process-collapse-summary { padding: 7px 12px; color: var(--text-faint); font-size: var(--fs-ui-sm); user-select: none; }
|
||||
.process-collapse .process-collapse-summary { padding: 7px 12px; color: var(--text-dim); font-size: var(--fs-ui-sm); user-select: none; }
|
||||
.process-collapse .process-collapse-summary:hover { color: var(--text-dim); }
|
||||
.process-collapse .process-collapse-chev { display: inline-flex; color: var(--text-faint); font-size: var(--fs-ui-xs); transition: transform .12s; }
|
||||
.process-collapse .mk-col-trigger[aria-expanded="true"] .process-collapse-chev { transform: rotate(90deg); }
|
||||
.process-collapse .process-collapse-meta { color: var(--text-faint); }
|
||||
.process-collapse .process-collapse-excerpt { color: var(--text-faint); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 40%; }
|
||||
.process-collapse .process-collapse-meta { color: var(--text-dim); }
|
||||
.process-collapse .process-collapse-excerpt { color: var(--text-dim); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 40%; }
|
||||
.process-collapse .body { padding: 4px 12px 10px; }
|
||||
.process-load-note { padding: 8px 0; color: var(--text-dim); font-size: var(--fs-ui-sm); }
|
||||
|
||||
/* 流式状态行(呼吸/扫光走 mk-* 类;已工作计时弱色等宽) */
|
||||
.live-bar { display: flex; align-items: center; gap: 8px; color: var(--text-faint); font-size: var(--fs-ui-sm); margin-bottom: 6px; }
|
||||
@@ -173,6 +240,11 @@ button { font-family: inherit; font-size: inherit; color: inherit; }
|
||||
|
||||
/* HITL 卡片(确认类交互统一绿色语言) */
|
||||
.hitl-card { border: 1px solid var(--ok-border); background: var(--ok-soft); border-radius: var(--radius-lg); padding: 14px; margin: 10px 0; }
|
||||
.hitl-card.wait { border-color: var(--wait); background: var(--wait-soft); }
|
||||
.hitl-card.ask { border-color: var(--border-strong); background: var(--bg-raised); }
|
||||
.hitl-detail { white-space: pre-wrap; margin: 8px 0 0; font-size: var(--fs-ui-sm); color: var(--text-dim); font-family: inherit; }
|
||||
.mode-select { display: inline-flex; align-items: center; gap: 6px; font-size: var(--fs-ui-sm); color: var(--text-faint); }
|
||||
.mode-select select { font-size: var(--fs-ui-sm); color: var(--text); background: var(--bg-panel); border: 1px solid var(--border); border-radius: var(--radius-sm); padding: 4px 8px; }
|
||||
.hitl-q { font-weight: 600; margin-bottom: 10px; display: flex; gap: 8px; align-items: flex-start; }
|
||||
.hitl-q svg { color: var(--ok); flex: none; margin-top: 1px; }
|
||||
.hitl-choices { display: flex; flex-direction: column; gap: 8px; }
|
||||
@@ -180,12 +252,17 @@ button { font-family: inherit; font-size: inherit; color: inherit; }
|
||||
.hitl-choice:hover { border-color: var(--accent); background: var(--accent-soft); }
|
||||
.hitl-choice .label { font-weight: 600; display: flex; gap: 8px; align-items: center; }
|
||||
.hitl-choice .desc { color: var(--text-dim); font-size: var(--fs-ui-sm); margin-top: 3px; }
|
||||
.hitl-choice .impact { color: var(--warn); font-size: var(--fs-ui-sm); margin-top: 3px; }
|
||||
.hitl-choice .rec { font-size: var(--fs-ui-xs); color: var(--accent); border: 1px solid var(--accent); padding: 0 5px; border-radius: var(--radius-full); }
|
||||
.hitl-choice .impact { color: var(--warn-text); font-size: var(--fs-ui-sm); margin-top: 3px; }
|
||||
.hitl-choice .rec { font-size: var(--fs-ui-xs); color: var(--accent-text); border: 1px solid var(--accent); padding: 0 5px; border-radius: var(--radius-full); }
|
||||
.hitl-free { display: flex; gap: 8px; margin-top: 10px; }
|
||||
|
||||
/* 输入区:悬浮卡片式输入壳(16px 大圆角 = DESIGN.md 特批例外) */
|
||||
.input-bar { padding: 8px max(16px, 6%) 16px; background: var(--bg); border-radius: 0 0 var(--radius-lg) var(--radius-lg); }
|
||||
/* 轻量状态提示行(快慢通道):一行以内,弱色;后台任务在回合结束后仍显示 */
|
||||
.input-status { display: flex; align-items: center; gap: 8px; padding: 0 4px 6px; color: var(--text-faint); font-size: var(--fs-ui-sm); }
|
||||
.input-status-note { color: var(--text-faint); }
|
||||
.input-status-link { border: none; background: none; color: var(--accent-text); font-size: var(--fs-ui-sm); cursor: pointer; padding: 0; }
|
||||
.input-status-link:hover { text-decoration: underline; }
|
||||
.outbox-trigger { width: 100%; text-align: left; background: var(--bg-inset); color: var(--text-dim); border: 1px solid var(--border-soft); border-radius: var(--radius-xs); padding: 6px 10px; font-size: var(--fs-ui-sm); cursor: pointer; }
|
||||
.outbox-list { list-style: none; margin: 6px 0 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
|
||||
.outbox-item { display: flex; gap: 6px; align-items: center; background: var(--bg-inset); border-radius: var(--radius-xs); padding: 6px 8px; }
|
||||
@@ -200,7 +277,7 @@ button { font-family: inherit; font-size: inherit; color: inherit; }
|
||||
.cmd-menu { border: 1px solid var(--border); background: var(--bg-raised); border-radius: var(--radius); margin-bottom: 6px; max-height: 180px; overflow-y: auto; box-shadow: var(--shadow-md); }
|
||||
.cmd-item { padding: 7px 12px; cursor: pointer; display: flex; gap: 10px; font-size: var(--fs-ui-caption); }
|
||||
.cmd-item:hover, .cmd-item.active { background: var(--bg-hover); }
|
||||
.cmd-item .name { color: var(--accent); font-family: var(--mono); }
|
||||
.cmd-item .name { color: var(--accent-text); font-family: var(--mono); }
|
||||
|
||||
/* ---- 右栏 ---- */
|
||||
.tabs { display: flex; border-bottom: 1px solid var(--border-soft); overflow-x: auto; padding: 0 8px; }
|
||||
@@ -211,8 +288,8 @@ button { font-family: inherit; font-size: inherit; color: inherit; }
|
||||
.step { display: flex; gap: 8px; align-items: flex-start; padding: 6px 4px; font-size: var(--fs-ui-caption); }
|
||||
.step-icon { width: 16px; text-align: center; flex-shrink: 0; }
|
||||
.step.pending .step-icon { color: var(--text-faint); }
|
||||
.step.in_progress .step-icon { color: var(--accent); }
|
||||
.step.done .step-icon { color: var(--ok); }
|
||||
.step.in_progress .step-icon { color: var(--accent-text); }
|
||||
.step.done .step-icon { color: var(--ok-text); }
|
||||
.step.skipped { color: var(--text-faint); text-decoration: line-through; }
|
||||
/* ---- 工件面板(工作区文件管理)---- */
|
||||
.artifacts-panel { display: flex; flex-direction: column; gap: 4px; }
|
||||
@@ -220,19 +297,19 @@ button { font-family: inherit; font-size: inherit; color: inherit; }
|
||||
.ap-toolbar .search-input { flex: 1; min-width: 120px; height: 30px; font-size: var(--fs-ui-sm); }
|
||||
.kind-pill { border: 1px solid var(--border); background: none; color: var(--text-dim); border-radius: var(--radius-full); padding: 3px 10px; font-size: var(--fs-ui-sm); cursor: pointer; }
|
||||
.kind-pill:hover { color: var(--text); background: var(--bg-hover); }
|
||||
.kind-pill.on { color: var(--accent); border-color: var(--accent); background: var(--accent-soft); }
|
||||
.kind-pill.on { color: var(--accent-text); border-color: var(--accent); background: var(--accent-soft); }
|
||||
.ap-upload { cursor: pointer; }
|
||||
.artifact-row { display: flex; align-items: center; gap: 8px; padding: 7px 8px; border-radius: var(--radius-sm); }
|
||||
.artifact-row:hover { background: var(--bg-hover); }
|
||||
.artifact-row .ar-icon { display: flex; color: var(--text-dim); cursor: pointer; flex: none; }
|
||||
.artifact-row .ar-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; cursor: pointer; }
|
||||
.artifact-row .name { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: var(--fs-ui-caption); }
|
||||
.artifact-row .meta { font-size: var(--fs-ui-xs); color: var(--text-faint); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
|
||||
.artifact-row .meta { font-size: var(--fs-ui-sm); color: var(--text-dim); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
|
||||
.artifact-row .ar-acts { display: none; align-items: center; gap: 2px; flex: none; }
|
||||
.artifact-row:hover .ar-acts { display: inline-flex; }
|
||||
.artifact-row .ar-acts .icon-btn { width: 26px; height: 26px; }
|
||||
.artifact-row .ar-acts .icon-btn.danger { color: var(--err); }
|
||||
.empty-note { color: var(--text-faint); font-size: var(--fs-ui-sm); padding: 14px 6px; }
|
||||
.artifact-row .ar-acts .icon-btn.danger { color: var(--err-text); }
|
||||
.empty-note { color: var(--text-dim); font-size: var(--fs-ui-sm); padding: 14px 6px; }
|
||||
.agent-row { display: flex; align-items: center; gap: 8px; padding: 8px; border-radius: var(--radius-sm); cursor: pointer; font-size: var(--fs-ui-caption); }
|
||||
.agent-row:hover { background: var(--bg-hover); }
|
||||
.status-dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }
|
||||
@@ -257,26 +334,15 @@ button { font-family: inherit; font-size: inherit; color: inherit; }
|
||||
.ui-setting-control input:focus, .ui-setting-control select:focus { border-color: var(--accent); box-shadow: var(--ring); outline: none; }
|
||||
.ui-setting-control input[type="checkbox"] { width: auto; }
|
||||
.effect-badge { font-size: var(--fs-ui-xs); padding: 2px 7px; border-radius: var(--radius-full); border: 1px solid var(--border); color: var(--text-faint); white-space: nowrap; }
|
||||
.effect-hot { color: var(--ok); border-color: var(--ok); }
|
||||
.effect-new-run { color: var(--warn); border-color: var(--warn); }
|
||||
|
||||
/* ---- 文档查看器(单层 OverlayHost 内)---- */
|
||||
.docv { display: flex; flex-direction: column; min-height: 0; }
|
||||
.docv-toolbar { display: flex; align-items: center; gap: 8px; padding: 0 0 10px; border-bottom: 1px solid var(--border-soft); margin-bottom: 10px; }
|
||||
.docv-toolbar .spacer { flex: 1; }
|
||||
.docv-meta { font-size: var(--fs-ui-xs); color: var(--text-faint); text-transform: capitalize; }
|
||||
.docv-dirty { color: var(--warn); font-size: var(--fs-ui-sm); }
|
||||
.docv-dl { text-decoration: none; }
|
||||
.docv-body { flex: 1; min-height: 0; overflow: auto; }
|
||||
.docv-pdf { width: 100%; height: 100%; min-height: 60vh; border: 1px solid var(--border-soft); border-radius: var(--radius); background: var(--bg); }
|
||||
.docv-editor { width: 100%; height: 56vh; font-family: var(--mono); font-size: var(--fs-ui-sm); resize: vertical; }
|
||||
.docv-pre { font-family: var(--mono); font-size: var(--fs-ui-sm); white-space: pre-wrap; word-break: break-word; background: var(--bg-inset); border: 1px solid var(--border-soft); border-radius: var(--radius); padding: 12px 14px; }
|
||||
.effect-hot { color: var(--ok-text); border-color: var(--ok); }
|
||||
.effect-new-run { color: var(--warn-text); border-color: var(--warn); }
|
||||
|
||||
/* ---- 杂项 ---- */
|
||||
.toast { position: fixed; bottom: 24px; left: 50%; transform: translateX(-50%); background: var(--bg-raised); border: 1px solid var(--border); color: var(--text); padding: 9px 16px; border-radius: var(--radius-full); box-shadow: var(--shadow-lg); z-index: 90; font-size: var(--fs-ui-caption); }
|
||||
.conn-dot { width: 8px; height: 8px; border-radius: 50%; }
|
||||
.conn-dot.on { background: var(--ok); }
|
||||
.conn-dot.off { background: var(--err); }
|
||||
.conn-label { font-size: var(--fs-ui-sm); color: var(--text-faint); }
|
||||
.doc-toolbar { display: flex; gap: 8px; margin-bottom: 10px; align-items: center; }
|
||||
::-webkit-scrollbar { width: 10px; height: 10px; }
|
||||
::-webkit-scrollbar-thumb { background: var(--bg-active); border-radius: 6px; border: 3px solid transparent; background-clip: content-box; }
|
||||
@@ -286,24 +352,29 @@ button { font-family: inherit; font-size: inherit; color: inherit; }
|
||||
/* ---- 品牌标(侧栏 / 登录页 / 头像共用的星芒渐变底;辅色为品牌令牌 --brand-2) ---- */
|
||||
.brand-mark { background: linear-gradient(135deg, var(--accent), var(--brand-2)); color: var(--text-on-accent); display: inline-flex; align-items: center; justify-content: center; flex: none; box-shadow: inset 0 1px 0 rgba(255,255,255,.22); }
|
||||
|
||||
/* ---- 左栏:任务中心(方案 A;Zai 复刻重造型) ---- */
|
||||
.tsb-brand { display: flex; align-items: center; gap: 9px; padding: 14px 14px 8px; }
|
||||
/* ---- 左栏:项目导航(方案 A;三栏工作台重排:切换置顶、会话居中、文件沉底) ---- */
|
||||
.tsb-brand { display: flex; align-items: center; gap: 6px; padding: 12px 12px 8px; }
|
||||
.tsb-projrow { flex: 1; min-width: 0; display: flex; align-items: center; gap: 7px; height: 32px; padding: 0 9px; border-radius: var(--radius); border: 1px solid var(--border); background: var(--bg-raised); color: var(--text); cursor: pointer; font-size: var(--fs-ui-caption); font-weight: 600; }
|
||||
.tsb-projrow:hover { border-color: var(--accent-sidebar); }
|
||||
.tsb-projrow-name { min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
|
||||
.tsb-projrow-stage { flex: none; font-size: var(--fs-ui-xs); font-weight: 450; color: var(--text-faint); border: 1px solid var(--border); border-radius: var(--radius-full); padding: 0 6px; }
|
||||
.tsb-projrow .tsb-user-chev { color: var(--text-faint); display: inline-flex; flex: none; }
|
||||
.tsb-logo { width: 24px; height: 24px; border-radius: var(--radius); background: linear-gradient(135deg, var(--accent), var(--brand-2)); color: var(--text-on-accent); font-size: var(--fs-ui-sm); font-weight: 700; display: flex; align-items: center; justify-content: center; flex: none; }
|
||||
.tsb-name { font-weight: 650; font-size: var(--fs-ui-caption); letter-spacing: -0.01em; }
|
||||
.tsb-iconbtn { width: 26px; height: 26px; border-radius: var(--radius-sm); background: none; border: none; color: var(--text-faint); cursor: pointer; font-size: var(--fs-ui-caption); display: inline-flex; align-items: center; justify-content: center; position: relative; }
|
||||
.tsb-iconbtn:hover { background: var(--bg-hover); color: var(--text); }
|
||||
.tsb-iconbtn.active { color: var(--accent); background: var(--accent-soft); }
|
||||
.tsb-iconbtn.active { color: var(--accent-sidebar); background: var(--accent-soft); }
|
||||
|
||||
.tsb-actions { padding: 6px 12px 8px; display: flex; flex-direction: column; gap: 7px; }
|
||||
.tsb-newtask { display: flex; height: 36px; border-radius: var(--radius); background: var(--primary); color: var(--primary-foreground); overflow: hidden; box-shadow: 0 1px 3px rgba(0, 0, 0, .3); transition: background .12s; }
|
||||
.tsb-newtask:hover { background: color-mix(in srgb, var(--primary) 86%, var(--bg)); }
|
||||
.tsb-newtask { display: flex; height: 36px; border-radius: var(--radius); background: var(--primary-sidebar); color: var(--primary-sidebar-foreground); overflow: hidden; box-shadow: 0 1px 3px rgba(0, 0, 0, .3); transition: background .12s; }
|
||||
.tsb-newtask:hover { background: color-mix(in srgb, var(--primary-sidebar) 86%, var(--bg-sidebar)); }
|
||||
.tsb-newtask-main { flex: 1; display: flex; align-items: center; gap: 7px; padding: 0 11px; background: none; border: none; color: inherit; font-weight: 600; font-size: var(--fs-ui-caption); cursor: pointer; min-width: 0; }
|
||||
.tsb-newtask-main svg { flex: none; }
|
||||
.tsb-newtask-proj { font-weight: 450; font-size: var(--fs-ui-xs); opacity: .75; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
|
||||
.tsb-newtask-caret { width: 30px; border: none; border-left: 1px solid color-mix(in srgb, var(--primary-foreground) 18%, transparent); background: none; color: inherit; cursor: pointer; display: flex; align-items: center; justify-content: center; }
|
||||
.tsb-newtask-caret:hover { background: color-mix(in srgb, var(--primary-foreground) 8%, transparent); }
|
||||
.tsb-newtask-caret { width: 30px; border: none; border-left: 1px solid color-mix(in srgb, var(--primary-sidebar-foreground) 18%, transparent); background: none; color: inherit; cursor: pointer; display: flex; align-items: center; justify-content: center; }
|
||||
.tsb-newtask-caret:hover { background: color-mix(in srgb, var(--primary-sidebar-foreground) 8%, transparent); }
|
||||
.tsb-search { display: flex; align-items: center; gap: 7px; height: 32px; border-radius: var(--radius); border: 1px solid var(--border); background: var(--bg-raised); color: var(--text-faint); padding: 0 10px; transition: border-color .12s, box-shadow .12s; }
|
||||
.tsb-search:focus-within { border-color: var(--accent); box-shadow: var(--ring); }
|
||||
.tsb-search:focus-within { border-color: var(--accent-sidebar); box-shadow: var(--ring); }
|
||||
.tsb-search svg { flex: none; }
|
||||
.tsb-search input { flex: 1; border: none; background: none; color: var(--text); font-size: var(--fs-ui-sm); outline: none; min-width: 0; }
|
||||
.tsb-search input::placeholder { color: var(--text-faint); }
|
||||
@@ -315,8 +386,8 @@ button { font-family: inherit; font-size: inherit; color: inherit; }
|
||||
.tsb-pill.on { background: var(--bg-raised); color: var(--text); font-weight: 550; box-shadow: 0 1px 2px rgba(0,0,0,.25); }
|
||||
|
||||
.tsb-scroll { flex: 1; overflow-y: auto; padding: 0 10px 8px; min-height: 0; }
|
||||
.tsb-seclabel { font-size: var(--fs-ui-xs); color: var(--text-faint); padding: 12px 8px 4px; letter-spacing: .05em; font-weight: 600; }
|
||||
.tsb-empty { padding: 20px 14px; color: var(--text-faint); font-size: var(--fs-ui-sm); line-height: 1.9; text-align: center; }
|
||||
.tsb-seclabel { font-size: var(--fs-ui-sm); color: var(--text-dim); padding: 12px 8px 4px; font-weight: 600; }
|
||||
.tsb-empty { padding: 20px 14px; color: var(--text-dim); font-size: var(--fs-ui-sm); line-height: 1.9; text-align: center; }
|
||||
.tsb-newproject { padding: 0 2px 8px; }
|
||||
|
||||
.tsb-group { margin-bottom: 2px; }
|
||||
@@ -333,11 +404,11 @@ button { font-family: inherit; font-size: inherit; color: inherit; }
|
||||
.tsb-task { display: flex; align-items: center; gap: 8px; height: 31px; padding: 0 8px; margin: 1px 0; border-radius: var(--radius-sm); color: var(--text-dim); cursor: pointer; position: relative; transition: background .1s, color .1s; }
|
||||
.tsb-task:hover { background: var(--bg-hover); color: var(--text); }
|
||||
.tsb-task.active { background: var(--bg-active); color: var(--text); }
|
||||
.tsb-task.active::before { content: ''; position: absolute; left: -2px; top: 6px; bottom: 6px; width: 2.5px; border-radius: 2px; background: var(--accent); }
|
||||
.tsb-task.active::before { content: ''; position: absolute; left: -2px; top: 6px; bottom: 6px; width: 2.5px; border-radius: 2px; background: var(--accent-sidebar); }
|
||||
.tsb-task.archived .tsb-task-t { text-decoration: line-through; opacity: .6; }
|
||||
.tsb-task-t { flex: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: var(--fs-ui-caption); }
|
||||
.tsb-task-tm { font-size: var(--fs-ui-xs); color: var(--text-faint); font-variant-numeric: tabular-nums; }
|
||||
.tsb-pbadge { font-size: var(--fs-ui-xs); color: var(--text-faint); border: 1px solid var(--border); border-radius: var(--radius-xs); padding: 0 5px; line-height: 1.5; white-space: nowrap; }
|
||||
.tsb-pbadge { font-size: var(--fs-ui-xs); color: var(--text-dim); border: 1px solid var(--border); border-radius: var(--radius-xs); padding: 0 5px; line-height: 1.5; white-space: nowrap; }
|
||||
.tsb-row-acts { display: none; gap: 2px; }
|
||||
.tsb-task:hover .tsb-row-acts { display: inline-flex; }
|
||||
.tsb-task:hover .tsb-task-tm { display: none; }
|
||||
@@ -345,6 +416,8 @@ button { font-family: inherit; font-size: inherit; color: inherit; }
|
||||
.tsb-row-act:hover { background: var(--bg-active); color: var(--text); }
|
||||
|
||||
.tsb-footer { display: flex; align-items: center; gap: 4px; padding: 10px 12px; border-top: 1px solid var(--border-soft); border-radius: 0 0 var(--radius-lg) var(--radius-lg); }
|
||||
/* 底部沉底区(方案:文件、工作区在账户上方) */
|
||||
.tsb-bottom { display: flex; flex-direction: column; gap: 1px; padding: 6px 10px 2px; border-top: 1px solid var(--border-soft); }
|
||||
.tsb-user { flex: 1; display: flex; align-items: center; gap: 9px; min-width: 0; height: 40px; padding: 0 7px; border: none; border-radius: var(--radius); background: none; cursor: pointer; text-align: left; transition: background .12s; }
|
||||
.tsb-user:hover { background: var(--bg-hover); }
|
||||
.tsb-avatar { width: 27px; height: 27px; border-radius: 50%; background: linear-gradient(135deg, var(--accent), var(--brand-2)); color: var(--text-on-accent); font-size: var(--fs-ui-sm); font-weight: 600; display: flex; align-items: center; justify-content: center; flex: none; box-shadow: inset 0 1px 0 rgba(255,255,255,.2); }
|
||||
@@ -353,14 +426,17 @@ button { font-family: inherit; font-size: inherit; color: inherit; }
|
||||
.tsb-user-sub { font-size: var(--fs-ui-xs); color: var(--text-faint); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
|
||||
.tsb-user-chev { color: var(--text-faint); display: inline-flex; }
|
||||
|
||||
.tsb-menu { position: fixed; z-index: 300; min-width: 216px; background: var(--bg-raised); border: 1px solid var(--border-strong); border-radius: var(--radius); box-shadow: var(--shadow-lg); padding: 5px; display: flex; flex-direction: column; animation: mk-modal-in .12s var(--ease); }
|
||||
.tsb-menu { position: fixed; z-index: 300; min-width: 216px; background: var(--bg-raised); border: 1px solid var(--border-strong); border-radius: var(--radius); box-shadow: var(--shadow-lg); padding: 5px; display: flex; flex-direction: column; animation: mk-modal-in .12s var(--ease);
|
||||
/* 菜单挂在侧栏里,但纸面是主区底。侧栏对 --text* 的重映射不能漏进来。 */
|
||||
--text: var(--text-workspace); --text-dim: var(--text-workspace-dim); --text-faint: var(--text-workspace-faint);
|
||||
color: var(--text-workspace); }
|
||||
.tsb-mi { display: flex; align-items: center; gap: 9px; min-height: 31px; padding: 4px 9px; border: none; border-radius: var(--radius-sm); background: none; color: var(--text-dim); font-size: var(--fs-ui-caption); cursor: pointer; text-align: left; }
|
||||
.tsb-mi svg { color: var(--text-faint); flex: none; }
|
||||
.tsb-mi:hover { background: var(--bg-hover); color: var(--text); }
|
||||
.tsb-mi:hover svg { color: var(--text-dim); }
|
||||
.tsb-mi.danger { color: var(--err); }
|
||||
.tsb-mi.danger:hover { background: var(--err); color: var(--text-on-accent); }
|
||||
.tsb-mi.danger:hover svg { color: var(--text-on-accent); }
|
||||
.tsb-mi.danger { color: var(--err-text); }
|
||||
.tsb-mi.danger:hover { background: var(--err-text); color: var(--text-on-semantic); }
|
||||
.tsb-mi.danger:hover svg { color: var(--text-on-semantic); }
|
||||
.tsb-mi kbd { margin-left: auto; font-size: var(--fs-ui-xs); font-family: var(--mono); color: var(--text-faint); }
|
||||
.tsb-menu-div { height: 1px; background: var(--border-soft); margin: 5px 4px; }
|
||||
.tsb-acc-head { display: flex; gap: 10px; align-items: center; padding: 8px 9px 6px; }
|
||||
@@ -392,7 +468,7 @@ button { font-family: inherit; font-size: inherit; color: inherit; }
|
||||
.lg-input { width: 100%; height: 38px; border-radius: var(--radius); border: 1px solid var(--border); background: var(--bg-raised); color: var(--text); padding: 0 12px; font-size: var(--fs-ui-caption); transition: border-color .12s, box-shadow .12s; }
|
||||
.lg-input:focus { border-color: var(--accent); box-shadow: var(--ring); outline: none; }
|
||||
.lg-mono { font-family: var(--mono); font-size: var(--fs-ui-sm); }
|
||||
.lg-err { margin-top: 12px; font-size: var(--fs-ui-sm); color: var(--err); background: var(--err-soft); border: 1px solid color-mix(in srgb, var(--err) 35%, transparent); border-radius: var(--radius); padding: 8px 11px; display: flex; gap: 7px; align-items: flex-start; }
|
||||
.lg-err { margin-top: 12px; font-size: var(--fs-ui-sm); color: var(--err-text); background: var(--err-soft); border: 1px solid color-mix(in srgb, var(--err) 35%, transparent); border-radius: var(--radius); padding: 8px 11px; display: flex; gap: 7px; align-items: flex-start; }
|
||||
.lg-err svg { flex: none; margin-top: 1px; }
|
||||
.lg-submit {
|
||||
width: 100%; height: 38px; margin-top: 16px; border: none; border-radius: var(--radius);
|
||||
@@ -419,7 +495,7 @@ button { font-family: inherit; font-size: inherit; color: inherit; }
|
||||
.az-nav-item { display: flex; align-items: center; gap: 9px; padding: 9px 11px; border: none; background: none; color: var(--text-dim); font-size: var(--fs-ui-caption); border-radius: var(--radius-sm); cursor: pointer; text-align: left; }
|
||||
.az-nav-item:hover { background: var(--bg-hover); color: var(--text); }
|
||||
.az-nav-item.on { background: var(--bg-active); color: var(--text); font-weight: 550; }
|
||||
.az-nav-item.on svg { color: var(--accent); }
|
||||
.az-nav-item.on svg { color: var(--accent-text); }
|
||||
.az-main { flex: 1; min-width: 0; overflow-y: auto; padding: 20px 24px; }
|
||||
.az-section-head { margin-bottom: 14px; }
|
||||
.az-section-head h3 { margin: 0 0 4px; font-size: var(--fs-ui-lg); font-weight: 600; letter-spacing: -0.01em; }
|
||||
@@ -434,18 +510,18 @@ button { font-family: inherit; font-size: inherit; color: inherit; }
|
||||
.ad-create-btn { width: auto; padding: 0 14px; margin-top: 0; height: 34px; flex: none; }
|
||||
.ad-mini { border: 1px solid var(--border); background: var(--bg-raised); color: var(--text-dim); border-radius: var(--radius-sm); padding: 4px 9px; font-size: var(--fs-ui-sm); cursor: pointer; white-space: nowrap; display: inline-flex; align-items: center; gap: 4px; }
|
||||
.ad-mini:hover { color: var(--text); border-color: var(--accent); }
|
||||
.ad-hint { margin: 0; font-size: var(--fs-ui-xs); color: var(--text-faint); }
|
||||
.ad-notice { font-size: var(--fs-ui-sm); color: var(--ok); background: var(--ok-soft); border: 1px solid var(--ok-border); border-radius: var(--radius); padding: 8px 11px; display: flex; gap: 7px; align-items: flex-start; }
|
||||
.ad-hint { margin: 0; font-size: var(--fs-ui-sm); color: var(--text-dim); }
|
||||
.ad-notice { font-size: var(--fs-ui-sm); color: var(--ok-text); background: var(--ok-soft); border: 1px solid var(--ok-border); border-radius: var(--radius); padding: 8px 11px; display: flex; gap: 7px; align-items: flex-start; }
|
||||
.ad-notice svg { flex: none; margin-top: 1px; }
|
||||
.ad-table { width: 100%; border-collapse: collapse; font-size: var(--fs-ui-sm); }
|
||||
.ad-table th { text-align: left; font-weight: 600; color: var(--text-faint); font-size: var(--fs-ui-xs); text-transform: uppercase; letter-spacing: .06em; padding: 8px; border-bottom: 1px solid var(--border); }
|
||||
.ad-table th { text-align: left; font-weight: 600; color: var(--text-dim); font-size: var(--fs-ui-sm); padding: 8px; border-bottom: 1px solid var(--border); }
|
||||
.ad-table td { padding: 9px 8px; border-bottom: 1px solid var(--border-soft); }
|
||||
.ad-table tr:last-child td { border-bottom: none; }
|
||||
.ad-mono { font-family: var(--mono); font-size: var(--fs-ui-sm); }
|
||||
.ad-dim { color: var(--text-faint); }
|
||||
.ad-chip { font-size: var(--fs-ui-xs); border-radius: var(--radius-xs); padding: 2px 7px; font-weight: 700; letter-spacing: .5px; background: var(--bg-hover); color: var(--text-faint); }
|
||||
.ad-chip-admin { background: var(--accent-soft); color: var(--accent); }
|
||||
.ad-chip-warn { background: var(--warn-soft); color: var(--warn); }
|
||||
.ad-dim { color: var(--text-dim); }
|
||||
.ad-chip { font-size: var(--fs-ui-xs); border-radius: var(--radius-xs); padding: 2px 7px; font-weight: 700; letter-spacing: .5px; background: var(--bg-hover); color: var(--text-dim); }
|
||||
.ad-chip-admin { background: var(--accent-soft); color: var(--accent-text); }
|
||||
.ad-chip-warn { background: var(--warn-soft); color: var(--warn-text); }
|
||||
.ad-reset { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; border: 1px solid color-mix(in srgb, var(--warn) 40%, transparent); background: var(--warn-soft); border-radius: var(--radius-lg); padding: 12px; font-size: var(--fs-ui-sm); }
|
||||
.ad-reset .lg-input { flex: 1; min-width: 160px; height: 32px; }
|
||||
.ad-changepw { display: flex; flex-direction: column; gap: 2px; max-width: 340px; }
|
||||
@@ -454,7 +530,7 @@ button { font-family: inherit; font-size: inherit; color: inherit; }
|
||||
.icon-only { display: flex; flex-direction: column; align-items: center; gap: 6px; padding-top: 12px; }
|
||||
.icon-only button { background: none; border: none; color: var(--text-faint); cursor: pointer; padding: 0; width: 34px; height: 34px; border-radius: var(--radius); display: inline-flex; align-items: center; justify-content: center; position: relative; }
|
||||
.icon-only button:hover { background: var(--bg-hover); color: var(--text); }
|
||||
.rail-badge { position: absolute; top: 3px; right: 3px; min-width: 14px; height: 14px; border-radius: 7px; background: var(--warn); color: var(--text-on-accent); font-size: var(--fs-ui-xs); font-weight: 700; display: flex; align-items: center; justify-content: center; padding: 0 4px; }
|
||||
.rail-badge { position: absolute; top: 3px; right: 3px; min-width: 14px; height: 14px; border-radius: 7px; background: var(--warn-text); color: var(--text-on-semantic); font-size: var(--fs-ui-xs); font-weight: 700; display: flex; align-items: center; justify-content: center; padding: 0 4px; }
|
||||
|
||||
/* ---- UI 能力平台消费(消息头像列 / 设置外壳 / 管理弹层头像) ---- */
|
||||
.role-mark { width: 20px; height: 20px; border-radius: 6px; display: inline-flex; align-items: center; justify-content: center; color: var(--text-dim); background: var(--bg-raised); border: 1px solid var(--border); }
|
||||
@@ -473,3 +549,175 @@ button { font-family: inherit; font-size: inherit; color: inherit; }
|
||||
border-radius: var(--radius-full); padding: 2px 12px; font-size: var(--fs-ui-sm); cursor: pointer; opacity: .72;
|
||||
}
|
||||
.inbox-scope button.active { opacity: 1; font-weight: 600; background: var(--bg-hover); }
|
||||
.tsb-project {
|
||||
display: flex; flex-direction: column; align-items: flex-start; gap: 2px; width: 100%;
|
||||
text-align: left; background: none; border: none; cursor: pointer;
|
||||
padding: 8px 10px; border-radius: var(--radius); color: inherit;
|
||||
}
|
||||
.tsb-project:hover { background: var(--bg-hover); }
|
||||
.tsb-project.active { background: var(--bg-active); }
|
||||
.tsb-project-name { font-weight: 600; font-size: var(--fs-ui-sm); }
|
||||
.tsb-project-meta { color: var(--text-dim); font-size: var(--fs-ui-xs); }
|
||||
.tsb-tool {
|
||||
display: flex; align-items: center; gap: 8px; width: 100%;
|
||||
background: none; border: none; cursor: pointer; color: inherit;
|
||||
padding: 6px 10px; border-radius: var(--radius); font-size: var(--fs-ui-sm);
|
||||
}
|
||||
.tsb-tool:hover { background: var(--bg-hover); }
|
||||
.tsb-tool kbd { margin-left: auto; font-family: var(--mono); font-size: var(--fs-ui-xs); color: var(--text-faint); }
|
||||
.tsb-tool-note { color: var(--text-dim); font-size: var(--fs-ui-xs); padding: 2px 10px 8px; }
|
||||
.tsb-tool-badge {
|
||||
margin-left: 6px; min-width: 16px; padding: 0 5px; border-radius: var(--radius-full);
|
||||
background: var(--err-text); color: var(--text-on-semantic); font-size: var(--fs-ui-xs);
|
||||
}
|
||||
.rewind-row { margin-top: 8px; }
|
||||
.rewind-panel {
|
||||
margin-top: 8px; padding: 8px 10px;
|
||||
background: var(--bg-raised); border: 1px solid var(--border); border-radius: var(--radius-sm);
|
||||
font-size: var(--fs-ui-sm);
|
||||
}
|
||||
.rewind-panel ul { margin: 6px 0; padding-left: 1.2em; }
|
||||
.msg.is-excluded { opacity: 0.55; }
|
||||
.msg-tools { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; margin-top: 4px; }
|
||||
.session-note { width: 12rem; }
|
||||
.rewind-actions { display: flex; gap: 8px; }
|
||||
.rewind-error { color: var(--err-text); font-size: var(--fs-ui-sm); }
|
||||
|
||||
/* ---- U4 追溯审计工作区(令牌驱动;@ui/tokens.css 消费) ---- */
|
||||
.rdm-audit { display: flex; flex-direction: column; min-height: 300px; gap: 0; }
|
||||
.rdm-audit-header { display: flex; align-items: center; gap: 10px; padding: 0 0 10px; }
|
||||
.rdm-audit-project { max-width: 220px; height: 32px; font-size: var(--fs-ui-sm); }
|
||||
.rdm-audit-tabs { padding: 0 0 10px; }
|
||||
.rdm-audit-body { flex: 1; min-height: 0; overflow-y: auto; padding-top: 10px; }
|
||||
.rdm-audit-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); gap: 8px; margin-bottom: 12px; }
|
||||
.rdm-audit-card { background: var(--bg-panel); border: 1px solid var(--border); border-radius: var(--radius-sm); padding: 10px; text-align: center; }
|
||||
.rdm-audit-card-num { font-size: var(--fs-ui-xl); font-weight: 600; color: var(--text); }
|
||||
.rdm-audit-card-label { font-size: var(--fs-ui-xs); color: var(--text-dim); margin-top: 2px; }
|
||||
.rdm-audit-meta { font-size: var(--fs-ui-sm); color: var(--text-dim); margin-bottom: 8px; }
|
||||
.rdm-audit-materials { display: flex; gap: 0; min-height: 200px; }
|
||||
.rdm-audit-materials-side { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 10px; }
|
||||
.rdm-audit-tree { display: flex; gap: 14px; min-height: 200px; }
|
||||
.rdm-audit-tree-list { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
|
||||
.rdm-audit-tree-node { display: flex; align-items: center; gap: 8px; padding: 6px 10px; background: none; border: none; border-radius: var(--radius-sm); cursor: pointer; text-align: left; font-size: var(--fs-ui-sm); color: var(--text-dim); }
|
||||
.rdm-audit-tree-node:hover { background: var(--bg-hover); color: var(--text); }
|
||||
.rdm-audit-tree-node.sel { background: var(--bg-active); color: var(--text); }
|
||||
.rdm-audit-tree-caret { width: 14px; flex: none; color: var(--text-dim); font-size: var(--fs-ui-sm); }
|
||||
.rdm-audit-tree-children { padding-left: 18px; display: flex; flex-direction: column; gap: 0; }
|
||||
.rdm-audit-tree-kind { font-size: var(--fs-ui-xs); color: var(--text-faint); min-width: 3.2em; }
|
||||
.rdm-audit-tree-title { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
|
||||
.rdm-audit-more { margin-top: 8px; }
|
||||
.rdm-audit-truncated { font-size: var(--fs-ui-sm); color: var(--text-faint); padding: 6px 0; }
|
||||
.rdm-audit-detail { flex: 1; min-width: 0; border-left: 1px solid var(--border-soft); padding-left: 14px; }
|
||||
.rdm-audit-detail-body { display: flex; flex-direction: column; gap: 6px; font-size: var(--fs-ui-sm); }
|
||||
.rdm-audit-version { padding: 3px 0; color: var(--text-dim); }
|
||||
.rdm-audit-formal { margin-top: 8px; padding: 8px 10px; background: var(--ok-soft); border: 1px solid var(--ok-border); border-radius: var(--radius-sm); font-size: var(--fs-ui-sm); color: var(--ok-text); }
|
||||
.rdm-audit-pick { display: flex; flex-wrap: wrap; gap: 8px; }
|
||||
.rdm-audit-trace-head { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
|
||||
.rdm-audit-trace-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
|
||||
.rdm-audit-trace-col { min-width: 0; }
|
||||
.rdm-audit-rel { display: flex; align-items: center; gap: 6px; padding: 4px 0; font-size: var(--fs-ui-sm); }
|
||||
.rdm-audit-rel-type { color: var(--text-dim); }
|
||||
.rdm-audit-rel-endpoint { font-family: var(--mono); font-size: var(--fs-ui-xs); color: var(--text-faint); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
|
||||
.rdm-audit-timeline-filters { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; flex-wrap: wrap; }
|
||||
.rdm-audit-timeline-filters .ui-input { max-width: 160px; height: 30px; font-size: var(--fs-ui-sm); }
|
||||
.rdm-audit-seq { max-width: 100px; }
|
||||
.rdm-audit-opgroup { border: 1px solid var(--border-soft); border-radius: var(--radius-sm); margin-bottom: 4px; overflow: hidden; }
|
||||
.rdm-audit-opgroup-head { display: flex; align-items: center; gap: 8px; width: 100%; padding: 7px 10px; background: var(--bg-panel); border: none; cursor: pointer; font-size: var(--fs-ui-sm); color: var(--text-dim); text-align: left; }
|
||||
.rdm-audit-opgroup-head:hover { background: var(--bg-hover); }
|
||||
.rdm-audit-opgroup-actor { font-weight: 550; color: var(--text); }
|
||||
.rdm-audit-opgroup-time { font-size: var(--fs-ui-xs); color: var(--text-faint); }
|
||||
.rdm-audit-event { display: flex; align-items: center; gap: 8px; padding: 4px 10px; font-size: var(--fs-ui-sm); border-top: 1px solid var(--border-soft); }
|
||||
.rdm-audit-event-time { font-size: var(--fs-ui-xs); color: var(--text-faint); min-width: 5em; }
|
||||
.rdm-audit-event-op { font-family: var(--mono); font-size: var(--fs-ui-xs); color: var(--accent-text); min-width: 8em; }
|
||||
.rdm-audit-event-actor { color: var(--text-dim); min-width: 4em; }
|
||||
.rdm-audit-event-detail { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--text-dim); }
|
||||
.rdm-audit-coverage { margin-top: 12px; }
|
||||
.rdm-audit-export { margin-top: 16px; display: flex; flex-direction: column; gap: 8px; }
|
||||
.rdm-audit-export-row { display: flex; align-items: flex-end; gap: 8px; flex-wrap: wrap; }
|
||||
.rdm-audit-export-kind { display: flex; flex-direction: column; gap: 4px; font-size: var(--fs-ui-sm); color: var(--text-dim); }
|
||||
.rdm-audit-export-kind .ui-input { min-width: 180px; height: 32px; font-size: var(--fs-ui-sm); }
|
||||
.rdm-audit-export-draft { padding: 8px 10px; background: var(--bg-panel); border: 1px solid var(--border); border-radius: var(--radius-sm); font-size: var(--fs-ui-sm); color: var(--text); }
|
||||
.rdm-audit-export-draft p { margin: 0 0 8px; }
|
||||
.rdm-audit-export-result { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; font-size: var(--fs-ui-sm); color: var(--text-dim); }
|
||||
.rdm-audit-export-err { font-size: var(--fs-ui-sm); color: var(--err-text); }
|
||||
.rdm-audit-coverage-item { display: flex; align-items: center; gap: 8px; padding: 3px 0; font-size: var(--fs-ui-sm); color: var(--text-dim); }
|
||||
.rdm-audit-err { display: flex; flex-direction: column; gap: 8px; }
|
||||
.rdm-audit-err-toggle { font-size: var(--fs-ui-caption); color: var(--text-dim); }
|
||||
.rdm-audit-err-raw { display: block; font-family: var(--mono); font-size: var(--fs-code); color: var(--text-dim); background: var(--bg-inset); border-radius: var(--radius-sm); padding: 8px 12px; white-space: pre-wrap; word-break: break-all; }
|
||||
.duty-matrix-wrap { overflow: auto; }
|
||||
.duty-matrix .duty-sticky { position: sticky; left: 0; background: var(--bg-panel); z-index: 1; }
|
||||
.duty-matrix thead th { position: sticky; top: 0; background: var(--bg-panel); z-index: 2; }
|
||||
.duty-cell select { font-size: var(--fs-ui-sm); color: var(--text); background: var(--bg-raised); border: 1px solid var(--border); border-radius: var(--radius-sm); }
|
||||
|
||||
/* ---- 文档驾驶舱(I2;令牌驱动,词汇沿用 rdm-audit 卡片体系) ---- */
|
||||
.cockpit { display: flex; flex-direction: column; min-height: 320px; }
|
||||
.cockpit-header { display: flex; align-items: center; gap: 10px; padding: 0 0 10px; }
|
||||
.cockpit-project { max-width: 220px; height: 32px; font-size: var(--fs-ui-sm); }
|
||||
.cockpit-filter-chip, .cockpit-refresh { height: 28px; padding: 0 10px; font-size: var(--fs-ui-sm); border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--bg-panel); color: var(--text); cursor: pointer; }
|
||||
.cockpit-snap { margin-left: auto; font-size: var(--fs-ui-sm); color: var(--text-muted, var(--text)); }
|
||||
.cockpit-banner { border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--bg-panel); padding: 6px 10px; margin-bottom: 8px; font-size: var(--fs-ui-sm); }
|
||||
.cockpit-banner-err { border-color: var(--border); }
|
||||
.cockpit-stats { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 8px; margin-bottom: 12px; }
|
||||
.cockpit-stat { background: var(--bg-panel); border: 1px solid var(--border); border-radius: var(--radius-sm); padding: 8px 10px; text-align: center; font: inherit; }
|
||||
button.cockpit-stat { cursor: pointer; }
|
||||
.cockpit-stat-active { border-color: var(--text); }
|
||||
.cockpit-stat-unavail { color: var(--text-muted, var(--text)); }
|
||||
.cockpit-stat-num { display: block; font-size: var(--fs-ui-xl); font-weight: 600; color: var(--text); }
|
||||
.cockpit-stat-label { display: block; font-size: var(--fs-ui-sm); color: var(--text-muted, var(--text)); }
|
||||
.cockpit-columns { display: grid; grid-template-columns: minmax(220px, 300px) 1fr; gap: 14px; }
|
||||
.cockpit-tree { min-height: 0; overflow-y: auto; }
|
||||
.cockpit-tree-row { display: flex; align-items: center; gap: 6px; padding: 3px 4px; border-radius: var(--radius-sm); }
|
||||
.cockpit-tree-row-active { background: var(--bg-panel); }
|
||||
.cockpit-tree-caret { border: none; background: none; cursor: pointer; padding: 0 2px; font-size: var(--fs-ui-sm); color: var(--text); }
|
||||
.cockpit-tree-title { border: none; background: none; padding: 0; cursor: pointer; font-size: var(--fs-ui-sm); color: var(--text); text-align: left; }
|
||||
.cockpit-badge { font-size: var(--fs-ui-sm); border: 1px solid var(--border); border-radius: var(--radius-sm); padding: 0 4px; color: var(--text-muted, var(--text)); }
|
||||
.cockpit-tree-time { margin-left: auto; font-size: var(--fs-ui-sm); color: var(--text-muted, var(--text)); }
|
||||
.cockpit-tree-empty, .cockpit-tree-more { border: none; background: none; font-size: var(--fs-ui-sm); color: var(--text-muted, var(--text)); padding: 2px 4px; }
|
||||
button.cockpit-tree-more { cursor: pointer; text-decoration: underline; }
|
||||
.cockpit-truncated { font-size: var(--fs-ui-sm); color: var(--text-muted, var(--text)); padding: 4px 0; }
|
||||
.cockpit-center { min-height: 0; overflow-y: auto; }
|
||||
.cockpit-doclist { display: flex; flex-direction: column; gap: 6px; margin-bottom: 12px; }
|
||||
.cockpit-docrow { display: flex; align-items: baseline; gap: 10px; border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--bg-panel); padding: 8px 10px; cursor: pointer; font: inherit; text-align: left; }
|
||||
.cockpit-docrow-title { font-size: var(--fs-ui-base, var(--fs-ui-sm)); color: var(--text); }
|
||||
.cockpit-docrow-meta { font-size: var(--fs-ui-sm); color: var(--text-muted, var(--text)); }
|
||||
.cockpit-changes { display: flex; flex-direction: column; gap: 4px; }
|
||||
.cockpit-changerow { display: flex; justify-content: space-between; gap: 10px; font-size: var(--fs-ui-sm); }
|
||||
.cockpit-changesum { color: var(--text); }
|
||||
.cockpit-changetime { color: var(--text-muted, var(--text)); }
|
||||
.cockpit-nodehead { display: flex; align-items: baseline; gap: 10px; padding-bottom: 8px; }
|
||||
.cockpit-back { border: none; background: none; cursor: pointer; font-size: var(--fs-ui-sm); color: var(--text); padding: 0; text-decoration: underline; }
|
||||
.cockpit-nodetitle { font-size: var(--fs-ui-xl); font-weight: 600; color: var(--text); }
|
||||
.cockpit-nodesum { font-size: var(--fs-ui-sm); color: var(--text-muted, var(--text)); }
|
||||
.cockpit-childtable { width: 100%; border-collapse: collapse; font-size: var(--fs-ui-sm); }
|
||||
.cockpit-childtable th, .cockpit-childtable td { border-bottom: 1px solid var(--border); padding: 4px 6px; text-align: left; color: var(--text); }
|
||||
@media (max-width: 760px) { .cockpit-columns { grid-template-columns: 1fr; } .cockpit-tree { max-height: 40vh; } }
|
||||
|
||||
/* ---- 驾驶舱 I3:阅读器与右栏(令牌驱动) ---- */
|
||||
.cockpit-columns-3 { grid-template-columns: minmax(200px, 260px) 1fr minmax(240px, 300px); }
|
||||
.cockpit-right { min-height: 0; overflow-y: auto; border-left: 1px solid var(--border); padding-left: 12px; }
|
||||
.cockpit-viewtoggle { display: flex; gap: 0; }
|
||||
.cockpit-viewbtn { height: 28px; padding: 0 10px; font-size: var(--fs-ui-sm); border: 1px solid var(--border); background: var(--bg-panel); color: var(--text); cursor: pointer; }
|
||||
.cockpit-viewbtn-active { background: var(--text); color: var(--bg-panel); }
|
||||
.cockpit-reader-para { white-space: pre-wrap; font-size: var(--fs-ui-base, var(--fs-ui-sm)); line-height: 1.6; color: var(--text); margin: 6px 0; }
|
||||
.cockpit-density-full .cockpit-reader-para { line-height: 1.9; margin: 10px 0; }
|
||||
.cockpit-reader-section { border-top: 1px solid var(--border); padding: 8px 0; }
|
||||
.cockpit-reader-sechead { display: flex; align-items: baseline; gap: 8px; }
|
||||
.cockpit-reader-sectitle { font-weight: 600; color: var(--text); font-size: var(--fs-ui-base, var(--fs-ui-sm)); }
|
||||
.cockpit-versions { font-size: var(--fs-ui-sm); }
|
||||
.cockpit-density-full .cockpit-versions { line-height: 1.7; }
|
||||
.cockpit-versions-toggle { font-size: var(--fs-ui-sm); color: var(--text); text-decoration: underline; cursor: pointer; }
|
||||
.cockpit-versions-head { color: var(--text-muted, var(--text)); padding: 4px 0; }
|
||||
.cockpit-diff { white-space: pre-wrap; border: 1px solid var(--border); border-radius: var(--radius-sm); padding: 6px 8px; font-size: var(--fs-ui-sm); }
|
||||
.cockpit-diff-add { color: var(--text); }
|
||||
.cockpit-diff-del { color: var(--text-muted, var(--text)); text-decoration: line-through; }
|
||||
.cockpit-diff-same { color: var(--text-muted, var(--text)); }
|
||||
.cockpit-panel-tabs { display: flex; gap: 4px; padding-bottom: 8px; }
|
||||
.cockpit-panel-tab { border: 1px solid var(--border); background: none; padding: 3px 8px; font-size: var(--fs-ui-sm); color: var(--text); cursor: pointer; border-radius: var(--radius-sm); }
|
||||
.cockpit-panel-tab-active { background: var(--bg-panel); border-color: var(--text); }
|
||||
.cockpit-panel-body { display: flex; flex-direction: column; gap: 6px; }
|
||||
.cockpit-panel-count { font-size: var(--fs-ui-sm); color: var(--text-muted, var(--text)); }
|
||||
.cockpit-panel-row { display: flex; flex-wrap: wrap; gap: 6px; align-items: baseline; font-size: var(--fs-ui-sm); border-top: 1px solid var(--border); padding: 4px 0; }
|
||||
.cockpit-panel-kind { color: var(--text-muted, var(--text)); }
|
||||
.cockpit-panel-label { color: var(--text); }
|
||||
.cockpit-panel-conflict { flex-direction: column; }
|
||||
.cockpit-conflict-side { color: var(--text); }
|
||||
|
||||
@@ -0,0 +1,175 @@
|
||||
import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
|
||||
import * as apiModule from './api'
|
||||
import { api } from './api'
|
||||
import { store } from './store'
|
||||
import { previewTabsKey } from './previewtabs'
|
||||
import type { StreamEvent, SurfaceMeta, SurfaceSnapshot } from './contracts'
|
||||
|
||||
// U4/R5:surface.updated 投影的 revision 守卫——旧修订/重复事件不得覆盖新修订;
|
||||
// 服务端快照是唯一权威(KTD8 单一状态所有者)。
|
||||
|
||||
function surfEvent(seq: number, surfaceId: string, revision: number, title: string, conversationId = 'c1'): StreamEvent<SurfaceSnapshot> {
|
||||
return {
|
||||
seq, conversationId, ts: new Date().toISOString(), v: 1, type: 'surface.updated',
|
||||
payload: {
|
||||
identity: { surfaceId, owner: 'alice', pluginId: 'generative-ui', conversationId: 'c1' },
|
||||
compat: { schemaVersion: 1, catalogVersion: 'ui-v1' },
|
||||
revision, activationEpoch: 1,
|
||||
spec: { title, nodes: [{ type: 'markdown', id: 'n1', markdown: 'x' }] },
|
||||
},
|
||||
}
|
||||
}
|
||||
|
||||
beforeEach(async () => {
|
||||
vi.spyOn(api, 'projectSurfaces').mockResolvedValue([])
|
||||
vi.spyOn(api, 'surfaceList').mockResolvedValue([])
|
||||
vi.spyOn(api, 'conversationDetail').mockImplementation(async id => ({
|
||||
conversation: { id, projectId: 'p1', title: id, createdAt: '', updatedAt: '' },
|
||||
messages: [], runs: [], activeHitl: [], lastSeq: 0,
|
||||
}))
|
||||
vi.spyOn(api, 'getPlan').mockResolvedValue(null)
|
||||
vi.spyOn(api, 'getTodos').mockResolvedValue(null)
|
||||
vi.spyOn(api, 'listCards').mockResolvedValue([])
|
||||
vi.spyOn(api, 'listTasks').mockResolvedValue([])
|
||||
vi.spyOn(apiModule, 'connectEvents').mockReturnValue({ close: () => {} })
|
||||
await store.openConversation('c1')
|
||||
for (const tab of store.getState().previewTabs.c1 ?? []) store.closePreview(tab.id)
|
||||
store.setUI({ rightTab: 'work', rightCollapsed: true, filesView: 'list' })
|
||||
})
|
||||
afterEach(() => vi.restoreAllMocks())
|
||||
|
||||
describe('surface.updated projection', () => {
|
||||
it('新事件入库;旧修订与重复事件不覆盖', () => {
|
||||
store.applyEvent(surfEvent(1, 's1', 1, '初版'))
|
||||
store.applyEvent(surfEvent(2, 's1', 2, '修订二'))
|
||||
store.applyEvent(surfEvent(3, 's1', 1, '迟到的旧修订'))
|
||||
store.applyEvent(surfEvent(4, 's1', 2, '重复事件'))
|
||||
const list = store.getState().surfaces
|
||||
expect(list).toHaveLength(1)
|
||||
expect(list[0].revision).toBe(2)
|
||||
expect(list[0].spec.title).toBe('修订二')
|
||||
})
|
||||
|
||||
it('多页面并存,互不覆盖', () => {
|
||||
store.applyEvent(surfEvent(1, 's1', 1, '页面一'))
|
||||
store.applyEvent(surfEvent(5, 's2', 1, '页面二'))
|
||||
const list = store.getState().surfaces
|
||||
expect(list.filter(x => String(x.identity.surfaceId) === 's1')).toHaveLength(1)
|
||||
expect(list.filter(x => String(x.identity.surfaceId) === 's2')).toHaveLength(1)
|
||||
})
|
||||
})
|
||||
|
||||
|
||||
describe('surface.updated 可见性联动', () => {
|
||||
it('keeps new background pages available without opening the file pane', () => {
|
||||
store.applyEvent(surfEvent(101, 'sv1', 1, '可见性页'))
|
||||
const ui = store.getState().ui
|
||||
expect(ui.rightTab).toBe('work')
|
||||
expect(ui.rightCollapsed).toBe(true)
|
||||
expect(ui.filesView).toBe('list')
|
||||
const tabs = store.getState().previewTabs[previewTabsKey(store.getState().currentConvId)] ?? []
|
||||
expect(tabs.some(t => t.id === 'surface:sv1')).toBe(false)
|
||||
store.openSurface('sv1')
|
||||
expect(store.getState().ui.rightTab).toBe('files')
|
||||
expect(store.getState().previewActive.c1).toBe('surface:sv1')
|
||||
})
|
||||
|
||||
it('抑制开标签时留 toast 痕迹', () => {
|
||||
// 预置:已有 surface 标签但 active 是别的工件标签 → 新页面不开标签
|
||||
store.applyEvent(surfEvent(102, 'sv2', 1, '第二页'))
|
||||
// sv2 已入 surfaces 数组(事件投影),标签未强开——至少状态一致
|
||||
expect(store.getState().surfaces.some(x => String(x.identity.surfaceId) === 'sv2')).toBe(true)
|
||||
})
|
||||
})
|
||||
|
||||
describe('U6 工作区任务页', () => {
|
||||
it('pin 固定后新页面事件不改变固定对象;取消后跟随最新', () => {
|
||||
store.setUI({ workspaceSurfacePin: null })
|
||||
store.applyEvent(surfEvent(201, 'w1', 1, '第一页'))
|
||||
const first = store.getState().ui.workspaceSurfacePin
|
||||
expect(first).toBeNull() // 默认跟随(不自动 pin)
|
||||
// 用户固定 w1
|
||||
store.setUI({ workspaceSurfacePin: 'w1' })
|
||||
store.applyEvent(surfEvent(202, 'w2', 1, '第二页'))
|
||||
// pin 不变,且 surfaces 数组两页并存(禁用回退时容器随空数组自然消失)
|
||||
expect(store.getState().ui.workspaceSurfacePin).toBe('w1')
|
||||
const w2 = store.getState().surfaces.find(x => String(x.identity.surfaceId) === 'w2')
|
||||
expect(w2?.spec.title).toBe('第二页')
|
||||
store.setUI({ workspaceSurfacePin: null })
|
||||
expect(store.getState().ui.workspaceSurfacePin).toBeNull()
|
||||
})
|
||||
})
|
||||
|
||||
describe('saved surfaces on conversation reload', () => {
|
||||
const snapshot = (id: string, revision = 1) => surfEvent(1, id, revision, id).payload!
|
||||
const meta = (id: string): SurfaceMeta => ({
|
||||
surfaceId: id, title: id, pluginId: 'generative-ui', revision: 1,
|
||||
conversationId: 'c1', updatedAt: '2026-10-12T00:00:00Z',
|
||||
})
|
||||
|
||||
beforeEach(() => {
|
||||
vi.spyOn(api, 'projectSurfaces').mockResolvedValue([])
|
||||
vi.spyOn(api, 'surfaceList').mockResolvedValue([])
|
||||
vi.spyOn(api, 'surfaceGet').mockImplementation(async id => snapshot(id))
|
||||
vi.spyOn(api, 'conversationDetail').mockImplementation(async id => ({
|
||||
conversation: { id, projectId: 'p1', title: id, createdAt: '', updatedAt: '' },
|
||||
messages: [], runs: [], activeHitl: [], lastSeq: 0,
|
||||
}))
|
||||
vi.spyOn(api, 'getPlan').mockResolvedValue(null)
|
||||
vi.spyOn(api, 'getTodos').mockResolvedValue(null)
|
||||
vi.spyOn(api, 'listCards').mockResolvedValue([])
|
||||
vi.spyOn(api, 'listTasks').mockResolvedValue([])
|
||||
vi.spyOn(apiModule, 'connectEvents').mockReturnValue({ close: () => {} })
|
||||
store.setUI({ workspaceSurfacePin: null })
|
||||
const key = previewTabsKey(store.getState().currentConvId)
|
||||
for (const tab of store.getState().previewTabs[key] ?? []) store.closePreview(tab.id)
|
||||
})
|
||||
|
||||
afterEach(() => vi.restoreAllMocks())
|
||||
|
||||
it('hydrates the metadata directory before exposing two renderable snapshots', async () => {
|
||||
vi.mocked(api.surfaceList).mockResolvedValue([meta('reload-1'), meta('reload-2')])
|
||||
await store.openConversation('reload')
|
||||
await vi.waitFor(() => {
|
||||
expect(store.getState().surfaces).toEqual([snapshot('reload-1'), snapshot('reload-2')])
|
||||
})
|
||||
expect(api.surfaceGet).toHaveBeenCalledWith('reload-1')
|
||||
expect(api.surfaceGet).toHaveBeenCalledWith('reload-2')
|
||||
expect(store.getState().previewActive.reload).toBe('surface:reload-1')
|
||||
})
|
||||
|
||||
it('isolates one unavailable page while restoring the remaining page', async () => {
|
||||
vi.mocked(api.surfaceList).mockResolvedValue([meta('missing'), meta('available')])
|
||||
vi.mocked(api.surfaceGet).mockImplementation(async id => {
|
||||
if (id === 'missing') throw new Error('404: removed page')
|
||||
return snapshot(id)
|
||||
})
|
||||
await store.openConversation('partial')
|
||||
await vi.waitFor(() => expect(store.getState().surfaces).toEqual([snapshot('available')]))
|
||||
})
|
||||
|
||||
it('keeps a newer live revision when an older snapshot arrives late', async () => {
|
||||
let resolve!: (value: SurfaceSnapshot) => void
|
||||
vi.mocked(api.surfaceList).mockResolvedValue([meta('racing')])
|
||||
vi.mocked(api.surfaceGet).mockReturnValue(new Promise<SurfaceSnapshot>(r => { resolve = r }))
|
||||
await store.openConversation('race')
|
||||
store.applyEvent(surfEvent(301, 'racing', 2, 'live revision', 'race'))
|
||||
resolve(snapshot('racing', 1))
|
||||
await new Promise<void>(r => setTimeout(r, 0))
|
||||
expect(store.getState().surfaces).toHaveLength(1)
|
||||
expect(store.getState().surfaces[0].revision).toBe(2)
|
||||
expect(store.getState().surfaces[0].spec.title).toBe('live revision')
|
||||
})
|
||||
|
||||
it('discards hydration from the previous conversation after switching', async () => {
|
||||
let resolve!: (value: SurfaceSnapshot) => void
|
||||
vi.mocked(api.surfaceList).mockResolvedValueOnce([meta('previous')]).mockResolvedValue([])
|
||||
vi.mocked(api.surfaceGet).mockReturnValue(new Promise<SurfaceSnapshot>(r => { resolve = r }))
|
||||
await store.openConversation('previous-conv')
|
||||
await store.openConversation('current-conv')
|
||||
resolve(snapshot('previous'))
|
||||
await new Promise<void>(r => setTimeout(r, 0))
|
||||
expect(store.getState().currentConvId).toBe('current-conv')
|
||||
expect(store.getState().surfaces).toEqual([])
|
||||
})
|
||||
})
|
||||
@@ -0,0 +1,19 @@
|
||||
// surface 投影可能短暂混入无 identity 的条目;读 id 一律经此助手,避免渲染崩溃。
|
||||
import type { SurfaceSnapshot } from './contracts'
|
||||
|
||||
export function surfaceKey(x: { identity?: { surfaceId?: unknown } } | null | undefined): string | null {
|
||||
const id = x?.identity?.surfaceId
|
||||
return id == null || id === '' ? null : String(id)
|
||||
}
|
||||
|
||||
/** 按 surfaceId 合并;同 id 取 revision 较大者。跳过无 identity 的脏项。 */
|
||||
export function mergeSurfacesByRevision(a: SurfaceSnapshot[], b: SurfaceSnapshot[]): SurfaceSnapshot[] {
|
||||
const byId = new Map<string, SurfaceSnapshot>()
|
||||
for (const s of [...a, ...b]) {
|
||||
const id = surfaceKey(s)
|
||||
if (!id) continue
|
||||
const existing = byId.get(id)
|
||||
if (!existing || (s.revision ?? 0) >= (existing.revision ?? 0)) byId.set(id, s)
|
||||
}
|
||||
return [...byId.values()]
|
||||
}
|
||||
@@ -0,0 +1,26 @@
|
||||
import { describe, expect, it } from 'vitest'
|
||||
|
||||
// U5 验收线第 4/6 条的客户端半边:请求构造只携带显式动作数据(未提交草稿
|
||||
// 无任何自动上传路径——构造函数是纯函数,测试其形状);requestId 每次唯一。
|
||||
|
||||
function buildActionRequest(snapshot: { revision: number }, actionId: string, drafts: Record<string, unknown>) {
|
||||
const requestId = (crypto.randomUUID ? crypto.randomUUID() : 'req-' + Date.now())
|
||||
return {
|
||||
actionId,
|
||||
revision: snapshot.revision,
|
||||
requestId,
|
||||
data: drafts,
|
||||
}
|
||||
}
|
||||
|
||||
describe('surface action request', () => {
|
||||
it('携带当前修订与显式草稿;requestId 唯一', () => {
|
||||
const snap = { revision: 3 }
|
||||
const a = buildActionRequest(snap, 'generative-ui.submit', { f1: { years: '5' } })
|
||||
const b = buildActionRequest(snap, 'generative-ui.submit', { f1: { years: '5' } })
|
||||
expect(a.revision).toBe(3)
|
||||
expect(a.actionId).toBe('generative-ui.submit')
|
||||
expect(a.data).toEqual({ f1: { years: '5' } })
|
||||
expect(a.requestId).not.toBe(b.requestId)
|
||||
})
|
||||
})
|
||||
@@ -0,0 +1,13 @@
|
||||
// 主题选择:深色 / 浅色 / 墨绿直接上屏;跟随系统只在深色与浅色之间解析。
|
||||
export type ThemeChoice = 'dark' | 'light' | 'molv' | 'system'
|
||||
export type PaintedTheme = 'dark' | 'light' | 'molv'
|
||||
|
||||
export function resolveTheme(choice: string, prefersDark: boolean): PaintedTheme {
|
||||
if (choice === 'system') return prefersDark ? 'dark' : 'light'
|
||||
if (choice === 'light' || choice === 'molv') return choice
|
||||
return 'dark'
|
||||
}
|
||||
|
||||
export function isThemeChoice(value: string): value is ThemeChoice {
|
||||
return value === 'dark' || value === 'light' || value === 'molv' || value === 'system'
|
||||
}
|
||||
+55
-12
@@ -37,6 +37,14 @@ function argOf(raw: string | undefined, keys: string[]): string {
|
||||
return ''
|
||||
}
|
||||
|
||||
/** 编写时看脚本尾部,运行后有输出则改看输出尾部。 */
|
||||
export function toolTail(args?: string, output?: string): string {
|
||||
const script = argOf(args, ['script', 'command', 'cmd'])
|
||||
const body = (output && output.trim()) ? output : (script || args || '')
|
||||
const lines = body.split('\n').filter((line, i, all) => line.trim() || i === all.length - 1)
|
||||
return lines.slice(-6).join('\n')
|
||||
}
|
||||
|
||||
function firstLine(s: string): string {
|
||||
const line = s.split('\n').map(x => x.trim()).find(Boolean) ?? ''
|
||||
return line.length > 80 ? `${line.slice(0, 80)}…` : line
|
||||
@@ -79,8 +87,13 @@ export function toolGroupLabel(kind: ToolKind, count: number, running: boolean):
|
||||
}
|
||||
|
||||
export interface ToolGroupItem {
|
||||
id: string
|
||||
name: string
|
||||
headline: string
|
||||
arguments?: string
|
||||
output?: string
|
||||
phase?: 'composing' | 'running' | 'done'
|
||||
durationMs?: number
|
||||
status?: 'ok' | 'error'
|
||||
summary?: string
|
||||
running: boolean
|
||||
@@ -90,8 +103,35 @@ export type TimelineEntry =
|
||||
| { kind: 'thinking'; text: string; durationMs?: number; active: boolean }
|
||||
| { kind: 'text'; text: string }
|
||||
| { kind: 'tools'; toolKind: ToolKind; items: ToolGroupItem[] }
|
||||
| { kind: 'toolblock'; toolKind: ToolKind; item: ToolGroupItem }
|
||||
| { kind: 'check'; passed: boolean; reason: string }
|
||||
| { kind: 'other'; part: Part }
|
||||
|
||||
const SOLO: ReadonlySet<ToolKind> = new Set(['exec', 'write', 'delegate'])
|
||||
|
||||
interface ToolFace {
|
||||
toolPhase?: 'composing' | 'running' | 'done'
|
||||
toolOutput?: string
|
||||
}
|
||||
|
||||
function toolItem(call: Part, res: Part | undefined, live: boolean): ToolGroupItem {
|
||||
const face = call as Part & ToolFace
|
||||
const status = res?.toolResult?.status
|
||||
const phase = face.toolPhase ?? (live && !res ? 'running' : res ? 'done' : undefined)
|
||||
return {
|
||||
id: call.toolCall?.id || call.toolCall?.name || 'tool',
|
||||
name: call.toolCall?.name ?? '工具',
|
||||
headline: toolHeadline(call.toolCall?.name ?? '', call.toolCall?.arguments),
|
||||
arguments: call.toolCall?.arguments,
|
||||
output: face.toolOutput,
|
||||
phase,
|
||||
durationMs: call.toolCall?.durationMs,
|
||||
status: status === 'ok' || status === 'error' ? status : undefined,
|
||||
summary: res?.toolResult?.summary,
|
||||
running: phase === 'composing' || phase === 'running',
|
||||
}
|
||||
}
|
||||
|
||||
/** 把时间线部件收成行:相邻同类工具合并,思考是否仍在进行由 live 与后续部件决定。 */
|
||||
export function timelineEntries(parts: Part[], live: boolean): TimelineEntry[] {
|
||||
const out: TimelineEntry[] = []
|
||||
@@ -100,23 +140,21 @@ export function timelineEntries(parts: Part[], live: boolean): TimelineEntry[] {
|
||||
const p = parts[i]
|
||||
if (p.type === 'tool_call') {
|
||||
const kind = toolKind(p.toolCall?.name ?? '')
|
||||
if (SOLO.has(kind)) {
|
||||
const call = parts[i]
|
||||
i++
|
||||
let res: Part | undefined
|
||||
if (parts[i]?.type === 'tool_result') { res = parts[i]; i++ }
|
||||
out.push({ kind: 'toolblock', toolKind: kind, item: toolItem(call, res, live) })
|
||||
continue
|
||||
}
|
||||
const items: ToolGroupItem[] = []
|
||||
while (i < parts.length && parts[i].type === 'tool_call' && toolKind(parts[i].toolCall?.name ?? '') === kind) {
|
||||
const call = parts[i]
|
||||
i++
|
||||
let res: Part | undefined
|
||||
if (parts[i]?.type === 'tool_result') {
|
||||
res = parts[i]
|
||||
i++
|
||||
}
|
||||
const status = res?.toolResult?.status
|
||||
items.push({
|
||||
name: call.toolCall?.name ?? '工具',
|
||||
headline: toolHeadline(call.toolCall?.name ?? '', call.toolCall?.arguments),
|
||||
status: status === 'ok' || status === 'error' ? status : undefined,
|
||||
summary: res?.toolResult?.summary,
|
||||
running: live && !res,
|
||||
})
|
||||
if (parts[i]?.type === 'tool_result') { res = parts[i]; i++ }
|
||||
items.push(toolItem(call, res, live))
|
||||
}
|
||||
out.push({ kind: 'tools', toolKind: kind, items })
|
||||
continue
|
||||
@@ -132,6 +170,11 @@ export function timelineEntries(parts: Part[], live: boolean): TimelineEntry[] {
|
||||
i++
|
||||
continue
|
||||
}
|
||||
if (p.type === 'check') {
|
||||
out.push({ kind: 'check', passed: !!p.check?.passed, reason: p.check?.reason ?? '' })
|
||||
i++
|
||||
continue
|
||||
}
|
||||
out.push({ kind: 'other', part: p })
|
||||
i++
|
||||
}
|
||||
|
||||
@@ -0,0 +1,69 @@
|
||||
export interface WorkbenchLayoutOptions {
|
||||
width: number
|
||||
contextOpen: boolean
|
||||
leftCollapsed: boolean
|
||||
rightCollapsed: boolean
|
||||
leftWidth: number
|
||||
rightWidth: number
|
||||
previewWidth: number
|
||||
rightTab: 'work' | 'files'
|
||||
filesView: 'list' | 'preview'
|
||||
previewOpen: boolean
|
||||
previewExpanded: boolean
|
||||
}
|
||||
|
||||
export type WorkbenchPane = 'context' | 'conversation' | 'work' | 'files'
|
||||
const COMPACT_WORKBENCH_WIDTH = 1024
|
||||
|
||||
function boundedWidth(value: number, fallback: number, min: number, max: number) {
|
||||
return Math.min(max, Math.max(min, Number.isFinite(value) ? value : fallback))
|
||||
}
|
||||
|
||||
// Only the rendered widths are bounded. Saved desktop preferences stay in the store.
|
||||
export function selectWorkbenchLayout(options: WorkbenchLayoutOptions) {
|
||||
const width = Number.isFinite(options.width) ? Math.max(0, options.width) : 1440
|
||||
const available = Math.max(0, width - 8)
|
||||
const compact = width < COMPACT_WORKBENCH_WIDTH
|
||||
const filesWide = options.rightTab === 'files' && options.filesView === 'preview' && options.previewOpen
|
||||
const previewExpanded = filesWide && options.previewExpanded && !options.rightCollapsed
|
||||
if (compact) {
|
||||
const pane: WorkbenchPane = options.contextOpen ? 'context' : options.rightCollapsed ? 'conversation' : options.rightTab
|
||||
return {
|
||||
compact, pane, showContext: pane === 'context', showConversation: pane === 'conversation',
|
||||
showRight: pane === 'work' || pane === 'files', contextCollapsed: false, previewExpanded,
|
||||
leftWidth: pane === 'context' ? available : 0,
|
||||
rightWidth: pane === 'work' || pane === 'files' ? available : 0,
|
||||
leftDivider: false, rightDivider: false,
|
||||
}
|
||||
}
|
||||
|
||||
const showRight = !options.rightCollapsed
|
||||
const leftDivider = !options.leftCollapsed
|
||||
const rightDivider = showRight && !previewExpanded
|
||||
const panelCount = 1 + Number(!previewExpanded) + Number(showRight)
|
||||
const gutters = (panelCount - 1) * 4 + (Number(leftDivider) + Number(rightDivider)) * 8
|
||||
const leftMin = options.leftCollapsed ? 52 : 220
|
||||
const rightMin = showRight ? filesWide ? 420 : 280 : 0
|
||||
let leftWidth = options.leftCollapsed ? 52 : boundedWidth(options.leftWidth, 260, leftMin, 420)
|
||||
let rightWidth = showRight
|
||||
? filesWide ? boundedWidth(options.previewWidth, 700, rightMin, 1100) : boundedWidth(options.rightWidth, 360, rightMin, 560)
|
||||
: 0
|
||||
if (previewExpanded) rightWidth = available - gutters - leftWidth
|
||||
else {
|
||||
const conversationMin = filesWide && showRight ? 320 : 360
|
||||
const budget = available - gutters - conversationMin
|
||||
if (leftWidth + rightWidth > budget) {
|
||||
const extraLeft = leftWidth - leftMin
|
||||
const extraRight = rightWidth - rightMin
|
||||
const ratio = Math.max(0, budget - leftMin - rightMin) / (extraLeft + extraRight || 1)
|
||||
leftWidth = leftMin + Math.floor(extraLeft * ratio)
|
||||
rightWidth = rightMin + Math.floor(extraRight * ratio)
|
||||
}
|
||||
}
|
||||
const pane: WorkbenchPane = previewExpanded ? 'files' : 'conversation'
|
||||
return {
|
||||
compact, pane,
|
||||
showContext: true, showConversation: !previewExpanded, showRight, contextCollapsed: options.leftCollapsed,
|
||||
previewExpanded, leftWidth, rightWidth, leftDivider, rightDivider,
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,131 @@
|
||||
// 体系工具排位:服务端声明的工作区对所有用户可见,按 shortcut 数字占位;
|
||||
// 内置「代理」补进空位。文件浏览在第三栏「文件」入口(方案:入口收敛),不再占体系工具位。
|
||||
// 插件管理面板不进这条清单。
|
||||
// 2026-10-12 增量 2(审计入口能力门控):「追溯审计」不再无条件内置——普通基座
|
||||
// 没有任何 rdm.inspect.* 命令,入口可达而进入即 400。仅当命令面探测通过
|
||||
//(rdmAuditReady / store.rdmAuditAvailable)才纳入;代理仍无条件以 ⌘1 补位。
|
||||
|
||||
export interface WorkspaceEntry {
|
||||
key: string
|
||||
title: string
|
||||
icon: string
|
||||
shortcut: string
|
||||
}
|
||||
|
||||
export interface WorkspaceSource {
|
||||
id: string
|
||||
title: string
|
||||
icon?: string
|
||||
shortcut?: string
|
||||
}
|
||||
|
||||
/** 审计工作区消费的全部 rdm.inspect.* 命令(capabilities 入口 + 四页签取数)。 */
|
||||
export const RDM_AUDIT_COMMANDS = [
|
||||
'rdm.inspect.capabilities',
|
||||
'rdm.inspect.summary',
|
||||
'rdm.inspect.tree',
|
||||
'rdm.inspect.object',
|
||||
'rdm.inspect.relations',
|
||||
'rdm.inspect.events',
|
||||
'rdm.inspect.history',
|
||||
] as const
|
||||
|
||||
/** 概览页导出区单独探测。不并入上面的七命令就绪门。 */
|
||||
export const RDM_EXPORT_COMMANDS = [
|
||||
'rdm.inspect.export.create',
|
||||
'rdm.inspect.export.status',
|
||||
'rdm.inspect.export.download',
|
||||
] as const
|
||||
|
||||
/** 三条导出命令都启用才显示概览导出区。缺一或清单不可用则隐藏。 */
|
||||
export function rdmExportReady(cmds: { id?: string; enabled?: boolean }[] | null | undefined): boolean {
|
||||
if (!Array.isArray(cmds)) return false
|
||||
return RDM_EXPORT_COMMANDS.every(need => cmds.some(c => c?.id === need && c.enabled === true))
|
||||
}
|
||||
|
||||
/** 正式报告被完整性门拒绝时,界面先确认再带 draft 重试。 */
|
||||
export function exportNeedsDraft(message: string): boolean {
|
||||
return /不完整|草稿/.test(message)
|
||||
}
|
||||
|
||||
/** GET /api/commands 清单是否足以支撑审计工作区:七命令齐备且 enabled。清单不可用(未登录/请求失败)视为未就绪。 */
|
||||
export function rdmAuditReady(cmds: { id?: string; enabled?: boolean }[] | null | undefined): boolean {
|
||||
if (!Array.isArray(cmds)) return false
|
||||
return RDM_AUDIT_COMMANDS.every(need => cmds.some(c => c?.id === need && c.enabled === true))
|
||||
}
|
||||
|
||||
/** 文档驾驶舱消费的全部 rdm.cockpit.* 命令(I1 只读面;rollout I2)。 */
|
||||
export const COCKPIT_COMMANDS = [
|
||||
'rdm.cockpit.overview',
|
||||
'rdm.cockpit.tree',
|
||||
'rdm.cockpit.node',
|
||||
'rdm.cockpit.node.sources',
|
||||
'rdm.cockpit.node.history',
|
||||
'rdm.cockpit.node.impacts',
|
||||
'rdm.cockpit.node.conflicts',
|
||||
] as const
|
||||
|
||||
/** 七命令齐备且 enabled 才展示驾驶舱入口(与 rdmAuditReady 同源语义)。 */
|
||||
export function cockpitReady(cmds: { id?: string; enabled?: boolean }[] | null | undefined): boolean {
|
||||
if (!Array.isArray(cmds)) return false
|
||||
return COCKPIT_COMMANDS.every(need => cmds.some(c => c?.id === need && c.enabled === true))
|
||||
}
|
||||
|
||||
const BUILTINS: Omit<WorkspaceEntry, 'shortcut'>[] = [
|
||||
{ key: 'agents', title: '代理', icon: '🤖' },
|
||||
{ key: 'rdm-audit', title: '追溯审计', icon: '🔍' },
|
||||
{ key: 'rdm-cockpit', title: '文档驾驶舱', icon: '📋' },
|
||||
]
|
||||
|
||||
function shortcutNum(raw?: string): number | null {
|
||||
if (!raw) return null
|
||||
const m = raw.match(/(\d)/)
|
||||
if (!m) return null
|
||||
const n = Number(m[1])
|
||||
return n >= 1 && n <= 9 ? n : null
|
||||
}
|
||||
|
||||
interface BuildWorkspaceOptions {
|
||||
/** rdm.inspect.* 命令面探测通过(store.rdmAuditAvailable)。默认 false:能力未知/缺失不展示审计入口。 */
|
||||
rdmAudit?: boolean
|
||||
/** rdm.cockpit.* 命令面探测通过(store.rdmCockpitAvailable)。默认 false:能力未知/缺失不展示驾驶舱入口。 */
|
||||
rdmCockpit?: boolean
|
||||
}
|
||||
|
||||
export function buildWorkspaceEntries(server: WorkspaceSource[], opts: BuildWorkspaceOptions = {}): WorkspaceEntry[] {
|
||||
const used = new Set<number>()
|
||||
const ranked: { rank: number; entry: Omit<WorkspaceEntry, 'shortcut'> }[] = []
|
||||
const unranked: Omit<WorkspaceEntry, 'shortcut'>[] = []
|
||||
for (const w of server) {
|
||||
const entry = { key: `ws:${w.id}`, title: w.title, icon: w.icon || '🗂' }
|
||||
const n = shortcutNum(w.shortcut)
|
||||
if (n && !used.has(n)) {
|
||||
used.add(n)
|
||||
ranked.push({ rank: n, entry })
|
||||
} else {
|
||||
unranked.push(entry)
|
||||
}
|
||||
}
|
||||
const takeFree = (prefer: number): number => {
|
||||
if (!used.has(prefer) && prefer >= 1 && prefer <= 9) {
|
||||
used.add(prefer)
|
||||
return prefer
|
||||
}
|
||||
for (let n = 1; n <= 9; n++) {
|
||||
if (!used.has(n)) {
|
||||
used.add(n)
|
||||
return n
|
||||
}
|
||||
}
|
||||
return 99
|
||||
}
|
||||
ranked.push({ rank: takeFree(1), entry: BUILTINS[0] })
|
||||
if (opts.rdmAudit === true) ranked.push({ rank: takeFree(2), entry: BUILTINS[1] })
|
||||
if (opts.rdmCockpit === true) ranked.push({ rank: takeFree(3), entry: BUILTINS[2] })
|
||||
for (const entry of unranked) ranked.push({ rank: takeFree(9), entry })
|
||||
return ranked
|
||||
.filter(item => item.rank <= 9)
|
||||
.sort((a, b) => a.rank - b.rank)
|
||||
.slice(0, 9)
|
||||
.map((item, i) => ({ ...item.entry, shortcut: `⌘${i + 1}` }))
|
||||
}
|
||||
@@ -40,4 +40,15 @@ describe('auth 凭证模块', () => {
|
||||
expect(auth.apiKey()).toBe('')
|
||||
expect(auth.withKey('/x')).toBe('/x')
|
||||
})
|
||||
|
||||
it('beginSession:密码会话生效后清残留 Bearer,fetch 不再带头', async () => {
|
||||
auth.setKey('ask_stale')
|
||||
auth.beginSession()
|
||||
expect(auth.apiKey()).toBe('')
|
||||
const spy = vi.fn().mockResolvedValue(new Response('{}'))
|
||||
vi.stubGlobal('fetch', spy)
|
||||
await auth.fetch('/api/me')
|
||||
const [, init] = spy.mock.calls[0] as [string, RequestInit | undefined]
|
||||
expect(new Headers(init?.headers ?? {}).get('Authorization')).toBeNull()
|
||||
})
|
||||
})
|
||||
|
||||
@@ -0,0 +1,331 @@
|
||||
import { beforeEach, describe, expect, it, vi } from 'vitest'
|
||||
import { createElement } from 'react'
|
||||
import { renderToStaticMarkup } from 'react-dom/server'
|
||||
import { setPersistedOpen } from '@ui'
|
||||
import type { ActivityCard, HITLCard, Message } from '../src/contracts'
|
||||
import { Conversation } from '../src/components/Conversation'
|
||||
import { ConversationWork } from '../src/components/ConversationWork'
|
||||
import { ProcessTimeline } from '../src/components/ProcessTimeline'
|
||||
import { store, type LiveState } from '../src/store'
|
||||
|
||||
// SSR has no browser subscription snapshot. Keep the production store/actions and
|
||||
// real UI renderers; substitute only the hook boundary with a complete snapshot.
|
||||
const snapshot = vi.hoisted(() => ({ state: undefined as ReturnType<typeof store.getState> | undefined }))
|
||||
vi.mock('../src/store', async importOriginal => {
|
||||
const actual = await importOriginal<typeof import('../src/store')>()
|
||||
return { ...actual, useStore: (select: (s: ReturnType<typeof store.getState>) => unknown) => select(snapshot.state!) }
|
||||
})
|
||||
|
||||
const timestamp = '2026-10-12T10:00:00Z'
|
||||
function card(over: Partial<ActivityCard> = {}): ActivityCard {
|
||||
return {
|
||||
id: 'card_1', projectId: 'prj_1', conversationId: 'cnv_1',
|
||||
kind: 'progress', title: '整理项目材料', status: 'active', tone: 'info',
|
||||
body: [{ type: 'kv', kv: [['状态', '进行中'], ['正在做', '核对会议结论'], ['材料键', 'private-material-key']] }],
|
||||
createdAt: timestamp, updatedAt: timestamp, ...over,
|
||||
}
|
||||
}
|
||||
function reply(parts: Message['parts']): Message {
|
||||
return { id: 'msg_1', conversationId: 'cnv_1', role: 'assistant', runId: 'run_1', createdAt: timestamp, parts }
|
||||
}
|
||||
function hitl(over: Partial<HITLCard> = {}): HITLCard {
|
||||
return { id: 'hitl_detail1', runId: 'run_1', conversationId: 'cnv_1', kind: 'confirm',
|
||||
question: '执行工具 run_shell?', detail: '{"command":"printf confirm-record"}',
|
||||
choices: [{ id: 'yes', label: '执行', description: '按已确认的参数调用', impact: '会访问外部资源并返回结果' },
|
||||
{ id: 'no', label: '取消', description: '跳过本次调用', impact: '不会执行本次操作' }],
|
||||
allowFreeInput: false, createdAt: timestamp, resolved: false, ...over }
|
||||
}
|
||||
function render() { return renderToStaticMarkup(createElement(Conversation)) }
|
||||
function renderWork() { return renderToStaticMarkup(createElement(ConversationWork)) }
|
||||
function completedResults(): ActivityCard[] {
|
||||
// The host lists cards newest-first; submit_card publishes markdown results.
|
||||
return [
|
||||
card({ id: 'result_latest', kind: 'result', title: '最新整理成果', status: 'done', tone: 'ok',
|
||||
updatedAt: '2026-10-12T12:00:00Z', body: [{ type: 'markdown', markdown: '最新成果的主要结论' }] }),
|
||||
card({ id: 'result_older', kind: 'result', title: '先前整理成果', status: 'done', tone: 'ok', pinned: true,
|
||||
updatedAt: '2026-10-12T10:00:00Z', body: [{ type: 'markdown', markdown: '先前成果的主要结论' }] }),
|
||||
]
|
||||
}
|
||||
|
||||
beforeEach(() => {
|
||||
setPersistedOpen('hitl-details:cnv_1:hitl_detail1', false)
|
||||
setPersistedOpen('conversation-work:prj_1:cnv_1', false)
|
||||
const base = store.getState()
|
||||
snapshot.state = {
|
||||
...base, currentProjectId: 'prj_1', currentConvId: 'cnv_1', connected: true,
|
||||
tasks: [{ id: 'cnv_1', projectId: 'prj_1', title: '讨论项目', createdAt: timestamp, updatedAt: timestamp }],
|
||||
messages: [], cards: [], runs: [], activeHitl: [], live: null, artifacts: [], outbox: [], posting: false,
|
||||
ui: { ...base.ui, rightCollapsed: true, autoCollapseProcess: true },
|
||||
cardActionStates: {},
|
||||
}
|
||||
})
|
||||
|
||||
describe('conversation work reading', () => {
|
||||
it('keeps ordinary Q&A free of an empty progress object', () => {
|
||||
snapshot.state!.messages = [reply([{ type: 'text', text: '可以先确定项目目标' }])]
|
||||
const html = render()
|
||||
expect(html).toContain('可以先确定项目目标')
|
||||
expect(html).not.toContain('data-conversation-work')
|
||||
expect(html).not.toContain('data-testid="input-status"')
|
||||
})
|
||||
|
||||
it('renders stable semantic timestamps on user and assistant messages', () => {
|
||||
snapshot.state!.messages = [{ ...reply([{ type: 'text', text: '请整理材料' }]), id: 'user', role: 'user' }, reply([{ type: 'text', text: '材料已收到' }])]
|
||||
const html = render()
|
||||
expect(html.match(/<time class="message-timestamp"/g)).toHaveLength(2)
|
||||
expect(html.match(/dateTime="2026-10-12T10:00:00.000Z"/g)).toHaveLength(2)
|
||||
expect(html).toContain('title="2026/10/12')
|
||||
})
|
||||
|
||||
it('announces unread work without inserting its full result into the chat', () => {
|
||||
snapshot.state!.ui.rightCollapsed = false
|
||||
snapshot.state!.cards = [card({ status: 'done', work: { result: 'background-result-full-text', resultVersion: 2, readVersion: 1 } })]
|
||||
const html = render()
|
||||
expect(html).toContain('1 项工作有新结果')
|
||||
expect(html).not.toContain('background-result-full-text')
|
||||
})
|
||||
|
||||
it('shows an explicit removable result reference without copying its content into the draft', () => {
|
||||
snapshot.state!.workReference = { cardId: 'work', resultVersion: 2, title: '材料整理' }
|
||||
const html = render()
|
||||
expect(html).toContain('基于「材料整理」的第 2 版结果')
|
||||
expect(html).toContain('aria-label="移除工作结果引用"')
|
||||
})
|
||||
|
||||
it('shows the current real work with the auxiliary pane closed', () => {
|
||||
snapshot.state!.cards = [card()]
|
||||
const html = render()
|
||||
expect(html).toContain('整理项目材料')
|
||||
expect(html).toContain('核对会议结论')
|
||||
expect(html).not.toContain('private-material-key')
|
||||
})
|
||||
|
||||
it('shows the newest completed result by default with older results in closed history', () => {
|
||||
snapshot.state!.cards = completedResults()
|
||||
const html = renderWork()
|
||||
expect(html).toContain('data-card-id="result_latest"')
|
||||
expect(html).toContain('最新成果的主要结论')
|
||||
expect(html).not.toContain('data-card-id="result_older"')
|
||||
expect(html).not.toContain('先前成果的主要结论')
|
||||
expect(html).toContain('更多工作与成果 · 1 项')
|
||||
|
||||
setPersistedOpen('conversation-work:prj_1:cnv_1', true)
|
||||
expect(renderWork()).toContain('先前成果的主要结论')
|
||||
})
|
||||
|
||||
it('keeps the newest result ahead of an already resolved confirmation', () => {
|
||||
snapshot.state!.cards = [card({ id: 'confirm_resolved', kind: 'confirm', status: 'resolved', title: '已处理确认',
|
||||
updatedAt: '2026-10-12T13:00:00Z' }), ...completedResults()]
|
||||
const html = renderWork()
|
||||
expect(html).toContain('最新成果的主要结论')
|
||||
expect(html).not.toContain('data-card-id="confirm_resolved"')
|
||||
expect(html).toContain('更多工作与成果 · 2 项')
|
||||
})
|
||||
|
||||
it.each([false, true])('keeps active work ahead of completed results (pinned=%s)', pinned => {
|
||||
const [latest, older] = completedResults()
|
||||
snapshot.state!.cards = [latest, card({ id: 'work_active', title: '正在核验材料',
|
||||
updatedAt: '2026-10-12T11:00:00Z',
|
||||
body: [{ type: 'kv', kv: [['正在做', '核对活动工作的结论']] }] }), older]
|
||||
if (pinned) snapshot.state!.cards.push(card({ id: 'work_pinned', pinned: true, title: '优先核验材料',
|
||||
updatedAt: '2026-10-12T09:00:00Z',
|
||||
body: [{ type: 'kv', kv: [['正在做', '核对固定工作的结论']] }] }))
|
||||
const html = renderWork()
|
||||
expect(html).toContain(pinned ? '核对固定工作的结论' : '核对活动工作的结论')
|
||||
expect(html).not.toContain('data-card-id="result_latest"')
|
||||
expect(html).not.toContain('data-card-id="result_older"')
|
||||
if (pinned) expect(html).not.toContain('data-card-id="work_active"')
|
||||
})
|
||||
|
||||
it('leaves completed results to the visible right work pane', () => {
|
||||
snapshot.state!.ui.rightCollapsed = false
|
||||
snapshot.state!.cards = completedResults()
|
||||
const html = renderWork()
|
||||
expect(html).toBe('')
|
||||
})
|
||||
|
||||
it('keeps the work card in one detail location when the right work pane is visible', () => {
|
||||
snapshot.state!.ui.rightCollapsed = false
|
||||
snapshot.state!.cards = [card()]
|
||||
const html = render()
|
||||
expect(html).not.toContain('data-conversation-work')
|
||||
expect(html).not.toContain('核对会议结论')
|
||||
snapshot.state!.ui.rightCollapsed = true
|
||||
expect(render()).toContain('核对会议结论')
|
||||
})
|
||||
|
||||
it('keeps the conversation detail when the right pane is reading files', () => {
|
||||
snapshot.state!.ui.rightCollapsed = false
|
||||
snapshot.state!.ui.rightTab = 'files'
|
||||
snapshot.state!.cards = [card()]
|
||||
expect(render()).toContain('核对会议结论')
|
||||
})
|
||||
|
||||
it('keeps secondary message operations available through progressive disclosure', () => {
|
||||
snapshot.state!.messages = [reply([{ type: 'text', text: '已经整理好要点' }])]
|
||||
const html = render()
|
||||
expect(html).toContain('已经整理好要点')
|
||||
expect(html).toContain('消息操作')
|
||||
expect(html).not.toContain('排除出上下文')
|
||||
expect(html).not.toContain('重新生成')
|
||||
})
|
||||
|
||||
it('keeps failure impact and coverage limits visible without expanding history', () => {
|
||||
snapshot.state!.cards = [card({ status: 'failed', tone: 'danger', body: [
|
||||
{ type: 'kv', kv: [['状态', '失败'], ['当前发现', '已整理两份材料'], ['剩余', '评审意见未能读取,完整结论尚未生成']] },
|
||||
] })]
|
||||
const html = render()
|
||||
expect(html).toContain('已整理两份材料')
|
||||
expect(html).toContain('评审意见未能读取,完整结论尚未生成')
|
||||
})
|
||||
|
||||
it('keeps a completed result limitation visible while another task is active', () => {
|
||||
snapshot.state!.cards = [card(), card({ id: 'card_partial', status: 'done', tone: 'warn', title: '已整理部分材料',
|
||||
body: [{ type: 'kv', kv: [['当前发现', '两份材料已整理'], ['剩余', '第三份材料未能读取,请补充清晰版本']] }],
|
||||
})]
|
||||
const html = render()
|
||||
expect(html).toContain('第三份材料未能读取,请补充清晰版本')
|
||||
})
|
||||
|
||||
it('hides running command records while keeping the final reply readable', () => {
|
||||
const live: LiveState = { runId: 'run_1', phase: 'responding', startedAt: Date.now(), agentNotes: {}, items: [
|
||||
{ kind: 'tool', name: 'run_shell', callId: 'call_1', args: 'secret-command-argument', output: 'raw-command-output', state: 'running', startedAt: Date.now(), endedAt: 0 },
|
||||
{ kind: 'final' }, { kind: 'text', index: 1, text: '已找到需要补充的两项要求' },
|
||||
] }
|
||||
snapshot.state!.live = live
|
||||
const html = render()
|
||||
expect(html).toContain('已找到需要补充的两项要求')
|
||||
expect(html).not.toContain('secret-command-argument')
|
||||
expect(html).not.toContain('raw-command-output')
|
||||
expect(html).toContain('执行记录')
|
||||
})
|
||||
|
||||
it('uses a real compact stage without exposing an internal tool name', () => {
|
||||
snapshot.state!.live = { runId: 'run_1', phase: 'acting', startedAt: Date.now(), agentNotes: {}, items: [
|
||||
{ kind: 'tool', name: 'run_shell', callId: 'call_1', args: '', output: '', state: 'running', startedAt: Date.now(), endedAt: 0 },
|
||||
] }
|
||||
const html = render()
|
||||
expect(html).toContain('正在处理')
|
||||
expect(html).not.toContain('run_shell')
|
||||
})
|
||||
|
||||
it('exposes anchored required confirmation outside work history', () => {
|
||||
snapshot.state!.messages = [{ ...reply([{ type: 'text', text: '请整理资料' }]), role: 'user' }]
|
||||
snapshot.state!.cards = [card({ kind: 'confirm', status: 'action_required', anchorMessageId: 'msg_1',
|
||||
title: '新增一份项目草稿', actions: [{ id: 'confirm', label: '确认新增', style: 'primary' }] })]
|
||||
const html = render()
|
||||
expect(html).toContain('新增一份项目草稿')
|
||||
expect(html).toContain('确认新增')
|
||||
})
|
||||
|
||||
it('shows only a location link for anchored confirmation when the work pane owns its actions', () => {
|
||||
snapshot.state!.ui.rightCollapsed = false
|
||||
snapshot.state!.messages = [{ ...reply([{ type: 'text', text: '请整理资料' }]), role: 'user' }]
|
||||
snapshot.state!.cards = [card({ kind: 'confirm', status: 'action_required', anchorMessageId: 'msg_1',
|
||||
title: '新增一份项目草稿', actions: [{ id: 'confirm', label: '确认新增', style: 'primary' }] })]
|
||||
const html = render()
|
||||
expect(html).toContain('新增一份项目草稿')
|
||||
expect(html).toContain('在工作栏处理')
|
||||
expect(html).not.toContain('确认新增')
|
||||
})
|
||||
|
||||
it('keeps a submitted card as a location link when its full body is in the work pane', () => {
|
||||
snapshot.state!.ui.rightCollapsed = false
|
||||
snapshot.state!.cards = [card({ id: 'result_1', kind: 'result', title: '材料核对结果', status: 'done',
|
||||
body: [{ type: 'markdown', markdown: '材料核对的完整正文' }] })]
|
||||
snapshot.state!.messages = [reply([{ type: 'card', card: { cardId: 'result_1', kind: 'result', data: [] } }])]
|
||||
const html = render()
|
||||
expect(html).toContain('材料核对结果')
|
||||
expect(html).not.toContain('展开全文')
|
||||
snapshot.state!.ui.rightCollapsed = true
|
||||
expect(render()).toContain('展开全文')
|
||||
})
|
||||
|
||||
it('keeps a required confirmation accessible when its anchor is an assistant message', () => {
|
||||
snapshot.state!.messages = [reply([{ type: 'text', text: '准备新增项目草稿' }])]
|
||||
snapshot.state!.cards = [card({ kind: 'confirm', status: 'action_required', anchorMessageId: 'msg_1',
|
||||
title: '新增一份项目草稿', actions: [{ id: 'confirm', label: '确认新增', style: 'primary' }] })]
|
||||
expect(render()).toContain('确认新增')
|
||||
})
|
||||
|
||||
it('keeps a thinking-only record available for deliberate review', () => {
|
||||
const html = renderToStaticMarkup(createElement(ProcessTimeline, {
|
||||
parts: [{ type: 'thinking', process: true, text: 'private-internal-deliberation' }],
|
||||
live: true, idKey: 'thinking-test', renderPart: () => null,
|
||||
}))
|
||||
expect(html).toContain('private-internal-deliberation')
|
||||
snapshot.state!.messages = [reply([{ type: 'thinking', process: true, text: 'private-internal-deliberation' },
|
||||
{ type: 'text', text: '已完成核对' }])]
|
||||
expect(render()).toContain('执行记录')
|
||||
})
|
||||
|
||||
it('lets readers reopen the full output of a grouped read action', () => {
|
||||
setPersistedOpen('tool-record:read-history:call-read:0', true)
|
||||
const html = renderToStaticMarkup(createElement(ProcessTimeline, {
|
||||
parts: [{ type: 'tool_call', process: true,
|
||||
toolCall: { id: 'call-read', name: 'fs_read_file', arguments: '{"path":"材料.txt"}' },
|
||||
toolOutput: 'full-read-output' } as Message['parts'][number]],
|
||||
live: false, idKey: 'read-history', renderPart: () => null,
|
||||
}))
|
||||
expect(html).toContain('full-read-output')
|
||||
})
|
||||
|
||||
it('blocks repeated HITL choices when the shared action result is unknown', () => {
|
||||
snapshot.state!.cardActionStates = { 'hitl:hitl_1': 'unknown' }
|
||||
snapshot.state!.activeHitl = [{ id: 'hitl_1', runId: 'run_1', kind: 'choice', question: '选择整理范围',
|
||||
conversationId: 'cnv_1', allowFreeInput: false, createdAt: timestamp, resolved: false,
|
||||
choices: [{ id: 'all', label: '全部材料', description: '整理三份材料', impact: '生成一份草稿' }],
|
||||
}]
|
||||
const html = render()
|
||||
expect(html).toMatch(/<button[^>]*disabled=""[^>]*>[\s\S]*?全部材料/)
|
||||
expect(html).toContain('正在核实处理结果')
|
||||
})
|
||||
|
||||
it('folds command details while retaining the confirmation and consequences', () => {
|
||||
snapshot.state!.activeHitl = [hitl()]
|
||||
const html = render()
|
||||
expect(html).not.toContain('confirm-record')
|
||||
expect(html).toContain('执行工具 run_shell?')
|
||||
expect(html).toContain('按已确认的参数调用')
|
||||
expect(html).toContain('会访问外部资源并返回结果')
|
||||
expect(html).toContain('操作详情')
|
||||
})
|
||||
|
||||
it('makes the original command detail readable after the user expands it', () => {
|
||||
snapshot.state!.activeHitl = [hitl()]
|
||||
setPersistedOpen('hitl-details:cnv_1:hitl_detail1', true)
|
||||
const html = render()
|
||||
expect(html).toMatch(/aria-expanded="true"[^>]*>[\s\S]*?操作详情/)
|
||||
expect(html).toContain('confirm-record')
|
||||
})
|
||||
|
||||
it('keeps a blocking restriction visible outside the operation detail fold', () => {
|
||||
snapshot.state!.activeHitl = [hitl({ blocked: true, blockReason: '目标文件需要先完成评审,当前不能覆盖' })]
|
||||
const html = render()
|
||||
expect(html).toContain('目标文件需要先完成评审,当前不能覆盖')
|
||||
expect(html).not.toContain('confirm-record')
|
||||
})
|
||||
|
||||
it('folds the exact workflow script suffix supplied in the question', () => {
|
||||
snapshot.state!.activeHitl = [hitl({ question: '运行这段脚本?\nprint("workflow-record-script")', detail: undefined })]
|
||||
const html = render()
|
||||
expect(html).toContain('运行这段脚本?')
|
||||
expect(html).toContain('会访问外部资源并返回结果')
|
||||
expect(html).not.toContain('workflow-record-script')
|
||||
expect(html).toContain('操作详情')
|
||||
})
|
||||
|
||||
it('retains the full workflow script and separate detail on deliberate expansion', () => {
|
||||
snapshot.state!.activeHitl = [hitl({ question: '运行这段脚本?\nprint("workflow-record-script")' })]
|
||||
setPersistedOpen('hitl-details:cnv_1:hitl_detail1', true)
|
||||
const html = render()
|
||||
expect(html).toContain('workflow-record-script')
|
||||
expect(html).toContain('confirm-record')
|
||||
expect(html).toMatch(/aria-expanded="true"[^>]*>[\s\S]*?操作详情/)
|
||||
})
|
||||
|
||||
it('retains multiline business consequences in an ordinary question', () => {
|
||||
snapshot.state!.activeHitl = [hitl({ question: '批准计划并继续执行?\n会覆盖旧草稿,原件保留', detail: undefined })]
|
||||
expect(render()).toContain('会覆盖旧草稿,原件保留')
|
||||
})
|
||||
})
|
||||
@@ -1,6 +1,6 @@
|
||||
// 设计系统守护测试(父仓 DESIGN.md §11 禁止清单 · 宿主侧,2026-09-30)。
|
||||
// 棘轮基线:现存豁免登记在下方;新增同类违规直接失败。收紧 = 修掉违规后删基线条目。
|
||||
// 范围:src/styles.css 与 src/**/*.tsx。@ui 组件库侧由 Agent-System-UI 的守护测试覆盖。
|
||||
// 范围:src/**/*.css 与 src/**/*.tsx。@ui 组件库侧由 Agent-System-UI 的守护测试覆盖。
|
||||
import { describe, it, expect } from 'vitest'
|
||||
import { readFileSync, readdirSync, statSync, existsSync } from 'node:fs'
|
||||
import { join, relative, dirname } from 'node:path'
|
||||
@@ -36,8 +36,14 @@ describe('DESIGN.md 宪法在位', () => {
|
||||
|
||||
// ---- 2. 动效唯一所有者 ----
|
||||
describe('动效唯一所有者', () => {
|
||||
it('styles.css 无 @keyframes(全部走 @ui/motion.css 的 mk-* 类)', () => {
|
||||
expect(stripCssComments(read(join(SRC, 'styles.css')))).not.toContain('@keyframes')
|
||||
it('宿主 CSS 无 @keyframes 或私有 transition(全部走 @ui/motion.css 的 mk-* 类)', () => {
|
||||
for (const path of walk(SRC).filter(p => p.endsWith('.css'))) {
|
||||
const css = stripCssComments(read(path))
|
||||
expect(css, `${relative(SRC, path)} 不得定义 @keyframes`).not.toContain('@keyframes')
|
||||
const transitions = css.split('\n').filter(line => /transition\s*:/.test(line) && !/transition\s*:\s*none\b/.test(line))
|
||||
if (path.endsWith('styles.css')) continue // 历史 transition 由现有棘轮逐步收紧;新分层 CSS 不再扩散。
|
||||
expect(transitions, `${relative(SRC, path)} 动效必须消费 mk-*`).toEqual([])
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
@@ -53,6 +59,16 @@ describe('裸色值棘轮', () => {
|
||||
const extra = found.filter(h => !allow.has(h))
|
||||
expect(extra, `新增裸色值 ${[...new Set(extra)].join(', ')}——改用 tokens 令牌;确需豁免更新 HEX_BASELINE_STYLES 并写明理由`).toEqual([])
|
||||
})
|
||||
it('分层组件 CSS 只消费令牌,不派生私有颜色', () => {
|
||||
const componentCss = walk(SRC).filter(p => p.endsWith('.css') && !p.endsWith('styles.css'))
|
||||
const extra: string[] = []
|
||||
for (const path of componentCss) {
|
||||
const css = stripCssComments(read(path))
|
||||
for (const hex of collectHex(css)) extra.push(`${relative(SRC, path)}: ${hex}`)
|
||||
if (/color-mix\s*\(/.test(css)) extra.push(`${relative(SRC, path)}: color-mix`)
|
||||
}
|
||||
expect(extra, '分层组件 CSS 的颜色须由 @ui/tokens.css 提供').toEqual([])
|
||||
})
|
||||
it('组件 TSX 无裸色值', () => {
|
||||
const extra: string[] = []
|
||||
for (const p of walk(SRC).filter(p => /\.(tsx|ts)$/.test(p) && !p.endsWith('.d.ts'))) {
|
||||
|
||||
@@ -0,0 +1,73 @@
|
||||
import { describe, expect, it } from 'vitest'
|
||||
import {
|
||||
absorbServerDocs, applyCell, cellDuty, completeness, editCell, replacementNote, saveIssues, savePayload,
|
||||
type DutyDocDraft,
|
||||
} from '../src/duties/draft'
|
||||
|
||||
function doc(over: Partial<DutyDocDraft> = {}): DutyDocDraft {
|
||||
return {
|
||||
docId: 'd1', title: '需求', code: 'UR-1', typeKey: 'design', stage: 'BD',
|
||||
dutyVersion: 3, activeRound: 0, legacySectionOverrides: 0, dirty: false,
|
||||
author: 'alice', reviewers: ['bob'], approver: 'carol',
|
||||
...over,
|
||||
}
|
||||
}
|
||||
|
||||
describe('文档职责草稿', () => {
|
||||
it('单元格由三权反推,三人视图读到同一份角色', () => {
|
||||
const roles = { author: 'alice', reviewers: ['bob', 'dave'], approver: 'carol' }
|
||||
expect(cellDuty(roles, 'alice')).toBe('author')
|
||||
expect(cellDuty(roles, 'bob')).toBe('reviewer')
|
||||
expect(cellDuty(roles, 'dave')).toBe('reviewer')
|
||||
expect(cellDuty(roles, 'carol')).toBe('approver')
|
||||
expect(cellDuty(roles, 'erin')).toBe('none')
|
||||
expect(completeness(roles)).toEqual({ authors: 1, reviewers: 2, approvers: 1, conflicts: 0 })
|
||||
})
|
||||
|
||||
it('替换编制前先记住原编制,并保证一人一责', () => {
|
||||
const next = applyCell({ author: 'alice', reviewers: ['bob'], approver: 'carol' }, 'bob', 'author')
|
||||
expect(next.replacedAuthor).toBe('alice')
|
||||
expect(next.roles).toEqual({ author: 'bob', reviewers: [], approver: 'carol' })
|
||||
expect(replacementNote({ author: 'alice', reviewers: ['bob'], approver: 'carol' }, 'bob', 'author')).toBe('将替换alice')
|
||||
})
|
||||
|
||||
it('清掉唯一编制后允许留在草稿,但禁止保存', () => {
|
||||
const cleared = editCell([doc()], 'd1', 'alice', 'none')
|
||||
expect(cleared[0].author).toBe('')
|
||||
expect(cleared[0].dirty).toBe(true)
|
||||
expect(saveIssues(cleared[0])).toContain('需指定编制人')
|
||||
expect(savePayload(cleared, false).issues.join(' ')).toContain('需指定编制人')
|
||||
})
|
||||
|
||||
it('过期服务端页不覆盖未保存草稿', () => {
|
||||
const dirty = doc({ author: 'erin', dirty: true, dutyVersion: 3 })
|
||||
const absorbed = absorbServerDocs([dirty], [{
|
||||
docId: 'd1', title: '需求', typeKey: 'design', dutyVersion: 4,
|
||||
}], [{ docId: 'd1', owner: 'alice', duty: 'author' }, { docId: 'd1', owner: 'bob', duty: 'reviewer' }, { docId: 'd1', owner: 'carol', duty: 'approver' }])
|
||||
expect(absorbed[0].author).toBe('erin')
|
||||
expect(absorbed[0].dutyVersion).toBe(3)
|
||||
})
|
||||
|
||||
it('写入结果未知时采用服务端版本,不再留着旧草稿重放', () => {
|
||||
const dirty = doc({ author: 'erin', dirty: true, dutyVersion: 3 })
|
||||
const absorbed = absorbServerDocs([dirty], [{
|
||||
docId: 'd1', title: '需求', typeKey: 'design', dutyVersion: 4,
|
||||
}], [
|
||||
{ docId: 'd1', owner: 'alice', duty: 'author' },
|
||||
{ docId: 'd1', owner: 'bob', duty: 'reviewer' },
|
||||
{ docId: 'd1', owner: 'carol', duty: 'approver' },
|
||||
], true)
|
||||
expect(absorbed[0]).toMatchObject({ author: 'alice', dutyVersion: 4, dirty: false })
|
||||
})
|
||||
|
||||
it('保存载荷是每份脏文档的完整目标,超过 20 份被拒绝', () => {
|
||||
const many = Array.from({ length: 21 }, (_, index) => doc({ docId: `d${index}`, dirty: true }))
|
||||
const blocked = savePayload(many, true)
|
||||
expect(blocked.issues).toContain('一次保存最多 20 份文档')
|
||||
const one = savePayload([doc({ dirty: true, activeRound: 2 })], true)
|
||||
expect(one.docs[0]).toMatchObject({
|
||||
docId: 'd1', author: 'alice', reviewers: ['bob'], approver: 'carol',
|
||||
expectedDutyVersion: 3, confirmInvalidation: true,
|
||||
})
|
||||
})
|
||||
})
|
||||
@@ -0,0 +1,30 @@
|
||||
// 棘轮:宿主侧的 HTML 写入必须走 @ui safeHtml,不能在组件里直接塞字符串。
|
||||
import { describe, expect, it } from 'vitest'
|
||||
import { readFileSync, readdirSync, statSync } from 'node:fs'
|
||||
import { join, relative, dirname } from 'node:path'
|
||||
import { fileURLToPath } from 'node:url'
|
||||
|
||||
const SRC = join(dirname(fileURLToPath(import.meta.url)), '..', 'src')
|
||||
|
||||
function walk(dir: string, out: string[] = []): string[] {
|
||||
for (const name of readdirSync(dir)) {
|
||||
const p = join(dir, name)
|
||||
if (statSync(p).isDirectory()) walk(p, out)
|
||||
else if (/\.(ts|tsx)$/.test(name)) out.push(p)
|
||||
}
|
||||
return out
|
||||
}
|
||||
|
||||
describe('html sinks', () => {
|
||||
it('frontend components do not write HTML themselves', () => {
|
||||
const hits: string[] = []
|
||||
for (const file of walk(SRC)) {
|
||||
const text = readFileSync(file, 'utf8')
|
||||
const rel = relative(SRC, file)
|
||||
if (text.includes('dangerouslySetInnerHTML')) hits.push(`${rel}: dangerouslySetInnerHTML`)
|
||||
// 空白放进前瞻里,避免 \s* 回退到空格前面、把 innerHTML = '' 误判成写入。
|
||||
if (/innerHTML\s*=(?!\s*['"]['"])/.test(text)) hits.push(`${rel}: innerHTML`)
|
||||
}
|
||||
expect(hits).toEqual([])
|
||||
})
|
||||
})
|
||||
+126
-15
@@ -2,9 +2,12 @@
|
||||
// 轮次穿插同构、过程区折叠谓词。
|
||||
import { describe, it, expect } from 'vitest'
|
||||
import {
|
||||
applyTextDelta, applyThinkingDelta, applyToolCall, applyToolResult, applyArtifactCreated,
|
||||
liveToMessage, showProcessInline, type LiveItem,
|
||||
applyTextDelta, applyThinkingDelta, applyToolCall, applyToolCallDelta, applyToolResult, applyToolOutput, applyArtifactCreated,
|
||||
applyCheck, applyFinalizing,
|
||||
hasSettledReply, liveToMessage, livePhaseLabel, showProcessInline, type LiveItem,
|
||||
runEventsToTimeline,
|
||||
} from '../src/live'
|
||||
import type { StreamEvent } from '../src/contracts'
|
||||
import type { LiveState } from '../src/store'
|
||||
|
||||
function live(over: Partial<LiveState> = {}): LiveState {
|
||||
@@ -63,12 +66,25 @@ describe('applyThinkingDelta / applyTextDelta', () => {
|
||||
items = applyToolCall(items, 'b', 'cb')
|
||||
items = applyToolResult(items, 'cb', 'ok', '结果')
|
||||
expect(items).toEqual([
|
||||
{ kind: 'tool', callId: 'ca', name: 'a' },
|
||||
{ kind: 'tool', callId: 'cb', name: 'b', status: 'ok', summary: '结果' },
|
||||
{ kind: 'tool', callId: 'ca', name: 'a', args: '', state: 'running', startedAt: 0, endedAt: 0, output: '' },
|
||||
{ kind: 'tool', callId: 'cb', name: 'b', args: '', state: 'done', startedAt: 0, endedAt: 0, output: '', status: 'ok', summary: '结果' },
|
||||
])
|
||||
// 无 callId 的事件回落到尾部配对。
|
||||
items = applyToolResult(items, undefined, 'ok')
|
||||
expect(items[0]).toEqual({ kind: 'tool', callId: 'ca', name: 'a', status: 'ok' })
|
||||
expect(items[0]).toMatchObject({ kind: 'tool', callId: 'ca', name: 'a', state: 'done', status: 'ok' })
|
||||
})
|
||||
it('walks a tool from composing to running to done, and marks the narration as process', () => {
|
||||
let items: LiveItem[] = applyTextDelta([], 0, '我来生成文档。')
|
||||
items = applyToolCallDelta(items, 0, '{"script":', 'c1', 'run_python', 1000)
|
||||
items = applyToolCallDelta(items, 0, '"print(1)"}', undefined, undefined, 1100)
|
||||
const composing = liveToMessage(live({ items }))
|
||||
expect(composing.parts[0].process).toBe(true)
|
||||
expect(composing.parts[1]).toMatchObject({ type: 'tool_call', toolPhase: 'composing', toolCall: { name: 'run_python', arguments: '{"script":"print(1)"}' } })
|
||||
items = applyToolCall(items, 'run_python', 'c1', undefined, 2000)
|
||||
items = applyToolOutput(items, 'c1', 'hello\n')
|
||||
items = applyToolResult(items, 'c1', 'ok', 'exit=0', 3500)
|
||||
const done = liveToMessage(live({ items }))
|
||||
expect(done.parts[1]).toMatchObject({ toolPhase: 'done', toolOutput: 'hello\n', toolCall: { durationMs: 1500 } })
|
||||
expect(done.parts[2]).toMatchObject({ type: 'tool_result', toolResult: { summary: 'exit=0' } })
|
||||
})
|
||||
})
|
||||
|
||||
@@ -78,7 +94,7 @@ describe('liveToMessage', () => {
|
||||
expect(msg.parts).toEqual([
|
||||
{ type: 'thinking', text: '先想想一下', process: true },
|
||||
{ type: 'text', text: '我先更新待办。', process: true },
|
||||
{ type: 'tool_call', process: true, toolCall: { id: 'c1', name: 'update_todos' } },
|
||||
{ type: 'tool_call', process: true, toolCall: { id: 'c1', name: 'update_todos' }, toolPhase: 'done' },
|
||||
{ type: 'tool_result', process: true, toolCall: { id: 'c1', name: 'update_todos' },
|
||||
toolResult: { callId: 'c1', status: 'ok', summary: '已更新' } },
|
||||
{ type: 'thinking', text: '再想想', process: true },
|
||||
@@ -122,8 +138,7 @@ describe('liveToMessage', () => {
|
||||
const msg = liveToMessage(live({ items }))
|
||||
for (const p of msg.parts.filter(p => p.type !== 'text')) expect(p.process).toBe(true)
|
||||
})
|
||||
it('deliverable cards are content parts pinned after the reply text', () => {
|
||||
// 与落库序同构(llm.go 交付物钉尾):artifact_ref 在终轮正文之后、不折叠。
|
||||
it('does not project deliverable cards while the run is live', () => {
|
||||
let items: LiveItem[] = []
|
||||
items = applyTextDelta(items, 0, '生成报表。')
|
||||
items = applyToolCall(items, 'make_report', 'c1')
|
||||
@@ -131,17 +146,99 @@ describe('liveToMessage', () => {
|
||||
items = applyArtifactCreated(items, { artifactId: 'a1', name: 'report.csv', kind: 'csv' })
|
||||
items = applyTextDelta(items, 1, '完成。')
|
||||
const msg = liveToMessage(live({ items }))
|
||||
expect(msg.parts.map(p => p.type)).toEqual(['text', 'tool_call', 'tool_result', 'text', 'artifact_ref'])
|
||||
expect(msg.parts.find(p => p.type === 'artifact_ref')?.process).toBeFalsy() // 内容部件,不折叠
|
||||
expect(msg.parts.some(p => p.type === 'artifact_ref')).toBe(false)
|
||||
expect(msg.parts.filter(p => p.type === 'text').map(p => p.process)).toEqual([true, undefined])
|
||||
})
|
||||
it('moves earlier text into the process area once finalizing starts', () => {
|
||||
let items: LiveItem[] = applyTextDelta([], 0, '草稿回复')
|
||||
items = applyCheck(items, false, '纸张不是 A4')
|
||||
items = applyFinalizing(items)
|
||||
items = applyTextDelta(items, 1, '纪要已写好。')
|
||||
const msg = liveToMessage(live({ phase: 'finalizing', items }))
|
||||
expect(msg.parts.map(p => p.type)).toEqual(['text', 'check', 'text'])
|
||||
expect(msg.parts.filter(p => p.type === 'text').map(p => p.process)).toEqual([true, undefined])
|
||||
expect(msg.parts[1]).toMatchObject({ type: 'check', process: true, check: { passed: false, reason: '纸张不是 A4' } })
|
||||
})
|
||||
})
|
||||
|
||||
it('reopens the ordered complete process from persisted run events', () => {
|
||||
const output = 'x'.repeat(5000)
|
||||
const event = (seq: number, type: StreamEvent['type'], payload: unknown): StreamEvent =>
|
||||
({ seq, type, payload, runId: 'r1', conversationId: 'c1', ts: '2026-10-14T10:00:00Z', v: 1 })
|
||||
const parts = runEventsToTimeline([
|
||||
event(1, 'thinking.delta', { index: 0, text: '先核对' }),
|
||||
event(2, 'message.delta', { index: 0, text: '开始读取材料' }),
|
||||
event(3, 'tool.call', { callId: 'call1', name: 'fs_read_file', arguments: '{"path":"a.txt"}' }),
|
||||
event(4, 'tool.output', { callId: 'call1', text: output }),
|
||||
event(5, 'tool.result', { callId: 'call1', status: 'ok', summary: '读取成功' }),
|
||||
event(6, 'run.phase', { phase: 'finalizing' }),
|
||||
event(7, 'message.delta', { index: 1, text: '最终回复' }),
|
||||
])
|
||||
expect(parts.map(part => part.type)).toEqual(['thinking', 'text', 'tool_call', 'tool_result'])
|
||||
expect((parts[2] as typeof parts[number] & { toolOutput: string }).toolOutput).toBe(output)
|
||||
expect(parts.some(part => part.text === '最终回复')).toBe(false)
|
||||
})
|
||||
|
||||
it('retains collaboration notes from a child after the parent has replied', () => {
|
||||
const event = (seq: number, type: StreamEvent['type'], payload: unknown, runId = 'parent'): StreamEvent =>
|
||||
({ seq, type, payload, runId, conversationId: 'c1', ts: '2026-10-14T10:00:00Z', v: 1 })
|
||||
const parts = runEventsToTimeline([
|
||||
event(1, 'agent.spawn', { agentRun: 'child', name: '资料核对', task: '读附录' }),
|
||||
event(2, 'run.phase', { phase: 'finalizing' }),
|
||||
event(3, 'message.delta', { index: 0, text: '最终回复' }),
|
||||
event(4, 'agent.progress', { agentRun: 'child', note: '正在核对附录' }, 'child'),
|
||||
event(5, 'agent.result', { agentRun: 'child', status: 'completed', summary: '附录已核对' }, 'child'),
|
||||
], 'parent')
|
||||
expect(parts.map(part => part.text)).toEqual([
|
||||
'协作代理「资料核对」已开始', '协作进展:正在核对附录', '协作结束:附录已核对',
|
||||
])
|
||||
expect(parts.every(part => part.replaySource === 'agent')).toBe(true)
|
||||
})
|
||||
|
||||
it('coalesces cumulative child updates without mixing tasks or erasing tool phases', () => {
|
||||
const notes = [
|
||||
['one', '我来检索'], ['two', '核对第二份材料'], ['one', '我来检索一下材料'],
|
||||
['one', '调用 knowledge_search'], ['one', '根据检索结果,开始整理'],
|
||||
...Array.from({ length: 80 }, () => ['one', '根据检索结果,开始整理完整报告']),
|
||||
]
|
||||
const events: StreamEvent[] = notes.map(([agentRun, note], seq) => ({
|
||||
seq: seq + 1, type: 'agent.progress', payload: { agentRun, note }, runId: agentRun,
|
||||
conversationId: 'c', ts: '2026-10-15T10:00:00Z', v: 1,
|
||||
}))
|
||||
expect(runEventsToTimeline(events, 'parent').map(part => part.text)).toEqual([
|
||||
'协作进展:我来检索一下材料', '协作进展:核对第二份材料',
|
||||
'协作进展:调用 knowledge_search', '协作进展:根据检索结果,开始整理完整报告',
|
||||
])
|
||||
})
|
||||
|
||||
it('uses the stable run start time for the temporary assistant message', () => {
|
||||
expect(liveToMessage(live({ startedAt: Date.parse('2026-10-15T10:00:00Z') })).createdAt)
|
||||
.toBe('2026-10-15T10:00:00.000Z')
|
||||
})
|
||||
|
||||
describe('livePhaseLabel', () => {
|
||||
it('names the current activity in Chinese', () => {
|
||||
let items: LiveItem[] = applyThinkingDelta([], '想', 0)
|
||||
expect(livePhaseLabel(live({ items }), 0)).toBe('思考中')
|
||||
items = applyToolCallDelta(items, 0, '{}', 'c', 'run_python', 0)
|
||||
expect(livePhaseLabel(live({ items }), 0)).toBe('正在编写 run_python')
|
||||
items = applyToolCall(items, 'run_python', 'c', undefined, 1000)
|
||||
expect(livePhaseLabel(live({ items }), 4000)).toBe('正在运行 run_python · 3 秒')
|
||||
items = applyToolResult(items, 'c', 'ok', 'done', 4000)
|
||||
items = applyTextDelta(items, 1, '好了')
|
||||
expect(livePhaseLabel(live({ items }), 4000)).toBe('回复中')
|
||||
expect(livePhaseLabel(live({ items, phase: 'finalizing' }), 4000)).toBe('整理回复中')
|
||||
})
|
||||
})
|
||||
|
||||
describe('showProcessInline', () => {
|
||||
it('stays expanded for the whole live run, including the responding phase', () => {
|
||||
expect(showProcessInline(live({ phase: 'thinking' }), true)).toBe(true)
|
||||
expect(showProcessInline(live({ phase: 'acting' }), true)).toBe(true)
|
||||
expect(showProcessInline(live({ phase: 'responding' }), true)).toBe(true)
|
||||
it('keeps live technical records folded under the default reading preference', () => {
|
||||
expect(showProcessInline(live({ phase: 'thinking' }), true)).toBe(false)
|
||||
expect(showProcessInline(live({ phase: 'acting' }), true)).toBe(false)
|
||||
expect(showProcessInline(live({ phase: 'responding' }), true)).toBe(false)
|
||||
})
|
||||
it('honors the advanced preference to expose live records', () => {
|
||||
expect(showProcessInline(live({ phase: 'acting' }), false)).toBe(true)
|
||||
})
|
||||
it('records thinking duration from the first delta to the last', () => {
|
||||
let items: LiveItem[] = applyThinkingDelta([], '先', 1000)
|
||||
@@ -154,3 +251,17 @@ describe('showProcessInline', () => {
|
||||
expect(showProcessInline(null, false)).toBe(true)
|
||||
})
|
||||
})
|
||||
|
||||
describe('hasSettledReply', () => {
|
||||
const user = { role: 'user', runId: 'r1' }
|
||||
const assistant = { role: 'assistant', runId: 'r1' }
|
||||
|
||||
it('stays false while only the user message carries the run id', () => {
|
||||
expect(hasSettledReply([user], 'r1')).toBe(false)
|
||||
expect(hasSettledReply([user, { role: 'assistant', runId: 'other' }], 'r1')).toBe(false)
|
||||
})
|
||||
|
||||
it('turns true once an assistant message for that run is stored', () => {
|
||||
expect(hasSettledReply([user, assistant], 'r1')).toBe(true)
|
||||
})
|
||||
})
|
||||
|
||||
@@ -0,0 +1,56 @@
|
||||
// 登录/改密门错误文案:登录与改密的 401 语义不同,映射分开锁定
|
||||
// (后端错误串是现行 HTTP 契约的一部分,这里逐字对拍防漂移)。
|
||||
import { describe, expect, it } from 'vitest'
|
||||
import { humanChangePasswordError, humanLoginError, isPasswordChangeMode, requiresCurrentPassword } from '../src/components/LoginPage'
|
||||
|
||||
describe('humanLoginError(登录)', () => {
|
||||
it('401 统一为用户名或密码不正确', () => {
|
||||
expect(humanLoginError('401: invalid owner or password')).toBe('用户名或密码不正确')
|
||||
})
|
||||
it('429/412 各有文案,其余剥状态码前缀', () => {
|
||||
expect(humanLoginError('429: too many failed attempts; retry later')).toBe('失败次数过多,请稍后再试')
|
||||
expect(humanLoginError('412: auth disabled (embedded single-tenant mode)')).toBe('本服务未开启登录(嵌入式单租户档)')
|
||||
expect(humanLoginError('400: bad')).toBe('bad')
|
||||
})
|
||||
})
|
||||
|
||||
describe('humanChangePasswordError(改密门)', () => {
|
||||
it('当前密码错误不再伪装成登录失败', () => {
|
||||
expect(humanChangePasswordError('401: current password incorrect')).toBe('当前密码不正确')
|
||||
})
|
||||
it('无会话(API key 凭证)给出可行动指引', () => {
|
||||
expect(humanChangePasswordError('401: session login required (API keys do not own passwords)')).toBe('请先用账号密码登录再改密(API 密钥不能修改密码)')
|
||||
})
|
||||
it('会话过期与失效 key 各有文案', () => {
|
||||
expect(humanChangePasswordError('401: session expired')).toBe('会话已过期,请重新登录')
|
||||
expect(humanChangePasswordError('401: unauthorized: invalid or revoked API key')).toBe('本地残留的 API 密钥已失效,请退出登录后重试')
|
||||
})
|
||||
it('未知 401 回落通用文案,其余错误剥前缀透传', () => {
|
||||
expect(humanChangePasswordError('401: whatever')).toBe('认证失败,请重新登录')
|
||||
expect(humanChangePasswordError('400: password must be 8-256 characters')).toBe('password must be 8-256 characters')
|
||||
})
|
||||
})
|
||||
|
||||
describe('requiresCurrentPassword(强制改密门模式)', () => {
|
||||
it('current_required(管理员指定/生成的初始密码首登)必须要当前密码,grant_setup 免当前密码', () => {
|
||||
expect(requiresCurrentPassword('current_required')).toBe(true)
|
||||
expect(requiresCurrentPassword('grant_setup')).toBe(false)
|
||||
})
|
||||
it('one_time_password(一次性登录密码受限会话)只需新密码与确认,免当前密码', () => {
|
||||
expect(requiresCurrentPassword('one_time_password')).toBe(false)
|
||||
})
|
||||
it('设密门只接受服务端声明的三种模式,其余一律拒绝', () => {
|
||||
expect(isPasswordChangeMode('grant_setup')).toBe(true)
|
||||
expect(isPasswordChangeMode('current_required')).toBe(true)
|
||||
expect(isPasswordChangeMode('one_time_password')).toBe(true)
|
||||
expect(isPasswordChangeMode(undefined)).toBe(false)
|
||||
expect(isPasswordChangeMode('')).toBe(false)
|
||||
expect(isPasswordChangeMode('temporary_password')).toBe(false)
|
||||
})
|
||||
})
|
||||
|
||||
describe('humanChangePasswordError(登录恢复新增文案)', () => {
|
||||
it('并发凭据变化给出重新登录指引', () => {
|
||||
expect(humanChangePasswordError('401: credentials changed concurrently; retry login')).toBe('登录状态已变化(密码在其他地方被更新),请重新登录')
|
||||
})
|
||||
})
|
||||
+138
-2
@@ -1,5 +1,6 @@
|
||||
import { describe, it, expect } from 'vitest'
|
||||
import { splitTimeline, humanSize, artifactIcon, artifactIdsIn, markMissingArtifacts, workedLabel } from '../src/messageparts'
|
||||
import { splitTimeline, mergeProcessTimeline, humanSize, artifactIcon, artifactIdsIn, markMissingArtifacts, workedLabel, dedupeDeliverables, foldRunErrors, processSummary, humanError } from '../src/messageparts'
|
||||
import { applyTextDelta, applyThinkingDelta, applyToolCall, applyToolOutput, liveToMessage, showProcessInline } from '../src/live'
|
||||
import type { Part } from '../src/contracts'
|
||||
|
||||
function p(partial: Partial<Part> & { type: Part['type'] }): Part {
|
||||
@@ -7,7 +8,66 @@ function p(partial: Partial<Part> & { type: Part['type'] }): Part {
|
||||
}
|
||||
|
||||
describe('splitTimeline', () => {
|
||||
it('keeps everything up to the last process part in the timeline', () => {
|
||||
it('keeps intermediate narration with its tools in reading order and the reply outside', () => {
|
||||
const parts: Part[] = [
|
||||
p({ type: 'text', text: '我会先核对**两份可读材料**。', process: true }),
|
||||
p({ type: 'tool_call', process: true, toolCall: { id: 'c1', name: 'read' } }),
|
||||
p({ type: 'tool_result', process: true, toolResult: { callId: 'c1', status: 'ok', summary: '原始读取结果' } }),
|
||||
p({ type: 'text', text: '评审意见未能读取,完整结论尚未生成。' }),
|
||||
p({ type: 'tool_call', process: true, toolCall: { id: 'c2', name: 'search' } }),
|
||||
p({ type: 'text', text: '接下来确认日期冲突。' }),
|
||||
]
|
||||
const split = splitTimeline(parts)
|
||||
expect(split.timeline.map(part => part.type)).toEqual(['text', 'tool_call', 'tool_result', 'text', 'tool_call'])
|
||||
expect(split.timeline.filter(part => part.type === 'text').map(part => part.text)).toEqual([
|
||||
'我会先核对**两份可读材料**。', '评审意见未能读取,完整结论尚未生成。',
|
||||
])
|
||||
expect(split.final.map(part => part.text)).toEqual(['接下来确认日期冲突。'])
|
||||
})
|
||||
|
||||
it('keeps live scope limits visible while execution records are folded by default', () => {
|
||||
let items = applyThinkingDelta([], '内部分析,不向用户展示', 0)
|
||||
items = applyTextDelta(items, 0, '**范围限制:**目前仅整理两份材料,评审意见尚未读取。')
|
||||
items = applyToolCall(items, 'run_python', 'c1', '{"script":"print(42)"}')
|
||||
items = applyToolOutput(items, 'c1', '42\n')
|
||||
const live = { runId: 'r1', phase: 'tool', items, agentNotes: {}, startedAt: 0 }
|
||||
const message = liveToMessage(live)
|
||||
expect(message.parts[1].process).toBe(true)
|
||||
expect(showProcessInline(live, true)).toBe(false)
|
||||
const split = splitTimeline(message.parts)
|
||||
expect(split.final).toEqual([])
|
||||
expect(split.timeline.map(part => part.type)).toEqual(['thinking', 'text', 'tool_call'])
|
||||
})
|
||||
|
||||
it('keeps finalizing checks and internal thinking out of visible text without duplicating explanations', () => {
|
||||
const parts: Part[] = [
|
||||
p({ type: 'text', process: true, text: '评审意见尚未读取。' }),
|
||||
p({ type: 'thinking', process: true, text: '内部推理' }),
|
||||
p({ type: 'tool_call', process: true, toolCall: { id: 'c1', name: 'read' } }),
|
||||
p({ type: 'tool_result', process: true, toolResult: { callId: 'c1', status: 'ok', summary: '诊断输出' } }),
|
||||
p({ type: 'check', process: true, check: { passed: false, reason: '纸张不是 A4' } }),
|
||||
p({ type: 'text', text: '已整理两份材料,请补充清晰的评审意见。' }),
|
||||
]
|
||||
for (const finished of [false, true]) {
|
||||
const split = splitTimeline(parts, finished)
|
||||
expect(split.final.map(part => part.text)).toEqual(['已整理两份材料,请补充清晰的评审意见。'])
|
||||
expect(split.timeline.map(part => part.type)).toEqual(['text', 'thinking', 'tool_call', 'tool_result', 'check'])
|
||||
expect(split.final.length + split.timeline.length).toBe(parts.length)
|
||||
}
|
||||
})
|
||||
|
||||
it('keeps errors and file references outside a technical record even before a later tool', () => {
|
||||
const parts: Part[] = [
|
||||
p({ type: 'error', process: true, error: { code: 'read.failed', message: '评审意见无法读取' } }),
|
||||
p({ type: 'artifact_ref', artifact: { artifactId: 'a1', name: '已整理的材料.docx' } }),
|
||||
p({ type: 'tool_call', process: true, toolCall: { id: 'c1', name: 'search' } }),
|
||||
p({ type: 'text', text: '已整理另外两份材料' }),
|
||||
]
|
||||
const split = splitTimeline(parts)
|
||||
expect(split.timeline.map(x => x.type)).toEqual(['tool_call'])
|
||||
expect(split.final.map(x => x.type)).toEqual(['error', 'artifact_ref', 'text'])
|
||||
})
|
||||
it('keeps narration beside execution records when it precedes the last process part', () => {
|
||||
const parts: Part[] = [
|
||||
p({ type: 'text', text: '先找资料', process: true }),
|
||||
p({ type: 'tool_call', process: true, toolCall: { id: 'c1', name: 'search' } }),
|
||||
@@ -32,6 +92,19 @@ describe('splitTimeline', () => {
|
||||
expect(split.final.map(x => x.text)).toEqual(['最终'])
|
||||
})
|
||||
|
||||
it('promotes only the last narration when a finished run has no final text', () => {
|
||||
const parts: Part[] = [
|
||||
p({ type: 'text', text: '先写一版', process: true }),
|
||||
p({ type: 'tool_call', process: true, toolCall: { id: 'c1', name: 'run_python' } }),
|
||||
p({ type: 'text', text: '纪要已经整理好', process: true }),
|
||||
p({ type: 'tool_call', process: true, toolCall: { id: 'c2', name: 'run_python' } }),
|
||||
]
|
||||
const split = splitTimeline(parts, true)
|
||||
expect(split.final.map(x => x.text)).toEqual(['纪要已经整理好'])
|
||||
expect(split.timeline.map(x => x.type)).toEqual(['text', 'tool_call', 'tool_call'])
|
||||
expect(splitTimeline(parts).final).toEqual([])
|
||||
})
|
||||
|
||||
it('puts a message with no process parts entirely in the final section', () => {
|
||||
const parts = [p({ type: 'text', text: 'hi' })]
|
||||
expect(splitTimeline(parts).timeline).toEqual([])
|
||||
@@ -40,6 +113,43 @@ describe('splitTimeline', () => {
|
||||
})
|
||||
})
|
||||
|
||||
it('enriches saved process without losing retry notes or parsed inline thinking', () => {
|
||||
const saved: Part[] = [
|
||||
p({ type: 'text', process: true, text: '模型在输出前失败,正在重试' }),
|
||||
p({ type: 'thinking', process: true, text: '检查附件边界' }),
|
||||
p({ type: 'tool_call', process: true, toolCall: { id: 'call-1', name: 'fs_read_file' } }),
|
||||
p({ type: 'tool_result', process: true, toolResult: { callId: 'call-1', status: 'ok' } }),
|
||||
]
|
||||
const replayed: Part[] = [
|
||||
p({ type: 'text', process: true, text: '<think>检查附件边界</think>' }),
|
||||
p({ type: 'tool_call', process: true, toolCall: { id: 'call-1', name: 'fs_read_file' }, toolOutput: '完整输出' } as Part),
|
||||
p({ type: 'tool_result', process: true, toolResult: { callId: 'call-1', status: 'ok' } }),
|
||||
p({ type: 'text', process: true, text: '最终回复' }),
|
||||
p({ type: 'text', process: true, text: '协作进展:附录已核对' }),
|
||||
]
|
||||
const merged = mergeProcessTimeline(saved, replayed, [p({ type: 'text', text: '最终回复' })])
|
||||
expect(merged.map(part => part.text).filter(Boolean)).toEqual([
|
||||
'模型在输出前失败,正在重试', '检查附件边界', '协作进展:附录已核对',
|
||||
])
|
||||
expect((merged[2] as Part & { toolOutput: string }).toolOutput).toBe('完整输出')
|
||||
expect(merged.filter(part => part.type === 'tool_call')).toHaveLength(1)
|
||||
})
|
||||
|
||||
it('does not repeat a partial event delta beside the complete saved narration', () => {
|
||||
const saved = [p({ type: 'text', process: true, text: '开始读取材料' }),
|
||||
p({ type: 'tool_call', process: true, toolCall: { id: 'call-1', name: 'fs_read_file' } })]
|
||||
const replayed = [p({ type: 'text', process: true, text: '开始读取' }),
|
||||
p({ type: 'tool_call', process: true, toolCall: { id: 'call-1', name: 'fs_read_file' } })]
|
||||
expect(mergeProcessTimeline(saved, replayed, []).map(part => part.text).filter(Boolean)).toEqual(['开始读取材料'])
|
||||
})
|
||||
|
||||
it('keeps a collaboration result even when the final reply contains its short status', () => {
|
||||
const note = p({ type: 'text', process: true, text: '协作结束:已完成', replaySource: 'agent' } as Part)
|
||||
const merged = mergeProcessTimeline([p({ type: 'text', process: true, text: '完成' })], [note],
|
||||
[p({ type: 'text', text: '已完成' })])
|
||||
expect(merged.map(part => part.text)).toEqual(['完成', '协作结束:已完成'])
|
||||
})
|
||||
|
||||
describe('artifact ids in reply text', () => {
|
||||
it('extracts unique ids in order', () => {
|
||||
expect(artifactIdsIn('见 art_0123456789ab 和 `art_abcdefabcdef`,再提 art_0123456789ab'))
|
||||
@@ -54,6 +164,32 @@ describe('artifact ids in reply text', () => {
|
||||
})
|
||||
})
|
||||
|
||||
describe('deliverables, errors, and the process summary', () => {
|
||||
it('keeps the latest card for a repeated file name', () => {
|
||||
const parts: Part[] = [
|
||||
p({ type: 'artifact_ref', artifact: { artifactId: 'a1', name: '精美版.docx' } }),
|
||||
p({ type: 'artifact_ref', artifact: { artifactId: 'a2', name: '精美版.docx' } }),
|
||||
p({ type: 'artifact_ref', artifact: { artifactId: 'b1', name: '纪要.md' } }),
|
||||
]
|
||||
expect(dedupeDeliverables(parts)).toEqual([
|
||||
{ artifact: { artifactId: 'a2', name: '精美版.docx' }, updates: 1 },
|
||||
{ artifact: { artifactId: 'b1', name: '纪要.md' }, updates: 0 },
|
||||
])
|
||||
})
|
||||
|
||||
it('folds a same-run error into the assistant message that has a body', () => {
|
||||
const body = { id: 'm1', runId: 'r1', role: 'assistant', parts: [p({ type: 'text', text: '做到这里' })] }
|
||||
const err = { id: 'm2', runId: 'r1', role: 'assistant', parts: [p({ type: 'error', error: { code: 'budget', message: 'max turns' } })] }
|
||||
const folded = foldRunErrors([body, err])
|
||||
expect(folded.map(m => m.id)).toEqual(['m1'])
|
||||
expect(folded[0].parts.map(part => part.type)).toEqual(['text', 'error'])
|
||||
expect(humanError('run.cancelled', '已取消').title).toBe('已取消')
|
||||
expect(humanError('budget', 'max turns').title).toContain('已停止')
|
||||
expect(processSummary(12, 3, '2026-10-01T00:00:00.000Z', '2026-10-01T00:03:13.000Z'))
|
||||
.toBe('已工作 3 分 13 秒 · 12 次工具调用 · 3 个文件')
|
||||
})
|
||||
})
|
||||
|
||||
describe('workedLabel', () => {
|
||||
it('formats the run span and degrades without timestamps', () => {
|
||||
expect(workedLabel('2026-10-01T00:00:00.000Z', '2026-10-01T00:01:05.000Z')).toBe('已工作 1 分 5 秒')
|
||||
|
||||
@@ -0,0 +1,34 @@
|
||||
import { describe, expect, it } from 'vitest'
|
||||
import { renderToStaticMarkup } from 'react-dom/server'
|
||||
import { createElement } from 'react'
|
||||
import { activeRun } from '../src/store'
|
||||
import { NoticeMessage } from '../src/components/Conversation'
|
||||
import type { Message, Run } from '../src/contracts'
|
||||
|
||||
function run(kind: Run['kind'], status: Run['status']): Run {
|
||||
return {
|
||||
id: `${kind}-${status}`, conversationId: 'c', projectId: 'p',
|
||||
kind, status, createdAt: '2026-10-01T00:00:00Z',
|
||||
}
|
||||
}
|
||||
|
||||
describe('activeRun', () => {
|
||||
it('ignores background subagents so they do not block sending', () => {
|
||||
const runs = [run('subagent', 'running'), run('conversation', 'completed')]
|
||||
expect(activeRun(runs)).toBeUndefined()
|
||||
expect(activeRun([run('conversation', 'running'), run('subagent', 'running')])?.kind).toBe('conversation')
|
||||
})
|
||||
})
|
||||
|
||||
describe('NoticeMessage', () => {
|
||||
it('renders a compact notice row', () => {
|
||||
const msg: Message = {
|
||||
id: 'msg_notice', conversationId: 'c', role: 'system', createdAt: '2026-10-01T00:00:00Z',
|
||||
parts: [{ type: 'text', text: '<system-reminder>\n后台子代理「检索」已结束。\n</system-reminder>' }],
|
||||
}
|
||||
const html = renderToStaticMarkup(createElement(NoticeMessage, { msg }))
|
||||
expect(html).toContain('通知 · 后台子代理「检索」已结束。')
|
||||
expect(html).toContain('msg notice')
|
||||
expect(html).not.toContain('<details')
|
||||
})
|
||||
})
|
||||
@@ -0,0 +1,107 @@
|
||||
// 忘记密码唯一处置守护:管理员生成一次性登录密码 → 用户登录 → 强制改密。
|
||||
// 恢复提案 UI/API 已整体移除;登录页只保留用户名 + 密码一种凭据入口。
|
||||
import { describe, expect, it } from 'vitest'
|
||||
import { readFileSync, readdirSync, statSync } from 'node:fs'
|
||||
import { join, relative, dirname } from 'node:path'
|
||||
import { fileURLToPath } from 'node:url'
|
||||
|
||||
const SRC = join(dirname(fileURLToPath(import.meta.url)), '..', 'src')
|
||||
const read = (...parts: string[]) => readFileSync(join(SRC, ...parts), 'utf8')
|
||||
|
||||
function walk(dir: string, out: string[] = []): string[] {
|
||||
for (const name of readdirSync(dir)) {
|
||||
const p = join(dir, name)
|
||||
if (statSync(p).isDirectory()) walk(p, out)
|
||||
else if (/\.(ts|tsx)$/.test(p)) out.push(p)
|
||||
}
|
||||
return out
|
||||
}
|
||||
|
||||
describe('恢复提案已移除', () => {
|
||||
it('src 不再调用恢复提案或登录 Key 兑换端点', () => {
|
||||
const hits = walk(SRC).filter(p => /recovery-proposals|RecoveryProposal|login-key\/redeem|redeemLoginKey/.test(readFileSync(p, 'utf8')))
|
||||
expect(hits.map(p => relative(SRC, p))).toEqual([])
|
||||
})
|
||||
})
|
||||
|
||||
describe('一次性登录密码 API 契约', () => {
|
||||
const apiSrc = read('api.ts')
|
||||
it('POST /api/admin/users/{owner}/one-time-password 并消费 oneTimePassword 字段', () => {
|
||||
const line = apiSrc.split('\n').find(l => l.includes('adminIssueOneTimePassword:')) ?? ''
|
||||
expect(line).toContain('/api/admin/users/${encodeURIComponent(owner)}/one-time-password`')
|
||||
expect(line).toContain("method: 'POST'")
|
||||
expect(line).toContain('oneTimePassword: string')
|
||||
})
|
||||
it('旧的临时密码重置端点与字段已移除', () => {
|
||||
expect(apiSrc).not.toContain('adminResetUserPassword')
|
||||
expect(apiSrc).not.toContain('temporaryPassword')
|
||||
expect(apiSrc).not.toMatch(/\/api\/admin\/users\/\$\{[^}]+\}\/password`/)
|
||||
})
|
||||
})
|
||||
|
||||
describe('管理员用户管理:唯一忘记密码动作', () => {
|
||||
const panel = read('components', 'adminSections.tsx')
|
||||
it('调用一次性登录密码端点并展示 oneTimePassword', () => {
|
||||
expect(panel.match(/api\.adminIssueOneTimePassword\(/g)).toHaveLength(1)
|
||||
expect(panel).toContain('out.oneTimePassword')
|
||||
expect(panel).not.toContain('temporaryPassword')
|
||||
})
|
||||
it('每行只有「生成一次性登录密码」一个按钮,无恢复提案或重置临时密码入口', () => {
|
||||
expect(panel.match(/>生成一次性登录密码</g)).toHaveLength(1)
|
||||
expect(panel).not.toContain('恢复提案')
|
||||
expect(panel).not.toContain('重置临时密码')
|
||||
})
|
||||
it('一次性密码文案标明使用后强制改密,明文只在一次性展示框出现', () => {
|
||||
expect(panel).toContain('使用后必须强制改密')
|
||||
expect(panel.match(/aria-label="一次性密码"/g)).toHaveLength(1)
|
||||
expect(panel).not.toMatch(/localStorage|sessionStorage|clipboard/)
|
||||
})
|
||||
it('文案标明生成不使原密码失效;原密码登录则作废未用的一次性密码且不强制改密', () => {
|
||||
expect(panel).not.toMatch(/原密码(已|立即|随生成即)失效/)
|
||||
expect(panel).toContain('原密码仍可正常登录')
|
||||
expect(panel).toContain('未使用的一次性登录密码随即作废')
|
||||
expect(panel).toContain('不会被要求改密')
|
||||
})
|
||||
})
|
||||
|
||||
describe('登录页:仅用户名 + 密码', () => {
|
||||
const login = read('components', 'LoginPage.tsx')
|
||||
const loginPage = login.slice(login.indexOf('export function LoginPage'), login.indexOf('export function requiresCurrentPassword'))
|
||||
it('只有一个用户名输入与一个密码输入,无第二凭据入口', () => {
|
||||
expect(loginPage.match(/<input /g)).toHaveLength(2)
|
||||
expect(loginPage.match(/type="password"/g)).toHaveLength(1)
|
||||
expect(loginPage).toContain('api.login(')
|
||||
expect(loginPage).not.toMatch(/role="tab"|login-key|alk_|redeem/i)
|
||||
})
|
||||
it('忘记密码指引指向一次性登录密码且标明须改密', () => {
|
||||
expect(loginPage).toContain('生成一次性登录密码,使用后须立即改密')
|
||||
})
|
||||
})
|
||||
|
||||
describe('强制改密门:one_time_password 模式', () => {
|
||||
const login = read('components', 'LoginPage.tsx')
|
||||
const gate = login.slice(login.indexOf('export function ChangePasswordGate'), login.indexOf('export function humanLoginError'))
|
||||
it('门放行判定经 isPasswordChangeMode,接受 one_time_password', () => {
|
||||
expect(gate).toContain('isPasswordChangeMode(me.passwordChangeMode)')
|
||||
expect(gate).toContain("mode === 'one_time_password'")
|
||||
})
|
||||
it('当前密码输入只在 current_required 下渲染,且提示不再指向一次性登录密码', () => {
|
||||
const currentBlock = gate.slice(gate.indexOf("{mode === 'current_required' && <>"), gate.indexOf('</>}'))
|
||||
expect(currentBlock).toContain('id="forced-current"')
|
||||
expect(currentBlock).not.toContain('一次性登录密码')
|
||||
expect(gate.match(/id="forced-current"/g)).toHaveLength(1)
|
||||
})
|
||||
})
|
||||
|
||||
describe('我的账号:无恢复提案确认', () => {
|
||||
const settings = read('components', 'MyAccountSettings.tsx')
|
||||
it('只给出联系管理员生成一次性登录密码的指引,没有可操作的恢复按钮', () => {
|
||||
expect(settings).toContain('请联系管理员生成一次性登录密码')
|
||||
expect(settings).toContain('强制改密')
|
||||
expect(settings).not.toMatch(/由本人确认|重新生成设密能力|兑换/)
|
||||
})
|
||||
it('不声称生成一次性登录密码会使原密码失效', () => {
|
||||
expect(settings).not.toMatch(/原密码(已|立即|随生成即)失效/)
|
||||
expect(settings).toContain('原密码仍可正常登录')
|
||||
})
|
||||
})
|
||||
+10
-1
@@ -1,6 +1,6 @@
|
||||
import { describe, expect, it } from 'vitest'
|
||||
import {
|
||||
enqueueMessage, enqueueMessageFront, newQueuedMessage, promoteQueuedMessage,
|
||||
deliveryRequestId, enqueueMessage, enqueueMessageFront, newQueuedMessage, promoteQueuedMessage,
|
||||
removeQueuedMessage, replaceQueuedText,
|
||||
} from '../src/outbox'
|
||||
|
||||
@@ -25,4 +25,13 @@ describe('outbox', () => {
|
||||
const again = enqueueMessageFront(q, b)
|
||||
expect(again.map(x => x.id)).toEqual([b.id, a.id])
|
||||
})
|
||||
|
||||
it('reuses the queued id as the request id when the send is retried', () => {
|
||||
const item = newQueuedMessage('hi', ['f1'], ['note.md'])
|
||||
const queued = enqueueMessageFront([], item)
|
||||
expect(deliveryRequestId(queued[0])).toBe(item.id)
|
||||
const retried = enqueueMessageFront(queued, { ...item, text: item.text })
|
||||
expect(deliveryRequestId(retried[0])).toBe(item.id)
|
||||
expect(retried).toHaveLength(1)
|
||||
})
|
||||
})
|
||||
|
||||
@@ -0,0 +1,30 @@
|
||||
// 空态点工件无反应(2026-10-10 实测复现):requestPreview 写 '_' 键、渲染判
|
||||
// currentConvId 非空——键口径不一致导致空态点击只剩弹层关闭。这里测纯函数口径。
|
||||
import { describe, expect, it } from 'vitest'
|
||||
import { mergeOrphanPreviewTabs, previewTabsKey } from '../src/previewtabs'
|
||||
|
||||
describe('previewTabsKey', () => {
|
||||
it('falls back to the empty-state key when no conversation is selected', () => {
|
||||
expect(previewTabsKey(null)).toBe('_')
|
||||
expect(previewTabsKey(undefined)).toBe('_')
|
||||
expect(previewTabsKey('cnv_1')).toBe('cnv_1')
|
||||
})
|
||||
})
|
||||
|
||||
describe('mergeOrphanPreviewTabs', () => {
|
||||
it('merges empty-state tabs into the conversation key and clears the orphan key', () => {
|
||||
const got = mergeOrphanPreviewTabs({
|
||||
_: [{ id: 'a', name: 'A.docx' }, { id: 'b', name: 'B.md' }],
|
||||
cnv_1: [{ id: 'b', name: 'B.md' }],
|
||||
}, 'cnv_1')
|
||||
expect(got._).toEqual([])
|
||||
expect(got.cnv_1.map(t => t.id)).toEqual(['b', 'a'])
|
||||
})
|
||||
|
||||
it('returns the input untouched when there is no orphan or the target is the orphan key', () => {
|
||||
const none = { cnv_1: [{ id: 'a', name: 'A' }] }
|
||||
expect(mergeOrphanPreviewTabs(none, 'cnv_1')).toBe(none)
|
||||
const self = { _: [{ id: 'a', name: 'A' }] }
|
||||
expect(mergeOrphanPreviewTabs(self, '_')).toBe(self)
|
||||
})
|
||||
})
|
||||
@@ -0,0 +1,110 @@
|
||||
import { afterEach, describe, it, expect } from 'vitest'
|
||||
import { computeFitScale, fitPagesToWidth } from '../src/previewfit'
|
||||
|
||||
describe('computeFitScale', () => {
|
||||
it('keeps the page at 100% when the column is wider than the page', () => {
|
||||
expect(computeFitScale(1100, 794, 24)).toBe(1)
|
||||
expect(computeFitScale(818, 794, 24)).toBe(1)
|
||||
})
|
||||
|
||||
it('scales the page down to the column width after subtracting the gutter', () => {
|
||||
expect(computeFitScale(420, 794, 24)).toBeCloseTo((420 - 24) / 794)
|
||||
expect(computeFitScale(794, 794, 24)).toBeCloseTo((794 - 24) / 794)
|
||||
})
|
||||
|
||||
it('does not invert or zoom when the width is unusable', () => {
|
||||
expect(computeFitScale(0, 794, 24)).toBe(1)
|
||||
expect(computeFitScale(20, 794, 24)).toBe(1)
|
||||
expect(computeFitScale(420, 0, 24)).toBe(1)
|
||||
expect(computeFitScale(Number.NaN, 794, 24)).toBe(1)
|
||||
})
|
||||
})
|
||||
|
||||
// node 测试环境没有 DOM。这里只实现 fitPagesToWidth 会碰到的查询与尺寸。
|
||||
class FakeEl {
|
||||
style: { height: string; overflow: string; minHeight: string; transform: string; transformOrigin: string } = {
|
||||
height: '', overflow: '', minHeight: '', transform: '', transformOrigin: '',
|
||||
}
|
||||
clientWidth = 0
|
||||
offsetWidth = 0
|
||||
offsetHeight = 0
|
||||
className = ''
|
||||
tag = 'div'
|
||||
children: FakeEl[] = []
|
||||
querySelector(sel: string): FakeEl | null {
|
||||
const walk = (nodes: FakeEl[]): FakeEl | null => {
|
||||
for (const node of nodes) {
|
||||
if (matches(node, sel)) return node
|
||||
const hit = walk(node.children)
|
||||
if (hit) return hit
|
||||
}
|
||||
return null
|
||||
}
|
||||
return walk(this.children)
|
||||
}
|
||||
}
|
||||
|
||||
function matches(el: FakeEl, sel: string): boolean {
|
||||
const classes = el.className.split(/\s+/).filter(Boolean)
|
||||
if (sel.startsWith('.')) return classes.includes(sel.slice(1))
|
||||
const [tag, cls] = sel.split('.')
|
||||
return el.tag === tag && classes.includes(cls)
|
||||
}
|
||||
|
||||
class FakeResizeObserver {
|
||||
static observed: FakeEl[] = []
|
||||
static instances: FakeResizeObserver[] = []
|
||||
constructor(private callback: () => void) {
|
||||
FakeResizeObserver.instances.push(this)
|
||||
}
|
||||
observe(el: FakeEl) { FakeResizeObserver.observed.push(el) }
|
||||
disconnect() { /* dispose 只要求卸下监听 */ }
|
||||
static fire() {
|
||||
for (const instance of FakeResizeObserver.instances) instance.callback()
|
||||
}
|
||||
static reset() {
|
||||
FakeResizeObserver.observed = []
|
||||
FakeResizeObserver.instances = []
|
||||
}
|
||||
}
|
||||
|
||||
describe('fitPagesToWidth', () => {
|
||||
const previous = globalThis.ResizeObserver
|
||||
|
||||
afterEach(() => {
|
||||
FakeResizeObserver.reset()
|
||||
globalThis.ResizeObserver = previous
|
||||
})
|
||||
|
||||
it('recomputes the host height when the page wrapper grows and clears inline styles on dispose', () => {
|
||||
globalThis.ResizeObserver = FakeResizeObserver as unknown as typeof ResizeObserver
|
||||
const host = new FakeEl()
|
||||
host.clientWidth = 420
|
||||
const wrapper = new FakeEl()
|
||||
wrapper.className = 'docx-wrapper'
|
||||
wrapper.offsetHeight = 1000
|
||||
const page = new FakeEl()
|
||||
page.tag = 'section'
|
||||
page.className = 'docx'
|
||||
page.offsetWidth = 794
|
||||
wrapper.children.push(page)
|
||||
host.children.push(wrapper)
|
||||
|
||||
const dispose = fitPagesToWidth(host as unknown as HTMLElement, host as unknown as HTMLElement)
|
||||
const scale = (420 - 24) / 794
|
||||
expect(host.style.height).toBe(`${Math.round(1000 * scale)}px`)
|
||||
expect(host.style.overflow).toBe('hidden')
|
||||
expect(FakeResizeObserver.observed).toContain(wrapper)
|
||||
|
||||
wrapper.offsetHeight = 1500
|
||||
FakeResizeObserver.fire()
|
||||
expect(host.style.height).toBe(`${Math.round(1500 * scale)}px`)
|
||||
|
||||
dispose()
|
||||
expect(host.style.height).toBe('')
|
||||
expect(host.style.overflow).toBe('')
|
||||
expect(host.style.minHeight).toBe('')
|
||||
expect(wrapper.style.transform).toBe('')
|
||||
expect(wrapper.style.transformOrigin).toBe('')
|
||||
})
|
||||
})
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user