DMJS-IT
/
merchant-web
12
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: 积分商品管理模块

This commit is contained in:
lzhizhao 2025-08-11 23:15:49 +08:00
parent 0aca35bf65
commit f0bc66d982
6 changed files with 279 additions and 184 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

37
src/api/modules/marketing.js
View File

@ -185,5 +185,42 @@ export const marketing = {
method: "get",
params
});
},
// 新增积分商品相关接口
// 获取积分商品分页信息
membershipPointsProductPage: data => {
return $http.request({
url: `/merchant-api/membershipPointsProduct/page`,
method: "post",
data
});
},
// 添加积分商品
addMembershipPointsProduct: data => {
return $http.request({
url: `/merchant-api/membershipPointsProduct/add`,
method: "post",
data
});
},
// 删除积分商品
deleteMembershipPointsProduct: data => {
return $http.request({
url: `/merchant-api/membershipPointsProduct/delete`,
method: "post",
data
});
},
// 修改积分商品
updateMembershipPointsProduct: data => {
return $http.request({
url: `/merchant-api/membershipPointsProduct/update`,
method: "post",
data
});
}
};

124
src/views/modules/marketing/points-mall/index.vue
View File

@ -13,7 +13,13 @@
<template slot="tableTop">
<el-form :inline="true" :model="formInline" class="demo-form-inline">
<el-form-item v-if="storeList.length > 1" label="商铺">
<el-select v-model="formInline.shopId" placeholder="请选择">
<el-select
v-model="formInline.shopIdList"
placeholder="请选择商铺"
multiple
collapse-tags
style="width: 200px"
>
<el-option
v-for="item in storeList"
:key="item.shopId"
@ -79,10 +85,12 @@ export default {
formInline: {
marketId: "",
shopId: "",
shopIdList: [],
unitType: "",
productId: "",
productName: "",
redeemEnable: ""
productSpecId: "",
productSpecName: ""
},
tableProp: {
"auto-resize": true,
@ -103,7 +111,8 @@ export default {
? 3
: 2,
marketId: this.marketId,
shopId: this.shopId
shopId: this.shopId,
shopIdList: this.shopId ? [this.shopId] : []
};
this.$nextTick(() => {
this.$refs.oTable.reload();
@ -111,25 +120,38 @@ export default {
},
methods: {
queryList(pageNo, pageSize) {
// 使用新的积分商品分页接口
const queryParams = {
shopIdList: this.formInline.shopIdList || [],
productId: this.formInline.productId || 0,
productName: this.formInline.productName || "",
productSpecId: this.formInline.productSpecId || 0,
productSpecName: this.formInline.productSpecName || "",
// 添加分页参数以备后续使用
pageNumber: pageNo,
pageSize: pageSize
};
this.$api.marketing
.PointsProductPage({
pageNumber: pageNo,
pageSize: pageSize,
...this.formInline
})
.membershipPointsProductPage(queryParams)
.then(res => {
console.log(res);
this.$refs.oTable.complete(
res.data.data.data,
Number(res.data.data.total)
);
this.$refs.oTable.complete(res.data || [], Number(res.total || 0));
})
.catch(err => {
console.error("查询积分商品失败:", err);
this.$refs.oTable.complete(false);
});
},
add() {
this.$refs.productSelector.show(this.formInline.shopId);
// 传递选中的商铺列表，如果没有选择则传递当前shopId
const shopIdList =
this.formInline.shopIdList && this.formInline.shopIdList.length > 0
? this.formInline.shopIdList
: this.formInline.shopId
? [this.formInline.shopId]
: [];
this.$refs.productSelector.show(shopIdList);
},
reset() {
this.formInline = {
@ -138,7 +160,12 @@ export default {
? 3
: 2,
marketId: this.marketId,
shopId: this.shopId
shopId: this.shopId,
shopIdList: this.shopId ? [this.shopId] : [],
productId: "",
productName: "",
productSpecId: "",
productSpecName: ""
};
this.$refs.oTable.reload();
}
@ -158,37 +185,63 @@ export default {
align: "center",
field: "productName"
},
{
title: "商品规格ID",
align: "center",
field: "productSpecId"
},
{
title: "商品规格名称",
align: "center",
field: "productSpecName"
},
{
title: "所属店铺",
align: "center",
field: "shopName"
},
{
title: "兑换积分",
title: "兑换所需积分",
align: "center",
field: "maxPoints",
field: "exchangeRequiredPoints"
},
{
title: "兑换库存",
align: "center",
field: "exchangeInventory"
},
{
title: "剩余库存",
align: "center",
field: "surplusInventory"
},
{
title: "已兑换数量",
align: "center",
field: "totalExchangeQuantity"
},
{
title: "兑换限制",
align: "center",
field: "exchangeRestrictions"
},
{
title: "限制类型",
align: "center",
field: "exchangeRestrictionsType",
type: "jsx",
render: ({ row }) => {
if (row.minPoints == row.maxPoints) {
return <span>{row.minPoints}</span>;
} else {
return (
<span>
{row.minPoints}-{row.maxPoints}
</span>
);
}
return (
<span>
{row.exchangeRestrictionsType === 1 ? "每日" : "永久"}
</span>
);
}
},
{
title: "剩余兑换库存",
title: "创建时间",
align: "center",
field: "totalInventory"
},
{
title: "已兑换数",
align: "center",
field: "totalRedeemQuantity"
field: "createTime"
},
{
title: "操作",
@ -217,12 +270,15 @@ export default {
};
let deleteProduct = () => {
this.$api.marketing
.deletePointsProduct({ id: row.id })
.deleteMembershipPointsProduct({ id: row.id })
.then(res => {
this.$message.success("删除成功");
this.$refs.oTable.reload();
})
.catch(err => {});
.catch(err => {
console.error("删除积分商品失败:", err);
this.$message.error("删除失败");
});
};
return (
<div>

38
src/views/modules/marketing/points-mall/popup/commodity.vue
View File

@ -75,11 +75,11 @@ export default {
modalConfig: {
title: "请点击选择商品 (提示：最多选择5个商品)",
show: false,
width: "1000px",
width: "1000px"
},
query: {
pageNumber: 1,
pageSize: 10,
pageSize: 10
},
total: 0,
modalData: {},
@ -87,8 +87,8 @@ export default {
selectList: [],
formInline: {},
formList: {
name: "",
},
name: ""
}
};
},
methods: {
@ -97,20 +97,20 @@ export default {
.getProductPage({
p: {
pageNumber: this.query.pageNumber,
pageSize: this.query.pageSize,
pageSize: this.query.pageSize
},
...this.formInline,
...this.formList,
productFilterType: "SALE",
merchantId: JSON.parse(sessionStorage.getItem("userInfo")).merchantId,
productQuerySortParam: [],
productQuerySortParam: []
})
.then((res) => {
.then(res => {
console.log(res);
this.dataList = res.data.data.data;
this.dataList = res.data.data;
this.total = Number(res.data.data.total);
})
.catch((err) => {
.catch(err => {
this.dataList = [];
});
},
@ -124,7 +124,7 @@ export default {
this.init(cloneDeep(e));
}
return {
add: (row) => {
add: row => {
console.log(row);
this.formInline = row;
this.isAdd = true;
@ -134,13 +134,13 @@ export default {
},
update: () => {
this.isAdd = false;
},
}
};
},
init(row) {},
toggleSelection(rows) {
if (rows) {
rows.forEach((row) => {
rows.forEach(row => {
this.$refs.multipleTable.toggleRowSelection(row);
});
} else {
@ -183,7 +183,7 @@ export default {
Reset() {
this.formList = {};
this.queryList();
},
}
},
computed: {
modalHandles() {
@ -192,7 +192,7 @@ export default {
label: "取消",
handle: () => {
this.toggle();
},
}
},
{
label: "确认",
@ -200,8 +200,8 @@ export default {
handle: () => {
this.$emit("getProduct", this.selectList);
this.toggle();
},
},
}
}
];
},
tableEvent() {
@ -217,10 +217,10 @@ export default {
return;
}
this.selectList = [...records, ...reserves];
},
}
};
},
},
}
}
};
</script>

169
src/views/modules/marketing/points-mall/popup/points-product-config.vue
View File

@ -33,21 +33,15 @@
label-width="140px"
style="margin-top: 20px"
>
<el-form-item label="SKU-ID" prop="skuId">
<el-input
v-model="configForm.skuId"
placeholder="请输入SKU-ID"
:disabled="isEdit"
></el-input>
</el-form-item>
<el-form-item label="兑换所需积分设置" prop="points" required>
<el-form-item label="兑换所需积分" prop="exchangeRequiredPoints" required>
<div class="points-input">
<el-button @click="decreasePoints" :disabled="configForm.points <= 1"
<el-button
@click="decreasePoints"
:disabled="configForm.exchangeRequiredPoints <= 1"
>-</el-button
>
<el-input-number
v-model="configForm.points"
v-model="configForm.exchangeRequiredPoints"
:min="1"
:max="99999"
controls-position="right"
@ -57,15 +51,15 @@
</div>
</el-form-item>
<el-form-item label="兑换库存设置" prop="inventory" required>
<el-form-item label="兑换库存" prop="exchangeInventory" required>
<div class="inventory-input">
<el-button
@click="decreaseInventory"
:disabled="configForm.inventory <= 1"
:disabled="configForm.exchangeInventory <= 1"
>-</el-button
>
<el-input-number
v-model="configForm.inventory"
v-model="configForm.exchangeInventory"
:min="1"
:max="99999"
controls-position="right"
@ -75,35 +69,38 @@
</div>
</el-form-item>
<el-form-item
label="限制兑换（每人购买不超）"
prop="limitQuantity"
required
>
<el-form-item label="兑换限制" prop="exchangeRestrictions" required>
<div class="limit-input">
<el-button
@click="decreaseLimitQuantity"
:disabled="configForm.limitQuantity <= 0"
:disabled="configForm.exchangeRestrictions <= 0"
>-</el-button
>
<el-input-number
v-model="configForm.limitQuantity"
v-model="configForm.exchangeRestrictions"
:min="0"
:max="99999"
controls-position="right"
style="width: 200px; margin: 0 10px"
></el-input-number>
<el-button @click="increaseLimitQuantity">+</el-button>
<el-select
v-model="configForm.limitPeriod"
style="width: 100px; margin-left: 10px"
>
<el-option label="每天" value="DAY"></el-option>
<el-option label="每周" value="WEEK"></el-option>
<el-option label="每月" value="MONTH"></el-option>
</el-select>
</div>
</el-form-item>
<el-form-item
label="兑换限制类型"
prop="exchangeRestrictionsType"
required
>
<el-select
v-model="configForm.exchangeRestrictionsType"
placeholder="请选择限制类型"
style="width: 200px"
>
<el-option label="每日" :value="1"></el-option>
<el-option label="永久" :value="2"></el-option>
</el-select>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
@ -125,22 +122,27 @@ export default {
submitting: false,
productData: {},
configForm: {
skuId: "",
points: 1,
inventory: 10,
limitQuantity: 0,
limitPeriod: "DAY"
id: 0,
shopId: 0,
productId: 0,
productSpecId: 0,
exchangeRequiredPoints: 1,
exchangeInventory: 10,
exchangeRestrictions: 0,
exchangeRestrictionsType: 1
},
configRules: {
skuId: [{ required: true, message: "请输入SKU-ID", trigger: "blur" }],
points: [
{ required: true, message: "请设置兑换积分", trigger: "blur" }
exchangeRequiredPoints: [
{ required: true, message: "请设置兑换所需积分", trigger: "blur" }
],
inventory: [
exchangeInventory: [
{ required: true, message: "请设置兑换库存", trigger: "blur" }
],
limitQuantity: [
{ required: true, message: "请设置限制数量", trigger: "blur" }
exchangeRestrictions: [
{ required: true, message: "请设置兑换限制", trigger: "blur" }
],
exchangeRestrictionsType: [
{ required: true, message: "请选择兑换限制类型", trigger: "change" }
]
}
};
@ -154,20 +156,26 @@ export default {
if (editData) {
// 编辑模式，填充现有数据
this.configForm = {
skuId: editData.skuId || "",
points: editData.minPoints || 1,
inventory: editData.totalInventory || 10,
limitQuantity: editData.limitQuantity || 0,
limitPeriod: editData.limitPeriod || "DAY"
id: editData.id || 0,
shopId: editData.shopId || 0,
productId: editData.productId || 0,
productSpecId: editData.productSpecId || 0,
exchangeRequiredPoints: editData.exchangeRequiredPoints || 1,
exchangeInventory: editData.exchangeInventory || 10,
exchangeRestrictions: editData.exchangeRestrictions || 0,
exchangeRestrictionsType: editData.exchangeRestrictionsType || 1
};
} else {
// 新增模式，使用默认值
this.configForm = {
skuId: productData.skuId || "",
points: 1,
inventory: 10,
limitQuantity: 0,
limitPeriod: "DAY"
id: 0,
shopId: productData.shopId || 0,
productId: productData.productId || 0,
productSpecId: productData.productSpecId || 0,
exchangeRequiredPoints: 1,
exchangeInventory: 10,
exchangeRestrictions: 0,
exchangeRestrictionsType: 1
};
}
},
@ -178,11 +186,14 @@ export default {
resetForm() {
this.productData = {};
this.configForm = {
skuId: "",
points: 1,
inventory: 10,
limitQuantity: 0,
limitPeriod: "DAY"
id: 0,
shopId: 0,
productId: 0,
productSpecId: 0,
exchangeRequiredPoints: 1,
exchangeInventory: 10,
exchangeRestrictions: 0,
exchangeRestrictionsType: 1
};
this.isEdit = false;
this.$refs.configForm && this.$refs.configForm.clearValidate();
@ -193,46 +204,52 @@ export default {
this.submitting = true;
const submitData = {
...this.productData,
...this.configForm,
minPoints: this.configForm.points,
maxPoints: this.configForm.points,
totalInventory: this.configForm.inventory
...this.configForm
};
// 模拟API调用
setTimeout(() => {
this.$message.success(this.isEdit ? "编辑成功" : "添加成功");
this.submitting = false;
this.$emit("success", submitData);
this.handleClose();
}, 1000);
// 根据是否编辑模式调用不同的API
const apiCall = this.isEdit
? this.$api.marketing.updateMembershipPointsProduct(submitData)
: this.$api.marketing.addMembershipPointsProduct(submitData);
apiCall
.then(res => {
this.$message.success(this.isEdit ? "编辑成功" : "添加成功");
this.submitting = false;
this.$emit("success", submitData);
this.handleClose();
})
.catch(err => {
console.error("提交积分商品配置失败:", err);
this.$message.error(this.isEdit ? "编辑失败" : "添加失败");
this.submitting = false;
});
}
});
},
decreasePoints() {
if (this.configForm.points > 1) {
this.configForm.points--;
if (this.configForm.exchangeRequiredPoints > 1) {
this.configForm.exchangeRequiredPoints--;
}
},
increasePoints() {
this.configForm.points++;
this.configForm.exchangeRequiredPoints++;
},
decreaseInventory() {
if (this.configForm.inventory > 1) {
this.configForm.inventory--;
if (this.configForm.exchangeInventory > 1) {
this.configForm.exchangeInventory--;
}
},
increaseInventory() {
this.configForm.inventory++;
this.configForm.exchangeInventory++;
},
decreaseLimitQuantity() {
if (this.configForm.limitQuantity > 0) {
this.configForm.limitQuantity--;
if (this.configForm.exchangeRestrictions > 0) {
this.configForm.exchangeRestrictions--;
}
},
increaseLimitQuantity() {
this.configForm.limitQuantity++;
this.configForm.exchangeRestrictions++;
}
}
};

93
src/views/modules/marketing/points-mall/popup/product-selector.vue
View File

@ -10,11 +10,7 @@
<div class="search-form">
<el-form :inline="true" :model="searchForm" class="demo-form-inline">
<el-form-item label="店铺">
<el-select
v-model="searchForm.shopId"
placeholder="请选择店铺"
disabled
>
<el-select v-model="searchForm.shopId" placeholder="请选择店铺">
<el-option
v-for="item in storeList"
:key="item.shopId"
@ -53,29 +49,14 @@
style="width: 100%"
v-loading="loading"
>
<el-table-column
prop="shopName"
label="商品店铺"
align="center"
width="150"
>
<el-table-column prop="shopId" label="商品店铺" align="center">
</el-table-column>
<el-table-column prop="productName" label="商品名称" align="center">
<el-table-column prop="name" label="商品名称" align="center">
</el-table-column>
<el-table-column
prop="productId"
label="商品ID"
align="center"
width="120"
>
<el-table-column prop="id" label="商品ID" align="center">
</el-table-column>
<el-table-column
prop="price"
label="商品价格"
align="center"
width="100"
>
<template slot-scope="scope"> ¥{{ scope.row.price }} </template>
<el-table-column prop="salePrice" label="商品价格" align="center">
<template slot-scope="scope"> ¥{{ scope.row.salePrice }} </template>
</el-table-column>
<el-table-column label="操作" align="center" width="150">
<template slot-scope="scope">
@ -148,9 +129,14 @@ export default {
};
},
methods: {
show(shopId) {
show(shopIdList) {
this.visible = true;
this.searchForm.shopId = shopId;
// 如果传入的是数组，取第一个作为默认选中，如果是单个值则直接使用
if (Array.isArray(shopIdList) && shopIdList.length > 0) {
this.searchForm.shopId = shopIdList[0];
} else if (shopIdList) {
this.searchForm.shopId = shopIdList;
}
this.loadProducts();
},
handleClose() {
@ -181,34 +167,33 @@ export default {
},
loadProducts() {
this.loading = true;
// 模拟API调用 - 实际应该调用商品列表API
setTimeout(() => {
this.productList = [
{
productId: "1212",
productName: "猪肉",
shopName: "猪肉铺",
price: "2.00",
skuId: "194105142774503836"
// 调用真实的商品分页API
this.$api.mer_admin
.getProductPage({
p: {
pageNumber: this.pagination.currentPage,
pageSize: this.pagination.pageSize
},
{
productId: "1213",
productName: "牛肉",
shopName: "牛肉铺",
price: "5.00",
skuId: "194105142774503837"
},
{
productId: "1214",
productName: "鸡肉",
shopName: "鸡肉铺",
price: "3.00",
skuId: "194105142774503838"
}
];
this.pagination.total = 3;
this.loading = false;
}, 500);
shopId: this.searchForm.shopId,
productName: this.searchForm.productName,
productId: this.searchForm.productId,
productFilterType: "SALE",
merchantId: JSON.parse(sessionStorage.getItem("userInfo")).merchantId,
productQuerySortParam: []
})
.then(res => {
console.log("商品列表:", res);
this.productList = res.data.data.data || [];
this.pagination.total = Number(res.data.data.total || 0);
this.loading = false;
})
.catch(err => {
console.error("获取商品列表失败:", err);
this.productList = [];
this.pagination.total = 0;
this.loading = false;
this.$message.error("获取商品列表失败");
});
},
handleSizeChange(val) {
this.pagination.pageSize = val;

2
src/views/modules/marketing/user/popup/view-details.vue
View File

@ -19,7 +19,7 @@
</div>
<div class="info-item">
<span class="label">系统编号：</span>
<span class="value">{{ modalData.userId || "-" }}</span>
<span class="value">{{ modalData.id || "-" }}</span>
</div>
<div class="info-item">
<span class="label">手机号：</span>