0

El inconveniente que tengo es que estoy creado tablas dinámicas, esto viene de consultas llamadas desde una api, pero estas deben de ocupar el menor espacio para las impresiones (Esto lo hago para optimizar el uso del papel), para poder crear el titulo de la tabla hice esto:

const head_tab1 = [['DETALLE GENERAL DEL TRANSPORTE']];

Para poder mandar el titulo lo plasme de la siguiente manera:

 autoTable(doc, {
      head: head_tab1,
      theme: 'plain',
      headStyles: {
        valign: 'middle',
        halign: 'center'
      },
      startY: 60,
      styles: {
        fontSize: 9,
      },
      margin: {        
        bottom: 0
      },
    });

Para la parte del body lo que hice fue esto :

var bodyTransporte = [
      ['Transportista', "TRANSPORTE"],
      ['Unidad',  "TRANSPORTE"],
      ['Operador',  "TRANSPORTE"],
      ['Placas Tracto',  "TRANSPORTE" ],
      ['Placas Remolque', "TRANSPORTE"],
      ['Número De Transporte',  "TRANSPORTE" ],
      ['Número De Contenedor',  "TRANSPORTE"]      
    ];

Al pasarlo a autotable lo hice asi:

autoTable(doc, {
      showHead: 'firstPage',
      body: bodyTransporte,
      theme: 'plain',
      didDrawCell: (bodyTransporte) => {

      },
      styles: {
        fontSize: 9 ,overflow: 'linebreak',
        cellPadding: 0},
      columnStyles: {
        0: {
          cellWidth: 80,
          cellPadding: 0.5
        },
        1: {
          cellWidth: 'auto',
          cellPadding: 0.5
        }
      },
      margin: {
        top:  -30,
        bottom: 0
      },
    });

Pero al generar el pdf este sigue con la misma separación entre una tabla y la otra.

introducir la descripción de la imagen aquí

El espacio al que me refiero es el que esta marcado en rojo con las flechas. La razón por la cual hice de declarar una tabla para colocarlo como titulo, fue porque siguen mas tablas abajo las cuales son de distintas longitudes y campos, en lo que estuve investigando solo pude reducir el espacio en las tablas que contienen mas datos de esta manera, en estilos agregue :

overflow: 'linebreak', cellPadding: 0

Que me sirvió para reducir el tamaño del texto, pero no he hallado la manera en reducir el espacio entre las tablas, todo esto lo estoy haciendo en angular

1 respuesta 1

0

SOLUCIÓN

Buscando de manera mas detallada en la documentación, esta hace mención que se puede tener un margen de acuerdo a la ultima tabla que se creo, todo con la siguiente linea:

doc.autoTable({
   startY: doc.lastAutoTable.finalY + 10, // todo con doc.lastAutotable.finalY + la cantidad que desee,
   //...
})

En angular me causaba un error, mencionaba que lastAutoTable no estaba definida, investigue y lo solucione asi:

import { jsPDF } from 'jspdf';
import 'jspdf-autotable';
import autoTable, { UserOptions } from 'jspdf-autotable';
//Se tiene que importar así
interface jsPDFCustom extends jsPDF {
  autoTable: (options: UserOptions) => void;
}

Donde se declara la inicialización de la creación del documento es:

const doc = new jsPDF(
                'p', 
                'mm', 
               [220, 280] //Estas medidas dependen de las que elijan
            ) as jsPDFCustom;

y si sigue marcando error lo que se debe de hacer es esto:

 startY: (doc as any).lastAutoTable.finalY + //Ingrese la cantidad que deseea agregar

y así es como pueden reducir el margen que se genera entre tablas

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.