FT542-WMS/.trae/documents/修复打印两页问题并完善打印模板.md

问题判断

• 仅勾选一条子单仍打印两页，典型原因是分页规则对最后一页也生效或伪类匹配异常导致空白页。
• :last-child 在存在空白文本节点/注释节点的情况下可能失效，导致最后一个实际页面元素仍应用分页。
• 也可能存在重复数据（同一个 stockinDetailId 被选中两次），引发两页输出。

修复与优化方案

1. 明确分页控制（按索引条件渲染）

• 将分页控制从 CSS 伪类改为模板条件，避免 :last-child 因节点影响而失效：
• 模板改为：

<div
  v-for="(item, idx) in printData"
  :key="item.stockinDetailId"
  class="print-page"
  :style="{ pageBreakAfter: idx < printData.length - 1 ? 'always' : 'auto' }"
>
  <!-- 原卡片内容保持不变 -->
</div>

2. 去重与防重复打印

• 在 printDetailQRCodes 中对 detailSelections 去重，确保同一子单只打印一次：

const map = new Map()
this.printData = []
for (const row of this.detailSelections) {
  const key = row.stockinDetailId
  if (key && !map.has(key)) {
    map.set(key, true)
    this.printData.push(row)
  }
}

3. 保证单页不被拆分

• 保留并强化：.print-page { page-break-inside: avoid; }，防止卡片高度导致跨页拆分。
• 控制卡片外层高度与内边距不超过 A4 可打印区域（当前 720px 宽 + 常规内容高度安全）。

4. 打印触发时机与副本数

• 维持 this.$nextTick(() => setTimeout(() => this.$refs.easyPrint2.print(), 100))，避免多次触发。
• 如仍出现两页，追加保护：打印前记录 printData.length 与内容，控制仅当 length >= 1 才触发一次。

代码变更摘要

• 更新模板：将分页规则改为基于索引的内联样式条件。
• 更新方法：printDetailQRCodes 增加去重逻辑与空数组保护。
• 保留样式：page-break-inside: avoid；移除或忽略 :last-child 分页伪类。

验证步骤

• 勾选 1 条子单打印，预览应仅 1 页。
• 勾选 2 条子单打印，预览应为 2 页且无末尾空白页。
• 检查不同浏览器（Chromium/Edge）表现一致性。

请确认按此方案实施，我将立即更新代码并验证。