pdf

package-lock.json

@@ -35,6 +35,11 @@
         }
       }
     },
+    "@types/json-schema": {
+      "version": "7.0.11",
+      "resolved": "https://registry.npmmirror.com/@types/json-schema/-/json-schema-7.0.11.tgz",
+      "integrity": "sha512-wOuvG1SN4Us4rez+tylwwwCV1psiNVOkJeM3AUWUNWg/jDQY2+HE/444y5gc+jBmRqASOm2Oeh5c1axHobwRKQ=="
+    },
     "@types/q": {
       "version": "1.5.5",
       "resolved": "https://registry.nlark.com/@types/q/download/@types/q-1.5.5.tgz",
@@ -104,7 +109,6 @@
       "version": "6.12.6",
       "resolved": "https://registry.nlark.com/ajv/download/ajv-6.12.6.tgz?cache=0&sync_timestamp=1631470912358&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fajv%2Fdownload%2Fajv-6.12.6.tgz",
       "integrity": "sha1-uvWmLoArB9l3A0WG+MO69a3ybfQ=",
-      "dev": true,
       "requires": {
         "fast-deep-equal": "^3.1.1",
         "fast-json-stable-stringify": "^2.0.0",
@@ -115,8 +119,7 @@
     "ajv-keywords": {
       "version": "3.5.2",
       "resolved": "https://registry.npm.taobao.org/ajv-keywords/download/ajv-keywords-3.5.2.tgz?cache=0&sync_timestamp=1616882441894&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fajv-keywords%2Fdownload%2Fajv-keywords-3.5.2.tgz",
-      "integrity": "sha1-MfKdpatuANHC0yms97WSlhTVAU0=",
-      "dev": true
+      "integrity": "sha1-MfKdpatuANHC0yms97WSlhTVAU0="
     },
     "align-text": {
       "version": "0.1.4",
@@ -722,8 +725,7 @@
     "babel-plugin-syntax-dynamic-import": {
       "version": "6.18.0",
       "resolved": "https://registry.npm.taobao.org/babel-plugin-syntax-dynamic-import/download/babel-plugin-syntax-dynamic-import-6.18.0.tgz",
-      "integrity": "sha1-jWomIpyDdFqZgqRBBRVyyqF5sdo=",
-      "dev": true
+      "integrity": "sha1-jWomIpyDdFqZgqRBBRVyyqF5sdo="
     },
     "babel-plugin-syntax-exponentiation-operator": {
       "version": "6.13.0",
@@ -1337,8 +1339,7 @@
     "big.js": {
       "version": "5.2.2",
       "resolved": "https://registry.nlark.com/big.js/download/big.js-5.2.2.tgz",
-      "integrity": "sha1-ZfCvOC9Xi83HQr2cKB6cstd2gyg=",
-      "dev": true
+      "integrity": "sha1-ZfCvOC9Xi83HQr2cKB6cstd2gyg="
     },
     "binary-extensions": {
       "version": "2.2.0",
@@ -3776,8 +3777,7 @@
     "emojis-list": {
       "version": "3.0.0",
       "resolved": "https://registry.npm.taobao.org/emojis-list/download/emojis-list-3.0.0.tgz",
-      "integrity": "sha1-VXBmIEatKeLpFucariYKvf9Pang=",
-      "dev": true
+      "integrity": "sha1-VXBmIEatKeLpFucariYKvf9Pang="
     },
     "encodeurl": {
       "version": "1.0.2",
@@ -4343,14 +4343,12 @@
     "fast-deep-equal": {
       "version": "3.1.3",
       "resolved": "https://registry.npm.taobao.org/fast-deep-equal/download/fast-deep-equal-3.1.3.tgz?cache=0&sync_timestamp=1591599651635&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Ffast-deep-equal%2Fdownload%2Ffast-deep-equal-3.1.3.tgz",
-      "integrity": "sha1-On1WtVnWy8PrUSMlJE5hmmXGxSU=",
-      "dev": true
+      "integrity": "sha1-On1WtVnWy8PrUSMlJE5hmmXGxSU="
     },
     "fast-json-stable-stringify": {
       "version": "2.1.0",
       "resolved": "https://registry.npm.taobao.org/fast-json-stable-stringify/download/fast-json-stable-stringify-2.1.0.tgz?cache=0&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Ffast-json-stable-stringify%2Fdownload%2Ffast-json-stable-stringify-2.1.0.tgz",
-      "integrity": "sha1-h0v2nG9ATCtdmcSBNBOZ/VWJJjM=",
-      "dev": true
+      "integrity": "sha1-h0v2nG9ATCtdmcSBNBOZ/VWJJjM="
     },
     "fast-levenshtein": {
       "version": "2.0.6",
@@ -5787,8 +5785,7 @@
     "json-schema-traverse": {
       "version": "0.4.1",
       "resolved": "https://registry.npm.taobao.org/json-schema-traverse/download/json-schema-traverse-0.4.1.tgz?cache=0&sync_timestamp=1608000211395&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fjson-schema-traverse%2Fdownload%2Fjson-schema-traverse-0.4.1.tgz",
-      "integrity": "sha1-afaofZUTq4u4/mO9sJecRI5oRmA=",
-      "dev": true
+      "integrity": "sha1-afaofZUTq4u4/mO9sJecRI5oRmA="
     },
     "json-stringify-safe": {
       "version": "5.0.1",
@@ -5909,7 +5906,6 @@
       "version": "1.4.0",
       "resolved": "https://registry.npm.taobao.org/loader-utils/download/loader-utils-1.4.0.tgz",
       "integrity": "sha1-xXm140yzSxp07cbB+za/o3HVphM=",
-      "dev": true,
       "requires": {
         "big.js": "^5.2.2",
         "emojis-list": "^3.0.0",
@@ -5920,7 +5916,6 @@
           "version": "1.0.1",
           "resolved": "https://registry.npm.taobao.org/json5/download/json5-1.0.1.tgz",
           "integrity": "sha1-d5+wAYYE+oVOrL9iUhgNg1Q+Pb4=",
-          "dev": true,
           "requires": {
             "minimist": "^1.2.0"
           }
@@ -6577,8 +6572,7 @@
     "minimist": {
       "version": "1.2.5",
       "resolved": "https://registry.npm.taobao.org/minimist/download/minimist-1.2.5.tgz",
-      "integrity": "sha1-Z9ZgFLZqaoqqDAg8X9WN9OTpdgI=",
-      "dev": true
+      "integrity": "sha1-Z9ZgFLZqaoqqDAg8X9WN9OTpdgI="
     },
     "mississippi": {
       "version": "2.0.0",
@@ -7494,6 +7488,11 @@
         "sha.js": "^2.4.8"
       }
     },
+    "pdfjs-dist": {
+      "version": "2.6.347",
+      "resolved": "https://registry.npmmirror.com/pdfjs-dist/-/pdfjs-dist-2.6.347.tgz",
+      "integrity": "sha512-QC+h7hG2su9v/nU1wEI3SnpPIrqJODL7GTDFvR74ANKGq1AFJW16PH8VWnhpiTi9YcLSFV9xLeWSgq+ckHLdVQ=="
+    },
     "pend": {
       "version": "1.2.0",
       "resolved": "https://registry.npm.taobao.org/pend/download/pend-1.2.0.tgz",
@@ -9936,8 +9935,7 @@
     "punycode": {
       "version": "2.1.1",
       "resolved": "https://registry.npm.taobao.org/punycode/download/punycode-2.1.1.tgz?cache=0&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fpunycode%2Fdownload%2Fpunycode-2.1.1.tgz",
-      "integrity": "sha1-tYsBCsQMIsVldhbI0sLALHv0eew=",
-      "dev": true
+      "integrity": "sha1-tYsBCsQMIsVldhbI0sLALHv0eew="
     },
     "q": {
       "version": "1.5.1",
@@ -10016,6 +10014,42 @@
         "unpipe": "1.0.0"
       }
     },
+    "raw-loader": {
+      "version": "4.0.2",
+      "resolved": "https://registry.npmmirror.com/raw-loader/-/raw-loader-4.0.2.tgz",
+      "integrity": "sha512-ZnScIV3ag9A4wPX/ZayxL/jZH+euYb6FcUinPcgiQW0+UBtEv0O6Q3lGd3cqJ+GHH+rksEv3Pj99oxJ3u3VIKA==",
+      "requires": {
+        "loader-utils": "^2.0.0",
+        "schema-utils": "^3.0.0"
+      },
+      "dependencies": {
+        "json5": {
+          "version": "2.2.1",
+          "resolved": "https://registry.npmmirror.com/json5/-/json5-2.2.1.tgz",
+          "integrity": "sha512-1hqLFMSrGHRHxav9q9gNjJ5EXznIxGVO09xQRrwplcS8qs28pZ8s8hupZAmqDwZUmVZ2Qb2jnyPOWcDH8m8dlA=="
+        },
+        "loader-utils": {
+          "version": "2.0.2",
+          "resolved": "https://registry.npmmirror.com/loader-utils/-/loader-utils-2.0.2.tgz",
+          "integrity": "sha512-TM57VeHptv569d/GKh6TAYdzKblwDNiumOdkFnejjD0XwTH87K90w3O7AiJRqdQoXygvi1VQTJTLGhJl7WqA7A==",
+          "requires": {
+            "big.js": "^5.2.2",
+            "emojis-list": "^3.0.0",
+            "json5": "^2.1.2"
+          }
+        },
+        "schema-utils": {
+          "version": "3.1.1",
+          "resolved": "https://registry.npmmirror.com/schema-utils/-/schema-utils-3.1.1.tgz",
+          "integrity": "sha512-Y5PQxS4ITlC+EahLuXaY86TXfR7Dc5lw294alXOq86JAHCihAIZfqv8nNCWvaEJvaC51uN9hbLGeV0cFBdH+Fw==",
+          "requires": {
+            "@types/json-schema": "^7.0.8",
+            "ajv": "^6.12.5",
+            "ajv-keywords": "^3.5.2"
+          }
+        }
+      }
+    },
     "read-cache": {
       "version": "1.0.0",
       "resolved": "https://registry.npm.taobao.org/read-cache/download/read-cache-1.0.0.tgz",
@@ -11671,7 +11705,6 @@
       "version": "4.4.1",
       "resolved": "https://registry.npm.taobao.org/uri-js/download/uri-js-4.4.1.tgz?cache=0&sync_timestamp=1610237624359&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Furi-js%2Fdownload%2Furi-js-4.4.1.tgz",
       "integrity": "sha1-mxpSWVIlhZ5V9mnZKPiMbFfyp34=",
-      "dev": true,
       "requires": {
         "punycode": "^2.1.0"
       }
@@ -12012,6 +12045,24 @@
         }
       }
     },
+    "vue-pdf": {
+      "version": "4.3.0",
+      "resolved": "https://registry.npmmirror.com/vue-pdf/-/vue-pdf-4.3.0.tgz",
+      "integrity": "sha512-zd3lJj6CbtrawgaaDDciTDjkJMUKiLWtbEmBg5CvFn9Noe9oAO/GNy/fc5c59qGuFCJ14ibIV1baw4S07e5bSQ==",
+      "requires": {
+        "babel-plugin-syntax-dynamic-import": "^6.18.0",
+        "loader-utils": "^1.4.0",
+        "pdfjs-dist": "2.6.347",
+        "raw-loader": "^4.0.2",
+        "vue-resize-sensor": "^2.0.0",
+        "worker-loader": "^2.0.0"
+      }
+    },
+    "vue-resize-sensor": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmmirror.com/vue-resize-sensor/-/vue-resize-sensor-2.0.0.tgz",
+      "integrity": "sha512-W+y2EAI/BxS4Vlcca9scQv8ifeBFck56DRtSwWJ2H4Cw1GLNUYxiZxUHHkuzuI5JPW/cYtL1bPO5xPyEXx4LmQ=="
+    },
     "vue-router": {
       "version": "3.5.2",
       "resolved": "https://registry.nlark.com/vue-router/download/vue-router-3.5.2.tgz",
@@ -13028,6 +13079,26 @@
         "errno": "~0.1.7"
       }
     },
+    "worker-loader": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmmirror.com/worker-loader/-/worker-loader-2.0.0.tgz",
+      "integrity": "sha512-tnvNp4K3KQOpfRnD20m8xltE3eWh89Ye+5oj7wXEEHKac1P4oZ6p9oTj8/8ExqoSBnk9nu5Pr4nKfQ1hn2APJw==",
+      "requires": {
+        "loader-utils": "^1.0.0",
+        "schema-utils": "^0.4.0"
+      },
+      "dependencies": {
+        "schema-utils": {
+          "version": "0.4.7",
+          "resolved": "https://registry.npmmirror.com/schema-utils/-/schema-utils-0.4.7.tgz",
+          "integrity": "sha512-v/iwU6wvwGK8HbU9yi3/nhGzP0yGSuhQMzL6ySiec1FSrZZDkhm4noOSWzrNFo/jEc+SJY6jRTwuwbSXJPDUnQ==",
+          "requires": {
+            "ajv": "^6.1.0",
+            "ajv-keywords": "^3.1.0"
+          }
+        }
+      }
+    },
     "wrap-ansi": {
       "version": "2.1.0",
       "resolved": "https://registry.nlark.com/wrap-ansi/download/wrap-ansi-2.1.0.tgz?cache=0&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fwrap-ansi%2Fdownload%2Fwrap-ansi-2.1.0.tgz",

package.json

@@ -17,6 +17,7 @@
     "element-ui": "^2.15.6",
     "vue": "^2.5.2",
     "vue-cookies": "^1.7.4",
+    "vue-pdf": "^4.3.0",
     "vue-router": "^3.0.1",
     "vue-video-player": "^5.0.2",
     "vuex": "^3.6.2",

src/components/components/pdf.vue

@@ -0,0 +1,250 @@
+<template>
+  <div class="pdf">
+    <div class="show">
+      <pdf
+        ref="pdf"
+        :src="pdfUrl"
+        :page="pageNum"
+        :rotate="pageRotate"
+        @password="password"
+        @progress="loadedRatio = $event"
+        @page-loaded="pageLoaded($event)"
+        @num-pages="pageTotalNum = $event"
+        @error="pdfError($event)"
+        @link-clicked="page = $event"
+      ></pdf>
+    </div>
+
+    <!-- <div class="pdf_footer">
+      <div class="info">
+        <div>当前页数/总页数：{{pageNum}}/{{pageTotalNum}}</div>
+      </div>
+      <div class="operate">
+        <div class="btn" @click.stop="prePage">上一页</div>
+        <div class="btn" @click.stop="nextPage">下一页</div>
+      </div>
+    </div>-->
+  </div>
+</template>
+
+<script>
+import pdf from "vue-pdf";
+export default {
+  name: "vue_pdf_preview",
+  props: {
+    // 当前pdf路径
+    pdfUrl: {
+      type: String,
+      default:
+        "https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/0629%E5%AE%9E%E6%97%B6%E8%AF%BE%E5%A0%82%E6%A8%A1%E6%8B%9F%E6%BC%94%E7%A4%BA%E8%AF%BE%E4%BB%B61656920880446.pdf",
+    },
+    ppage: {
+      type: Number,
+      default: 1,
+    },
+  },
+  components: {
+    pdf,
+  },
+  data() {
+    return {
+      // 总页数
+      pageTotalNum: 1,
+      // 当前页数
+      pageNum: 1,
+      // 加载进度
+      loadedRatio: 0,
+      // 页面加载完成
+      curPageNum: 0,
+      // 放大系数 默认百分百
+      scale: 69,
+      // 旋转角度 ‘90’的倍数才有效
+      pageRotate: 0,
+      // 单击内部链接时触发 (目前我没有遇到使用场景)
+      page: 0,
+    };
+  },
+  watch: {
+    ppage(val) {
+      this.pageNum = val;
+    },
+  },
+  computed: {},
+  created() {},
+  mounted() {
+    this.pageNum = this.ppage;
+    var a = document.getElementsByClassName("pdf")[0].offsetWidth;
+    let _this = this;
+    this.$refs.pdf.$el.style.width =
+      document.getElementsByClassName("pdf")[0].offsetHeight * 1.77 + "px";
+    window.addEventListener("resize", () => {
+      this.$refs.pdf.$el.style.width =
+        document.getElementsByClassName("pdf")[0].offsetHeight * 1.77 + "px";
+    });
+  },
+  methods: {
+    //下载PDF
+    fileDownload(data, fileName) {
+      let blob = new Blob([data], {
+        //type类型后端返回来的数据中会有，根据自己实际进行修改
+        type: "application/pdf;charset-UTF-8",
+      });
+      let filename = fileName || "pdf.pdf";
+      if (typeof window.navigator.msSaveBlob !== "undefined") {
+        window.navigator.msSaveBlob(blob, filename);
+      } else {
+        var blobURL = window.URL.createObjectURL(blob);
+        // 创建隐藏<a>标签进行下载
+        var tempLink = document.createElement("a");
+        tempLink.style.display = "none";
+        tempLink.href = blobURL;
+        tempLink.setAttribute("download", filename);
+        if (typeof tempLink.download === "undefined") {
+          tempLink.setAttribute("target", "_blank");
+        }
+        document.body.appendChild(tempLink);
+        tempLink.click();
+        document.body.removeChild(tempLink);
+        window.URL.revokeObjectURL(blobURL);
+      }
+    },
+
+    //放大
+    scaleD() {
+      this.scale += 5;
+      this.$refs.pdf.$el.style.width = parseInt(this.scale) + "%";
+    },
+
+    //缩小
+    scaleX() {
+      // scale 是百分百展示 不建议缩放
+      if (this.scale == 100) {
+        return;
+      }
+      this.scale += -5;
+      console.log(parseInt(this.scale) + "%");
+      this.$refs.pdf.$el.style.width = parseInt(this.scale) + "%";
+    },
+    // 切换上一页
+    prePage() {
+      var p = this.pageNum;
+      p = p > 1 ? p - 1 : this.pageTotalNum;
+      this.pageNum = p;
+      this.getPage(p);
+    },
+    // 切换下一页
+    nextPage() {
+      var p = this.pageNum;
+      p = p < this.pageTotalNum ? p + 1 : 1;
+      this.pageNum = p;
+      this.getPage(p);
+    },
+    // 顺时针选中角度
+    clock() {
+      this.pageRotate += 90;
+    },
+    // 逆时针旋转角度
+    counterClock() {
+      this.pageRotate -= 90;
+    },
+    // pdf 有密码 则需要输入秘密
+    password(updatePassword, reason) {
+      updatePassword(prompt('password is "test"'));
+      console.log("...reason...");
+      console.log(reason);
+      console.log("...reason...");
+    },
+    // 页面加载成功  当前页数
+    pageLoaded(e) {
+      this.$emit("current", e);
+      this.curPageNum = e;
+    },
+    // 异常监听
+    pdfError(error) {
+      console.error(error);
+    },
+    // 打印所有
+    pdfPrintAll() {
+      this.$refs.pdf.print();
+    },
+    // 打印 第一页和第二页
+    pdfPrint() {
+      // 第一个参数 文档打印的分辨率
+      // 第二个参数 文档打印的页数
+      this.$refs.pdf.print(100, [1, 2]);
+    },
+    // 获取当前页面pdf的文字信息内容
+    logContent() {
+      this.$refs.pdf.pdf.forEachPage(function (page) {
+        return page.getTextContent().then(function (content) {
+          let text = content.items.map((item) => item.str);
+          let allStr = content.items.reduce((initVal, item) => (initVal += item.str), "");
+          console.log(allStr); // 内容字符串
+          console.log(text); // 内容数组
+        });
+      });
+    },
+  },
+};
+</script>
+
+<style scoped>
+.pdf {
+  height: 100%;
+  position: relative;
+  box-sizing: border-box;
+}
+.pdf .show {
+  overflow: auto;
+  margin: auto;
+  width: 100%;
+  height: calc(100%);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.pdf .pdf_footer {
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  padding: 10px 0;
+  width: 100%;
+  height: 75px;
+  background-color: rgba(255, 255, 255, 0.5);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-direction: column;
+}
+.pdf .pdf_footer .info {
+  display: flex;
+  flex-wrap: wrap;
+  width: 100%;
+  justify-content: center;
+}
+/* .pdf .pdf_footer .info div {
+  width: 30%;
+} */
+.pdf .pdf_footer .operate {
+  margin: 10px 0 0;
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: center;
+  width: 100%;
+}
+.pdf .pdf_footer .operate div {
+  text-align: center;
+  font-size: 15px;
+}
+.pdf .pdf_footer .operate .btn {
+  cursor: pointer;
+  margin: 5px 10px;
+  width: 100px;
+  border-radius: 10px;
+  padding: 5px;
+  color: #fff;
+  background-color: #066ebe;
+}
+</style>

src/components/liveProjectDetail.vue

@@ -19,34 +19,26 @@
         "
       >
         <div class="logoLive">
-          <img src="../assets/icon/logo.png" alt="" />
+          <img src="../assets/icon/logo.png" alt />
         </div>
         <div style="color: #fff; line-height: 45px; padding-left: 15px">
           湖心亭看雪可可乐博模拟展示课件
         </div>
       </div>
       <div
-        style="
-          display: flex;
-          flex-direction: row;
-          flex-wrap: nowrap;
-          align-items: center;
-        "
+        style="display: flex; flex-direction: row; flex-wrap: nowrap; align-items: center"
       >
-        <div class="blackButton" @click="answerWork" v-if="steps == 0">
-          下一步
-        </div>
-        <div class="blackButton" @click="steps = 3" v-if="steps != 3">
-          提交作业
-        </div>
+        <div class="blackButton" @click="answerWork" v-if="steps == 0">下一步</div>
+        <div class="blackButton" @click="steps = 3" v-if="steps != 3">提交作业</div>
       </div>
     </div>
     <div class="isNoOther">
       <div class="imgMiddle" :class="steps > 0 ? 'imghalf' : 'imgMiddle'">
-        <iframe
+        <!-- <iframe
           style="width: 100%; height: 100%; border: none"
           src="https://view.officeapps.live.com/op/view.aspx?src=https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/0701%E5%AE%9E%E6%97%B6%E8%AF%BE%E5%A0%82%E6%A8%A1%E6%8B%9F%E6%BC%94%E7%A4%BA%E8%AF%BE%E4%BB%B61656644341323.pptx"
-        ></iframe>
+        ></iframe>-->
+        <pdf :pdfUrl="pdfUrl" style="width: 100%; height: 100%" :ppage="ppage"></pdf>
       </div>
       <div
         v-if="steps > 0 && steps < 3"
@@ -97,7 +89,7 @@
             v-if="steps == 2"
           >
             选择工具
-          </div> -->
+          </div>-->
           <div class="answerBox" v-if="steps == 1">
             <!-- <div>
               <span class="timuButton">题目</span>
@@ -113,7 +105,7 @@
             <span slot="footer" class="dialog-footer sztFooter">
               <el-button type="primary" @click="answerQue">确定</el-button>
             </span>
-            <div class="nextStepOne" @click="answerWork">下一步</div> -->
+            <div class="nextStepOne" @click="answerWork">下一步</div>-->
             <div class="answerBox" v-if="steps == 1">
               <div
                 style="
@@ -129,7 +121,7 @@
                 <div class="choose_style">
                   <!-- {{
                   item
-                }}、小明有3本不同的语文书，2本不同的数学书，4本不同的英语书，小明整理书架时，要把这些书放在同一层，且相同科目的书要相邻摆放，问共有多少种摆放方式？-->
+                  }}、小明有3本不同的语文书，2本不同的数学书，4本不同的英语书，小明整理书架时，要把这些书放在同一层，且相同科目的书要相邻摆放，问共有多少种摆放方式？-->
                   <span
                     @click="isChooseActive(1)"
                     :class="typeC.indexOf(1) != -1 ? 'isChoose' : ''"
@@ -207,7 +199,7 @@
                 </div>
                 <div>思维导图</div>
               </div>
-            </div> -->
+            </div>-->
             <div class="nextStepOne" @click="nextTool">下一步</div>
           </div>
         </div>
@@ -225,12 +217,10 @@
           "
         >
           <div class="close" @click="(steps = 0), (type = 0)">
-            <img src="../assets/icon/close.png" alt="" />
+            <img src="../assets/icon/close.png" alt />
           </div>
 
-          <div style="color: #b6b6b6; font-size: 20px; padding: 20px">
-            上传作业
-          </div>
+          <div style="color: #b6b6b6; font-size: 20px; padding: 20px">上传作业</div>
           <div
             style="
               display: flex;
@@ -247,10 +237,10 @@
                 :key="imgIndex"
                 class="uploadImgPic"
               >
-                <img :src="uImg.url" alt="" />
+                <img :src="uImg.url" alt />
                 <div>{{ uImg.name }}</div>
                 <div class="deleteWord" @click="clean(1)">
-                  <img src="../assets/icon/delete.png" alt="" />
+                  <img src="../assets/icon/delete.png" alt />
                 </div>
               </div>
             </div>
@@ -259,20 +249,14 @@
               @click="addImg($event)"
               v-if="upload[0].upImg.length == 0"
             >
-              <img src="../assets/icon/uploadImg.png" alt="" />
+              <img src="../assets/icon/uploadImg.png" alt />
               <input
                 type="file"
-                accept="image/png,image/gif,image/jpeg"
+                accept="image/png, image/gif, image/jpeg"
                 style="display: none"
                 @change="beforeUpload1($event, 1)"
               />
-              <div
-                style="
-                  text-align: center;
-                  color: rgb(182, 182, 182);
-                  font-size: 20px;
-                "
-              >
+              <div style="text-align: center; color: rgb(182, 182, 182); font-size: 20px">
                 上传截图
               </div>
             </div>
@@ -318,10 +302,8 @@
                 上传视频
               </div>
             </div>
-          </div> -->
-          <div style="padding-left: 25px">
-            <span style="color: red">*</span> 简要描述
-          </div>
+          </div>-->
+          <div style="padding-left: 25px"><span style="color: red">*</span> 简要描述</div>
           <div style="padding: 10px 0 0 25px">
             <textarea
               rows="6"
@@ -346,9 +328,7 @@
     <div class="blackBottomB"></div>
     <div v-if="proVisible" class="mask">
       <div class="progressBox">
-        <div class="lbox">
-          <img src="../assets/loading.gif" />上传中，请稍后
-        </div>
+        <div class="lbox"><img src="../assets/loading.gif" />上传中，请稍后</div>
         <el-progress
           :text-inside="true"
           :stroke-width="20"
@@ -388,9 +368,17 @@
 </template>
 
 <script>
+import pdf from "./components/pdf";
 export default {
+  components: {
+    pdf,
+  },
   data() {
     return {
+      pdfUrl:
+        "https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/0629%E5%AE%9E%E6%97%B6%E8%AF%BE%E5%A0%82%E6%A8%A1%E6%8B%9F%E6%BC%94%E7%A4%BA%E8%AF%BE%E4%BB%B61656920880446.pdf",
+      ppage: 2,
+      timer: null,
       isLoading: false,
       formLabelWidth: "100px",
       userid: this.$route.query.userid,
@@ -420,6 +408,21 @@ export default {
       progress: 0,
       typeC: [],
       toolCount: 0,
+      tools: [
+        "",
+        "",
+        { tools: [""] }, //选择题
+        { tools: [""] }, //倒计时
+        { tools: [""] }, //问答题
+        { tools: [""] }, //问答题
+        { tools: [""] }, //思维导图/电子白板
+        { tools: [""] }, //选人回答
+        { tools: [""] }, //倒计时、分小组
+        { tools: [""] }, //思维导图/电子白板/思维网格
+        { tools: [""] }, //查看作业
+        { tools: [""] }, //查看作业
+        "", //查看作业
+      ],
     };
   },
   methods: {
@@ -455,14 +458,11 @@ export default {
     },
     //uuid生成
     guid() {
-      return "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(
-        /[xy]/g,
-        function (c) {
-          var r = (Math.random() * 16) | 0,
-            v = c == "x" ? r : (r & 0x3) | 0x8;
-          return v.toString(16);
-        }
-      );
+      return "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g, function (c) {
+        var r = (Math.random() * 16) | 0,
+          v = c == "x" ? r : (r & 0x3) | 0x8;
+        return v.toString(16);
+      });
     },
     time() {
       if (!this.now) {
@@ -640,17 +640,18 @@ export default {
     addSWork() {
       let params = {
         uid: this.userid,
+        cid: this.cid,
         upload: JSON.stringify(this.upload),
       };
       this.ajax
         .get(this.$store.state.api + "insertSWork", params)
         .then((res) => {
           this.isNoHomeWork = true;
-          this.selectSWork();
-          // this.upload = res.data[0][0].upload;
+          this.dialogVisible = true;
+          this.selectSWork(); // this.upload = res.data[0][0].upload;
         })
         .catch((err) => {
-          this.$message.error("查询失败");
+          this.$message.error("提交失败");
           console.error(err);
         });
     },
@@ -662,17 +663,40 @@ export default {
       this.ajax
         .get(this.$store.state.api + "selectSWork", params)
         .then((res) => {
-          this.isNoHomeWork = true;
+          if (res.data[0].length > 0) {
+            this.isNoHomeWork = true;
+          }
         })
         .catch((err) => {
-          this.$message.error("提交失败");
+          this.$message.error("查询失败");
           console.error(err);
         });
     },
     search() {},
+    setPage() {
+      this.ajax
+        .get(this.$store.state.api + "selectPptPage", "")
+        .then((res) => {
+          if (res.data[0].length > 0) {
+            this.ppage = res.data[0][0].page;
+          }
+        })
+        .catch((err) => {
+          this.$message.error("查询失败");
+          console.error(err);
+        });
+    },
+  },
+  beforeDestroy() {
+    clearInterval(this.timer);
+    this.timer = null;
   },
   created() {
     this.selectSWork();
+    let _this = this;
+    this.timer = setInterval(() => {
+      _this.setPage();
+    }, 1000);
   },
 };
 </script>

src/config/config.js

@@ -9,8 +9,8 @@ const store = new Vuex.Store({
         luyou: 1,
         userInfo: {},
         nCount: 0,
-        // api: 'https://pbl.cocorobo.cn/api/pbl/',
-        api: 'http://localhost:7003/api/pbl/',
+        api: 'https://pbl.cocorobo.cn/api/pbl/',
+        // api: 'http://localhost:7003/api/pbl/',
     },
 
     mutations: {