Upload 2 files

static/app.js

@@ -28,6 +28,10 @@ const STATE = {
   facetHasMore: { source: false, author: false, tag: false },
   leftOpen: true,
   preview: "",
+  compare: "",
+  proofread: false,
+  proofreadFile: "",
+  proofreadPage: "",
   isDark: true,
   isMobile: false,
   filterSearch: { source: "", author: "", tag: "" },
@@ -46,6 +50,7 @@ const PERIOD_PRESETS = [
   { label: "2012-", from: "20121115", to: "" },
 ];
 const TAG_TYPES = ["文稿大类", "文稿类型", "地点", "人物", "出版方/发行方", "主题/事件", "记录", "审核", "翻译", "翻印/传抄"];
+const PART_TYPES = ["appellation", "title", "authors", "place", "subtitle", "subtitle2", "subtitle3", "subtitle4", "subtitle5", "subdate", "paragraph", "quotation", "signature", "image", "image_description"];
 
 const DOM = {};
 
@@ -145,6 +150,10 @@ function parseUrl() {
   STATE.filterPage.author = Math.max(1, parseInt(params.get("author_page") || "1", 10) || 1);
   STATE.filterPage.tag = Math.max(1, parseInt(params.get("tag_page") || "1", 10) || 1);
   STATE.preview = params.get("preview") || "";
+  STATE.compare = params.get("compare") || "";
+  STATE.proofread = params.get("proofread") === "1";
+  STATE.proofreadFile = params.get("source_file") || "";
+  STATE.proofreadPage = params.get("source_page") || "";
 }
 
 function syncUrl(replace = true) {
@@ -177,6 +186,10 @@ function syncUrl(replace = true) {
   if (STATE.filterPage.author > 1) params.set("author_page", String(STATE.filterPage.author));
   if (STATE.filterPage.tag > 1) params.set("tag_page", String(STATE.filterPage.tag));
   if (STATE.preview) params.set("preview", STATE.preview);
+  if (STATE.compare) params.set("compare", STATE.compare);
+  if (STATE.proofread) params.set("proofread", "1");
+  if (STATE.proofreadFile) params.set("source_file", STATE.proofreadFile);
+  if (STATE.proofreadPage) params.set("source_page", STATE.proofreadPage);
   const url = params.toString() ? `/?${params.toString()}` : "/";
   if (STATE.preview) {
     const closeParams = new URLSearchParams(params);
@@ -593,6 +606,10 @@ function closePreview(useHistory = false) {
     return;
   }
   STATE.preview = "";
+  STATE.compare = "";
+  STATE.proofread = false;
+  STATE.proofreadFile = "";
+  STATE.proofreadPage = "";
   clearPreviewDom();
   renderResults();
   syncUrl();
@@ -1283,6 +1300,11 @@ async function restorePreview(scroll = true) {
     document.body.classList.add("preview-open");
     previewAbortController = null;
     DOM.emptyState.style.display = "none";
+    if (STATE.proofread) {
+      openProofread(item, null, true);
+    } else if (STATE.compare) {
+      comparePreview(STATE.compare, true);
+    }
     const previewBody = DOM.previewPanel.querySelector(".preview-body");
     if (scroll && previewBody) previewBody.scrollTo({ top: 0, behavior: "smooth" });
   } catch (error) {
@@ -1297,6 +1319,10 @@ function openPreview(docId, scroll = true) {
   const replacingPreview = history.state && history.state.previewEntry === true;
   if (!replacingPreview) previewResultsScrollTop = DOM.results.scrollTop;
   STATE.preview = docId;
+  STATE.compare = "";
+  STATE.proofread = false;
+  STATE.proofreadFile = "";
+  STATE.proofreadPage = "";
   applyStateToDom();
   syncUrl(replacingPreview);
   restorePreview(scroll);
@@ -1425,9 +1451,18 @@ function compareSelectHTML(item) {
 
 function textDelta(original, edited) {
   if (original === edited) return "";
-  const removed = original ? `-${original.length}` : "";
-  const added = edited ? `+${encodeURI(edited).replace(/%20/g, " ")}` : "";
-  return [removed, added].filter(Boolean).join("\t");
+  let prefix = 0;
+  while (prefix < original.length && prefix < edited.length && original[prefix] === edited[prefix]) prefix += 1;
+  let suffix = 0;
+  while (suffix < original.length - prefix && suffix < edited.length - prefix && original[original.length - 1 - suffix] === edited[edited.length - 1 - suffix]) suffix += 1;
+  const removedLength = original.length - prefix - suffix;
+  const inserted = edited.slice(prefix, edited.length - suffix);
+  return [
+    prefix ? `=${prefix}` : "",
+    removedLength ? `-${removedLength}` : "",
+    inserted ? `+${encodeURI(inserted).replace(/%20/g, " ")}` : "",
+    suffix ? `=${suffix}` : "",
+  ].filter(Boolean).join("\t");
 }
 
 function partTextWithPivots(article, partIndex) {
@@ -1455,21 +1490,42 @@ function proofreadHTML(item) {
   const article = item.article || {};
   const sourceFiles = item.source_files || [];
   const requestedPage = Math.max(1, Number(article.page_start) || 1);
-  const defaultFile = sourceFiles.length > 1 ? Math.min(sourceFiles.length - 1, requestedPage - 1) : 0;
+  const defaultFile = STATE.proofreadFile !== "" ? Math.max(0, Math.min(sourceFiles.length - 1, Number(STATE.proofreadFile) || 0)) : (sourceFiles.length > 1 ? Math.min(sourceFiles.length - 1, requestedPage - 1) : 0);
   const sourceOptions = sourceFiles.map((file) => `<option value="${file.index}" ${Number(file.index) === defaultFile ? "selected" : ""}>${escapeHTML(file.name)}</option>`).join("");
   const sourcePicker = sourceFiles.length > 1 ? `<select data-proofread-source-file aria-label="选择原文件">${sourceOptions}</select>` : "";
-  const pdfPage = sourceFiles.length === 1 ? `#page=${requestedPage}` : "";
-  const parts = (article.parts || []).map((part, index) => `<label class="proofread-field proofread-part" data-proofread-part="${index}"><span>段落 ${index + 1} / ${escapeHTML(part.type || "正文")}</span><textarea data-proofread-part-input="${index}">${escapeHTML(partTextWithPivots(article, index))}</textarea></label>`).join("");
+  const selectedUrl = sourceFiles[defaultFile] && sourceFiles[defaultFile].url || "";
+  const page = Math.max(1, Number(STATE.proofreadPage) || requestedPage);
+  const pdfPage = /\.pdf(?:$|\?)/i.test(selectedUrl) ? `#page=${page}` : "";
+  const partTypeOptions = (current) => PART_TYPES.map((type) => `<option value="${type}" ${type === current ? "selected" : ""}>${type}</option>`).join("");
+  const parts = (article.parts || []).map((part, index) => `<div class="proofread-part-group" data-proofread-part-group="${index}"><div data-part-insert-before></div><label class="proofread-field proofread-part" data-proofread-part="${index}"><span>段落 ${index + 1} / <select data-proofread-part-type="${index}">${partTypeOptions(part.type || "paragraph")}</select></span><span class="proofread-part-actions"><button type="button" class="text-btn-sm" data-add-part-before="${index}">前插入</button><button type="button" class="text-btn-sm" data-add-part-after="${index}">后插入</button><button type="button" class="text-btn-sm" data-delete-part="${index}">删除</button></span><textarea data-proofread-part-input="${index}">${escapeHTML(partTextWithPivots(article, index))}</textarea></label><div data-part-insert-after></div></div>`).join("");
   const comments = (article.comments || []).map((comment, index) => `<label class="proofread-field"><span>注释 ${index + 1}</span><textarea data-proofread-comment="${index}">${escapeHTML(comment)}</textarea></label>`).join("");
   const tags = Array.isArray(article.tags) ? article.tags : [];
   const actions = `<div class="preview-tools"><button type="button" class="icon-btn-sm" data-close-preview aria-label="关闭预览">×</button></div>`;
-  return `<div class="preview-header"><div class="preview-heading">${previewTitleHTML(item)}<div class="preview-compare-note">对比原文件并校对</div></div><div class="preview-actions">${actions}</div></div><div class="proofread-grid"><section class="proofread-source"><div class="proofread-pane-header"><span>原文件</span>${sourcePicker}</div><iframe data-proofread-source title="原文件" src="/api/download/source/${encodeURIComponent(item.doc_id)}?file=${defaultFile}&inline=true${pdfPage}"></iframe></section><form class="proofread-editor" data-proofread-form><div class="proofread-pane-header"><span>校订内容</span><button type="submit" class="result-action-btn primary">提交校订</button></div><fieldset><legend>文章元数据</legend><label class="proofread-field"><span>标题</span><input data-meta-title value="${escapeHTML(article.title || item.title || "")}"></label><label class="proofread-field"><span>作者</span>${listEditorHTML("authors", article.authors || item.authors || [], [{ key: "value", label: "作者" }])}</label><label class="proofread-field"><span>日期</span>${listEditorHTML("dates", article.dates || [], [{ key: "year", label: "年", type: "number" }, { key: "month", label: "月", type: "number" }, { key: "day", label: "日", type: "number" }])}</label><label class="proofread-field"><span>标签</span>${listEditorHTML("tags", tags, [{ key: "name", label: "名称" }, { key: "type", label: "类型", options: TAG_TYPES }])}</label></fieldset><fieldset><legend>来源元数据</legend><label class="proofread-field"><span>来源名称</span><input data-source-name value="${escapeHTML(item.publication_name || "")}"></label><label class="proofread-field"><span>来源作者</span><input data-source-author value="${escapeHTML(item.publication_author || "")}"></label><label class="proofread-field"><span>来源类型</span><input data-source-type value="${escapeHTML(item.publication_type || "")}"></label><label class="proofread-field"><span>来源文件</span>${listEditorHTML("files", sourceFiles.map((file) => file.url), [{ key: "value", label: "URL" }])}</label></fieldset><fieldset><legend>正文</legend><label class="proofread-field"><span>描述</span><textarea data-proofread-description>${escapeHTML(article.description || "")}</textarea></label>${parts}</fieldset><fieldset><legend>注释</legend>${comments || '<div class="proofread-empty">无注释</div>'}</fieldset><label class="proofread-field"><span>说明</span><textarea data-proofread-note maxlength="2000"></textarea></label></form></div>`;
+  return `<div class="preview-header"><div class="preview-heading">${previewTitleHTML(item)}<div class="preview-compare-note">对比原文件并校对</div></div><div class="preview-actions">${actions}</div></div><div class="proofread-grid"><section class="proofread-source"><div class="proofread-pane-header"><span>原文件</span>${sourcePicker}</div><iframe sandbox data-proofread-source title="原文件" src="/api/download/source/${encodeURIComponent(item.doc_id)}?file=${defaultFile}&inline=true${pdfPage}"></iframe></section><form class="proofread-editor" data-proofread-form><div class="proofread-pane-header"><span>校订内容</span><button type="submit" class="result-action-btn primary">提交校订</button></div><fieldset><legend>文章元数据</legend><label class="proofread-field"><span>标题</span><input data-meta-title value="${escapeHTML(article.title || item.title || "")}"></label><label class="proofread-field"><span>作者</span>${listEditorHTML("authors", article.authors || item.authors || [], [{ key: "value", label: "作者" }])}</label><label class="proofread-field"><span>日期</span>${listEditorHTML("dates", article.dates || [], [{ key: "year", label: "年", type: "number" }, { key: "month", label: "月", type: "number" }, { key: "day", label: "日", type: "number" }])}</label><label class="proofread-field"><span>标签</span>${listEditorHTML("tags", tags, [{ key: "name", label: "名称" }, { key: "type", label: "类型", options: TAG_TYPES }])}</label></fieldset><fieldset><legend>来源元数据</legend><label class="proofread-field"><span>来源名称</span><input data-source-name value="${escapeHTML(item.publication_name || "")}"></label><label class="proofread-field"><span>来源作者</span><input data-source-author value="${escapeHTML(item.publication_author || "")}"></label><label class="proofread-field"><span>来源类型</span><input data-source-type value="${escapeHTML(item.publication_type || "")}"></label><label class="proofread-field"><span>来源文件</span>${listEditorHTML("files", sourceFiles.map((file) => file.url), [{ key: "value", label: "URL" }])}</label></fieldset><fieldset><legend>正文</legend><label class="proofread-field"><span>描述</span><textarea data-proofread-description>${escapeHTML(article.description || "")}</textarea></label>${parts}</fieldset><fieldset><legend>注释</legend>${comments || '<div class="proofread-empty">无注释</div>'}</fieldset><label class="proofread-field"><span>说明</span><textarea data-proofread-note maxlength="2000"></textarea></label></form></div>`;
 }
 
-function openProofread(item, focusPart = null) {
+function openProofread(item, focusPart = null, restoring = false) {
   if (!item) return;
+  STATE.proofread = true;
+  STATE.compare = "";
+  if (!restoring) syncUrl(true);
   DOM.previewPanel.classList.add("proofread-mode");
   DOM.previewPanel.innerHTML = proofreadHTML(item);
+  const form = DOM.previewPanel.querySelector("[data-proofread-form]");
+  const sourceHeader = DOM.previewPanel.querySelector(".proofread-source .proofread-pane-header");
+  if (sourceHeader && !sourceHeader.querySelector("[data-proofread-page]")) {
+    sourceHeader.insertAdjacentHTML("beforeend", `<label class="proofread-page-control">页码 <input data-proofread-page type="number" min="1" value="${Math.max(1, Number((item.article || {}).page_start) || 1)}"></label>`);
+  }
+  if (form && !form.querySelector("[data-fulltext-box]")) {
+    const text = (item.article && item.article.parts || []).map((_part, index) => partTextWithPivots(item.article, index)).join("\n");
+    form.insertAdjacentHTML("afterbegin", `<div data-fulltext-box hidden><textarea data-fulltext-input>${escapeHTML(text)}</textarea><button type="button" class="text-btn-sm" data-fulltext-apply>应用到段落</button></div>`);
+    const header = form.querySelector(".proofread-pane-header");
+    if (header) header.insertAdjacentHTML("afterbegin", `<button type="button" class="text-btn-sm" data-fulltext-toggle>全文编辑</button>`);
+  }
+  restoreProofreadDraft(item, form);
+  if (!STATE.proofreadFile) { const sourceInput = DOM.previewPanel.querySelector("[data-proofread-source-file]"); STATE.proofreadFile = sourceInput ? sourceInput.value : "0"; }
+  if (!STATE.proofreadPage) { const pageInput = form && form.querySelector("[data-proofread-page]"); STATE.proofreadPage = pageInput ? pageInput.value : String(Math.max(1, Number(item.article && item.article.page_start) || 1)); }
+  if (!restoring) syncUrl(true);
   if (focusPart != null) requestAnimationFrame(() => {
     const input = DOM.previewPanel.querySelector(`[data-proofread-part-input="${focusPart}"]`);
     if (input) input.focus();
@@ -1486,13 +1542,147 @@ function readList(form, kind) {
   }).filter((value) => typeof value === "string" ? Boolean(value) : Object.keys(value).length);
 }
 
+function proofreadDraftKey(docId) {
+  return `bha-proofread-draft:${docId}`;
+}
+
+function safeSessionGet(key) {
+  try { return sessionStorage.getItem(key); } catch (_error) { return null; }
+}
+
+function safeSessionSet(key, value) {
+  try { sessionStorage.setItem(key, value); } catch (_error) { /* private browsing may disable storage */ }
+}
+
+function collectProofreadDraft(form) {
+  if (!form) return null;
+  const lists = {};
+  for (const kind of ["authors", "dates", "tags", "files"]) lists[kind] = readList(form, kind);
+  return {
+    parts: Object.fromEntries([...form.querySelectorAll("[data-proofread-part-input]")].map((input) => [input.dataset.proofreadPartInput, input.value])),
+    comments: Object.fromEntries([...form.querySelectorAll("[data-proofread-comment]")].map((input) => [input.dataset.proofreadComment, input.value])),
+    title: (form.querySelector("[data-meta-title]") || {}).value || "",
+    source: Object.fromEntries(["name", "author", "type"].map((key) => { const input = form.querySelector(`[data-source-${key}]`); return [key, input ? input.value : ""]; })),
+    lists,
+    note: (form.querySelector("[data-proofread-note]") || {}).value || "",
+    description: (form.querySelector("[data-proofread-description]") || {}).value || "",
+    page: (form.querySelector("[data-proofread-page]") || {}).value || "",
+    newParts: [...form.querySelectorAll("[data-proofread-new-part]")].map((row) => ({
+      text: (row.querySelector("textarea") || {}).value || "",
+      type: (row.querySelector("[data-new-part-type]") || {}).value || "paragraph",
+      group: ((row.closest("[data-proofread-part-group]") || {}).dataset || {}).proofreadPartGroup || "",
+      before: Boolean(row.parentElement && row.parentElement.hasAttribute("data-part-insert-before")),
+    })),
+    deleted: Object.fromEntries([...form.querySelectorAll("[data-delete-part]")].filter((button) => button.dataset.proofreadDeleted === "true").map((button) => [button.dataset.deletePart, true])),
+    types: Object.fromEntries([...form.querySelectorAll("[data-proofread-part-type]")].map((input) => [input.dataset.proofreadPartType, input.value])),
+  };
+}
+
+function saveProofreadDraft() {
+  if (!STATE.preview) return;
+  const draft = collectProofreadDraft(DOM.previewPanel.querySelector("[data-proofread-form]"));
+  if (draft) safeSessionSet(proofreadDraftKey(STATE.preview), JSON.stringify(draft));
+}
+
+function restoreProofreadDraft(item, form) {
+  if (!form) return;
+  let draft;
+  try { draft = JSON.parse(safeSessionGet(proofreadDraftKey(item.doc_id)) || "null"); } catch (_error) { draft = null; }
+  if (!draft) return;
+  for (const [index, value] of Object.entries(draft.parts || {})) {
+    const input = form.querySelector(`[data-proofread-part-input="${CSS.escape(index)}"]`);
+    if (input) input.value = value;
+  }
+  for (const [index, value] of Object.entries(draft.comments || {})) {
+    const input = form.querySelector(`[data-proofread-comment="${CSS.escape(index)}"]`);
+    if (input) input.value = value;
+  }
+  if (form.querySelector("[data-meta-title]")) form.querySelector("[data-meta-title]").value = draft.title || "";
+  for (const key of ["name", "author", "type"]) {
+    const input = form.querySelector(`[data-source-${key}]`);
+    if (input && draft.source) input.value = draft.source[key] || "";
+  }
+  for (const kind of ["authors", "dates", "tags", "files"]) {
+    const values = draft.lists && draft.lists[kind];
+    const holder = form.querySelector(`[data-list="${kind}"]`);
+    if (!holder || !Array.isArray(values)) continue;
+    while (holder.querySelectorAll("[data-list-row]").length < values.length) {
+      const add = holder.querySelector(`[data-add-list="${kind}"]`);
+      if (add) add.click(); else break;
+    }
+    while (holder.querySelectorAll("[data-list-row]").length > values.length) {
+      const rows = holder.querySelectorAll("[data-list-row]");
+      const remove = rows[rows.length - 1].querySelector("[data-remove-list]");
+      if (remove) remove.click(); else break;
+    }
+    [...holder.querySelectorAll("[data-list-row]")].forEach((row, index) => {
+      const value = values[index];
+      row.querySelectorAll("[data-list-field]").forEach((input) => {
+        const next = typeof value === "string" ? value : value && value[input.dataset.listField];
+        input.value = next == null ? "" : String(next);
+      });
+    });
+  }
+  if (form.querySelector("[data-proofread-note]")) form.querySelector("[data-proofread-note]").value = draft.note || "";
+  if (form.querySelector("[data-proofread-description]")) form.querySelector("[data-proofread-description]").value = draft.description || "";
+  if (draft.page && form.querySelector("[data-proofread-page]")) form.querySelector("[data-proofread-page]").value = draft.page;
+  for (const [index, type] of Object.entries(draft.types || {})) {
+    const input = form.querySelector(`[data-proofread-part-type="${CSS.escape(index)}"]`);
+    if (input) input.value = type;
+  }
+  for (const index of Object.keys(draft.deleted || {})) {
+    const button = form.querySelector(`[data-delete-part="${CSS.escape(index)}"]`);
+    if (button) { button.dataset.proofreadDeleted = "true"; button.textContent = "恢复"; const group = button.closest("[data-proofread-part-group]"); if (group) group.classList.add("proofread-deleted"); }
+  }
+  for (const part of draft.newParts || []) {
+    const target = form.querySelector(`[data-proofread-part-group="${CSS.escape(part.group)}"] [${part.before ? "data-part-insert-before" : "data-part-insert-after"}]`);
+    if (target) {
+      target.insertAdjacentHTML("beforeend", newPartHTML());
+      const row = target.lastElementChild;
+      row.querySelector("textarea").value = part.text || "";
+      row.querySelector("[data-new-part-type]").value = part.type || "paragraph";
+    }
+  }
+}
+
+function newPartHTML() {
+  return `<label class="proofread-field proofread-new-part" data-proofread-new-part><span>新增段落</span><select data-new-part-type>${PART_TYPES.map((type) => `<option value="${type}">${type}</option>`).join("")}</select><textarea></textarea><button type="button" class="text-btn-sm" data-remove-new-part>删除</button></label>`;
+}
+
+function applyFullText(form) {
+  const input = form.querySelector("[data-fulltext-input]");
+  const rows = [...form.querySelectorAll("[data-proofread-part-input]")];
+  if (!input || !rows.length) return;
+  const lines = input.value.split("\n");
+  rows.forEach((row, index) => { row.value = lines[index] == null ? "" : lines[index]; });
+  rows.slice(lines.length).forEach((row) => { const group = row.closest("[data-proofread-part-group]"); const button = group && group.querySelector("[data-delete-part]"); if (button) button.click(); });
+  if (lines.length > rows.length) {
+    const target = rows[rows.length - 1].closest("[data-proofread-part-group]").querySelector("[data-part-insert-after]");
+    for (const line of lines.slice(rows.length)) target.insertAdjacentHTML("beforeend", newPartHTML().replace("<textarea></textarea>", `<textarea>${escapeHTML(line)}</textarea>`));
+  }
+  saveProofreadDraft();
+}
+
 function proofreadPayload(item, form) {
   const article = item.article || {};
   const patch = { version: 2, parts: {}, comments: {}, description: "" };
   form.querySelectorAll("[data-proofread-part-input]").forEach((input) => {
     const index = Number(input.dataset.proofreadPartInput);
     const delta = textDelta(partTextWithPivots(article, index), input.value);
-    if (delta) patch.parts[index] = { diff: delta };
+    const part = article.parts[index] || {};
+    const change = {};
+    if (delta) change.diff = delta;
+    const typeInput = form.querySelector(`[data-proofread-part-type="${index}"]`);
+    const type = typeInput ? typeInput.value : "";
+    if (type && type !== (part.type || "paragraph")) change.type = type;
+    const group = input.closest("[data-proofread-part-group]");
+    const deleted = group && group.querySelector("[data-proofread-deleted]");
+    if (deleted && deleted.dataset.proofreadDeleted === "true") change.delete = true;
+    const before = group ? [...group.querySelector("[data-part-insert-before]").querySelectorAll("[data-proofread-new-part]")].map((row) => ({ text: (row.querySelector("textarea") || {}).value || "", type: (row.querySelector("[data-new-part-type]") || {}).value || "paragraph" })) : [];
+    const after = group ? [...group.querySelector("[data-part-insert-after]").querySelectorAll("[data-proofread-new-part]")].map((row) => ({ text: (row.querySelector("textarea") || {}).value || "", type: (row.querySelector("[data-new-part-type]") || {}).value || "paragraph" })) : [];
+    if (before.length) change.insertBefore = before;
+    if (after.length) change.insertAfter = after;
+    if (Object.keys(change).length) patch.parts[index] = change;
   });
   form.querySelectorAll("[data-proofread-comment]").forEach((input) => {
     const index = Number(input.dataset.proofreadComment);
@@ -1532,8 +1722,9 @@ async function submitProofreadForm(form) {
   const submit = form.querySelector('button[type="submit"]');
   submit.disabled = true;
   try {
-    await apiWithTimeout("/api/proofread", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify(payload) }, 30000);
-    showToast("校订已提交，等待生成 PR");
+    const result = await apiWithTimeout("/api/proofread", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify(payload) }, 30000);
+    try { sessionStorage.removeItem(proofreadDraftKey(item.doc_id)); } catch (_error) { /* storage is optional */ }
+    showToast(result.auto_merge ? "校订已提交，通过检查后自动合并" : "校订已提交，等待人工审核 PR");
   } catch (error) {
     showToast("校订提交失败");
   } finally {
@@ -1541,9 +1732,12 @@ async function submitProofreadForm(form) {
   }
 }
 
-async function comparePreview(docId) {
+async function comparePreview(docId, restoring = false) {
   if (!STATE.preview || !docId) return;
   const baseDocId = STATE.preview;
+  STATE.compare = docId;
+  STATE.proofread = false;
+  if (!restoring) syncUrl(true);
   const requestSeq = compareRequestSeq + 1;
   compareRequestSeq = requestSeq;
   try {
@@ -1833,6 +2027,36 @@ function attachEvents() {
     }
   });
   DOM.previewPanel.addEventListener("click", (event) => {
+    const partInsert = event.target.closest("[data-add-part-before], [data-add-part-after]");
+    if (partInsert) {
+      const group = partInsert.closest("[data-proofread-part-group]");
+      const target = group && group.querySelector(partInsert.dataset.addPartBefore != null ? "[data-part-insert-before]" : "[data-part-insert-after]");
+      if (target) target.insertAdjacentHTML("beforeend", newPartHTML());
+      saveProofreadDraft();
+      return;
+    }
+    const deletePart = event.target.closest("[data-delete-part]");
+    if (deletePart) {
+      deletePart.dataset.proofreadDeleted = deletePart.dataset.proofreadDeleted === "true" ? "false" : "true";
+      deletePart.textContent = deletePart.dataset.proofreadDeleted === "true" ? "恢复" : "删除";
+      const group = deletePart.closest("[data-proofread-part-group]"); if (group) group.classList.toggle("proofread-deleted", deletePart.dataset.proofreadDeleted === "true");
+      saveProofreadDraft();
+      return;
+    }
+    if (event.target.closest("[data-remove-new-part]")) {
+      const newPart = event.target.closest("[data-proofread-new-part]"); if (newPart) newPart.remove();
+      saveProofreadDraft();
+      return;
+    }
+    if (event.target.closest("[data-fulltext-toggle]")) {
+      const box = DOM.previewPanel.querySelector("[data-fulltext-box]");
+      if (box) box.hidden = !box.hidden;
+      return;
+    }
+    if (event.target.closest("[data-fulltext-apply]")) {
+      applyFullText(event.target.closest("[data-proofread-form]"));
+      return;
+    }
     const addList = event.target.closest("[data-add-list]");
     if (addList) {
       const kind = addList.dataset.addList;
@@ -1875,8 +2099,31 @@ function attachEvents() {
     const sourceFile = event.target.closest("[data-proofread-source-file]");
     if (sourceFile) {
       const frame = DOM.previewPanel.querySelector("[data-proofread-source]");
-      if (frame) frame.src = `/api/download/source/${encodeURIComponent(STATE.preview)}?file=${encodeURIComponent(sourceFile.value)}&inline=true`;
+      STATE.proofreadFile = sourceFile.value;
+      const item = getCachedPreview(STATE.preview);
+      const pageInput = DOM.previewPanel.querySelector("[data-proofread-page]");
+      const page = Math.max(1, Number(pageInput ? pageInput.value : 0) || Number(item && item.article && item.article.page_start) || 1);
+      STATE.proofreadPage = String(page);
+      const selected = item && item.source_files && item.source_files.find((file) => String(file.index) === String(sourceFile.value));
+      const pdfPage = selected && /\.pdf(?:$|\?)/i.test(selected.url) ? `#page=${page}` : "";
+      if (frame) frame.src = `/api/download/source/${encodeURIComponent(STATE.preview)}?file=${encodeURIComponent(sourceFile.value)}&inline=true${pdfPage}`;
+      syncUrl(true);
+      saveProofreadDraft();
+      return;
     }
+    const pageInput = event.target.closest("[data-proofread-page]");
+    if (pageInput) {
+      STATE.proofreadPage = String(Math.max(1, Number(pageInput.value) || 1));
+      const frame = DOM.previewPanel.querySelector("[data-proofread-source]");
+      const item = getCachedPreview(STATE.preview);
+      const selected = item && item.source_files && item.source_files.find((file) => String(file.index) === String(STATE.proofreadFile || "0"));
+      if (frame && selected && /\.pdf(?:$|\?)/i.test(selected.url)) frame.src = `${frame.src.split("#", 1)[0]}#page=${STATE.proofreadPage}`;
+      syncUrl(true);
+      saveProofreadDraft();
+    }
+  });
+  DOM.previewPanel.addEventListener("input", (event) => {
+    if (event.target.closest("[data-proofread-form]")) saveProofreadDraft();
   });
   DOM.previewPanel.addEventListener("submit", (event) => {
     const form = event.target.closest("[data-proofread-form]");

static/style.css

@@ -651,6 +651,35 @@ ul, li {
   resize: vertical;
   line-height: 1.6;
 }
+.proofread-part-group.proofread-deleted {
+  opacity: .55;
+}
+.proofread-part-actions {
+  display: flex;
+  gap: .35rem;
+  flex-wrap: wrap;
+}
+.proofread-page-control {
+  display: inline-flex;
+  align-items: center;
+  gap: .35rem;
+  margin-left: auto;
+  font-size: .8rem;
+}
+.proofread-page-control input {
+  width: 5rem;
+}
+[data-fulltext-box] {
+  display: grid;
+  gap: .5rem;
+  margin-bottom: .75rem;
+}
+[data-fulltext-box][hidden] {
+  display: none;
+}
+[data-fulltext-input] {
+  min-height: 16rem;
+}
 
 .proofread-part textarea {
   min-height: 120px;