Создать динамическую таблицу в pdfmake с данными из многомерных массивов

Мне нужно создать PDF-файл из данных из базы данных. На снимке экрана приведен пример, каждая запись (начинается с согласия) представляет собой массив внутри таких объектов, как:

const data = [
    {key: 'Consent ID:', entry: 5711},
    {key: 'Version:', entry: '1.0.1'},
    {key: 'Status:', entry: 'gegeben'},
    {key: 'Legal Text:', entry: 'Ich bin einverstanden. dass O2 mich 
    über O2-Produkte informiert und zwar per E-Mail, sonstiger elektronischer 
         Nachrichten und Telefon.'},
    {key: 'Eigenschaften:', entry: ''},
    {key: 'Email:', entry: ''},
    {key: 'Sonstige elektronische Nachrichten:', entry: ''},
    {key: 'Verkersdaten:', entry: ''},
],
[
    {key: 'Consent ID:', entry: 5716},
    {key: 'Version:', entry: '1.0.1'},
    {key: 'Status:', entry: 'gegeben'},
    {key: 'Legal Text:', entry: 'Ich bin einverstanden. dass O2 mich 
    über O2-Produkte informiert und zwar per E-Mail, sonstiger 
    elektronischer Nachrichten und Telefon.'},
    {key: 'Eigenschaften:', entry: ''},
    {key: 'Bestandsdaten:', entry: 'gegeben'},
    {key: 'verkehrsdaten:', entry: 'gegeben'},
]

Можно ли создать таблицу в pdfmake для каждого раздела или мне нужно другое решение? Например, у нас есть два раздела:

1. Статус Einwilligungen

2. Статус der Erlaubnisse

Пример документа


node.js pdfmake
person pkberlin    schedule 07.03.2018    source источник

Ответы (2)


arrow_upward
3
arrow_downward

ОБНОВЛЕНИЕ: Поверьте, ваш вопрос напрямую адресован здесь - https://github.com/bpampuch/pdfmake/issues/224

Была аналогичная проблема на недавнем проекте. Прокомментируйте первый ответ здесь pdfmake: Как создать несколько страница pdf с другой ориентацией? от jedi оказалась полезной, как и один ответ на PDFMAKE: Как повторять элементы массива[ ] в 'контенте'.

Что-то вроде следующего фрагмента jQuery может помочь. Поместите фрагмент ваших данных в объект (используйте столбцы вместо таблиц и новые строки вместо границ), но концепция должна помочь. Добавил немного стайлинга. В основном перебирает и вставляет его в контент.

    var Einwilligungen = [];
    Einwilligungen.push({
        consentID:5711,
        version:'1.0.1'
    });
    Einwilligungen.push({
        consentID:5716,
        version:'1.0.1'
    });

    var Erlaubnisse = [];
    Erlaubnisse.push({
        consentID:5711,
        version:'1.0.1'
    });
    Erlaubnisse.push({
        consentID:5716,
        version:'1.0.1'
    });

    var dd = {
        content: [],
        styles: {
            f18: {
                fontSize: 18
            },
            strong: {
                bold: true
            }
        },
    };
    dd.content.push({text: 'Status der Einwilligungen', style: ['f18','strong'] });
    for(var i=0;i<Einwilligungen.length;i++) {
        dd.content.push({ columns:[{text: 'Consent ID', bold:true},{text: Einwilligungen[i].consentID}]});
        dd.content.push({ columns:[{text: 'Version', bold:true},{text: Einwilligungen[i].version}]});
        dd.content.push(' ');
    }
    dd.content.push(' ');
    dd.content.push({text: 'Status der Erlaubnisse', style: ['f18','strong'] });
    for(var i=0;i<Erlaubnisse.length;i++) {
        dd.content.push({ columns:[{text: 'Consent ID', bold:true},{text: Erlaubnisse[i].consentID}]});
        dd.content.push({ columns:[{text: 'Version', bold:true},{text: Erlaubnisse[i].version}]});
        dd.content.push(' ');
    }

    pdfMake.createPdf(dd).open();
person Coke Morgan    schedule 10.03.2018

arrow_upward
1
arrow_downward

Для ширины динамического массива:

let widthArray=[]
let widthPerc =(100/this.userColumDfs.length)
for(let i=0; i<this.userColumDfs.length; i++){
  widthArray.push(widthPerc+"%")
}

console.log("widthArray",widthArray);


var documentDefinition = {
  pageOrientation: 'landscape',
  content: [
    { text: this.fileName, style: 'header' },
    { table: { headerRows:1, widths:widthArray, body: tableData } },
  ],
  styles: {
    header: { fontSize: 18, bold: true, margin: [0, 10, 0, 10], alignment: 'center' },
    tableHeader: { fillColor: '#0d989c', color: 'white' }
  }
};
return documentDefinition;
person Pramod Divekar    schedule 20.05.2020