feat: 积分商品对接完成

This commit is contained in:
lzhizhao 2025-08-17 10:19:24 +08:00
parent 5c200241a8
commit 70133838a0
2 changed files with 318 additions and 63 deletions

View File

@ -240,5 +240,23 @@ export const marketing = {
method: "post", method: "post",
data data
}); });
},
// 双倍积分商品列表
getDoublePointsProductPage: data => {
return $http.request({
url: `/merchant-api/product/double-points/page`,
method: "post",
data
});
},
// 双倍积分商品启用/禁用状态切换
changeEnableDoublePointsProduct: data => {
return $http.request({
url: `/merchant-api/product/change/enable/double-points`,
method: "post",
data
});
} }
}; };

View File

@ -1,70 +1,165 @@
<template> <template>
<div style="height: calc(100vh - 200px)"> <div style="height: calc(100vh - 200px)">
<obj-table-plus <!-- Tab切换组件 -->
ref="oTable" <el-tabs v-model="activeTab" @tab-click="handleTabClick">
style="height: 100%" <!-- 积分优惠Tab -->
:tableCols="tableCols" <el-tab-pane label="积分优惠" name="points-discount">
:tableProp="tableProp" <obj-table-plus
@query="queryList" ref="oTable"
v-model="dataList" style="height: calc(100vh - 280px)"
:tableEvent="tableEvent" :tableCols="tableCols"
:enableAutoQuery="false" :tableProp="tableProp"
> @query="queryList"
<template slot="tableTop"> v-model="dataList"
<el-form :inline="true" :model="formInline" class="demo-form-inline"> :tableEvent="tableEvent"
<el-form-item v-if="storeList.length > 1" label="商铺"> :enableAutoQuery="false"
<el-select >
v-model="formInline.shopIdList" <template slot="tableTop">
placeholder="请选择商铺" <el-form
multiple :inline="true"
collapse-tags :model="formInline"
style="width: 200px" class="demo-form-inline"
> >
<el-option <el-form-item v-if="storeList.length > 1" label="商铺">
v-for="item in storeList" <el-select
:key="item.shopId" v-model="formInline.shopIdList"
:label="item.shopName" placeholder="请选择商铺"
:value="item.shopId" multiple
collapse-tags
style="width: 200px"
>
<el-option
v-for="item in storeList"
:key="item.shopId"
:label="item.shopName"
:value="item.shopId"
>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="商品ID">
<el-input
placeholder="请输入商品ID"
v-model="formInline.productId"
></el-input>
</el-form-item>
<el-form-item label="商品名称">
<el-input
placeholder="请输入商品名称"
v-model="formInline.productName"
></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="$refs.oTable.reload()"
>查询</el-button
>
<el-button type="primary" @click="reset">重置</el-button>
</el-form-item>
</el-form>
<div class="mb-2">
<el-button @click="add" type="primary" size="small"
>+添加</el-button
> >
</el-option> </div>
</el-select> </template>
</el-form-item> </obj-table-plus>
<el-form-item label="商品ID"> <!-- 商品选择弹框 -->
<el-input <product-selector
placeholder="请输入商品ID" :storeList="storeList"
v-model="formInline.productId" @success="$refs.oTable.reload()"
></el-input> ref="productSelector"
</el-form-item> ></product-selector>
<el-form-item label="商品名称">
<el-input <!-- 积分商品配置弹框 -->
placeholder="请输入商品名称" <points-product-config
v-model="formInline.productName" @success="$refs.oTable.reload()"
></el-input> ref="pointsProductConfig"
</el-form-item> ></points-product-config>
<el-form-item> </el-tab-pane>
<el-button type="primary" @click="$refs.oTable.reload()"
>查询</el-button <!-- 双倍积分Tab -->
> <el-tab-pane label="双倍积分" name="double-points">
<el-button type="primary" @click="reset">重置</el-button> <obj-table-plus
</el-form-item> ref="doublePointsTable"
</el-form> style="height: calc(100vh - 280px)"
<div class="mb-2"> :tableCols="doublePointsTableCols"
<el-button @click="add" type="primary" size="small">+添加</el-button> :tableProp="doublePointsTableProp"
</div> @query="queryDoublePointsList"
</template> v-model="doublePointsDataList"
</obj-table-plus> :tableEvent="doublePointsTableEvent"
<!-- 商品选择弹框 --> :enableAutoQuery="false"
<product-selector >
:storeList="storeList" <template slot="tableTop">
@success="$refs.oTable.reload()" <el-form
ref="productSelector" :inline="true"
></product-selector> :model="doublePointsFormInline"
class="demo-form-inline"
>
<el-form-item v-if="storeList.length > 1" label="商铺">
<el-select
v-model="doublePointsFormInline.shopIdList"
placeholder="请选择商铺"
multiple
collapse-tags
style="width: 200px"
>
<el-option
v-for="item in storeList"
:key="item.shopId"
:label="item.shopName"
:value="item.shopId"
>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="店铺名称">
<el-input
v-model="doublePointsFormInline.shopName"
placeholder="请输入店铺名称"
clearable
style="width: 200px"
></el-input>
</el-form-item>
<el-form-item label="商品名称">
<el-input
v-model="doublePointsFormInline.productName"
placeholder="请输入商品名称"
clearable
style="width: 200px"
></el-input>
</el-form-item>
<el-form-item label="商品ID">
<el-input
v-model="doublePointsFormInline.id"
placeholder="请输入商品ID"
clearable
style="width: 200px"
></el-input>
</el-form-item>
<el-form-item label="是否启用双倍积分">
<el-select
v-model="doublePointsFormInline.enableDoublePoints"
placeholder="请选择"
clearable
style="width: 150px"
>
<el-option label="全部" :value="null"></el-option>
<el-option label="已启用" :value="true"></el-option>
<el-option label="未启用" :value="false"></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="getDoublePointsDataList()"
>查询</el-button
>
<el-button @click="resetDoublePoints()">重置</el-button>
</el-form-item>
</el-form>
</template>
</obj-table-plus>
</el-tab-pane>
</el-tabs>
<!-- 积分商品配置弹框 -->
<points-product-config
@success="$refs.oTable.reload()"
ref="pointsProductConfig"
></points-product-config>
<!-- 查看详情 --> <!-- 查看详情 -->
<!-- <viewDetails ref="viewDetails"></viewDetails> --> <!-- <viewDetails ref="viewDetails"></viewDetails> -->
</div> </div>
@ -81,6 +176,7 @@ export default {
}, },
data() { data() {
return { return {
activeTab: "points-discount", // tab
dataList: [], dataList: [],
formInline: { formInline: {
marketId: "", marketId: "",
@ -101,7 +197,23 @@ export default {
}, },
productFilterType: "SALE", productFilterType: "SALE",
selectList: [], selectList: [],
value1: [] value1: [],
//
doublePointsDataList: [],
doublePointsFormInline: {
shopIdList: [],
shopName: "",
productName: "",
id: "",
enableDoublePoints: null
},
doublePointsTableProp: {
"auto-resize": true,
border: true,
height: "auto",
"row-id": "id",
"show-overflow": false
}
}; };
}, },
created() { created() {
@ -207,6 +319,76 @@ export default {
productSpecName: "" productSpecName: ""
}; };
this.$refs.oTable.reload(); this.$refs.oTable.reload();
},
// Tab
handleTabClick(tab) {
if (tab.name === "double-points") {
this.$nextTick(() => {
this.$refs.doublePointsTable.reload();
});
}
},
//
queryDoublePointsList(pageNo, pageSize) {
const queryParams = {
shopIdList: this.doublePointsFormInline.shopIdList || [],
shopName: this.doublePointsFormInline.shopName || "",
productName: this.doublePointsFormInline.productName || "",
id: this.doublePointsFormInline.id || "",
enableDoublePoints: this.doublePointsFormInline.enableDoublePoints
};
// enableDoublePointsnull
if (queryParams.enableDoublePoints === null) {
delete queryParams.enableDoublePoints;
}
this.$api.marketing
.getDoublePointsProductPage(queryParams)
.then(res => {
console.log("双倍积分列表:", res);
this.$refs.doublePointsTable.complete(
res.data.data.data || [],
res.data.data.data ? res.data.data.data.length : 0
);
})
.catch(err => {
console.error("查询双倍积分商品失败:", err);
this.$refs.doublePointsTable.complete(false);
});
},
getDoublePointsDataList() {
this.$refs.doublePointsTable.reload();
},
resetDoublePoints() {
this.doublePointsFormInline = {
shopIdList: [],
shopName: "",
productName: "",
id: "",
enableDoublePoints: null
};
this.$refs.doublePointsTable.reload();
},
handleDoublePointsEnableChange(row) {
// 使/
const changeData = {
id: row.id,
enableDoublePoints: row.enableDoublePoints
};
this.$api.marketing
.changeEnableDoublePointsProduct(changeData)
.then(() => {
this.$message.success("状态切换成功");
this.$refs.doublePointsTable.reload();
})
.catch(err => {
console.error("状态切换失败:", err);
this.$message.error("状态切换失败");
//
row.enableDoublePoints = !row.enableDoublePoints;
});
} }
}, },
computed: { computed: {
@ -366,6 +548,58 @@ export default {
} }
]; ];
}, },
//
doublePointsTableCols() {
return [
{
title: "商品ID",
align: "center",
field: "id"
},
{
title: "商品名称",
align: "center",
field: "productName"
},
{
title: "归属店铺",
align: "center",
field: "shopName"
},
{
title: "商品原价",
align: "center",
field: "marketPrice",
type: "jsx",
render: ({ row }) => {
return <span>¥{row.marketPrice}</span>;
}
},
{
title: "原有商品状态",
align: "center",
field: "productStatus",
type: "jsx",
render: ({ row }) => {
return <span>{row.productStatus === "UP" ? "上架" : "下架"}</span>;
}
},
{
title: "是否启用",
align: "center",
field: "enableDoublePoints",
type: "jsx",
render: ({ row }) => {
return (
<el-switch
v-model={row.enableDoublePoints}
onChange={() => this.handleDoublePointsEnableChange(row)}
></el-switch>
);
}
}
];
},
tableEvent() { tableEvent() {
return { return {
"checkbox-all": ({ records, reserves }) => { "checkbox-all": ({ records, reserves }) => {
@ -376,6 +610,9 @@ export default {
} }
}; };
}, },
doublePointsTableEvent() {
return {};
},
...mapState("userData", [ ...mapState("userData", [
"isMerchant", "isMerchant",
"marketList", "marketList",