Diferencia entre revisiones de «Exportar a PDF con cabecera y pie de pagina»

De KumbiaPHP Framework Wiki
Saltar a: navegación, buscar
 
(No se muestran 25 ediciones intermedias de un usuario)
Línea 1: Línea 1:
 
Esta es una contribución inspirada en el excelente tutorial de Henrystivens, que puedes encontrar [https://www.kumbiaphp.com/blog/2018/08/06/crear-pdf-usando-html/#more-1915 Aquí].<br>
 
Esta es una contribución inspirada en el excelente tutorial de Henrystivens, que puedes encontrar [https://www.kumbiaphp.com/blog/2018/08/06/crear-pdf-usando-html/#more-1915 Aquí].<br>
Quiero complementar  agregando un encabezado y un pie de página que se repetirá cada vez que se generen más de una página en el documento.<br>
+
Quiero complementar  agregando un encabezado y un pie de página que se repetirá cada vez.<br>
 
Sin más preámbulo comencemos.<br>
 
Sin más preámbulo comencemos.<br>
Lo primero que haremos es cargar la librería MPDF a través de composer.<br>
+
Lo primero que haremos es instalar la librería MPDF a través de composer.<br>
  
 
<source lang="php">
 
<source lang="php">
Línea 11: Línea 11:
 
== Nuestro Controlador ==
 
== Nuestro Controlador ==
  
Aquí crearemos una nueva vista, la cual será llamada cada vez que deseamos exportar nuestro documento, yo recibiré el mensaje a mostrar a través de la variable '''$mensaje.'''
+
Aquí crearemos una nueva vista, la cual será llamada cada vez que deseamos exportar nuestro documento.
 
<source lang="php">
 
<source lang="php">
 
class TestController extends AppController {
 
class TestController extends AppController {
  
     public function export($mensaje) {
+
     public function export() {
//No mostramos template, como tampoco vista.
+
        //No mostramos template, como tampoco vista.
 
         View::select(null, null);
 
         View::select(null, null);
//llamamos al metodo estatico export de nuestro modelo Pdfreports pasando un titulo y un mensaje
+
        //llamamos al metodo estatico export de nuestro modelo Pdfreports pasando un titulo y un mensaje
         Pdfreports::export('Kumbieros',$mensaje);
+
         PdfReports::export('Hola Kumbieros!');
 
     }
 
     }
  
 
}
 
}
 
</source>
 
</source>
== La Vista ==
 
  
Ahora crearemos nuestra vista, que tendrá la estructura de nuestro PDF, creamos el archivo en '''default/app/views/_shared/partials/reports/test/pdf.phtml'''
+
== Las Vistas ==
<source lang="php">
+
 
 +
Ahora crearemos nuestras vistas parciales(partials), que tendrán la estructura de nuestro PDF, creamos el archivo en '''default/app/views/_shared/partials/reports/test/pdf.phtml'''
 +
<source lang="html5">
 
<html lang="es">
 
<html lang="es">
 
     <head>
 
     <head>
Línea 35: Línea 36:
 
         <link href="<?php echo PUBLIC_APP ?>css/bootstrap/bootstrap.min.css" rel="stylesheet">
 
         <link href="<?php echo PUBLIC_APP ?>css/bootstrap/bootstrap.min.css" rel="stylesheet">
 
     </head>
 
     </head>
    <style>
 
        /**        Agregamos diseño a nuestra tabla        **/
 
        .pdf-table th {
 
            padding-top: 6px;
 
            padding-bottom: 6px;
 
            text-align: left;
 
            background-color: #4CAF50;
 
            color: white;
 
        }
 
    </style>
 
 
     <body>
 
     <body>
 
         <div class="text-center">
 
         <div class="text-center">
             <h3>TUTORIAL PDF</h3>
+
            <!-- Mostramos nuestro titulo a través de la variable $titulo-->
 +
             <h3><?php echo $titulo ?></h3>
 
         </div>
 
         </div>
 
         <br><br><br>
 
         <br><br><br>
         <div class="container-fluid">
+
         <div class="container-fluid text-justify">
             <!-- Mostramos nuestro titulo, pasado a través del partials-->
+
             <!-- Agregamos gran cantidad de texto para ver la repetición del encabezado y pie de pagina.-->
             <table class="pdf-table">
+
             Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque sapien velit, aliquet eget....
                <tr>
+
                    <td colspan="4"><?php echo $titulo ?></td>
+
                </tr>
+
            </table>     
+
            <br>
+
            <!-- Mostramos nuestro titulo, pasado a través del partials-->
+
            <table>
+
                <tr>
+
                    <td><?php echo $mensaje ?></td>
+
                </tr>
+
            </table>         
+
 
         </div>  
 
         </div>  
 
     </body>
 
     </body>
Línea 69: Línea 50:
 
</source>
 
</source>
  
 +
Del mismo modo creamos el partial para el encabezado y pie de pagina
 +
'''default/app/views/_shared/partials/reports/test/header.phtml'''
 +
<source lang="html5">
 +
<table width="100%">
 +
        <tr>
 +
            <td width="50%" align="left"><img src="http://wiki.kumbiaphp.com/images/wikibanner.png"></td>
 +
            <td width="50%" align="right">Tutorial Encabezados y pie de Pagína</td>
 +
        </tr>
 +
</table>
 +
</source>
 +
 +
'''default/app/views/_shared/partials/reports/test/footer.phtml'''
 +
<source lang="html5">
 +
    <div>KumbiaPHP es un framework para aplicaciones web libre escrito en PHP.</div>
 +
</source>
  
 
== Modelo ==
 
== Modelo ==
  
Ahora crearemos nuestro modelo pdfreports.php en default/app/models.<br>
+
Ahora crearemos nuestro modelo pdf_reports.php en '''default/app/models.'''<br>
Hacemos referencia a nuestro autoload.php de la siguiente forma en nuestro modelo
+
  
 
<source lang="php">
 
<source lang="php">
 
require_once ROOT_PATH . 'vendor/autoload.php';
 
  
 
use Mpdf\Mpdf;
 
use Mpdf\Mpdf;
  
class Pdfreports {
+
class PdfReports {
  
//Declaramos nuestro header y footer como propiedades estaticas
+
     public static function getHeaderHtml() {
     private static $header_html = '
+
         //contenido del header alojada en el partials
         <table width="100%">
+
         ob_start();
         <tr>
+
        View::partial('reports/test/header');
            <td width="50%" align="left"><img src="http://wiki.kumbiaphp.com/images/wikibanner.png"></td>
+
        // Obtiene el html del búfer actual y elimina el búfer de salida actual
            <td width="50%" align="right">Tutorial Encabezados y pie de Pagína</td>
+
        return ob_get_clean();
         </tr>
+
    }
</table><hr>
+
 
    ';
+
    public static function getFooterHtml() {
     private static $footer_html = "KumbiaPHP es un framework para aplicaciones web libre escrito en PHP.";
+
        //contenido del footer alojada en el partials
 +
         ob_start();
 +
        View::partial('reports/test/footer');
 +
        // Obtiene el html del búfer actual y elimina el búfer de salida actual
 +
        return ob_get_clean();
 +
     }
  
     public static function export($titulo, $mensaje) {
+
     public static function export($titulo) {
  
 
         // Se crea la instancia de la Clase y directorio temporal
 
         // Se crea la instancia de la Clase y directorio temporal
Línea 102: Línea 100:
 
         $mpdf->setAutoTopMargin = 'stretch';
 
         $mpdf->setAutoTopMargin = 'stretch';
 
         //establezco el HTML al header
 
         //establezco el HTML al header
         $mpdf->SetHTMLHeader(self::$header_html);
+
         $mpdf->SetHTMLHeader(self::getHeaderHtml());
  
 
         //contenido de la vista alojada en el partials
 
         //contenido de la vista alojada en el partials
 
         ob_start();
 
         ob_start();
         View::partial('reports/test/pdf', false, array('titulo' => $titulo, 'mensaje' => $mensaje));
+
         View::partial('reports/test/pdf', false, array('titulo' => $titulo));
 
         // Obtiene en $html el contenido del búfer actual y elimina el búfer de salida actual
 
         // Obtiene en $html el contenido del búfer actual y elimina el búfer de salida actual
 
         $html = ob_get_clean();
 
         $html = ob_get_clean();
Línea 112: Línea 110:
 
         //agrego el footer de pagina y esta
 
         //agrego el footer de pagina y esta
 
         $mpdf->setAutoBottomMargin = 'stretch';
 
         $mpdf->setAutoBottomMargin = 'stretch';
         $mpdf->SetHTMLFooter(self::$footer_html);
+
         $mpdf->SetHTMLFooter(self::getFooterHtml());
  
 
         // Agrego el contenido del Partials al HTML
 
         // Agrego el contenido del Partials al HTML
Línea 123: Línea 121:
 
}
 
}
 
</source>
 
</source>
 +
 +
== Resultado ==
 +
 +
Ahora abrimos nuestro navegador  ingresando a nuestra url '''http://localhost/tuweb/test/export'''
 +
Y se descargara nuestro PDF, el cual repite su encabezado y pie de página por cada hoja.
 +
[[Archivo:Exportar-pdf1.jpg]]
 +
<br>
 +
[[Archivo:Exportar-pdf2.jpg]]
 +
 +
--[[Usuario:Ekogro|Ekogro]]  19:24 14 ago 2018 (UTC)
 +
[[Categoría:Tutoriales KumbiaPHP]]

Última revisión de 20:53 14 ago 2018

Esta es una contribución inspirada en el excelente tutorial de Henrystivens, que puedes encontrar Aquí.
Quiero complementar agregando un encabezado y un pie de página que se repetirá cada vez.
Sin más preámbulo comencemos.
Lo primero que haremos es instalar la librería MPDF a través de composer.

$ composer require mpdf/mpdf


Nuestro Controlador[editar]

Aquí crearemos una nueva vista, la cual será llamada cada vez que deseamos exportar nuestro documento.

class TestController extends AppController {
 
    public function export() {
        //No mostramos template, como tampoco vista.
        View::select(null, null);
        //llamamos al metodo estatico export de nuestro modelo Pdfreports pasando un titulo y un mensaje
        PdfReports::export('Hola Kumbieros!');
    }
 
}

Las Vistas[editar]

Ahora crearemos nuestras vistas parciales(partials), que tendrán la estructura de nuestro PDF, creamos el archivo en default/app/views/_shared/partials/reports/test/pdf.phtml

<html lang="es">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
        <title>PDF de Prueba</title>
        <!-- Hacemos referencia a boostrap para dar algunos estilos a nuestro diseño-->
        <link href="<?php echo PUBLIC_APP ?>css/bootstrap/bootstrap.min.css" rel="stylesheet">
    </head>
    <body>
        <div class="text-center">
            <!-- Mostramos nuestro titulo a través de la variable $titulo-->
            <h3><?php echo $titulo ?></h3>
        </div>
        <br><br><br>
        <div class="container-fluid text-justify">
            <!-- Agregamos gran cantidad de texto para ver la repetición del encabezado y pie de pagina.-->
            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque sapien velit, aliquet eget.... 
        </div> 
    </body>
</html>

Del mismo modo creamos el partial para el encabezado y pie de pagina default/app/views/_shared/partials/reports/test/header.phtml

<table width="100%">
        <tr>
            <td width="50%" align="left"><img src="http://wiki.kumbiaphp.com/images/wikibanner.png"></td>
            <td width="50%" align="right">Tutorial Encabezados y pie de Pagína</td>
        </tr>
</table>

default/app/views/_shared/partials/reports/test/footer.phtml

     <div>KumbiaPHP es un framework para aplicaciones web libre escrito en PHP.</div>

Modelo[editar]

Ahora crearemos nuestro modelo pdf_reports.php en default/app/models.

use Mpdf\Mpdf;
 
class PdfReports {
 
    public static function getHeaderHtml() {
        //contenido del header alojada en el partials
        ob_start();
        View::partial('reports/test/header');
        // Obtiene el html del búfer actual y elimina el búfer de salida actual
        return ob_get_clean();
    }
 
    public static function getFooterHtml() {
        //contenido del footer alojada en el partials
        ob_start();
        View::partial('reports/test/footer');
        // Obtiene el html del búfer actual y elimina el búfer de salida actual
        return ob_get_clean();
    }
 
    public static function export($titulo) {
 
        // Se crea la instancia de la Clase y directorio temporal
        $mpdf = new Mpdf(['tempDir' => APP_PATH . '/temp']);
 
        //Establezco setAutMargin en stretch para establecer una distancia minima que se expande conforme al alto del encabezado 
        $mpdf->setAutoTopMargin = 'stretch';
        //establezco el HTML al header
        $mpdf->SetHTMLHeader(self::getHeaderHtml());
 
        //contenido de la vista alojada en el partials
        ob_start();
        View::partial('reports/test/pdf', false, array('titulo' => $titulo));
        // Obtiene en $html el contenido del búfer actual y elimina el búfer de salida actual
        $html = ob_get_clean();
 
        //agrego el footer de pagina y esta
        $mpdf->setAutoBottomMargin = 'stretch';
        $mpdf->SetHTMLFooter(self::getFooterHtml());
 
        // Agrego el contenido del Partials al HTML
        $mpdf->WriteHTML($html);
 
        // Envia un archivo PDF al navegador
        $mpdf->Output('mipdf.pdf', \Mpdf\Output\Destination::DOWNLOAD);
    }
 
}

Resultado[editar]

Ahora abrimos nuestro navegador ingresando a nuestra url http://localhost/tuweb/test/export Y se descargara nuestro PDF, el cual repite su encabezado y pie de página por cada hoja. Exportar-pdf1.jpg
Exportar-pdf2.jpg

--Ekogro 19:24 14 ago 2018 (UTC)