完善pdf比例

This commit is contained in:
xianyi
2026-01-06 14:26:56 +08:00
parent 71169e934b
commit 971c342d9a

View File

@@ -445,7 +445,7 @@ export const ExamSignPanel = ({ examId, onBusyChange }: ExamSignPanelProps) => {
// 清空容器
canvasContainerRef.current.innerHTML = '';
const scale = 3.0;
const scale = 3;
for (let pageNum = 1; pageNum <= pdf.numPages; pageNum++) {
const page = await pdf.getPage(pageNum);
@@ -460,6 +460,8 @@ export const ExamSignPanel = ({ examId, onBusyChange }: ExamSignPanelProps) => {
canvas.width = viewport.width;
canvas.style.display = 'block';
canvas.style.marginBottom = '10px';
canvas.style.maxWidth = '100%';
canvas.style.height = 'auto';
canvas.className = 'mx-auto border rounded-lg shadow-sm';
canvasContainerRef.current.appendChild(canvas);
@@ -552,6 +554,8 @@ export const ExamSignPanel = ({ examId, onBusyChange }: ExamSignPanelProps) => {
canvas.width = viewport.width;
canvas.style.display = 'block';
canvas.style.marginBottom = '10px';
canvas.style.maxWidth = '100%';
canvas.style.height = 'auto';
canvas.className = 'mx-auto border rounded-lg shadow-sm';
daojiandanCanvasContainerRef.current.appendChild(canvas);
@@ -644,6 +648,8 @@ export const ExamSignPanel = ({ examId, onBusyChange }: ExamSignPanelProps) => {
canvas.width = viewport.width;
canvas.style.display = 'block';
canvas.style.marginBottom = '10px';
canvas.style.maxWidth = '100%';
canvas.style.height = 'auto';
canvas.className = 'mx-auto border rounded-lg shadow-sm';
addItemBillCanvasContainerRef.current.appendChild(canvas);
@@ -700,6 +706,8 @@ export const ExamSignPanel = ({ examId, onBusyChange }: ExamSignPanelProps) => {
canvas.width = viewport.width;
canvas.style.display = 'block';
canvas.style.marginBottom = '10px';
canvas.style.maxWidth = '100%';
canvas.style.height = 'auto';
canvas.className = 'mx-auto border rounded-lg shadow-sm';
container.appendChild(canvas);
@@ -762,6 +770,8 @@ export const ExamSignPanel = ({ examId, onBusyChange }: ExamSignPanelProps) => {
canvas.width = viewport.width;
canvas.style.display = 'block';
canvas.style.marginBottom = '10px';
canvas.style.maxWidth = '100%';
canvas.style.height = 'auto';
canvas.className = 'mx-auto border rounded-lg shadow-sm';
container.appendChild(canvas);
@@ -791,7 +801,7 @@ export const ExamSignPanel = ({ examId, onBusyChange }: ExamSignPanelProps) => {
}, [showAddItemBillPreview, addItemBillUrl]);
const handlePrint = () => {
if (!pdfBlobUrl || !pdfReady || !canvasContainerRef.current) return;
if (!pdfBlobUrl || !pdfReady || !canvasContainerRef.current || !previewPdf) return;
// 创建打印窗口
const printWindow = window.open('', '_blank');
@@ -805,13 +815,16 @@ export const ExamSignPanel = ({ examId, onBusyChange }: ExamSignPanelProps) => {
<!DOCTYPE html>
<html>
<head>
<title>知情同意书打印</title>
<title>${previewPdf.pdf_name || '知情同意书打印'}</title>
<style>
@media print {
body {
margin: 0;
padding: 0;
}
.print-button, .close-button {
display: none;
}
img {
max-width: 100%;
page-break-after: always;
@@ -825,6 +838,37 @@ export const ExamSignPanel = ({ examId, onBusyChange }: ExamSignPanelProps) => {
margin: 0;
padding: 0;
}
.print-button, .close-button {
padding: 4px 12px;
border: none;
border-radius: 4px;
cursor: pointer;
font-size: 14px;
transition: background-color 0.2s;
}
.print-button {
background-color: #2563eb;
color: white;
}
.print-button:hover {
background-color: #1d4ed8;
}
.close-button {
background-color: transparent;
color: #374151;
}
.close-button:hover {
background-color: #e5e7eb;
}
.button-container {
position: fixed;
top: 20px;
right: 20px;
display: flex;
align-items: center;
gap: 8px;
z-index: 1000;
}
img {
display: block;
width: 100%;
@@ -833,6 +877,10 @@ export const ExamSignPanel = ({ examId, onBusyChange }: ExamSignPanelProps) => {
</style>
</head>
<body>
<div class="button-container">
<button class="close-button" onclick="window.close()">关闭</button>
<button class="print-button" onclick="window.print()">打印</button>
</div>
`);
// 将每个 canvas 转换为图片并添加到打印窗口
@@ -869,7 +917,7 @@ export const ExamSignPanel = ({ examId, onBusyChange }: ExamSignPanelProps) => {
// 渲染PDF到临时canvas
const pdf = await pdfjsLib.getDocument({ data: arrayBuffer }).promise;
const scale = 3.0;
const scale = 1.0;
const canvasImages: string[] = [];
for (let pageNum = 1; pageNum <= pdf.numPages; pageNum++) {