So many time we need to send our invoices or reports in pdf. Here I'm going to explain how to generate the pdf in Laravel. You will also learn that how to send pdf in email attachment in Laravel. Here we will be creating a dynamic view page or HTML page and then will convert that html page to pdf.
Because we are creating the pdf file in Laravel so we need to install Laravel first and here is the link to let you know how to install the Laravel.
Install Laravel:
Install laravel
I'll be generating the PDF using MPDF library. So first of all we need to install mpdf using below command. I have use 6.1 version you can change it according to your need.
Install MPDF:
1 |
php composer.phar require mpdf/mpdf 6.1.0 |
Here is the route to generate the pdf file in Laravel and to email it.
1 |
Route::get('send-invoice-pdf-mail', 'InvoiceController@sendPdfInvoice'); |
Here we have InvoiceController where we are generating the pdf file using mpdf in laravel. We just assign the email data to response variable, render that email data to view. Using $mpdf object we call the function writeHTML() which generates the pdf file and the we write that generated pdf file into invoice directory. Now we can send this pdf file in mail attachment in laravel very easily. After sending the mail we delete the generated pdf file using unlink() function.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 |
<?php namespace App\Http\Controllers; use App\Http\Controllers\Controller; use Illuminate\Support\Facades\Log; use Illuminate\Support\Facades\Mail; class InvoiceController extends Controller { public function __construct() { } public function emailData() { return array('order_id' => '123', 'name' => 'Saurabh', 'email' => 'contact@coding4developers.com', 'city' => 'Gurgaon', 'unitPrice' => '340', 'paidUnit' => '340', 'subTotal' => '340', 'bookingId' => '1'); } public function sendPdfInvoice() { try { $response = $this->emailData(); $mpdf = new \mPDF(); $mpdf->WriteHTML(\View::make('email.email-invoice')->with('data', $response)->render()); $pdf_path = public_path() . '/invoice/' . $response['bookingId'] . '.pdf'; $mpdf->Output($pdf_path, 'F'); $subject = trans('messages.invoice_mail_subject'); $data = array('email' => $response['email'], 'name' => $response['name'], 'org_name' => 'Coding 4 Developers'); $status = Mail::send('email.email-report', $data, function($message) use ($data, $pdf_path, $subject) { $message->to($data['email'])->subject($subject); $message->from(env('MAIL_FROM', 'info@coding4developers.com'), 'Coding 4 Developers'); $message->attach($pdf_path); }); if ($status) { unlink($pdf_path); } $result = array('success' => 1, 'message' => 'Invoice Sent'); return \Illuminate\Support\Facades\Response::json($result)->header('Content-Type', "application/json"); } catch (\Exception $e) { Log::error("UserController::" . __METHOD__ . " " . $e->getMessage()); } } } |
email-invoice.blade.php
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 |
<!-- Emails use the XHTML Strict doctype --> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <!-- The character set should be utf-8 --> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta name="viewport" content="width=device-width"/> </head> <body> <div style="width:767px; margin:0 auto;"> <div style="width:667px; margin:0 auto; padding-top:20px; font-family: Proxima Nova Rg; padding-bottom:20px;"> <div style="clear:both; padding-bottom:40px;"></div> </section> <div style="float:left; width:33.3%; font-size:14px;"> Date Issued: <strong>{{date('jS F Y')}}</strong><br/> Invoice No: <strong>{{$data['order_id']}}</strong> </div> <div style="float:left; width:33.3%;"></div> <div style="float:right; width:33.3%; text-align:right;"> <span style="font-size:24px;">{{$data['name']}}</span><br/> {{$data['email']}}<br/> {{$data['city']}} </div> </section> <div style="clear:both;padding-bottom:30px;padding-top:30px;"></div> <section style="font-size:11px;"> <div style="float:left; width:50%;">DESCRIPTION</div> <div style="float:left; width:50%; text-align:center;"> <div style="float:left; width:33.3%;">RATE</div> <div style="float:left; width:33.3%;">No. OF UNITS</div> <div style="float:left; width:33.3%;">SUBTOTAL</div> </div> </section> <hr/> <div style="clear:both; padding-bottom:30px;"></div> <section style="font-weight:bold;font-size:16px;"> <div style="float:left; width:50%; font-size:16px;">Standard Charge</div> <div style="float:left; width:50%; text-align:center; font-size:16px;"> <div style="float:left; width:33.3%;">${{$data['unitPrice']}}</div> <div style="float:left; width:33.3%;">{{$data['paidUnit']}}</div> <div style="float:left; width:33.3%;">${{$data['subTotal']}}</div> </div> </section> </div> </div> </body> </html> |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194 195 196 |
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta name="viewport" content="width=device-width" /> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title></title> <style type="text/css"> /* ------------------------------------- GLOBAL ------------------------------------- */ * { margin: 0; padding: 0; font-size: 100%; line-height: 1.6; } img { max-width: 100%; } body { -webkit-font-smoothing: antialiased; -webkit-text-size-adjust: none; width: 100%!important; height: 100%; } /* ------------------------------------- ELEMENTS ------------------------------------- */ a { color: #348eda; } div{ font-size: 12px; } .margin-10{margin-top:20px; } .btn-primary { text-decoration: none; color: #FFF; background-color: #348eda; border: solid #348eda; border-width: 10px 20px; line-height: 2; font-weight: bold; margin-right: 10px; text-align: center; cursor: pointer; display: inline-block; border-radius: 25px; } .btn-secondary { text-decoration: none; color: #FFF; background-color: #aaa; border: solid #aaa; border-width: 10px 20px; line-height: 2; font-weight: bold; margin-right: 10px; text-align: center; cursor: pointer; display: inline-block; border-radius: 25px; } .last { margin-bottom: 0; } .first { margin-top: 0; } .padding { padding: 10px 0; } /* ------------------------------------- BODY ------------------------------------- */ table.body-wrap { width: 100%; padding: 20px; } table.body-wrap .container { border: 1px solid #f0f0f0; } /* ------------------------------------- TYPOGRAPHY ------------------------------------- */ h1, h2, h3 { color: #000; margin: 40px 0 10px; line-height: 1.2; font-weight: 200; } h1 { font-size: 36px; } h2 { font-size: 28px; } h3 { font-size: 22px; } p, ul, ol { margin-bottom: 10px; font-weight: normal; font-size: 14px; } ul li, ol li { margin-left: 5px; list-style-position: inside; } /* Set a max-width, and make it display as block so it will automatically stretch to that width, but will also shrink down on a phone or something */ .container { display: block!important; max-width: 600px!important; margin: 0 auto!important; /* makes it centered */ clear: both!important; } /* Set the padding on the td rather than the div for Outlook compatibility */ .body-wrap .container { padding: 20px; } /* This should also be a block element, so that it will fill 100% of the .container */ .content { max-width: 600px; margin: 0 auto; display: block; } /* Let's make sure tables in the content area are 100% wide */ .content table { width: 100%; } @font-face {font-family: "Proxima Nova Rg"; src: url("http://db.onlinewebfonts.com/t/cc44a2fd60ec971785c2e0fdf31f2bda.eot"); src: url("http://db.onlinewebfonts.com/t/cc44a2fd60ec971785c2e0fdf31f2bda.eot?#iefix") format("embedded-opentype"), url("http://db.onlinewebfonts.com/t/cc44a2fd60ec971785c2e0fdf31f2bda.woff2") format("woff2"), url("http://db.onlinewebfonts.com/t/cc44a2fd60ec971785c2e0fdf31f2bda.woff") format("woff"), url("http://db.onlinewebfonts.com/t/cc44a2fd60ec971785c2e0fdf31f2bda.ttf") format("truetype"), url("http://db.onlinewebfonts.com/t/cc44a2fd60ec971785c2e0fdf31f2bda.svg#Proxima Nova Rg") format("svg"); } </style> <body bgcolor="#f6f6f6"> <!-- body --> <table class="body-wrap"> <tr> <td></td> <td class="container" bgcolor="#FFFFFF"> <!-- content --> <div class="content"> <table> <tr> <td> <p>Dear {{$name}},</p> Please find attached invoice. <div class="margin-10"></div> <br><br> <div>Regards,</div> <div>Coding 4 developers</div> </td> </tr> <tr> <td><img src ='<?php echo asset('email') . '/logo.png' ?>' alt='logo' width="100" /></td> </tr> </table> </div> <!-- /content --> </td> <td></td> </tr> </table> <!-- /body --> </body> </html> |