Printing PDF with formatted table and multiple columns

Collapse
X
 
  • Time
  • Show
Clear All
new posts
  • esendino
    Senior Member
    • May 2019
    • 158

    Printing PDF with formatted table and multiple columns

    Hi,
    I'm trying to generate a PDF that provides 3 columns with several fields on it. Something more or less like the attached


    I know how to use {{#each ... and {{#trTag}} and {{#tdTag}} definition. This works nice but it gives back only a single group column (instead of 3). This generates an output using several pages.


    I used the {{#ifMultipleOf @key 3}}<br>{{/ifMultipleOf}}{{titulo}}{{volEst}} This works well on providing 3 colums of two fields each. The issue is that they are not formatted and so are difficult to read. It generates someting like the attached photo


    Does anyone how to code the PDF template to obtain something like the formated photo (3 columns and table)?
  • shalmaxb
    Senior Member
    • Mar 2015
    • 1602

    #2
    Hello, I struggled a lot, until I succeeded in acceptable layouts. First you should code anything and all in the code view, the WYSIWyG does not really work and often it messed up my code.
    Meanwhile I do coding for Templates all in a code editor first, see, if the HTML works and then I paste it over to the espoCRM editor.

    I attach here the code for a table, that I use for an invoice template. Also a screenshot of the result.

    I did use the old school table tags and avoided table header tag (<th>) but solved the table header as a normal <tr>, because I had problems getting it right with <th>. I don`t know why, maybe my fault, but as I do it now, it works.
    The styling works with style=......

    I hope it helps a bit. There are other solutions to find in this forum, just search (hint: search in Google, e.g. pdf table in espocrm) you will get faster and more results than by searching here in the forum itself.

    Here is the code:

    Code:
    <table>
    <tbody>
    <tr>[B] <!-- This is the first row, the table header -->[/B]
    <td width="5%" style="text-align: left;"><span style="font-weight: bold; font-size: 10px;">Pos.</span></td>
    
    <td width="33%" style="text-align: left;"><span style="font-weight: bold; font-size: 10px;">Titel</span></td>
    
    <td width="21%" style="text-align: right;"><span style="font-weight: bold; font-size: 10px;">Preis netto</span><br></td>
    
    <td width="17%" style="text-align: right;"><span style="font-weight: bold; font-size: 10px;">MwSt.</span></td>
    
    <td width="21%" style="text-align: right;"><span style="font-weight: bold; font-size: 10px;">Preis brutto</span></td>
    <td width="5%"><span style="font-size: 10px; font-weight: normal;">&nbsp;</span><br></td>
    </tr>
    
    <tr>
    <td width="5%">&nbsp;</td>
    </tr>
    <!-- Position 1 -->
    <tr> [B]<!-- This is the second row with four columns -->[/B]
    <td width="5%" font-size="10px" padding="3px 2px" style="text-align: left;"><span style="font-size: 10px; font-weight: normal;">1</span></td>
    <td width="33%" font-size="10px" padding="3px 2px" style="text-align: left;"><span style="font-size: 10px; font-weight: 400;">{{artCollectionWorksPos1Name}}</span><br><span style="font-size: 10px; font-weight: normal;">{{artCollectionWorksPos1.kuenstler}}</span><br><span style="font-size: 8px; font-weight: normal;">Rahmen/Sockel:&nbsp;{{artCollectionWorksPos1.abmessungenR ahmen}}</span></td>
    <td width="21%" font-size="10px" padding="3px 2px" style="text-align: right;"><span style="font-size: 10px; font-weight: normal;">{{verkaufspreisNettoPos1}}&nbsp;€</span></td>
    <td width="17%" font-size="10px" padding="3px 2px" style="text-align: right;"><span style="font-size: 10px; font-weight: normal;">{{mehrwertsteuerBetragPos1}}</span><span style="font-size: 10px; font-weight: normal;">&nbsp;€</span></td>
    <td width="21%" font-size="10px" padding="3px 2px" style="text-align: right;"><span style="font-size: 10px; font-weight: normal;">{{preisBruttoPos1}} €</span></td>
    </tr>
    
    <tr>
    <td width="5%">
    &nbsp;
    </td>
    </tr>
    <!-- Summen Werke -->
    <tr> [B]<!-- This is the third row, showing 4 columns, but there is provide a fifth row, because I needed it for conditional values -->[/B]
    <td width="5%" font-size="10px" padding="3px 2px"><span style="font-size: 10px; font-weight: normal;">&nbsp;</span></td>
    <td width="29%" font-size="10px" padding="3px 2px"><span style="font-size: 10px; font-weight: normal;">MwSt.-Satz:<br>{{mwStSatzKuenstler}} &nbsp;%</span></td>
    <td width="21%" font-size="10px" padding="3px 2px" style="text-align: right;"><span style="font-size: 9px; font-weight: normal;">Werk netto:<br>{{nettosumme}} €</span></td>
    <td width="21%" font-size="10px" padding="3px 2px" style="text-align: right;"><span style="font-size: 9px; font-weight: normal;">Werk MwSt.:<br>{{summeMehrwertsteuer}} €</span></td>
    <td width="21%" font-size="10px" padding="3px 2px" style="text-align: right;"><span style="font-size: 9px; font-weight: normal;">Werk Summe:<br>{{gesamtsumme}} €</span></td>
    </tr>
    </tbody>
    </table>

    Comment

    • esendino
      Senior Member
      • May 2019
      • 158

      #3
      Thank you very much shalmaxb for your interest and effort.

      Unfortunately that is not what I was looking for. What you have shown is a complex single record report.

      I don't think I have explained myself well and I will try again.

      I have a main entity and a related entity with detail information.

      In a PDF report I need to show some information of the main entity and the list of the related information records.

      At this point I can generate a report like that, as the example in document A (page 1 and 2). To code this in espoCRM, I use the #each instruction set and HTML tables.

      The problem with this document is that the number of related records can be very large, (more than a hundred records) and that generates a document with several pages.

      It is much more practical if we can reduce the number of pages of that report and for that we can consider to do it as in the document B (it is a fake image, I didn't get it).

      The problem I have when coding the PDF template in espoCRM is that I don't know how to use simultaneously the instructions ifMultipleOf, #each and the HTML of Tables.

      Using only the {{{#ifMultipleOf @key 3}}}{{/ifMultipleOf}}{{title}}{{volEst}}} instruction I manage to get the three columns out but without formatting as shown in the C document.

      That's why I was asking if anyone know how to do it and could post an example.


      Comment

      Working...