zy_oyj/sgxt_web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 移除pdf下载功能

Browse Source
This commit is contained in:
huangchengfa
2025-12-12 09:47:20 +08:00
parent 7062604ba3
commit 6c08a68d4c
3 changed files with 105 additions and 106 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
package.json
View File

@ -23,14 +23,12 @@
"@wangeditor/editor-for-vue": "^5.1.12", "@wangeditor/editor-for-vue": "^5.1.12",
"axios": "^0.26.0", "axios": "^0.26.0",
"core-js": "^3.6.5", "core-js": "^3.6.5",
"draggable-resizable-vue3": "^1.0.94-beta",
"echarts": "^5.3.3", "echarts": "^5.3.3",
"echarts-gl": "^2.0.9", "echarts-gl": "^2.0.9",
"el-table-infinite-scroll": "^3.0.6", "el-table-infinite-scroll": "^3.0.6",
"element-plus": "2.0.2", "element-plus": "2.0.2",
"file-saver": "^2.0.5", "file-saver": "^2.0.5",
"gifler": "^0.1.0", "gifler": "^0.1.0",
"html2pdf.js": "^0.10.1",
"image-compressor.js": "^1.1.4", "image-compressor.js": "^1.1.4",
"lodash": "^4.17.21", "lodash": "^4.17.21",
"lunar-javascript": "^1.7.5", "lunar-javascript": "^1.7.5",

105
src/utils/export.js
View File

@ -1,5 +1,5 @@
import { saveAs } from 'file-saver'; import { saveAs } from 'file-saver';
import html2pdf from 'html2pdf.js'; // import html2pdf from 'html2pdf.js';
const isDOM = (obj) => obj instanceof HTMLElement; const isDOM = (obj) => obj instanceof HTMLElement;
@ -9,64 +9,65 @@ const isDOM = (obj) => obj instanceof HTMLElement;
* @param {string} name 文件名 * @param {string} name 文件名
*/ */
export const downloadPDF = async (dom, name = '导出文件') => { export const downloadPDF = async (dom, name = '导出文件') => {
if (!isDOM(dom)) return; // 先不用这个
// if (!isDOM(dom)) return;
try { // try {
// 等待一段时间确保所有图表完全渲染 // // 等待一段时间确保所有图表完全渲染
await new Promise(resolve => setTimeout(resolve, 1500)); // await new Promise(resolve => setTimeout(resolve, 1500));
// 强制重新渲染所有图表 // // 强制重新渲染所有图表
const resizeEvent = new Event('resize'); // const resizeEvent = new Event('resize');
window.dispatchEvent(resizeEvent); // 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） // // 将像素转换为毫米（1px ≈ 0.264583mm）
const a4HeightMm = 297; // A4纸高度 // const a4HeightMm = 297; // A4纸高度
const contentHeightMm = contentHeight * 0.264583; // const contentHeightMm = contentHeight * 0.264583;
const opt = { // const opt = {
margin: [10, 10, 20, 10], // [top, right, bottom, left] 格式 // margin: [10, 10, 20, 10], // [top, right, bottom, left] 格式
filename: name + '.pdf', // filename: name + '.pdf',
image: { // image: {
type: 'png', // type: 'png',
quality: 1 // quality: 1
}, // },
html2canvas: { // html2canvas: {
scale: 1.5, // scale: 1.5,
useCoRs: true, // useCoRs: true,
allowTaint: true, // allowTaint: true,
foreignObjectRendering: false, // foreignObjectRendering: false,
logging: false, // logging: false,
width: dom.scrollWidth, // width: dom.scrollWidth,
height: dom.scrollHeight + 100, // 增加额外高度，包含底部内容 // height: dom.scrollHeight + 100, // 增加额外高度，包含底部内容
scrollX: 0, // scrollX: 0,
scrollY: 0 // scrollY: 0
}, // },
jsPDF: { // jsPDF: {
unit: 'mm', // unit: 'mm',
format: [210, contentHeightMm + 40], // 自定义页面高度，确保所有内容都在一页 // format: [210, contentHeightMm + 40], // 自定义页面高度，确保所有内容都在一页
orientation: "portrait" // orientation: "portrait"
}, // },
pagebreak: { // pagebreak: {
mode: "avoid", // 尽量避免在元素中间分页 // mode: "avoid", // 尽量避免在元素中间分页
before: '.analysis-report-box h2', // 在h2标题前避免分页 // before: '.analysis-report-box h2', // 在h2标题前避免分页
after: '.analysis-report-box h2', // 在h2标题后避免分页 // after: '.analysis-report-box h2', // 在h2标题后避免分页
avoid: '.analysis-report-box p' // 避免在段落中间分页 // avoid: '.analysis-report-box p' // 避免在段落中间分页
} // }
}; // };
await html2pdf().set(opt).from(dom).save(); // await html2pdf().set(opt).from(dom).save();
return true; // return true;
} catch (error) { // } catch (error) {
console.error('PDF导出失败:', error); // console.error('PDF导出失败:', error);
return false; // return false;
} // }
} }

104
src/views/backOfficeSystem/JudgmentHome/ResearchHome/components/AnalysisReport/index.vue
View File

@ -174,67 +174,67 @@ const tabHeightFn = () => {
}; };
/** 以pdf形式下载 */ /** 以pdf形式下载 */
const downLoadPdf = async () => { const downLoadPdf = async () => {
downLoading.value = true; // downLoading.value = true;
ElMessage.info('下载界面会展开，是正常的。'); // ElMessage.info('下载界面会展开，是正常的。');
try { // try {
// 强制刷新所有图表 // // 强制刷新所有图表
const resizeEvent = new Event('resize'); // const resizeEvent = new Event('resize');
window.dispatchEvent(resizeEvent); // window.dispatchEvent(resizeEvent);
// 等待图表重绘 // // 等待图表重绘
await new Promise(resolve => setTimeout(resolve, 1000)); // await new Promise(resolve => setTimeout(resolve, 1000));
// 保存原始样式 // // 保存原始样式
const originalOverflow = tableBox.value.style.overflow; // const originalOverflow = tableBox.value.style.overflow;
const originalHeight = tableBox.value.style.height; // const originalHeight = tableBox.value.style.height;
const originalPaddingBottom = tableBox.value.style.paddingBottom; // const originalPaddingBottom = tableBox.value.style.paddingBottom;
const originalMarginBottom = tableBox.value.style.marginBottom; // const originalMarginBottom = tableBox.value.style.marginBottom;
// 确保所有内容都可见，并增加底部间距 // // 确保所有内容都可见，并增加底部间距
tableBox.value.style.overflow = 'visible'; // tableBox.value.style.overflow = 'visible';
tableBox.value.style.height = 'auto'; // tableBox.value.style.height = 'auto';
tableBox.value.style.paddingBottom = '50px'; // 增加底部内边距 // tableBox.value.style.paddingBottom = '50px'; // 增加底部内边距
tableBox.value.style.marginBottom = '30px'; // 增加底部外边距 // tableBox.value.style.marginBottom = '30px'; // 增加底部外边距
// 为最后的总结分析部分添加特殊样式，避免分页截断 // // 为最后的总结分析部分添加特殊样式，避免分页截断
const summaryElements = tableBox.value.querySelectorAll('h2'); // const summaryElements = tableBox.value.querySelectorAll('h2');
const lastH2 = summaryElements[summaryElements.length - 1]; // const lastH2 = summaryElements[summaryElements.length - 1];
if (lastH2 && lastH2.textContent.includes('总结分析')) { // if (lastH2 && lastH2.textContent.includes('总结分析')) {
lastH2.style.pageBreakBefore = 'always'; // lastH2.style.pageBreakBefore = 'always';
lastH2.style.pageBreakInside = 'avoid'; // lastH2.style.pageBreakInside = 'avoid';
// 确保总结分析的段落不被分页截断 // // 确保总结分析的段落不被分页截断
const nextP = lastH2.nextElementSibling; // const nextP = lastH2.nextElementSibling;
if (nextP && nextP.tagName === 'P') { // if (nextP && nextP.tagName === 'P') {
nextP.style.pageBreakInside = 'avoid'; // nextP.style.pageBreakInside = 'avoid';
nextP.style.marginBottom = '30px'; // nextP.style.marginBottom = '30px';
} // }
} // }
await downloadPDF(tableBox.value, '警情分析报告'); // await downloadPDF(tableBox.value, '警情分析报告');
// 恢复原始样式 // // 恢复原始样式
tableBox.value.style.overflow = originalOverflow; // tableBox.value.style.overflow = originalOverflow;
tableBox.value.style.height = originalHeight; // tableBox.value.style.height = originalHeight;
tableBox.value.style.paddingBottom = originalPaddingBottom; // tableBox.value.style.paddingBottom = originalPaddingBottom;
tableBox.value.style.marginBottom = originalMarginBottom; // tableBox.value.style.marginBottom = originalMarginBottom;
// 恢复总结分析部分的样式 // // 恢复总结分析部分的样式
if (lastH2) { // if (lastH2) {
lastH2.style.pageBreakBefore = ''; // lastH2.style.pageBreakBefore = '';
lastH2.style.pageBreakInside = ''; // lastH2.style.pageBreakInside = '';
const nextP = lastH2.nextElementSibling; // const nextP = lastH2.nextElementSibling;
if (nextP && nextP.tagName === 'P') { // if (nextP && nextP.tagName === 'P') {
nextP.style.pageBreakInside = ''; // nextP.style.pageBreakInside = '';
nextP.style.marginBottom = ''; // nextP.style.marginBottom = '';
} // }
} // }
} catch (error) { // } catch (error) {
console.error('下载失败:', error); // console.error('下载失败:', error);
} finally { // } finally {
downLoading.value = false; // downLoading.value = false;
} // }
} }
const downloadWithStyles = async () => { const downloadWithStyles = async () => {
if (!tableBox.value?.innerHTML) return; if (!tableBox.value?.innerHTML) return;