refactor(文书纸): 统一 A4 纸规格并收敛各渲染场景的纸宽与页边距

This commit is contained in:
yelan
2026-09-27 13:54:15 +08:00
parent 635e998946
commit 431dd2cd6f
8 changed files with 150 additions and 52 deletions
@@ -279,7 +279,9 @@ defineExpose({ getDocumentElement })
<template>
<!-- eslint-disable vue/no-v-html -- 内容为本系统定稿的文书 HTML(编辑器产出、仅医务人员可改),非任意用户输入 -->
<article class="doc-paper" :class="{ 'doc-paper--card': variant === 'card' }">
<!-- doc-paper--a4:无论哪种 variant 都是「一页 A4」(比例 + 一般文书页边距),
variant 只决定盒子装饰 —— card 自带圆角阴影,plain 交给调用方 -->
<article class="doc-paper doc-paper--a4" :class="{ 'doc-paper--card': variant === 'card' }">
<div
ref="containerRef"
class="doc-paper__body"
@@ -302,9 +304,10 @@ defineExpose({ getDocumentElement })
min-width: 0;
}
/* card:预览弹窗里那张白纸 */
/* card:预览弹窗里那张白纸。
比例与页边距由 .doc-paper--a4 给(见 utils/document-paper.ts 的 A4 规格),
这里只补「纸」的观感 —— 圆角与投影。 */
.doc-paper--card {
padding: 26px 32px 30px;
border-radius: var(--r);
box-shadow: var(--sh);
}
@@ -349,12 +349,13 @@ defineExpose({ getDocumentElement })
background: #525659;
}
/* 舞台上的纸**不再单独收窄**(曾按原型的 640px 覆盖过)。
640px 配 A4 页边距只剩 446px 版心,而「四、用药信息」那张表的
min-content 就有 508px → 表宽溢出纸面、「药品名称」被挤成 28px 宽的竖排(已踩)。
现在统一走 :root 的 820px:版心 572px,与工作台/编辑器完全一致(所见即所签)。
外壳宽度由调用方给(已签署预览传 width=960 → 舞台内宽 912 ≥ 820)。 */
.preview-body--stage :deep(.doc-paper) {
width: 640px;
max-width: 100%;
min-height: 905px;
flex: none;
padding: 34px 40px;
box-shadow: 0 6px 22px rgb(0 0 0 / 45%);
}