M6(1/n): 工作台任务要素 —— 原型 1:1 平移的第一屏

样式整文件搬(README 平移规则 1):app.css 2767 行 + proto.vendor.css +
theme.css + console.css 原样搬,设计令牌与全部 jc-* / g-* 类名不动。

前端(按 §9 重排,渲染输出 1:1):
- shared/:Ico / ScrollArea / useChatWidth 自原型搬,去掉 "use client" 等 Next 专有件;
  失效的 react-hooks disable 指令按 §17 清掉(不改渲染)
- shared/typed-fetch.ts:服务端交互唯一通道,路由契约来自 @contracts/api;
  不引 Hono RPC 客户端(那要求前端 import 后端类型,违反 §5.1)
- app/query.ts:TanStack Query;缓存失效由订阅层驱动,组件不轮询
- features/desk-task:任务列表(一条 = 一个活动的一次运行,不是一整条工作流)/
  标题区 + 工作区四页签 / 对话区(气泡二元制 + 卡族 + **composer 锁**)
- @ui:ViewContainer 用**沙箱 iframe(sandbox 不含 allow-scripts)** —— 结构上无脚本执行权,
  不依赖净化算法的完备性;ViewBlocks 渲染十一种视图块
  feature 不得自行 dangerouslySetInnerHTML,eslint 有规则守着

后端:工作台路由 /api/desk/*(任务清单 / 任务详情 / 工单回传 / 自由输入 / 消息);
回传与后端校验**同 schema**;任务详情是服务端投影 —— 前端零过程状态,刷新即重建

已验证(真机):任务卡「A1 RFQ需求分析 · 序位 1/7 · awaiting-event」、
预算 2/40 步、1 张工单(LLM 步失败后转人兜底那张)、7 行带归侧标签的任务日志

358 个测试通过,门禁五道全绿;web 构建通过

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01KeDBx2PHLavbURXB8LJJ7m
This commit is contained in:
JCAI Main Agent
2026-07-27 02:45:42 +08:00
co-authored by Claude Opus 5
parent 3df8becf67
commit 3cfaa04098
27 changed files with 6966 additions and 10 deletions
+14 -3
View File
@@ -1,16 +1,27 @@
/**
* apps/web 唯一组装层(编码规范 §9):路由、Provider、鉴权壳、SSE 连接。
* M0:骨架 —— 两台原型的 1:1 平移自 M6 起(README《前端 UI · 原型 1:1 平移》)。
* apps/web 唯一组装层(编码规范 §9):Provider、鉴权壳、SSE 连接。
* 样式整文件搬自两台原型:设计令牌 + 全部 `jc-*` 组件样式 + vendor 皮肤。
*/
import { StrictMode } from 'react';
import { createRoot } from 'react-dom/client';
import { QueryClientProvider } from '@tanstack/react-query';
import './styles/proto.vendor.css';
import './styles/app.css';
import './styles/theme.css';
import './styles/console.css';
import { AppShell } from './app-shell.tsx';
import { queryClient } from './query.ts';
const container = document.getElementById('root');
if (!container) throw new Error('#root 缺失');
createRoot(container).render(
<StrictMode>
<AppShell />
<QueryClientProvider client={queryClient}>
{/* .proto-root 是设计令牌的作用域(原型 app.css 的 `.proto-root .app-shell`) */}
<div className="proto-root">
<AppShell />
</div>
</QueryClientProvider>
</StrictMode>,
);