DOMPDF 是处理复杂报告的正确工具吗?

Is DOMPDF the right tool for complex Reports?

我正在使用 barryvdh/laravel-dompdf 从 Laravel/Jquery 应用程序创建一个报告,这个报告非常复杂 - 在起始页之后有几个页面根据报告数据重复.每个页面都有一个页眉和页脚,我想问问是否有可能以某种方式限制主要内容,使其不与页脚或页眉重叠

我也试过插入页码,但没有成功。 这是我的主报告页面的样子

<body>


    <table width="100%">
        <tr>
             <td>
                <img src="assets/images/track-more.png" width="200px" height="auto">
              </td>
            <td>
                <img class="logofixed" src="assets/images/frauscher1.png" width="200px" height="auto">
            </td>
        </tr>
    </table>


<h1 class="center">report</h1>


</table>
<div class="page-break"></div>

@foreach ($measures as $measure)
    @include("snippets/razor")
    <div class="page-break"></div>
@endforeach

    <footer>
        <hr>
        <script type="text/php">
    if (isset($pdf)) {
       $font = $fontMetrics->getFont("Arial", "bold");
       $pdf->page_text(555, 745, "Page {PAGE_NUM}/{PAGE_COUNT}", $font,    7, array(0, 0, 0));
    }

    </script>

    </footer>
</body>

我的snippets/razor页面是这样的:

 <div class="row">

    <table>
        <tr>
            @if ($measure->pass == 1)
                <td class="ok"><h1>{{$measure->text}}</h1></td><td></td>
            @else
                <td class="fail"><h1>{{$measure->text}}</h1></td><td></td>
            @endif
        </tr>
    </table>
    <table>

        <tr>
            <td>date1:</td><td>{{$measure->date1}}</td>
        </tr>
        <tr>
            <td>date2:</td><td>{{!empty($measure->date2)?$measure->date2:""}}</td>
        </tr>
        <tr>
            <td>date3:</td><td>{{$measure->date3}}</td>
        </tr>
        <tr>
            <td>date4:</td><td></td>
        </tr>

    </table>
@if(!empty($measure->items))
    <table class="measure">
        <tr>
            <th>headerx</th>
            <th>headerx</th>
            <th>headerx</th>
            <th>headerx</th>
            <th>headerx</th>
            <th>headerx</th>
            <th>headerx</th>
            <th>headerx</th>
        </tr>
        @foreach ($measure->items as $i => $item)
            @php  $class = $i % 2 === 0 ? 'even' : 'odd'; @endphp
            <tr class="{{ $class }}" >
                <td>{{ $item->text }}</td>
                <td>{{ $item->data1}}</td>
                <td>{{ $item->data2}}</td>
                <td>{{ $item->data3}}</td>
                <td>{{ $item->data4}}</td>
                <td>{{ $item->data5}}</td>
                @if ($item->data1== 1)
                    <td class="ok">Success</td>
                @else
                    <td class="fail">Failure</td>
                @endif


                <td>{{ $item->data6}}</td>
            </tr>
        @endforeach
    </table>
   @endif
</div>

@编辑:

this happens when i used "fixed" header and footer

这是我目前的 css

  body {
        font-family: Arial, Helvetica, sans-serif;
        font-size: 14px;
    }

    table.measure, table.measure > tr, table.measure td, table.measure th {
        width: 100%;
        border: 1px solid black;
        padding: 5px;
        border-collapse: collapse;
    }

    .page-break {
        page-break-after: always;
    }

    .center {
        text-align: center
    }


    .logofixed {
        position: fixed;
        right: 0;
    }

    .logofixedleft {
        position: fixed;
        left: 0;
    }



    .bestanden {
        color: white;
        background-color: #95B711;
    }

    .fehler {
        color: white;
        background-color: #e2001a;
    }

    .even {
        background: #FFFFFF;
    }

    .odd {
        background: #a3adb2;
    }

/*   @page {
        margin-top: 2cm;
        margin-bottom: 2cm;
    }*/


    head {
        position: fixed;
        top: 1cm;
    }


    footer {
        position: fixed;
        bottom: 0cm;
    }

    hr {
        border: none;
        height: 1px;
        /* Set the hr color */
        background-color: black; /* Modern Browsers */
    }

    table { overflow: visible !important; }
    thead { display: table-header-group }
    tfoot { display: table-row-group }
    tr { page-break-inside: avoid }

主页:

<body>
<head >
    <img class="logofixedleft" src="assets/images/dummy.png" width="200px" height="auto">
    <img class="logofixed" src="assets/images/dummy.png" width="200px" height="auto">

    <hr >
</head>


@foreach ($measures as $measure)
    <div class="page-break"></div>
    @include("snippets/razor")

@endforeach

<footer>
    <hr>
    {{--<div class="pagenum-container">Seite <span class="pagenum"></span></div>--}}
    <script type="text/php">
               $font = $fontMetrics->getFont("Arial", "bold");
               $pdf->page_text(45, 765, "Page {PAGE_NUM}/{PAGE_COUNT}", $font, 8, array(0, 0, 0));

      </script>
</footer>

</body>

这是迭代的页面"snippets/razor"

<div class="row" style="margin-top:1cm">

    <table>
        <tr>
            @if ($measure->pass == 1)
                <td class="ok"><h1>{{$measure->text}}</h1></td><td></td>
            @else
                <td class="fail"><h1>{{$measure->text}}</h1></td><td></td>
            @endif
        </tr>
    </table>

@if(!empty($measure->items))
    <table class="measure" width="100%" >
        <thead>

        <tr>
            <th>column</th>
            <th>column</th>
            <th>column</th>
            <th>column
                </th>
            <th>column</th>
            <th>column</th>
            <th>column</th>
            <th>column</th>
        </tr>
        </thead>
        @foreach ($measure->items as $i => $item)
            @php  $class = $i % 2 === 0 ? 'even' : 'odd'; @endphp
            <tr class="{{ $class }}" >
...
            </tr>
        @endforeach
    </table>

   @endif
</div>

每页页眉/页脚

为了在每个页面上显示页眉/页脚,您需要使用固定定位的元素,给页面一些边距,这样元素就不会重叠,然后将页眉/页脚移动到页边距内,顶部为负数/ 底值。

像这样:

<html>
<head>
  <style>
    @page { margin: 100px 25px; }
    header { position: fixed; top: -60px; left: 0px; right: 0px; height: 50px; }
    footer { position: fixed; bottom: -60px; left: 0px; right: 0px; height: 50px; }
  </style>
</head>
<body>
  <header>header on each page</header>
  <footer>footer on each page</footer>
</body>
</html>

分页符

您可以使用以下方法创建手动分页符:

<style>
.page-break {
    page-break-after: always;
}
</style>
<div class="page-break"></div>

来源:

header / footer on every page