优化大小窗

src/pages/course-detail/index.vue

@@ -45,10 +45,10 @@
                         class="iframe"
                         :src="$tools.splitImgHost(switchPdf.url)"
                         v-for="i in switchPdf.pdf"
-                        v-show="(!switchBox && i <= 1) || switchBox"
                         :key="i"
                         :page="i"
                         ref="pdf"
+                        @page-loaded="pageLoaded"
                       ></pdf>
                       <iframe
                         id="printIframe"
@@ -61,7 +61,7 @@
                   <i
                     v-if="!hideBox && switchPdf.pdf"
                     class="switch el-icon-monitor"
-                    @click="switchBox = !switchBox"
+                    @click="switchBoxFunc"
                   ></i>
                   <i
                     v-if="switchPdf.pdf"
@@ -1252,6 +1252,7 @@ export default {
       switchPdf: {}, //pdf数据
       liveDuration: 0,
       numPages: 0,
+      loadingPage: 0, //当前加载pdf页面数量
       showPdf: false,
       // 总页数
       pdfPages: 10,
@@ -1703,6 +1704,21 @@ export default {
   methods: {
     ...mapMutations(["getCartCount"]),
     ...mapActions(["getUserInfo"]),
+    switchBoxFunc() {
+      if (this.loadingPage === this.switchPdf.pdf) {
+        this.switchBox = !this.switchBox
+      } else {
+        this.$message.warning("PDF加载中,请耐心等待");
+        return;
+      }
+    },
+    pageLoaded(e) {
+      console.log("pdf页面总数：", this.switchPdf.pdf,"当前已加载总数:", e);
+      if(this.switchPdf.pdf === e){
+        this.$message.success("PDF加载完毕，如出现PDF模糊问题，请尝试重新切换");
+      this.loadingPage = e;
+      }
+    },
     backSwitchPdfData(item) {
       this.switchPdf = item;
     },