使用 PDF MAKE 创建和导出 table

Question

我创建了一个 UI 网格，然后单击按钮将网格导出为 pdf 格式进行打印。我使用了这些出口商：

        exporterHeaderFilterUseName: true,
        exporterLinkLabel: 'get your csv here',
        exporterPdfDefaultStyle: {fontSize: 9},
        exporterPdfTableStyle: {margin: [0, 5, 0, 15]},
        exporterPdfTableHeaderStyle: {fontSize: 10, bold: true, italics: true, color: 'red'},
        exporterPdfOrientation: 'portrait',
        exporterPdfPageSize: 'LETTER',
        exporterPdfMaxGridWidth: 475,

每列 header 的导出器：

            exporterHeaderFilter: function( displayName ) {
            if( displayName === 'routeName' ) { 
                  return 'Route'; 
                }
            if( displayName === 'mondayNet' ) { 
                  return 'MONDAY'; 
                }
            if( displayName === 'tuesdayNet' ) { 
                  return 'TUESDAY'; 
                }
            if( displayName === 'wednesdayNet' ) { 
                  return 'WEDNESDAY'; 
                }
            if( displayName === 'thursdayNet' ) { 
                  return 'THURSDAY'; 
                }
            if( displayName === 'fridayNet' ) { 
                  return 'FRIDAY'; 
            } 
            if( displayName === 'totalNet' ) { 
                  return 'TOTAL'; 
            }

            else { 
              return displayName;
            } 
          },

我想创建一个 header，其中包含更多关于网格的数据。我想创建一个 table，但我不确定如何将其导出到与 ui 网格一起显示的同一个 pdf。 table 的布局如下：

var docDefinition = {
      content: [
        {

          table: {

            widths: [ '*', 'auto', 100, '*' ],

            body: [
              [ 'First', 'Second', 'Third', 'The last one' ],
              [ 'Value 1', 'Value 2', 'Value 3', 'Value 4' ],
              [ { text: 'Bold value', bold: true }, 'Val 2', 'Val 3', 'Val 4' ]
            ]
          }
        }
      ]
    };

关于如何将此 table 导出到具有 ui 网格的相同 pdf 的任何想法？谢谢

Answer 1

知道了！我所要做的就是将 table 放在 exporterPdfHeader 中，它也在 ui 网格

中

exporterPdfHeader: {
                margin: [15, 5, 15, 15],
                table: {

                widths: [ '*', '*', '*' ],

                body: [
                  [ 'Region: ', 'Group: ', 'MC: ' ],
                  [ 'District #: ', 'Route #: ', 'Week Ending Date: ']

                ]
              }  

            },

使用 PDF MAKE 创建和导出 table

Creating and exporting a table using PDF MAKE

javascript

angularjs

pdf

pdfmake