pdfMake javascript содержимое PDF неуместно

У меня есть следующий код, я думаю, он хорошо написан, но он продолжает отображать содержимое PDF неуместно,

<html> <head>
<title>Ingreso Simple</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.20/pdfmake.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.20/vfs_fonts.js"></script>
</head> <body> <script>

var usuario = 'user';
var left = 25;
var right = 25;
var top = 210;
var bottom = 30;


var dd = {
    // a string or { width: number, height: number }
    pageSize: 'LETTER',

    // by default we use portrait, you can change it to landscape if you wish
    pageOrientation: 'portrait',

    // [left, top, right, bottom] or [horizontal, vertical] or just a number for equal margins
    pageMargins: [left, top, right, bottom],
    footer: function (currentPage, pageCount) {
        return {
            margin: [25,10,0,0],
            text:currentPage.toString() + ' / ' + pageCount};
    },
    fontSize: 9,
    header: {
        margin: [0,25,25,25],
        fontSize: 9,
        stack: [
            {columns: [
                {text: "LOGO", width: 150, margin:0},
                {stack: [
                    {text: 'ENTERPRICE 1',fontSize: 14},
                    {text: 'Adress 1',fontSize: 12},
                    {text: '9999-999-99',fontSize: 12}
                ]},
                {stack: [
                    {text: 'ASDDS',fontSize: 11},
                    {text: '23/02/2016',fontSize: 11},
                    {text: usuario, fontSize: 11}],
                    alignment: 'right',
                    width: 85
                }
            ]
            },
            {
                margin: [25, 15, 0, 0],
                columns: ['ASDSDASDA', {text: 'SIMPLE', alignment: 'right'}]
            },
            {
                margin: [25, 10, 0, 0],
                columns: [
                    {   text: 'Fecha: 21/02/2016',
                        width: 150
                    },
                    {   text: 'Carta de Porte:'},
                    {   text: '4383',
                        alignment: 'left',
                        width: 100
                    }]
            },
            {
                margin: [25,5,0,0],
                columns:[
                    {text:[{text:'Cliente:',bold:true}, 'ASDASDV.']},
                    {text:[{text:'Deposito:',bold:true}, '995555']}
                ]
            },
            {
                margin: [25,0,0,0],
                columns:[
                    {text:[{text:'Tipo :',bold:true}, 'CLASE 1']},
                    {text:[{text:'Proce:',bold:true}, 'ASDASD']}
                ]
            },
            {
                margin: [25,0,0,0],
                columns:[
                    {text:[{text:'Fecha y hora de entrada del vehiculo de transporte:',bold:true}]},
                    '07/01/2016 14:52'
                ]
            },
            {
                margin: [25,0,0,0],
                columns:[
                    {text:[{text:'Motorista:',bold:true}, 'CRISTIAN DANIEL VILLACORTA']},
                    {text:[{text:'Licencia No.',bold:true}, '-07092207871017']}
                ]
            },
            {
                margin: [25,0,0,0],
                columns:[
                    {text:[{text:'Cia. de Transporte:',bold:true}, 'PROPIO-MAQUINARIA AGRICOL']},
                    {text:[{text:'Codigo de Transporte:',bold:true}, ' ']}
                ]
            },
            {
                margin: [25,0,0,0],
                columns:[
                    {text:[{text:'Placa de vehiculo:',bold:true}, '103797']},
                    {text:[{text:'No. Marchamo:',bold:true}, 'MARC1']}
                ]
            },
            {
                margin: [25,0,0,0],
                columns:[
                    {text:[{text:'Fecha de descarga:',bold:true}, '07/01/2016']},
                    {text:[{text:'Hora inicio:',bold:true}, '15:14'], width:85},
                    {text:[{text:'Hora fin:',bold:true}, '00:00'], width:85},
                    {text:[{text:'Ubicacion:',bold:true}, 'BODEGA 1']},
                    {text:[{text:'Muelle:',bold:true}, 'MUELLE 1']}
                ]
            },
            {
                margin: [25,0,0,0],
                columns:[
                    {text:[{text:'Descargado por: ',bold:true}, 'Cliente']},
                    {text:[{text:'Mercaderia Paletizada? ',bold:true}, 'Granel']},
                    {text:[{text:'Utiliza DAN? ',bold:true}, 'SI']}
                ]
            }
        ]
    },
    content: [
        {
            fontSize: 9,
            table:{
                headerRows:1,
                widths: [ 60, 60, 145, 135, 55, 55 ],
                body:[
                    [
                        'Codigo Mercaderia',
                        'Codigo Referencia',
                        'Descripcion Mercaderia',
                        {stack:['Cantidad de bultos', {columns:['Declarada', 'Recibida', 'Diferencia']}],alignment:
'center'},
                        'Unidad Medida',
                        'Estado Mercaderia'
                    ],[
                        '07951',
                        ' ',
                        'Equipo hidraulico industrial',
                        {stack:[{columns:['100','101','-1']}]},
                        'BTOS',
                        'Bueno'
                    ],[
                        '07951',
                        ' ',
                        'Equipo hidraulico industrial',
                        {stack:[{columns:['100','101','-1']}]},
                        'BTOS',
                        'Bueno'
                    ],[
                        '10094461 1',
                        ' ',
                        'Exhividores de piso',
                        {stack:[{columns:['150','150','0']}]},
                        'BTOS',
                        'Bueno'
                    ],
                    [' ',' ', ' ', {stack:[{columns:['5400','5404','-4']}]}, ' ',' ']]
            }
        },
        {margin:[0,10,0,0], text:[{text:'Observaciones: ', bold:true}, 'ASDASDASDAS']}
    ]
};
var asdf = pdfMake.createPdf(dd);
asdf.open(); </script> </body> </html>

Код должен создать PDF-файл с заголовком и таблицей, но он печатается следующим образом: скриншот сгенерированного pdf

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


person lennin92    schedule 24.02.2016    source источник


Ответы (1)


Проблема заключалась в том, что переменные слева, справа, сверху и снизу конфликтуют с некоторыми другими переменными в области видимости, поэтому ответ — переименовать переменные и заменить их там, где они используются:

var _left = 25;
var _right = 25;
var _top = 210;
var _bottom = 30;

// [...] (inside dd object)
pageMargins: [left, top, right, bottom],

После этой замены pdf отлично отрендерился

person lennin92    schedule 24.02.2016