Correct height calculation in the sections

[MVilaH]

This code corrects the calculation of the height of the sections when using rowSpan in them since the original code oversized the height of the sections with the dimension of the rows that do not have rowSpan which causes an anticipated page break.

[MVilaH]

import { jsPDF } from "jspdf";
import { applyPlugin } from "jspdf-autotable";

applyPlugin(jsPDF);

const doc = new jsPDF({
orientation: "p",
unit: "mm",
format: "a4"
});
const body = [
[
{
content: "",
colSpan: 2,
styles: {
halign: "center",
valign: "middle"
}
},
{
content: "",
colSpan: 5,
styles: {
//cellWidth: 20,
halign: "center",
valign: "middle"
}
},
{
content: "",
colSpan: 12,
styles: {
//cellWidth: 50,
halign: "left",
valign: "middle"
}
},
{
content: "",
colSpan: 2,
styles: {
halign: "center",
valign: "middle"
}
},
{
content: "",
colSpan: 2,
styles: {
halign: "center",
valign: "middle"
}
},
{
content: "",
colSpan: 4,
styles: {
halign: "center",
valign: "middle"
}
},
{
content: "",
colSpan: 4,
styles: {
halign: "center",
valign: "middle"
}
},
{
content: "",
colSpan: 4,
styles: {
halign: "center",
valign: "middle"
}
},
{
content: "",
colSpan: 4,
styles: {
halign: "center",
valign: "middle"
}
},
{
content: "",
colSpan: 4,
styles: {
halign: "right",
valign: "middle"
}
},
{
content: "",
colSpan: 2,
styles: {
halign: "center",
valign: "middle"
}
},
{
content: "",
colSpan: 5,
styles: {
halign: "center",
valign: "middle"
}
}
]
];

for (let i = 0; i < 41; i++) {
let r = structuredClone(body[0]);

body.push(r);
}
doc.autoTable({
theme: "plain",
margin: 10,
styles: {
lineColor: [0, 0, 0],
lineWidth: 0.5,
fontSize: 8,
cellPadding: 1
},
columnStyles: columnStyles(50, 3.8),
head: [
[
{
content: "No.",
colSpan: 2,
styles: {
halign: "center",
valign: "middle"
}
},
{
content: "CÓDIGO",
colSpan: 5,
styles: {
halign: "center",
valign: "middle"
}
},
{
content: "DESCRIPCIÓN",
colSpan: 12,
styles: {
halign: "left",
valign: "middle"
}
},
{
content: "CAT",
colSpan: 2,
styles: {
halign: "center",
valign: "middle"
}
},
{
content: "U/M",
colSpan: 2,
styles: {
halign: "center",
valign: "middle"
}
},
{
content: "CANT",
colSpan: 4,
styles: {
halign: "center",
valign: "middle"
}
},
{
content: "PRECIO",
colSpan: 4,
styles: {
halign: "center",
valign: "middle"
}
},
{
content: "REC. O DES. COMERC.",
colSpan: 4,
styles: {
halign: "center",
valign: "middle"
}
},
{
content: "PRECIO UNITARIO TOTAL",
colSpan: 4,
styles: {
halign: "center",
valign: "middle"
}
},
{
content: "IMPORTE",
colSpan: 6,
styles: {
halign: "right",
valign: "middle"
}
},
{
content: "EXISTENCIA",
colSpan: 5,
styles: {
halign: "center",
valign: "middle"
}
}
]
],
body,
foot: [
[
{
content: "TOTAL",
colSpan: 39,
styles: {
halign: "center",
valign: "middle"
}
},
{
content: "",
colSpan: 4,
styles: {
halign: "right",
valign: "middle"
}
},
{
content: "",
colSpan: 2,
styles: {
halign: "center",
valign: "middle"
}
},
{
content: "",
colSpan: 11,
styles: {
halign: "center",
valign: "middle"
}
}
],
[
{
content: "ENTREGADO POR:",
colSpan: 13,
styles: {
halign: "left",
valign: "top",
minCellHeight: 7.74
}
},
{
content: "RECIBIDO-CLIENTE:",
colSpan: 13,
styles: {
halign: "left",
valign: "top"
}
},
{
content: "RECIBIDO-ALMACÉN(DEPÓSITO):",
colSpan: 13,
styles: {
halign: "left",
valign: "top"
}
},
{
content: "ANOTADO POR:",
colSpan: 11,
styles: {
halign: "left",
valign: "top"
}
}
],
[
{
content: "NOMBRE Y APELLIDOS:",
colSpan: 13,
rowSpan: 2,
styles: {
halign: "left",
valign: "top"
}
},
{
content: "NOMBRE Y APELLIDOS:",
colSpan: 13,
rowSpan: 2,
styles: {
halign: "left",
valign: "top"
}
},
{
content: "NOMBRE Y APELLIDOS:",
colSpan: 13,
rowSpan: 2,
styles: {
halign: "left",
valign: "top"
}
},
{
content: "T. ESTIBA",
colSpan: 5,

    styles: {
      halign: "center",
      valign: "top"
    }
  },
  {
    content: "SUBMAY. INV.\n",
    colSpan: 6,
    styles: {
      halign: "center",
      valign: "top"
    }
  }
],
[
  {
    content: "CONTAB.:",
    colSpan: 5,
    rowSpan: 3,
    styles: {
      halign: "left",
      valign: "top"
    }
  },
  {
    content: "RECIBIDO:\n",
    colSpan: 6,
    styles: {
      halign: "left",
      valign: "top"
    }
  }
],
[
  {
    content: "FIRMA:",
    colSpan: 7,
    rowSpan: 2,
    styles: {
      halign: "left",
      valign: "top"
    }
  },
  {
    content: "D",
    colSpan: 2,

    styles: { halign: "center", valign: "middle" }
  },
  {
    content: "M",
    colSpan: 2,

    styles: { halign: "center", valign: "middle" }
  },
  {
    content: "A",
    colSpan: 2,

    styles: { halign: "center", valign: "middle" }
  },
  {
    content: "FIRMA:",
    colSpan: 7,
    rowSpan: 2,
    styles: {
      halign: "left",
      valign: "top"
    }
  },
  {
    content: "D",
    colSpan: 2,

    styles: { halign: "center", valign: "middle" }
  },
  {
    content: "M",
    colSpan: 2,

    styles: { halign: "center", valign: "middle" }
  },
  {
    content: "A",
    colSpan: 2,

    styles: { halign: "center", valign: "middle" }
  },
  {
    content: "FIRMA:",
    colSpan: 7,
    rowSpan: 2,
    styles: {
      halign: "left",
      valign: "top"
    }
  },
  {
    content: "D",
    colSpan: 2,

    styles: { halign: "center", valign: "middle" }
  },
  {
    content: "M",
    colSpan: 2,

    styles: { halign: "center", valign: "middle" }
  },
  {
    content: "A",
    colSpan: 2,

    styles: { halign: "center", valign: "middle" }
  },
  {
    content: "D",
    colSpan: 2,

    styles: { halign: "center", valign: "middle" }
  },
  {
    content: "M",
    colSpan: 2,

    styles: { halign: "center", valign: "middle" }
  },
  {
    content: "A",
    colSpan: 2,

    styles: { halign: "center", valign: "middle" }
  }
],
[
  {
    content: "",
    colSpan: 2,

    styles: { halign: "center", valign: "middle" }
  },
  {
    content: "",
    colSpan: 2,

    styles: { halign: "center", valign: "middle" }
  },
  {
    content: "",
    colSpan: 2,

    styles: { halign: "center", valign: "middle" }
  },
  {
    content: "",
    colSpan: 2,

    styles: { halign: "center", valign: "middle" }
  },
  {
    content: "",
    colSpan: 2,

    styles: { halign: "center", valign: "middle" }
  },
  {
    content: "",
    colSpan: 2,

    styles: { halign: "center", valign: "middle" }
  },
  {
    content: "",
    colSpan: 2,

    styles: { halign: "center", valign: "middle" }
  },
  {
    content: "",
    colSpan: 2,

    styles: { halign: "center", valign: "middle" }
  },
  {
    content: "",
    colSpan: 2,

    styles: { halign: "center", valign: "middle" }
  },
  {
    content: "",
    colSpan: 2,

    styles: { halign: "center", valign: "middle" }
  },
  {
    content: "",
    colSpan: 2,

    styles: { halign: "center", valign: "middle" }
  },
  {
    content: "",
    colSpan: 2,

    styles: { halign: "center", valign: "middle" }
  }
]

]
});

function columnStyles(d, w) {
const columnStyles = {};

for (let i = 0; i < d; i++) {
columnStyles[i] = { cellWidth: w };
}
return columnStyles;
}

export default doc;

Si ejecutas este código con el código original la página se rompe antes de las 41 filas si no me equivoco por lo menos las 3 últimas filas se van a la página siguiente por el error de cálculo de la altura de las secciones

[MVilaH]

Esta es la imagen del resultado del código anterior con el código original

[MVilaH]

Y este es el mismo documento generado con los arreglos realizados en este pull request

[MVilaH]

if you count the number of rows in the body you will realize that it is the same amount but the result completely different.

[MVilaH]

By the way this error is fixed pull request #1106