From 1243a4a82f050b4c58d6044a5983aefd034c849f Mon Sep 17 00:00:00 2001
From: LL <wangzhenglei38@163.com>
Date: Mon, 2 Feb 2026 14:44:52 +0800
Subject: [PATCH] =?UTF-8?q?fix=EF=BC=9A=E4=B8=8A=E4=BC=A0bug=E4=BF=AE?=
 =?UTF-8?q?=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../promotion/components/promotionDialog.vue  |  7 +-
 .../modules/plugins/rent/upload-image.vue     | 87 ++++++++++++-------
 2 files changed, 58 insertions(+), 36 deletions(-)

diff --git a/src/views/modules/communityParty/promotion/components/promotionDialog.vue b/src/views/modules/communityParty/promotion/components/promotionDialog.vue
index 6345c1da6..8a3a47208 100644
--- a/src/views/modules/communityParty/promotion/components/promotionDialog.vue
+++ b/src/views/modules/communityParty/promotion/components/promotionDialog.vue
@@ -17,7 +17,7 @@
 
         <el-form-item label="上传照片" label-width="150px" prop="coverPic">
           <div class="item_width_1">
-            <upload-image :defaultFileList="fileList" :is-in-preview="false" :limit="1" @change="onChangeFileList"
+            <upload-image :defaultFileList="fileList" :is-in-preview="false" :limit="2" @change="onChangeFileList"
               @file-removed="removedImg" @preview="handleImgPreview"></upload-image>
           </div>
         </el-form-item>
@@ -162,10 +162,7 @@ export default {
     },
 
     onChangeFileList(fileList) {
-      this.fileList = fileList.length > 0 ? fileList.map(item => ({
-        fileType: '0',
-        fileUrl: item.response.data.url
-      })) : []; // 当e为空时清空fileList
+      this.fileList = fileList.length > 0 ? fileList : [];
       if (fileList.length > 0) {
         this.formData.coverPic = fileList[0].response.data.url;
       } else {
diff --git a/src/views/modules/plugins/rent/upload-image.vue b/src/views/modules/plugins/rent/upload-image.vue
index 1acb760c1..57ae7a092 100644
--- a/src/views/modules/plugins/rent/upload-image.vue
+++ b/src/views/modules/plugins/rent/upload-image.vue
@@ -1,29 +1,34 @@
 <template>
-    <div class="upload-image" :class="isDetail? 'isDetail' : ''">
-        <el-upload :headers="$getElUploadHeaders()"  list-type="picture-card"
-            :action="uploadUrl"
-            :data="{ customerId: customerId }"
-            :file-list="fileList"
-            :limit="limit"
+    <div class="upload-image" :class="isDetail ? 'isDetail' : ''">
+        <el-upload :headers="$getElUploadHeaders()" list-type="picture-card" :action="uploadUrl"
+            :data="{ customerId: customerId }" :file-list="fileList" :limit="limit"
             :on-success="(res, file) => handleImgSuccess(res, file)"
-            :on-error="(res, file) => handleImgError(res, file)"
-            :on-remove="(res) => handleImgRemove(res)"
-            :on-exceed="(res) => handleImgExceed(res)"
-            :before-upload="(file) => beforeImgUpload(file)"
+            :on-error="(res, file) => handleImgError(res, file)" :on-remove="(res) => handleImgRemove(res)"
+            :on-exceed="(res) => handleImgExceed(res)" :before-upload="(file) => beforeImgUpload(file)"
             accept="image/jpg,image/jpeg,image/png">
             <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="">
-                <span class="el-upload-list__item-actions">
-                    <span class="el-upload-list__item-preview" @click="handlePictureCardPreview(file)">
-                        <i class="el-icon-zoom-in"></i>
+            <div slot="file" slot-scope="{file}" style="width: 100%; height: 100%;">
+                <div v-if="file.status !== 'uploading'" style="width: 100%; height: 100%;">
+                    <img class="el-upload-list__item-thumbnail" :src="file.url" alt="">
+                    <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 v-if="!disabled" class="el-upload-list__item-delete" @click="handleRemove(file)">
+                            <i class="el-icon-delete"></i>
+                        </span>
                     </span>
-                    <span v-if="!disabled" class="el-upload-list__item-delete" @click="handleRemove(file)">
-                        <i class="el-icon-delete"></i>
-                    </span>
-                </span>
+                </div>
+                <div v-else class="uploading-container"
+                    v-loading="true"
+                    element-loading-spinner="el-icon-loading"
+                    element-loading-background="rgba(255, 255, 255, 0.8)">
+
+                </div>
             </div>
+
         </el-upload>
+
         <el-dialog :visible.sync="dialogVisible">
             <img width="100%" :src="dialogImageUrl" alt="">
         </el-dialog>
@@ -54,17 +59,17 @@ export default {
     },
     watch: {
         defaultFileList: {
-            handler (newVal) {
+            handler(newVal) {
                 newVal.forEach(item => {
-                    item.url = item.fileUrl
+                    item.url = item.response.data.url
                 })
                 this.fileList = newVal
             },
             deep: true,
-            immediate: true          
+            immediate: true
         }
     },
-    data () {
+    data() {
         return {
             dialogImageUrl: '',
             dialogVisible: false,
@@ -72,7 +77,7 @@ export default {
             uploadUrl: `${window.SITE_CONFIG['apiURL']}/oss/file/uploadqrcodeV2`,
             customerId: localStorage.getItem("customerId"),
             fileList: [],
-            imageUrls: []
+            imageUrls: [],
         }
     },
     created() {
@@ -94,17 +99,16 @@ export default {
                 this.dialogImageUrl = file.url
                 this.dialogVisible = true
             } else this.$emit('preview', file)
-           
-            
+
+
         },
         beforeImgUpload(file) {
-            // console.log(file)
         },
         handleImgExceed(res) {
             console.log(res)
             this.$message({
-              type: "warning",
-              message: `文件数量最多不超过${this.limit}个`,
+                type: "warning",
+                message: `文件数量最多不超过${this.limit}个`,
             })
         },
         handleImgRemove(file) {
@@ -130,16 +134,37 @@ export default {
     // min-width: 120px;
     // height: 80px;
 }
+
 /deep/ .el-upload--picture-card {
     width: 60px;
     height: 60px;
-    line-height: 70px;
+    position: relative;
+}
+
+/deep/ .el-icon-plus {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
 }
+
 /deep/ .el-upload-list--picture-card .el-upload-list__item {
     width: 60px;
     height: 60px;
 }
+
 .isDetail ::v-deep .el-upload--picture-card {
-  display: none;
+    display: none;
+}
+
+.uploading-container {
+    width: 60px;
+    height: 60px;
+    border: 1px dashed #c0ccda;
+    border-radius: 6px;
+    background-color: rgba(255, 255, 255, 0.3);
+    display: flex;
+    align-items: center;
+    justify-content: center;
 }
 </style>