function getUrlParam(key) { var href = window.location.href; var url = href.split("?"); if (url.length <= 1) { return ""; } var params = url[1].split("&"); for (var i = 0; i < params.length; i++) { var param = params[i].split("="); if (key == param[0]) { return param[1]; } } } let objData = null; let ticketId = getUrlParam('ticketId'); if (ticketId) { setParams(ticketId); } function setParams(params) { let ticketId = params; layui.use(['form', 'layer'], function () { form = layui.form; layer = layui.layer; getTicketInfo(ticketId); }) } function getTicketInfo(ticketId) { let param = { ticketId: ticketId, }; $.ajax({ headers: { "encrypt": sm3(JSON.stringify(param)) }, url: dataUrl + 'proteam/pot/ticket/getTicketInfo?token=' + token, data: param, type: 'POST', async: true, success: function (result) { console.log(result); if (result.code === 200) { setTicketInfo(result.data); } else if (result.code === 500) { } else if (result.code === 401) { logout(1) } }, error: function () { } }); } // 赋值作业票信息 function setTicketInfo(obj) { objData = obj; $('#titleValue').html(obj.ticketName); $('#proName').html(obj.proName); $('#ticketNo').html(obj.ticketNo); $('#orgName').html(obj.orgName); $('#jlUnit').html(obj.jlUnit); $('#sgUnit').html(obj.sgUnit); $('#teamName').html(obj.teamName); $('#assessmentRiskLevel').html(setRiskLevel(obj.assessmentRiskLevel)); $('#reAssessmentRiskLevel').html(setRiskLevel(obj.reAssessmentRiskLevel)); $('#content').html(obj.content); $('#workPosition').html(obj.workPosition); $('#mainRisk').html(obj.mainRisk); $('#change').html(obj.change); $('#control').html(obj.control); $('#startTime').html(obj.startTime); $('#endTime').html(obj.endTime); $('#workNum').html(obj.workNum); $('#workManager').html(obj.workManager); $('#safetyManager').html(obj.safetyManager); $('#technologyManager').html(obj.technologyManager); $('#issueDate').html(obj.issueDate); $('#workManager2').html(obj.workManager); $('#checkUser').html(obj.checkUser); $('#safetyManager2').html(obj.safetyManager2); $('#jlUser').html(obj.jlUser); $('#yzManager').html(obj.yzManager); $('#remark').html(obj.remark); // 作业过程风险控制措施 let controlList = obj.controlList; if (controlList && controlList.length > 0) { let html = ''; $.each(controlList, function (index, item) { html += '

' + item + '

' }) $('#controlList').html(html); } // 施工人员赋值 let workList = obj.workList; if (workList && workList.length > 0) { let html = ''; $.each(workList, function (index, item) { html += '' + item + '' }) $('#workList').html(html); } // 全员签名 let workList2 = obj.workList2; if (workList2 && workList2.length > 0) { let html = setWordUserHtml(workList2); $('#workList2').after(html); } else { $('#workList2').after(''); } // 临时人员 let lsWorkList = obj.lsWorkList; if (lsWorkList && lsWorkList.length > 0) { let html = setWordUserHtml(lsWorkList); $('#lsWorkList').after(html); } else { $('#lsWorkList').after(''); } } // 设置风险等级颜色 function setRiskLevel(value) { if (value === '2' || value === '2级' || value === '二级') { return '二级'; } else if (value === '3' || value === '3级' || value === '三级') { return '三级'; } else if (value === '4' || value === '4级' || value === '四级') { return '四级'; } else if (value === '5' || value === '5级' || value === '五级') { return '五级'; } else { return ''; } } // 全员签名、临时人员 function setWordUserHtml(list) { let length = list.length; let zs = Math.floor(length / 6); let xs = length - (zs * 6); let html = ''; for (let i = 1; i <= zs; i++) { html += '' + '' + list[((i * 6) - 6)] + '' + '' + list[((i * 6) - 5)] + '' + '' + list[((i * 6)) - 4] + '' + '' + list[((i * 6)) - 3] + '' + '' + list[((i * 6)) - 2] + '' + '' + list[((i * 6)) - 1] + '' + '' } if (xs === 1) { html += '' + list[(zs * 6)] + '' } else if (xs === 2) { html += '' + list[(zs * 6)] + '' + list[(zs * 6) + 1] + '' } else if (xs === 3) { html += '' + list[(zs * 6)] + '' + list[(zs * 6) + 1] + '' + list[(zs * 6) + 2] + '' } else if (xs === 4) { html += '' + list[(zs * 6)] + '' + list[(zs * 6) + 1] + '' + list[(zs * 6) + 2] + '' + list[(zs * 6) + 3] + '' } else if (xs === 5) { html += '' + list[(zs * 6)] + '' + list[(zs * 6) + 1] + '' + list[(zs * 6) + 2] + '' + list[(zs * 6) + 3] + '' + list[(zs * 6) + 4] + '' } return html; } // 下载作业票文件 function downLoadTicket() { // exportPDF('mainBox', '文件标题') exportPDF('mainBox', objData.ticketNo); } //避免分页被截断 const exportPDF = (pdfDom, title) => { const A4_WIDTH = 592.28; const A4_HEIGHT = 841.89; // $myLoading 自定义等待动画组件,实现导出事件的异步等待交互 // dom的id。 let target = document.getElementById(pdfDom); let pageHeight = target.scrollWidth / A4_WIDTH * A4_HEIGHT; // 获取分割dom,此处为class类名为item的dom let lableListID = target.getElementsByClassName('item'); // let lableListID = document.getElementsByClassName('item'); // 进行分割操作,当dom内容已超出a4的高度,则将该dom前插入一个空dom,把他挤下去,分割 for (let i = 0; i < lableListID.length; i++) { let multiple = Math.ceil((lableListID[i].offsetTop + lableListID[i].offsetHeight) / pageHeight); if (isSplit(lableListID, i, multiple * pageHeight)) { let divParent = lableListID[i].parentNode; // 获取该div的父节点 let newNode = document.createElement('div'); newNode.className = 'emptyDiv'; newNode.style.background = '#01195e'; let _H = multiple * pageHeight - (lableListID[i].offsetTop + lableListID[i].offsetHeight); newNode.style.height = _H + 30 + 'px'; newNode.style.width = '100%'; let next = lableListID[i].nextSibling; // 获取div的下一个兄弟节点 // 判断兄弟节点是否存在 // console.log(next); if (next) { // 存在则将新节点插入到div的下一个兄弟节点之前,即div之后 divParent.insertBefore(newNode, next); } else { // 不存在则直接添加到最后,appendChild默认添加到divParent的最后 divParent.appendChild(newNode); } } } pdf(pdfDom, title); } // 判断是否需要添加空白div const isSplit = (nodes, index, pageHeight) => { // 计算当前这块dom是否跨越了a4大小,以此分割 if (nodes[index].offsetTop + nodes[index].offsetHeight < pageHeight && nodes[index + 1] && nodes[index + 1].offsetTop + nodes[index + 1].offsetHeight > pageHeight) { return true; } return false; } const pdf = (pdfDom, title) => { // 避免出现浏览器滚动条导致的内容不全处理 document.body.scrollTop = document.documentElement.scrollTop = 0 //div内部滚动导致内容不全处理 // document.getElementById('app').style.height = 'auto'; setTimeout(() => { html2canvas(document.getElementById(pdfDom), { allowTaint: true, scale: 3, dpi: 300, // height: document.getElementById('upload').scrollHeight, // windowHeight: document.getElementById('upload').scrollHeight }).then(canvas => { var contentWidth = canvas.width; var contentHeight = canvas.height; //一页pdf显示html页面生成的canvas高度; var pageHeight = contentWidth / 592.28 * 841.89; //未生成pdf的html页面高度 var leftHeight = contentHeight; //页面偏移 var position = 0; //a4纸的尺寸[595.28,841.89],html页面生成的canvas在pdf中图片的宽高 var imgWidth = 595.28; var imgHeight = 592.28 / contentWidth * contentHeight; var pageData = canvas.toDataURL('image/jpeg', 1.0); var pdf = new jsPDF('', 'pt', 'a4'); //有两个高度需要区分,一个是html页面的实际高度,和生成pdf的页面高度(841.89) //当内容未超过pdf一页显示的范围,无需分页 if (leftHeight < pageHeight) { pdf.addImage(pageData, 'JPEG', 0, 0, imgWidth, imgHeight); } else { while (leftHeight > 0) { pdf.addImage(pageData, 'JPEG', 0, position, imgWidth, imgHeight) leftHeight -= pageHeight; position -= 841.89; //避免添加空白页 if (leftHeight > 0) { pdf.addPage(); } } } pdf.save(`${title}.pdf`); }) }, 300) }