Javascript PDFMAKE:在列表视图中单击按钮时生成不同的PDF
我正在使用CouchCMS和pfdmake 我有一个列表视图,使用通过couchcms生成的自定义路由Javascript PDFMAKE:在列表视图中单击按钮时生成不同的PDF,javascript,ajax,pdfmake,Javascript,Ajax,Pdfmake,我正在使用CouchCMS和pfdmake 我有一个列表视图,使用通过couchcms生成的自定义路由 <cms:pages masterpage="data.php" paginate="1" limit="50" orderby='publish_date' custom_field="status_fifty!='No'" show_future_entries='1' > <!--
<cms:pages masterpage="data.php" paginate="1" limit="50" orderby='publish_date' custom_field="status_fifty!='No'" show_future_entries='1' >
<!-- List generation logic here -->
</cms:pages>
如何才能显示pdf内容?
将生成blob,并在新选项卡中显示,但该blob为空
async function generatePDF() {
var str = "Calling, Street View.";
var res = str.toUpperCase();
var imageWidth = 476.224;
// var imageHeight = 210.4725;
var imageHeight= 280.63;
var dd = {
pageSize: 'A4',
pageMargins: [ 40, 40, 40, 40 ],
footer: function(page) {
{
return {
columns: [
{
text: '* KINDLY NOTE BUILDING NUMBER AND UNIT RANGES CONFIRMED BY ' + res,
style: 'footerComment',
alignment: 'center'
}
]
};
}
},
content: [
{
table: {
widths: ['*'],
body: [
[
{
style: 'header',
text: 'Still Water Apartments2'
}
],
[
{
style: 'address',
text: '5901 Leopard St; Corpus Christi; TX 78409, 210-248-9443',
}
],
[
''
],
[
{
image: await this.getBase64ImageFromURL(
"http://localhost/CTO/USGeoTagging/couch/uploads/attachments/ab9422df6cb6f0f5d215e89c916d7219.png"
),
width: imageWidth,
height: imageHeight,
alignment: 'center'
}
],
[
''
],
[
{
style: 'mapfrom',
text: 'Map From:'
}
],
[
{
style: 'mapfromUrl',
text: 'https://www.gxcpl.com/asdfasd',
link: 'https://www.gxcpl.com/asdfasd'
}
],
[
''
],
[
{
table: {
widths: ['45%','55%'],
body: [
[
'APARTMENT DETAILS',
'BUILDING NUMBER & UNIT RANGES *'
]
]
},
layout: 'noBorders'
}
],
[
{
table: {
widths: ['20%','25%','50%'],
body: [
[
{
style: 'contentTextBold',
text:'DELIVERY PARKING\nLEASING OFFICE\nMAIL ROOM\nDIRECTIONALITY\nNO. OF ENTRANCES\nACCESS TYPE\nGATE\nGATE TYPE\nGATE (L)\n\nLOADING DOCK'
},
{
style: 'contentTextNormal',
text:': Yes, Building wise\n: Yes\n: No\n: 0\n: 1\n: Blank\n: No\n: Blank\n: Locked Gate, used in case of Emergency\n: No'
},
{
table: {
body: [
[
{
text: 'Building #',
style: 'contentTextBold'
},
{
text: 'Unit #',
style: 'contentTextBold'
}
],
[
{
text: 'BLDG #1',
style: 'contentTextNormal'
},
{
text: '1-10',
style: 'contentTextNormal'
}
]
],
alignment: 'center'
},
}
]
]
},
layout: 'noBorders'
}
]
]
},
layout: 'noBorders'
}
],
styles: {
header: {
fontSize: 16,
bold: 'true'
},
address: {
fontSize: 10,
bold: 'true'
},
mapfrom: {
fontSize: 6,
bold: 'true'
},
mapfromUrl: {
fontSize: 6,
color: 'blue'
},
contentTextBold: {
fontSize: 9,
bold: true
},
contentTextNormal: {
fontSize: 9
},
footerComment: {
fontSize: 5
}
},
defaultStyle: {
alignment: 'justify'
}
}
pdfMake.createPdf(dd).open();
}
问候
async function generatePDF() {
var str = "Calling, Street View.";
var res = str.toUpperCase();
var imageWidth = 476.224;
// var imageHeight = 210.4725;
var imageHeight= 280.63;
var dd = {
pageSize: 'A4',
pageMargins: [ 40, 40, 40, 40 ],
footer: function(page) {
{
return {
columns: [
{
text: '* KINDLY NOTE BUILDING NUMBER AND UNIT RANGES CONFIRMED BY ' + res,
style: 'footerComment',
alignment: 'center'
}
]
};
}
},
content: [
{
table: {
widths: ['*'],
body: [
[
{
style: 'header',
text: 'Still Water Apartments2'
}
],
[
{
style: 'address',
text: '5901 Leopard St; Corpus Christi; TX 78409, 210-248-9443',
}
],
[
''
],
[
{
image: await this.getBase64ImageFromURL(
"http://localhost/CTO/USGeoTagging/couch/uploads/attachments/ab9422df6cb6f0f5d215e89c916d7219.png"
),
width: imageWidth,
height: imageHeight,
alignment: 'center'
}
],
[
''
],
[
{
style: 'mapfrom',
text: 'Map From:'
}
],
[
{
style: 'mapfromUrl',
text: 'https://www.gxcpl.com/asdfasd',
link: 'https://www.gxcpl.com/asdfasd'
}
],
[
''
],
[
{
table: {
widths: ['45%','55%'],
body: [
[
'APARTMENT DETAILS',
'BUILDING NUMBER & UNIT RANGES *'
]
]
},
layout: 'noBorders'
}
],
[
{
table: {
widths: ['20%','25%','50%'],
body: [
[
{
style: 'contentTextBold',
text:'DELIVERY PARKING\nLEASING OFFICE\nMAIL ROOM\nDIRECTIONALITY\nNO. OF ENTRANCES\nACCESS TYPE\nGATE\nGATE TYPE\nGATE (L)\n\nLOADING DOCK'
},
{
style: 'contentTextNormal',
text:': Yes, Building wise\n: Yes\n: No\n: 0\n: 1\n: Blank\n: No\n: Blank\n: Locked Gate, used in case of Emergency\n: No'
},
{
table: {
body: [
[
{
text: 'Building #',
style: 'contentTextBold'
},
{
text: 'Unit #',
style: 'contentTextBold'
}
],
[
{
text: 'BLDG #1',
style: 'contentTextNormal'
},
{
text: '1-10',
style: 'contentTextNormal'
}
]
],
alignment: 'center'
},
}
]
]
},
layout: 'noBorders'
}
]
]
},
layout: 'noBorders'
}
],
styles: {
header: {
fontSize: 16,
bold: 'true'
},
address: {
fontSize: 10,
bold: 'true'
},
mapfrom: {
fontSize: 6,
bold: 'true'
},
mapfromUrl: {
fontSize: 6,
color: 'blue'
},
contentTextBold: {
fontSize: 9,
bold: true
},
contentTextNormal: {
fontSize: 9
},
footerComment: {
fontSize: 5
}
},
defaultStyle: {
alignment: 'justify'
}
}
pdfMake.createPdf(dd).open();
}