修改pdf

src/components/pages/components/vpdf.vue

@@ -1,15 +1,16 @@
 <template>
   <!--使用 pdfvuer 实现 滑动浏览 单印章-->
   <div class="pdf">
-    <div class="loading" v-show="loading">
+    <div class="loading" v-show="isloading">
       <span>pdf可能会加载时间有点长，请耐心等待...</span>
     </div>
-    <div id="contentArea" class="show" v-if="!loading">
+    <!-- <div id="contentArea" class="show" v-if="!loading">
       <pdf :scale.sync="scale" :resize="true" ref="wrapper" class="p-pdf" :src="pdfData" v-for="i in numPages" :key="i"
         :id="i" :page="i" style="width: 100%">
-        <!-- <template slot="loading"> loading content here... </template> -->
       </pdf>
-    </div>
+    </div> -->
+    <iframe ref="viframe" style="width: 100%; height: 99%; border: none"
+      :src="'https://cloud.cocorobo.cn/pdf.js/web/viewer.html?file=' + pdfUrl"></iframe>
     <!-- <div class="rightArea">
       <div class="toolGroup">
         <div class="page">第 {{ page }} / {{ numPages }} 页</div>
@@ -21,15 +22,15 @@
 </template>
 
 <script>
-import pdfvuer from "pdfvuer"; // pdfvuer 版本为@1.6.1
-import "pdfjs-dist/build/pdf.worker.entry";
-const PDF = require("pdfjs-dist");
-PDF.GlobalWorkerOptions.workerSrc = "../../../common/pdf.worker.js";
+// import pdfvuer from "pdfvuer"; // pdfvuer 版本为@1.6.1
+// import "pdfjs-dist/build/pdf.worker.entry";
+// const PDF = require("pdfjs-dist");
+// PDF.GlobalWorkerOptions.workerSrc = "../../common/pdf.worker.js";
 
 export default {
   name: "Pdfvuer",
   components: {
-    pdf: pdfvuer,
+    // pdf: pdfvuer,
   },
   props: {
     // 当前pdf路径
@@ -49,31 +50,38 @@ export default {
       numPages: 0, // 总页数
       pdfData: undefined,
       inputPage: 1, // 输入的页码
-      loading: false,
+      isloading: false,
       scale: "page-width",
     };
   },
   mounted() {
-    // this.loading = this.$loading.service({
+    // this.isloading = this.$loading.service({
     //   background: "rgba(255, 255, 255, 0.7)",
     //   target: document.querySelector(".loading"),
     //   text: "加载中...",
     //   spinner: "",
     // });
-    this.loading = true;
-    this.getPdf();
+    this.isloading = false;
+    this.$refs.viframe.onload = function () {
+      this.isloading = false
+    }
+    console.log(this.isloading);
+    // this.getPdf();
   },
   beforeDestroy() { },
   watch: {
     pdfUrl: function (s) {
-      // this.loading = this.$loading.service({
+      // this.isloading = this.$loading.service({
       //   background: "rgba(255, 255, 255, 0.7)",
       //   target: document.querySelector(".loading"),
       //   text: "加载中...",
       //   spinner: "",
       // });
-      this.loading = true;
-      this.getPdf();
+      this.isloading = false;
+      this.$refs.viframe.onload = function () {
+        this.isloading = false
+      }
+      // this.getPdf();
     },
   },
   methods: {
@@ -86,8 +94,8 @@ export default {
       });
       this.pdfData
         .then((pdf) => {
-          // this.loading.close();
-          this.loading = false
+          // this.isloading.close();
+          this.isloading = false
           this.numPages = pdf.numPages;
         })
         .catch((err) => {
@@ -118,7 +126,8 @@ export default {
   display: flex;
   align-items: center;
   justify-content: center;
-  background-color: rgba(255, 255, 255, 0.7);
+  /* background-color: rgba(255, 255, 255, 0.7); */
+  background-color: rgba(255, 255, 255, 1);
   z-index: 9;
   font-size: 20px;
   color: #007fff;

src/components/pages/race/eventCenter/anliDetail.vue

@@ -983,7 +983,7 @@
                 class="jdTopBox"
                 v-if="jd.staTitle != ''"
                 :id="'jd' + jdIndex"
-                style="padding: 0 11px 10px 10px;margin:0"
+                style="padding: 0 11px 10px 10px; margin: 0"
               >
                 <div class="jdTopNav">
                   <div class="jdLeftNav">
@@ -1129,11 +1129,6 @@
                       <div
                         class="proOverNav"
                         v-html="hd.driQuestion ? hd.driQuestion.brief : ''"
-                        style="
-                          margin: 10px auto 0;
-                          padding: 10px;
-                          background: #f3f3f3;
-                        "
                       ></div>
                     </div>
                     <div class="noFile" v-else>
@@ -1204,11 +1199,6 @@
                       <div
                         class="proOverNav"
                         v-html="hd.tarDesign ? hd.tarDesign.brief : ''"
-                        style="
-                          margin: 10px auto 0;
-                          padding: 10px;
-                          background: #f3f3f3;
-                        "
                       ></div>
                     </div>
                     <div class="noFile" v-else>
@@ -1279,11 +1269,6 @@
                       <div
                         class="proOverNav"
                         v-html="hd.actiDesign ? hd.actiDesign.brief : ''"
-                        style="
-                          margin: 10px auto 0;
-                          padding: 10px;
-                          background: #f3f3f3;
-                        "
                       ></div>
                     </div>
                     <div class="noFile" v-else>
@@ -1355,11 +1340,6 @@
                       <div
                         class="proOverNav"
                         v-html="hd.evaDesign ? hd.evaDesign.brief : ''"
-                        style="
-                          margin: 10px auto 0;
-                          padding: 10px;
-                          background: rgb(243, 243, 243);
-                        "
                       ></div>
                     </div>
                     <div class="noFile" v-else>
@@ -3361,12 +3341,14 @@ body {
   word-break: break-word;
   margin-left: 10px;
   width: 95%;
-  /* background: #f6f9fe; */
   padding: 0 10px 10px 0;
   border-radius: 5px;
   height: auto;
   max-height: 500px;
   line-height: 30px;
+  padding: 10px;
+  background: rgb(243, 243, 243);
+  margin: 10px auto 0;
 }
 .noImg {
   max-height: 300px;