feat: 会员弹框优惠券接口对接
This commit is contained in:
parent
e97314987c
commit
84424caa39
|
@ -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
|
||||||
|
});
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
|
@ -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>
|
||||||
|
|
|
@ -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: {
|
||||||
|
|
Loading…
Reference in New Issue