From 1a55d5008d2484e4730a5e8919cdb95e14da98d5 Mon Sep 17 00:00:00 2001
From: Tcsm <1377977403@qq.com>
Date: 星期三, 09 八月 2023 23:51:37 +0800
Subject: [PATCH] 完善各模块的视频上传功能,显示正在上传和上传完成提示

---
 ruoyi-ui/src/views/collection/collectionInfo.vue |  139 ++++++++++++++++++++++++----------------------
 1 files changed, 72 insertions(+), 67 deletions(-)

diff --git a/ruoyi-ui/src/views/collection/collectionInfo.vue b/ruoyi-ui/src/views/collection/collectionInfo.vue
index e5fbf9b..c58286f 100644
--- a/ruoyi-ui/src/views/collection/collectionInfo.vue
+++ b/ruoyi-ui/src/views/collection/collectionInfo.vue
@@ -69,75 +69,77 @@
              </el-cow>
            </el-row>
          </el-container>
-         <h4 class="form-header">鐢靛瓙鏂囦欢 </h4>
-         <el-upload
-           action="#"
-           list-type="picture-card"
-           multiple
-           :http-request="requestUpload"
-           :file-list="fileList"
-         >
-           <i slot="default" class="el-icon-plus"></i>
-           <div slot="file" slot-scope="{file}">
-             <img
-               class="el-upload-list__item-thumbnail"
-               :src="file.url"
-               alt=""
-               style="width: 147px; height: 147px"
-               fit="cover"
-               :preview-src-list="[file.url]"
-             >
-             <span class="el-upload-list__item-actions" >
-            <span
+          <h4 class="form-header">鐢靛瓙鏂囦欢 </h4>
+          <el-upload
+            action="#"
+            list-type="picture-card"
+            multiple
+            :http-request="requestUpload"
+            :file-list="fileList"
+          >
+            <div v-if="uploading" class="upload-status">姝e湪涓婁紶...</div>
+            <i v-if="!uploading" slot="default" class="el-icon-plus"></i>
+            <div slot="file" slot-scope="{file}">
+              <img
+                class="el-upload-list__item-thumbnail"
+                :src="file.url"
+                alt=""
+                style="width: 147px; height: 147px"
+                fit="cover"
+                :preview-src-list="[file.url]"
+              >
+              <span class="el-upload-list__item-actions" >
+                <span
 
-              class="el-upload-list__item-preview"
-              @click="handlePictureCardPreview(file)"
-            >
-              <i class="el-icon-zoom-in"></i>
-            </span>
-            <span
+                  class="el-upload-list__item-preview"
+                  @click="handlePictureCardPreview(file)"
+                >
+                  <i class="el-icon-zoom-in"></i>
+                </span>
+                <span
 
-              class="el-upload-list__item-delete"
-              @click="handleDownload(file.url)"
-            >
-              <i class="el-icon-download"></i>
-            </span>
-            <span
-              v-if="isShow"
-              class="el-upload-list__item-delete"
-              @click="handleRemove(file)"
-            >
-              <i class="el-icon-delete"></i>
-            </span>
-          </span>
+                  class="el-upload-list__item-delete"
+                  @click="handleDownload(file.url)"
+                >
+                  <i class="el-icon-download"></i>
+                </span>
+                <span
+                  v-if="isShow"
+                  class="el-upload-list__item-delete"
+                  @click="handleRemove(file)"
+                >
+                  <i class="el-icon-delete"></i>
+                </span>
+              </span>
 
 
-           </div>
-         </el-upload>
+            </div>
+          </el-upload>
 
-         <h4 class="form-header">鍏朵粬闄勪欢 </h4>
-         <el-upload
-           action=""
-           :file-list="fileListOther"
-           class="upload-demo"
-           multiple
-           list-type="picture-card"
-           :on-preview="handleFileCardPreview"
-           :on-remove="handleRemoveFile"
-           :http-request="requestUpload"
-           :show-file-list="true"
-         >
+          <h4 class="form-header">鍏朵粬闄勪欢 </h4>
+          <el-upload
+            action=""
+            :file-list="fileListOther"
+            class="upload-demo"
+            multiple
+            list-type="picture-card"
+            :on-preview="handleFileCardPreview"
+            :on-remove="handleRemoveFile"
+            :http-request="requestUpload"
+            :show-file-list="true"
+          >
 
-           <i slot="default" class="el-icon-plus"></i>
-           <div slot="file" slot-scope="{file}">
-             <img
-               class="el-upload-list__item-thumbnail"
-               src="../../assets/401_images/401.gif"
-               alt=""
-               style="width: 147px; height: 147px"
-               fit="cover"
-             >
-             <span class="el-upload-list__item-actions">
+            <div v-if="uploading" class="upload-status">姝e湪涓婁紶...</div>
+            <i v-if="!uploading" slot="default" class="el-icon-plus"></i>
+            <div slot="file" slot-scope="{file}">
+              <img
+                class="el-upload-list__item-thumbnail"
+                src="../../assets/401_images/401.gif"
+                alt=""
+                style="width: 147px; height: 147px"
+                fit="cover"
+              >
+              <span class="el-upload-list__item-actions">
                     <span
                       class="el-upload-list__item-preview"
                       @click="handleFileCardPreview(file)"
@@ -161,10 +163,10 @@
                   </span>
 
 
-           </div>
+            </div>
 
 
-         </el-upload>
+          </el-upload>
 
           <el-form-item size="large">
             <el-button v-if="isShow" type="primary" @click="submitForm" :disabled="dsb" >淇敼</el-button>
@@ -205,6 +207,7 @@
       dsb:true,
       btn:false,
       isShow:true,
+      uploading: false,
       // 鏀惰棌涓庤崳瑾夎〃鏍兼暟鎹�
      collectionList: [],
       typeList:[],
@@ -284,6 +287,7 @@
       this.btn= jd
       this.dsb = !jd
       this.showInput=true
+      this.isShow=true
       document.title = "淇敼鏀惰棌涓庤崳瑾夎缁嗕俊鎭�";
       this.$route.meta.title = "淇敼鏀惰棌涓庤崳瑾夎缁嗕俊鎭�";//鍒楄〃鐨勫悕绉�
     }
@@ -463,10 +467,11 @@
       var formData = new FormData();
       formData.append('uploadFile', file);
       let _this = this
-
+      this.uploading = true;
       uploadPic(formData).then(response => {
         let pth = response.data.originalFilename.substr(response.data.originalFilename.length-4, response.data.originalFilename.length)
-
+        this.uploading = false;
+        this.$modal.msgSuccess("涓婁紶鎴愬姛");
         if(_this.fot.includes(pth) === true)
         {
           _this.fileList.push({name:response.data.fileName, "url":response.data.url})

--
Gitblit v1.9.1