资料文件真产出来了;E04/I01 补到验收线,顺手填了几个「墙拦住却不给路」的坑

**资料文件全链**(用户:审核资料这一步要真产出 word/excel/md/html,前端能渲、点资料名能开) 接手时这一步一个文件都产不出来 —— S3 剧本白纸黑字写着「file_ref 本 MVP 阶段可留空」。文件是台账那一行的投影,不另存一份: · 声明 `file:{titleColumn,bodyColumn,formatColumn}`,它同时是授权面(没声明就点不开) · 现造真字节 —— docx/xlsx 是自己打的 OOXML 包(zip-write:store+CRC32,零依赖) · 读回来渲 —— 解的就是造出来那份字节,渲得出来才证明文件是真的 · 件上 `data-file-of` → 工作区二级界面(Word 纸面/Excel 网格/渲好的 md/沙箱 html)+ 下载原件放行落地前把每一份冻进 `sys.task_asset_file`(迁移 0029):归档件点开的必须是签字那一刻那一份,而资料落在主数据上、试跑单不落正式表 —— 不存这一份,收工后一个都点不开。工作成果里「产出的资料」自成一摞。Markdown 富文本渲染顺带销账(仍零依赖)。 **Harness** · 画面按「这一拍办完之后」在办的那一步挑 —— 从前拿拍首的局面决定拍尾的事: 收掉 S4、发出 S5 的卡,而屏上还摆着 S4 的只读件,人无处可填(墙要配路第四次现形) · 验收「重做」真能退回重做,且打回后台账没动就不许再提交(软硬两段,不锁死单子) · 立监听的授权面是清单声明;发卡的授权面是调人预算,不是计划项 · 读工具同参重调有兜底;空转写身后还有行动就不废串;finish 的 doneWhen 按写完后的草稿算 **界面** · 翻件与翻页各归各位(从前二选一,多卡多页时页翻不动);没得翻写「—」不写 0/0 · 工作成果详情能翻份;表宽超出能横滑(E04/I01 抄版式时把 overflow-x 抄丢了) · 查看面灰底滚过一屏变白 —— 两条独立的路都治了(沙箱内不同色 / 弹性子项不长个) · 测试台「取不到」不再当成「还活着」 **活动** E04 关系覆盖、I01 品牌内容各自补到验收线:判据全读基座数、判据指向的东西摆上卡面、样例满载且名字 ≤14 字;提交前要裁的判据搬进说明书(模型会压拍,压过之后只有说明书还在)。验收:e2e i01 4/4、e04 3/3 全部 released,资料在办中渲得出、放行后存了档点得开; 门禁 typecheck/lint/depcruise/1628 测全绿。 Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01EEJX8Z7CHejvwmDQyPQuBX
2026-08-24 10:26:45 +08:00
parent 70e83d0b09
commit 0aa2fc11b0
92 changed files with 13984 additions and 370 deletions
@@ -38,6 +38,13 @@ export type ViewContainerProps = {
  readonly editable?: boolean;
  /** 人按下「保存」时把那张表收上来;不传就是纯呈现 */
  readonly onEdits?: (save: ViewSave) => void;
+  /**
+   * **件上的资料名被点了** —— 收到 `data-file="域.对象/主键值"` 那一下。
+   *
+   * 容器只报「点的是哪一份」,取文件、渲文件都不在这儿:这份组件的本分是
+   * 把沙箱里发生的事如实交出去,至于跳到哪一屏是工作区的事。
+   */
+  readonly onOpenFile?: (ref: { address: string; key: string }) => void;
  /**
   * **多页件**(2026-08-02 用户:「一个执行单可以派多个 HTML 待执行报告,
   * 合理利用右上角的翻页」):件里带 `data-page` 的可见段各算一页,
@@ -103,7 +110,12 @@ function morphNode(oldEl: Element, newEl: Element): void {
    const bothElements = o.nodeType === Node.ELEMENT_NODE && n.nodeType === Node.ELEMENT_NODE;
    if (!bothElements) {
      if (o.nodeType !== n.nodeType) (o as ChildNode).replaceWith(n);
-      else if (o.textContent !== n.textContent) o.textContent = n.textContent;
+      else if (o.textContent !== n.textContent) {
+        o.textContent = n.textContent;
+        // textarea 的拟值在正文:拟值真变了,活值跟上(与 input 的 value 同一条规矩)
+        const owner = o.parentElement;
+        if (owner?.tagName === 'TEXTAREA') (owner as HTMLTextAreaElement).value = n.textContent ?? '';
+      }
      continue;
    }
    morphNode(o as Element, n as Element);
@@ -154,13 +166,42 @@ function bodyOf(doc: Document, address: string): HTMLElement | null {
  return doc.querySelector<HTMLElement>(`[data-edit="${CSS.escape(address)}"]`);
 }

-/** 一张表的输入格子;`gone` 的行(人删掉的)不算在内 */
-function cellsOf(doc: Document, address: string): HTMLInputElement[] {
+/**
+ * 一个格子所在的那一行 —— **host 的直接子元素**,不管格子本身嵌了几层。
+ *
+ * 自动孪生的格子(`twinInputs` 写出来的)是 `<td><input></td>`,往上两层正好是行;
+ * 手写的三选一(`.jc-radiogrp` 套一层 `<label>`)是 `<td><div><label><input></label></div></td>`,
+ * 往上两层只到得了那个 radio 组的 `<div>` —— **每个 radio 组各算一行**,同一张表格里
+ * 三组三行、真正的行反倒被拆成了 N 个碎片,主键那一列(在别的 td 里)一个也进不去这些碎片。
+ * 一路往上走到 host 的直接子元素为止,不管中间嵌了几层都能对上真正的那一行。
+ */
+function rowOf(host: Element, cell: Element): Element | null {
+  let node: Element | null = cell;
+  while (node !== null && node.parentElement !== host) node = node.parentElement;
+  return node;
+}
+
+/** 可改格子的三种控件 —— 文本输入 / 下拉 / 多行文本,同源同待 */
+type EditCell = HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement;
+
+/** 一张表的输入格子;`gone` 的行(人删掉的)不算在内。下拉与多行文本(textarea)与文本输入同源同待 */
+function cellsOf(doc: Document, address: string): EditCell[] {
  const host = bodyOf(doc, address);
  if (host === null) return [];
-  return Array.from(host.querySelectorAll<HTMLInputElement>('input[data-col]')).filter(
-    (i) => i.closest('.jc-row-gone') === null,
-  );
+  return Array.from(
+    host.querySelectorAll<EditCell>('input[data-col], select[data-col], textarea[data-col]'),
+  ).filter((i) => i.closest('.jc-row-gone') === null);
+}
+
+/**
+ * **「没答」= 「不改」**——radio 一组都没点、下拉停在空占位,是同一句话的两种写法。
+ * 三选一没有第四态可以表达「维持原值」,只能靠「没有一个是选中的」;下拉同理,靠
+ * `<option value="">` 这个空占位表达「还没选」。跳过这一格,原值在台账里原样留着。
+ */
+export function unanswered(cell: EditCell): boolean {
+  if (cell.type === 'radio') return !(cell as HTMLInputElement).checked;
+  if (cell.type === 'select-one') return cell.value === '';
+  return false;
 }

 /**
@@ -170,19 +211,21 @@ function cellsOf(doc: Document, address: string): HTMLInputElement[] {
 * (删掉第 2 行,余下的仍是 0/2/3 —— 拿它当下标会在中间留一个洞)。
 * 认行元素则怎么增删都对得上:同一个 `<tr>` 里的格子就是同一行。
 */
-function collect(doc: Document, address: string): Array<Record<string, string>> {
+export function collect(doc: Document, address: string): Array<Record<string, string>> {
+  const host = bodyOf(doc, address);
+  if (host === null) return [];
  const byRow = new Map<Element, Record<string, string>>();
  for (const cell of cellsOf(doc, address)) {
    const col = cell.dataset['col'];
-    const row = cell.parentElement?.parentElement ?? cell.parentElement;
+    const row = rowOf(host, cell);
    if (col === undefined || row == null) continue;
    /*
-     * **radio 选项:没选中的不算话,一组都没选 = 这一列不动**(2026-08-02,
-     * A2 替代等级三选)。radio 的 `value` 是选项值,恒有 —— 照 text 那样读,
-     * 三个选项互相覆盖、没人点过也会交出一个值,把台账里的原值抹掉;
-     * 跳过整列则原值保留:「没点」的意思是「不改」,不是「清空」。
+     * **radio 选项 / 下拉:没答的不算话,没答 = 这一列不动**(2026-08-02,
+     * A2 替代等级三选;2026-08-20 扩到下拉)。radio 的 `value` 是选项值,恒有;
+     * 下拉一旦渲染也恒有一个 `.value`(哪怕是空占位)—— 都照 text 那样读的话,
+     * 没人碰过也会交出一个值,把台账里的原值抹掉;跳过则原值保留。
     */
-    if (cell.type === 'radio' && !cell.checked) continue;
+    if (unanswered(cell)) continue;
    const one = byRow.get(row) ?? {};
    one[col] = cell.value;
    byRow.set(row, one);
@@ -212,10 +255,10 @@ function collect(doc: Document, address: string): Array<Record<string, string>>
 */
 function mirrorTwins(doc: Document, address: string): void {
  for (const cell of cellsOf(doc, address)) {
-    // 与 collect 同一条规矩:没选中的 radio 不算话(「没点」= 不改)
-    if (cell.type === 'radio' && !cell.checked) continue;
+    // 与 collect 同一条规矩:没答的不算话(「没点/没选」= 不改)
+    if (unanswered(cell)) continue;
    const twin = cell.previousElementSibling;
-    if (twin === null || twin.tagName === 'INPUT') continue;
+    if (twin === null || twin.tagName === 'INPUT' || twin.tagName === 'SELECT' || twin.tagName === 'TEXTAREA') continue;
    twin.textContent = cell.value;
  }
 }
@@ -248,7 +291,9 @@ function addRow(doc: Document, address: string): boolean {
  const fresh = last.cloneNode(true) as HTMLElement;
  fresh.classList.remove('jc-row-gone');
  fresh.classList.add('jc-row-new');
-  for (const cell of Array.from(fresh.querySelectorAll<HTMLInputElement>('input[data-col]'))) {
+  for (const cell of Array.from(
+    fresh.querySelectorAll<EditCell>('input[data-col], select[data-col], textarea[data-col]'),
+  )) {
    cell.value = '';
    // 序号不再有意义(见 `collect` 的注释),清掉免得两行同号
    delete cell.dataset['row'];
@@ -261,7 +306,23 @@ function addRow(doc: Document, address: string): boolean {
  return true;
 }

-export function ViewContainer({ html, title = '活动视图', editable = false, onEdits, page, onPages }: ViewContainerProps) {
+/**
+ * `data-file="域.对象/主键值"` → 取文件要的那两样。
+ *
+ * 认第一个斜杠:主键值里再有斜杠也照样归主键(文件名常带 `/`,地址永远不带)。
+ * 缺一半的一律不认 —— 宁可点不动,也不发一个取不回来的请求。
+ */
+export function fileRefOf(raw: string | null): { address: string; key: string } | undefined {
+  const ref = raw ?? '';
+  const at = ref.indexOf('/');
+  if (at <= 0 || at === ref.length - 1) return undefined;
+  const address = ref.slice(0, at);
+  // 地址必须是「域.对象」两段 —— 形状不对就不是一份资料的地址
+  if (!/^[a-z][\w]*\.[a-z][\w]*$/i.test(address)) return undefined;
+  return { address, key: ref.slice(at + 1) };
+}
+
+export function ViewContainer({ html, title = '活动视图', editable = false, onEdits, onOpenFile, page, onPages }: ViewContainerProps) {
  const ref = useRef<HTMLIFrameElement>(null);
  const [height, setHeight] = useState(FALLBACK_HEIGHT);
  /*
@@ -279,7 +340,13 @@ export function ViewContainer({ html, title = '活动视图', editable = false,
    const marked = Array.from(doc.body.querySelectorAll<HTMLElement>('[data-page]'));
    for (const el of marked) el.style.removeProperty('display');
    const visible = marked.filter((el) => doc.defaultView?.getComputedStyle(el).display !== 'none');
-    onPagesRef.current?.(visible.length);
+    /*
+     * **一份不分页的件是「一页」,不是「零页」**(2026-08-23 用户:「这个 0/0 显示的
+     * 不正常」)。绝大多数件压根没写 `data-page`(整篇铺开就是全部内容)——
+     * 从前这里如实回报 0,外层拿它去写页码,屏上就出「0/0」。
+     * 页数报的是**这份件有几页**,件在手上,再少也是一页。
+     */
+    onPagesRef.current?.(Math.max(1, visible.length));
    // 不传 page(如工作成果的静态归档)= 不分页,全部照常纵排
    if (pageRef.current === undefined || visible.length <= 1) return;
    const current = Math.min(pageRef.current, visible.length - 1);
@@ -323,6 +390,8 @@ export function ViewContainer({ html, title = '活动视图', editable = false,
   */
  const sink = useRef(onEdits);
  sink.current = onEdits;
+  const fileSink = useRef(onOpenFile);
+  fileSink.current = onOpenFile;
  /** 进编辑态那一刻的样子 —— 「取消」要还原成它(值 + 那时有几行) */
  const snapshot = useRef(new Map<string, { values: string[]; rows: number }>());

@@ -350,10 +419,23 @@ export function ViewContainer({ html, title = '活动视图', editable = false,
     * 认能力不认血统:有 `closest` 就当它是元素。
     */
    const target = event.target as { closest?: (s: string) => HTMLElement | null } | null;
-    const hit =
-      typeof target?.closest === 'function'
-        ? target.closest('[data-edit-open],[data-edit-cancel],[data-edit-save],[data-edit-add],[data-edit-del]')
-        : null;
+    if (typeof target?.closest !== 'function') return;
+
+    /*
+     * **资料名:点开那一份文件** —— 先看这一条,再看编辑闸。
+     * 两者不会同时命中(一个在表格格子里、一个在闸上),先后只是省一次匹配。
+     */
+    const fileHit = target.closest('[data-file]');
+    if (fileHit !== null && fileHit !== undefined) {
+      const ref = fileRefOf(fileHit.getAttribute('data-file'));
+      if (ref !== undefined) {
+        event.preventDefault();
+        fileSink.current?.(ref);
+      }
+      return;
+    }
+
+    const hit = target.closest('[data-edit-open],[data-edit-cancel],[data-edit-save],[data-edit-add],[data-edit-del]');
    if (hit === null || hit === undefined) return;
    event.preventDefault();

@@ -380,7 +462,7 @@ export function ViewContainer({ html, title = '活动视图', editable = false,
      // 快照按下「编辑」那一刻的样子:值 + 那时的行数 —— 「取消」两样都要还原
      // (radio 的 value 是恒定的选项值,快照与还原认的是 checked)
      snapshot.current.set(open, {
-        values: cellsOf(doc, open).map((c) => (c.type === 'radio' ? (c.checked ? '1' : '') : c.value)),
+        values: cellsOf(doc, open).map((c) => (c.type === 'radio' ? ((c as HTMLInputElement).checked ? '1' : '') : c.value)),
        rows: Array.from(bodyOf(doc, open)?.children ?? []).length,
      });
      setOpen(open, true);
@@ -398,7 +480,7 @@ export function ViewContainer({ html, title = '活动视图', editable = false,
        cellsOf(doc, cancel).forEach((c, i) => {
          const saved = was.values[i];
          if (saved === undefined) return;
-          if (c.type === 'radio') c.checked = saved === '1';
+          if (c.type === 'radio') (c as HTMLInputElement).checked = saved === '1';
          else c.value = saved;
        });
      }