|
@@ -7,6 +7,11 @@ interface AResultProps {
|
|
|
data: AResultRecord
|
|
|
}
|
|
|
|
|
|
+const layoutRightRef = inject('layoutRightRef')
|
|
|
+
|
|
|
+onMounted(() => {
|
|
|
+ console.log('onMounted: ', layoutRightRef.value)
|
|
|
+})
|
|
|
const props = defineProps<AResultProps>()
|
|
|
const { data } = toRefs(props)
|
|
|
// 格式化处理pdf文件
|
|
@@ -68,14 +73,28 @@ const handleClose = (): void => {
|
|
|
</div>
|
|
|
</div>
|
|
|
<!-- PDF预览弹窗 -->
|
|
|
+ <!-- :append-to="layoutRightRef" 该属性2.4.3开始支持 -->
|
|
|
<el-dialog
|
|
|
- :title="targetViewPdf?.name ?? ''"
|
|
|
+ class="pdf-view-dialog"
|
|
|
v-model="dialogVisible"
|
|
|
width="80%"
|
|
|
@close="handleClose"
|
|
|
append-to-body
|
|
|
destroy-on-close
|
|
|
>
|
|
|
+ <template #header>
|
|
|
+ <div class="pdf-view-header">
|
|
|
+ <h4 class="title">{{ targetViewPdf?.name ?? '' }}</h4>
|
|
|
+ <a class="pdf-link" :href="targetViewPdf?.link">
|
|
|
+ <el-button class="down-load-btn">
|
|
|
+ <el-icon class="el-icon--left">
|
|
|
+ <Download />
|
|
|
+ </el-icon>
|
|
|
+ 下载
|
|
|
+ </el-button>
|
|
|
+ </a>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
<div class="pdf-view-body">
|
|
|
<PDFView
|
|
|
v-if="targetViewPdf?.link"
|
|
@@ -123,4 +142,18 @@ const handleClose = (): void => {
|
|
|
height: 70vh;
|
|
|
overflow-y: auto;
|
|
|
}
|
|
|
+
|
|
|
+.pdf-view-header {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+
|
|
|
+ .down-load-btn {
|
|
|
+ margin-left: 10px;
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|
|
|
+<style>
|
|
|
+.pdf-view-dialog{
|
|
|
+ margin: calc(50vh - 375px) calc(10% - 92px) calc(50vh - 375px) calc(10% + 92px);
|
|
|
+}
|
|
|
</style>
|