如果内容在 mpdf 中与页脚重叠,如何将页脚推到下一页?

时间:2021-01-29 20:24:52

标签: mpdf

从技术上讲,我知道如何在 mpdf 中设置 html 页脚,但我有一个无法解决的问题。

我正在生成发票。发票有一个项目表,项目数可能会有所不同。在发票的最后一页(即项目表之后),我正在设置一个页脚,并获得公司同意和签名字段。这样包含这两个的块就会出现在当前页面的末尾(大约 70 毫米高)。它不一定需要是页脚;固定块也有效(但同样的问题适用)。

问题

当列表项相对较小时,它会按预期完美运行;此外,当列表项更多时。但是,当列表项在一个范围内时,内容会重叠。

目前我已经尝试过:

选项 1 使用底部的固定位置设置块。
问题:相同。

选项 2 将 margin-bottom 增加到 70mm。
问题:重叠是固定的,但是当内容更多并且需要有两页或更多页的项目时 - 它会在前几页留下太多(70 毫米)的空白空间。

选项 3setAutoBottomMargin 设置为 stretch
问题:一样。 (感觉不到任何区别)

选项 4 设置为最后一页保留的命名页。
问题:命名页面在第一页上不起作用。 IE。它总是有第二页。所以即使内容很小,也至少需要两页。

我期望它的行为

  • 当内容较少时。将此块推送到当前页面的末尾。
  • 当内容在范围内时,填充可用空间。并将此块推送到下一页。

注意:我使用 <sethtmlpagefooter> 作为最后一个标签来在运行时设置页面的页脚。

有人可以帮我吗?

如果您需要当前输出的任何图像样本,我可以提供。但我认为这是一个非常普遍的要求,有人早就想出来了。

如果我的解释不正确。请告诉我,如果需要,我可以提供更多信息。

谢谢

1 个答案:

答案 0 :(得分:0)

我正在更新这篇文章,因为当您需要在所有其他页面上使用默认页脚而我们的最后一页页脚位于第一页本身时,我发现此方法存在问题。 页脚被单独推到下一页。 但这是一个边缘情况。

要使这种方法起作用,有一个要求。 IE。 div 必须位于顶级

从技术上讲,我最终将选项 1 与我在旧答案中描述的方法结合使用。

我最终做了什么

<body>
    <div> ... </div>
    <table> ... </table>
    .
    .
    .
    <div style="height: 75px"></div>
    <div class="fixed-bottom border-top border-white">
        ... <!-- footer content -->
    </div>
</body> 

border-topborder-white 是必要的,因为没有它们,mpdf 在我的特定版本中计算正确宽度会出现问题

我通过使上部 div 也fixed-bottom 并为 border-top 着色不同的方式找到了确切的高度,以便我可以看到高度何时是准确的

使用的css

.fixed-bottom {
    position: fixed;
    right: 0mm;
    bottom: 0mm;
    left: 0mm;
    z-index: 1030;
}

.border-top {
    border-top: 1px solid #000;
}

.border-white {
    border-color: #fff;
}
<块引用>

原答案

经过一番挣扎,我找到了解决方法。

我做了什么

  • 用我想要的内容定义了一个命名的 html 页脚块。
  • 使用 sethtmlpagefooter 在 items 表之后设置页脚,使其位于最后一页。
  • 添加了一个空块(div),其高度补偿了页脚的高度和项目表和项目之间所需的填充 sethtmlpagefooter 调用。

问题已解决

  • 当列表项的数量(更少或更多)时,它已经按预期运行
  • 当列表项在重叠的范围内时,而不是内容与页脚重叠 - 现在空块重叠直到 项目就在页脚附近的点。所以如果物品 增加空块将页脚推到下一页。如果 项目增加更多它占用了以前的可用空间 页面,因为没有定义大的边距

只是记录在这里,所以它可能会被任何有相同经历的人推荐 问题。