Add SVG picture on constants position but only in last page

Question

I try to make invoice by Razor template, and convert it into PDF by chromium. I must add payment form to the last page, but in the constants position.

.svg-container {
            position: absolute;
            top: 12cm;
            left: 0cm;
            left: 0px;
            width: 18cm;
            height: 10cm;
        }

<div class="svg-container">
  <svg>..</svg>
</div>

When i make this way payment form svg in correct place, but on first page and overprint invoice area

<div style="position: relative;">  
  <div class="svg-container">
      <svg>..</svg>
    </div>
</div>

When I make this way payment form is after invoice data but position is variable. I think about set absolute position with top property calculated from

AbsluteTop = TopOfPage + pages * PageHeigth;

But problem is get pages count to razor code and set top to the style=top:

WriteLiteral("style =\"top: " + @razorVariablePAges + ";\"")

In header section i use

<span class='totalPages' style="font-family:Arial; font-size:7pt ">

but i can't read it into razor variable

score 0 · Answer 1 · answered May 19 '20 at 09:25

I found workaround problem. I place on end of invoice invisible label with id ="labelEnd" and div element around payment form with id="blankiet". then I use javascipt to read top of label and set top with position absolute for payment form. I still can't precise positioning payment form, his position depend on height which are begins every page. Is a better solution to say Razor/Pupetersharp to precise location payment form?

<code>        

     <script type="text/javascript">
    window.onload = function () {
    var nextPage = 0;
     //950 - page height in pixels 
     //450 - position of payment form where there is no place to insert payment form on last page.          
    var top = document.getElementById("labelEnd").offsetTop
            + document.getElementById("labelEnd").clientTop;
    if (top % 950 > 450) 
      nextPage = 1
    document.getElementById("blankiet").style.top = (Math.floor(top / 950) + nextPage) * 950 + 460; 

            }
    </script>

</code>

Add SVG picture on constants position but only in last page

1 Answers1