fix: 修复精确预览放大后右侧留白丢失

apps/web/src/PrecisePdfPreview.tsx

@@ -19,13 +19,16 @@ import {
 import pdfWorkerUrl from "pdfjs-dist/build/pdf.worker.min.mjs?url";
 import {
   getPdfCanvasRenderScale,
-  getPdfPageCssDimensions
+  getPdfPageCssDimensions,
+  getPrecisePdfDocumentWidth
 } from "./pdf-page-geometry";
 import { createPdfAnnotationLinkService } from "./pdf-annotation-links";
 import { PdfPageRenderQueue } from "./pdf-render-queue";
 
 GlobalWorkerOptions.workerSrc = pdfWorkerUrl;
 
+const PRECISE_PDF_INLINE_GUTTER = 30;
+
 type PdfJsAnnotationLinkService = Parameters<
   AnnotationLayer["render"]
 >[0]["linkService"];
@@ -455,8 +458,17 @@ export function PrecisePdfPreview({
     return <div className="precise-pdf-status">正在读取精确预览…</div>;
   }
 
+  const documentWidth = getPrecisePdfDocumentWidth(
+    pages.map((page) => page.width),
+    zoomPercent / 100,
+    PRECISE_PDF_INLINE_GUTTER
+  );
+
   return (
-    <div className="precise-pdf-document">
+    <div
+      className="precise-pdf-document"
+      style={{ width: `${documentWidth}px` }}
+    >
       {pages.map((page) => (
         <PrecisePdfPage
           key={page.pageNumber}

apps/web/src/pdf-page-geometry.ts

@@ -31,3 +31,22 @@ export function getPdfCanvasRenderScale(
   }
   return (displayWidthCssPixels / widthPoints) * devicePixelRatio;
 }
+
+export function getPrecisePdfDocumentWidth(
+  pageWidthsPoints: readonly number[],
+  displayScale: number,
+  inlineGutter: number
+) {
+  const maximumPageWidth = Math.max(0, ...pageWidthsPoints);
+  if (
+    maximumPageWidth <= 0 ||
+    displayScale <= 0 ||
+    inlineGutter < 0
+  ) {
+    return 0;
+  }
+  return Math.ceil(
+    maximumPageWidth * PDF_PAGE_CSS_SCALE * displayScale +
+      inlineGutter * 2
+  );
+}

apps/web/tests/pdf-page-geometry.test.ts

@@ -2,6 +2,7 @@ import { describe, expect, it } from "vitest";
 import {
   getPdfCanvasRenderScale,
   getPdfPageCssDimensions,
+  getPrecisePdfDocumentWidth,
   PDF_PAGE_CSS_SCALE
 } from "../src/pdf-page-geometry";
 
@@ -31,4 +32,26 @@ describe("精确 PDF 页面尺寸", () => {
     );
     expect(getPdfCanvasRenderScale(0, 800, 2)).toBe(0);
   });
+
+  it.each([
+    [50, 457],
+    [100, 854],
+    [120, 1013],
+    [400, 3235]
+  ])("在 %i%% 缩放下把双侧固定留白计入滚动宽度", (zoom, expected) => {
+    expect(
+      getPrecisePdfDocumentWidth(
+        [595.275591],
+        zoom / 100,
+        30
+      )
+    ).toBe(expected);
+  });
+
+  it("按混合纸张中最宽页面计算精确预览滚动宽度", () => {
+    expect(
+      getPrecisePdfDocumentWidth([595.275591, 792], 1.2, 30)
+    ).toBe(1328);
+    expect(getPrecisePdfDocumentWidth([], 1.2, 30)).toBe(0);
+  });
 });