M6(2/n): 治理台九功能 + SSE 订阅层 + 读/治分权

治理台按 §9.1 拆成九个 gov-* feature,共用件落 shared/gov:
  · 外壳(左轨/顶栏/面包屑/页签/整页下钻)自原型 Governance.tsx 平移,
    DOM 与 g-* 类名原样;路由状态即应用状态,区/页签/下钻栈全编码进 hash 可深链
  · 编排画布 diagram-js 画布件 1:1 平移(flow-layout/flow-node-paint/FlowDiagram),
    新增 pkg-to-graph 把 ProcessPackage 转成画布图模型;统一报价 v1 全图 12 节点 15 边渲染通过
  · 后端补四路由:审批单 / 工作流下钻 / 通道实例 / 度量仪表

SSE 订阅层(§9.2):app 层单一连接,按信封目标失效缓存;
组件不再自行轮询(去掉 refetchInterval)。广播只说「哪个目标动了」,不带业务载荷,
且在投递已落库已送达之后才发 —— 不是第二条投递链路。

两处实质修正:
  · 治理路由一律要 govern → 读路由改要 read。客体三类 × 动作三种的分法就是为此:
    BD 有 task:read 能看在途、动不了控制事件;一律 govern 等于把三种动作压成一种
  · 控制事件/恢复/改派原记为 engine-transition(归机器产出)→ 新增 control 条目种类,
    归人裁决侧。归侧是按动作类型的纯推导,所以「谁干的」必须体现在 kind 上;
    否则人的叫停会被算进自主率的机器分子

判据 ⑩ 治理台一半跑通:在途监控 / 叫停 / 恢复,治理动作留痕可查。
无权查看不再画成空清单,按岗位说明缺哪一项。

gates: tsc / eslint / depcruise(286 模块)/ api-report / 360 测试 全绿

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01KeDBx2PHLavbURXB8LJJ7m

apps/web/src/features/gov-process/internal/panel.tsx

@@ -0,0 +1,169 @@
+/**
+ * feature `gov-process` —— 流程包编排画布(diagram-js 画布件平移):连线即映射、画图即校验、不闭合不得发布
+ *
+ * 自 `~/coding/JCAI_PRD/governance/_components/Governance.tsx` 平移:
+ * DOM 结构、类名(`g-*` + 色调 `t-*`)与文案原样保留,mock 常量换成服务端投影(README 平移规则 1/2/4)。
+ * 区首页只负责导航,治理动作一律落在下钻详情页的**就地确认带**(影响预览三必答)。
+ */
+import { useState } from 'react';
+import { useMutation, useQueryClient } from '@tanstack/react-query';
+import {
+  publishProcessRoute,
+} from '@contracts';
+import type { ClosureReport } from '@contracts';
+import { call } from '@web-shared/typed-fetch.ts';
+import { Chip, Entry, NList, NRow, Note, PageHead, QueryGate, Sec, St } from '@web-shared/gov/primitives.tsx';
+import type { Nav } from '@web-shared/gov/gov-route.ts';
+import {
+  useGovPackages,
+} from '@web-shared/gov/gov-api.ts';
+import { FlowFigure } from '@web-shared/gov/flow/FlowFigure.tsx';
+
+export type HomeProps = { tab: string; nav: Nav };
+
+export function WorkflowsHome({ nav }: HomeProps) {
+  const q = useGovPackages();
+  const packages = q.data?.packages ?? [];
+  return (
+    <QueryGate query={q}>
+    <>
+      <Note>
+        编排即定契约——<b>连线即映射、画图即校验</b>,边不闭合不得发布。流程包是设计态的定义,工作流是它的运行时实例。
+      </Note>
+      <NList>
+        {packages.map((p) => {
+          const published = p.state === 'published';
+          return (
+            <NRow
+              key={`${p.id}@${p.version}`}
+              tone={published ? 'ok' : 'warn'}
+              ico="workflow"
+              title={p.name}
+              sub={`${p.id} · v${p.version}`}
+              cols={[
+                { k: '节点', v: p.nodes.length },
+                { k: '边', v: p.edges.length },
+                { k: '活动', v: p.nodes.filter((n) => n.kind === 'activity').length },
+              ]}
+              right={
+                <St tone={published ? 'ok' : 'warn'} ico={published ? 'circle-check' : 'file-pen'}>
+                  {published ? '已发布' : '草稿'}
+                </St>
+              }
+              onClick={() => nav.push({ k: 'pkg', id: `${p.id}@${p.version}` })}
+            />
+          );
+        })}
+      </NList>
+    </>
+    </QueryGate>
+  );
+}
+
+/* ---------------- ④ 触发器配置 ---------------- */
+
+/** 治理写动作统一入口:成功即失效相关查询,画面由服务端重投影 */
+function useGovAction<TInput>(mutate: (input: TInput) => Promise<unknown>, keys: readonly string[]) {
+  const queryClient = useQueryClient();
+  return useMutation({
+    mutationFn: mutate,
+    onSuccess: () => {
+      for (const key of keys) void queryClient.invalidateQueries({ queryKey: ['gov', key] });
+    },
+  });
+}
+
+/* ---------------- 工作流 ---------------- */
+
+export function PkgPage({ id, nav }: { id: string; nav: Nav }) {
+  const [pid, versionText] = id.split('@');
+  const q = useGovPackages();
+  const [report, setReport] = useState<ClosureReport | undefined>(undefined);
+  const pkg = (q.data?.packages ?? []).find((p) => p.id === pid && String(p.version) === versionText);
+
+  const publish = useGovAction(
+    () => call<ClosureReport>(publishProcessRoute, { params: { id: pid!, version: versionText! } }).then((r) => setReport(r)),
+    ['process'],
+  );
+
+  if (pkg === undefined) return <Note>流程包不存在。</Note>;
+  const published = pkg.state === 'published';
+
+  return (
+    <>
+      <PageHead
+        ico="workflow"
+        tone={published ? 'ok' : 'warn'}
+        kicker={`流程包 · ${pkg.id} v${pkg.version}`}
+        title={pkg.name}
+        chips={
+          <>
+            <Chip tone={published ? 'ok' : 'warn'}>{published ? '已发布' : '草稿'}</Chip>
+            <Chip ico="circle-dot">{pkg.nodes.length} 节点</Chip>
+            <Chip ico="git-branch">{pkg.edges.length} 边</Chip>
+          </>
+        }
+        desc="编排即定契约——连线即映射、画图即校验,边不闭合不得发布。"
+        acts={[
+          {
+            label: '发布',
+            ico: 'upload',
+            primary: true,
+            disabled: published,
+            ask: {
+              title: `发布流程包:${pkg.name} v${pkg.version}`,
+              note: <Note tone="warn">发布前跑闭合校验:任一违规即拒绝,不存在「带病发布」。</Note>,
+              impact: { who: '此后新起单按此版本执行;在途工作流仍按其起单时的版本', undo: '可发新版本覆盖,不可回改本版', when: '校验通过后即时' },
+              okLabel: '确认发布',
+              onOk: () => publish.mutate(undefined),
+            },
+          },
+        ]}
+      />
+
+      {report !== undefined && (
+        <Note tone={report.publishable ? 'ok' : 'warn'}>
+          {report.publishable ? '闭合校验通过 —— 已发布。' : `闭合校验未过:${report.violations.map((v) => v.message).join(';')}`}
+        </Note>
+      )}
+
+      <Sec ico="git-branch" title="编排画布">
+        <FlowFigure pkg={pkg} instances={[]} />
+      </Sec>
+
+      <Entry ico="arrow-left-right" title="边映射" desc="连线即映射:每条边把上游输出口装配成下游输入" onClick={() => nav.push({ k: 'edges', id })} />
+    </>
+  );
+}
+
+export function EdgesPage({ id }: { id: string }) {
+  const [pid, versionText] = id.split('@');
+  const q = useGovPackages();
+  const pkg = (q.data?.packages ?? []).find((p) => p.id === pid && String(p.version) === versionText);
+  if (pkg === undefined) return <Note>流程包不存在。</Note>;
+  const labelOf = (nodeId: string) => pkg.nodes.find((n) => n.id === nodeId)?.label ?? nodeId;
+  return (
+    <>
+      <PageHead ico="arrow-left-right" kicker={`边映射 · ${pkg.id} v${pkg.version}`} title={pkg.name} desc="边上的字段装配就是下游活动的输入契约:装配不上,校验期就拦下。" />
+      <NList>
+        {pkg.edges.map((e, i) => (
+          <NRow
+            key={i}
+            tone={e.reopen ? 'warn' : 'brand'}
+            ico={e.reopen ? 'rotate-ccw' : 'arrow-right'}
+            title={`${labelOf(e.from)} → ${labelOf(e.to)}`}
+            sub={e.condition === undefined ? undefined : `条件 · ${e.condition}`}
+            cols={[
+              { k: '类别', v: e.reopen ? '回边 · 重开新实例' : '正向' },
+              { k: '字段装配', v: <span className="g-mono">{e.mapping.length}</span> },
+            ]}
+            onClick={() => undefined}
+          />
+        ))}
+      </NList>
+    </>
+  );
+}
+
+/* ---------------- 触发器 ---------------- */
+