feat: 积分商品增删改
This commit is contained in:
parent
f0bc66d982
commit
5ea8ca7e63
|
@ -112,21 +112,37 @@ export default {
|
||||||
: 2,
|
: 2,
|
||||||
marketId: this.marketId,
|
marketId: this.marketId,
|
||||||
shopId: this.shopId,
|
shopId: this.shopId,
|
||||||
shopIdList: this.shopId ? [this.shopId] : []
|
shopIdList: [] // 初始为空,等待storeList加载完成后设置
|
||||||
};
|
};
|
||||||
this.$nextTick(() => {
|
this.$nextTick(() => {
|
||||||
this.$refs.oTable.reload();
|
this.$refs.oTable.reload();
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
watch: {
|
||||||
|
// 监听storeList变化,设置默认选择所有店铺
|
||||||
|
storeList: {
|
||||||
|
handler(newStoreList) {
|
||||||
|
if (
|
||||||
|
newStoreList &&
|
||||||
|
newStoreList.length > 0 &&
|
||||||
|
this.formInline.shopIdList.length === 0
|
||||||
|
) {
|
||||||
|
// 默认选择所有店铺
|
||||||
|
this.formInline.shopIdList = newStoreList.map(store => store.shopId);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
immediate: true // 立即执行一次
|
||||||
|
}
|
||||||
|
},
|
||||||
methods: {
|
methods: {
|
||||||
queryList(pageNo, pageSize) {
|
queryList(pageNo, pageSize) {
|
||||||
// 使用新的积分商品分页接口
|
// 使用新的积分商品分页接口
|
||||||
const queryParams = {
|
const queryParams = {
|
||||||
shopIdList: this.formInline.shopIdList || [],
|
shopIdList: this.formInline.shopIdList || [],
|
||||||
productId: this.formInline.productId || 0,
|
productId: this.formInline.productId || "",
|
||||||
productName: this.formInline.productName || "",
|
productName: this.formInline.productName || "",
|
||||||
productSpecId: this.formInline.productSpecId || 0,
|
// productSpecId: this.formInline.productSpecId || "",
|
||||||
productSpecName: this.formInline.productSpecName || "",
|
// productSpecName: this.formInline.productSpecName || "",
|
||||||
// 添加分页参数以备后续使用
|
// 添加分页参数以备后续使用
|
||||||
pageNumber: pageNo,
|
pageNumber: pageNo,
|
||||||
pageSize: pageSize
|
pageSize: pageSize
|
||||||
|
@ -136,7 +152,10 @@ export default {
|
||||||
.membershipPointsProductPage(queryParams)
|
.membershipPointsProductPage(queryParams)
|
||||||
.then(res => {
|
.then(res => {
|
||||||
console.log(res);
|
console.log(res);
|
||||||
this.$refs.oTable.complete(res.data || [], Number(res.total || 0));
|
this.$refs.oTable.complete(
|
||||||
|
res.data.data.data || [],
|
||||||
|
Number(res.data.data.total || 0)
|
||||||
|
);
|
||||||
})
|
})
|
||||||
.catch(err => {
|
.catch(err => {
|
||||||
console.error("查询积分商品失败:", err);
|
console.error("查询积分商品失败:", err);
|
||||||
|
@ -161,7 +180,7 @@ export default {
|
||||||
: 2,
|
: 2,
|
||||||
marketId: this.marketId,
|
marketId: this.marketId,
|
||||||
shopId: this.shopId,
|
shopId: this.shopId,
|
||||||
shopIdList: this.shopId ? [this.shopId] : [],
|
shopIdList: this.storeList.map(store => store.shopId), // 重置时也选择所有店铺
|
||||||
productId: "",
|
productId: "",
|
||||||
productName: "",
|
productName: "",
|
||||||
productSpecId: "",
|
productSpecId: "",
|
||||||
|
@ -251,22 +270,27 @@ export default {
|
||||||
width: "200px",
|
width: "200px",
|
||||||
render: ({ row }) => {
|
render: ({ row }) => {
|
||||||
let edit = () => {
|
let edit = () => {
|
||||||
this.$api.marketing
|
// 直接使用列表数据,不调用详情接口
|
||||||
.PointsProductDetail({
|
const productData = {
|
||||||
id: row.id
|
productId: row.productId,
|
||||||
})
|
productName: row.productName,
|
||||||
.then(res => {
|
shopName: row.shopName,
|
||||||
const productData = {
|
productSpecName: row.productSpecName
|
||||||
productId: row.productId,
|
};
|
||||||
productName: row.productName,
|
|
||||||
shopName: row.shopName
|
// 直接使用列表中的数据作为编辑数据
|
||||||
};
|
const editData = {
|
||||||
this.$refs.pointsProductConfig.show(
|
id: row.id,
|
||||||
productData,
|
shopId: row.shopId,
|
||||||
res.data.data
|
productId: row.productId,
|
||||||
);
|
productSpecId: row.productSpecId,
|
||||||
})
|
exchangeRequiredPoints: row.exchangeRequiredPoints,
|
||||||
.catch(err => {});
|
exchangeInventory: row.exchangeInventory,
|
||||||
|
exchangeRestrictions: row.exchangeRestrictions,
|
||||||
|
exchangeRestrictionsType: row.exchangeRestrictionsType
|
||||||
|
};
|
||||||
|
|
||||||
|
this.$refs.pointsProductConfig.show(productData, editData);
|
||||||
};
|
};
|
||||||
let deleteProduct = () => {
|
let deleteProduct = () => {
|
||||||
this.$api.marketing
|
this.$api.marketing
|
||||||
|
|
|
@ -7,20 +7,44 @@
|
||||||
:close-on-click-modal="false"
|
:close-on-click-modal="false"
|
||||||
@close="handleClose"
|
@close="handleClose"
|
||||||
>
|
>
|
||||||
<!-- 已选择商品信息 -->
|
<!-- 商品信息显示 -->
|
||||||
<div class="selected-product" v-if="!isEdit">
|
<div class="selected-product">
|
||||||
<div class="product-info">
|
<div class="product-info">
|
||||||
<div class="info-item">
|
<div class="info-item">
|
||||||
<span class="label">商品ID:</span>
|
<span class="label">商品ID:</span>
|
||||||
<span class="value">{{ productData.productId }}</span>
|
<span class="value">{{
|
||||||
|
isEdit ? editProductData.productId : productData.id
|
||||||
|
}}</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="info-item">
|
<div class="info-item">
|
||||||
<span class="label">商品名称:</span>
|
<span class="label">商品名称:</span>
|
||||||
<span class="value">{{ productData.productName }}</span>
|
<span class="value">{{
|
||||||
|
isEdit ? editProductData.productName : productData.name
|
||||||
|
}}</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="info-item">
|
<div class="info-item">
|
||||||
<span class="label">归属摊位:</span>
|
<span class="label">归属摊位:</span>
|
||||||
<span class="value">{{ productData.shopName }}</span>
|
<span class="value">{{
|
||||||
|
isEdit ? editProductData.shopName : productData.shopId
|
||||||
|
}}</span>
|
||||||
|
</div>
|
||||||
|
<div class="info-item" v-if="!isEdit && productData.description">
|
||||||
|
<span class="label">商品描述:</span>
|
||||||
|
<span class="value">{{ productData.description }}</span>
|
||||||
|
</div>
|
||||||
|
<div class="info-item" v-if="!isEdit">
|
||||||
|
<span class="label">价格范围:</span>
|
||||||
|
<span class="value"
|
||||||
|
>¥{{ productData.minSalePrice }} - ¥{{
|
||||||
|
productData.maxSalePrice
|
||||||
|
}}</span
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
<div class="info-item" v-if="isEdit">
|
||||||
|
<span class="label">商品规格:</span>
|
||||||
|
<span class="value">{{
|
||||||
|
editProductData.productSpecName || "默认规格"
|
||||||
|
}}</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -29,10 +53,37 @@
|
||||||
<el-form
|
<el-form
|
||||||
ref="configForm"
|
ref="configForm"
|
||||||
:model="configForm"
|
:model="configForm"
|
||||||
:rules="configRules"
|
:rules="dynamicRules"
|
||||||
label-width="140px"
|
label-width="140px"
|
||||||
style="margin-top: 20px"
|
style="margin-top: 20px"
|
||||||
>
|
>
|
||||||
|
<!-- 商品规格选择 -->
|
||||||
|
<el-form-item
|
||||||
|
label="商品规格"
|
||||||
|
prop="productSpecId"
|
||||||
|
required
|
||||||
|
v-if="!isEdit && productSpecificationList.length > 0"
|
||||||
|
>
|
||||||
|
<el-select
|
||||||
|
v-model="configForm.productSpecId"
|
||||||
|
placeholder="请选择商品规格"
|
||||||
|
style="width: 100%"
|
||||||
|
@change="handleSpecChange"
|
||||||
|
>
|
||||||
|
<el-option
|
||||||
|
v-for="spec in productSpecificationList"
|
||||||
|
:key="spec.id"
|
||||||
|
:label="`${spec.attributeValue} - ¥${spec.salePrice}`"
|
||||||
|
:value="spec.id"
|
||||||
|
>
|
||||||
|
<span style="float: left">{{ spec.attributeValue }}</span>
|
||||||
|
<span style="float: right; color: #8492a6; font-size: 13px"
|
||||||
|
>¥{{ spec.salePrice }}</span
|
||||||
|
>
|
||||||
|
</el-option>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
|
||||||
<el-form-item label="兑换所需积分" prop="exchangeRequiredPoints" required>
|
<el-form-item label="兑换所需积分" prop="exchangeRequiredPoints" required>
|
||||||
<div class="points-input">
|
<div class="points-input">
|
||||||
<el-button
|
<el-button
|
||||||
|
@ -121,11 +172,13 @@ export default {
|
||||||
isEdit: false,
|
isEdit: false,
|
||||||
submitting: false,
|
submitting: false,
|
||||||
productData: {},
|
productData: {},
|
||||||
|
editProductData: {}, // 编辑模式下的商品数据
|
||||||
|
productSpecificationList: [],
|
||||||
configForm: {
|
configForm: {
|
||||||
id: 0,
|
id: undefined,
|
||||||
shopId: 0,
|
shopId: undefined,
|
||||||
productId: 0,
|
productId: undefined,
|
||||||
productSpecId: 0,
|
productSpecId: undefined,
|
||||||
exchangeRequiredPoints: 1,
|
exchangeRequiredPoints: 1,
|
||||||
exchangeInventory: 10,
|
exchangeInventory: 10,
|
||||||
exchangeRestrictions: 0,
|
exchangeRestrictions: 0,
|
||||||
|
@ -147,19 +200,58 @@ export default {
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
|
computed: {
|
||||||
|
// 动态验证规则
|
||||||
|
dynamicRules() {
|
||||||
|
const rules = {
|
||||||
|
exchangeRequiredPoints: [
|
||||||
|
{ required: true, message: "请设置兑换所需积分", trigger: "blur" }
|
||||||
|
],
|
||||||
|
exchangeInventory: [
|
||||||
|
{ required: true, message: "请设置兑换库存", trigger: "blur" }
|
||||||
|
],
|
||||||
|
exchangeRestrictions: [
|
||||||
|
{ required: true, message: "请设置兑换限制", trigger: "blur" }
|
||||||
|
],
|
||||||
|
exchangeRestrictionsType: [
|
||||||
|
{ required: true, message: "请选择兑换限制类型", trigger: "change" }
|
||||||
|
]
|
||||||
|
};
|
||||||
|
|
||||||
|
// 新增模式且有多个规格时,需要验证规格选择
|
||||||
|
if (!this.isEdit && this.productSpecificationList.length > 1) {
|
||||||
|
rules.productSpecId = [
|
||||||
|
{ required: true, message: "请选择商品规格", trigger: "change" }
|
||||||
|
];
|
||||||
|
}
|
||||||
|
|
||||||
|
return rules;
|
||||||
|
}
|
||||||
|
},
|
||||||
methods: {
|
methods: {
|
||||||
show(productData, editData = null) {
|
show(productData, editData = null) {
|
||||||
this.visible = true;
|
this.visible = true;
|
||||||
this.isEdit = !!editData;
|
this.isEdit = !!editData;
|
||||||
this.productData = productData;
|
this.productData = productData;
|
||||||
|
|
||||||
|
// 设置商品规格列表
|
||||||
|
this.productSpecificationList =
|
||||||
|
productData.productSpecificationList || [];
|
||||||
|
|
||||||
if (editData) {
|
if (editData) {
|
||||||
// 编辑模式,填充现有数据
|
// 编辑模式,填充现有数据
|
||||||
|
this.editProductData = {
|
||||||
|
productId: productData.productId,
|
||||||
|
productName: productData.productName,
|
||||||
|
shopName: productData.shopName,
|
||||||
|
productSpecName: productData.productSpecName
|
||||||
|
};
|
||||||
|
|
||||||
this.configForm = {
|
this.configForm = {
|
||||||
id: editData.id || 0,
|
id: editData.id || undefined,
|
||||||
shopId: editData.shopId || 0,
|
shopId: editData.shopId || undefined,
|
||||||
productId: editData.productId || 0,
|
productId: editData.productId || undefined,
|
||||||
productSpecId: editData.productSpecId || 0,
|
productSpecId: editData.productSpecId || undefined,
|
||||||
exchangeRequiredPoints: editData.exchangeRequiredPoints || 1,
|
exchangeRequiredPoints: editData.exchangeRequiredPoints || 1,
|
||||||
exchangeInventory: editData.exchangeInventory || 10,
|
exchangeInventory: editData.exchangeInventory || 10,
|
||||||
exchangeRestrictions: editData.exchangeRestrictions || 0,
|
exchangeRestrictions: editData.exchangeRestrictions || 0,
|
||||||
|
@ -167,11 +259,16 @@ export default {
|
||||||
};
|
};
|
||||||
} else {
|
} else {
|
||||||
// 新增模式,使用默认值
|
// 新增模式,使用默认值
|
||||||
|
const defaultSpecId =
|
||||||
|
this.productSpecificationList.length === 1
|
||||||
|
? this.productSpecificationList[0].id
|
||||||
|
: undefined;
|
||||||
|
|
||||||
this.configForm = {
|
this.configForm = {
|
||||||
id: 0,
|
id: undefined,
|
||||||
shopId: productData.shopId || 0,
|
shopId: productData.shopId || undefined,
|
||||||
productId: productData.productId || 0,
|
productId: productData.id || undefined,
|
||||||
productSpecId: productData.productSpecId || 0,
|
productSpecId: defaultSpecId,
|
||||||
exchangeRequiredPoints: 1,
|
exchangeRequiredPoints: 1,
|
||||||
exchangeInventory: 10,
|
exchangeInventory: 10,
|
||||||
exchangeRestrictions: 0,
|
exchangeRestrictions: 0,
|
||||||
|
@ -185,11 +282,13 @@ export default {
|
||||||
},
|
},
|
||||||
resetForm() {
|
resetForm() {
|
||||||
this.productData = {};
|
this.productData = {};
|
||||||
|
this.editProductData = {};
|
||||||
|
this.productSpecificationList = [];
|
||||||
this.configForm = {
|
this.configForm = {
|
||||||
id: 0,
|
id: undefined,
|
||||||
shopId: 0,
|
shopId: undefined,
|
||||||
productId: 0,
|
productId: undefined,
|
||||||
productSpecId: 0,
|
productSpecId: undefined,
|
||||||
exchangeRequiredPoints: 1,
|
exchangeRequiredPoints: 1,
|
||||||
exchangeInventory: 10,
|
exchangeInventory: 10,
|
||||||
exchangeRestrictions: 0,
|
exchangeRestrictions: 0,
|
||||||
|
@ -206,6 +305,7 @@ export default {
|
||||||
const submitData = {
|
const submitData = {
|
||||||
...this.configForm
|
...this.configForm
|
||||||
};
|
};
|
||||||
|
console.log(submitData);
|
||||||
|
|
||||||
// 根据是否编辑模式调用不同的API
|
// 根据是否编辑模式调用不同的API
|
||||||
const apiCall = this.isEdit
|
const apiCall = this.isEdit
|
||||||
|
@ -250,6 +350,18 @@ export default {
|
||||||
},
|
},
|
||||||
increaseLimitQuantity() {
|
increaseLimitQuantity() {
|
||||||
this.configForm.exchangeRestrictions++;
|
this.configForm.exchangeRestrictions++;
|
||||||
|
},
|
||||||
|
// 处理规格选择变化
|
||||||
|
handleSpecChange(specId) {
|
||||||
|
const selectedSpec = this.productSpecificationList.find(
|
||||||
|
spec => spec.id === specId
|
||||||
|
);
|
||||||
|
if (selectedSpec) {
|
||||||
|
// 可以根据选中的规格自动设置一些默认值
|
||||||
|
console.log("选中的规格:", selectedSpec);
|
||||||
|
// 例如:根据规格的库存设置默认兑换库存
|
||||||
|
// this.configForm.exchangeInventory = Math.min(selectedSpec.stockNum, 10);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
|
@ -9,7 +9,7 @@
|
||||||
<!-- 查询条件 -->
|
<!-- 查询条件 -->
|
||||||
<div class="search-form">
|
<div class="search-form">
|
||||||
<el-form :inline="true" :model="searchForm" class="demo-form-inline">
|
<el-form :inline="true" :model="searchForm" class="demo-form-inline">
|
||||||
<el-form-item label="店铺">
|
<el-form-item label="店铺" v-if="storeList.length">
|
||||||
<el-select v-model="searchForm.shopId" placeholder="请选择店铺">
|
<el-select v-model="searchForm.shopId" placeholder="请选择店铺">
|
||||||
<el-option
|
<el-option
|
||||||
v-for="item in storeList"
|
v-for="item in storeList"
|
||||||
|
@ -58,6 +58,30 @@
|
||||||
<el-table-column prop="salePrice" label="商品价格" align="center">
|
<el-table-column prop="salePrice" label="商品价格" align="center">
|
||||||
<template slot-scope="scope"> ¥{{ scope.row.salePrice }} </template>
|
<template slot-scope="scope"> ¥{{ scope.row.salePrice }} </template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
|
<el-table-column label="规格" align="center" width="120">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<span
|
||||||
|
v-if="
|
||||||
|
scope.row.productSpecificationList &&
|
||||||
|
scope.row.productSpecificationList.length <= 1
|
||||||
|
"
|
||||||
|
>
|
||||||
|
{{
|
||||||
|
scope.row.productSpecificationList[0]?.attributeValue ||
|
||||||
|
"默认规格"
|
||||||
|
}}
|
||||||
|
</span>
|
||||||
|
<span
|
||||||
|
v-else-if="
|
||||||
|
scope.row.productSpecificationList &&
|
||||||
|
scope.row.productSpecificationList.length > 1
|
||||||
|
"
|
||||||
|
>
|
||||||
|
多规格
|
||||||
|
</span>
|
||||||
|
<span v-else>默认规格</span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
<el-table-column label="操作" align="center" width="150">
|
<el-table-column label="操作" align="center" width="150">
|
||||||
<template slot-scope="scope">
|
<template slot-scope="scope">
|
||||||
<el-button
|
<el-button
|
||||||
|
|
Loading…
Reference in New Issue