feat: 会员弹框优惠券接口对接

This commit is contained in:
lzhizhao 2025-08-09 23:55:26 +08:00
parent e97314987c
commit 84424caa39
3 changed files with 211 additions and 191 deletions

View File

@ -161,5 +161,29 @@ export const marketing = {
method: "post", method: "post",
data data
}); });
},
//积分明细分页查询
pointsChangePage: data => {
return $http.request({
url: `/merchant-api/membershipUser/pointsChangePage`,
method: "post",
data
});
},
//成长值变化分页查询
growthValueChangePage: data => {
return $http.request({
url: `/merchant-api/membershipUser/growthValueChangePage`,
method: "post",
data
});
},
//获取会员优惠券列表
memberCouponPage: params => {
return $http.request({
url: `/merchant-api/coupon/user/page`,
method: "get",
params
});
} }
}; };

View File

@ -379,15 +379,8 @@ export default {
width: "100px", width: "100px",
render: ({ row }) => { render: ({ row }) => {
let viewDetails = () => { let viewDetails = () => {
this.$api.marketing // 使memberUnitUserDetail
.memberUnitUserDetail({ this.$refs.viewDetails.toggle(row).add();
...this.formInline,
userId: row.userId
})
.then(res => {
console.log(res);
this.$refs.viewDetails.toggle(res.data.data).add();
});
}; };
return ( return (
<div> <div>

View File

@ -39,11 +39,13 @@
<div class="stat-label">会员成长值</div> <div class="stat-label">会员成长值</div>
</div> </div>
<div class="stat-card"> <div class="stat-card">
<div class="stat-number">{{ modalData.memberPoints || 0 }}</div> <div class="stat-number">
{{ modalData.availablePoints || 0 }}
</div>
<div class="stat-label">会员积分</div> <div class="stat-label">会员积分</div>
</div> </div>
<div class="stat-card"> <div class="stat-card">
<div class="stat-number">{{ couponCount }}</div> <div class="stat-number">{{ modalData.couponCount || 0 }}</div>
<div class="stat-label">会员优惠券</div> <div class="stat-label">会员优惠券</div>
</div> </div>
</div> </div>
@ -67,7 +69,14 @@
> >
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="growthChange" prop="changeType"
label="变动类型"
width="120"
align="center"
>
</el-table-column>
<el-table-column
prop="changeValue"
label="成长值变动" label="成长值变动"
width="120" width="120"
align="center" align="center"
@ -75,21 +84,27 @@
<template slot-scope="scope"> <template slot-scope="scope">
<span <span
:style="{ :style="{
color: color: scope.row.changeValue > 0 ? '#67C23A' : '#F56C6C'
scope.row.growthChange > 0 ? '#67C23A' : '#F56C6C'
}" }"
> >
{{ scope.row.growthChange > 0 ? "+" : "" {{ scope.row.changeValue > 0 ? "+" : ""
}}{{ scope.row.growthChange }} }}{{ scope.row.changeValue }}
</span> </span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="relatedOrder" prop="shopOrderNo"
label="关联订单" label="关联订单"
align="center" align="center"
> >
</el-table-column> </el-table-column>
<el-table-column
prop="shopName"
label="所属店铺"
width="120"
align="center"
>
</el-table-column>
<el-table-column label="详情" width="100" align="center"> <el-table-column label="详情" width="100" align="center">
<template slot-scope="scope"> <template slot-scope="scope">
<el-button <el-button
@ -129,24 +144,6 @@
align="center" align="center"
> >
</el-table-column> </el-table-column>
<el-table-column
prop="pointsChange"
label="积分变动"
width="120"
align="center"
>
<template slot-scope="scope">
<span
:style="{
color:
scope.row.pointsChange > 0 ? '#67C23A' : '#F56C6C'
}"
>
{{ scope.row.pointsChange > 0 ? "+" : ""
}}{{ scope.row.pointsChange }}
</span>
</template>
</el-table-column>
<el-table-column <el-table-column
prop="changeType" prop="changeType"
label="变动类型" label="变动类型"
@ -155,11 +152,42 @@
> >
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="relatedOrder" prop="changeValue"
label="积分变动"
width="120"
align="center"
>
<template slot-scope="scope">
<span
:style="{
color: scope.row.changeValue > 0 ? '#67C23A' : '#F56C6C'
}"
>
{{ scope.row.changeValue > 0 ? "+" : ""
}}{{ scope.row.changeValue }}
</span>
</template>
</el-table-column>
<el-table-column
prop="shopOrderNo"
label="关联订单" label="关联订单"
align="center" align="center"
> >
</el-table-column> </el-table-column>
<el-table-column
prop="exchangeProductName"
label="兑换商品"
width="120"
align="center"
>
</el-table-column>
<el-table-column
prop="shopName"
label="所属店铺"
width="120"
align="center"
>
</el-table-column>
<el-table-column label="详情" width="100" align="center"> <el-table-column label="详情" width="100" align="center">
<template slot-scope="scope"> <template slot-scope="scope">
<el-button <el-button
@ -192,11 +220,7 @@
style="width: 100%" style="width: 100%"
v-loading="couponsLoading" v-loading="couponsLoading"
> >
<el-table-column <el-table-column prop="name" label="优惠券名称" align="center">
prop="couponName"
label="优惠券名称"
align="center"
>
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="couponType" prop="couponType"
@ -205,52 +229,51 @@
align="center" align="center"
> >
</el-table-column> </el-table-column>
<el-table-column <el-table-column label="面额" width="100" align="center">
prop="faceValue"
label="面额"
width="100"
align="center"
>
<template slot-scope="scope"> <template slot-scope="scope">
<span v-if="scope.row.couponType === '折扣券'" <span v-if="scope.row.couponType === 'DISCOUNT'">
>{{ scope.row.faceValue }}</span {{ scope.row.discount }}
> </span>
<span v-else>¥{{ scope.row.faceValue }}</span> <span v-else>¥{{ scope.row.money }}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="useCondition" prop="minPrice"
label="使用条件" label="使用条件"
width="120" width="120"
align="center" align="center"
> >
<template slot-scope="scope">
<span v-if="scope.row.minPrice > 0">
{{ scope.row.minPrice }}元可用
</span>
<span v-else>无门槛</span>
</template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="receiveTime" prop="createTime"
label="获得时间" label="获得时间"
width="180" width="180"
align="center" align="center"
> >
</el-table-column> </el-table-column>
<el-table-column <el-table-column label="有效期" width="180" align="center">
prop="validPeriod" <template slot-scope="scope">
label="有效期" {{ scope.row.useStartTime }} {{ scope.row.useEndTime }}
width="180" </template>
align="center"
>
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="useStatus" prop="status"
label="使用状态" label="使用状态"
width="100" width="100"
align="center" align="center"
> >
<template slot-scope="scope"> <template slot-scope="scope">
<el-tag <el-tag
:type="getStatusTagType(scope.row.useStatus)" :type="getCouponStatusTagType(scope.row.status)"
size="small" size="small"
> >
{{ scope.row.useStatus }} {{ getCouponStatusText(scope.row.status) }}
</el-tag> </el-tag>
</template> </template>
</el-table-column> </el-table-column>
@ -391,145 +414,99 @@ export default {
// //
loadGrowthData() { loadGrowthData() {
this.growthLoading = true; this.growthLoading = true;
// API
setTimeout(() => { const params = {
this.growthList = [ membershipId: this.modalData.id || 0,
{ pageNumber: this.growthPagination.currentPage,
changeTime: "2025-07-24 17:20", pageSize: this.growthPagination.pageSize
growthChange: 35, };
relatedOrder: "ORD9296",
changeReason: "订单消费", this.$api.marketing
orderAmount: "89.99", .growthValueChangePage(params)
orderTime: "2025-07-24 17:20", .then(res => {
shopName: "美食餐厅" if (res.data.code === "200") {
}, this.growthList = res.data.data.data || [];
{ this.growthPagination.total = res.data.data.total || 0;
changeTime: "2025-07-12 17:20", } else {
growthChange: 100, this.growthList = [];
relatedOrder: "-", this.growthPagination.total = 0;
changeReason: "活动奖励", this.$message.error(res.data.message || "获取成长值明细失败");
description: "参与平台活动获得的成长值奖励"
},
{
changeTime: "2024-01-05 16:45:33",
growthChange: 30,
relatedOrder: "ORDER202401503",
changeReason: "订单消费",
orderAmount: "65.50",
orderTime: "2024-01-05 16:45:33",
shopName: "便利超市"
} }
]; })
this.growthPagination.total = 3; .catch(error => {
this.growthLoading = false; console.error("获取成长值明细失败:", error);
}, 500); this.growthList = [];
this.growthPagination.total = 0;
this.$message.error("获取成长值明细失败");
})
.finally(() => {
this.growthLoading = false;
});
}, },
// //
loadPointsData() { loadPointsData() {
this.pointsLoading = true; this.pointsLoading = true;
// API
setTimeout(() => { const params = {
this.pointsList = [ membershipId: this.modalData.id || 0,
{ pageNumber: this.pointsPagination.currentPage,
changeTime: "2025-07-24 17:20", pageSize: this.pointsPagination.pageSize
pointsChange: 25, };
changeType: "订单消费",
relatedOrder: "ORD9296", this.$api.marketing
changeReason: "订单消费", .pointsChangePage(params)
orderAmount: "78.30", .then(res => {
orderTime: "2025-07-24 17:20", if (res.data.code === "200") {
shopName: "运动健身店" this.pointsList = res.data.data.data || [];
}, this.pointsPagination.total = res.data.data.total || 0;
{ } else {
changeTime: "2025-07-20 15:30", this.pointsList = [];
pointsChange: -50, this.pointsPagination.total = 0;
changeType: "兑换商品", this.$message.error(res.data.message || "获取积分明细失败");
relatedOrder: "-",
changeReason: "兑换商品",
exchangeProduct: "精美水杯",
exchangeQuantity: "1个",
usageDescription:
"使用50积分兑换商品兑换成功后积分将被扣除且不可退还。"
},
{
changeTime: "2025-07-12 17:20",
pointsChange: 80,
changeType: "完成任务",
relatedOrder: "-",
changeReason: "完成任务",
description: "完成平台指定任务获得的积分奖励"
},
{
changeTime: "2024-01-08 15:45:30",
pointsChange: 10,
changeType: "签到奖励",
relatedOrder: "-",
changeReason: "签到奖励",
description: "每日签到获得的积分奖励"
} }
]; })
this.pointsPagination.total = 4; .catch(error => {
this.pointsLoading = false; console.error("获取积分明细失败:", error);
}, 500); this.pointsList = [];
this.pointsPagination.total = 0;
this.$message.error("获取积分明细失败");
})
.finally(() => {
this.pointsLoading = false;
});
}, },
// //
loadCouponsData() { loadCouponsData() {
this.couponsLoading = true; this.couponsLoading = true;
// API
setTimeout(() => { const params = {
this.couponsList = [ shopId: this.modalData.shopId || 0,
{ userId: this.modalData.userId || 0,
couponName: "新用户专享券", pageNumber: this.couponsPagination.currentPage,
couponType: "满减券", pageSize: this.couponsPagination.pageSize
faceValue: 20, };
useCondition: "满100元可用",
receiveTime: "2024-01-01 10:00:00", this.$api.marketing
validPeriod: "2024-02-01", .memberCouponPage(params)
useStatus: "可使用" .then(res => {
}, if (res.data.code === "200") {
{ this.couponsList = res.data.data.data || [];
couponName: "生日特惠券", this.couponsPagination.total = res.data.data.total || 0;
couponType: "折扣券", } else {
faceValue: 9, this.couponsList = [];
useCondition: "全品类可用", this.couponsPagination.total = 0;
receiveTime: "2024-01-05 12:30:15", this.$message.error(res.data.message || "获取优惠券列表失败");
validPeriod: "2024-02-05",
useStatus: "可使用"
},
{
couponName: "积分兑换券",
couponType: "满减券",
faceValue: 50,
useCondition: "满300元可用",
receiveTime: "2024-01-10 16:20:30",
validPeriod: "2024-03-10",
useStatus: "可使用"
},
{
couponName: "限时抢购券",
couponType: "满减券",
faceValue: 10,
useCondition: "满50元可用",
receiveTime: "2023-12-20 14:15:20",
validPeriod: "2024-01-20",
useStatus: "已过期"
},
{
couponName: "会员专属券",
couponType: "满减券",
faceValue: 30,
useCondition: "满200元可用",
receiveTime: "2023-12-15 09:45:10",
validPeriod: "2024-01-15",
useStatus: "已使用"
} }
]; })
this.couponsPagination.total = 5; .catch(error => {
this.couponCount = this.couponsList.filter( console.error("获取优惠券列表失败:", error);
item => item.useStatus === "可使用" this.couponsList = [];
).length; this.couponsPagination.total = 0;
this.couponsLoading = false; this.$message.error("获取优惠券列表失败");
}, 500); })
.finally(() => {
this.couponsLoading = false;
});
}, },
// //
handleGrowthSizeChange(val) { handleGrowthSizeChange(val) {
@ -565,7 +542,7 @@ export default {
viewPointsDetail(row) { viewPointsDetail(row) {
this.$refs.pointsDetail.show(row); this.$refs.pointsDetail.show(row);
}, },
// //
getStatusTagType(status) { getStatusTagType(status) {
switch (status) { switch (status) {
case "可使用": case "可使用":
@ -577,6 +554,32 @@ export default {
default: default:
return ""; return "";
} }
},
//
getCouponStatusTagType(status) {
switch (status) {
case 0: // 使
return "success";
case 1: // 使
return "info";
case 2: //
return "danger";
default:
return "";
}
},
//
getCouponStatusText(status) {
switch (status) {
case 0:
return "可使用";
case 1:
return "已使用";
case 2:
return "已过期";
default:
return "未知";
}
} }
}, },
computed: { computed: {