public/dataease
1
0
Fork 0
mirror of https://github.com/dataease/dataease.git synced 2026-05-19 18:38:16 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(仪表板、数据大屏): 修复调用浏览器打印功能出现部分页码空白问题 (#16546)

Browse Source
This commit is contained in:
王嘉豪
2025-07-22 17:32:55 +08:00
committed by GitHub
parent 6e6e0ddcd3
commit f6526d8d86
3 changed files with 61 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
core/core-frontend/index.html
View File

@@ -1,16 +1,17 @@
<!DOCTYPE html>
<html lang="en" style="overflow-x: hidden">
<html lang="en" style="overflow-x: hidden;height: 100%">
<head>
<meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title></title>
</head>
<body>
<div id="app"></div>
<body style="height:100%">
<div id="app" style="height: 100%;"></div>
<script type="module" src="/src/pages/index/main.ts"></script>
</body>
</html>
</html>

3
core/core-frontend/src/components/data-visualization/canvas/DePreview.vue
View File

@@ -486,7 +486,8 @@ const scrollPreview = () => {
const showUnpublishFlag = computed(() => dvInfo.value?.status === 0 && isMainCanvas(canvasId.value))
defineExpose({
restore
restore,
getDownloadStatusMainHeight
})
</script>

59
core/core-frontend/src/views/data-visualization/PreviewCanvas.vue
View File

@@ -38,7 +38,8 @@ const state = reactive({
showOffset: {
top: 3,
left: 3
}
},
containerMainHeight: '3000px'
})
const props = defineProps({
@@ -216,17 +217,52 @@ onMounted(async () => {
return
}
dvMainStore.setEmbeddedCallBack(callBackFlag || 'no')
window.matchMedia('print').addListener(async mql => {
if (mql.matches) {
await prepareForPrint()
}
})
})
const dataVKeepSize = computed(() => {
return state.canvasStylePreview?.screenAdaptor === 'keep'
})
const freezeStyle = computed(() => [
{ '--top-show-offset': state.showOffset.top },
{ '--left-show-offset': state.showOffset.left }
])
watch(
() => state.containerMainHeight,
newVal => {
if (previewCanvasContainer.value) {
previewCanvasContainer.value.style.setProperty('--print-height', newVal)
}
}
)
const freezeStyle = computed(() => {
return [
{ '--top-show-offset': state.showOffset.top },
{ '--left-show-offset': state.showOffset.left },
{ '--print-height': state.containerMainHeight }
]
})
const dvPreview = ref(null)
const getPrintHeight = async () => {
if (dvPreview.value && dvPreview.value.getDownloadStatusMainHeight) {
state.containerMainHeight = await dvPreview.value.getDownloadStatusMainHeight()
}
}
// 打印前准备
const prepareForPrint = async () => {
await getPrintHeight()
}
// 暴露方法给外部调用打印
const handlePrint = async () => {
await prepareForPrint()
window.print()
}
defineExpose({
loadCanvasDataAsync
})
@@ -279,6 +315,19 @@ defineExpose({
/>
</template>
<style lang="less">
@media print {
html,
body {
height: auto !important;
}
.content {
height: var(--print-height, auto) !important;
min-height: 0 !important;
}
}
</style>
<style lang="less" scoped>
::-webkit-scrollbar {
display: none;