как повторить заголовок таблицы в новом разрыве страницы

Question

У меня есть динамическая таблица на моей веб-странице, которая иногда содержит много строк.Я сделал разрыв страницы после 22 строк.Мне нужно повторить определенную таблицу (информационная таблица, см. изображение) на новой странице.Как я могу это сделать?

image https://i.ibb.co/LN8gVbD/Screen-Shot-2019-05-26-at-03-34-26.png

С другой стороны, я не могу получить разрыв страницы в Chrome.это работает только в Firefox, как это исправить в Chrome?

 <style type="text/css">
    #receipt-data { font-size: 12px; }
        @media print {
                tr.page-break{
                page-break-inside: avoid;;
                page-break-before:always; 
            }  
            @page {
              size:portrait;
                }
        }
    </style>

    <div id="receipt-data">
<table class="table hed">
<thead style="text-align:center;">
<tr style="text-align:center;">  
    <th colspan="1">Name</th>
<th colspan="2">{{$customer_data->name}}i</th>
<th colspan="1">Customer Tax No</th>
<th colspan="2">{{$customer_data->tax_no}}</th>
</tr>
</thead>
</table>

 <table class="table table-bordered" style="text-align:center;">
            <thead>
                <tr>
                    <th>S</th>
                    <th>Item Code</th>
                    <th>Description</th>
                    <th>Unit</th>
                    <th>Unit Price</th>
                    <th>Qty</th>
                    <th>Amount($)
                    </th>
                </tr>
            </thead>
            <tbody>

                @foreach($product_sale_data as $key=>$product_sale_data)
                @php
          $product_data = \App\Product::find($product_sale_data->product_id);
                    if($product_data->sale_unit_id)
      $unit = \App\Unit::find($product_data->sale_unit_id)->unit_name;
                    else
                        $unit = 'N/A';
                @endphp  
    <tr class =  @if  ( $key % 22 == 0 && $key ) "page-break"   @endif>
 <td>{{$key+1}}</td>
  <td>{{$product_data->code}}</td>
  <td>{{$product_data->name}}</td>
 <td>{{$unit}}</td>
<td>{{number_format($product_sale_data->total / $product_sale_data->qty, 2)}}</td>
                    <td>{{$product_sale_data->qty}}</td>
                    <td>{{number_format($product_sale_data->total, 2)}}</td>
                @endforeach
                 <br>

Answer 1

ПРИМЕЧАНИЕ: если значение $key начинается с 0, то ниже <thead> не требуется, но если $key начинается с 1, то ниже требуется один раз, нет необходимости повторять цикл foreach

    <thead>
        <tr>
            <th>S</th>
            <th>Item Code</th>
            <th>Description</th>
            <th>Unit</th>
            <th>Unit Price</th>
            <th>Qty</th>
            <th>Amount($)
            </th>
        </tr>
    </thead>
    @foreach($product_sale_data as $key=>$product_sale_data)
        @if  ( $key % 22 == 0 && $key ) // so here every 22 rows after this will go
            <thead>
                <tr>
                    <th>S</th>
                    <th>Item Code</th>
                    <th>Description</th>
                    <th>Unit</th>
                    <th>Unit Price</th>
                    <th>Qty</th>
                    <th>Amount($)
                    </th>
                </tr>
            </thead>
        @endif
        <tbody> 
            @php
            $product_data = \App\Product::find($product_sale_data->product_id);
                if($product_data->sale_unit_id)

            ...continue your code