Блог

История: Мы используем gotenberg для преобразования HTML в PDF. Это вариант использования счета-фактуры, поэтому очевидно, что список товаров может растянуться на одну страницу. В таком многостраничном сценарии я хочу, чтобы на каждой странице был нижний колонтитул.

Что случилось? На данный момент всякий раз, когда создается многостраничный pdf-файл, содержимое(т. е. список элементов) перекрывает фиксированный нижний колонтитул. Кроме того, нижний колонтитул присутствует только на первой странице, остальные страницы пусты.

Что я пытался сделать? Я попытался ввести некоторые JS для динамического вычисления высоты элементов и манипулирования DOM для подключения разрывов строк и нижних колонтитулов.

Код:

   <script>

    window.addEventListener('DOMContentLoaded', function () {
      
      const testElement = document.getElementById('tests');

      testElement.addEventListener('load', function () {
        console.log('sahil')
      })

      let nodesFragment = document.createDocumentFragment();
      //copy of the children in context
      const testItems = [...testElement.children];
      console.log(testItems);

      const divEnd = document.createElement('div');
      divEnd.className = 'footer-find'
      const breakHeight = 10;
      let heightCounter = 0;

      nodesFragment.appendChild(testElement.firstChild);

      for (let i=0; i < testItems.length; i  ) {

        heightCounter  = testItems[i].clientHeight;
        nodesFragment.appendChild(testItems[i]);
        
        if (heightCounter >= breakHeight) { 
// if height of elements is greater than the specified breakHeight put an element
          nodesFragment.appendChild(divEnd);
          heightCounter = 0;
        }

      }
      nodesFragment.appendChild(testElement.lastChild);

      testElement.replaceWith(nodesFragment, testElement);

      document.getElementsByClassName('invoice-datetime')[0].innerHTML = "heey";
    })

    window.removeEventListener("DOMContentLoaded", window)
</script>

 

Этот подход, очевидно, не работает, поскольку содержимое списка отсутствует в шаблоне само по себе.

Есть ли обходной путь?