| | |
| | | window.open(await getResourcePath(this.preViewMd5)); |
| | | }, |
| | | domViewer() { |
| | | let ele = document.getElementById("imageParent"); |
| | | let ele = (this.container ? this.container : document).getElementById( |
| | | "imageParent" |
| | | ); |
| | | this.viewerCon = new Viewer(ele, { |
| | | inline: false, |
| | | container: this.container |
| | |
| | | }); |
| | | }, |
| | | clearDom() { |
| | | let ele = document.getElementById("imageParent"); |
| | | let ele = (this.container ? this.container : document).getElementById("imageParent"); |
| | | ele.innerHtml = ""; |
| | | }, |
| | | createDom(page) { |
| | | var that = this; |
| | | let ele = document.getElementById("imageParent"); |
| | | let ele = (this.container ? this.container : document).getElementById("imageParent"); |
| | | const img = document.createElement("img"); |
| | | img.src = this.getPageImage(page); |
| | | img.alt = ""; |
| | |
| | | }, |
| | | scrollBottom() { |
| | | var that = this; |
| | | var ele = document.getElementById("imageParent"); |
| | | var ele = (this.container ? this.container : document).getElementById("imageParent"); |
| | | ele.addEventListener("scroll", function () { |
| | | // 计算滚动条距离底部的位置 |
| | | const scrollBottom = |
| | |
| | | }; |
| | | </script> |
| | | <style scoped lang="less"> |
| | | .preview { |
| | | width: 100%; |
| | | height: 100%; |
| | | |
| | | .imageBox { |
| | | height: calc(100% - 30px); |
| | | overflow-x: hidden; |
| | | overflow-y: auto; |
| | | background: #ccc; |
| | | box-sizing: border-box; |
| | | } |
| | | |
| | | .imageBox:hover { |
| | | cursor: zoom-in !important; |
| | | } |
| | | |
| | | .bottom_tool { |
| | | height: 30px; |
| | | background-color: rgba(0, 0, 0, 0.8); |
| | | display: flex; |
| | | justify-content: flex-end; |
| | | align-items: center; |
| | | svg { |
| | | margin-right: 15px; |
| | | fill: #d1d1d1; |
| | | } |
| | | svg:hover { |
| | | fill: #fff; |
| | | cursor: pointer; |
| | | } |
| | | } |
| | | } |
| | | </style> |