Home Explore Help
Sign In
CocoRoboLabs
/
pbl-teacher-table
3
0
Fork 0
Files Issues 0 Pull Requests 0 Wiki
Browse Source

实时课堂

lsc 2 years ago
parent
eefd3e21f3
commit
e7e70878c5
20 changed files with 179 additions and 290 deletions
Split View Show Diff Stats
  1. 2 2
      config/index.js
  2. 0 0
      dist/f8d828af36db46c3afa6.worker.js
  3. 1 1
      dist/index.html
  4. 0 0
      dist/static/css/app.5044da606181cf897d51556d458f2057.css
  5. 0 0
      dist/static/css/app.5044da606181cf897d51556d458f2057.css.map
  6. 0 0
      dist/static/css/app.5cbf279a7b8a14c84498bd7815f31592.css.map
  7. 0 0
      dist/static/js/0.495dd6dd7e801967b64f.js
  8. 0 0
      dist/static/js/0.495dd6dd7e801967b64f.js.map
  9. 0 0
      dist/static/js/1.994623639438b244a74c.js
  10. 0 0
      dist/static/js/1.994623639438b244a74c.js.map
  11. 0 0
      dist/static/js/app.e23cb3154cad8648c4ff.js
  12. 0 0
      dist/static/js/app.e23cb3154cad8648c4ff.js.map
  13. 0 0
      dist/static/js/app.fadf06b63fa731370004.js
  14. 1 2
      dist/static/js/manifest.39a9f69d36ef7d211bbe.js
  15. 0 0
      dist/static/js/manifest.39a9f69d36ef7d211bbe.js.map
  16. 0 0
      dist/static/js/vendor.75b99783a3bba1229488.js
  17. 0 0
      dist/static/js/vendor.75b99783a3bba1229488.js.map
  18. 0 0
      dist/static/js/vendor.f7ddaba5bf8a6e79ba40.js
  19. 49 12
      src/components/pages/components/imgDraw/imgDraw.vue
  20. 126 273
      src/components/pages/liveRoom.vue

+ 2 - 2
config/index.js
View File 

@@ -51,8 +51,8 @@ module.exports = {
 
 
     productionSourceMap: true,
 
     // https://webpack.js.org/configuration/devtool/#production
 
-    devtool: '#source-map',
 
-    // devtool: 'cheap-module-eval-source-map',
 
+    // devtool: '#source-map',
 
+    devtool: 'cheap-module-eval-source-map',
 
 
     // Gzip off by default as many popular static hosts such as
 
     // Surge or Netlify already gzip all static assets for you.

File diff suppressed because it is too large
+ 0 - 0
dist/f8d828af36db46c3afa6.worker.js


+ 1 - 1
dist/index.html
View File 

@@ -25,4 +25,4 @@
 
       height: 100%;
 
       width: 100%;
 
       background: #e6eaf0;
 
-    }</style><link href=./static/css/app.5cbf279a7b8a14c84498bd7815f31592.css rel=stylesheet></head><body><div id=app></div><script type=text/javascript src=./static/js/manifest.39a9f69d36ef7d211bbe.js></script><script type=text/javascript src=./static/js/vendor.75b99783a3bba1229488.js></script><script type=text/javascript src=./static/js/app.e23cb3154cad8648c4ff.js></script></body></html><script>document.domain = document.domain.split(".").slice(-2).join(".");</script>
 
+    }</style><link href=./static/css/app.5044da606181cf897d51556d458f2057.css rel=stylesheet></head><body><div id=app></div><script type=text/javascript src=./static/js/manifest.39a9f69d36ef7d211bbe.js></script><script type=text/javascript src=./static/js/vendor.f7ddaba5bf8a6e79ba40.js></script><script type=text/javascript src=./static/js/app.fadf06b63fa731370004.js></script></body></html><script>document.domain = document.domain.split(".").slice(-2).join(".");</script>

File diff suppressed because it is too large
+ 0 - 0
dist/static/css/app.5044da606181cf897d51556d458f2057.css


File diff suppressed because it is too large
+ 0 - 0
dist/static/css/app.5044da606181cf897d51556d458f2057.css.map


File diff suppressed because it is too large
+ 0 - 0
dist/static/css/app.5cbf279a7b8a14c84498bd7815f31592.css.map


File diff suppressed because it is too large
+ 0 - 0
dist/static/js/0.495dd6dd7e801967b64f.js


File diff suppressed because it is too large
+ 0 - 0
dist/static/js/0.495dd6dd7e801967b64f.js.map


File diff suppressed because it is too large
+ 0 - 0
dist/static/js/1.994623639438b244a74c.js


File diff suppressed because it is too large
+ 0 - 0
dist/static/js/1.994623639438b244a74c.js.map


File diff suppressed because it is too large
+ 0 - 0
dist/static/js/app.e23cb3154cad8648c4ff.js


File diff suppressed because it is too large
+ 0 - 0
dist/static/js/app.e23cb3154cad8648c4ff.js.map


File diff suppressed because it is too large
+ 0 - 0
dist/static/js/app.fadf06b63fa731370004.js


+ 1 - 2
dist/static/js/manifest.39a9f69d36ef7d211bbe.js
View File 

@@ -1,2 +1 @@
 
-!function(e){var n=window.webpackJsonp;window.webpackJsonp=function(r,c,a){for(var i,u,f,s=0,l=[];s<r.length;s++)u=r[s],t[u]&&l.push(t[u][0]),t[u]=0;for(i in c)Object.prototype.hasOwnProperty.call(c,i)&&(e[i]=c[i]);for(n&&n(r,c,a);l.length;)l.shift()();if(a)for(s=0;s<a.length;s++)f=o(o.s=a[s]);return f};var r={},t={4:0};function o(n){if(r[n])return r[n].exports;var t=r[n]={i:n,l:!1,exports:{}};return e[n].call(t.exports,t,t.exports,o),t.l=!0,t.exports}o.e=function(e){var n=t[e];if(0===n)return new Promise(function(e){e()});if(n)return n[2];var r=new Promise(function(r,o){n=t[e]=[r,o]});n[2]=r;var c=document.getElementsByTagName("head")[0],a=document.createElement("script");a.type="text/javascript",a.charset="utf-8",a.async=!0,a.timeout=12e4,o.nc&&a.setAttribute("nonce",o.nc),a.src=o.p+"static/js/"+e+"."+{0:"495dd6dd7e801967b64f",1:"994623639438b244a74c"}[e]+".js";var i=setTimeout(u,12e4);function u(){a.onerror=a.onload=null,clearTimeout(i);var n=t[e];0!==n&&(n&&n[1](new Error("Loading chunk "+e+" failed.")),t[e]=void 0)}return a.onerror=a.onload=u,c.appendChild(a),r},o.m=e,o.c=r,o.d=function(e,n,r){o.o(e,n)||Object.defineProperty(e,n,{configurable:!1,enumerable:!0,get:r})},o.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return o.d(n,"a",n),n},o.o=function(e,n){return Object.prototype.hasOwnProperty.call(e,n)},o.p="./",o.oe=function(e){throw console.error(e),e}}([]);
 
-//# sourceMappingURL=manifest.39a9f69d36ef7d211bbe.js.map
 
+!function(e){var n=window.webpackJsonp;window.webpackJsonp=function(r,c,a){for(var i,u,f,s=0,l=[];s<r.length;s++)u=r[s],t[u]&&l.push(t[u][0]),t[u]=0;for(i in c)Object.prototype.hasOwnProperty.call(c,i)&&(e[i]=c[i]);for(n&&n(r,c,a);l.length;)l.shift()();if(a)for(s=0;s<a.length;s++)f=o(o.s=a[s]);return f};var r={},t={4:0};function o(n){if(r[n])return r[n].exports;var t=r[n]={i:n,l:!1,exports:{}};return e[n].call(t.exports,t,t.exports,o),t.l=!0,t.exports}o.e=function(e){var n=t[e];if(0===n)return new Promise(function(e){e()});if(n)return n[2];var r=new Promise(function(r,o){n=t[e]=[r,o]});n[2]=r;var c=document.getElementsByTagName("head")[0],a=document.createElement("script");a.type="text/javascript",a.charset="utf-8",a.async=!0,a.timeout=12e4,o.nc&&a.setAttribute("nonce",o.nc),a.src=o.p+"static/js/"+e+"."+{0:"495dd6dd7e801967b64f",1:"994623639438b244a74c"}[e]+".js";var i=setTimeout(u,12e4);function u(){a.onerror=a.onload=null,clearTimeout(i);var n=t[e];0!==n&&(n&&n[1](new Error("Loading chunk "+e+" failed.")),t[e]=void 0)}return a.onerror=a.onload=u,c.appendChild(a),r},o.m=e,o.c=r,o.d=function(e,n,r){o.o(e,n)||Object.defineProperty(e,n,{configurable:!1,enumerable:!0,get:r})},o.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return o.d(n,"a",n),n},o.o=function(e,n){return Object.prototype.hasOwnProperty.call(e,n)},o.p="./",o.oe=function(e){throw console.error(e),e}}([]);

File diff suppressed because it is too large
+ 0 - 0
dist/static/js/manifest.39a9f69d36ef7d211bbe.js.map


File diff suppressed because it is too large
+ 0 - 0
dist/static/js/vendor.75b99783a3bba1229488.js


File diff suppressed because it is too large
+ 0 - 0
dist/static/js/vendor.75b99783a3bba1229488.js.map


File diff suppressed because it is too large
+ 0 - 0
dist/static/js/vendor.f7ddaba5bf8a6e79ba40.js


+ 49 - 12
src/components/pages/components/imgDraw/imgDraw.vue
View File 

@@ -13,6 +13,7 @@
 
       <!-- <p slot="title" class="title">Vue-ImagePainter🎨</p> -->
 
       <div class="d_body">
 
         <div class="board" ref="board">
 
+          <img id="img1" ref="img1" v-bind:src="baseMap" hidden="hidden" />
 
           <canvas id="ctx_front" ref="ctx_front" :style="'cursor:' + cursor"></canvas>
 
           <canvas id="ctx_base" ref="ctx_base" :style="'cursor:' + cursor"></canvas>
 
           <canvas id="ctx_back" ref="ctx_back" :style="'cursor:' + cursor"></canvas>
 
@@ -227,13 +228,13 @@ export default {
 
             return this.handleNext();
 
           },
 
         },
 
-        {
 
-          icon: "#icon-lajixiang_huaban1",
 
-          name: "清除",
 
-          fun: () => {
 
-            return this.handleClearCanvas();
 
-          },
 
-        },
 
+        // {
 
+        //   icon: "#icon-lajixiang_huaban1",
 
+        //   name: "清除",
 
+        //   fun: () => {
 
+        //     return this.handleClearCanvas();
 
+        //   },
 
+        // },
 
         {
 
           // icon: "#icon-baocun",
 
           icon: "",
 
@@ -334,9 +335,16 @@ export default {
 
       this.ctx_front = this.canvas_front.getContext("2d");
 
       this.ctx_back = this.canvas_back.getContext("2d");
 
       this.ctx_front.strokeStyle = this.defaultColor;
 
-      let img = new Image();
 
-      img.src = this.baseMap;
 
-      img.crossOrigin = "anonymous";
 
+      this.$forceUpdate();;
 
+      // let img = new Image();
 
+      let img = this.$refs.img1;
 
+      // img.src = this.baseMap;
 
+      // img.crossOrigin = "*"; 
+      // this.setAvatarBase64(this.baseMap, (base64) => {
 
+      //   this.$nextTick(() => {
 
+      //     // this.option.img = base64;
 
+      //   });
 
+      // });
 
       let _this = this;
 
       img.onload = function () {
 
         let width = parseInt(this.width);
 
@@ -359,6 +367,7 @@ export default {
 
       let _this = this;
 
       let img = new Image();
 
       let baseImg = new Image();
 
+      // let baseImg = this.$refs.img1;
 
       img.src = this.currentImg.url;
 
       baseImg.src = this.baseMap;
 
       _this.currentImg.width = _this.currentImg.width * this.currentImg.scale;
 
@@ -478,9 +487,11 @@ export default {
 
         // mx = e.clientX - this.canvas_front.offsetLeft;
 
         // my = e.clientY - this.canvas_front.offsetTop;
 
         var scrollL =
 
-          document.getElementsByClassName("d_body")[0].scrollLeft || document.getElementsByClassName("d_body")[0].scrollLeft;
 
+          document.getElementsByClassName("d_body")[0].scrollLeft ||
 
+          document.getElementsByClassName("d_body")[0].scrollLeft;
 
         var scrollT =
 
-          document.getElementsByClassName("d_body")[0].scrollTop || document.getElementsByClassName("d_body")[0].scrollTop;
 
+          document.getElementsByClassName("d_body")[0].scrollTop ||
 
+          document.getElementsByClassName("d_body")[0].scrollTop;
 
         mx = e.clientX + scrollL;
 
         my = e.clientY + scrollT;
 
         const cbx = this.ctx_base.getImageData(
 
@@ -611,6 +622,32 @@ export default {
 
         console.log(this.canvasStore);
 
       };
 
     },
 
+    // 将网络图片转换成base64格式
 
+    transBase64FromImage(image) {
 
+      let canvas = document.createElement("canvas");
 
+      canvas.width = image.width;
 
+      canvas.height = image.height;
 
+      let ctx = canvas.getContext("2d");
 
+      ctx.drawImage(image, 0, 0, image.width, image.height);
 
+      // 可选其他值 image/jpeg
 
+      return canvas.toDataURL("image/jpeg");
 
+    },
 
+    // 设置需要展示的图片  base64
 
+    setAvatarBase64(src, callback) {
 
+      let _this = this;
 
+      let image = new Image();
 
+      // 处理缓存
 
+      // image.src = src + "?v=" + Math.random();
 
+      image.src = src;
 
+      // 支持跨域图片
 
+      image.crossOrigin = "*";
 
+      image.onload = function () {
 
+        let base64 = _this.transBase64FromImage(image);
 
+        // callback && callback(base64);
 
+        console.log(base64);
 
+        // return base64
 
+      };
 
+    },
 
   },
 
   mounted() {
 
     this.$nextTick(() => {

+ 126 - 273
src/components/pages/liveRoom.vue
View File 

@@ -1,5 +1,5 @@
 
 <template>
 
-  <div style="background: #d0d6e4; width: 100%; margin: 0; position: relate">
 
+  <div style="background: #d0d6e4; width: 100%; height:100%; margin: 0; position: relate">
 
     <!-- <div class="pb_content_body" style="height: 100%">
 
     </div>-->
 
     <div class="blackBottom">
 
@@ -15,27 +15,17 @@
 
         <div class="logoLive">
 
           <img src="../../assets/icon/logo.png" alt />
 
         </div>
 
-        <div style="color: #fff; line-height: 45px; padding-left: 15px">
 
-          湖心亭看雪可可乐博模拟展示课件
 
-        </div>
 
+        <div style="color: #fff; line-height: 45px; padding-left: 15px">湖心亭看雪可可乐博模拟展示课件</div>
 
       </div>
 
     </div>
 
     <div class="isNoOther">
 
-      <div
 
-        class="imgMiddle"
 
-        :class="isBlock > 0 ? 'imghalf' : 'imgMiddle'"
 
-        v-show="!full"
 
-      >
 
+      <div class="imgMiddle" :class="isBlock > 0 ? 'imghalf' : 'imgMiddle'" v-show="!full">
 
         <!-- <img src="../../assets/icon/kc1.png" alt /> -->
 
         <!-- <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>-->
 
-        <pdf
 
-          :pdfUrl="pdfUrl"
 
-          style="width: 100%; height: 100%"
 
-          :getPage="getPage"
 
-        ></pdf>
 
+        <pdf :pdfUrl="pdfUrl" style="width: 100%; height: 100%" :getPage="getPage"></pdf>
 
       </div>
 
       <div
 
         style="
 
@@ -48,14 +38,8 @@
 
         "
 
         v-if="isBlock == 1 || isBlock == 6"
 
       >
 
-        <div
 
-          style="background: #fff; height: 92%; width: 96%; margin: 10px auto"
 
-        >
 
-          <div
 
-            style="color: #bfbfbf; padding: 15px 0 20px 25px; font-size: 20px"
 
-          >
 
-            答题查看
 
-          </div>
 
+        <div style="background: #fff; height: 92%; width: 96%; margin: 10px auto">
 
+          <div style="color: #bfbfbf; padding: 15px 0 20px 25px; font-size: 20px">答题查看</div>
 
 
           <div class="answerBox" v-if="isBlock == 1">
 
             <div class="answerTimuBox" v-for="item in 1" :key="item">
 
@@ -77,9 +61,7 @@
 
                 :class="{ pAnswer: item.is == 2 }"
 
                 v-for="(item, index) in studentArray"
 
                 :key="index"
 
-              >
 
-                {{ item.name }}
 
-              </div>
 
+              >{{ item.name }}</div>
 
             </div>
 
             <div class="memberBox" v-if="isBlock == 6">
 
               <div
 
@@ -87,21 +69,11 @@
 
                 v-for="(item, index) in studentArray2"
 
                 :key="index"
 
                 @click="whoAnswer(item, index)"
 
-              >
 
-                {{ item.name }}
 
-              </div>
 
-            </div>
 
-            <div style="color: #948bdc; padding-top: 15px" v-if="isBlock == 1">
 
-              正在答题......
 
+              >{{ item.name }}</div>
 
             </div>
 
-            <div class="viewSta" @click="isBlock = 3" v-if="isBlock == 1">
 
-              查看数据统计
 
-            </div>
 
-            <span
 
-              slot="footer"
 
-              class="dialog-footer sztFooter"
 
-              v-if="isBlock == 6"
 
-            >
 
+            <div style="color: #948bdc; padding-top: 15px" v-if="isBlock == 1">正在答题......</div>
 
+            <div class="viewSta" @click="isBlock = 3" v-if="isBlock == 1">查看数据统计</div>
 
+            <span slot="footer" class="dialog-footer sztFooter" v-if="isBlock == 6">
 
               <el-button type="primary" @click="isBlock = 0">结束</el-button>
 
               <!-- <el-button type="primary" @click="isBlock = 2">返回</el-button> -->
 
             </span>
 
@@ -148,11 +120,7 @@
 
           </span>
 
         </div>
 
       </div>
 
-      <div
 
-        class="answerBox tools_box"
 
-        v-if="isBlock == 2"
 
-        style="padding: 10px 0 0 25px"
 
-      >
 
+      <div class="answerBox tools_box" v-if="isBlock == 2" style="padding: 10px 0 0 25px">
 
         <div style="color: #d1d1d1; font-size: 24px">课堂实践</div>
 
         <div
 
           style="
 
@@ -162,9 +130,7 @@
 
             text-align: center;
 
             padding-bottom: 3px;
 
           "
 
-        >
 
-          选择工具
 
-        </div>
 
+        >选择工具</div>
 
         <div
 
           style="
 
             display: flex;
 
@@ -183,12 +149,9 @@
 
             <!-- <iframe
 
             style="width: 100%; height: 100%; border: none"
 
             src="https://iwb.cocorobo.cn/"
 
-          ></iframe> -->
 
+            ></iframe>-->
 
             <div class="toolImg">
 
-              <img
 
-                src="../../assets/icon/secondToolList/whiteBoard.png"
 
-                alt=""
 
-              />
 
+              <img src="../../assets/icon/secondToolList/whiteBoard.png" alt />
 
               <div>电子白板</div>
 
             </div>
 
           </div>
 
@@ -200,9 +163,9 @@
 
             <!-- <iframe
 
             style="width: 100%; height: 100%; border: none"
 
             src="https://iwb.cocorobo.cn/"
 
-          ></iframe> -->
 
+            ></iframe>-->
 
             <div class="toolImg">
 
-              <img src="../../assets/icon/secondToolList/note.png" alt="" />
 
+              <img src="../../assets/icon/secondToolList/note.png" alt />
 
               <div>便签</div>
 
             </div>
 
           </div>
 
@@ -214,12 +177,9 @@
 
             <!-- <iframe
 
             style="width: 100%; height: 100%; border: none"
 
             src="https://cloud.cocorobo.cn/kityminder-editor/dist/index.html"
 
-          ></iframe> -->
 
+            ></iframe>-->
 
             <div class="toolImg">
 
-              <img
 
-                src="../../assets/icon/secondToolList/mindMapping.png"
 
-                alt=""
 
-              />
 
+              <img src="../../assets/icon/secondToolList/mindMapping.png" alt />
 
               <div>思维导图</div>
 
             </div>
 
           </div>
 
@@ -231,9 +191,9 @@
 
             <!-- <iframe
 
             style="width: 100%; height: 100%; border: none"
 
             src="https://cloud.cocorobo.cn/kityminder-editor/dist/index.html"
 
-          ></iframe> -->
 
+            ></iframe>-->
 
             <div class="toolImg">
 
-              <img src="../../assets/icon/thirdToolList/ask.png" alt="" />
 
+              <img src="../../assets/icon/thirdToolList/ask.png" alt />
 
               <div>问卷调查</div>
 
             </div>
 
           </div>
 
@@ -245,9 +205,9 @@
 
             <!-- <iframe
 
             style="width: 100%; height: 100%; border: none"
 
             src="https://cloud.cocorobo.cn/kityminder-editor/dist/index.html"
 
-          ></iframe> -->
 
+            ></iframe>-->
 
             <div class="toolImg">
 
-              <img src="../../assets/icon/secondToolList/doc.png" alt="" />
 
+              <img src="../../assets/icon/secondToolList/doc.png" alt />
 
               <div>协同文档</div>
 
             </div>
 
           </div>
 
@@ -259,12 +219,9 @@
 
             <!-- <iframe
 
             style="width: 100%; height: 100%; border: none"
 
             src="https://pbl.cocorobo.cn/pbl-teacher-table/dist/#/Grid"
 
-          ></iframe> -->
 
+            ></iframe>-->
 
             <div class="toolImg">
 
-              <img
 
-                src="../../assets/icon/secondToolList/mindNetwork.png"
 
-                alt=""
 
-              />
 
+              <img src="../../assets/icon/secondToolList/mindNetwork.png" alt />
 
               <div>思维网格</div>
 
             </div>
 
           </div>
 
@@ -276,9 +233,9 @@
 
             <!-- <iframe
 
             style="width: 100%; height: 100%; border: none"
 
             src="https://pbl.cocorobo.cn/pbl-teacher-table/dist/#/Grid"
 
-          ></iframe> -->
 
+            ></iframe>-->
 
             <div class="toolImg">
 
-              <img src="../../assets/icon/secondToolList/library.png" alt="" />
 
+              <img src="../../assets/icon/secondToolList/library.png" alt />
 
               <div>素材库</div>
 
             </div>
 
           </div>
 
@@ -286,7 +243,7 @@
 
             <!-- <iframe
 
             style="width: 100%; height: 100%; border: none"
 
             src="https://pbl.cocorobo.cn/pbl-teacher-table/dist/#/Grid"
 
-          ></iframe> -->
 
+            ></iframe>-->
 
             <div class="toolImg">
 
               <div>倒计时</div>
 
             </div>
 
@@ -295,7 +252,7 @@
 
             <!-- <iframe
 
             style="width: 100%; height: 100%; border: none"
 
             src="https://pbl.cocorobo.cn/pbl-teacher-table/dist/#/Grid"
 
-          ></iframe> -->
 
+            ></iframe>-->
 
             <div class="toolImg">
 
               <div>问答题</div>
 
             </div>
 
@@ -304,7 +261,7 @@
 
             <!-- <iframe
 
             style="width: 100%; height: 100%; border: none"
 
             src="https://pbl.cocorobo.cn/pbl-teacher-table/dist/#/Grid"
 
-          ></iframe> -->
 
+            ></iframe>-->
 
             <div class="toolImg">
 
               <div>分小组</div>
 
             </div>
 
@@ -313,18 +270,14 @@
 
             <!-- <iframe
 
             style="width: 100%; height: 100%; border: none"
 
             src="https://pbl.cocorobo.cn/pbl-teacher-table/dist/#/Grid"
 
-          ></iframe> -->
 
+            ></iframe>-->
 
             <div class="toolImg">
 
               <div>作业评价</div>
 
             </div>
 
           </div>
 
         </div>
 
       </div>
 
-      <div
 
-        class="answerBox tools_box"
 
-        :class="{ fullStyle: full }"
 
-        v-if="isBlock == 5"
 
-      >
 
+      <div class="answerBox tools_box" :class="{ fullStyle: full }" v-if="isBlock == 5">
 
         <!-- <div
 
           style="
 
             border-bottom: 3px solid rgb(44, 131, 238);
 
@@ -341,37 +294,18 @@
 
             <div class="tools_title">
 
               <span>电子白板</span>
 
               <div>
 
-                <img
 
-                  src="../../assets/full.png"
 
-                  class="full"
 
-                  @click="fullTools"
 
-                />
 
-                <img
 
-                  src="../../assets/close1.png"
 
-                  class="closeImg"
 
-                  @click="closeTools"
 
-                />
 
+                <img src="../../assets/full.png" class="full" @click="fullTools" />
 
+                <img src="../../assets/close1.png" class="closeImg" @click="closeTools" />
 
               </div>
 
             </div>
 
-            <iframe
 
-              style="width: 100%; height: 100%; border: none"
 
-              src="https://iwb.cocorobo.cn/"
 
-            ></iframe>
 
+            <iframe style="width: 100%; height: 100%; border: none" src="https://iwb.cocorobo.cn/"></iframe>
 
           </div>
 
           <div v-if="toolsList[0].tools[howTools] == 2" class="tools_child_box">
 
             <div class="tools_title">
 
               <span>便签</span>
 
               <div>
 
-                <img
 
-                  src="../../assets/full.png"
 
-                  class="full"
 
-                  @click="fullTools"
 
-                />
 
-                <img
 
-                  src="../../assets/close1.png"
 
-                  class="closeImg"
 
-                  @click="closeTools"
 
-                />
 
+                <img src="../../assets/full.png" class="full" @click="fullTools" />
 
+                <img src="../../assets/close1.png" class="closeImg" @click="closeTools" />
 
               </div>
 
             </div>
 
             <iframe
 
@@ -383,16 +317,8 @@
 
             <div class="tools_title">
 
               <span>思维导图</span>
 
               <div>
 
-                <img
 
-                  src="../../assets/full.png"
 
-                  class="full"
 
-                  @click="fullTools"
 
-                />
 
-                <img
 
-                  src="../../assets/close1.png"
 
-                  class="closeImg"
 
-                  @click="closeTools"
 
-                />
 
+                <img src="../../assets/full.png" class="full" @click="fullTools" />
 
+                <img src="../../assets/close1.png" class="closeImg" @click="closeTools" />
 
               </div>
 
             </div>
 
             <iframe
 
@@ -404,16 +330,8 @@
 
             <div class="tools_title">
 
               <span>问卷调查</span>
 
               <div>
 
-                <img
 
-                  src="../../assets/full.png"
 
-                  class="full"
 
-                  @click="fullTools"
 
-                />
 
-                <img
 
-                  src="../../assets/close1.png"
 
-                  class="closeImg"
 
-                  @click="closeTools"
 
-                />
 
+                <img src="../../assets/full.png" class="full" @click="fullTools" />
 
+                <img src="../../assets/close1.png" class="closeImg" @click="closeTools" />
 
               </div>
 
             </div>
 
             <iframe
 
@@ -425,16 +343,8 @@
 
             <div class="tools_title">
 
               <span>协同文档</span>
 
               <div>
 
-                <img
 
-                  src="../../assets/full.png"
 
-                  class="full"
 
-                  @click="fullTools"
 
-                />
 
-                <img
 
-                  src="../../assets/close1.png"
 
-                  class="closeImg"
 
-                  @click="closeTools"
 
-                />
 
+                <img src="../../assets/full.png" class="full" @click="fullTools" />
 
+                <img src="../../assets/close1.png" class="closeImg" @click="closeTools" />
 
               </div>
 
             </div>
 
             <iframe
 
@@ -446,16 +356,8 @@
 
             <div class="tools_title">
 
               <span>思维网格</span>
 
               <div>
 
-                <img
 
-                  src="../../assets/full.png"
 
-                  class="full"
 
-                  @click="fullTools"
 
-                />
 
-                <img
 
-                  src="../../assets/close1.png"
 
-                  class="closeImg"
 
-                  @click="closeTools"
 
-                />
 
+                <img src="../../assets/full.png" class="full" @click="fullTools" />
 
+                <img src="../../assets/close1.png" class="closeImg" @click="closeTools" />
 
               </div>
 
             </div>
 
             <iframe
 
@@ -467,16 +369,8 @@
 
             <div class="tools_title">
 
               <span>素材库</span>
 
               <div>
 
-                <img
 
-                  src="../../assets/full.png"
 
-                  class="full"
 
-                  @click="fullTools"
 
-                />
 
-                <img
 
-                  src="../../assets/close1.png"
 
-                  class="closeImg"
 
-                  @click="closeTools"
 
-                />
 
+                <img src="../../assets/full.png" class="full" @click="fullTools" />
 
+                <img src="../../assets/close1.png" class="closeImg" @click="closeTools" />
 
               </div>
 
             </div>
 
             <iframe
 
@@ -488,100 +382,48 @@
 
             <div class="tools_title">
 
               <span>选择题</span>
 
               <div>
 
-                <img
 
-                  src="../../assets/full.png"
 
-                  class="full"
 
-                  @click="fullTools"
 
-                />
 
-                <img
 
-                  src="../../assets/close1.png"
 
-                  class="closeImg"
 
-                  @click="closeTools"
 
-                />
 
+                <img src="../../assets/full.png" class="full" @click="fullTools" />
 
+                <img src="../../assets/close1.png" class="closeImg" @click="closeTools" />
 
               </div>
 
             </div>
 
             <div>选择题</div>
 
           </div>
 
-          <div
 
-            v-if="toolsList[0].tools[howTools] == 10"
 
-            class="tools_child_box"
 
-          >
 
+          <div v-if="toolsList[0].tools[howTools] == 10" class="tools_child_box">
 
             <div class="tools_title">
 
               <span>倒计时</span>
 
               <div>
 
-                <img
 
-                  src="../../assets/full.png"
 
-                  class="full"
 
-                  @click="fullTools"
 
-                />
 
-                <img
 
-                  src="../../assets/close1.png"
 
-                  class="closeImg"
 
-                  @click="closeTools"
 
-                />
 
+                <img src="../../assets/full.png" class="full" @click="fullTools" />
 
+                <img src="../../assets/close1.png" class="closeImg" @click="closeTools" />
 
               </div>
 
             </div>
 
             <div>倒计时</div>
 
           </div>
 
-          <div
 
-            v-if="toolsList[0].tools[howTools] == 11"
 
-            class="tools_child_box"
 
-          >
 
+          <div v-if="toolsList[0].tools[howTools] == 11" class="tools_child_box">
 
             <div class="tools_title">
 
               <span>问答题</span>
 
               <div>
 
-                <img
 
-                  src="../../assets/full.png"
 
-                  class="full"
 
-                  @click="fullTools"
 
-                />
 
-                <img
 
-                  src="../../assets/close1.png"
 
-                  class="closeImg"
 
-                  @click="closeTools"
 
-                />
 
+                <img src="../../assets/full.png" class="full" @click="fullTools" />
 
+                <img src="../../assets/close1.png" class="closeImg" @click="closeTools" />
 
               </div>
 
             </div>
 
             <div>问答题</div>
 
           </div>
 
-          <div
 
-            v-if="toolsList[0].tools[howTools] == 13"
 
-            class="tools_child_box"
 
-          >
 
+          <div v-if="toolsList[0].tools[howTools] == 13" class="tools_child_box">
 
             <div class="tools_title">
 
               <span>分小组</span>
 
               <div>
 
-                <img
 
-                  src="../../assets/full.png"
 
-                  class="full"
 
-                  @click="fullTools"
 
-                />
 
-                <img
 
-                  src="../../assets/close1.png"
 
-                  class="closeImg"
 
-                  @click="closeTools"
 
-                />
 
+                <img src="../../assets/full.png" class="full" @click="fullTools" />
 
+                <img src="../../assets/close1.png" class="closeImg" @click="closeTools" />
 
               </div>
 
             </div>
 
             <div>分小组</div>
 
           </div>
 
-          <div
 
-            v-if="toolsList[0].tools[howTools] == 14"
 
-            class="tools_child_box"
 
-          >
 
+          <div v-if="toolsList[0].tools[howTools] == 14" class="tools_child_box">
 
             <div class="tools_title">
 
               <span>作业评价</span>
 
               <div>
 
-                <img
 
-                  src="../../assets/full.png"
 
-                  class="full"
 
-                  @click="fullTools"
 
-                />
 
-                <img
 
-                  src="../../assets/close1.png"
 
-                  class="closeImg"
 
-                  @click="closeTools"
 
-                />
 
+                <img src="../../assets/full.png" class="full" @click="fullTools" />
 
+                <img src="../../assets/close1.png" class="closeImg" @click="closeTools" />
 
               </div>
 
             </div>
 
             <div>作业评价</div>
 
@@ -596,7 +438,7 @@
 
               v-if="howTools != toolsList[0].tools.length - 1"
 
             >
 
               下一步
 
-            </div> -->
 
+            </div>-->
 
             <div class="nextStepOne" @click="isBlock = 2">返回</div>
 
           </div>
 
         </div>
 
@@ -618,7 +460,7 @@
 
             src="https://cloud.cocorobo.cn/kityminder-editor/dist/index.html"
 
           ></iframe>
 
         </div>
 
-        <div class="nextStepOne" @click="nextTool">下一步</div> -->
 
+        <div class="nextStepOne" @click="nextTool">下一步</div>-->
 
       </div>
 
 
       <div
 
@@ -642,9 +484,7 @@
 
             height: 25px;
 
             line-height: 25px;
 
           "
 
-        >
 
-          查看作业
 
-        </div>
 
+        >查看作业</div>
 
         <div class="workBox">
 
           <div class="works" v-for="(w, wIndex) in worksList" :key="wIndex">
 
             <div class="workImg">
 
@@ -671,9 +511,7 @@
 
 
     <div class="blackBottomB">
 
       <div style="display: flex">
 
-        <div class="blackButton" @click="showMember(0)" v-if="steps == 3">
 
-          开始答题
 
-        </div>
 
+        <div class="blackButton" @click="showMember(0)" v-if="steps == 3">开始答题</div>
 
         <div
 
           class="blackButton"
 
           @click="isBlock = 2"
 
@@ -684,19 +522,9 @@
 
             steps != 11 &&
 
             steps != 12
 
           "
 
-        >
 
-          查看工具
 
-        </div>
 
-        <div class="blackButton" @click="checkStudentAnswer" v-if="steps == 8">
 
-          选择学生回答
 
-        </div>
 
-        <div
 
-          class="blackButton"
 
-          @click="isBlock = 4"
 
-          v-if="steps == 11 || steps == 12"
 
-        >
 
-          查看作业
 
-        </div>
 
+        >查看工具</div>
 
+        <div class="blackButton" @click="checkStudentAnswer" v-if="steps == 8">选择学生回答</div>
 
+        <div class="blackButton" @click="isBlock = 4" v-if="steps == 11 || steps == 12">查看作业</div>
 
       </div>
 
       <!-- <div
 
         class="blackButton"
 
@@ -714,9 +542,9 @@
 
       :before-close="handleClose"
 
       class="dialog_diy"
 
     >
 
-      <div style="text-align: center; padding: 20px 0 50px 0; font-size: 18px">
 
-        是否让“{{ answerStudent }}”同学进行单独答题？
 
-      </div>
 
+      <div
 
+        style="text-align: center; padding: 20px 0 50px 0; font-size: 18px"
 
+      >是否让“{{ answerStudent }}”同学进行单独答题？</div>
 
       <div
 
         style="
 
           width: 200px;
 
@@ -730,9 +558,7 @@
 
           cursor: pointer;
 
         "
 
         @click="dialogVisible = false"
 
-      >
 
-        确定
 
-      </div>
 
+      >确定</div>
 
     </el-dialog>
 
     <el-dialog
 
       :visible.sync="dialogVisible1"
 
@@ -741,9 +567,7 @@
 
       :before-close="handleClose"
 
       class="dialog_diy"
 
     >
 
-      <div style="text-align: center; padding: 20px 0 50px 0; font-size: 18px">
 
-        正在开发中！
 
-      </div>
 
+      <div style="text-align: center; padding: 20px 0 50px 0; font-size: 18px">正在开发中！</div>
 
       <div
 
         style="
 
           width: 200px;
 
@@ -757,9 +581,7 @@
 
           cursor: pointer;
 
         "
 
         @click="dialogVisible1 = false"
 
-      >
 
-        确定
 
-      </div>
 
+      >确定</div>
 
     </el-dialog>
 
     <el-dialog
 
       :visible.sync="dialogVisible2"
 
@@ -768,9 +590,7 @@
 
       :before-close="handleClose"
 
       class="dialog_diy"
 
     >
 
-      <div style="text-align: center; padding: 20px 0 50px 0; font-size: 18px">
 
-        课程结束后才有报告！
 
-      </div>
 
+      <div style="text-align: center; padding: 20px 0 50px 0; font-size: 18px">课程结束后才有报告！</div>
 
       <div
 
         style="
 
           width: 200px;
 
@@ -784,11 +604,10 @@
 
           cursor: pointer;
 
         "
 
         @click="dialogVisible2 = false"
 
-      >
 
-        确定
 
-      </div>
 
+      >确定</div>
 
     </el-dialog>
 
     <ImgDraw :drawShow="drawShow" @closeDraw="closeDraw" :bg="bg"></ImgDraw>
 
+    <img id="img1" ref="img1" hidden="hidden" />
 
   </div>
 
 </template>
 
 
@@ -932,14 +751,13 @@ 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) {
 
@@ -1121,8 +939,14 @@ export default {
 
     previewImg(url) {
 
       // this.$hevueImgPreview(url);
 
       // this.$hevueImgPreview(url);
 
-      this.drawShow = true;
 
-      this.bg = url;
 
+      // this.drawShow = true;
 
+      // this.bg = url;
 
+      this.setAvatarBase64(url, (base64) => {
 
+        this.$nextTick(() => {
 
+          this.drawShow = true;
 
+          this.bg = base64;
 
+        });
 
+      });
 
     },
 
     closeDraw() {
 
       this.bg = null;
 
@@ -1135,6 +959,34 @@ export default {
 
       this.full = false;
 
       this.isBlock = 2;
 
     },
 
+    // 将网络图片转换成base64格式
 
+    transBase64FromImage(image) {
 
+      let canvas = document.createElement("canvas");
 
+      canvas.width = image.width;
 
+      canvas.height = image.height;
 
+      let ctx = canvas.getContext("2d");
 
+      ctx.drawImage(image, 0, 0, image.width, image.height);
 
+      // 可选其他值 image/jpeg
 
+      return canvas.toDataURL("image/jpeg");
 
+    },
 
+    // 设置需要展示的图片  base64
 
+    setAvatarBase64(src, callback) {
 
+      let _this = this;
 
+      // let image = new Image();
 
+      let image = this.$refs.img1;
 
+      // 处理缓存
 
+      // image.src = src + "?v=" + Math.random();
 
+      image.src = src;
 
+      // 支持跨域图片
 
+      // image.crossOrigin = "anonymous";
 
+      // crossorigin="anonymous"
 
+      image.onload = function () {
 
+        let base64 = _this.transBase64FromImage(image);
 
+        callback && callback(base64);
 
+        // console.log(base64);
 
+        // return base64
 
+      };
 
+    },
 
   },
 
   created() {
 
     this.selectSWork();
 
@@ -1169,7 +1021,7 @@ export default {
 
 .imgMiddle {
 
   width: 100%;
 
   height: calc(100% - 45px);
 
-  max-height: 920px;
 
+  /* max-height: 920px; */
 
 }
 
 
 .imgMiddle > img,
 
@@ -1179,7 +1031,7 @@ export default {
 
 .close > img {
 
   width: 100%;
 
   height: 100%;
 
-  max-height: 920px;
 
+  /* max-height: 920px; */
 
 }
 
 
 .blackBottomB {
 
@@ -1216,14 +1068,15 @@ export default {
 
 
 .isNoOther {
 
   width: 100%;
 
-  height: 100%;
 
+  /* height: 100%; */
 
+  height: calc(100% - 45px);
 
   display: flex;
 
 }
 
 
 .imghalf {
 
   width: 60% !important;
 
   height: calc(100% - 45px);
 
-  max-height: 920px;
 
+  /* max-height: 920px; */
 
 }
 
 .answerBox {
 
   padding-left: 25px;
 
@@ -1265,7 +1118,7 @@ export default {
 
 .viewSta {
 
   background: rgb(97, 97, 97);
 
   color: #bebebe;
 
-  margin: 20% auto 20px;
 
+  margin: 20px auto 20px;
 
   width: 300px;
 
   height: 40px;
 
   text-align: center;

Some files were not shown because too many files changed in this diff