|
@@ -1,7 +1,7 @@
|
|
<template>
|
|
<template>
|
|
<div class="pdf-box">
|
|
<div class="pdf-box">
|
|
- <iframe id="pdfIframe" :src="url" frameborder="0" style="width: 100%; height: 100vh; z-index: 0; position: relative;" @contextmenu.prevent />
|
|
|
|
- <!-- <div class="pdf-mark" @contextmenu.prevent /> -->
|
|
|
|
|
|
+ <iframe id="pdfIframe" :src="url" frameborder="0" />
|
|
|
|
+ <!-- <div class="pdf-mark" @contextmenu="markClick" /> -->
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</template>
|
|
|
|
|
|
@@ -17,11 +17,26 @@ export default {
|
|
this.url = `${process.env.VUE_APP_BASE_API}/system/fileStorage/preview?fileId=${fileId}&resource=${resource}#toolbar=0&navpanes=0&scrollbar=0`
|
|
this.url = `${process.env.VUE_APP_BASE_API}/system/fileStorage/preview?fileId=${fileId}&resource=${resource}#toolbar=0&navpanes=0&scrollbar=0`
|
|
},
|
|
},
|
|
mounted() {
|
|
mounted() {
|
|
- console.log(window.frames['pdfIframe'].contentWindow, 8888)
|
|
|
|
- console.log(window.frames['pdfIframe'].contentDocument.getElementById('viewer'), 11111111)
|
|
|
|
- console.log(window.frames['pdfIframe'].document, 2222)
|
|
|
|
- window.frames['pdfIframe'].contentDocument.body.oncontextmenu = function() {
|
|
|
|
- return false
|
|
|
|
|
|
+ setTimeout(() => {
|
|
|
|
+ // const iframe = document.getElementById('pdfIframe')
|
|
|
|
+ // const iframeWin = iframe.contentWindow || iframe.contentDocument.parentWindo
|
|
|
|
+ // console.log(iframeWin.document.getElementById('viewer'))
|
|
|
|
+ // console.log(iframe.height = iframeWin.document.getElementById('viewer').scrollHeight
|
|
|
|
+ // )
|
|
|
|
+ // iframeWin.document.getElementById('viewer').addEventListener('contextmenu', function(event) {
|
|
|
|
+ // event.preventDefault()
|
|
|
|
+ // return false
|
|
|
|
+ // })
|
|
|
|
+ }, 1000)
|
|
|
|
+
|
|
|
|
+ // const mask = document.querySelector('.pdf-mark')
|
|
|
|
+ // mask.addEventListener('scroll', function(params) {
|
|
|
|
+ // iframe.scrollTop = mask.scrollTop
|
|
|
|
+ // })
|
|
|
|
+ },
|
|
|
|
+ methods: {
|
|
|
|
+ markClick() {
|
|
|
|
+ console.log(213123123)
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
@@ -29,9 +44,25 @@ export default {
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
<style lang="scss" scoped>
|
|
.pdf-box {
|
|
.pdf-box {
|
|
- width: 100vw;
|
|
|
|
- height: 100vh;
|
|
|
|
- overflow: hidden;
|
|
|
|
- opacity: 0.99;
|
|
|
|
|
|
+ width: 100%;
|
|
|
|
+ height: 100%;
|
|
|
|
+ overflow: auto;
|
|
|
|
+ position: relative;
|
|
|
|
+ iframe {
|
|
|
|
+ position: absolute;
|
|
|
|
+ width: 100%;
|
|
|
|
+ height: 100%;
|
|
|
|
+ border: none;
|
|
|
|
+ }
|
|
|
|
+ .pdf-mark {
|
|
|
|
+ position: absolute;
|
|
|
|
+ top: 0px;
|
|
|
|
+ left: 0px;
|
|
|
|
+ width: 100%;
|
|
|
|
+ height: 100%;
|
|
|
|
+ background-color: rgba(0, 0, 0, 0.5); /* 半透明遮罩 */
|
|
|
|
+ overflow: auto;
|
|
|
|
+ // pointer-events: none; /* 防止遮罩阻止鼠标事件 */
|
|
|
|
+ }
|
|
}
|
|
}
|
|
</style>
|
|
</style>
|