修改了历史回答导出pdf的bug,让表格数据能完全展示
This commit is contained in:
parent
9fc56b7393
commit
f092d0e77e
|
|
@ -173,28 +173,70 @@
|
||||||
// 保存原始样式
|
// 保存原始样式
|
||||||
const originalMaxHeight = timelineContainer.value.style.maxHeight
|
const originalMaxHeight = timelineContainer.value.style.maxHeight
|
||||||
const originalOverflow = timelineContainer.value.style.overflow
|
const originalOverflow = timelineContainer.value.style.overflow
|
||||||
|
const originalTableStyles: { table: HTMLElement; styles: Record<string, string> }[] = []
|
||||||
|
|
||||||
// 展开所有内容
|
// 展开所有思考内容
|
||||||
|
Object.keys(state.showThinking).forEach(k => (state.showThinking[k] = true))
|
||||||
timelineContainer.value.style.maxHeight = 'none'
|
timelineContainer.value.style.maxHeight = 'none'
|
||||||
timelineContainer.value.style.overflow = 'visible'
|
timelineContainer.value.style.overflow = 'visible'
|
||||||
Object.keys(state.showThinking).forEach(k => state.showThinking[k] = true)
|
|
||||||
|
// ===== ✅ 临时修改表格样式(完全展开宽度、不压缩) =====
|
||||||
|
const tables = timelineContainer.value.querySelectorAll('table')
|
||||||
|
tables.forEach((table: HTMLElement) => {
|
||||||
|
const computed = window.getComputedStyle(table)
|
||||||
|
originalTableStyles.push({
|
||||||
|
table,
|
||||||
|
styles: {
|
||||||
|
maxWidth: table.style.maxWidth,
|
||||||
|
width: table.style.width,
|
||||||
|
display: table.style.display,
|
||||||
|
overflowX: table.style.overflowX,
|
||||||
|
whiteSpace: table.style.whiteSpace,
|
||||||
|
tableLayout: table.style.tableLayout,
|
||||||
|
},
|
||||||
|
})
|
||||||
|
|
||||||
|
// 解除所有限制
|
||||||
|
table.style.maxWidth = 'none'
|
||||||
|
table.style.width = 'auto'
|
||||||
|
table.style.display = 'table'
|
||||||
|
table.style.overflowX = 'visible'
|
||||||
|
table.style.whiteSpace = 'nowrap'
|
||||||
|
table.style.tableLayout = 'auto'
|
||||||
|
|
||||||
|
// 同步列单元格样式
|
||||||
|
const cells = table.querySelectorAll('th, td')
|
||||||
|
cells.forEach((cell: HTMLElement) => {
|
||||||
|
cell.style.whiteSpace = 'nowrap'
|
||||||
|
cell.style.wordBreak = 'keep-all'
|
||||||
|
cell.style.textOverflow = 'clip'
|
||||||
|
})
|
||||||
|
})
|
||||||
|
|
||||||
await nextTick()
|
await nextTick()
|
||||||
await new Promise(resolve => setTimeout(resolve, 50)) // 等待渲染
|
await new Promise(resolve => setTimeout(resolve, 100)) // 等待渲染完成
|
||||||
|
|
||||||
|
// 获取真实尺寸(包含展开的表格)
|
||||||
const elementHeight = timelineContainer.value.scrollHeight
|
const elementHeight = timelineContainer.value.scrollHeight
|
||||||
const elementWidth = timelineContainer.value.scrollWidth
|
const elementWidth = timelineContainer.value.scrollWidth
|
||||||
|
|
||||||
const opt : Html2PdfOptions = {
|
// 如果表格太宽,自动横向导出
|
||||||
|
const orientation = elementWidth > elementHeight ? 'landscape' : 'portrait'
|
||||||
|
|
||||||
|
const opt: Html2PdfOptions = {
|
||||||
margin: 0.3,
|
margin: 0.3,
|
||||||
filename: `${props.conversationName}.pdf`,
|
filename: `${props.conversationName}.pdf`,
|
||||||
image: { type: 'jpeg', quality: 0.98 },
|
image: { type: 'jpeg', quality: 0.98 },
|
||||||
html2canvas: { scale: 2, scrollY: -window.scrollY, windowWidth: elementWidth },
|
html2canvas: {
|
||||||
|
scale: 2,
|
||||||
|
scrollY: -window.scrollY,
|
||||||
|
windowWidth: elementWidth,
|
||||||
|
},
|
||||||
jsPDF: {
|
jsPDF: {
|
||||||
unit: 'in',
|
unit: 'in',
|
||||||
format: [elementWidth / 90, elementHeight / 90] as [number, number],
|
format: [elementWidth / 90, elementHeight / 90] as [number, number],
|
||||||
orientation: 'portrait'
|
orientation,
|
||||||
}
|
},
|
||||||
}
|
}
|
||||||
|
|
||||||
try {
|
try {
|
||||||
|
|
@ -202,15 +244,31 @@
|
||||||
} catch (err) {
|
} catch (err) {
|
||||||
console.error('PDF 导出失败:', err)
|
console.error('PDF 导出失败:', err)
|
||||||
} finally {
|
} finally {
|
||||||
// 恢复原样式
|
// 恢复容器样式
|
||||||
timelineContainer.value.style.maxHeight = originalMaxHeight
|
timelineContainer.value.style.maxHeight = originalMaxHeight
|
||||||
timelineContainer.value.style.overflow = originalOverflow
|
timelineContainer.value.style.overflow = originalOverflow
|
||||||
|
|
||||||
|
// 恢复表格样式
|
||||||
|
originalTableStyles.forEach(({ table, styles }) => {
|
||||||
|
Object.keys(styles).forEach(key => {
|
||||||
|
table.style[key] = styles[key]
|
||||||
|
})
|
||||||
|
// 恢复单元格样式
|
||||||
|
const cells = table.querySelectorAll('th, td')
|
||||||
|
cells.forEach((cell: HTMLElement) => {
|
||||||
|
cell.style.whiteSpace = ''
|
||||||
|
cell.style.wordBreak = ''
|
||||||
|
cell.style.textOverflow = ''
|
||||||
|
})
|
||||||
|
})
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
//导出为markdown格式
|
//导出为markdown格式
|
||||||
const handleExportMarkdown = async () => {
|
const handleExportMarkdown = async () => {
|
||||||
// 原始 markdown 内容
|
// 原始 markdown 内容
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue