javascript - 使用 jsZIP 下载多个 pdfmake 文件
问题描述
我在我的 django 项目中使用 PDFmake 来生成 pdf 文件。我想使用单击一个按钮下载多个文件。这就是为什么我计划使用 jsZIP 以 zip 格式下载所有文件的原因。
function downloadAllPayslip(){
var employeeIdLst = getSelectedPayslipEmployeeIds();
$.ajax({
type: 'GET',
url: '{% url "salary:ajax-download-all-payslip" %}',
data: {
'month': dateVar.getMonth()+1, // number
'year': dateVar.getFullYear(),
'employee_id_lst': JSON.stringify(employeeIdLst),
},
dataType: 'json',
success: function (data) {
var lastDay = new Date(dateVar.getFullYear(), dateVar.getMonth() + 1, 0);
var lastDayStr = lastDay.toString("MM/dd/yyyy");
var lastDayStrSplit = lastDayStr.split("/");
var monthName = months[parseInt(lastDayStrSplit[0]) - 1];
var monthNameS = monthName.slice(0, 3);
var year = lastDayStrSplit[2];
var day = lastDayStrSplit[1];
var zip = new JSZip();
var bufferPDFList = [];
var docDefinitionArr = [];
var docDefinitionBufferArr = [];
var content;
var dataPDF;
var nameArr = [];
for (var i = 0; i < data.length; i++) {
// Employee info
var dailyStartTime = moment(data[i].daily_start_time, 'HH:mm:ss').format('h:mm A');
var dailyExitTime = moment(data[i].daily_exit_time, 'HH:mm:ss').format('h:mm A');
var employeeId = data[i].e_id;
var employeeName = data[i].name;
nameArr.push(employeeName);
var employeeType = data[i].type;
var employeeDesignation = data[i].designation;
var employeeDepartment = data[i].department;
var employeeJoinDate = data[i].join_date;
var weekends = data[i].weekends;
var shift = dailyStartTime + ' - ' + dailyExitTime;
var breakDuration = data[i].break_duration;
var leaveBalanceDict = data[i].leave_balance_dict;
var leaveDataDict = []
for (var leaveType in leaveBalanceDict) {
var leaveDict = leaveBalanceDict[leaveType];
var total = leaveDict.total;
var taken = leaveDict.taken;
var accrued = leaveDict.accrued;
var remained = accrued - taken;
leaveDataDict.push({
'Leave Types': leaveType,
'Leave Entitled(days)': total,
'Leave Taken(days)': taken,
'Leave Accrued(days)': accrued,
'Leave Remained(days)': remained
})
}
// Salary details
if (data[i].is_overtime) {
var overtimeAddition = data[i].overtime_addition + ' (+' + formatHHMM(data[i].overtime_hour) + ')';
}
else {
var overtimeAddition = 'N/A';
}
var basicPay = data[i].basic_salary;
var overtimePay = overtimeAddition;
var lessWorkDeduction = data[i].less_work_deduction + "(" + formatHHMM(data[i].work_hour_deficit) + ")"
var unpaidLeaveDeduction = data[i].unpaid_leave_deduction + "(" + data[i].unpaid_leave_count + "days)"
var additionalPay = data[i].salary_addition;
var totalPay = data[i].total_salary;
var taxDeduction = data[i].tax_deduction+ "(" + data[i].percent_tax + "%)";
var netSalary = data[i].net_salary;
var comment = data[i].comment;
var companyName = '{{ company_name }}'
// Generate pdf
var docDefinition = {
footer: function(currentPage, pageCount) {
return {
columns: [
{
text: currentPage.toString() + ' of ' + pageCount, alignment: 'center'
}
]
};
},
pageSize: 'A4',
pageMargins: [40, 80, 40, 60],
content: [
{ text: companyName, style: 'header', alignment: 'center' },
{ lineHeight: 2, text: 'Pay Slip', fontSize: 15, alignment: 'center' },
{ lineHeight: 2, text: 'Pay Period: 01 ' + monthNameS + ' ' + year + ' - ' + day + ' ' + monthNameS + ' ' + year , fontSize: 12, alignment: 'center', bold: true },
{ text: 'Employee Information', style: 'subheader'},
{
columns: [
{
width: 120,
fontSize: 10,
text: 'Employee Name\n' +
'Employee ID\n' +
'Employee Type\n'+
'Designation'
},
{
width: 155,
fontSize: 10,
text: ': ' + employeeName + '\n' +
': ' + employeeId + '\n' +
': ' + employeeType + '\n' +
': ' + employeeDesignation + '\n'
},
{
width: 120,
fontSize: 10,
text: 'Department\n' +
'Join Date\n' +
'Weekends\n' +
'Shift'
},
{
width: 155,
fontSize: 10,
text: ': ' + employeeDepartment + '\n' +
': ' + employeeJoinDate + '\n' +
': ' + weekends + '\n' +
': ' + shift + '\n' +
' (Break: ' + breakDuration + 'min)'
}
]
},
{ text: 'Leave Information', style: 'subheader'},
{
columns: [
{ width: 20, text: '' },
table(leaveDataDict, ['Leave Types', 'Leave Entitled(days)', 'Leave Taken(days)', 'Leave Accrued(days)', 'Leave Remained(days)']),
]
},
{ text: 'Salary Information', style: 'subheader'},
{
style: 'table',
table: {
body: [
['Basic', 'Overtime', 'Additional', 'Unpaid Leave Deduction', 'Less Work Deduction', 'Total Pay', 'Tax Deduction', 'Net pay'],
[basicPay, overtimePay, additionalPay, unpaidLeaveDeduction, lessWorkDeduction, totalPay, taxDeduction, netSalary]
]
}
},
],
styles: {
header: {
fontSize: 18,
bold: true,
margin: [0, 0, 0, 10]
},
subheader: {
fontSize: 15,
bold: true,
margin: [0, 10, 0, 5]
},
tableHeader: {
bold: true,
fontSize: 13,
color: 'black'
},
table: {
fontSize: 9,
margin: [0, 5, 0, 15]
},
},
}
pdfFilename = 'Payslip-' + employeeName + '-' + monthNameS + year + '.pdf'
// pdfMake.createPdf(docDefinition).download('Payslip-' + employeeName + '-' + monthNameS + year, window);
pdfMake.createPdf(docDefinition).getBase64(function(data) {
zip.file(pdfFilename, data);
// var content = zip.generate();
// location.href="data:application/zip;base64,"+content;
});
}
console.log(zip);
var content = zip.generate();
location.href="data:application/zip;base64,"+content;
}
});
}
这是我的代码。我正在遍历所有数据以生成多个 pdf。然后将 pdf 传递给 jsZIP。但一直 zip 文件返回为空。
这是在 jsZIP 中下载多个 pdf 的正确方法吗?
解决方案
推荐阅读
- python - 当第一个号码没有使用 AWS connect start_outbound_voice_contact API 响应时,如何拨打另一个号码?
- php - 尝试将视频及其详细信息插入 php 中的 mysql 数据库时出现错误代码 1
- facebook - Facebook 分享按钮 WCAG 问题
- c# - 如何在.net核心中集成paypal api
- android - 如何显示我的 android 选项?
- python - “为什么 input() 将定义的变量从整数更改为字符串类型?”
- java - 如何创建只能应用于测试方法而不是整个测试类的 JUnit5 自定义扩展
- rust - 如何在 Rust 的特定内存区域中声明静态变量?
- python - Python如何将assert与进行修改的函数一起使用?
- scope - 我们的变量是动态的吗?