PDF for Backpackphp artisan vendor:publish –provider=“Backpack\CRUD\BackpackServiceProvider” –tag=“views”

Plan A (Marcelle’s original method)

Put all of this in the newly shown views/vendor/backpack/crud/list.blade.php

@push('after_scripts')    $(document).ready(function () {      $('#crudTable thead th').each(function () {        if ($(this).text().trim() === 'Actions') {          $(this).addClass('noExport');        }      });      $('#crudTable tbody td').each(function () {        if ($(this).text().trim() === 'Edit' || $(this).find('a, button').length) {          $(this).addClass('noExport');        }      });    });    $(function () {      // Destroy old DataTable      crud.table.destroy();      // Reinitialize with custom buttons      crud.table = $('#crudTable').DataTable({        ...crud.dataTableConfiguration, // keep existing config        buttons: [          {            extend: 'pdfHtml5',            orientation: 'portrait',            pageSize: 'A4',            // title: 'Export Data',            text: 'Export to PDF',            exportOptions: {              columns: ':not(.noExport)' // or use [0, 1, 2, 3]            },              // exportOptions: {              //   columns: [0, 1, 2, 3] // exclude column 4 (Actions)              // },            customize: function (doc) {              doc.styles.title = {                color: '#4CAF50',                fontSize: 11,                alignment: 'left'              };              doc.styles.tableHeader = {                bold: true,                fontSize: 11,                color: 'black',                fillColor: '#eeeeee',                alignment: 'left'              };                // Add logo (base64) to top left              doc.header = function(currentPage, pageCount, pageSize) {                return {                  columns: [                    {                      image: 'data:image/png;base64,{{ base64_encode(file_get_contents(public_path("logo.png")))}}',                      width: 100                    },                    {                      text: 'Data Export',                      alignment: 'right',                      margin: [0, 20, 0, 0],                      fontSize: 12,                      bold: true                    }                  ],                  margin: [40, 20]                };              };              // Footer with page numbers              doc.footer = function(currentPage, pageCount) {                return {                  columns: [                    {                      text: 'Generated by SURGE',                      alignment: 'left',                      fontSize: 9,                      margin: [40, 0]                    },                    {                      text: 'Page ' + currentPage.toString() + ' of ' + pageCount,                      alignment: 'right',                      fontSize: 9,                      margin: [0, 0, 40]                    }                  ]                };              };              // Adjust table column widths to auto-fit              // var body = doc.content[1].table.body;              // var colCount = body[0].length;              // doc.content[1].table.widths = new Array(colCount).fill('*');              // doc.content[1].table.widths = Array(doc.content[1].table.body[0].length + 1).join('*').split('');              doc.pageMargins = [40, 60, 40, 60];            }          },          'csv',          'excel',          'print'        ],        dom: 'Blfrtip', // show buttons      });    });@endpush

It does not like a svg logo

In the Controller’s list method make sure these are in:

     CRUD::enableExportButtons();

The Action Column will not export

The editable_switch fields does not export correctly, needs a workaround if they are in the data table.

This injected javascript will override the CRUD::  ‘visibleInExport’ => true. commands.

Show Method:

Works best with DomPDF:

composer require barryvdh/laravel-dompdf

Add custom route:

Route::get('#####/{id}/export-pdf', '####CrudController@exportPdf')->name('#####.export-pdf');

Add Custom function in CRUD Controller:

use Barryvdh\DomPDF\Facade\Pdf;public function exportPdf($id){    $entry = CRUD::findOrFail($id);    $pdf = Pdf::loadView('pdf.######', compact('entry'));    return $pdf->download('#####-' . $id . '.pdf');}

Add this as a new file in vendor/backpack/crud/buttons/ export_pdf.blade.php

[route.'/'.$entry->getKey().'/export-pdf') }}" class="btn btn-sm btn-link">    ** Export PDF](href=)

In CRUD Controller SetShowOperation:

$this->crud->addButtonFromView('line', 'export_pdf', 'export_pdf', 'end');

Create a view for the output of the pdf that will be called by Pdf::loadView(‘pdf.######’, compact(’entry’)). and customise;


        

Order #{{ $entry->id }}            body { font-family: DejaVu Sans, sans-serif; font-size: 12px; color: #333; }        .header { text-align: center; margin-bottom: 20px; }        .logo { width: 150px; margin-bottom: 10px; }        table { width: 100%; border-collapse: collapse; margin-bottom: 20px; }        table, th, td { border: 1px solid #ddd; }        th, td { padding: 8px; text-align: left; }    

            ![Logo]({{ public_path('logo.png') }})        ## @if ($entry->status == 'COMPLETE') Order @else Basket @endif

          **Customer:** {{ $entry->user->name}}

    #### Items

    | Qty | Item | Price | Fee | Total |
| --- | --- | --- | --- | --- |
| {{ $item->quantity }} | {{ $item->name }} | £ {{ number_format($item->price, 2) }} | £ {{ number_format($item->fee, 2) }} | £ {{ number_format($item->quantity * ($item->price + $item->fee), 2) }} |

    {{-- **Total:** {{ number_format($entry->items->sum(fn($i) => $i->quantity * $i->price), 2) }}

 --}}

Plan B (Andy’s way in Evolve)

Still publish the views (in Evolve we already had built in export to PDF enabled)

Edit resources/views/vendor/backpack/crud/inc/export_buttons.blade.php

Comment out;

/*{                    name: 'pdfHtml5',                    extend: 'pdfHtml5',                    exportOptions: {                        columns: function ( idx, data, node ) {                            var $column = crud.table.column( idx );                                return  ($column.visible() && $(node).attr('data-visible-in-export') != 'false') || $(node).attr('data-force-export') == 'true';                        },                        format: dataTablesExportFormat,                    },                    orientation: 'landscape',                    action: function(e, dt, button, config) {                        crud.responsiveToggle(dt);                        $.fn.DataTable.ext.buttons.pdfHtml5.action.call(this, e, dt, button, config);                        crud.responsiveToggle(dt);                    }                },*/

Replace with;

{                    extend: 'pdfHtml5',                    orientation: 'landscape',                    pageSize: 'A4',                    // title: 'Export Data',                    text: 'Export to PDF',                    exportOptions: {                        columns: function ( idx, data, node ) {                            var $column = crud.table.column( idx );                            return  ($column.visible() && $(node).attr('data-visible-in-export') != 'false') || $(node).attr('data-force-export') == 'true';                        },                        format: dataTablesExportFormat,                    },                    action: function(e, dt, button, config) {                        crud.responsiveToggle(dt);                        $.fn.DataTable.ext.buttons.pdfHtml5.action.call(this, e, dt, button, config);                        crud.responsiveToggle(dt);                    },                    customize: function (doc) {                        doc.styles.title = {                            color: '#4CAF50',                            fontSize: 11,                            alignment: 'left'                        };                        doc.styles.tableHeader = {                            bold: true,                            fontSize: 11,                            color: 'black',                            fillColor: '#eeeeee',                            alignment: 'left'                        };                        // Add logo (base64) to top left                        doc.header = function(currentPage, pageCount, pageSize) {                            return {                                columns: [                                    {                                        image: 'data:image/png;base64,{{ base64_encode(file_get_contents(public_path("logo.png")))}}',                                        width: 100                                    },                                    {                                        text: 'Data Export',                                        alignment: 'right',                                        margin: [0, 20, 0, 0],                                        fontSize: 12,                                        bold: true                                    }                                ],                                margin: [40, 20]                            };                        };                        // Footer with page numbers                        doc.footer = function(currentPage, pageCount) {                            return {                                columns: [                                    {                                        text: 'Generated by SURGE',                                        alignment: 'left',                                        fontSize: 9,                                        margin: [40, 0]                                    },                                    {                                        text: 'Page ' + currentPage.toString() + ' of ' + pageCount,                                        alignment: 'right',                                        fontSize: 9,                                        margin: [0, 0, 40]                                    }                                ]                            };                        };                        // Adjust table column widths to auto-fit                        // var body = doc.content[1].table.body;                        // var colCount = body[0].length;                        // doc.content[1].table.widths = new Array(colCount).fill('*');                        // doc.content[1].table.widths = Array(doc.content[1].table.body[0].length + 1).join('*').split('');                        doc.pageMargins = [40, 60, 40, 60];                    }                },