瀏覽代碼

fix: 预览pdf页面优化

Signed-off-by: tangshizhe <48740614+tangshizhe@users.noreply.github.com>
tangshizhe 3 月之前
父節點
當前提交
65c49fe4a0

+ 11 - 3
apps/mobile/src/views/article/components/ContentHeader.vue

@@ -167,9 +167,6 @@ export default {
       return this.otherModel.collectionTags
     }
   },
-  mounted() {
-    console.log(this.summary, 'summary')
-  },
   methods: {
     async onCollectionTagClick(tag) {
       if (this.beforeLeavePage) {
@@ -198,6 +195,17 @@ export default {
     },
     creditReport() {
       const buyer = this.summary?.buyers[0]?.name
+      const typeName = this.content?._ob?.topType || this.content?._ob?.subType
+      const breaker_name = `投标企业信用报告_${typeName}`
+      // 区分标讯类型埋点
+      try {
+        window.__EasyJTrack.addTrack(breaker_name, {
+          breaker_name
+        })
+      }
+      catch (e) {
+        console.log(e)
+      }
       this.$router.push({
         path: '/order/create/creditreport',
         query: buyer ? { buyer } : {}

+ 0 - 1
apps/mobile/src/views/article/content.vue

@@ -458,7 +458,6 @@ export default {
   mounted() {
     this.getStickyOffset()
     this.restoreScrollTop()
-    console.log(this.summary, 'summary')
   },
   methods: {
     ...mapMutations('article', [

+ 39 - 31
apps/mobile/src/views/common/pdfViewExample.vue

@@ -1,8 +1,6 @@
 <template>
   <div class="pdf-view-example j-contanter">
-    <div class="pdf-view-container j-main">
-      <div id="pdf-container" />
-    </div>
+    <div id="pdf-view-container" class="j-main" />
     <div v-if="!getUserId" class="j-footer">
       <a href="/jyapp/free/login?url=/jy_mobile/order/create/creditreport&activity=bidCreditReportPreview" class="adsense-container">
         <AdSingle
@@ -32,7 +30,9 @@ export default {
     return {
       pdfUrl: '',
       pdf: null,
-      totalPages: 0
+      totalPages: 0,
+      currentPage: 1, // 新增
+      batchSize: 5 // 新增
     }
   },
   computed: {
@@ -49,7 +49,7 @@ export default {
     }
   },
   mounted() {
-    const container = document.getElementById('pdf-container')
+    const container = document.getElementById('pdf-view-container')
 
     this.loadPdf(this.pdfUrl, container)
     // 监听窗口的 resize 事件,实现自适应效果
@@ -67,43 +67,51 @@ export default {
         })
         this.pdf = await loadingTask.promise
         this.totalPages = this.pdf.numPages
+        this.currentPage = 1
+        this.batchSize = 5 // 新增
 
-        for (let pageNum = 1; pageNum <= this.totalPages; pageNum++) {
-          const page = await this.pdf.getPage(pageNum)
-          const viewport = page.getViewport({ scale: this.calculateScale(page) })
-          const canvas = document.createElement('canvas')
-          const ctx = canvas.getContext('2d')
-          canvas.height = viewport.height
-          canvas.width = viewport.width
-          container.appendChild(canvas)
-
-          await page.render({
-            canvasContext: ctx,
-            viewport,
-          }).promise
-        }
+        await this.loadBatchPages(container) // 新增
+        // 监听滚动事件
+        container.addEventListener('scroll', () => this.handleScroll(container))
       }
       catch (error) {
         console.error('Error loading PDF:', error)
       }
     },
+    async loadBatchPages(container) {
+      // 加载当前页码开始的连续多页,这里以5页为例
+      // 分批加载,从当前页码开始,最多加载5页
+      const endPage = Math.min(this.currentPage + this.batchSize - 1, this.totalPages)
+      for (let pageNum = this.currentPage; pageNum <= endPage; pageNum++) {
+        const page = await this.pdf.getPage(pageNum)
+        const viewport = page.getViewport({ scale: this.calculateScale(page) })
+        const canvas = document.createElement('canvas')
+        const ctx = canvas.getContext('2d')
+        canvas.height = viewport.height
+        canvas.width = viewport.width
+        container.appendChild(canvas)
+
+        await page.render({
+          canvasContext: ctx,
+          viewport,
+        }).promise
+      }
+      this.currentPage = endPage + 1 // 更新当前页码
+    },
+    handleScroll(container) {
+      const { scrollTop, scrollHeight, clientHeight } = container
+      if (scrollTop + clientHeight >= scrollHeight - 100) { // 当滚动到底部附近时
+        if (this.currentPage <= this.totalPages) {
+          this.loadBatchPages(container)
+        }
+      }
+    },
     // 计算缩放比例以适应容器宽度
     calculateScale(page) {
-      const containerWidth = document.getElementById('pdf-container').clientWidth
+      const containerWidth = document.getElementById('pdf-view-container').clientWidth
       const viewport = page.getViewport({ scale: 1 })
       return containerWidth / viewport.width
     }
   }
 }
 </script>
-
-<style lang="scss" scoped>
-.pdf-container {
-  width: 100%;
-  height: 100%;
-  iframe {
-    width: 100%;
-    height: 100%;
-  }
-}
-</style>

+ 0 - 8
plugins/gift-friends/src/entry.js

@@ -32,14 +32,6 @@ function install(Vue) {
     const element = document.querySelector(options.props.el) || document.body
     element.appendChild(instance.$el)
     instance.visible = true
-    // 弹框弹起时埋点abtest
-    try {
-      window.__EasyJTrack.addTrack(options.props.name, {
-        break_data: 'abtest',
-        source: options.props.name
-      })
-    }
-    catch (error) {}
     return instance
   }
 }

+ 0 - 8
plugins/gift-friends/src/utils/plugins/index.js

@@ -26,14 +26,6 @@ const GiftFriendsDialogPlugin = {
       console.log(element, 'element')
       element.appendChild(instance.$el)
       instance.visible = true
-      // 弹框弹起时埋点abtest
-      try {
-        window.__EasyJTrack.addTrack(options.props.name, {
-          break_data: 'abtest',
-          source: options.props.name
-        })
-      }
-      catch (error) {}
       return instance
     }
   }