首頁 探索 說明
登入
CocoRoboLabs
/
pbl-student-table
3
0
複刻 0
Files 問題管理 0 合併請求 0 Wiki
瀏覽代碼

Merge branch 'beta' into HK

lsc 1 年之前
父節點
83f656bec5 204bd0be4a
當前提交
5e038ccc50
共有 77 個文件被更改，包括 3534 次插入 和 2599 次删除
分割檢視 顯示文件統計
  1. 4 0
      dist/index.html
  2. 0 0
      dist/static/css/app.0d19dd5a07d57fb3bbcbb3ae3aadb8d1.css
  3. 0 0
      dist/static/css/app.0d19dd5a07d57fb3bbcbb3ae3aadb8d1.css.map
  4. 二進制
      dist/static/img/close.58e17ef.png
  5. 二進制
      dist/static/img/codeIcon.4da4d65.png
  6. 二進制
      dist/static/img/comment.59b493d.png
  7. 二進制
      dist/static/img/formulaEdi.b6fd710.png
  8. 二進制
      dist/static/img/groupIcon.9204520.png
  9. 二進制
      dist/static/img/lock.bfe563d.png
  10. 二進制
      dist/static/img/molStr.a170f76.png
  11. 二進制
      dist/static/img/networkPanel.f86c203.png
  12. 二進制
      dist/static/img/pickPeople.bcaffba.png
  13. 二進制
      dist/static/img/return.c25c7c1.png
  14. 二進制
      dist/static/img/timeAxis.62ad5c1.png
  15. 二進制
      dist/static/img/vedio.a6a06d6.png
  16. 0 0
      dist/static/js/app.bdab38b81b7e452e3619.js.map
  17. 0 0
      dist/static/js/app.f4e19513be4d4b10c372.js
  18. 1 0
      dist/static/js/app.f4e19513be4d4b10c372.js.map
  19. 0 0
      dist/static/js/manifest.3ad1d5771e9b13dbdad2.js.map
  20. 0 0
      dist/static/js/vendor.e272a0df0fb3ce5b6fea.js
  21. 0 0
      dist/static/js/vendor.e272a0df0fb3ce5b6fea.js.map
  22. 0 0
      dist/static/js/vendor.e97d134e001cf57d792e.js
  23. 1 0
      dist/static/js/vendor.e97d134e001cf57d792e.js.map
  24. 4 0
      src/App.vue
  25. 二進制
      src/assets/icon/firstToolList/pickPeople.png
  26. 二進制
      src/assets/icon/fourthToolList/interVideo.png
  27. 0 0
      src/assets/icon/fourthToolList/interVideo2.png
  28. 二進制
      src/assets/icon/newIcon/allScreen.png
  29. 二進制
      src/assets/icon/newIcon/close.png
  30. 二進制
      src/assets/icon/newIcon/codeIcon.png
  31. 二進制
      src/assets/icon/newIcon/comment.png
  32. 二進制
      src/assets/icon/newIcon/groupIcon.png
  33. 二進制
      src/assets/icon/newIcon/lock.png
  34. 二進制
      src/assets/icon/newIcon/open.png
  35. 二進制
      src/assets/icon/newIcon/return.png
  36. 二進制
      src/assets/icon/newIcon/vedio.png
  37. 二進制
      src/assets/icon/secondToolList/formulaEdi.png
  38. 二進制
      src/assets/icon/secondToolList/molStr.png
  39. 二進制
      src/assets/icon/secondToolList/networkPanel.png
  40. 0 0
      src/assets/icon/secondToolList/networkPanel2.png
  41. 二進制
      src/assets/icon/secondToolList/timeAxis.png
  42. 1 1
      src/common/axios.config.js
  43. 7 7
      src/components/GM/studyStudentGM.vue
  44. 40 10
      src/components/components/askStatic.vue
  45. 28 3
      src/components/components/askStatic2.vue
  46. 158 49
      src/components/courseDetail.vue
  47. 142 0
      src/components/directive/el-drag-dialog/drag.js
  48. 13 0
      src/components/directive/el-drag-dialog/index.js
  49. 14 13
      src/components/easy/studyStudent.vue
  50. 320 1293
      src/components/easy2/studyStudent.vue
  51. 957 171
      src/components/easy3/studyStudent.vue
  52. 5 5
      src/components/group/group.vue
  53. 8 0
      src/components/index.vue
  54. 1 1
      src/components/liveProjectDetail.vue
  55. 1 1
      src/components/liveProjectDetailKH.vue
  56. 12 12
      src/components/noTerminal/courseDetail.vue
  57. 13 13
      src/components/noTerminal/studyStudent.vue
  58. 4 3
      src/components/student/courseDetail.vue
  59. 167 23
      src/components/student/studyStudent.vue
  60. 41 17
      src/components/studio/studyStudent.vue
  61. 9 9
      src/components/study.vue
  62. 207 965
      src/components/studyStudent.vue
  63. 0 0
      src/components/tools/hevue-img-preview/LICENSE
  64. 133 0
      src/components/tools/hevue-img-preview/README.md
  65. 131 0
      src/components/tools/hevue-img-preview/css/default.css
  66. 34 0
      src/components/tools/hevue-img-preview/css/theme-dark.css
  67. 41 0
      src/components/tools/hevue-img-preview/css/theme-light.css
  68. 536 0
      src/components/tools/hevue-img-preview/hevue-img-preview.vue
  69. 71 0
      src/components/tools/hevue-img-preview/iconfont/iconfont.css
  70. 二進制
      src/components/tools/hevue-img-preview/iconfont/iconfont.ttf
  71. 二進制
      src/components/tools/hevue-img-preview/iconfont/iconfont.woff
  72. 二進制
      src/components/tools/hevue-img-preview/iconfont/iconfont.woff2
  73. 48 0
      src/components/tools/hevue-img-preview/index.js
  74. 62 0
      src/components/tools/hevue-img-preview/package.json
  75. 2 1
      src/components/tools/time.vue
  76. 314 0
      src/components/wordCloud/index.vue
  77. 4 2
      src/main.js

+ 4 - 0
dist/index.html
查看文件 

@@ -18,7 +18,11 @@
 
       border-radius: 10px;
 
       -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);
 
       background-color: rgba(0, 0, 0, 0.1);
 
+<<<<<<< HEAD
 
     }</style><link href=./static/css/app.d9d0a5d00409f16294f25ff33f5136d1.css rel=stylesheet></head><body><div id=app></div><script type=text/javascript src=./static/js/manifest.3ad1d5771e9b13dbdad2.js></script><script type=text/javascript src=./static/js/vendor.e272a0df0fb3ce5b6fea.js></script><script type=text/javascript src=./static/js/app.bdab38b81b7e452e3619.js></script></body></html><script>function stopSafari() {
 
+=======
 
+    }</style><link href=./static/css/app.0d19dd5a07d57fb3bbcbb3ae3aadb8d1.css rel=stylesheet></head><body><div id=app></div><script type=text/javascript src=./static/js/manifest.3ad1d5771e9b13dbdad2.js></script><script type=text/javascript src=./static/js/vendor.e97d134e001cf57d792e.js></script><script type=text/javascript src=./static/js/app.f4e19513be4d4b10c372.js></script></body></html><script>function stopSafari() {
 
+>>>>>>> beta
 
     //阻止safari浏览器双击放大功能
 
     let lastTouchEnd = 0  //更新手指弹起的时间
 
     document.documentElement.addEventListener("touchstart", function (event) {

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


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


二進制
dist/static/img/close.58e17ef.png
查看文件


二進制
dist/static/img/codeIcon.4da4d65.png
查看文件


二進制
dist/static/img/comment.59b493d.png
查看文件


二進制
dist/static/img/formulaEdi.b6fd710.png
查看文件


二進制
dist/static/img/groupIcon.9204520.png
查看文件


二進制
dist/static/img/lock.bfe563d.png
查看文件


二進制
dist/static/img/molStr.a170f76.png
查看文件


二進制
dist/static/img/networkPanel.f86c203.png
查看文件


二進制
dist/static/img/pickPeople.bcaffba.png
查看文件


二進制
dist/static/img/return.c25c7c1.png
查看文件


二進制
dist/static/img/timeAxis.62ad5c1.png
查看文件


二進制
dist/static/img/vedio.a6a06d6.png
查看文件


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


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


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


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


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


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


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


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


+ 4 - 0
src/App.vue
查看文件 

@@ -391,4 +391,8 @@ html::-webkit-scrollbar-thumb {
 
 .GMBg{
 
   background: rgb(184, 181, 202) !important;
 
 }
 
+
 
+.showtip{
 
+  z-index: 999999999 !important;
 
+}
 
 </style>

二進制
src/assets/icon/firstToolList/pickPeople.png
查看文件


二進制
src/assets/icon/fourthToolList/interVideo.png
查看文件


+ 0 - 0
dist/static/img/interVideo.384a822.png → src/assets/icon/fourthToolList/interVideo2.png
查看文件


二進制
src/assets/icon/newIcon/allScreen.png
查看文件


二進制
src/assets/icon/newIcon/close.png
查看文件


二進制
src/assets/icon/newIcon/codeIcon.png
查看文件


二進制
src/assets/icon/newIcon/comment.png
查看文件


二進制
src/assets/icon/newIcon/groupIcon.png
查看文件


二進制
src/assets/icon/newIcon/lock.png
查看文件


二進制
src/assets/icon/newIcon/open.png
查看文件


二進制
src/assets/icon/newIcon/return.png
查看文件


二進制
src/assets/icon/newIcon/vedio.png
查看文件


二進制
src/assets/icon/secondToolList/formulaEdi.png
查看文件


二進制
src/assets/icon/secondToolList/molStr.png
查看文件


二進制
src/assets/icon/secondToolList/networkPanel.png
查看文件


+ 0 - 0
dist/static/img/networkPanel.e06ca1d.png → src/assets/icon/secondToolList/networkPanel2.png
查看文件


二進制
src/assets/icon/secondToolList/timeAxis.png
查看文件


+ 1 - 1
src/common/axios.config.js
查看文件 

@@ -1,6 +1,6 @@
 
 import axios from "axios"
 
 import qs from "qs"
 
-axios.defaults.timeout = 30000   //响应时间
 
+axios.defaults.timeout = 900000   //响应时间
 
 axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded;charset=UTF-8';        //配置请求头
 
 axios.defaults.baseURL = process.env.NODE_HOST;   //配置接口地址
 
 console.log(process.env)

+ 7 - 7
src/components/GM/studyStudentGM.vue
查看文件 

@@ -569,7 +569,7 @@
 
                           <div v-if="tooC == 15">
 
                             <img @click="addTools(tooC, toolIndex, taskCount)"
 
                               src="@/assets/icon/thirdToolList/answer.png" alt />
 
-                            <div style="margin: 5px 0">问答工具</div>
 
+                            <div style="margin: 5px 0">问答</div>
 
                           </div>
 
                           <div v-if="tooC == 26">
 
                             <img @click="addTools(tooC, toolIndex, taskCount)"
 
@@ -589,7 +589,7 @@
 
                           <div v-if="tooC == 21">
 
                             <img @click="addTools(tooC, toolIndex, taskCount)"
 
                               src="@/assets/icon/fourthToolList/program.png" alt />
 
-                            <div style="margin: 5px 0">编程平台</div>
 
+                            <div style="margin: 5px 0">AIoT Blockly</div>
 
                           </div>
 
                           <div v-if="tooC == 22">
 
                             <img @click="addTools(tooC, toolIndex, taskCount)"
 
@@ -599,12 +599,12 @@
 
                           <div v-if="tooC == 23">
 
                             <img @click="addTools(tooC, toolIndex, taskCount)"
 
                               src="@/assets/icon/fourthToolList/program.png" alt />
 
-                            <div style="margin: 5px 0">Python</div>
 
+                            <div style="margin: 5px 0">AI Python</div>
 
                           </div>
 
                           <div v-if="tooC == 24">
 
                             <img @click="addTools(tooC, toolIndex, taskCount)"
 
                               src="@/assets/icon/fourthToolList/AIprogram.png" alt />
 
-                            <div style="margin: 5px 0">AI平台</div>
 
+                            <div style="margin: 5px 0">AI Blockly</div>
 
                           </div>
 
                           <div v-if="tooC == 25">
 
                             <img @click="addTools(tooC, toolIndex, taskCount)"
 
@@ -649,7 +649,7 @@
 
                           <div v-if="tooC == 41">
 
                             <img @click="addTools(tooC, toolIndex, taskCount)"
 
                               src="@/assets/icon/thirdToolList/select.png" alt />
 
-                            <div style="margin: 5px 0">选择填空</div>
 
+                            <div style="margin: 5px 0">选择匹配</div>
 
                           </div>
 
                           <div v-if="tooC == 44">
 
                             <img @click="addTools(tooC, toolIndex, taskCount)"
 
@@ -2640,12 +2640,12 @@
 
         <el-button class="btnClassGM" type="primary" @click="addBzWorks" v-if="!isStar">确 定</el-button>
 
       </div>
 
     </el-dialog>
 
-    <el-dialog title="选择填空" :visible.sync="dialogVisibleSelect" :append-to-body="true" width="90%"
 
+    <el-dialog title="选择匹配" :visible.sync="dialogVisibleSelect" :append-to-body="true" width="90%"
 
       :before-close="handleClose" class="dialog_diy dialog_diy3">
 
       <div v-if="selectJson">
 
         <div class="select_box2">
 
           <div class="select_box2_title">
 
-            <div>选择填空</div>
 
+            <div>选择匹配</div>
 
             <div>请选择对应的答案进行答题！</div>
 
           </div>
 
           <div class="select_box2_box">

+ 40 - 10
src/components/components/askStatic.vue
查看文件 

@@ -10,8 +10,24 @@
 
         :key="index"
 
       >
 
         <div class="a_add_head">
 
-          <div>
 
-            <span>{{ index + 1 + "、" + item.askstitle }}</span>
 
+          <div style="width: calc(100% - 120px)">
 
+            <!-- <el-tooltip
 
+              effect="light"
 
+              :content="item.askstitle"
 
+              placement="top"
 
+            > -->
 
+              <span
 
+                style="
 
+                  width: auto;
 
+                  display: block;
 
+                  white-space: nowrap;
 
+                  overflow: hidden;
 
+                  text-overflow: ellipsis;
 
+                  word-break: break-word;
 
+                "
 
+                >{{ index + 1 + "、" + item.askstitle }}</span
 
+              >
 
+            <!-- </el-tooltip> -->
 
           </div>
 
           <el-button
 
             type="primary"
 
@@ -30,12 +46,26 @@
 
                 v-for="(item1, checkIndex) in item.askItem"
 
                 :key="checkIndex"
 
               >
 
-                <span :class="{ right: item.answer == checkIndex }"
 
-                  ><span
 
-                    style="max-width: calc(100% - 40px); width: auto"
 
-                    v-html="item.checkList[checkIndex]"
 
-                  ></span
 
-                ></span>
 
+                <span :class="{ right: item.answer == checkIndex }">
 
+                  <!-- <el-tooltip
 
+                    effect="light"
 
+                    :content="item.checkList[checkIndex]"
 
+                    placement="top"
 
+                  > -->
 
+                    <span
 
+                      style="
 
+                        max-width: calc(100% - 40px);
 
+                        white-space: nowrap;
 
+                        overflow: hidden;
 
+                        text-overflow: ellipsis;
 
+                        word-break: break-word;
 
+                        width: auto;
 
+                        display: block;
 
+                      "
 
+                      v-html="item.checkList[checkIndex]"
 
+                    ></span>
 
+                  <!-- </el-tooltip> -->
 
+                </span>
 
                 <span>{{
 
                   checkJson[index].checkCount[checkIndex]
 
                     ? checkJson[index].checkCount[checkIndex]
 
@@ -158,7 +188,6 @@ export default {
 
 
 <style scoped>
 
 .sjBox {
 
-  margin-top: 25px;
 
   /* max-height: 420px; */
 
   overflow: auto;
 
 }
 
@@ -179,6 +208,7 @@ export default {
 
   justify-content: space-between;
 
   margin: 10px 0;
 
   font-size: 18px;
 
+  width: 100%;
 
 }
 
 
 .a_add_head .a_add_head_input {
 
@@ -346,7 +376,7 @@ export default {
 
   overflow: hidden;
 
   padding: 5px;
 
   text-overflow: ellipsis;
 
-  font-size: 16px;
 
+  font-size: 14px;
 
   margin-bottom: 10px;
 
 }

+ 28 - 3
src/components/components/askStatic2.vue
查看文件 

@@ -10,8 +10,24 @@
 
         :key="index"
 
       >
 
         <div class="a_add_head">
 
-          <div>
 
-            <span>{{ index + 1 + "、" + item.teststitle }}</span>
 
+          <div style="width: calc(100% - 120px)">
 
+            <!-- <el-tooltip
 
+              effect="light"
 
+              :content="item.teststitle"
 
+              placement="top"
 
+            > -->
 
+              <span
 
+                style="
 
+                  width: auto;
 
+                  display: block;
 
+                  white-space: nowrap;
 
+                  overflow: hidden;
 
+                  text-overflow: ellipsis;
 
+                  word-break: break-word;
 
+                "
 
+                >{{ index + 1 + "、" + item.teststitle }}</span
 
+              >
 
+            <!-- </el-tooltip> -->
 
             <div
 
               class="timuImgBox"
 
               v-if="
 
@@ -71,7 +87,15 @@
 
                   </div>
 
                   <span
 
                     v-else
 
-                    style="max-width: calc(100% - 40px); width: auto"
 
+                    style="
 
+                      max-width: calc(100% - 40px);
 
+                      white-space: nowrap;
 
+                      overflow: hidden;
 
+                      text-overflow: ellipsis;
 
+                      word-break: break-word;
 
+                      width: auto;
 
+                      display: block;
 
+                    "
 
                     v-html="item.checkList[checkIndex]"
 
                   ></span>
 
                 </span>
 
@@ -223,6 +247,7 @@ export default {
 
   justify-content: space-between;
 
   margin: 10px 0;
 
   font-size: 18px;
 
+  width: 100%;
 
 }
 
 
 .a_add_head .a_add_head_input {

+ 158 - 49
src/components/courseDetail.vue
查看文件 

@@ -100,7 +100,7 @@
 
                   @click="TnameCheck = !TnameCheck"
 
                   style="color: #717c8d; font-weight: 400"
 
                 >
 
-                  协同人员：<span
 
+                  协同成员：<span
 
                     v-for="(tname, tIndex) in TnameCheck
 
                       ? Tname
 
                       : Tname.slice(0, 6)"
 
@@ -197,12 +197,11 @@
 
           <div :class="courseDetail.brief != '' ? 'rightTd' : 'noBRight'">
 
             <div v-if="tType == 1 || tType == 4" class="checkBox">
 
               <span :class="{ active: type == 2 }" @click="type = 2"
 
-                >阶段选择</span
 
+                >阶段选择 <div v-show="false">{{ courseDetail.state == 1 ? '阶段模式' : courseDetail.state == 2 ? '任务模式' : '极简模式' }}</div></span
 
               >
 
               <span
 
                 :class="{ active: type == 1 }"
 
                 @click="getCTwo"
 
-                v-if="courseDetail.state == 1"
 
                 >课程分析</span
 
               >
 
             </div>
 
@@ -215,7 +214,7 @@
 
                 class="courseItem"
 
                 v-for="(item, index) in chapInfo"
 
                 :key="index"
 
-                @click="addUserRate(index)"
 
+                @click="goToStudyRate(index)"
 
                 :class="{
 
                   disabled: isFollow == 2 && tType == 2 && followC != index,
 
                 }"
 
@@ -231,7 +230,7 @@
 
                     {{ item.dyName }}
 
                   </div>
 
                 </div>
 
-                <div style="font-size: 14px; font-weight: 400; color: #717c8d">
 
+                <div style="font-size: 14px; font-weight: 400; color: 3681FC">
 
                   {{ item.chapterInfo[0].taskJson.length }}个任务
 
                 </div>
 
               </div>
 
@@ -313,7 +312,7 @@
 
                               第{{ index + 1 }}阶段 {{ item.name }}
 
                             </div>
 
                           </el-tooltip>
 
-                          <div
 
+                          <!-- <div
 
                             style="
 
                               font-size: 14px;
 
                               font-weight: 400;
 
@@ -322,7 +321,7 @@
 
                             "
 
                           >
 
                             查看
 
-                          </div>
 
+                          </div> -->
 
                         </div>
 
                       </div>
 
 
@@ -445,7 +444,7 @@
 
                                   src="../assets/icon/thirdToolList/answer.png"
 
                                   alt
 
                                 />
 
-                                <div>问答工具</div>
 
+                                <div>问答</div>
 
                               </div>
 
                               <div v-if="item3.tool == 26">
 
                                 <img
 
@@ -473,7 +472,7 @@
 
                                   src="../assets/icon/fourthToolList/program.png"
 
                                   alt
 
                                 />
 
-                                <div>编程平台</div>
 
+                                <div>AIoT Blockly</div>
 
                               </div>
 
                               <div v-if="item3.tool == 22">
 
                                 <img
 
@@ -487,14 +486,14 @@
 
                                   src="../assets/icon/fourthToolList/program.png"
 
                                   alt
 
                                 />
 
-                                <div>Python</div>
 
+                                <div>AI Python</div>
 
                               </div>
 
                               <div v-if="item3.tool == 24">
 
                                 <img
 
                                   src="../assets/icon/fourthToolList/AIprogram.png"
 
                                   alt
 
                                 />
 
-                                <div>AI平台</div>
 
+                                <div>AI Blockly</div>
 
                               </div>
 
                               <div v-if="item3.tool == 25">
 
                                 <img
 
@@ -557,7 +556,7 @@
 
                                   src="../assets/icon/thirdToolList/select.png"
 
                                   alt
 
                                 />
 
-                                <div>选择填空</div>
 
+                                <div>选择匹配</div>
 
                               </div>
 
                               <div v-if="item3.tool == 44">
 
                                 <img
 
@@ -571,7 +570,7 @@
 
                                   src="../assets/icon/fourthToolList/conSentences.png"
 
                                   alt
 
                                 />
 
-                                <div>连词成句</div>
 
+                                <div>排序</div>
 
                               </div>
 
                               <div v-if="item3.tool == 48">
 
                                 <img
 
@@ -643,6 +642,34 @@
 
                                 />
 
                                 <div>海龟编程</div>
 
                               </div>
 
+                              <div v-if="item3.tool == 65">
 
+                                <img
 
+                                  src="../assets/icon/firstToolList/pickPeople.png"
 
+                                  alt
 
+                                />
 
+                                <div>挑人</div>
 
+                              </div>
 
+                              <div v-if="item3.tool == 66">
 
+                                <img
 
+                                  src="../assets/icon/secondToolList/formulaEdi.png"
 
+                                  alt
 
+                                />
 
+                                <div>公式编辑</div>
 
+                              </div>
 
+                              <div v-if="item3.tool == 67">
 
+                                <img
 
+                                  src="../assets/icon/secondToolList/molStr.png"
 
+                                  alt
 
+                                />
 
+                                <div>分子结构</div>
 
+                              </div>
 
+                              <div v-if="item3.tool == 68">
 
+                                <img
 
+                                  src="../assets/icon/secondToolList/timeAxis.png"
 
+                                  alt
 
+                                />
 
+                                <div>时间轴</div>
 
+                              </div>
 
                               <div v-if="item3.tool == undefined">
 
                                 <img
 
                                   src="../assets/icon/empytool.png"
 
@@ -677,7 +704,13 @@
 
               <div class="detail_box">
 
                 <div class="title"><span class="timeIcon">实施时间</span></div>
 
                 <div class="box">
 
-                  <div style="font-size: 22px; margin: 15px 0 45px">
 
+                  <div
 
+                    style="
 
+                      font-size: 22px;
 
+                      margin: 15px 0 45px;
 
+                      font-weight: 700;
 
+                    "
 
+                  >
 
                     {{ courseDetail.title }}
 
                   </div>
 
                   <div class="chapter_time_box" style="margin-left: 170px">
 
@@ -696,12 +729,39 @@
 
                         >
 
                           {{ item.time }}
 
                         </div>
 
-                        <div class="yuan"></div>
 
-                        <div class="stage">
 
+                        <div
 
+                          class="yuan"
 
+                          :class="
 
+                              (item.chapter.length == 1 || item.chapter.length > 1) &&
 
+                              (item.chapter[0].task.length == 1 || item.chapter[0].task.length > 1) &&
 
+                              item.chapter[0].task[0].works.length == 0
 
+                                ? 'bgCss'
 
+                                : ''
 
+                          "
 
+                        ></div>
 
+                        <div
 
+                          class="stage"
 
+                          :style="{
 
+                            background:
 
+                              (item.chapter.length == 1 || item.chapter.length > 1) &&
 
+                              (item.chapter[0].task.length == 1 || item.chapter[0].task.length > 1) &&
 
+                              item.chapter[0].task[0].works.length == 0
 
+                                ? '#ccc'
 
+                                : '',
 
+                          }"
 
+                        >
 
                           第{{ index + 1 }}阶段 {{ item.name }}
 
                         </div>
 
                         <div
 
                           class="s_up"
 
+                          :style="{
 
+                            display:
 
+                              (item.chapter.length == 1 || item.chapter.length > 1) &&
 
+                              (item.chapter[0].task.length == 1 || item.chapter[0].task.length > 1) &&
 
+                              item.chapter[0].task[0].works.length == 0
 
+                                ? 'none'
 
+                                : '',
 
+                          }"
 
                           :class="{ s_up2: !item.is }"
 
                           @click="item.is = !item.is"
 
                         >
 
@@ -735,7 +795,6 @@
 
                             ></div>
 
                             <div
 
                               style="
 
-                                color: #4376c3;
 
                                 font-size: 20px;
 
                                 font-weight: bold;
 
                               "
 
@@ -786,16 +845,16 @@
 
                                     <div v-if="item3.tool == 4">问卷调查</div>
 
                                     <div v-if="item3.tool == 45">选择题</div>
 
                                     <div v-if="item3.tool == 10">倒计时</div>
 
-                                    <div v-if="item3.tool == 15">问答工具</div>
 
+                                    <div v-if="item3.tool == 15">问答</div>
 
                                     <div v-if="item3.tool == 26">课程设计</div>
 
                                     <div v-if="item3.tool == 18">
 
                                       训练服务器
 
                                     </div>
 
                                     <div v-if="item3.tool == 16">作业提交</div>
 
-                                    <div v-if="item3.tool == 21">编程平台</div>
 
+                                    <div v-if="item3.tool == 21">AIoT Blockly</div>
 
                                     <div v-if="item3.tool == 22">AI体验</div>
 
-                                    <div v-if="item3.tool == 23">Python</div>
 
-                                    <div v-if="item3.tool == 24">AI平台</div>
 
+                                    <div v-if="item3.tool == 23">AI Python</div>
 
+                                    <div v-if="item3.tool == 24">AI Blockly</div>
 
                                     <div v-if="item3.tool == 25">目标管理</div>
 
                                     <div v-if="item3.tool == 31">数学画板</div>
 
                                     <div v-if="item3.tool == 28">翻译</div>
 
@@ -804,9 +863,9 @@
 
                                     <div v-if="item3.tool == 39">GeoGebra</div>
 
                                     <div v-if="item3.tool == 32">源码编辑</div>
 
                                     <div v-if="item3.tool == 40">学生评价</div>
 
-                                    <div v-if="item3.tool == 41">选择填空</div>
 
+                                    <div v-if="item3.tool == 41">选择匹配</div>
 
                                     <div v-if="item3.tool == 44">汉字宫</div>
 
-                                    <div v-if="item3.tool == 47">连词成句</div>
 
+                                    <div v-if="item3.tool == 47">排序</div>
 
                                     <div v-if="item3.tool == 48">表格</div>
 
                                     <div v-if="item3.tool == 49">学生分组</div>
 
                                     <div v-if="item3.tool == 50">批量上传</div>
 
@@ -1002,6 +1061,7 @@ export default {
 
       isFollow: "",
 
       followC: "",
 
       dialogVisibleQR: false,
 
+      checkStage: 0,
 
     };
 
   },
 
   methods: {
 
@@ -1029,7 +1089,9 @@ export default {
 
       if (this.courseDetail.state == 1) {
 
         if (this.classList.length) {
 
           this.goTo(
 
-            "/studyStudent?type=0&courseId=" +
 
+            "/studyStudent?type=" +
 
+              this.checkStage +
 
+              "&courseId=" +
 
               this.id +
 
               "&userid=" +
 
               this.userid +
 
@@ -1048,7 +1110,9 @@ export default {
 
           );
 
         } else {
 
           this.goTo(
 
-            "/studyStudent?type=0&courseId=" +
 
+            "/studyStudent?type=" +
 
+              this.checkStage +
 
+              "&courseId=" +
 
               this.id +
 
               "&userid=" +
 
               this.userid +
 
@@ -1067,7 +1131,9 @@ export default {
 
       } else if (this.courseDetail.state == 2) {
 
         if (this.classList.length) {
 
           this.goTo(
 
-            "/studystudentE2?type=0&courseId=" +
 
+            "/studystudentE2?type=" +
 
+              this.checkStage +
 
+              "&courseId=" +
 
               this.id +
 
               "&userid=" +
 
               this.userid +
 
@@ -1086,7 +1152,9 @@ export default {
 
           );
 
         } else {
 
           this.goTo(
 
-            "/studystudentE2?type=0&courseId=" +
 
+            "/studystudentE2?type=" +
 
+              this.checkStage +
 
+              "&courseId=" +
 
               this.id +
 
               "&userid=" +
 
               this.userid +
 
@@ -1105,7 +1173,9 @@ export default {
 
       } else if (this.courseDetail.state == 3) {
 
         if (this.classList.length) {
 
           this.goTo(
 
-            "/studystudentE3?type=0&courseId=" +
 
+            "/studystudentE3?type=" +
 
+              this.checkStage +
 
+              "&courseId=" +
 
               this.id +
 
               "&userid=" +
 
               this.userid +
 
@@ -1124,7 +1194,9 @@ export default {
 
           );
 
         } else {
 
           this.goTo(
 
-            "/studystudentE3?type=0&courseId=" +
 
+            "/studystudentE3?type=" +
 
+              this.checkStage +
 
+              "&courseId=" +
 
               this.id +
 
               "&userid=" +
 
               this.userid +
 
@@ -1149,6 +1221,18 @@ export default {
 
         this.addUserRate(0);
 
       }
 
     },
 
+    goToStudyRate(i) {
 
+      this.checkStage = i;
 
+      if (this.tType == 2) {
 
+        this.addUserRate(i);
 
+      } else {
 
+        if (this.classList.length > 0) {
 
+          this.dialogVisibleSk = true;
 
+        } else {
 
+          this.addUserRate(i);
 
+        }
 
+      }
 
+    },
 
     addUserRate(i) {
 
       // var suid = this.userid;
 
       // if (
 
@@ -1187,7 +1271,6 @@ export default {
 
       this.ajax
 
         .get(this.$store.state.api + "addUserR", params)
 
         .then((res) => {
 
-          console.log(res.data);
 
           this.updateVc();
 
           if (this.tType == 1 || this.tType == 4) {
 
             if (this.courseDetail.state == 1) {
 
@@ -1249,7 +1332,25 @@ export default {
 
               );
 
             }
 
           } else if (this.tType == 2) {
 
-            this.gotoCourse(this.classId);
 
+            this.goTo(
 
+              "/studyStudent?type=" +
 
+                i +
 
+                "&courseId=" +
 
+                this.id +
 
+                "&userid=" +
 
+                this.userid +
 
+                "&oid=" +
 
+                this.oid +
 
+                "&org=" +
 
+                this.org +
 
+                "&cid=" +
 
+                this.classId +
 
+                "&tType=" +
 
+                this.tType +
 
+                "&screenType=" +
 
+                this.screenType
 
+            );
 
+            // this.gotoCourse(this.classId);
 
           } else {
 
             this.goTo(
 
               "/study?type=" +
 
@@ -1773,14 +1874,14 @@ export default {
 
 }
 
 
 .now_study {
 
-  width: 136px;
 
-  height: 36px;
 
-  color: #717c8d;
 
-  background: #f0f4fa;
 
+  width: 120px;
 
+  height: 45px;
 
+  color: #fff;
 
+  background: #3681fc;
 
   text-align: center;
 
-  line-height: 36px;
 
-  border-radius: 5px;
 
-  font-size: 13px;
 
+  line-height: 45px;
 
+  border-radius: 8px;
 
+  font-size: 16px;
 
   cursor: pointer;
 
   display: flex;
 
   flex-direction: row;
 
@@ -1788,6 +1889,7 @@ export default {
 
   align-items: center;
 
   justify-content: center;
 
 }
 
+
 
 .now_study + .now_study {
 
   margin-left: 10px;
 
 }
 
@@ -1959,7 +2061,7 @@ export default {
 
 .courseItem {
 
   width: 299px;
 
   height: 70px;
 
-  background: #f0f4fa;
 
+  background: #ddebf8;
 
   border-radius: 8px;
 
   margin-right: 16px;
 
   margin-bottom: 16px;
 
@@ -1983,13 +2085,13 @@ export default {
 
 .jdAndTask > div:nth-child(1) {
 
   font-size: 18px;
 
   font-weight: bold;
 
-  color: #0e1e33;
 
+  color: #000;
 
   margin-bottom: 10px;
 
 }
 
 .jdAndTask > div:nth-child(2) {
 
   font-size: 14px;
 
   font-weight: 400;
 
-  color: #717c8d;
 
+  color: #000;
 
   max-width: 180px;
 
   white-space: nowrap;
 
   overflow: hidden;
 
@@ -2037,7 +2139,7 @@ export default {
 
   background: #f0f4fa;
 
   width: 75px;
 
   height: 36px;
 
-  color: #717c8d;
 
+  color: #000;
 
   text-align: center;
 
   line-height: 36px;
 
   margin-right: 20px;
 
@@ -2093,7 +2195,7 @@ export default {
 
 }
 
 
 .jd {
 
-  background: #e0eafb;
 
+  background: #ddebf8;
 
   margin-left: 12px;
 
   border-radius: 4px;
 
   font-size: 14px;
 
@@ -2105,7 +2207,7 @@ export default {
 
 }
 
 
 .sLeft {
 
-  width: 19%;
 
+  width: 25%;
 
   margin-right: 10px;
 
   background: rgb(255, 255, 255);
 
   padding: 20px 20px 0 20px;
 
@@ -2148,7 +2250,7 @@ export default {
 
 
 .rightTd,
 
 .noBRight {
 
-  width: calc(100% - 19% - 10px);
 
+  width: calc(100% - 25% - 10px);
 
   background: #fff;
 
   display: flex;
 
   flex-direction: row;
 
@@ -2303,7 +2405,7 @@ export default {
 
 }
 
 
 .blueBtn {
 
-  background: rgb(79, 140, 223);
 
+  background: #61a0f5;
 
   color: #fff;
 
   display: flex;
 
   padding: 10px 15px;
 
@@ -2549,6 +2651,9 @@ export default {
 
   margin-right: 10px;
 
 }
 
 
+.bgCss::before{
 
+  background: #ccc !important;
 
+}
 
 .c_box .stage_box .yuan::before {
 
   content: "";
 
   width: 15px;
 
@@ -2558,7 +2663,7 @@ export default {
 
 }
 
 
 .c_box .stage_box .stage {
 
-  background: linear-gradient(90deg, #477cd7, #65b9fc);
 
+  background: linear-gradient(90deg, #478bff, #65b9fc);
 
   border-radius: 5px;
 
   height: 50px;
 
   line-height: 50px;
 
@@ -2662,14 +2767,18 @@ export default {
 
   justify-content: flex-start;
 
   align-items: flex-start;
 
   min-height: 300px;
 
+  max-height: 500px;
 
+  overflow: auto;
 
+  align-content: flex-start;
 
+  margin-bottom: 15px;
 
 }
 
 .classBox > div {
 
   width: 106px;
 
   height: 32px;
 
-  background: #f0f4fa;
 
+  background: #3681fc;
 
   border-radius: 4px;
 
   font-weight: 400;
 
-  color: #717c8d;
 
+  color: #fff;
 
   font-size: 14px;
 
   text-align: center;
 
   line-height: 32px;

+ 142 - 0
src/components/directive/el-drag-dialog/drag.js
查看文件 

@@ -0,0 +1,142 @@
 
+export default {
 
+  bind(el, binding, vnode) {
 
+    const dialogHeaderEl = el.querySelector('.pzTop')
 
+    const dragDom = el
 
+    dialogHeaderEl.style.cssText += ';cursor:move;'
 
+    // dragDom.style.cssText += ';top:0px;'
 
+
 
+    // 获取原有属性 ie dom元素.currentStyle 火狐谷歌 window.getComputedStyle(dom元素, null);
 
+    const getStyle = (function() {
 
+      if (window.document.currentStyle) {
 
+        return (dom, attr) => dom.currentStyle[attr]
 
+      } else {
 
+        return (dom, attr) => getComputedStyle(dom, false)[attr]
 
+      }
 
+    })()
 
+    dialogHeaderEl.ontouchstart = (e) => {
 
+      if(e.target.className != "pzClose"){
 
+        e.preventDefault()
 
+      }
 
+      // 鼠标按下，计算当前元素距离可视区的距离
 
+      const disX = e.touches[0].pageX - dialogHeaderEl.offsetLeft
 
+      const disY = e.touches[0].pageY - dialogHeaderEl.offsetTop
 
+
 
+      const dragDomWidth = dragDom.offsetWidth
 
+      const dragDomHeight = dragDom.offsetHeight
 
+
 
+      const screenWidth = document.body.clientWidth
 
+      const screenHeight = document.body.clientHeight
 
+
 
+      const minDragDomLeft = dragDom.offsetLeft
 
+      const maxDragDomLeft = screenWidth - dragDom.offsetLeft - dragDomWidth
 
+
 
+      const minDragDomTop = dragDom.offsetTop
 
+      const maxDragDomTop = screenHeight - dragDom.offsetTop - dragDomHeight
 
+
 
+      // 获取到的值带px 正则匹配替换
 
+      let styL = getStyle(dragDom, 'left')
 
+      let styT = getStyle(dragDom, 'top')
 
+
 
+      if (styL.includes('%')) {
 
+        styL = +document.body.clientWidth * (+styL.replace(/\%/g, '') / 100)
 
+        styT = +document.body.clientHeight * (+styT.replace(/\%/g, '') / 100)
 
+      } else {
 
+        styL = +styL.replace(/\px/g, '')
 
+        styT = +styT.replace(/\px/g, '')
 
+      }
 
+
 
+      dialogHeaderEl.ontouchmove = function(e) {
 
+        e.preventDefault()
 
+        // 通过事件委托，计算移动的距离
 
+        let left = e.touches[0].pageX - disX
 
+        let top = e.touches[0].pageY - disY
 
+
 
+        // 边界处理
 
+        if (-(left) > minDragDomLeft) {
 
+          left = -minDragDomLeft
 
+        } else if (left > maxDragDomLeft) {
 
+          left = maxDragDomLeft
 
+        }
 
+
 
+        if (-(top) > minDragDomTop) {
 
+          top = -minDragDomTop
 
+        } else if (top > maxDragDomTop) {
 
+          top = maxDragDomTop
 
+        }
 
+
 
+        // 移动当前元素
 
+        dragDom.style.cssText += `;left:${left + styL}px;top:${top + styT}px;`
 
+
 
+        // emit onDrag event
 
+        // vnode.child.$emit('dragDialog')
 
+      }
 
+    }
 
+    dialogHeaderEl.onmousedown = (e) => {
 
+      // 鼠标按下，计算当前元素距离可视区的距离
 
+      const disX = e.clientX - dialogHeaderEl.offsetLeft
 
+      const disY = e.clientY - dialogHeaderEl.offsetTop
 
+
 
+      const dragDomWidth = dragDom.offsetWidth
 
+      const dragDomHeight = dragDom.offsetHeight
 
+
 
+      const screenWidth = document.body.clientWidth
 
+      const screenHeight = document.body.clientHeight
 
+
 
+      const minDragDomLeft = dragDom.offsetLeft
 
+      const maxDragDomLeft = screenWidth - dragDom.offsetLeft - dragDomWidth
 
+
 
+      const minDragDomTop = dragDom.offsetTop
 
+      const maxDragDomTop = screenHeight - dragDom.offsetTop - dragDomHeight
 
+
 
+      // 获取到的值带px 正则匹配替换
 
+      let styL = getStyle(dragDom, 'left')
 
+      let styT = getStyle(dragDom, 'top')
 
+
 
+      if (styL.includes('%')) {
 
+        styL = +document.body.clientWidth * (+styL.replace(/\%/g, '') / 100)
 
+        styT = +document.body.clientHeight * (+styT.replace(/\%/g, '') / 100)
 
+      } else {
 
+        styL = +styL.replace(/\px/g, '')
 
+        styT = +styT.replace(/\px/g, '')
 
+      }
 
+
 
+      document.onmousemove = function(e) {
 
+        // 通过事件委托，计算移动的距离
 
+        let left = e.clientX - disX
 
+        let top = e.clientY - disY
 
+
 
+        // 边界处理
 
+        if (-(left) > minDragDomLeft) {
 
+          left = -minDragDomLeft
 
+        } else if (left > maxDragDomLeft) {
 
+          left = maxDragDomLeft
 
+        }
 
+
 
+        if (-(top) > minDragDomTop) {
 
+          top = -minDragDomTop
 
+        } else if (top > maxDragDomTop) {
 
+          top = maxDragDomTop
 
+        }
 
+
 
+        // 移动当前元素
 
+        dragDom.style.cssText += `;left:${left + styL}px;top:${top + styT}px;`
 
+
 
+        // emit onDrag event
 
+        // vnode.child.$emit('dragDialog')
 
+      }
 
+
 
+      document.onmouseup = function(e) {
 
+        document.onmousemove = null
 
+        document.onmouseup = null
 
+        dialogHeaderEl.ontouchmove = null
 
+        document.ontouchend = null
 
+      }
 
+      document.ontouchend = function(e) {
 
+        document.onmousemove = null
 
+        document.onmouseup = null
 
+        dialogHeaderEl.ontouchmove = null
 
+        document.ontouchend = null
 
+      }
 
+    }
 
+  }
 
+}

+ 13 - 0
src/components/directive/el-drag-dialog/index.js
查看文件 

@@ -0,0 +1,13 @@
 
+import drag from './drag'
 
+
 
+const install = function(Vue) {
 
+  Vue.directive('el-drag-dialog', drag)
 
+}
 
+
 
+if (window.Vue) {
 
+  window['el-drag-dialog'] = drag
 
+  Vue.use(install); // eslint-disable-line
 
+}
 
+
 
+drag.install = install
 
+export default drag

+ 14 - 13
src/components/easy/studyStudent.vue
查看文件 

@@ -489,7 +489,7 @@
 
                       <div class="tool">
 
                         <div class="whiteBIcon">
 
                           <img src="../../assets/icon/thirdToolList/answer.png" alt />
 
-                          <div style="margin: 5px 0">问答工具</div>
 
+                          <div style="margin: 5px 0">问答</div>
 
                         </div>
 
                       </div>
 
                       <div class="tool">
 
@@ -513,13 +513,13 @@
 
                       <div class="tool">
 
                         <div class="whiteBIcon">
 
                           <img src="../../assets/icon/thirdToolList/select.png" alt />
 
-                          <div style="margin: 5px 0">选择填空</div>
 
+                          <div style="margin: 5px 0">选择匹配</div>
 
                         </div>
 
                       </div>
 
                       <div class="tool">
 
                         <div class="whiteBIcon">
 
                           <img src="../../assets/icon/fourthToolList/conSentences.png" alt />
 
-                          <div style="margin: 5px 0">连词成句</div>
 
+                          <div style="margin: 5px 0">排序</div>
 
                         </div>
 
                       </div>
 
                     </div>
 
@@ -533,7 +533,7 @@
 
                       <div class="tool">
 
                         <div class="whiteBIcon">
 
                           <img src="../../assets/icon/fourthToolList/program.png" alt />
 
-                          <div style="margin: 5px 0">编程平台</div>
 
+                          <div style="margin: 5px 0">AIoT Blockly</div>
 
                         </div>
 
                       </div>
 
                       <div class="tool">
 
@@ -545,13 +545,13 @@
 
                       <div class="tool">
 
                         <div class="whiteBIcon">
 
                           <img src="../../assets/icon/fourthToolList/Pythonprogram.png" alt />
 
-                          <div style="margin: 5px 0">Python</div>
 
+                          <div style="margin: 5px 0">AI Python</div>
 
                         </div>
 
                       </div>
 
                       <div class="tool">
 
                         <div class="whiteBIcon">
 
                           <img src="../../assets/icon/fourthToolList/AIprogram.png" alt />
 
-                          <div style="margin: 5px 0">AI平台</div>
 
+                          <div style="margin: 5px 0">AI Blockly</div>
 
                         </div>
 
                       </div>
 
                       <div class="tool">
 
@@ -1580,12 +1580,12 @@
 
         <el-button type="primary" @click="addBzWorksTeacher" v-if="!isStar">确 定</el-button>
 
       </div>
 
     </el-dialog>
 
-    <el-dialog title="选择填空" :visible.sync="dialogVisibleSelect" :append-to-body="true" width="90%"
 
+    <el-dialog title="选择匹配" :visible.sync="dialogVisibleSelect" :append-to-body="true" width="90%"
 
       :before-close="handleClose" class="dialog_diy dialog_diy3">
 
       <div v-if="selectJson">
 
         <div class="select_box2">
 
           <div class="select_box2_title">
 
-            <div>选择填空</div>
 
+            <div>选择匹配</div>
 
             <div>请选择对应的答案进行答题！</div>
 
           </div>
 
           <div class="select_box2_box">
 
@@ -1632,7 +1632,7 @@
 
         </div>
 
       </div>
 
     </el-dialog>
 
-    <el-dialog title="选择填空" :visible.sync="dialogVisibleSelectTeacher" :append-to-body="true" width="90%"
 
+    <el-dialog title="选择匹配" :visible.sync="dialogVisibleSelectTeacher" :append-to-body="true" width="90%"
 
       :before-close="handleClose" class="dialog_diy dialog_diy3">
 
       <div v-if="selectJson">
 
         <div class="w_name">
 
@@ -1640,7 +1640,7 @@
 
         </div>
 
         <div class="select_box2">
 
           <div class="select_box2_title">
 
-            <div>选择填空</div>
 
+            <div>选择匹配</div>
 
             <div>请选择对应的答案进行答题！</div>
 
           </div>
 
           <div class="select_box2_box">
 
@@ -1743,7 +1743,7 @@
 
         </el-button>
 
       </span>
 
     </el-dialog>
 
-    <el-dialog title="连词成句" :visible.sync="dialogVisibleSentence" :append-to-body="true" width="1000px"
 
+    <el-dialog title="排序" :visible.sync="dialogVisibleSentence" :append-to-body="true" width="1000px"
 
       :before-close="handleClose" class="dialog_diy dialog_diy3">
 
       <div>
 
         <div class="sentenBox">
 
@@ -1791,7 +1791,7 @@
 
         <el-button type="primary" @click="addSenWorks">确 定</el-button>
 
       </span>
 
     </el-dialog>
 
-    <el-dialog title="连词成句" :visible.sync="dialogVisibleSentenceTeacher" :append-to-body="true" width="1000px"
 
+    <el-dialog title="排序" :visible.sync="dialogVisibleSentenceTeacher" :append-to-body="true" width="1000px"
 
       :before-close="handleClose" class="dialog_diy dialog_diy3">
 
       <div>
 
         <div class="w_name">
 
@@ -1842,7 +1842,7 @@
 
         <el-button type="primary" @click="addSenWorksTeacher">确 定</el-button>
 
       </span>
 
     </el-dialog>
 
-    <el-dialog title="连词成句" :visible.sync="dialogVisibleSentence1" :append-to-body="true" width="1000px"
 
+    <el-dialog title="排序" :visible.sync="dialogVisibleSentence1" :append-to-body="true" width="1000px"
 
       :before-close="handleClose" class="dialog_diy dialog_diy3">
 
       <div>
 
         <div class="sentenBox">
 
@@ -11269,6 +11269,7 @@ ol {
 
   flex-direction: column;
 
   flex-wrap: nowrap;
 
   align-items: center;
 
+  font-size:14px;
 
 }
 
 
 .whiteBIcon>img {

File diff suppressed because it is too large
+ 320 - 1293
src/components/easy2/studyStudent.vue


File diff suppressed because it is too large
+ 957 - 171
src/components/easy3/studyStudent.vue


+ 5 - 5
src/components/group/group.vue
查看文件 

@@ -280,12 +280,12 @@
 
             :before-close="handleClose" class="dialog_diy">
 
             <div class="groupBox">
 
                 <div v-if="groupJson2.group" class="groupContent">
 
-                    <div class="groupTitle">请设置小组数量</div>
 
+                    <div class="groupTitle">请设置小组数量及名称</div>
 
                     <div v-for="(item, index) in groupJson2.group" :key="index" class="groupName">
 
-                        <span class="groupn">组{{ index + 1 }}名称:</span>
 
+                        <span class="groupn">第{{ index + 1 }}组名称:</span>
 
                         <el-input v-model="item.name" placeholder="请输入名称..." style="width: 250px"></el-input>
 
                         <div class="groupBtn">
 
-                            <el-button type="primary" size="small" @click="addGroup(index)">
 
+                            <el-button type="primary" size="small" @click="addGroup(index)" v-if="(groupJson2.group.length - 1) == index">
 
                                 添加</el-button>
 
                             <el-button type="primary" size="small" @click="deleteGroup(index)"
 
                                 v-if="groupJson2.group && groupJson2.group.length > 1">删除</el-button>
 
@@ -293,9 +293,9 @@
 
                     </div>
 
                 </div>
 
                 <div class="groupContent">
 
-                    <div class="groupTitle">请设置每组人数数量</div>
 
+                    <div class="groupTitle">请设置每组人数</div>
 
                     <el-input-number v-model="groupJson2.number" :controls="false" :min="2" :max="10"
 
-                        placeholder="2-10人以内"></el-input-number>
 
+                        placeholder="请输入2-10的数字"></el-input-number>
 
                 </div>
 
             </div>
 
             <span slot="footer" class="dialog-footer">

+ 8 - 0
src/components/index.vue
查看文件 

@@ -865,6 +865,14 @@ export default {
 
     this.timer = null;
 
   },
 
   created() {
 
+    let typea = this.$route.query.typea
 
+    let typeb = this.$route.query.typeb
 
+    let typed = this.$route.query.typed
 
+    if(typea || typeb || typed){
 
+      this.typea = typea ? typea : ''
 
+      this.typeb = typeb ? typeb : ''
 
+      this.typed = typed ? typed : ''
 
+    }
 
     this.loading = true;
 
     // this.selectType();
 
     this.selectAllType();

+ 1 - 1
src/components/liveProjectDetail.vue
查看文件 

@@ -964,7 +964,7 @@ export default {
 
         { tools: [29] },
 
         "",
 
         "",
 
-        //1、电子白板 2、便签 3、思维导图 4、问卷调查 5、量规评分 6、协同文档 7、思维网格 8、素材库 9、选择题 10、倒计时 11、问答题 12、选人回答 13、分小组 14、老师对提交作业进行评价 15、问答 16、作业提交 17、学习资料 18、训练平台 19、目标管理 20、课程设计 21、编程平台 22、AI体验 23、python 24、AI平台
 
+        //1、电子白板 2、便签 3、思维导图 4、问卷调查 5、量规评分 6、协同文档 7、思维网格 8、素材库 9、选择题 10、倒计时 11、问答题 12、选人回答 13、分小组 14、老师对提交作业进行评价 15、问答 16、作业提交 17、学习资料 18、训练平台 19、目标管理 20、课程设计 21、AIoT Blockly 22、AI体验 23、python 24、AI Blockly
 
       ],
 
       rateList: [],
 
       tkAnswerBox: [],

+ 1 - 1
src/components/liveProjectDetailKH.vue
查看文件 

@@ -964,7 +964,7 @@ export default {
 
         { tools: [29] },
 
         "",
 
         "",
 
-        //1、电子白板 2、便签 3、思维导图 4、问卷调查 5、量规评分 6、协同文档 7、思维网格 8、素材库 9、选择题 10、倒计时 11、问答题 12、选人回答 13、分小组 14、老师对提交作业进行评价 15、问答 16、作业提交 17、学习资料 18、训练平台 19、目标管理 20、课程设计 21、编程平台 22、AI体验 23、python 24、AI平台
 
+        //1、电子白板 2、便签 3、思维导图 4、问卷调查 5、量规评分 6、协同文档 7、思维网格 8、素材库 9、选择题 10、倒计时 11、问答题 12、选人回答 13、分小组 14、老师对提交作业进行评价 15、问答 16、作业提交 17、学习资料 18、训练平台 19、目标管理 20、课程设计 21、AIoT Blockly 22、AI体验 23、python 24、AI Blockly
 
       ],
 
       rateList: [],
 
       tkAnswerBox: [],

+ 12 - 12
src/components/noTerminal/courseDetail.vue
查看文件 

@@ -214,7 +214,7 @@
 
                               </div>
 
                               <div v-if="item3.tool == 15">
 
                                 <img src="../../assets/icon/thirdToolList/answer.png" alt />
 
-                                <div>问答工具</div>
 
+                                <div>问答</div>
 
                               </div>
 
                               <div v-if="item3.tool == 26">
 
                                 <img src="../../assets/icon/thirdToolList/courseDesign.png" alt />
 
@@ -230,7 +230,7 @@
 
                               </div>
 
                               <div v-if="item3.tool == 21">
 
                                 <img src="../../assets/icon/fourthToolList/program.png" alt />
 
-                                <div>编程平台</div>
 
+                                <div>AIoT Blockly</div>
 
                               </div>
 
                               <div v-if="item3.tool == 22">
 
                                 <img src="../../assets/icon/fourthToolList/program.png" alt />
 
@@ -238,11 +238,11 @@
 
                               </div>
 
                               <div v-if="item3.tool == 23">
 
                                 <img src="../../assets/icon/fourthToolList/program.png" alt />
 
-                                <div>Python</div>
 
+                                <div>AI Python</div>
 
                               </div>
 
                               <div v-if="item3.tool == 24">
 
                                 <img src="../../assets/icon/fourthToolList/AIprogram.png" alt />
 
-                                <div>AI平台</div>
 
+                                <div>AI Blockly</div>
 
                               </div>
 
                               <div v-if="item3.tool == 25">
 
                                 <img src="../../assets/icon/thirdToolList/evalua.png" alt />
 
@@ -278,7 +278,7 @@
 
                               </div>
 
                               <div v-if="item3.tool == 41">
 
                                 <img src="../../assets/icon/thirdToolList/select.png" alt />
 
-                                <div>选择填空</div>
 
+                                <div>选择匹配</div>
 
                               </div>
 
                               <div v-if="item3.tool == 44">
 
                                 <img src="../../assets/icon/thirdToolList/hanClass.png" alt />
 
@@ -286,7 +286,7 @@
 
                               </div>
 
                               <div v-if="item3.tool == 47">
 
                                 <img src="../../assets/icon/fourthToolList/conSentences.png" alt />
 
-                                <div>连词成句</div>
 
+                                <div>排序</div>
 
                               </div>
 
                               <div v-if="item3.tool == 48">
 
                                 <img src="../../assets/icon/fourthToolList/table.png" alt />
 
@@ -419,16 +419,16 @@
 
                                     <div v-if="item3.tool == 4">问卷调查</div>
 
                                     <div v-if="item3.tool == 45">选择题</div>
 
                                     <div v-if="item3.tool == 10">倒计时</div>
 
-                                    <div v-if="item3.tool == 15">问答工具</div>
 
+                                    <div v-if="item3.tool == 15">问答</div>
 
                                     <div v-if="item3.tool == 26">课程设计</div>
 
                                     <div v-if="item3.tool == 18">
 
                                       训练服务器
 
                                     </div>
 
                                     <div v-if="item3.tool == 16">作业提交</div>
 
-                                    <div v-if="item3.tool == 21">编程平台</div>
 
+                                    <div v-if="item3.tool == 21">AIoT Blockly</div>
 
                                     <div v-if="item3.tool == 22">AI体验</div>
 
-                                    <div v-if="item3.tool == 23">Python</div>
 
-                                    <div v-if="item3.tool == 24">AI平台</div>
 
+                                    <div v-if="item3.tool == 23">AI Python</div>
 
+                                    <div v-if="item3.tool == 24">AI Blockly</div>
 
                                     <div v-if="item3.tool == 25">目标管理</div>
 
                                     <div v-if="item3.tool == 31">数学画板</div>
 
                                     <div v-if="item3.tool == 28">翻译</div>
 
@@ -437,9 +437,9 @@
 
                                     <div v-if="item3.tool == 39">GeoGebra</div>
 
                                     <div v-if="item3.tool == 32">源码编辑</div>
 
                                     <div v-if="item3.tool == 40">学生评价</div>
 
-                                    <div v-if="item3.tool == 41">选择填空</div>
 
+                                    <div v-if="item3.tool == 41">选择匹配</div>
 
                                     <div v-if="item3.tool == 44">汉字宫</div>
 
-                                    <div v-if="item3.tool == 47">连词成句</div>
 
+                                    <div v-if="item3.tool == 47">排序</div>
 
                                     <div v-if="item3.tool == 48">表格</div>
 
                                     <div v-if="item3.tool == 49">学生分组</div>
 
                                     <div v-if="item3.tool == 50">批量上传</div>

+ 13 - 13
src/components/noTerminal/studyStudent.vue
查看文件 

@@ -482,7 +482,7 @@
 
                           <div v-if="tooC == 15">
 
                             <img @click="addTools(tooC, toolIndex, taskCount)"
 
                               src="../../assets/icon/thirdToolList/answer.png" alt />
 
-                            <div style="margin: 5px 0">问答工具</div>
 
+                            <div style="margin: 5px 0">问答</div>
 
                           </div>
 
                           <div v-if="tooC == 26">
 
                             <img @click="addTools(tooC, toolIndex, taskCount)"
 
@@ -507,7 +507,7 @@
 
                           <div v-if="tooC == 21">
 
                             <img @click="addTools(tooC, toolIndex, taskCount)"
 
                               src="../../assets/icon/fourthToolList/program.png" alt />
 
-                            <div style="margin: 5px 0">编程平台</div>
 
+                            <div style="margin: 5px 0">AIoT Blockly</div>
 
                           </div>
 
                           <div v-if="tooC == 22">
 
                             <img @click="addTools(tooC, toolIndex, taskCount)"
 
@@ -517,12 +517,12 @@
 
                           <div v-if="tooC == 23">
 
                             <img @click="addTools(tooC, toolIndex, taskCount)"
 
                               src="../../assets/icon/fourthToolList/program.png" alt />
 
-                            <div style="margin: 5px 0">Python</div>
 
+                            <div style="margin: 5px 0">AI Python</div>
 
                           </div>
 
                           <div v-if="tooC == 24">
 
                             <img @click="addTools(tooC, toolIndex, taskCount)"
 
                               src="../../assets/icon/fourthToolList/AIprogram.png" alt />
 
-                            <div style="margin: 5px 0">AI平台</div>
 
+                            <div style="margin: 5px 0">AI Blockly</div>
 
                           </div>
 
                           <div v-if="tooC == 25">
 
                             <img @click="addTools(tooC, toolIndex, taskCount)"
 
@@ -573,7 +573,7 @@
 
                           <div v-if="tooC == 41">
 
                             <img @click="addTools(tooC, toolIndex, taskCount)"
 
                               src="../../assets/icon/thirdToolList/select.png" alt />
 
-                            <div style="margin: 5px 0">选择填空</div>
 
+                            <div style="margin: 5px 0">选择匹配</div>
 
                           </div>
 
                           <div v-if="tooC == 44">
 
                             <img @click="addTools(tooC, toolIndex, taskCount)"
 
@@ -583,7 +583,7 @@
 
                           <div v-if="tooC == 47">
 
                             <img @click="addTools(tooC, toolIndex, taskCount)"
 
                               src="../../assets/icon/fourthToolList/conSentences.png" alt />
 
-                            <div style="margin: 5px 0">连词成句</div>
 
+                            <div style="margin: 5px 0">排序</div>
 
                           </div>
 
                           <div v-if="tooC == 48">
 
                             <img @click="addTools(tooC, toolIndex, taskCount)"
 
@@ -4167,12 +4167,12 @@
 
         <el-button type="primary" @click="addBzWorksTeacher" v-if="!isStar">确 定</el-button>
 
       </div>
 
     </el-dialog>
 
-    <el-dialog title="选择填空" :visible.sync="dialogVisibleSelect" :append-to-body="true" width="90%"
 
+    <el-dialog title="选择匹配" :visible.sync="dialogVisibleSelect" :append-to-body="true" width="90%"
 
       :before-close="handleClose" class="dialog_diy dialog_diy3">
 
       <div v-if="selectJson">
 
         <div class="select_box2">
 
           <div class="select_box2_title">
 
-            <div>选择填空</div>
 
+            <div>选择匹配</div>
 
             <div>请选择对应的答案进行答题！</div>
 
           </div>
 
           <div class="select_box2_box">
 
@@ -4219,7 +4219,7 @@
 
         </div>
 
       </div>
 
     </el-dialog>
 
-    <el-dialog title="选择填空" :visible.sync="dialogVisibleSelectTeacher" :append-to-body="true" width="90%"
 
+    <el-dialog title="选择匹配" :visible.sync="dialogVisibleSelectTeacher" :append-to-body="true" width="90%"
 
       :before-close="handleClose" class="dialog_diy dialog_diy3">
 
       <div v-if="selectJson">
 
         <div class="w_name">
 
@@ -4227,7 +4227,7 @@
 
         </div>
 
         <div class="select_box2">
 
           <div class="select_box2_title">
 
-            <div>选择填空</div>
 
+            <div>选择匹配</div>
 
             <div>请选择对应的答案进行答题！</div>
 
           </div>
 
           <div class="select_box2_box">
 
@@ -4330,7 +4330,7 @@
 
         </el-button>
 
       </span>
 
     </el-dialog>
 
-    <el-dialog title="连词成句" :visible.sync="dialogVisibleSentence" :append-to-body="true" width="1000px"
 
+    <el-dialog title="排序" :visible.sync="dialogVisibleSentence" :append-to-body="true" width="1000px"
 
       :before-close="handleClose" class="dialog_diy dialog_diy3">
 
       <div>
 
         <div class="sentenBox">
 
@@ -4378,7 +4378,7 @@
 
         <el-button type="primary" @click="addSenWorks">确 定</el-button>
 
       </span>
 
     </el-dialog>
 
-    <el-dialog title="连词成句" :visible.sync="dialogVisibleSentenceTeacher" :append-to-body="true" width="1000px"
 
+    <el-dialog title="排序" :visible.sync="dialogVisibleSentenceTeacher" :append-to-body="true" width="1000px"
 
       :before-close="handleClose" class="dialog_diy dialog_diy3">
 
       <div>
 
         <div class="w_name">
 
@@ -4429,7 +4429,7 @@
 
         <el-button type="primary" @click="addSenWorksTeacher">确 定</el-button>
 
       </span>
 
     </el-dialog>
 
-    <el-dialog title="连词成句" :visible.sync="dialogVisibleSentence1" :append-to-body="true" width="1000px"
 
+    <el-dialog title="排序" :visible.sync="dialogVisibleSentence1" :append-to-body="true" width="1000px"
 
       :before-close="handleClose" class="dialog_diy dialog_diy3">
 
       <div>
 
         <div class="sentenBox">

+ 4 - 3
src/components/student/courseDetail.vue
查看文件 

@@ -651,12 +651,12 @@ export default {
 
 }
 
 
 .sLeft {
 
-  width: 14%;
 
+  width: 260px;
 
   margin-right: 10px;
 
   background: rgb(255, 255, 255);
 
   padding: 20px 15px 0 15px;
 
   box-sizing: border-box;
 
-  border-radius: 10px;
 
+  border-radius: 12px;
 
 }
 
 
 .courseT {
 
@@ -695,7 +695,7 @@ export default {
 
 
 .rightTd,
 
 .noBRight {
 
-  width: 84%;
 
+  width: calc(100% - 270px);
 
   background: #fff;
 
   display: flex;
 
   flex-direction: row;
 
@@ -703,6 +703,7 @@ export default {
 
   align-content: flex-start;
 
   align-items: center;
 
   justify-content: flex-start;
 
+  border-radius: 12px;
 
 }
 
 
 .noBRight {

+ 167 - 23
src/components/student/studyStudent.vue
查看文件 

@@ -264,6 +264,15 @@
 
                       security="restricted"
 
                       sandbox="allow-top-navigation allow-same-origin allow-forms allow-scripts"></iframe>
 
                   </div>
 
+                  <div class="wheel" v-if="chapterlist[chapterIndex].type == 13"
 
+                    style="height: 650px; width: 95%; margin: 0 auto">
 
+                    <el-image
 
+                      :src="chapterlist[chapterIndex].url"
 
+                      fit="contain"
 
+                      style="width: 100%; height: 100%; cursor: pointer"
 
+                       @click="previewImg(chapterlist[chapterIndex].url)"
 
+                     ></el-image>
 
+                  </div>
 
                   <div class="wheel" v-if="chapterlist[chapterIndex].type == 9"
 
                     style="height: 650px; width: 95%; margin: 0 auto">
 
                     <pdf :pdfUrl="chapterlist[chapterIndex].src" style="width: 100%; height: 100%; overflow: auto">
 
@@ -383,7 +392,7 @@
 
                           <div v-if="tool.tool == 15">
 
                             <img @click="addTools(tool.tool, toolIndex, taskCount)"
 
                               src="../../assets/icon/thirdToolList/answer.png" alt />
 
-                            <div style="margin: 5px 0">问答工具</div>
 
+                            <div style="margin: 5px 0">问答</div>
 
                           </div>
 
                           <div v-if="tool.tool == 26">
 
                             <img @click="addTools(tool.tool, toolIndex, taskCount)"
 
@@ -403,7 +412,7 @@
 
                           <div v-if="tool.tool == 21">
 
                             <img @click="addTools(tool.tool, toolIndex, taskCount)"
 
                               src="../../assets/icon/fourthToolList/program.png" alt />
 
-                            <div style="margin: 5px 0">编程平台</div>
 
+                            <div style="margin: 5px 0">AIoT Blockly</div>
 
                           </div>
 
                           <div v-if="tool.tool == 22">
 
                             <img @click="addTools(tool.tool, toolIndex, taskCount)"
 
@@ -413,12 +422,12 @@
 
                           <div v-if="tool.tool == 23">
 
                             <img @click="addTools(tool.tool, toolIndex, taskCount)"
 
                               src="../../assets/icon/fourthToolList/program.png" alt />
 
-                            <div style="margin: 5px 0">Python</div>
 
+                            <div style="margin: 5px 0">AI Python</div>
 
                           </div>
 
                           <div v-if="tool.tool == 24">
 
                             <img @click="addTools(tool.tool, toolIndex, taskCount)"
 
                               src="../../assets/icon/fourthToolList/AIprogram.png" alt />
 
-                            <div style="margin: 5px 0">AI平台</div>
 
+                            <div style="margin: 5px 0">AI Blockly</div>
 
                           </div>
 
                           <div v-if="tool.tool == 25">
 
                             <img @click="addTools(tool.tool, toolIndex, taskCount)"
 
@@ -463,7 +472,7 @@
 
                           <div v-if="tool.tool == 41">
 
                             <img @click="addTools(tool.tool, toolIndex, taskCount)"
 
                               src="../../assets/icon/thirdToolList/select.png" alt />
 
-                            <div style="margin: 5px 0">选择填空</div>
 
+                            <div style="margin: 5px 0">选择匹配</div>
 
                           </div>
 
                           <div v-if="tool.tool == 44">
 
                             <img @click="addTools(tool.tool, toolIndex, taskCount)"
 
@@ -473,7 +482,7 @@
 
                           <div v-if="tool.tool == 47">
 
                             <img @click="addTools(tool.tool, toolIndex, taskCount)"
 
                               src="../../assets/icon/fourthToolList/conSentences.png" alt />
 
-                            <div style="margin: 5px 0">连词成句</div>
 
+                            <div style="margin: 5px 0">排序</div>
 
                           </div>
 
                           <div v-if="tool.tool == 48">
 
                             <img @click="addTools(tool.tool, toolIndex, taskCount)"
 
@@ -532,7 +541,7 @@
 
                   </div>
 
                   <div v-if="tool.tool == 51" style="margin-top: 20px">
 
                     <div class="vedioTaskBox">
 
-                      <div class="box_course" :class="'box_course' + toolIndex" v-if="tool.toolData.length > 0">
 
+                      <div class="box_course" :class="'box_course' + toolIndex" v-if="tool.toolData.length > 0 && !tool.isNoFile">
 
                         <div class="wheel" v-if="tool.toolData[tool.sourceIndex].type == 2">
 
                           <div class="workd_media" style="height: 100%">
 
                             <video-player class="video-player vjs-custom-skin" :playsinline="true"
 
@@ -567,6 +576,15 @@
 
                             :src="tool.toolData[tool.sourceIndex].src" security="restricted"
 
                       sandbox="allow-top-navigation allow-same-origin allow-forms allow-scripts"></iframe>
 
                         </div>
 
+                        <div class="wheel" v-if="tool.toolData[tool.sourceIndex].type == 13"
 
+                          style="height: 650px; width: 98%">
 
+                          <el-image
 
+                            :src="tool.toolData[tool.sourceIndex].url"
 
+                            fit="contain"
 
+                            style="width: 100%; height: 100%; cursor: pointer"
 
+                            @click="previewImg(tool.toolData[tool.sourceIndex].url)"
 
+                          ></el-image>
 
+                        </div>
 
                         <div class="wheel" v-if="tool.toolData[tool.sourceIndex].type == 9"
 
                           style="height: 650px; width: 98%">
 
                           <pdf :pdfUrl="tool.toolData[tool.sourceIndex].url"
 
@@ -641,6 +659,11 @@
 
         </div> -->
 
         <div class="checkbox">
 
           <div class="check" style="font-size: 25px">评论</div>
 
+          <el-select v-model="pzStype" @change="selectPz" class="selectBox">
 
+            <el-option label="时间降序" :value="1"></el-option>
 
+            <el-option label="时间升序" :value="2"></el-option>
 
+            <el-option label="我的评课" :value="3"></el-option>
 
+          </el-select>
 
           <img src="../../assets/pzBtn.png" @click="(pzDialog = false), setVHeight()" alt="" />
 
         </div>
 
       </div>
 
@@ -768,7 +791,7 @@
 
         </div>
 
       </div>
 
     </div>
 
-    <div v-if="addPzDialog == true" class="addDialogCss">
 
+    <div v-if="addPzDialog == true" class="addDialogCss" v-el-drag-dialog>
 
       <div class="pzTop">
 
         <div class="teacherPz">
 
           <div class="teacherPzImg">
 
@@ -777,7 +800,7 @@
 
           <div style="margin-left: 10px; height: 25px">教师批注</div>
 
         </div>
 
         <div @click="addPzDialog = false">
 
-          <img src="../../assets/close1.png" alt="" />
 
+          <img src="../../assets/close1.png" class="pzClose" alt="" />
 
         </div>
 
       </div>
 
       <div class="addPzBox">
 
@@ -1215,7 +1238,8 @@ export default {
 
       },
 
       psJson4: {
 
         z: 0,
 
-      }
 
+      },
 
+      pzStype:1,
 
     };
 
   },
 
   methods: {
 
@@ -1373,9 +1397,11 @@ export default {
 
         cid: this.id,
 
         s: this.courseType,
 
         t: this.taskCount,
 
+        type: this.pzStype,
 
+        uid: this.userid,
 
       };
 
       this.ajax
 
-        .get(this.$store.state.api + "selectPzList", params)
 
+        .get(this.$store.state.api + "selectPzListType", params)
 
         .then((res) => {
 
           this.pzList = res.data[0];
 
         })
 
@@ -1768,7 +1794,7 @@ export default {
 
                       } else if (_tool.tool == 6) {
 
                         _work.workContent = `${_work.username}使用协同文档提交了：`;
 
                       } else if (_tool.tool == 15) {
 
-                        _work.workContent = `${_work.username}使用问答工具提交了：`;
 
+                        _work.workContent = `${_work.username}使用问答提交了：`;
 
                       } else if (_tool.tool == 53) {
 
                         _work.workContent = `${_work.username}使用文件上传提交了：`;
 
                       } else if (_tool.tool == 54) {
 
@@ -1855,7 +1881,14 @@ export default {
 
                   }
 
 
                   if (_tool.tool == 51) {
 
-                    _tool.sourceIndex = 0;
 
+                    let ic = 0
 
+                    for(let ci = 0; ci < _tool.toolData.length; ci++){
 
+                      if(_tool.toolData[ci].type != 12){
 
+                        ic = ci
 
+                        break;
 
+                      }
 
+                    }
 
+                    _tool.sourceIndex = ic;
 
                   }
 
                 }
 
               }
 
@@ -1887,6 +1920,7 @@ export default {
 
                       _work.tool == z &&
 
                       _work.atool == _tool.tool
 
                     ) {
 
+                      // “${_work.name ? _work.name : this.setTime(_work.create_at)}”
 
                       if (_tool.tool == 1) {
 
                         _work.workContent = `${_work.username}使用电子白板提交了：`;
 
                       } else if (_tool.tool == 3) {
 
@@ -1894,7 +1928,7 @@ export default {
 
                       } else if (_tool.tool == 6) {
 
                         _work.workContent = `${_work.username}使用协同文档提交了：`;
 
                       } else if (_tool.tool == 15) {
 
-                        _work.workContent = `${_work.username}使用问答工具提交了：`;
 
+                        _work.workContent = `${_work.username}使用问答提交了：`;
 
                       } else if (_tool.tool == 53) {
 
                         _work.workContent = `${_work.username}使用文件上传提交了：`;
 
                       } else if (_tool.tool == 54) {
 
@@ -1952,6 +1986,7 @@ export default {
 
                       }
 
                     }
 
                   }
 
+                  // “${_tool.toolPhoto[0].name ? _tool.toolPhoto[0].name : this.setTime(_tool.toolPhoto[0].create_at)}”
 
                   if (_tool.tool == 48) {
 
                     _tool.toolPhoto.length &&
 
                       (_tool.toolPhoto[0].workContent = `${_tool.people.join(
 
@@ -2657,6 +2692,10 @@ export default {
 
       this.dialogVisible5 = true;
 
     },
 
     setChapterIndex2(tool, index, toolIndex) {
 
+      if(tool.toolData[index].type == 12){
 
+        this.downloadFile2(tool.toolData[index])
 
+        return;
 
+      }
 
       tool.sourceIndex = index;
 
       this.$nextTick(function () {
 
         setTimeout(() => {
 
@@ -2669,6 +2708,53 @@ export default {
 
       });
 
       this.$forceUpdate();
 
     },
 
+    downloadFile2(f) {
 
+      const loading = this.$loading.service({
 
+        background: "rgba(255, 255, 255, 0.7)",
 
+        target: document.body,
 
+        text: "文件加载中...",
 
+      });
 
+      let url2 = f.url;
 
+      let _url2 = "";
 
+      if (
 
+        url2.indexOf("https://view.officeapps.live.com/op/view.aspx?src=") != -1
 
+      ) {
 
+        _url2 = url2.split(
 
+          "https://view.officeapps.live.com/op/view.aspx?src="
 
+        )[1];
 
+      } else {
 
+        _url2 = url2;
 
+      }
 
+      let params = {
 
+        url: _url2,
 
+        name: f.name,
 
+      };
 
+      this.ajax
 
+        .get(this.$store.state.api + "download", params)
 
+        .then((res) => {
 
+          loading.close();
 
+          let content = res.data.data.data;
 
+          let ab = new ArrayBuffer(content.length);
 
+          let view = new Uint8Array(ab);
 
+          for (var i = 0; i < content.length; ++i) {
 
+            view[i] = content[i];
 
+          }
 
+          let elink = document.createElement("a");
 
+          elink.download = f.name;
 
+          elink.style.display = "none";
 
+          let blob = new Blob([ab], {
 
+            type: res.data.response.headers["content-type"] + ";charset=UTF-8",
 
+          });
 
+          elink.href = URL.createObjectURL(blob);
 
+          document.body.appendChild(elink);
 
+          elink.click();
 
+          document.body.removeChild(elink);
 
+        })
 
+        .catch((err) => {
 
+          loading.close();
 
+          console.error(err);
 
+        });
 
+    },
 
     setVHeight() {
 
       this.$nextTick(function () {
 
         setTimeout(() => {
 
@@ -2679,10 +2765,37 @@ export default {
 
           for (var z = 0; z < tool.length; z++) {
 
             let _tool = tool[z];
 
             if (_tool.tool == 51) {
 
-              var a = document.getElementsByClassName("box_course" + z)[0]
 
-                .offsetHeight;
 
-              document.getElementsByClassName("vedioList" + z)[0].style.height =
 
-                a + "px";
 
+                let ci = 0
 
+                for(var li = 0;li<_tool.toolData.length;li++){
 
+                  if(_tool.toolData[li].type != 12){
 
+                    ci++
 
+                  }
 
+                }
 
+
 
+                if(ci == 0){
 
+                  _tool.isNoFile = true;
 
+                  document.getElementsByClassName(
 
+                    "vedioList" + z
 
+                  )[0].style.height = 650 + "px";
 
+                  document.getElementsByClassName(
 
+                    "vedioList" + z
 
+                  )[0].style.width = "100%";
 
+                }else{
 
+                  _tool.isNoFile = false;
 
+                  var a = document.getElementsByClassName("box_course" + z)[0] ? document.getElementsByClassName("box_course" + z)[0]
 
+                  .offsetHeight : 650;
 
+                  document.getElementsByClassName(
 
+                    "vedioList" + z
 
+                  )[0].style.height = a + "px";
 
+                  document.getElementsByClassName(
 
+                    "vedioList" + z
 
+                  )[0].style.width = "calc(100% - 83%)";
 
+                }
 
+                this.$forceUpdate();
 
+              // var a = document.getElementsByClassName("box_course" + z)[0]
 
+              //   .offsetHeight;
 
+              // document.getElementsByClassName("vedioList" + z)[0].style.height =
 
+              //   a + "px";
 
             }
 
           }
 
         }, 0);
 
@@ -2755,6 +2868,21 @@ export default {
 
         return s2;
 
       };
 
     },
 
+    setTime() {
 
+      return function (timeA) {
 
+        var time = new Date(timeA);
 
+        time.setTime(time.getTime());
 
+        var s2 =
 
+          time.getFullYear() +
 
+          "." +
 
+          (time.getMonth() + 1 < 10
 
+            ? "0" + (time.getMonth() + 1)
 
+            : time.getMonth() + 1) +
 
+          "." +
 
+          (time.getDate() < 10 ? "0" + time.getDate() : time.getDate());
 
+        return s2;
 
+      };
 
+    },
 
     getMan() {
 
       return function (people) {
 
         let _people = "";
 
@@ -5027,6 +5155,7 @@ export default {
 
   justify-content: space-between;
 
   height: 40px;
 
   border-radius: 15px 15px 0 0;
 
+  user-select: none;
 
 }
 
 
 .pzTop2 .checkbox {
 
@@ -5229,15 +5358,15 @@ export default {
 
 
 .addDialogCss {
 
   position: fixed;
 
-  right: 37%;
 
-  top: 50%;
 
   width: 600px;
 
-  transform: translateY(-50%);
 
   height: 70%;
 
   min-height: 450px;
 
   box-shadow: 0px 0 8px 0px #555555;
 
   border-radius: 15px;
 
   z-index: 999;
 
+  left: 50%;
 
+  top: 50%;
 
+  margin:-18% 0 0 -300px;
 
 }
 
 
 .teacherPz {
 
@@ -5380,8 +5509,8 @@ export default {
 
 /* code 样式 */
 
 .cont>>>code {
 
   display: inline-block;
 
-  *display: inline;
 
-  *zoom: 1;
 
+  /* *display: inline; */
 
+  zoom: 1;
 
   background-color: #f1f1f1;
 
   border-radius: 3px;
 
   padding: 3px 5px;
 
@@ -5983,4 +6112,19 @@ ol {
 
 .tcMember+.tcMember::before {
 
   content: "、";
 
 }
 
+
 
+.selectBox {
 
+  width: 110px;
 
+  margin-left: 10px;
 
+  margin: 0 10px 0 auto;
 
+}
 
+
 
+.selectBox>>>.el-input__inner {
 
+  height: 30px;
 
+  line-height: 30px;
 
+}
 
+
 
+.selectBox>>>.el-input__icon {
 
+  line-height: 30px;
 
+}
 
 </style>

+ 41 - 17
src/components/studio/studyStudent.vue
查看文件 

@@ -386,7 +386,7 @@
 
                           <div v-if="tool.tool == 15">
 
                             <img @click="addTools(tool.tool, toolIndex, taskCount)"
 
                               src="../../assets/icon/thirdToolList/answer.png" alt />
 
-                            <div style="margin: 5px 0">问答工具</div>
 
+                            <div style="margin: 5px 0">问答</div>
 
                           </div>
 
                           <div v-if="tool.tool == 26">
 
                             <img @click="addTools(tool.tool, toolIndex, taskCount)"
 
@@ -406,7 +406,7 @@
 
                           <div v-if="tool.tool == 21">
 
                             <img @click="addTools(tool.tool, toolIndex, taskCount)"
 
                               src="../../assets/icon/fourthToolList/program.png" alt />
 
-                            <div style="margin: 5px 0">编程平台</div>
 
+                            <div style="margin: 5px 0">AIoT Blockly</div>
 
                           </div>
 
                           <div v-if="tool.tool == 22">
 
                             <img @click="addTools(tool.tool, toolIndex, taskCount)"
 
@@ -416,12 +416,12 @@
 
                           <div v-if="tool.tool == 23">
 
                             <img @click="addTools(tool.tool, toolIndex, taskCount)"
 
                               src="../../assets/icon/fourthToolList/program.png" alt />
 
-                            <div style="margin: 5px 0">Python</div>
 
+                            <div style="margin: 5px 0">AI Python</div>
 
                           </div>
 
                           <div v-if="tool.tool == 24">
 
                             <img @click="addTools(tool.tool, toolIndex, taskCount)"
 
                               src="../../assets/icon/fourthToolList/AIprogram.png" alt />
 
-                            <div style="margin: 5px 0">AI平台</div>
 
+                            <div style="margin: 5px 0">AI Blockly</div>
 
                           </div>
 
                           <div v-if="tool.tool == 25">
 
                             <img @click="addTools(tool.tool, toolIndex, taskCount)"
 
@@ -466,7 +466,7 @@
 
                           <div v-if="tool.tool == 41">
 
                             <img @click="addTools(tool.tool, toolIndex, taskCount)"
 
                               src="../../assets/icon/thirdToolList/select.png" alt />
 
-                            <div style="margin: 5px 0">选择填空</div>
 
+                            <div style="margin: 5px 0">选择匹配</div>
 
                           </div>
 
                           <div v-if="tool.tool == 44">
 
                             <img @click="addTools(tool.tool, toolIndex, taskCount)"
 
@@ -476,7 +476,7 @@
 
                           <div v-if="tool.tool == 47">
 
                             <img @click="addTools(tool.tool, toolIndex, taskCount)"
 
                               src="../../assets/icon/fourthToolList/conSentences.png" alt />
 
-                            <div style="margin: 5px 0">连词成句</div>
 
+                            <div style="margin: 5px 0">排序</div>
 
                           </div>
 
                           <div v-if="tool.tool == 48">
 
                             <img @click="addTools(tool.tool, toolIndex, taskCount)"
 
@@ -644,6 +644,11 @@
 
         </div> -->
 
         <div class="checkbox">
 
           <div class="check" style="font-size: 25px">评论</div>
 
+          <el-select v-model="pzStype" @change="selectPz" class="selectBox">
 
+            <el-option label="时间降序" :value="1"></el-option>
 
+            <el-option label="时间升序" :value="2"></el-option>
 
+            <el-option label="我的评课" :value="3"></el-option>
 
+          </el-select>
 
           <img src="../../assets/pzBtn.png" @click="(pzDialog = false), setVHeight()" alt="" />
 
         </div>
 
       </div>
 
@@ -772,7 +777,7 @@
 
         </div>
 
       </div>
 
     </div>
 
-    <div v-if="addPzDialog == true" class="addDialogCss">
 
+    <div v-if="addPzDialog == true" class="addDialogCss" v-el-drag-dialog>
 
       <div class="pzTop">
 
         <div class="teacherPz">
 
           <div class="teacherPzImg">
 
@@ -781,7 +786,7 @@
 
           <div style="margin-left: 10px; height: 25px">教师批注</div>
 
         </div>
 
         <div @click="addPzDialog = false">
 
-          <img src="../../assets/close1.png" alt="" />
 
+          <img src="../../assets/close1.png" class="pzClose" alt="" />
 
         </div>
 
       </div>
 
       <div class="addPzBox">
 
@@ -1219,7 +1224,8 @@ export default {
 
       },
 
       psJson4: {
 
         z: 0,
 
-      }
 
+      },
 
+      pzStype:1,
 
     };
 
   },
 
   methods: {
 
@@ -1377,9 +1383,11 @@ export default {
 
         cid: this.id,
 
         s: this.courseType,
 
         t: this.taskCount,
 
+        type: this.pzStype,
 
+        uid: this.userid,
 
       };
 
       this.ajax
 
-        .get(this.$store.state.api + "selectPzList", params)
 
+        .get(this.$store.state.api + "selectPzListType", params)
 
         .then((res) => {
 
           this.pzList = res.data[0];
 
         })
 
@@ -1772,7 +1780,7 @@ export default {
 
                       } else if (_tool.tool == 6) {
 
                         _work.workContent = `${_work.username}使用协同文档提交了：`;
 
                       } else if (_tool.tool == 15) {
 
-                        _work.workContent = `${_work.username}使用问答工具提交了：`;
 
+                        _work.workContent = `${_work.username}使用问答提交了：`;
 
                       } else if (_tool.tool == 53) {
 
                         _work.workContent = `${_work.username}使用文件上传提交了：`;
 
                       } else if (_tool.tool == 54) {
 
@@ -1898,7 +1906,7 @@ export default {
 
                       } else if (_tool.tool == 6) {
 
                         _work.workContent = `${_work.username}使用协同文档提交了：`;
 
                       } else if (_tool.tool == 15) {
 
-                        _work.workContent = `${_work.username}使用问答工具提交了：`;
 
+                        _work.workContent = `${_work.username}使用问答提交了：`;
 
                       } else if (_tool.tool == 53) {
 
                         _work.workContent = `${_work.username}使用文件上传提交了：`;
 
                       } else if (_tool.tool == 54) {
 
@@ -5031,6 +5039,7 @@ export default {
 
   justify-content: space-between;
 
   height: 40px;
 
   border-radius: 15px 15px 0 0;
 
+  user-select: none;
 
 }
 
 
 .pzTop2 .checkbox {
 
@@ -5234,15 +5243,15 @@ export default {
 
 
 .addDialogCss {
 
   position: fixed;
 
-  right: 37%;
 
-  top: 50%;
 
   width: 600px;
 
-  transform: translateY(-50%);
 
   height: 70%;
 
   min-height: 450px;
 
   box-shadow: 0px 0 8px 0px #555555;
 
   border-radius: 15px;
 
   z-index: 999;
 
+  left: 50%;
 
+  top: 50%;
 
+  margin:-18% 0 0 -300px;
 
 }
 
 
 .teacherPz {
 
@@ -5385,8 +5394,8 @@ export default {
 
 /* code 样式 */
 
 .cont>>>code {
 
   display: inline-block;
 
-  *display: inline;
 
-  *zoom: 1;
 
+  /* *display: inline; */
 
+  zoom: 1;
 
   background-color: #f1f1f1;
 
   border-radius: 3px;
 
   padding: 3px 5px;
 
@@ -5988,4 +5997,19 @@ ol {
 
 .tcMember+.tcMember::before {
 
   content: "、";
 
 }
 
+
 
+.selectBox {
 
+  width: 110px;
 
+  margin-left: 10px;
 
+  margin: 0 10px 0 auto;
 
+}
 
+
 
+.selectBox>>>.el-input__inner {
 
+  height: 30px;
 
+  line-height: 30px;
 
+}
 
+
 
+.selectBox>>>.el-input__icon {
 
+  line-height: 30px;
 
+}
 
 </style>

+ 9 - 9
src/components/study.vue
查看文件 

@@ -900,7 +900,7 @@
 
                               </div> -->
 
                             </div>
 
                             <div v-if="tooC == 15">
 
-                              <div class="iframeName">问答工具</div>
 
+                              <div class="iframeName">问答</div>
 
                               <div>
 
                                 <div
 
                                   style="
 
@@ -980,9 +980,9 @@
 
                                 alt
 
                               />
 
                               <div style="margin: 5px 0; padding-left: 8px">
 
-                                编程平台
 
+                                AIoT Blockly
 
                               </div>
 
-                              <!-- <div class="iframeName">编程平台</div>
 
+                              <!-- <div class="iframeName">AIoT Blockly</div>
 
                               <iframe src="https://x.cocorobo.cn" class="iframeCss"></iframe> -->
 
                             </div>
 
                             <div v-if="tooC == 22">
 
@@ -1008,7 +1008,7 @@
 
                                 alt
 
                               />
 
                               <div style="margin: 5px 0; padding-left: 8px">
 
-                                Python
 
+                                AI Python
 
                               </div>
 
                               <!-- <div class="iframeName">python</div>
 
                               <iframe src="https://python-blockly.cocorobo.cn/" class="iframeCss"></iframe> -->
 
@@ -1022,9 +1022,9 @@
 
                                 alt
 
                               />
 
                               <div style="margin: 5px 0; padding-left: 8px">
 
-                                AI平台
 
+                                AI Blockly
 
                               </div>
 
-                              <!-- <div class="iframeName">AI平台</div>
 
+                              <!-- <div class="iframeName">AI Blockly</div>
 
                               <iframe src="https://ai-blockly.cocorobo.cn/?lang=zh-hans" class="iframeCss"></iframe> -->
 
                             </div>
 
                             <div v-if="tooC == 40">
 
@@ -1048,7 +1048,7 @@
 
                                 alt
 
                               />
 
                               <div style="margin: 5px 0; padding-left: 8px">
 
-                                选择填空
 
+                                选择匹配
 
                               </div>
 
                             </div>
 
                             <div v-if="tooC == 44">
 
@@ -3183,7 +3183,7 @@
 
       </div>
 
     </el-dialog>
 
     <el-dialog
 
-      title="选择填空"
 
+      title="选择匹配"
 
       :visible.sync="dialogVisibleSelect"
 
       :append-to-body="true"
 
       width="90%"
 
@@ -3193,7 +3193,7 @@
 
       <div v-if="selectJson">
 
         <div class="select_box2">
 
           <div class="select_box2_title">
 
-            <div>选择填空</div>
 
+            <div>选择匹配</div>
 
             <div>请选择对应的答案进行答题！</div>
 
           </div>
 
           <div class="select_box2_box">

File diff suppressed because it is too large
+ 207 - 965
src/components/studyStudent.vue


+ 0 - 0
src/components/tools/hevue-img-preview/LICENSE
查看文件


+ 133 - 0
src/components/tools/hevue-img-preview/README.md
查看文件 

@@ -0,0 +1,133 @@
 
+## hevue-img-preview 简介
 
+
 
+
 
+[![](https://img.shields.io/npm/dm/hevue-img-preview.svg)](https://www.npmjs.com/package/hevue-img-preview)
 
+[![](https://img.shields.io/github/v/release/heyongsheng/hevue-img-preview)](https://www.npmjs.com/package/hevue-img-preview)
 
+[![](https://img.shields.io/badge/License-MIT-green)](https://www.npmjs.com/package/hevue-img-preview)
 
+
 
+> 本组件是一个基于 vue 编写的 vue 图片预览组件，支持 pc 和手机端，支持单图和多图预览，仅传入一个图片地址，即可实现图片预览效果。手机端支持单指拖拽和双指缩放。如果能帮上你，希望可以移步 [GitHub](https://github.com/heyongsheng/hevue-img-preview) ，或者[码云](https://gitee.com/ihope_top/hevue-img-preview) 给个小星星，如果有任何使用意见或建议，也欢迎回复或者提交 issue
 
+
 
+## 官方文档
 
+
 
+> 官方使用文档请访问 [https://heyongsheng.github.io/#/](https://heyongsheng.github.io/#/)
 
+
 
+## 安装
 
+
 
+使用npm进行安装
 
+``` bash
 
+npm install hevue-img-preview
 
+```
 
+
 
+在main.js进行全局引入
 
+```javascript
 
+import hevueImgPreview from 'hevue-img-preview'
 
+Vue.use(hevueImgPreview)
 
+```
 
+
 
+在组件中进行使用
 
+```html
 
+<img :src="url" @click="previewImg(url)">
 
+```
 
+```javascript
 
+methods: {
 
+	previewImg (url) {
 
+		this.$hevueImgPreview(url)
 
+	}
 
+}
 
+```
 
+
 
+## 使用
 
+
 
+> this.\$hevueImgPreview() 方法可以接收一个字符串类型的 url，或者对象类型的配置，具体使用方法如下
 
+
 
+- 接收一个地址字符串`this.$hevueImgPreview(url)`
 
+
 
+```Javascript
 
+this.$hevueImgPreview('https://fuss10.elemecdn.com/8/27/f01c15bb73e1ef3793e64e6b7bbccjpeg.jpeg') // 线上地址
 
+this.$hevueImgPreview('./img/logo.jpeg') // 本地地址
 
+```
 
+
 
+- 接收一个对象`this.$hevueImgPreview(options)`
 
+
 
+```Javascript
 
+# 单图预览
 
+this.$hevueImgPreview({
 
+    url: 'https://fuss10.elemecdn.com/8/27/f01c15bb73e1ef3793e64e6b7bbccjpeg.jpeg',
 
+})
 
+
 
+# 多图预览
 
+this.$hevueImgPreview({
 
+    multiple: true, // 开启多图预览模式
 
+    nowImgIndex: 1, // 多图预览，默认展示第二张图片
 
+    imgList: ['1.png', '2.png', '3.png'], // 需要预览的多图数组
 
+})
 
+```
 
+
 
+### 配置项
 
+
 
+| 字段              | 类型    | 默认值               | 备注                           |
 
+| ----------------- | ------- | -------------------- | ------------------------------ |
 
+| url               | String  | 无                   | 预览的图片地址，多图预览时省略 |
 
+| multiple          | Boolean | false                | 是否多图预览                   |
 
+| nowImgIndex       | Number  | 0                    | 多图预览时默认显示的图片下标   |
 
+| imgList           | Array   | 无                   | 多图预览时传入的图片数组       |
 
+| keyboard          | Boolean | false                | 是否开启键盘控制               |
 
+| clickMaskCLose    | Boolean | false                | 是否可以点击遮罩层关闭         |
 
+| controlBar        | Boolean | true                 | 是否显示控制条及页码         |
 
+| closeBtn          | Boolean | true                 | 是否显示关闭按钮         |
 
+| arrowBtn          | Boolean | true                | 是否显示左右翻页按钮         |
 
+
 
+#### 全局配置
 
+
 
+对于某些配置，例如开启键盘事件，点击遮罩层关闭，我们可能要全局保持统一，但却需要在每一次调用时重复配置，为了解决这个问题，我们提供了全局配置项，您可以在引入插件的时候，将全局配置项作为第二个参数传入即可，以免再每次调用的时候重复配置。
 
+
 
+```javascript
 
+// main.js
 
+import hevueImgPreview from 'hevueImgPreview'
 
+Vue.use(hevueImgPreview, {
 
+  keyboard: true,
 
+  clickMaskCLose: true
 
+  ...
 
+})
 
+```
 
+
 
+
 
+如开启键盘控制事件后，相对应功能控制按键如下
 
+
 
+| 按键 | 功能
 
+| ----------------- | ----------------------------------------
 
+| w | 放大
 
+| s | 缩小
 
+| a | 上一张
 
+| d | 下一张
 
+| q | 逆时针旋转
 
+| e | 顺时针旋转
 
+| r | 图片复位
 
+| esc | 关闭图片预览
 
+
 
+*如不考虑兼容性问题，上述的背景颜色均可接收渐变色*
 
+
 
+## 更新日志
 
+
 
+### 5.0.2
 
+
 
+组件支持实例化，调用组件将返回组件实例，支持直接通过实例关闭弹窗
 
+```javascript
 
+const hevueImgPreviewEl = this.$hevueImgPreview(...)
 
+hevueImgPreviewEl.close()
 
+```
 
+
 
+## 作者注
 
+
 
+> 本人前端小白一枚，工作经验较少，所写东西尽量保证没 bug，但性能界面什么的可能没办法做到最优，如果您有什么使用中的建议或意见，欢迎反馈给我，可以加联系方式，也可以直接回复，或者到`GitHub`提个`issue`[建议此方法]，如果对您有所帮助，万分期待您能给个赞并且到`GitHub`给个小星星
 
+
 
+> GitHub 链接：[https://github.com/heyongsheng/hevue-img-preview](https://github.com/heyongsheng/hevue-img-preview)
 
+
 
+> 码云链接：[https://gitee.com/ihope_top/hevue-img-preview](https://gitee.com/ihope_top/hevue-img-preview)
 
+
 
+作者 QQ：1378431028
 
+
 
+QQ 群：595472617
 
+
 
+作者微信：heyongsheng1996
 
+![](https://p3-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/57478efc7ace4a8c9e27081a26f2c8cf~tplv-k3u1fbpfcp-zoom-1.image)

+ 131 - 0
src/components/tools/hevue-img-preview/css/default.css
查看文件 

@@ -0,0 +1,131 @@
 
+.hevue-imgpreview-wrap {
 
+  position: fixed;
 
+  top: 0;
 
+  bottom: 0;
 
+  right: 0;
 
+  left: 0;
 
+  user-select: none;
 
+  -moz-user-select: none;
 
+  -webkit-user-select: none;
 
+  -ms-user-select: none;
 
+  z-index: 9999;
 
+  color: rgba(255,255,255,.6);
 
+}
 
+.hevue-imgpreview-wrap .he-img-wrap {
 
+  width: 100%;
 
+  height: 100%;
 
+  text-align: center;
 
+  vertical-align: middle;
 
+  display: flex;
 
+  flex-direction: column;
 
+  justify-content: center;
 
+  align-items: center;
 
+  background: rgba(0, 0, 0, .3);
 
+}
 
+.hevue-imgpreview-wrap .he-img-view {
 
+  /* transition: transform 0.3s; */
 
+}
 
+.hevue-imgpreview-wrap .arrow {
 
+  width: 42px;
 
+  height: 42px;
 
+  text-align: center;
 
+  line-height: 42px;
 
+  position: absolute;
 
+  top: 50%;
 
+  border-radius: 50%;
 
+  transform: translateY(-50%);
 
+  -ms-transform: translateY(-50%);
 
+  font-size: 24px;
 
+  cursor: pointer;
 
+  transition: all 0.2s;
 
+  background: rgba(0,0,0,.3);
 
+}
 
+.hevue-imgpreview-wrap .arrow:hover {
 
+  opacity: 0.8;
 
+  transform: translateY(-50%) scale(1.2);
 
+}
 
+.hevue-imgpreview-wrap .arrow-left {
 
+  left: 50px;
 
+}
 
+.hevue-imgpreview-wrap .arrow-right {
 
+  right: 50px;
 
+}
 
+/* 关闭按钮 */
 
+.hevue-imgpreview-wrap .he-close-icon {
 
+  position: absolute;
 
+  right: 50px;
 
+  top: 50px;
 
+  width: 36px;
 
+  height: 36px;
 
+  font-size: 22px;
 
+  line-height: 36px;
 
+  text-align: center;
 
+  border-radius: 50%;
 
+  cursor: pointer;
 
+  transition: all 0.2s;
 
+  background: rgba(0,0,0,.3);
 
+}
 
+.hevue-imgpreview-wrap .he-close-icon:hover {
 
+  transform: rotate(90deg);
 
+}
 
+.hevue-imgpreview-wrap .he-control-bar-wrap {
 
+  display: flex;
 
+  position: absolute;
 
+  width: 100%;
 
+  bottom: 10%;
 
+  left: 0;
 
+}
 
+.hevue-imgpreview-wrap .he-control-bar {
 
+  height: 44px;
 
+  bottom: 10%;
 
+  padding: 0 22px;
 
+  display: flex;
 
+  border-radius: 22px;
 
+  margin: 0 auto;
 
+  background: rgba(0,0,0,.3);
 
+}
 
+.hevue-imgpreview-wrap .he-control-num {
 
+  position: absolute;
 
+  bottom: 5%;
 
+  left: 50%;
 
+  transform: translateX(-50%);
 
+  -ms-transform: translateX(-50%);
 
+  padding: 0 22px;
 
+  font-size: 16px;
 
+  border-radius: 15px;
 
+  background: rgba(0,0,0,.3);
 
+}
 
+.hevue-imgpreview-wrap .he-control-btn {
 
+  line-height: 44px;
 
+  font-size: 24px;
 
+  cursor: pointer;
 
+  padding: 0 9px;
 
+  /* display: inline-block; */
 
+  transition: all 0.2s;
 
+}
 
+.hevue-imgpreview-wrap .he-control-btn:hover {
 
+  transform: scale(1.2);
 
+}
 
+
 
+.hevue-imgpreview-wrap .fade-enter-active,
 
+.hevue-imgpreview-wrap .fade-leave-active {
 
+  transition: opacity 0.3s;
 
+}
 
+.hevue-imgpreview-wrap .fade-enter, .hevue-imgpreview-wrap .fade-leave-to /* .fade-leave-active below version 2.1.8 */ {
 
+  opacity: 0;
 
+}
 
+.hevue-imgpreview-wrap .hevue-img-status-icon {
 
+  font-size: 56px;
 
+}
 
+
 
+.hevue-imgpreview-wrap .rotate-animation {
 
+  animation: rotate 1.5s linear infinite;
 
+}
 
+@keyframes rotate {
 
+  from {
 
+    transform: rotate(0deg);
 
+  }
 
+  to {
 
+    transform: rotate(360deg);
 
+  }
 
+}

+ 34 - 0
src/components/tools/hevue-img-preview/css/theme-dark.css
查看文件 

@@ -0,0 +1,34 @@
 
+
 
+.hevue-imgpreview-wrap {
 
+  color: rgba(255,255,255,.6);
 
+}
 
+
 
+/* 遮罩层 */
 
+.hevue-imgpreview-wrap .he-img-wrap {
 
+  background: rgba(0, 0, 0, .8);
 
+  backdrop-filter: blur(8px);
 
+}
 
+
 
+/* 控制条 */
 
+.hevue-imgpreview-wrap .he-control-bar {
 
+  background: rgba(0,0,0,.3);
 
+  backdrop-filter: blur(5px);
 
+}
 
+
 
+/* 左右箭头 */
 
+.hevue-imgpreview-wrap .arrow {
 
+  background: rgba(0,0,0,.3);
 
+  backdrop-filter: blur(5px);
 
+}
 
+
 
+/* 关闭按钮 */
 
+.he-close-icon {
 
+  background: rgba(0,0,0,.3);
 
+  backdrop-filter: blur(5px);
 
+}
 
+
 
+/* 页码指示器 */
 
+.he-control-num {
 
+  background: rgba(0,0,0,.3);
 
+  backdrop-filter: blur(5px);
 
+}

+ 41 - 0
src/components/tools/hevue-img-preview/css/theme-light.css
查看文件 

@@ -0,0 +1,41 @@
 
+.hevue-imgpreview-wrap {
 
+  color: rgba(52, 52, 52, 0.6);
 
+}
 
+
 
+/* 遮罩层 */
 
+.hevue-imgpreview-wrap .he-img-wrap {
 
+  background: rgba(70, 70, 70, 0.3);
 
+  backdrop-filter: blur(8px);
 
+}
 
+
 
+/* 控制条 */
 
+.hevue-imgpreview-wrap .he-control-bar {
 
+  background: rgba(255, 255, 255, .8);
 
+  backdrop-filter: blur(5px);
 
+  /* box-shadow: 0 0 5px 1px rgb(0 0 0 / 10%); */
 
+  /* border: 1px solid rgba(160, 160, 160, .15); */
 
+}
 
+
 
+/* 左右箭头 */
 
+.hevue-imgpreview-wrap .arrow {
 
+  background: rgba(255, 255, 255, .8);
 
+  backdrop-filter: blur(5px);
 
+  /* box-shadow: 0 0 5px 1px rgb(0 0 0 / 10%); */
 
+  /* border: 1px solid rgba(160, 160, 160, .15); */
 
+}
 
+
 
+/* 关闭按钮 */
 
+.hevue-imgpreview-wrap .he-close-icon {
 
+  background: rgba(255, 255, 255, .8);
 
+  backdrop-filter: blur(5px);
 
+  /* box-shadow: 0 0 5px 1px rgb(0 0 0 / 10%); */
 
+  /* border: 1px solid rgba(160, 160, 160, .15); */
 
+}
 
+
 
+/* 页码指示器 */
 
+.hevue-imgpreview-wrap .he-control-num {
 
+  background: rgba(255, 255, 255, .8);
 
+  backdrop-filter: blur(5px);
 
+  /* box-shadow: 0 0 5px 1px rgb(0 0 0 / 10%); */
 
+  /* border: 1px solid rgba(160, 160, 160, .15); */
 
+}

+ 536 - 0
src/components/tools/hevue-img-preview/hevue-img-preview.vue
查看文件 

@@ -0,0 +1,536 @@
 
+<!--
 
+ * @Author: 贺永胜
 
+ * @Date: 2021-04-19 16:39:30
 
+ * @email: 1378431028@qq.com
 
+ * @LastEditors: 贺永胜
 
+ * @LastEditTime: 2021-10-28 11:15:41
 
+ * @Description: file content
 
+-->
 
+
 
+<!--
 
+ *                                                     __----~~~~~~~~~~~------___
 
+ *                                    .  .   ~~//====......          __--~ ~~
 
+ *                    -.            \_|//     |||\\  ~~~~~~::::... /~
 
+ *                 ___-==_       _-~o~  \/    |||  \\            _/~~-
 
+ *         __---~~~.==~||\=_    -_--~/_-~|-   |\\   \\        _/~
 
+ *     _-~~     .=~    |  \\-_    '-~7  /-   /  ||    \      /
 
+ *   .~       .~       |   \\ -_    /  /-   /   ||      \   /
 
+ *  /  ____  /         |     \\ ~-_/  /|- _/   .||       \ /
 
+ *  |~~    ~~|--~~~~--_ \     ~==-/   | \~--===~~        .\
 
+ *           '         ~-|      /|    |-~\~~       __--~~
 
+ *                       |-~~-_/ |    |   ~\_   _-~            /\
 
+ *                            /  \     \__   \/~                \__
 
+ *                        _--~ _/ | .-~~____--~-/                  ~~==.
 
+ *                       ((->/~   '.|||' -_|    ~~-/ ,              . _||
 
+ *                                  -_     ~\      ~~---l__i__i__i--~~_/
 
+ *                                  _-~-__   ~)  \--______________--~~
 
+ *                                //.-~~~-~_--~- |-------~~~~~~~~
 
+ *                                       //.-~~~--\
 
+ *                       ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 
+ * 
+ *                               神兽保佑            永无BUG
 
+ -->
 
+
 
+<template>
 
+  <transition name="fade">
 
+    <div
 
+      class="hevue-imgpreview-wrap"
 
+      id="hevue-imgpreview-wrap"
 
+      v-if="show"
 
+      ref="heImg"
 
+      @mouseup="removeMove('pc')"
 
+      @touchend="removeMove('mobile')"
 
+      @click.stop="clickMask"
 
+    >
 
+      <div class="he-img-wrap">
 
+        <div
 
+          class="heimgfont hevue-img-status-icon rotate-animation"
 
+          v-show="imgState === 1"
 
+        >
 
+          &#xe6b1;
 
+        </div>
 
+        <!-- <div class="heimgfont loading">&#xe6b1;</div> -->
 
+        <img
 
+          :src="imgurl"
 
+          ref="heImView"
 
+          @click.stop=""
 
+          v-show="imgState === 2"
 
+          class="he-img-view"
 
+          :style="
 
+            'transform: scale(' +
 
+              imgScale +
 
+              ') rotate(' +
 
+              imgRotate +
 
+              'deg);margin-top:' +
 
+              imgTop +
 
+              'px;margin-left:' +
 
+              imgLeft +
 
+              'px;' +
 
+              maxWH
 
+          "
 
+          @mousedown="addMove"
 
+          @touchstart="addMoveMobile"
 
+        />
 
+        <!-- 图片加载失败 -->
 
+        <div
 
+          class="heimgfont hevue-img-status-icon"
 
+          v-show="imgState === 3"
 
+        >
 
+          &#xec0d;
 
+        </div>
 
+        <!-- 关闭按钮 -->
 
+        <div
 
+          class="heimgfont he-close-icon"
 
+          @click.stop="close"
 
+          v-if="closeBtn"
 
+        >
 
+          &#xe608;
 
+        </div>
 
+        <!-- 左箭头 -->
 
+        <div
 
+          class="arrow arrow-left heimgfont"
 
+          @click.stop="toogleImg(false)"
 
+          v-if="arrowBtn && multiple"
 
+        >
 
+          &#xe620;
 
+        </div>
 
+        <!-- 右箭头 -->
 
+        <div
 
+          class="arrow arrow-right heimgfont"
 
+          @click.stop="toogleImg(true)"
 
+          v-if="arrowBtn && multiple"
 
+        >
 
+          &#xe60d;
 
+        </div>
 
+        <!-- 控制条 -->
 
+        <div class="he-control-bar-wrap" v-if="controlBar">
 
+          <div
 
+            class="he-control-bar"
 
+            @click.stop
 
+          >
 
+            <!-- 缩小 -->
 
+            <el-tooltip content="缩小" popper-class="showtip" placement="top" effect="dark">
 
+              <div class="he-control-btn heimgfont" @click.stop="scaleFunc(-0.15)">
 
+                &#xe65e;
 
+              </div>
 
+            </el-tooltip>
 
+            <!-- 放大 -->
 
+            <el-tooltip content="放大" popper-class="showtip" placement="top" effect="dark">
 
+              <div class="he-control-btn heimgfont" @click.stop="scaleFunc(0.15)">
 
+                &#xe65d;
 
+              </div>
 
+            </el-tooltip>
 
+            <!-- 复位 -->
 
+            <el-tooltip content="复位" popper-class="showtip" placement="top" effect="dark">
 
+              <div
 
+                class="he-control-btn heimgfont"
 
+                v-show="isFull"
 
+                @click.stop="imgToggle"
 
+              >
 
+                &#xe698;
 
+              </div>
 
+            </el-tooltip>
 
+            <!-- 复位 -->
 
+            <el-tooltip content="复位" popper-class="showtip" placement="top" effect="dark">
 
+              <div
 
+                class="he-control-btn heimgfont"
 
+                v-show="!isFull"
 
+                @click.stop="imgToggle"
 
+              >
 
+                &#xe86b;
 
+              </div>
 
+            </el-tooltip>
 
+            <!-- 左转 -->
 
+            <el-tooltip content="左转90度" popper-class="showtip" placement="top" effect="dark">
 
+              <div class="he-control-btn heimgfont" @click.stop="rotateFunc(-90)">
 
+                &#xe670;
 
+              </div>
 
+            </el-tooltip>
 
+            <!-- 右转 -->
 
+            <el-tooltip content="右转90度" popper-class="showtip" placement="top" effect="dark">
 
+              <div class="he-control-btn heimgfont" @click.stop="rotateFunc(90)">
 
+                &#xe66f;
 
+              </div>
 
+            </el-tooltip>
 
+            <!-- 下载 -->
 
+            <!-- <div class="he-control-btn heimgfont" @click.stop="downloadIamge">
 
+              &#xe694;
 
+            </div> -->
 
+          </div>
 
+        </div>
 
+        <!-- 页码指示器 -->
 
+        <div
 
+          class="he-control-num"
 
+          v-if="controlBar && multiple"
 
+        >
 
+          {{ imgIndex + 1 }} / {{ imgList.length }}
 
+        </div>
 
+      </div>
 
+    </div>
 
+  </transition>
 
+</template>
 
+
 
+<script>
 
+export default {
 
+  name: 'hevue-img-preview',
 
+  data() {
 
+    return {
 
+      // imgWidth: 0,
 
+      // imgHeight: 0,
 
+      imgScale: 1,
 
+      imgTop: 0,
 
+      imgLeft: 0,
 
+      imgRotate: 0,
 
+      isFull: false,
 
+      maxWH: 'max-width:100%;max-height:100%;',
 
+      clientX: 0,
 
+      clientY: 0,
 
+      imgIndex: 0,
 
+      canRun: true,
 
+      imgurl: '',
 
+      imgState: 1,
 
+      start: [{}, {}],
 
+      mobileScale: 0, // 手指离开时图片的缩放比例
 
+      // 以下内容为用户传入配置
 
+      show: false, // 插件显示，默认为false
 
+      url: '', // 预览图片的地址
 
+      nowImgIndex: 0,
 
+      multiple: false,
 
+      imgList: [],
 
+      // 以下为可全局配置
 
+      controlBar: true,
 
+      closeBtn: true,
 
+      arrowBtn: true,
 
+      keyboard: false,
 
+      clickMaskCLose: false, // 是否点击遮罩关闭，默认false
 
+    }
 
+  },
 
+  mounted() {
 
+    this.initImg()
 
+  },
 
+  watch: {
 
+    url() {
 
+      this.initImg()
 
+    },
 
+    show: {
 
+      handler(newV) {
 
+        if (newV) {
 
+          this.$nextTick(() => {
 
+            let _dom = document.getElementById('hevue-imgpreview-wrap')
 
+            _dom.onmousewheel = this.scrollFunc
 
+            // 火狐浏览器没有onmousewheel事件，用DOMMouseScroll代替(滚轮事件)
 
+            document.body.addEventListener('DOMMouseScroll', this.scrollFunc)
 
+            // 禁止火狐浏览器下拖拽图片的默认事件
 
+            document.ondragstart = function() {
 
+              return false
 
+            }
 
+            // 判断是否多图
 
+            if (this.multiple) {
 
+              if (Array.isArray(this.imgList) && this.imgList.length > 0) {
 
+                this.imgIndex = Number(this.nowImgIndex) || 0
 
+                // this.url = this.imgList[this.imgIndex]
 
+                this.changeUrl(this.imgList[this.imgIndex], this.imgIndex)
 
+              } else {
 
+                // console.error("imgList 为空或格式不正确");
 
+              }
 
+            } else {
 
+              this.changeUrl(this.url)
 
+            }
 
+            // 判断是否开启键盘事件
 
+            if (this.keyboard) {
 
+              document.addEventListener('keydown', this.keyHandleDebounce)
 
+            }
 
+          })
 
+        }
 
+      },
 
+      immediate: true,
 
+    },
 
+  },
 
+  methods: {
 
+    close() {
 
+      // this.initImg();
 
+      // this.maxWH = "max-width:100%;max-height:100%;";
 
+      // this.isFull = false;
 
+      // 移除火狐浏览器下的鼠标滚动事件
 
+      document.body.removeEventListener('DOMMouseScroll', this.scrollFunc)
 
+      //恢复火狐及Safari浏览器下的图片拖拽
 
+      document.ondragstart = null
 
+      // 移除键盘事件
 
+      if (this.keyboard) {
 
+        document.removeEventListener('keydown', this.keyHandleDebounce)
 
+      }
 
+      this.show = false
 
+    },
 
+    initImg() {
 
+      this.mobileScale = 1
 
+      this.imgScale = 1
 
+      this.imgRotate = 0
 
+      this.imgTop = 0
 
+      this.imgLeft = 0
 
+    },
 
+    /**
 
+     * 切换图片
 
+     * true 下一张
 
+     * false 上一张
 
+     */
 
+    toogleImg(bool) {
 
+      if (bool) {
 
+        this.imgIndex++
 
+        if (this.imgIndex > this.imgList.length - 1) {
 
+          this.imgIndex = 0
 
+        }
 
+      } else {
 
+        this.imgIndex--
 
+        if (this.imgIndex < 0) {
 
+          this.imgIndex = this.imgList.length - 1
 
+        }
 
+      }
 
+      // this.url = this.imgList[this.imgIndex]
 
+      this.changeUrl(this.imgList[this.imgIndex], this.imgIndex)
 
+    },
 
+    // 改变图片地址
 
+    /**
 
+     * @description:
 
+     * @param {String} url 要显示的图片的url
 
+     * @param {Number} index 当前显示当图片下标，防止用户点击切换图片过快
 
+     * @return {*}
 
+     */
 
+    changeUrl(url, index) {
 
+      this.imgState = 1
 
+      let img = new Image()
 
+      img.src = url
 
+      img.onload = () => {
 
+        // 如果加载出来图片当下标不是当前显示图片当下标，则不予显示（用户点击过快当时候，会出现用户点到第三张了，此时第一张图片才加载完当情况）
 
+        if (index != undefined && index == this.imgIndex) {
 
+          this.imgState = 2
 
+          this.imgurl = url
 
+        } else if (index == undefined) {
 
+          this.imgState = 2
 
+          this.imgurl = url
 
+        }
 
+      }
 
+      img.onerror = () => {
 
+        if (index != undefined && index == this.imgIndex) {
 
+          this.imgState = 3
 
+        } else if (index == undefined) {
 
+          this.imgState = 3
 
+        }
 
+      }
 
+    },
 
+    // 旋转图片
 
+    rotateFunc(deg) {
 
+      this.imgRotate += deg
 
+    },
 
+    // 图片缩放
 
+    scaleFunc(num, bool) {
 
+      if (this.imgScale <= 0.2 && num < 0) return
 
+      if (bool) {
 
+        this.imgScale = num
 
+      } else {
 
+        this.imgScale += num
 
+      }
 
+    },
 
+    // 图片原尺寸切换
 
+    imgToggle() {
 
+      this.initImg()
 
+      if (this.isFull) {
 
+        this.maxWH = 'max-width:100%;max-height:100%;'
 
+      } else {
 
+        this.maxWH = ''
 
+      }
 
+      this.isFull = !this.isFull
 
+    },
 
+    // 鼠标滚轮缩放
 
+    scrollFunc(e) {
 
+      e = e || window.event
 
+      // e.returnValue = false // ie
 
+      // 火狐下没有wheelDelta，用detail代替，由于detail值的正负和wheelDelta相反，所以取反
 
+      e.delta = e.wheelDelta || -e.detail
 
+
 
+      e.preventDefault()
 
+      if (e.delta > 0) {
 
+        //当滑轮向上滚动时
 
+        this.scaleFunc(0.05)
 
+      }
 
+      if (e.delta < 0) {
 
+        //当滑轮向下滚动时
 
+        this.scaleFunc(-0.05)
 
+      }
 
+    },
 
+    // 鼠标按下
 
+    addMove(e) {
 
+      e = e || window.event
 
+      this.clientX = e.clientX
 
+      this.clientY = e.clientY
 
+      this.$refs.heImg.onmousemove = this.moveFunc
 
+    },
 
+    // 手指按下事件
 
+    addMoveMobile(e) {
 
+      e.preventDefault()
 
+      e = e || window.event
 
+      if (e.touches.length > 1) {
 
+        this.start = e.touches
 
+      } else {
 
+        this.clientX = e.touches[0].pageX
 
+        this.clientY = e.touches[0].pageY
 
+      }
 
+      // 添加手指拖动事件
 
+      this.$refs.heImg.ontouchmove = this.moveFuncMobile
 
+    },
 
+    // 鼠标拖动
 
+    moveFunc(e) {
 
+      e = e || window.event
 
+      e.preventDefault()
 
+      let movementX = e.clientX - this.clientX
 
+      let movementY = e.clientY - this.clientY
 
+      // event.clientY;
 
+      this.imgLeft += movementX * 2
 
+      this.imgTop += movementY * 2
 
+      this.clientX = e.clientX
 
+      this.clientY = e.clientY
 
+    },
 
+    // 手指拖动
 
+    moveFuncMobile(e) {
 
+      e = e || window.event
 
+      // console.log(e);
 
+      if (e.touches.length > 1) {
 
+        var now = e.touches
 
+        var scale =
 
+          this.getDistance(now[0], now[1]) /
 
+          this.getDistance(this.start[0], this.start[1])
 
+        // 判断是否手指缩放过，如果缩放过，要在上次缩放的比例基础上进行缩放
 
+        if (this.mobileScale) {
 
+          if (scale > 1) {
 
+            // 放大
 
+            this.scaleFunc(scale + this.mobileScale - 1, true)
 
+          } else {
 
+            // 缩小
 
+            this.scaleFunc(scale * this.mobileScale, true)
 
+          }
 
+        } else {
 
+          this.scaleFunc(scale, true)
 
+        }
 
+      } else {
 
+        let touch = e.touches[0]
 
+        e.preventDefault()
 
+        let movementX = touch.pageX - this.clientX
 
+        let movementY = touch.pageY - this.clientY
 
+        // event.clientY;
 
+        this.imgLeft += movementX * 2
 
+        this.imgTop += movementY * 2
 
+        this.clientX = touch.pageX
 
+        this.clientY = touch.pageY
 
+      }
 
+    },
 
+    // 移除拖动事件
 
+    removeMove(type) {
 
+      if (type === 'pc') {
 
+        this.$refs.heImg.onmousemove = null
 
+      } else {
 
+        this.mobileScale = this.imgScale
 
+        this.$refs.heImg.ontouchmove = null
 
+      }
 
+    },
 
+    keyHandleDebounce(e) {
 
+      if (this.canRun) {
 
+        // 如果this.canRun为true证明当前可以执行函数
 
+        this.keyHandle(e)
 
+        this.canRun = false // 执行函数后一段时间内不可再次执行
 
+        setTimeout(() => {
 
+          this.canRun = true // 等到了我们设定的时间之后，把this.canRun改为true，可以再次执行函数
 
+        }, 300)
 
+      }
 
+    },
 
+    // 键盘事件
 
+    keyHandle(e) {
 
+      e = window.event || e
 
+      var key = e.keyCode || e.which || e.charCode
 
+      switch (key) {
 
+        case 27: // esc
 
+          this.close()
 
+          break
 
+        case 65: // a键-上一张
 
+          if (this.multiple) {
 
+            this.toogleImg(false)
 
+          }
 
+          break
 
+        case 68: // d键-下一张
 
+          if (this.multiple) {
 
+            this.toogleImg(true)
 
+          }
 
+          break
 
+        case 87: // w键-放大
 
+          this.scaleFunc(0.15)
 
+          break
 
+        case 83: // s键-缩小
 
+          this.scaleFunc(-0.15)
 
+          break
 
+        case 81: // q键-逆时针旋转
 
+          this.rotateFunc(-90)
 
+          break
 
+        case 69: // e键-顺时针旋转
 
+          this.rotateFunc(90)
 
+          break
 
+        case 82: // r键-复位键
 
+          this.initImg()
 
+          break
 
+
 
+        default:
 
+          break
 
+      }
 
+    },
 
+    // 点击遮罩层
 
+    clickMask() {
 
+      // console.log("hello");
 
+      if (this.clickMaskCLose) {
 
+        this.close()
 
+      }
 
+    },
 
+    //缩放 勾股定理方法-求两点之间的距离
 
+    getDistance(p1, p2) {
 
+      var x = p2.pageX - p1.pageX,
 
+        y = p2.pageY - p1.pageY
 
+      return Math.sqrt(x * x + y * y)
 
+    },
 
+    /**
 
+     * @description:
 
+     * @param {String} imgsrc
 
+     * @param {*} name
 
+     * @return {*}
 
+     */
 
+    downloadIamge() {
 
+      //下载图片地址和图片名
 
+      let image = new Image()
 
+      // 解决跨域 Canvas 污染问题
 
+      image.setAttribute('crossOrigin', 'anonymous')
 
+      image.onload = function() {
 
+        let canvas = document.createElement('canvas')
 
+        canvas.width = image.width
 
+        canvas.height = image.height
 
+        let context = canvas.getContext('2d')
 
+        context.drawImage(image, 0, 0, image.width, image.height)
 
+        let url = canvas.toDataURL('image/png') //得到图片的base64编码数据
 
+        let a = document.createElement('a') // 生成一个a元素
 
+        let event = new MouseEvent('click') // 创建一个单击事件
 
+        a.download = 'photo' + +new Date() // 设置图片名称
 
+        a.href = url // 将生成的URL设置为a.href属性
 
+        a.dispatchEvent(event) // 触发a的单击事件
 
+      }
 
+      image.onerror = function(err) {
 
+        console.log('图片信息不正确或图片服务器禁止访问')
 
+        console.log(err)
 
+      }
 
+      if (this.multiple) {
 
+        image.src = this.imgList[this.imgIndex]
 
+      } else {
 
+        image.src = this.url
 
+      }
 
+    },
 
+  },
 
+}
 
+</script>
 
+
 
+<style scoped>
 
+@import './iconfont/iconfont.css';
 
+@import './css/default.css';
 
+</style>

+ 71 - 0
src/components/tools/hevue-img-preview/iconfont/iconfont.css
查看文件 

@@ -0,0 +1,71 @@
 
+@font-face {
 
+  font-family: "heimgfont"; /* Project id 1776686 */
 
+  src: url('iconfont.woff2?t=1635390861127') format('woff2'),
 
+       url('iconfont.woff?t=1635390861127') format('woff'),
 
+       url('iconfont.ttf?t=1635390861127') format('truetype');
 
+}
 
+
 
+.heimgfont {
 
+  font-family: "heimgfont" !important;
 
+  font-size: 16px;
 
+  font-style: normal;
 
+  -webkit-font-smoothing: antialiased;
 
+  -moz-osx-font-smoothing: grayscale;
 
+}
 
+
 
+.heimg-iconguanbi1:before {
 
+  content: "\e608";
 
+}
 
+
 
+.heimg-iconiconfontzhizuobiaozhun023146:before {
 
+  content: "\e694";
 
+}
 
+
 
+.heimg-iconhelp:before {
 
+  content: "\e626";
 
+}
 
+
 
+.heimg-iconjiazaizhong:before {
 
+  content: "\e6b1";
 
+}
 
+
 
+.heimg-icontupianjiazaishibai:before {
 
+  content: "\ec0d";
 
+}
 
+
 
+.heimg-iconicon_arrow_right:before {
 
+  content: "\e60d";
 
+}
 
+
 
+.heimg-iconjiantouzuo:before {
 
+  content: "\e620";
 
+}
 
+
 
+.heimg-iconxuanzhuan:before {
 
+  content: "\e66f";
 
+}
 
+
 
+.heimg-iconxuanzhuan1:before {
 
+  content: "\e670";
 
+}
 
+
 
+.heimg-iconyuanshibili:before {
 
+  content: "\e86b";
 
+}
 
+
 
+.heimg-iconfangda:before {
 
+  content: "\e65d";
 
+}
 
+
 
+.heimg-iconsuoxiao:before {
 
+  content: "\e65e";
 
+}
 
+
 
+.heimg-iconquanping:before {
 
+  content: "\e698";
 
+}
 
+
 
+.heimg-iconguanbi:before {
 
+  content: "\e764";
 
+}
 
+

二進制
src/components/tools/hevue-img-preview/iconfont/iconfont.ttf
查看文件


二進制
src/components/tools/hevue-img-preview/iconfont/iconfont.woff
查看文件


二進制
src/components/tools/hevue-img-preview/iconfont/iconfont.woff2
查看文件


+ 48 - 0
src/components/tools/hevue-img-preview/index.js
查看文件 

@@ -0,0 +1,48 @@
 
+/*
 
+ * @Author: heyongsheng
 
+ * @Date: 2020-04-22 15:40:42
 
+ * @Last Modified by: heyongsheng
 
+ * @Last Modified time: 2020-07-08 22:49:13
 
+ */
 
+import Vue from "vue";
 
+import VueToast from "./hevue-img-preview.vue";
 
+
 
+const ToastConstructor = Vue.extend(VueToast);
 
+
 
+let instance
 
+let hevueImgPreviewConfig
 
+
 
+const ImgPreview = (options = {}) => {
 
+  if (typeof options === 'string') {
 
+    options = {
 
+      url: options
 
+    };
 
+  }
 
+  options.show = true
 
+  // 优先采取局部配置，其次采取全局配置
 
+  Object.keys(hevueImgPreviewConfig).map(name => {
 
+    if ( options[name] == undefined) {
 
+      options[name] = hevueImgPreviewConfig[name]
 
+    }
 
+  })
 
+
 
+  instance = new ToastConstructor({
 
+    data: options
 
+  })
 
+  instance.$mount()
 
+  let dom = instance.$el
 
+  document.body.appendChild(dom)
 
+  return instance
 
+};
 
+
 
+const install = (Vue, opts = {}) => {
 
+  hevueImgPreviewConfig = opts
 
+  Vue.prototype.$hevueImgPreview = ImgPreview;
 
+};
 
+
 
+if (typeof window !== "undefined" && window.Vue) {
 
+  // window.Vue.use(install);
 
+  install(window.Vue)
 
+}
 
+
 
+export default install;

+ 62 - 0
src/components/tools/hevue-img-preview/package.json
查看文件 

@@ -0,0 +1,62 @@
 
+{
 
+  "_args": [
 
+    [
 
+      "hevue-img-preview@5.0.3",
 
+      "G:\\pbl-teacher-table"
 
+    ]
 
+  ],
 
+  "_from": "hevue-img-preview@5.0.3",
 
+  "_id": "hevue-img-preview@5.0.3",
 
+  "_inBundle": false,
 
+  "_integrity": "sha512-JzTudYDM/ECxRd0we+DxZ6/7VoM9GKBCSp2CCMFzI+ha1MuKIq35P96b4V/Funvr5cTzsdiwHf8n35GSwwnJUA==",
 
+  "_location": "/hevue-img-preview",
 
+  "_phantomChildren": {},
 
+  "_requested": {
 
+    "type": "version",
 
+    "registry": true,
 
+    "raw": "hevue-img-preview@5.0.3",
 
+    "name": "hevue-img-preview",
 
+    "escapedName": "hevue-img-preview",
 
+    "rawSpec": "5.0.3",
 
+    "saveSpec": null,
 
+    "fetchSpec": "5.0.3"
 
+  },
 
+  "_requiredBy": [
 
+    "/"
 
+  ],
 
+  "_resolved": "https://registry.npmmirror.com/hevue-img-preview/-/hevue-img-preview-5.0.3.tgz",
 
+  "_spec": "5.0.3",
 
+  "_where": "G:\\pbl-teacher-table",
 
+  "author": {
 
+    "name": "贺永胜",
 
+    "email": "1378431028@qq.com"
 
+  },
 
+  "browserslist": [
 
+    "> 1%",
 
+    "last 2 versions",
 
+    "not ie <= 10"
 
+  ],
 
+  "bugs": {
 
+    "url": "https://github.com/heyongsheng/hevue-img-preview/issues"
 
+  },
 
+  "description": "> 本组件是一个基于 vue 编写的 vue 图片预览组件，支持 pc 和手机端，支持单图和多图预览，仅传入一个图片地址，即可实现图片预览效果。手机端支持单指拖拽和双指缩放。页面各组件颜色均可可自定义，实现个性化设计，如果能帮上你，希望可以移步 [GitHub](https://github.com/heyongsheng/hevue-img-preview) ，或者[码云](https://gitee.com/ihope_top/hevue-img-preview) 给个小星星，如果有任何使用意见或建议，也欢迎回复或者提交 issue",
 
+  "homepage": "https://github.com/heyongsheng/hevue-img-preview#readme",
 
+  "keywords": [
 
+    "hevue-img-preview",
 
+    "vue-img-preview",
 
+    "vue-img",
 
+    "vue-img-view",
 
+    "img-view",
 
+    "view-preview",
 
+    "hevue"
 
+  ],
 
+  "license": "MIT",
 
+  "main": "./index.js",
 
+  "name": "hevue-img-preview",
 
+  "private": false,
 
+  "repository": {
 
+    "type": "git",
 
+    "url": "git+https://github.com/heyongsheng/hevue-img-preview.git"
 
+  },
 
+  "version": "5.0.3"
 
+}

+ 2 - 1
src/components/tools/time.vue
查看文件 

@@ -242,9 +242,10 @@ button[data-setter]:hover {
 
 }
 
 .controlls {
 
   position: absolute;
 
-  left: 75px;
 
+  left: 70px;
 
   top: 105px;
 
   text-align: center;
 
+  width: 170px;
 
 }
 
 .display-remain-time {
 
   font-family: "Roboto";

+ 314 - 0
src/components/wordCloud/index.vue
查看文件 

@@ -0,0 +1,314 @@
 
+<template>
 
+    <div>
 
+        <el-dialog title="词云" :visible.sync="dialogVisibleWordCloud" :append-to-body="true" width="800px"
 
+            :before-close="handleClose" class="dialog_diy dialog_diy3">
 
+            <div class="wordCloud__tagBall" :style="{ width: `500px`, height: `500px` }" @mouseenter="stop"
 
+                @mouseleave="start" v-if="data.length">
 
+                <span class="wordCloud__tag" v-for="(item, index) of data" :key="index"
 
+                    :style="{ color: color[index % color.length], ...contentEle[index].style }"
 
+                    :title="item.name ">{{ item.name }}</span>
 
+                    <!-- + item.value -->
 
+            </div>
 
+            <div class="noneBox" v-else>暂无内容</div>
 
+        </el-dialog>
 
+    </div>
 
+</template>
 
+   
+   
+<script>
 
+export default {
 
+    name: 'cloudWork',
 
+    props: {
 
+        dialogVisibleWordCloud: {
 
+            type: Boolean,
 
+        },
 
+        // 测试数据
 
+        data: {
 
+            type: Array,
 
+            default: () => [
 
+                // {
 
+                //     name: '安氏一类',
 
+                //     value: 100
 
+                // },
 
+                // {
 
+                //     name: '安氏二类',
 
+                //     value: 30
 
+                // },
 
+                // {
 
+                //     name: '安氏三类',
 
+                //     value: 30
 
+                // },
 
+                // {
 
+                //     name: '安氏四类',
 
+                //     value: 30
 
+                // },
 
+                // {
 
+                //     name: '安氏五类',
 
+                //     value: 30
 
+                // },
 
+                // {
 
+                //     name: '安氏一类',
 
+                //     value: 30
 
+                // },
 
+                // {
 
+                //     name: '安氏二类',
 
+                //     value: 30
 
+                // },
 
+                // {
 
+                //     name: '安氏三类',
 
+                //     value: 30
 
+                // },
 
+                // {
 
+                //     name: '安氏四类',
 
+                //     value: 30
 
+                // },
 
+                // {
 
+                //     name: '安氏五类',
 
+                //     value: 30
 
+                // },
 
+                // {
 
+                //     name: '安氏一类',
 
+                //     value: 30
 
+                // },
 
+                // {
 
+                //     name: '安氏二类',
 
+                //     value: 30
 
+                // },
 
+                // {
 
+                //     name: '安氏三类',
 
+                //     value: 30
 
+                // },
 
+                // {
 
+                //     name: '安氏四类',
 
+                //     value: 30
 
+                // },
 
+                // {
 
+                //     name: '安氏五类',
 
+                //     value: 30
 
+                // }
 
+            ]
 
+        }
 
+    },
 
+    data: () => ({
 
+        color: ['#2D4DB6', '#04B67C', '#D1AF07', '#E27914', '#CB4A4D', '#B02690'],
 
+        contentEle: [],
 
+        direction: '-1',
 
+        speed: 400,
 
+        animateID: null,
 
+        width:500,
 
+        height:500,
 
+    }),
 
+    watch: {
 
+        dialogVisibleWordCloud(newValue, oldValue) {
 
+            if(newValue){
 
+                this.contentEle = this.data.map(() => ({
 
+                    x: 0,
 
+                    y: 0,
 
+                    z: 0,
 
+                    style: {}
 
+                }));
 
+                this.innit();
 
+            }else{
 
+                window.cancelAnimationFrame(this.animateID);
 
+            }
 
+        }
 
+    },
 
+    created() {
 
+        // this.contentEle = this.data.map(() => ({
 
+        //     x: 0,
 
+        //     y: 0,
 
+        //     z: 0,
 
+        //     style: {}
 
+        // }));
 
+    },
 
+    mounted() {
 
+        this.innit();
 
+    },
 
+    methods: {
 
+        handleClose(done) {
 
+            this.close();
 
+            // done()
 
+        },
 
+        close() {
 
+            this.$emit("update:dialogVisibleWordCloud", false)
 
+        },
 
+        innit() {
 
+            const RADIUSX = (this.width - 50) / 2;
 
+            const RADIUSY = (this.height - 50) / 2;
 
+            this.contentEle = [];
 
+            for (let i = 0; i < this.data.length; i += 1) {
 
+                const k = -1 + (2 * (i + 1) - 1) / this.data.length;
 
+                const a = Math.acos(k);
 
+                const b = a * Math.sqrt(this.data.length * Math.PI);
 
+                const x = RADIUSX * Math.sin(a) * Math.cos(b);
 
+                const y = RADIUSY * Math.sin(a) * Math.sin(b);
 
+                const z = RADIUSX * Math.cos(a);
 
+                const singleEle = {
 
+                    x,
 
+                    y,
 
+                    z,
 
+                    style: {}
 
+                };
 
+                this.contentEle.push(singleEle);
 
+            }
 
+            this.animate();
 
+        },
 
+        animate() {
 
+            this.rotateX();
 
+            this.rotateY();
 
+            this.move();
 
+            this.animateID = window.requestAnimationFrame(this.animate);
 
+        },
 
+        rotateX() {
 
+            const angleX = ['-1', '1'].includes(this.direction)
 
+                ? Math.PI / Infinity
 
+                : Math.PI / ((Number(this.direction) / 2) * Number(this.speed));
 
+            const cos = Math.cos(angleX);
 
+            const sin = Math.sin(angleX);
 
+
 
+            this.contentEle = this.contentEle.map((t) => {
 
+                const y1 = t.y * cos - t.z * sin;
 
+                const z1 = t.z * cos + t.y * sin;
 
+                return {
 
+                    ...t,
 
+                    y: y1,
 
+                    z: z1
 
+                };
 
+            });
 
+        },
 
+        rotateY() {
 
+            const angleY = ['-2', '2'].includes(this.direction)
 
+                ? Math.PI / Infinity
 
+                : Math.PI / (Number(this.direction) * Number(this.speed));
 
+            const cos = Math.cos(angleY);
 
+            const sin = Math.sin(angleY);
 
+            this.contentEle = this.contentEle.map((t) => {
 
+                const x1 = t.x * cos - t.z * sin;
 
+                const z1 = t.z * cos + t.x * sin;
 
+                return {
 
+                    ...t,
 
+                    x: x1,
 
+                    z: z1
 
+                };
 
+            });
 
+        },
 
+        move() {
 
+            const CX = this.width / 2;
 
+            const CY = this.height / 2;
 
+            this.contentEle = this.contentEle.map((singleEle) => {
 
+                const { x, y, z } = singleEle;
 
+                const fallLength = 500;
 
+                const RADIUS = (this.width - 50) / 2;
 
+                const scale = fallLength / (fallLength - z);
 
+                const alpha = (z + RADIUS) / (2 * RADIUS);
 
+                const left = `${x + CX - 15}px`;
 
+                const top = `${y + CY - 15}px`;
 
+                const transform = `translate(${left}, ${top}) scale(${scale})`;
 
+                const style = {
 
+                    ...singleEle.style,
 
+                    opacity: alpha + 0.5,
 
+                    zIndex: parseInt(scale * 100, 10),
 
+                    transform
 
+                };
 
+                return {
 
+                    x,
 
+                    y,
 
+                    z,
 
+                    style
 
+                };
 
+            });
 
+        },
 
+        // 鼠标移入暂停
 
+        stop() {
 
+            window.cancelAnimationFrame(this.animateID);
 
+        },
 
+        // 鼠标离开恢复
 
+        start() {
 
+            this.animate();
 
+        }
 
+    }
 
+};
 
+</script>
 
+   
+   
+<style  scoped>
 
+@media screen and (max-width: 1280px) {
 
+    .dialog_diy3>>>.el-dialog {
 
+        width: 100% !important;
 
+    }
 
+}
 
+
 
+.dialog_diy>>>.el-dialog {
 
+    margin-top: 10vh !important;
 
+}
 
+
 
+.dialog_diy>>>.el-dialog__header {
 
+    background: #454545 !important;
 
+    padding: 15px 20px;
 
+}
 
+
 
+.dialog_diy>>>.el-dialog__title,
 
+.dialog_diy1>>>.el-dialog__title {
 
+    color: #fff;
 
+}
 
+
 
+.dialog_diy>>>.el-dialog__headerbtn {
 
+    top: 19px;
 
+}
 
+
 
+.dialog_diy>>>.el-dialog__headerbtn .el-dialog__close {
 
+    color: #fff;
 
+}
 
+
 
+.dialog_diy>>>.el-dialog__headerbtn .el-dialog__close:hover {
 
+    color: #fff;
 
+}
 
+
 
+.dialog_diy>>>.el-dialog__body {
 
+    overflow:hidden;
 
+}
 
+
 
+.dialog_diy>>>.el-dialog__body,
 
+.dialog_diy>>>.el-dialog__footer {
 
+    background: #fafafa;
 
+    
+}
 
+
 
+button {
 
+    margin: 20px;
 
+}
 
+
 
+.wordCloud__tagBall {
 
+    margin: 0px auto;
 
+    position: relative;
 
+}
 
+
 
+.wordCloud__tag {
 
+    display: block;
 
+    position: absolute;
 
+    left: 0px;
 
+    top: 0px;
 
+    color: green;
 
+    text-decoration: none;
 
+    font-size: 15px;
 
+    font-family: '微软雅黑';
 
+    font-weight: bold;
 
+}
 
+
 
+.wordCloud__tag :hover {
 
+    color: red;
 
+}
 
+
 
+.wordCloud__home {
 
+    display: flex;
 
+    justify-content: center;
 
+}
 
+
 
+.noneBox{
 
+    height:500px;
 
+    width:100%;
 
+    display:flex;
 
+    align-items:center;
 
+    justify-content:center;
 
+}
 
+</style>

+ 4 - 2
src/main.js
查看文件 

@@ -15,11 +15,13 @@ const echarts = require('echarts');
 
 import 'video.js/dist/video-js.css' //videoJs的样式
 
 import 'vue-video-player/src/custom-theme.css' //vue-video-player的样式
 
 import VueCookies from 'vue-cookies'
 
-import hevueImgPreview from 'hevue-img-preview'
 
+import hevueImgPreview from './components/tools/hevue-img-preview'
 
+import drag from './components/directive/el-drag-dialog';
 
+
 
 
 Vue.use(VideoPlayer).use(VueCookies).use(hevueImgPreview, {
 
     clickMaskCLose: true
 
-})
 
+}).use(drag)
 
 Vue.prototype.$echarts = echarts
 
 Vue.prototype.$equipment=function(){
 
     let flag = navigator.userAgent.match(/(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i);

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