积分中心图片增加预览功能

This commit is contained in:
gyq
2024-11-01 13:48:50 +08:00
parent 964877f763
commit 8acea02448
2 changed files with 16 additions and 4 deletions

View File

@@ -58,7 +58,8 @@
<el-table-column label="用户名" prop="memberName">
<template v-slot="scope">
<div class="goods_info">
<el-image :src="scope.row.avatarUrl" style="width:40px;height:40px;flex-shrink: 0;" />
<el-image :src="scope.row.avatarUrl" style="width:40px;height:40px;flex-shrink: 0;"
:preview-src-list="avatarUrlList" />
<span>{{ scope.row.memberName }}</span>
</div>
</template>
@@ -66,7 +67,8 @@
<el-table-column label="商品" prop="pointsGoodsName">
<template v-slot="scope">
<div class="goods_info">
<el-image :src="scope.row.goodsImageUrl" style="width:40px;height:40px;flex-shrink: 0;" />
<el-image :src="scope.row.goodsImageUrl" style="width:40px;height:40px;flex-shrink: 0;"
:preview-src-list="srcList" />
<span>{{ scope.row.pointsGoodsName }}</span>
</div>
</template>
@@ -95,7 +97,7 @@
v-if="scope.row.status == 'done'">已完成</el-button>
<template v-else>
<el-popconfirm title="确定核销吗?" @confirm="confirmOrder(scope.row.couponCode)">
<el-button type="text" icon="el-icon-finished" slot="reference">核销</el-button>
<el-button type="text" icon="el-icon-finished" slot="reference">核销</el-button>
</el-popconfirm>
</template>
</template>
@@ -115,6 +117,8 @@ import { exchangeRecordPage, exchangeRecordTotal, recordCheckout } from '@/api/p
export default {
data() {
return {
srcList: [],
avatarUrlList: [],
countData: {
count: 0,
totalAmount: 0
@@ -214,6 +218,10 @@ export default {
this.tableData.loading = false
this.tableData.list = res.content
this.tableData.total = res.totalElements
// 预览图集合
this.srcList = res.content.map(item => item.goodsImageUrl)
// 头像预览图集合
this.avatarUrlList = res.content.map(item => item.avatarUrl)
} catch (error) {
console.log(error);
}

View File

@@ -6,7 +6,8 @@
<el-table-column label="商品" prop="goodsName">
<template v-slot="scope">
<div class="goods_info">
<el-image :src="scope.row.goodsImageUrl" style="width:40px;height:40px;flex-shrink: 0;" />
<el-image :src="scope.row.goodsImageUrl" style="width:40px;height:40px;flex-shrink: 0;"
:preview-src-list="srcList" />
<span>{{ scope.row.goodsName }}</span>
</div>
</template>
@@ -48,6 +49,7 @@ export default {
components: { ShopAdd },
data() {
return {
srcList: [],
tableData: {
sort: 'createdAt,desc',
list: [],
@@ -104,6 +106,8 @@ export default {
this.tableData.loading = false
this.tableData.list = res.content
this.tableData.total = res.totalElements
// 预览图集合
this.srcList = res.content.map(item => item.goodsImageUrl)
} catch (error) {
console.log(error);
}