diff --git a/package.json b/package.json index 53c1c67..0af4440 100644 --- a/package.json +++ b/package.json @@ -23,14 +23,12 @@ "@wangeditor/editor-for-vue": "^5.1.12", "axios": "^0.26.0", "core-js": "^3.6.5", - "draggable-resizable-vue3": "^1.0.94-beta", "echarts": "^5.3.3", "echarts-gl": "^2.0.9", "el-table-infinite-scroll": "^3.0.6", "element-plus": "2.0.2", "file-saver": "^2.0.5", "gifler": "^0.1.0", - "html2pdf.js": "^0.10.1", "image-compressor.js": "^1.1.4", "lodash": "^4.17.21", "lunar-javascript": "^1.7.5", diff --git a/src/utils/export.js b/src/utils/export.js index 673f939..47dc911 100644 --- a/src/utils/export.js +++ b/src/utils/export.js @@ -1,5 +1,5 @@ import { saveAs } from 'file-saver'; -import html2pdf from 'html2pdf.js'; +// import html2pdf from 'html2pdf.js'; const isDOM = (obj) => obj instanceof HTMLElement; @@ -9,64 +9,65 @@ const isDOM = (obj) => obj instanceof HTMLElement; * @param {string} name 文件名 */ export const downloadPDF = async (dom, name = '导出文件') => { - if (!isDOM(dom)) return; + // 先不用这个 + // if (!isDOM(dom)) return; - try { - // 等待一段时间确保所有图表完全渲染 - await new Promise(resolve => setTimeout(resolve, 1500)); + // try { + // // 等待一段时间确保所有图表完全渲染 + // await new Promise(resolve => setTimeout(resolve, 1500)); - // 强制重新渲染所有图表 - const resizeEvent = new Event('resize'); - window.dispatchEvent(resizeEvent); + // // 强制重新渲染所有图表 + // const resizeEvent = new Event('resize'); + // window.dispatchEvent(resizeEvent); - // 再次等待图表重绘完成 - await new Promise(resolve => setTimeout(resolve, 1000)); + // // 再次等待图表重绘完成 + // await new Promise(resolve => setTimeout(resolve, 1000)); - // 获取内容的实际高度 - const contentHeight = dom.scrollHeight; + // // 获取内容的实际高度 + // const contentHeight = dom.scrollHeight; - // 计算需要的页面尺寸（单位：毫米） - // 将像素转换为毫米（1px ≈ 0.264583mm） - const a4HeightMm = 297; // A4纸高度 - const contentHeightMm = contentHeight * 0.264583; + // // 计算需要的页面尺寸（单位：毫米） + // // 将像素转换为毫米（1px ≈ 0.264583mm） + // const a4HeightMm = 297; // A4纸高度 + // const contentHeightMm = contentHeight * 0.264583; - const opt = { - margin: [10, 10, 20, 10], // [top, right, bottom, left] 格式 - filename: name + '.pdf', - image: { - type: 'png', - quality: 1 - }, - html2canvas: { - scale: 1.5, - useCoRs: true, - allowTaint: true, - foreignObjectRendering: false, - logging: false, - width: dom.scrollWidth, - height: dom.scrollHeight + 100, // 增加额外高度，包含底部内容 - scrollX: 0, - scrollY: 0 - }, - jsPDF: { - unit: 'mm', - format: [210, contentHeightMm + 40], // 自定义页面高度，确保所有内容都在一页 - orientation: "portrait" - }, - pagebreak: { - mode: "avoid", // 尽量避免在元素中间分页 - before: '.analysis-report-box h2', // 在h2标题前避免分页 - after: '.analysis-report-box h2', // 在h2标题后避免分页 - avoid: '.analysis-report-box p' // 避免在段落中间分页 - } - }; + // const opt = { + // margin: [10, 10, 20, 10], // [top, right, bottom, left] 格式 + // filename: name + '.pdf', + // image: { + // type: 'png', + // quality: 1 + // }, + // html2canvas: { + // scale: 1.5, + // useCoRs: true, + // allowTaint: true, + // foreignObjectRendering: false, + // logging: false, + // width: dom.scrollWidth, + // height: dom.scrollHeight + 100, // 增加额外高度，包含底部内容 + // scrollX: 0, + // scrollY: 0 + // }, + // jsPDF: { + // unit: 'mm', + // format: [210, contentHeightMm + 40], // 自定义页面高度，确保所有内容都在一页 + // orientation: "portrait" + // }, + // pagebreak: { + // mode: "avoid", // 尽量避免在元素中间分页 + // before: '.analysis-report-box h2', // 在h2标题前避免分页 + // after: '.analysis-report-box h2', // 在h2标题后避免分页 + // avoid: '.analysis-report-box p' // 避免在段落中间分页 + // } + // }; - await html2pdf().set(opt).from(dom).save(); - return true; - } catch (error) { - console.error('PDF导出失败:', error); - return false; - } + // await html2pdf().set(opt).from(dom).save(); + // return true; + // } catch (error) { + // console.error('PDF导出失败:', error); + // return false; + // } } diff --git a/src/views/backOfficeSystem/JudgmentHome/ResearchHome/components/AnalysisReport/index.vue b/src/views/backOfficeSystem/JudgmentHome/ResearchHome/components/AnalysisReport/index.vue index b4b30b9..41172ce 100644 --- a/src/views/backOfficeSystem/JudgmentHome/ResearchHome/components/AnalysisReport/index.vue +++ b/src/views/backOfficeSystem/JudgmentHome/ResearchHome/components/AnalysisReport/index.vue @@ -174,67 +174,67 @@ const tabHeightFn = () => { }; /** 以pdf形式下载 */ const downLoadPdf = async () => { - downLoading.value = true; - ElMessage.info('下载界面会展开，是正常的。'); + // downLoading.value = true; + // ElMessage.info('下载界面会展开，是正常的。'); - try { - // 强制刷新所有图表 - const resizeEvent = new Event('resize'); - window.dispatchEvent(resizeEvent); + // try { + // // 强制刷新所有图表 + // const resizeEvent = new Event('resize'); + // window.dispatchEvent(resizeEvent); - // 等待图表重绘 - await new Promise(resolve => setTimeout(resolve, 1000)); + // // 等待图表重绘 + // await new Promise(resolve => setTimeout(resolve, 1000)); - // 保存原始样式 - const originalOverflow = tableBox.value.style.overflow; - const originalHeight = tableBox.value.style.height; - const originalPaddingBottom = tableBox.value.style.paddingBottom; - const originalMarginBottom = tableBox.value.style.marginBottom; + // // 保存原始样式 + // const originalOverflow = tableBox.value.style.overflow; + // const originalHeight = tableBox.value.style.height; + // const originalPaddingBottom = tableBox.value.style.paddingBottom; + // const originalMarginBottom = tableBox.value.style.marginBottom; - // 确保所有内容都可见，并增加底部间距 - tableBox.value.style.overflow = 'visible'; - tableBox.value.style.height = 'auto'; - tableBox.value.style.paddingBottom = '50px'; // 增加底部内边距 - tableBox.value.style.marginBottom = '30px'; // 增加底部外边距 + // // 确保所有内容都可见，并增加底部间距 + // tableBox.value.style.overflow = 'visible'; + // tableBox.value.style.height = 'auto'; + // tableBox.value.style.paddingBottom = '50px'; // 增加底部内边距 + // tableBox.value.style.marginBottom = '30px'; // 增加底部外边距 - // 为最后的总结分析部分添加特殊样式，避免分页截断 - const summaryElements = tableBox.value.querySelectorAll('h2'); - const lastH2 = summaryElements[summaryElements.length - 1]; - if (lastH2 && lastH2.textContent.includes('总结分析')) { - lastH2.style.pageBreakBefore = 'always'; - lastH2.style.pageBreakInside = 'avoid'; + // // 为最后的总结分析部分添加特殊样式，避免分页截断 + // const summaryElements = tableBox.value.querySelectorAll('h2'); + // const lastH2 = summaryElements[summaryElements.length - 1]; + // if (lastH2 && lastH2.textContent.includes('总结分析')) { + // lastH2.style.pageBreakBefore = 'always'; + // lastH2.style.pageBreakInside = 'avoid'; - // 确保总结分析的段落不被分页截断 - const nextP = lastH2.nextElementSibling; - if (nextP && nextP.tagName === 'P') { - nextP.style.pageBreakInside = 'avoid'; - nextP.style.marginBottom = '30px'; - } - } + // // 确保总结分析的段落不被分页截断 + // const nextP = lastH2.nextElementSibling; + // if (nextP && nextP.tagName === 'P') { + // nextP.style.pageBreakInside = 'avoid'; + // nextP.style.marginBottom = '30px'; + // } + // } - await downloadPDF(tableBox.value, '警情分析报告'); + // await downloadPDF(tableBox.value, '警情分析报告'); - // 恢复原始样式 - tableBox.value.style.overflow = originalOverflow; - tableBox.value.style.height = originalHeight; - tableBox.value.style.paddingBottom = originalPaddingBottom; - tableBox.value.style.marginBottom = originalMarginBottom; + // // 恢复原始样式 + // tableBox.value.style.overflow = originalOverflow; + // tableBox.value.style.height = originalHeight; + // tableBox.value.style.paddingBottom = originalPaddingBottom; + // tableBox.value.style.marginBottom = originalMarginBottom; - // 恢复总结分析部分的样式 - if (lastH2) { - lastH2.style.pageBreakBefore = ''; - lastH2.style.pageBreakInside = ''; - const nextP = lastH2.nextElementSibling; - if (nextP && nextP.tagName === 'P') { - nextP.style.pageBreakInside = ''; - nextP.style.marginBottom = ''; - } - } - } catch (error) { - console.error('下载失败:', error); - } finally { - downLoading.value = false; - } + // // 恢复总结分析部分的样式 + // if (lastH2) { + // lastH2.style.pageBreakBefore = ''; + // lastH2.style.pageBreakInside = ''; + // const nextP = lastH2.nextElementSibling; + // if (nextP && nextP.tagName === 'P') { + // nextP.style.pageBreakInside = ''; + // nextP.style.marginBottom = ''; + // } + // } + // } catch (error) { + // console.error('下载失败:', error); + // } finally { + // downLoading.value = false; + // } } const downloadWithStyles = async () => { if (!tableBox.value?.innerHTML) return;