index.vue 1.2 KB

12345678910111213141516171819202122232425262728293031323334353637
  1. <template>
  2. <div class="pdf" :style="{height: height}">
  3. <iframe v-if="pdfUrl" :src="pdfUrl" frameborder="0" style="width: 100%; height: 100%" />
  4. </div>
  5. </template>
  6. <script>
  7. export default {
  8. data () {
  9. return {
  10. pdfUrl: null,
  11. height: '450px',
  12. hasRole: localStorage.getItem('hasHighRole') || 0
  13. }
  14. },
  15. mounted () {
  16. this.height = this.getDialogHeightHeight()
  17. window.addEventListener('resize', this.handleDialogHeightResize)
  18. },
  19. methods: {
  20. load (url) {
  21. this.pdfUrl = null
  22. url = encodeURIComponent(url)
  23. this.pdfUrl = `${this.$baseUrl}lib/pdfjs-dist/web/viewer.html?file=${url}&&hasRole=${this.hasRole}`
  24. },
  25. loadData (data) {
  26. this.pdfUrl = null
  27. this.pdfUrl = `${this.$baseUrl}lib/pdfjs-dist/web/viewer.html?file=${data}&hasRole=${this.hasRole}`
  28. },
  29. handleDialogHeightResize () {
  30. this.height = this.getDialogHeightHeight()
  31. },
  32. getDialogHeightHeight () {
  33. return ((document.documentElement.clientHeight || document.body.clientHeight) - 60) + 'px'
  34. }
  35. }
  36. }
  37. </script>