DOMPDF Laravel 5.5分页css

Guys I need help in fixing this pdf to this format.

The Idea is to limit the items in the table by 12, if it is 12 the table continues onto another page with the header and the footer just as the same.

Here is my code:

pr.print.blade

<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">

    <title>PDF</title>

    <link href="{{ asset('css/bootstrap.min.css') }}" rel="stylesheet">
    <style>


        .content{margin-top: 170px;}
        .header {position: fixed; left: 0px; top: -40px; right: 0px;}
        .footer { position: fixed; left: 0px; bottom: 200px; right: 0px;}
        .page-break {
         page-break-after: always;
        }

    </style>
    <link rel="stylesheet" href="{{ asset('css/lato.css') }}">
    <link href="https://fonts.googleapis.com/css?family=Libre+Barcode+128" rel="stylesheet">



</head>
<body>
<div class="container-fluid">
@include('pr.pr-print-header')
@include('pr.pr-print-footer')

<div class="content" >

      <div class="row">

        <table style='width:100%;font-size:14px;text-align:center;border:1px solid #000000;' id='items'  cellpadding='0' cellspacing='0'>

            <thead style="background-color:#231F20;color:#FFFFFF;border:1px solid #000000;">
                <tr style="border:1px solid #000000;">
                    <td style='width:7%;font-weight:bold;'>ITEM NO.</td>
                    <td style='width:7%;font-weight:bold;'>QTY</td>
                    <td style='width:7%;font-weight:bold;'>UNIT</td>
                    <td style='width:49%;font-weight:bold;'>DESCRIPTION</td>
                    <td style='width:15%;font-weight:bold;'>ESTIMATED UNIT OF</td>
                    <td style='width:15%;font-weight:bold;'>ESTIMATED COST</td>
                </tr>
            </thead>    


            @php $check=0 @endphp
            @foreach($list as $indexKey => $list)
            @php $check++ @endphp
            <tbody style="border:1px solid #000000;">
                <tr style="border:1px solid #000000;">
                  <td style="border:1px solid #000000;">{{$indexKey}}</td>
                  <td style="border:1px solid #000000;">{{$list->pr_qty}}</td>
                  <td style="border:1px solid #000000;">{{$list->pr_unit}}</td>
                  <td style="border:1px solid #000000;">{{$list->pr_description}}</td>
                  <td  style='border:1px solid #000000; text-align: right;'>{{$list->pr_cost_per_unit}}</td>
                  <td style='border:1px solid #000000; text-align: right;'>{{$list->pr_estimated_cost}}</td>
                </tr>
            </tbody>

            @if( $check % 12 == 0 )
            <tfoot style='border:1px solid #000000;'>
                <tr style="background-color: #b0b1b2;border:1px solid #000000;">
                  <td colspan="5" style="text-align: right; font-weight: bold;">GRAND TOTAL</td>
                  <td style="text-align: right; font-weight: bold;">
                    {{number_format($grand_total,2)}}
                  </td>
                </tr>
            </tfoot>

            @include('pr.pr-print-header')
@include('pr.pr-print-footer')

            <tr><td colspan="6"><div class="page-break"></div></td></tr>
             @endif

            @endforeach

            @for($i = $check; $i < 12; $i++)
                    <tr style='border:1px solid #000000;'><td style='border:1px solid #000000;'>&nbsp;</td><td style='border:1px solid #000000;'>&nbsp;</td>&nbsp;<td style='border:1px solid #000000;'>&nbsp;</td><td style='border:1px solid #000000;'>&nbsp;</td><td style='border:1px solid #000000;'>&nbsp;</td><td style='border:1px solid #000000;'>&nbsp;</td></tr>
            @endfor

            <tfoot>
                <tr style="background-color: #b0b1b2;">
                  <td colspan="5" style="text-align: right; font-weight: bold;">GRAND TOTAL</td>
                  <td style="text-align: right; font-weight: bold;">
                    {{number_format($grand_total,2)}}
                  </td>
                </tr>
            </tfoot>
        </table>

      </div>

  </div>





</div>

<script src="{{ asset('js/jquery.min.js') }}"></script>
<script src="{{ asset('js/bootstrap.min.js') }}"></script>
</body>
</html>

pr.print-header.blade.php

<div class="header">
    <div class="row">

        <div class="col-xs-3" style="font-family: 'Libre Barcode 128', cursive; font-size: 35px;padding: 10px 0px 0px 0px;">{{$pr->pr_form_no}}</div>
        <div class="col-xs-9">
        <table cellspacing='0' cellpadding='5' style="border-width: 0 !important;padding:0px 0px 0px 60px;">
            <tr>
                <td style="padding: 10px;"><img src="{{asset('images/sfclogo.png')}}" width="50px" height="50px"></td>
                <td>
                    <table style="text-align: center;style='width:45%'">
                        <tr><td>REPUBLIC OF THE PHILIPPINES</td></tr>
                        <tr><td>PROVINCE OF LA UNION</td></tr>
                        <tr><td>CITY OF SAN FERNANDO</td></tr>
                    </table>
                </td>
                <th style="padding-top: 10px;padding-left: 10px"><p style="background-color: #000;color: #FFF; text-align: center;padding: 10px;">PR</p></th>
            </tr>
        </table>
        </div>
    </div>

      <div class="row">
        <div class="col-md-12" style="text-align: center;color: white;background-color: black; font-size: 18px">
            PURCHASE REQUEST
        </div><br>
      </div>

      <div class="row">
                <table style='width:100%;border:1px solid #000000;font-size:11pt;' cellspacing='0' cellpadding='5' class='font1'>
                <tr>
                    <td style='width:40%'>
                        <table style='width:90%;padding-right: 0px;' cellpadding='0' cellspacing='0'>
                            <tr>
                                <td style='width:100%;padding:1px;padding-left:10px;' colspan='2'>DEPARTMENT:</td>
                            </tr>
                            <tr>
                                <td style='width:100%;padding:0px;padding-left:10px;' colspan='2'>{{$dept->office_name}}<hr style='color:#000000;height:1px;margin-bottom:3px;margin-top:0px;padding-left:10px;' /></td>
                            </tr>
                            <tr>
                                <td style='width:15%;padding:1px;padding-left:10px;'>SECTION:</td>
                                <td style='width:75%;padding:0px;padding-left:0px;'>{{$section->office_name}}<hr style='color:#000000;height:1px;margin-bottom:3px;margin-top:0px;' /></td>
                            </tr>
                        </table>
                    </td>
                    <td style='width:30%;'>
                        <table style='width:90%;' cellpadding='0' cellspacing='0'>
                            <tr>
                                <td style='width:20%;padding:1px;'>PR No.</td>
                                <td style='width:70%;padding:0px;border-bottom:1px solid #000000;'>{{$pr->pr_form_no}}</td>
                            </tr>
                            <tr>
                                <td style='width:20%;padding:1px;'>SAI No.</td>
                                <td style='width:70%;padding:0px;border-bottom:1px solid #000000;'></td>
                            </tr>
                            <tr>
                                <td style='width:20%;padding:1px;'>ObR No.</td>
                                <td style='width:70%;padding:0px;border-bottom:1px solid #000000;'></td>
                            </tr>
                        </table>
                    </td>
                    <td style='width:30%'>
                        <table style='width:95%;' cellpadding='0' cellspacing='0'>
                            <tr>
                                <td style='width:15%;padding:1px;'>Date</td>
                                <td style='width:70%;padding:0px;border-bottom:1px solid #000000;'>&nbsp;{{$dt->toFormattedDateString()}}</td>
                            </tr>
                            <tr>
                                <td style='width:15%;padding:1px;'>Budget</td>
                                <td style='width:70%;padding:0px;border-bottom:1px solid #000000;'><strong>&nbsp;PHP {{number_format($pr->budget_alloc,2)}}</strong></td>
                            </tr>
                            <tr>
                                <td style='width:15%;padding:1px;'>Supplier</td>
                                <td style='width:70%;padding:0px;border-bottom:1px solid #000;'>&nbsp;{{$pr->supplier_type}}</td>
                            </tr>
                        </table>
                    </td>
                </tr>
            </table>
      </div>
  </div>

pr.print-footer.blade.php

<div class="footer">
    <div class="row">
        <table style='width:100%;border:1px solid #000000;font-size:12px;margin-left:auto;margin-right:auto;margin-top:40px;' cellspacing='0' cellpadding='3' class='font1'>
            <tr>
                <td style='width:39%; font-weight:bold;text-align:left;border:1px solid #000000;'>
                REQUESTING OFFICE<br/><br/><br/><br/>
                </td>
                <td style='width:60%;border:1px solid #000000;vertical-align:top;font-weight:bold;' colspan='2' rowspan='3'>
                PURPOSE<br/>
                <div style='width:100%;text-align:center;font-weight:normal;font-size:11pt;' class='font1'>
                    {{$pr->purpose}}
                </div>
                </td>
            </tr>
            <tr>
                <td style='border:1px solid #000000;height:19px;text-align:center;text-transform:uppercase;font-weight:bold;'>
                {{$pr->requestor_name}}
                </td>
            </tr>
            <tr>
                <td style='text-align:center;border:1px solid #000000;text-transform:uppercase;height:19px;font-weight:bold'>
                {{$pr->requestor_position}}
                </td>
            </tr>
            <tr>
                <td colspan='3' style='background-color:#000000;height:20px;'>
            </tr>
            <tr>
                <td style='width:33%; font-weight:bold;text-align:left;border:1px solid #000000;'>
                APPROPRIATION AVAILABLE
                </td>
                <td style='width:33%; font-weight:bold;text-align:left;border:1px solid #000000;'>
                FUNDS AVAILABLE
                </td>
                <td style='width:33%; font-weight:bold;text-align:left;border:1px solid #000000;'>
                APPROVED
                </td>
            </tr>
            <tr>
                <td style='border:1px solid #000000;height:25px;text-align:center;text-transform:uppercase;font-weight:bold;'>

                </td>
                <td style='border:1px solid #000000;height:25px;text-align:center;text-transform:uppercase;font-weight:bold;'>

                </td>
                <td style='border:1px solid #000000;height:25px;text-align:center;text-transform:uppercase;font-weight:bold;'>

                </td>
            </tr>
            <tr>
                <td style='width:33%; font-weight:bold;text-align:center;border:1px solid #000000;text-transform:uppercase;'>
                {{$aa->name}}<br/>
                {{$aa->position}}
                </td>
                <td style='width:33%; font-weight:bold;text-align:center;border:1px solid #000000;text-transform:uppercase;'>
                {{$c->name}}<br/>
                {{$c->position}}
                </td>
                <td style='width:33%; font-weight:bold;text-align:center;border:1px solid #000000;text-transform:uppercase;'>
                {{$approval->name}}<br/>
                {{$approval->position}}
                </td>
            </tr>
        </table>
    </div>
    <div class="row">
        <div style='float:left;font-weight:normal;font-style:italic;font-size:7pt;width:40%;text-align:left;'>{{$created_code}}</div>
    </div>
</div>

I'm having trouble in positioning the table and the logic behind it. I hope you guys can help me. Thank you very much. I know the code looks like hell but I'm really out of ideas right now.

Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
立即提问
相关内容推荐