<template>
|
<div class="notice">
|
<el-dialog
|
v-model="dialogVisible"
|
title="流转记录"
|
width="500px"
|
:before-close="handleClose"
|
:close-on-press-escape="false"
|
:close-on-click-modal="false"
|
>
|
<iframe :src="state.pdfUrl" width="100%" height="600px" sandbox="allow-scripts"></iframe>
|
</el-dialog>
|
</div>
|
</template>
|
<script setup>
|
import {reactive, ref, toRefs} from 'vue'
|
const dialogVisible = ref(false);
|
const title = ref("");
|
|
const emit = defineEmits(["getList"]);
|
|
const state = reactive({
|
pdfUrl: ''
|
})
|
|
|
const openDialog = async (value) => {
|
state.pdfUrl = import.meta.env.VITE_APP_BASE_API +value.itemFile
|
console.log('11',state.pdfUrl)
|
dialogVisible.value = true;
|
}
|
|
const handleClose = () => {
|
reset();
|
dialogVisible.value = false;
|
emit("getList")
|
}
|
const reset = () => {
|
state.pdfUrl = ''
|
}
|
|
defineExpose({
|
openDialog
|
});
|
|
</script>
|
|
<style scoped lang="scss">
|
.notice{
|
/* 针对 iframe 的滚动条 */
|
iframe::-webkit-scrollbar {
|
width: 12px; /* 滚动条宽度 */
|
}
|
iframe::-webkit-scrollbar-track {
|
background: #f1f1f1; /* 滚动条轨道背景 */
|
border-radius: 10px;
|
}
|
iframe::-webkit-scrollbar-thumb {
|
background: #888; /* 滚动条滑块颜色 */
|
border-radius: 10px;
|
}
|
iframe::-webkit-scrollbar-thumb:hover {
|
background: #555; /* 鼠标悬停时滑块颜色 */
|
}
|
}
|
</style>
|
