Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Multiple tables (one by one) and only bottom border #40

Open
Tarshevskiy opened this issue Nov 26, 2020 · 6 comments
Open

Multiple tables (one by one) and only bottom border #40

Tarshevskiy opened this issue Nov 26, 2020 · 6 comments

Comments

@Tarshevskiy
Copy link

Hello! I tried to find any information and got zero results.
I need to create multiple tables wit different headers, but stuck.
When I'm trying to add second table it's broken.

Second issue is: how to add only at last row TOP border? and last question: is there way to make bold text in last cell?

part of my code:

  const pdf = new PDFDocument({
      size: "A4",
      margin: 45,
      autoFirstPage: true,
    }),
    table = new PdfTable(pdf, {
      bottomMargin: 30,
    });
table
    .addPlugin(
      new (require("voilab-pdf-table/plugins/fitcolumn"))({
        column: "title",
      })
    )
    .setColumnsDefaults(column_opts);

  add_table_func(pdf, table); //this makes new table for first time 

  pdf.x = left_margin;
  pdf.moveDown(5);

  add_table_func(pdf, table); //this makes broken table for second time
  pdf.end();


function add_table_func(pdf, table) {
  console.log("pdf.page.width", pdf.page.width);
  table
    .addColumns([
      {
        id: "title",
        header: "Herr Peckewitz, Holger",
        align: "left",
        width: pdf.page.width - 330,
      },
      {
        id: "net",
        header: "Netto",
        width: 50,
      },
      {
        id: "tax",
        header: "MwSt. 5%",
        width: 60,
      },
      {
        id: "gross",
        header: "MwSt. 16%",
        width: 60,
        // border: ["L", "B", "T", "R"],
      },
      {
        id: "total",
        header: "Brutto",
        width: 70,
        // border: data.title == undefined ? ["B"] : [],
        renderer: function (tb, data) {
          table.pdf.fontSize(10).font("./IBM_Plex_Sans/IBMPlexSans-Light.ttf");
          return data.total;
        },
      },
    ])
    .onPageAdded(function (tb) {
      tb.addHeader();
    });

  table.addBody([
    {
      title: "ISANA Cremedusche Pearl, 300 ml ",
      net: 0.59,
      tax: "0",
      gross: 0.1,
      total: 0.69,
    },
    {
      title: "Liefergebühr",
      net: 0.73,
      tax: "0",
      gross: 0.12,
      total: 0.85,
    },
    {
      net: 1.32,
      tax: "0",
      gross: 0.22,
      total: 1.54,
      last_field: true,
    },
  ]);
}

pdfkit_issue

should_be

@tafel
Copy link
Contributor

tafel commented Nov 26, 2020

Hello, you should add only once your columns (just after your setColumnsDefaults)
And your add_table_func should only add the content (addBody). And it should do the trick,

@Tarshevskiy
Copy link
Author

Tarshevskiy commented Nov 26, 2020

addBody

Wow, thanks for quick answer! I,ve changed code, like you advised. But (text under code)

table
    .addPlugin(
      new (require("voilab-pdf-table/plugins/fitcolumn"))({
        column: "title",
      })
    )
    .setColumnsDefaults(column_opts)
    .addColumns([
      {
        id: "title",
        header: "Herr Peckewitz, Holger",
        align: "left",
        width: pdf.page.width - 330,
      },
      {
        id: "net",
        header: "Netto",
        width: 50,
      },
      {
        id: "tax",
        header: "MwSt. 5%",
        width: 60,
      },
      {
        id: "gross",
        header: "MwSt. 16%",
        width: 60,
        // border: ["L", "B", "T", "R"],
      },

      {
        id: "total",
        header: "Brutto",
        width: 70,
        // border: data.title == undefined ? ["B"] : [],
        renderer: function (tb, data) {
          table.pdf.fontSize(10).font("./IBM_Plex_Sans/IBMPlexSans-Light.ttf");
          return data.total;
        },
      },
    ])
    .onPageAdded(function (tb) {
      tb.addHeader();
    });

  add_table_func(pdf, table);

  pdf.x = left_margin;
  pdf.moveDown(5);

  add_table_func(pdf, table);

  pdf.text("i'm not moved down");

  pdf.end();


function add_table_func(pdf, table) {
  console.log("pdf.page.width", pdf.page.width);

  table.addBody([
    {
      title: "ISANA Cremedusche Pearl, 300 ml ",
      net: 0.59,
      tax: "0",
      gross: 0.1,
      total: 0.69,
    },
    {
      title: "Liefergebühr",
      net: 0.73,
      tax: "0",
      gross: 0.12,
      total: 0.85,
    },
    {
      net: 1.32,
      tax: "0",
      gross: 0.22,
      total: 1.54,
      last_field: true,
    },
  ]);
}


Is there any way to change header title name in different tables? Like in attached picture below.

And could I have access for only last cell to make font weight bolder? And maybe there is a way to get access only to last row border?

Every tables would be creating by loop function with different headers

I will be very grateful for your answer.

different_header_title

@tafel
Copy link
Contributor

tafel commented Nov 26, 2020

There's no "magic" with text formatting. You need to set yourself the bold font when displaying total. You need to use your last_field to set bold font, for example in the onRowAdd event. And alos in your onHeaderAdd event.

For your header, you can use setColumnParam(columnId, key, value, silent) to change the header.

@Radjoni
Copy link

Radjoni commented Oct 4, 2021

What about this 'i'm not mvoed down' text?
I have the same problem when i want to add some text to be centered before table (like some table title).
Text before first table is ok but before second table text is moved to right even with use of moveDown() method.

After every table i call pdfDoc.moveDown() and then i call:

pdfDoc.font('Times-Bold')
.text(${title}, { align: 'center' });

Can u help me? :)

@tafel
Copy link
Contributor

tafel commented Oct 4, 2021

You can control the starting point of your table by reseting the x position: pdfDoc.x = 20; // for example

@Radjoni
Copy link

Radjoni commented Oct 4, 2021

Now it's everything as expected.
Thx.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants