laravel - dompdf рендерит не правильно - PullRequest
Новая
       8

laravel - dompdf рендерит не правильно

0 голосов
/ 24 марта 2020

Я использую dompdf для своего проекта в laravel, и я хочу иметь возможность щелкнуть ссылку и она преобразует ее в загружаемый PDF, в котором я обнаружил две проблемы:

  1. Это медленно и занимает некоторое время для рендеринга.
  2. После того, как это было визуализировано, выравнивание вышло далеко за пределы сетки, как пи c ниже:

enter image description here

Кстати, вот как я использую его на своем контроллере: 

 public function viewPurchaseOrder()
    {
        $pdf = PDF::loadView('backups.dashboard_receipts.purchase_order');
        return $pdf->download('invoice.pdf');

    }

И это мой файл блэйда вида (я только помещаю его фрагменты): 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Purchase Order</title>
 {{-- <link href="{{ asset('css/app.css') }}" rel="stylesheet">  --}}

    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.3/css/bootstrap.min.css" />
    <link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.no-icons.min.css" rel="stylesheet">
<link href="//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css" rel="stylesheet">
  </head>
<body>
    <div class="container">
        <div class="">

      <div class="container">
        <span class="float-left " > <img src="{{ asset('images/Invoice-Logo.png') }}" style="width:50%;" alt="No Logo"></span>
      </div>




      <div class="card-body">
      <div class="row mb-4">


      <div class="col-6 col-md-3 col-sm-6 font-style" style="font-size:10px;">

        <table class="table  table-outer-border  font-style " style="font-weight:bold;" >

       <tbody class="font-style">

         <tr class="table-dotted-line" style="height: 160px;" > 
           <td>Purchase From:</td>

         </tr>

         <tr class="table-dotted-line"> 
           <td>Person In Charge:</td>

         </tr>
         <tr class="table-dotted-line"> 
           <td>Contact No:</td>

         </tr>

       </tbody>
        </table>

    </div>

    <div class="col-6 col-md-3 col-sm-6 font-style " style="font-size:10px;">

      <table class="table table-outer-border font-style " style="font-weight:bold;" >

     <tbody class="font-style  ">

       <tr class="table-dotted-line" style="height: 160px;  " > 
         <td >Deliver To:</td>

       </tr>
       <tr class="table-dotted-line"> 
         <td>Attention To: </td>

       </tr>
       <tr class="table-dotted-line"> 
         <td>Contact No:</td>

       </tr>

     </tbody>
      </table>

      </div>
      <div class="col-6 col-md-4 offset-md-2 font-style" style="font-size:11px; ">
    <table class="table  font-style table-outer-border table-bordered " >
      <thead>

          <th class="table-secondary" style="color:red; text-align:center; font-size:10px; " colspan="2"  >PURCHASE ORDER</th>
      </thead>
   <tbody class="font-style">

     <tr > 
       <td>Number</td>
       <td>BJSDSHDSO2132</td>      
     </tr>
     <tr> 
       <td>Date</td>
       <td>28/02/2020</td>      
     </tr>
     <tr> 
       <td>Delivery Date</td>
       <td>03/04/2020</td>      
     </tr>
     <tr> 
       <td>Agent Code</td>
       <td>XSDSDS</td>      
     </tr>
     <tr> 
       <td>Credit Terms</td>
       <td>Cash</td>      
     </tr>
   </tbody>
    </table>
  </div>
</div>
   </div>

      <div class="font-style"  style="font-size:10px; ">
      <table class="table table-bordered table-outer-border ">
      <thead class="table-secondary table-outer-border ">
      <tr >
      <th class="center">No</th>
      <th>Product ID</th>
      <th>Description</th>

      <th class="left">Quantity</th>
        <th class="center">Unit Price (RM)</th>
      <th class="right">Amount(RM)</th>
      </tr>
      </thead>
      <tbody>
        <tr style="height:500px;" >
          <td  class="center">1</td>
          <td class="left strong">E3W453</td>
          <td class="left"> Longest wire ever</td>

          <td class="center">1</td>
            <td class="left">999,00</td>
          <td class="right">999,00</td>

          </tr>
      </tbody>
      </table>
      </div>

      <div class="row">

      <div class="col-4  offset-1 col-md-6 col-sm-5 font-style" style="font-size:15px; font-weight:bold;" >
      Remarks: <br><textarea style="width:100%; margin-top:30px;" cols="100" rows="10">

      </textarea>
    </div>

Если я просматриваю его в своем браузере без преобразования PDF, оно выглядит нормально. Итак, есть ли способ решить 2 проблемы, которые я перечислил?

...