#

src/components/pages/test/check/index.vue

@@ -198,7 +198,7 @@
                   </wordcloud>
                 </div>
               </div>
-              <div class="content3" v-if="item.type == 5">
+              <div class="content3" style="position: relative;" v-if="item.type == 5">
                 <div class="file" v-for="(file, index2) in item.array" :key="index + '-' + index2"
                   @click.stop="checkFile(file)">
                   <img class="download" src="../../../../assets/icon/fileIcon/download.png"
@@ -214,6 +214,28 @@
                     </el-tooltip>
                   </div>
                 </div>
+                <div v-if="
+                    fileLoading
+                  " class="mask">
+                    <div class="progressBox">
+                      <div class="lbox">
+                        <img src="../../../../assets/loading.gif" />打包中，请稍后
+                      </div>
+                      <div style="margin-bottom: 10px">
+                        <span>{{
+                          fileLoadCount
+                          }}</span>
+                        /
+                        <span>{{
+                          fileLoadNum
+                          }}</span>
+                      </div>
+                      <el-progress :text-inside="true" :stroke-width="20" :percentage="infoprogress
+                        ? infoprogress
+                        : 0
+                        " style="width: 80%"></el-progress>
+                    </div>
+                </div>
               </div>
               <div class="content4" v-if="item.type == 6">
                 <div class="out_box" v-for="(item, index) in item.courseArray" :key="index + '-' + index2">
@@ -777,15 +799,7 @@
         </div>
       </div>
     </div>
-    <div class="fileLoadDiv">
-      <el-dialog
-        title=""
-        :visible.sync="fileLoading"
-        :modal="false"
-        :before-close="fileClose">
-        <div>{{ fileLoadCount }} / {{ fileLoadNum }}</div>
-      </el-dialog>
-    </div>
+
    
     <share-box :testJson="testJson" :TeachingValue="TeachingValue" :TeachName="TeachNameCpt"   :dialogVisibleShare.sync="dialogVisibleShare"></share-box>
     <wpdf :dialogVisiblePdf.sync="dialogVisiblePdf" :url="wurl"></wpdf>
@@ -919,6 +933,10 @@ export default {
       fileLoading: false,
       fileLoadCount: 0,
       fileLoadNum: 0,
+      infoisAllSize: 0,
+      infoprogress: 0,
+      infoisFinishSize: 0,
+
     };
   },
   watch: {},
@@ -1997,7 +2015,7 @@ export default {
 				downFileArray.push({userid:i.userid,username:i.username ? i.username : '匿名',urlList:data.filter(d=>d.userid==i.userid).map(m=>m)});
 			})
 			let promises = [];
-      // console.log('downFileArray',downFileArray);
+      console.log('downFileArray',downFileArray);
       downFileArray.forEach(e=>{
         this.fileLoadNum += e.urlList.length
       })
@@ -2011,15 +2029,11 @@ export default {
         	          // 下载文件, 并存成ArrayBuffer对象
         	          const file_name = i.name; // 获取文件名
 									  folder.file(file_name, data.data, { binary: true }); // 逐个添加文件
-                    this.fileLoadCount += 1
-                    if (this.fileLoadCount == this.fileLoadNum) {
-                      this.fileLoading = false
-                    }
-        	      }else{
-                  this.fileLoadCount += 1
-                  if (this.fileLoadCount == this.fileLoadNum) {
-                    this.fileLoading = false
-                  }
+        	      }
+                this.fileLoadCount+=1
+                this.infoprogress = parseInt((this.fileLoadCount / this.fileLoadNum) * 100);
+                if (this.fileLoadCount == this.fileLoadNum) {
+                  this.fileLoading = false
                 }
         	  });
            
@@ -2032,15 +2046,12 @@ export default {
         	      // 下载文件, 并存成ArrayBuffer对象
         	      const file_name = `${downFileArray[0].username}-${downFileArray[0].urlList[0].name}`; // 获取文件名
 								zip.file(file_name, data.data, { binary: true }); // 逐个添加文件
-                this.fileLoadCount+=1
-                if (this.fileLoadCount == this.fileLoadNum) {
-                  this.fileLoading = false
-                }
-            }else{
-              this.fileLoadCount+=1
-              if (this.fileLoadCount == this.fileLoadNum) {
-                this.fileLoading = false
-              }
+            }
+            this.fileLoadCount+=1
+            this.infoprogress = parseInt((this.fileLoadCount / this.fileLoadNum) * 100);
+
+            if (this.fileLoadCount == this.fileLoadNum) {
+              this.fileLoading = false
             }
 					}))
 				}
@@ -2052,15 +2063,11 @@ export default {
         	      // 下载文件, 并存成ArrayBuffer对象
         	      const file_name = `${i.username ? i.username : '匿名'}-${i.urlList[0].name}`; // 获取文件名
 								zip.file(file_name, data.data, { binary: true }); // 逐个添加文件
-                this.fileLoadCount+=1
-                if (this.fileLoadCount == this.fileLoadNum) {
-                  this.fileLoading = false
-                }
-              }else{
-                this.fileLoadCount+=1
-                if (this.fileLoadCount == this.fileLoadNum) {
-                  this.fileLoading = false
-                }
+              }
+              this.fileLoadCount+=1
+              this.infoprogress = parseInt((this.fileLoadCount / this.fileLoadNum) * 100);
+              if (this.fileLoadCount == this.fileLoadNum) {
+                this.fileLoading = false
               }
 						}))
 					}else if(i.urlList.length>1){//有多个文件的
@@ -2071,15 +2078,11 @@ export default {
         	          // 下载文件, 并存成ArrayBuffer对象
         	          const file_name = ui.name; // 获取文件名
 									  folder.file(file_name, data.data, { binary: true }); // 逐个添加文件
-                    this.fileLoadCount+=1
-                    if (this.fileLoadCount == this.fileLoadNum) {
-                      this.fileLoading = false
-                    }
-        	      }else{
-                  this.fileLoadCount+=1
-                  if (this.fileLoadCount == this.fileLoadNum) {
-                    this.fileLoading = false
-                  }
+        	      }
+                this.fileLoadCount+=1
+                this.infoprogress = parseInt((this.fileLoadCount / this.fileLoadNum) * 100);
+                if (this.fileLoadCount == this.fileLoadNum) {
+                  this.fileLoading = false
                 }
 						  })
 							promises.push(promise)
@@ -2456,6 +2459,7 @@ export default {
 .title_content>.title_box>.title {
   font-size: 18px;
   display: flex;
+  min-height: 35px;
   white-space: pre-line;
 	position: relative;
 }
@@ -2986,4 +2990,47 @@ export default {
   align-items: center;
   border-radius: 15px;
 }
+.mask {
+  background-color: rgb(0 0 0 / 30%);
+  /* position: fixed; */
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  z-index: 90;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+.progressBox {
+  width: 300px;
+  height: 150px;
+  background: #fff;
+  border-radius: 10px;
+  box-shadow: 0 0 6px 1px #bfbfbf;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-direction: column;
+  position: relative;
+  color: #6c6c6c;
+}
+
+.progressBox>>>.el-progress-bar__outer {
+  background-color: #d1dfff !important;
+}
+
+.progressBox .lbox {
+  height: 50px;
+  font-size: 19px;
+  display: flex;
+  align-items: center;
+  color: #747474;
+}
+
+.progressBox .lbox img {
+  width: 40px;
+  margin-right: 20px;
+}
 </style>