From 9d666bfa778db5bb15a0af7922a812b2567ec953 Mon Sep 17 00:00:00 2001
From: yanwenlong <yanwenlong@quesoar.com>
Date: Mon, 11 Sep 2023 23:19:00 +0800
Subject: [PATCH] =?UTF-8?q?=E4=B8=8A=E4=BC=A0=E8=BF=99=E9=87=8C=E8=BF=9B?=
 =?UTF-8?q?=E5=BA=A6=E6=9D=A1=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../modules/book/clock-add-or-update.vue      | 29 +++++++++++++++----
 1 file changed, 24 insertions(+), 5 deletions(-)

diff --git a/src/views/modules/book/clock-add-or-update.vue b/src/views/modules/book/clock-add-or-update.vue
index 774a6b5..d271ea3 100644
--- a/src/views/modules/book/clock-add-or-update.vue
+++ b/src/views/modules/book/clock-add-or-update.vue
@@ -46,10 +46,13 @@
         <el-upload :limit="1" class="el-uploadvideo "
           :class="{ uoloadSty: dataForm.showBtnDealImg, disUoloadSty: dataForm.noneBtnImg }"          
           :action="baseUrl + '/oss/fileoss'"
-          :file-list="videoList" :on-success="videohandlePicSuccess" accept=".mp4" :on-remove="videohandleRemove">
+          :file-list="videoList" :on-success="videohandlePicSuccess" accept=".mp4" :on-remove="videohandleRemove"
+          :show-file-list="true"
+          :on-progress="uploadVideoProcess">
           <!-- <i class="el-icon-plus"></i> -->
           <el-button slot="trigger" size="small" type="primary">上传文件</el-button>
         </el-upload>
+        <el-progress v-show="progressFlag" :percentage="loadProgress"></el-progress>
         <div>          
           <video controls width="250" v-if="dataForm.video != ''">   
             <source :src="dataForm.video" type="video/mp4" />
@@ -87,7 +90,9 @@
 
   export default {
     data() {
-      return {        
+      return {       
+        progressFlag: false, 
+        loadProgress: 0,
         baseUrl: global.baseUrl,        
         visible: false,
         categorys: [],
@@ -339,7 +344,16 @@
         } else {
           this.$message.error("上传失败");
         }
-    },
+      },
+      uploadVideoProcess(event, file, fileList) {
+          this.progressFlag = true; // 显示进度条
+          this.loadProgress = parseInt(event.percent); // 动态获取文件上传进度
+          console.log('this.loadProgress',this.loadProgress)
+          if (this.loadProgress >= 100) {
+              this.loadProgress = 99
+              // setTimeout( () => {this.progressFlag = false}, 1000) // 一秒后关闭进度条
+          }
+      },
 
     videohandlePicSuccess(res, file) {
         console.log(res,'res')
@@ -351,7 +365,8 @@
           })
           this.dataForm.video = res.url
           // console.log(this.dataForm.productImages,'productImages')
-          this.$message.success("上传成功");
+          this.loadProgress = 100
+          setTimeout( () => {this.progressFlag = false;this.$message.success("上传成功");}, 1000) // 一秒后关闭进度条
         } else {
           this.$message.error("上传失败");
         }
@@ -426,7 +441,11 @@
   //     font-size: 12px;
   //   }
   // }
-
+  .el-uploadvideo{
+    .el-progress {
+      display: none !important; 
+    }
+  }
   .el-uploadfeng {
    .el-upload-list__item {
       width: 120px;