From 6a270836d9c7aa6762491e7b67f767bd5530c06b Mon Sep 17 00:00:00 2001
From: lifizer <913626195@qq.com>
Date: Tue, 16 Apr 2024 21:12:35 +0800
Subject: [PATCH] =?UTF-8?q?Feat(=E8=AE=A2=E5=8D=95):=E8=AF=84=E4=BB=B7?=
 =?UTF-8?q?=E6=94=AF=E6=8C=81=E4=B8=8A=E4=BC=A0=E8=A7=86=E9=A2=91?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components/tm-upload/tm-upload.vue | 11 +++++-
 pages/shop/GoodsEvaluate/index.vue | 58 ++++++++++++++++++------------
 2 files changed, 46 insertions(+), 23 deletions(-)

diff --git a/components/tm-upload/tm-upload.vue b/components/tm-upload/tm-upload.vue
index 8744da2..296d708 100644
--- a/components/tm-upload/tm-upload.vue
+++ b/components/tm-upload/tm-upload.vue
@@ -1,6 +1,11 @@
 <template name="sunui-upimg">
 	<view class="sunui-uploader-bd">
 		<view class="sunui-uploader-files">
+			<view
+				v-if="showBlankPlaceholder"
+				:style="'width:' + upload_img_wh + 'rpx; height:' + upload_img_wh + 'rpx;'"
+				class="sunui-uploader-file"
+			/>
 			<block v-for="(item, index) in upload_before_list" :key="index">
 				<view class="sunui-uploader-file" :class="[item.upload_percent < 100 ? 'sunui-uploader-file-status' : '']" :style="'width:' + upload_img_wh + 'rpx; height:' + upload_img_wh + 'rpx;'">
 					<image class="sunui-uploader-img" :style="'width:' + upload_img_wh + 'rpx; height:' + upload_img_wh + 'rpx;'" :src="item.path" mode="aspectFill" @tap="preview(index)" v-if="type === 'image'" />
@@ -51,6 +56,11 @@ export default {
 	},
 	name: 'sunui-upimg',
 	props: {
+		// 是否显示空白占位图，用于同时上传视频和图片，两个上传空间并列
+		showBlankPlaceholder: {
+			type: Boolean,
+			default: false
+		},
 		upload_video_max: {
 			type: Number,
 			default: 30 // 最大上传容量(M)
@@ -421,7 +431,6 @@ export default {
 		color: #fff;
 		z-index: 9;
 	}
-
 	.sunui-uploader-bd {
 		padding: 0;
 		margin: 0;
diff --git a/pages/shop/GoodsEvaluate/index.vue b/pages/shop/GoodsEvaluate/index.vue
index 9419348..824c0e2 100644
--- a/pages/shop/GoodsEvaluate/index.vue
+++ b/pages/shop/GoodsEvaluate/index.vue
@@ -45,26 +45,31 @@
           </text>
         </view>
         <view class="upload-wrapper">
-          <tm-upload
-            :dataList="videoArr"
-            :upload_img_wh="uploadImgWH"
-            :upload_max="1"
-            :upload_count="1"
-            :url="uploadUrl"
-            :header="uploadHeader"
-            type='video'
-            @change="uploadedVideoChange"
-          />
-          <tm-upload
-            :dataList="picArr"
-            :upload_img_wh="uploadImgWH"
-            :upload_max="9 - videoArr.length"
-            :upload_count="9 - videoArr.length"
-            :url="uploadUrl"
-            :header="uploadHeader"
-            type='image'
-            @change="uploadedPicChange"
-          />
+          <view class="video-upload">
+            <tm-upload
+              :dataList="videoArr"
+              :upload_img_wh="uploadImgWH"
+              :upload_max="1"
+              :upload_count="1"
+              :url="uploadUrl"
+              :header="uploadHeader"
+              type='video'
+              @change="uploadedVideoChange"
+            />
+          </view>
+          <view class="pic-upload">
+            <tm-upload
+              :dataList="picArr"
+              :upload_img_wh="uploadImgWH"
+              :upload_max="9 - videoArr.length"
+              :upload_count="9 - videoArr.length"
+              :url="uploadUrl"
+              :header="uploadHeader"
+              :showBlankPlaceholder="true"
+              type='image'
+              @change="uploadedPicChange"
+            />
+          </view>
         </view>
       </view>
       <view class="evaluateBnt bg-color-red" @click="submit">立即评价</view>
@@ -194,9 +199,18 @@ export default {
   }
 }
 .upload-wrapper {
-  display: flex;
-  flex-wrap: wrap;
+  position: relative;
   padding: 0 0 0 16rpx;
+  .video-upload {
+    position: absolute;
+    top: 0;
+    left: 16rpx;
+    z-index: 5;
+  }
+  .pic-upload {
+    position: relative;
+    z-index: 2;
+  }
 }
 .evaluate-con .score .textarea .list .pictrue.uploadBnt {
   border: 1px solid #ddd;