Fix:5812 【商城小程序】【商户入驻-店铺入驻】商户入驻详情页店铺图片封面及店铺logo上传位置缺少删除键

This commit is contained in:
linxi
2026-08-20 10:30:01 +08:00
parent 75d4b43e5e
commit 8e00a1e477
3 changed files with 119 additions and 99 deletions
+52 -10
View File
@@ -77,11 +77,19 @@
v-if="!form.cover"
class="btn-upload"
>上传图片</view>
<image
v-else
:src="form.cover"
class="img-preview"
/>
<view v-else class="img-wrap">
<image
:src="form.cover"
class="img-preview"
/>
<view
v-if="!reviewing"
class="delete-badge"
@click.stop="deleteImg('cover')"
>
x
</view>
</view>
</view>
</template>
</u-cell>
@@ -143,11 +151,19 @@
v-if="!form.logo"
class="btn-upload"
>上传图片</view>
<image
v-else
:src="form.logo"
class="img-preview"
/>
<view v-else class="img-wrap">
<image
:src="form.logo"
class="img-preview"
/>
<view
v-if="!reviewing"
class="delete-badge"
@click.stop="deleteImg('logo')"
>
x
</view>
</view>
</view>
</template>
</u-cell>
@@ -796,6 +812,15 @@ export default {
this.form[target] = img
})
},
// 删除单张图片(店铺图片封面 / 店铺logo)
deleteImg(target) {
if (this.reviewing) return
if (target === 'cover') {
this.form.cover = ''
} else if (target === 'logo') {
this.form.logo = ''
}
},
chooseLogoVideo() {
if (this.reviewing) return
chooseVideoToUpload(path => {
@@ -1021,6 +1046,23 @@ export default {
.font-color-red {
font-size: 22rpx;
}
.img-wrap {
position: relative;
display: inline-block;
.delete-badge {
position: absolute;
top: 0;
right: 20rpx;
background: #000;
color: #fff;
padding: 2rpx 8rpx;
border-radius: 0 0 0 200rpx;
font-size: 22rpx;
z-index: 10;
text-align: center;
}
}
.video-item {
width: 80px;
height: 80px;
+67 -15
View File
@@ -59,11 +59,19 @@
v-if="!formSupplier.avatar"
class="btn-upload"
>上传图片</view>
<image
v-else
:src="formSupplier.avatar"
class="img-preview"
/>
<view v-else class="img-wrap">
<image
:src="formSupplier.avatar"
class="img-preview"
/>
<view
v-if="!reviewing"
class="delete-badge"
@click.stop="deleteImg('supplier')"
>
x
</view>
</view>
</view>
</template>
</u-cell>
@@ -271,11 +279,19 @@
v-if="!form.cover"
class="btn-upload"
>上传图片</view>
<image
v-else
:src="form.cover"
class="img-preview"
/>
<view v-else class="img-wrap">
<image
:src="form.cover"
class="img-preview"
/>
<view
v-if="!reviewing"
class="delete-badge"
@click.stop="deleteImg('cover')"
>
x
</view>
</view>
</view>
</template>
</u-cell>
@@ -339,11 +355,19 @@
v-if="!form.logo"
class="btn-upload"
>上传图片</view>
<image
v-else
:src="form.logo"
class="img-preview"
/>
<view v-else class="img-wrap">
<image
:src="form.logo"
class="img-preview"
/>
<view
v-if="!reviewing"
class="delete-badge"
@click.stop="deleteImg('logo')"
>
x
</view>
</view>
</view>
</template>
</u-cell>
@@ -989,6 +1013,17 @@ export default {
}
})
},
// 删除单张图片(供应商头像 / 店铺封面图 / 店铺logo)
deleteImg(target) {
if (this.reviewing) return
if (target === 'supplier') {
this.formSupplier.avatar = ''
} else if (target === 'cover') {
this.form.cover = ''
} else if (target === 'logo') {
this.form.logo = ''
}
},
chooseLogoVideo() {
if (this.reviewing) return
chooseVideoToUpload(path => {
@@ -1245,6 +1280,23 @@ export default {
.font-color-red {
font-size: 22rpx;
}
.img-wrap {
position: relative;
display: inline-block;
.delete-badge {
position: absolute;
top: 0;
right: 20rpx;
background: #000;
color: #fff;
padding: 2rpx 8rpx;
border-radius: 0 0 0 200rpx;
font-size: 22rpx;
z-index: 10;
text-align: center;
}
}
.captcha-wrap {
display: flex;
align-items: center;