web/apps/mobile/src/views/common/pdfViewExample.vue

<template>
  <div class="pdf-view-example j-contanter">
    <div class="pdf-container j-main">
      <iframe v-if="pdfUrl" sandbox="allow-same-origin allow-scripts" allow="pdf" :src="pdfUrl" />
    </div>
    <div v-if="!getUserId" class="j-footer">
      <a href="/jyapp/free/login?back=index&to=back&activity=bidCreditReportPreview" class="adsense-container">
        <AdSingle
          ad="app-credit-report-sample"
          :show-tag="false"
          :show-close-icon="false"
          class="adsense-container"
        />
      </a>
    </div>
  </div>
</template>

<script>
import { mapGetters } from 'vuex'
import AdSingle from '@/components/ad/Ad'

export default {
  name: 'PdfViewExample',
  components: {
    AdSingle
  },
  data() {
    return {
      pdfUrl: `${location.origin}/shareFile/bidCreditReportFile/1e452a27575834907747949258e09893/%E4%B8%87%E8%BE%BE%E4%BF%A1%E6%81%AF%E8%82%A1%E4%BB%BD%E6%9C%89%E9%99%90%E5%85%AC%E5%8F%B8.pdf`
    }
  },
  computed: {
    ...mapGetters('user', ['getUserId'])
  },
  created() {
    const { pdfUrl } = this.$route.query
    if (pdfUrl) {
      this.pdfUrl = pdfUrl
    }
  }
}
</script>

<style lang="scss" scoped>
.pdf-container {
  width: 100%;
  height: 100%;
  iframe {
    width: 100%;
    height: 100%;
  }
}
</style>