mPDF: обходной путь для полей заголовка [h1-hx] в таблице - PullRequest
Новая
       23

mPDF: обходной путь для полей заголовка [h1-hx] в таблице

0 голосов
/ 25 марта 2019

Вопрос:

Как добавить поля и / или отступы в заголовки (h1 - h4), которые являются частью TD или TH?

Текущая ситуация:

У меня есть предварительно сгенерированный HTML-документ, который генерируется JIRA. Структура этого документа следующая: 

<tr class="rowAlternate">
  <td class="jira-macro-table-underline-pdfexport">
    <h1><a name="StandardizedInterface"></a>Standardized Interface</span></h1>
    <h2><a name="ShortDescription"></a>Short Description</h2>
    <ul> ... </ul>
  </td>
</tr>

Я программно дополняю этот документ <tocentry> и другими специфическими для mPDF элементами, чтобы его можно было использовать в качестве раздаточного материала, сгенерированный PDF выглядит довольно хорошо, но у меня есть одна серьезная проблема с заголовками в таблицах.

Вот как документ отображается в браузере:

As shown in browser

Внутри сгенерированного PDF:

Inside PDF

Как видно, поля заголовков исчезли при экспорте в PDF. Все мои тесты с добавлением встроенного CSS к заголовкам или для обтекания их другими элементами пока не дали результатов. Документация mPDF гласит:

Теги уровня блока (DIV, P и т. Д.) Игнорируются внутри таблиц, включая любые Стили CSS.

Скорее всего, это будет означать, что это невозможно сделать с помощью чистого CSS или переноса.

Я надеюсь, что кто-то еще сталкивался с этой проблемой раньше и мог бы поделиться некоторыми соображениями о том, как достичь расстояния между элементами блока.

Ответы [ 2 ]

0 голосов
/ 26 марта 2019

Обходной путь / решение

Я использовал обходной путь, который решил проблему в моем случае с помощью preg_replace_callback(), который мне был необходим в любом случае для правильного форматирования документа.Всякий раз, когда обратный вызов обрабатывает заголовок, я добавляю прозрачное изображение сразу после текста заголовка, высоту которого я определяю с помощью математики.

Код 

function formatHeading($p) {

  // I only want headings for h1-h3:
  $tocEntry= '';
  if (is_numeric($p[2]) &&  $p[2] >= 1 && $p[2] <= 3) {
    $tocEntry= "<tocentry level=\"{$p[2]}\" content=\"{$p[3]}\" />";
  }

  // calculates the heights of the vertical spacer
  $spacerHeight= ((6-$p[2]) * 10);

  return
  "{$p[1]}{$tocEntry} {$p[3]} {$p[4]}
   <img src=\"../assets/images/transparent.png\" height=\"{$spacerHeight}\" style=\"vertical-align:middle;\" width=\"1\" border=\"0\"/>";
}

// Matches e.g. "<h2><a name="SimpleTest"></a>Simple test</h2>"
$buffered= preg_replace_callback('|(<h(\d)+>?<a?[\w\s\d="%>]+<\/a>)(.+?[\s\r\n\']*.*)(<\/h\d+>)|',
  "formatHeading", $buffered);

Результат

Чтобы проиллюстрировать положение проставки, я использовал непрозрачное изображение для создания PDF:

Sample showing formatted headings

0 голосов
/ 26 марта 2019

Вы хотите преобразовать разметку в формат, подобный следующему: 

<table>
    <tr>
        <td class="h1">Report</td>
    </tr>

    <tr>
        <td class="h2">Description</td>
    </tr>

    <tr>
        <td>Body</td>
    </tr>
</table>

Затем можно применить соответствующие отступы к элементам <td>, указав имя класса: 

<style>
table, th, td {
    border: none;
}

td.h1 {
    padding: 30px 0;
}

td.h2 {
    padding: 15px 0;
}
</style>

Используйте синтаксический анализатор DOM, такой как Symfony , чтобы помочь вам пройти текущую разметку и автоматически перестроить ее в нужный формат.

...