mirror of
https://gitee.com/beijing_hongye_huicheng/lilishop-ui.git
synced 2026-02-04 08:05:54 +08:00
feat(商品参数): 优化销售模式处理及商品参数验证逻辑
This commit is contained in:
@@ -43,7 +43,7 @@
|
|||||||
</FormItem>
|
</FormItem>
|
||||||
<FormItem class="form-item-view-el" label="销售模式" prop="salesModel">
|
<FormItem class="form-item-view-el" label="销售模式" prop="salesModel">
|
||||||
<RadioGroup v-if="baseInfoForm.goodsType != 'VIRTUAL_GOODS'" v-model="baseInfoForm.salesModel"
|
<RadioGroup v-if="baseInfoForm.goodsType != 'VIRTUAL_GOODS'" v-model="baseInfoForm.salesModel"
|
||||||
button-style="solid" type="button" @on-change="renderTableData(skuTableData)">
|
button-style="solid" type="button" @on-change="handleSalesModeChange">
|
||||||
<Radio label="RETAIL" title="零售型">零售型</Radio>
|
<Radio label="RETAIL" title="零售型">零售型</Radio>
|
||||||
<Radio label="WHOLESALE" title="批发型">批发型</Radio>
|
<Radio label="WHOLESALE" title="批发型">批发型</Radio>
|
||||||
</RadioGroup>
|
</RadioGroup>
|
||||||
@@ -394,9 +394,10 @@
|
|||||||
<div class="form-item-view">
|
<div class="form-item-view">
|
||||||
<FormItem v-for="(paramsItem, paramsIndex) in goodsParams" :key="paramsItem.id || paramsIndex"
|
<FormItem v-for="(paramsItem, paramsIndex) in goodsParams" :key="paramsItem.id || paramsIndex"
|
||||||
:label="`${paramsItem.paramName}:`"
|
:label="`${paramsItem.paramName}:`"
|
||||||
:rules="{ required: !!paramsItem.required, message: '参数不能为空', trigger: 'change' }">
|
:prop="`goodsParams.${paramsIndex}.paramValue`"
|
||||||
<Select v-model="paramsItem.paramValue" clearable placeholder="请选择" style="width: 200px"
|
:rules="paramsItem.required ? { required: true, message: `${paramsItem.paramName}不能为空`, trigger: 'change' } : {}">
|
||||||
@on-change="(val) => selectParams(paramsItem, val)">
|
<Select v-model="baseInfoForm.goodsParams[paramsIndex].paramValue" clearable placeholder="请选择" style="width: 200px"
|
||||||
|
@on-change="(val) => selectParams(paramsItem, val, paramsIndex)">
|
||||||
<Option v-for="option in getParamOptions(paramsItem.options)" :key="option" :label="option"
|
<Option v-for="option in getParamOptions(paramsItem.options)" :key="option" :label="option"
|
||||||
:value="option">
|
:value="option">
|
||||||
</Option>
|
</Option>
|
||||||
@@ -578,6 +579,8 @@ export default {
|
|||||||
/** 商品分类中文名 */
|
/** 商品分类中文名 */
|
||||||
categoryName: [],
|
categoryName: [],
|
||||||
goodsVideo: "",
|
goodsVideo: "",
|
||||||
|
/** 商品参数用于验证 */
|
||||||
|
goodsParams: [],
|
||||||
},
|
},
|
||||||
/** 表格头 */
|
/** 表格头 */
|
||||||
skuTableColumn: [],
|
skuTableColumn: [],
|
||||||
@@ -740,10 +743,24 @@ export default {
|
|||||||
.map((i) => i.trim())
|
.map((i) => i.trim())
|
||||||
.filter((i) => i);
|
.filter((i) => i);
|
||||||
},
|
},
|
||||||
selectParams(params, value) {
|
selectParams(params, value, paramsIndex) {
|
||||||
if (!Array.isArray(this.baseInfoForm.goodsParamsDTOList)) {
|
if (!Array.isArray(this.baseInfoForm.goodsParamsDTOList)) {
|
||||||
this.$set(this.baseInfoForm, "goodsParamsDTOList", []);
|
this.$set(this.baseInfoForm, "goodsParamsDTOList", []);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 确保baseInfoForm.goodsParams存在
|
||||||
|
if (!Array.isArray(this.baseInfoForm.goodsParams)) {
|
||||||
|
this.$set(this.baseInfoForm, "goodsParams", []);
|
||||||
|
}
|
||||||
|
|
||||||
|
// 确保对应索引的参数项存在
|
||||||
|
if (!this.baseInfoForm.goodsParams[paramsIndex]) {
|
||||||
|
this.$set(this.baseInfoForm.goodsParams, paramsIndex, {});
|
||||||
|
}
|
||||||
|
|
||||||
|
// 更新baseInfoForm中的值用于验证
|
||||||
|
this.$set(this.baseInfoForm.goodsParams[paramsIndex], 'paramValue', value || '');
|
||||||
|
|
||||||
const list = this.baseInfoForm.goodsParamsDTOList;
|
const list = this.baseInfoForm.goodsParamsDTOList;
|
||||||
const paramId = params && params.id ? String(params.id) : "";
|
const paramId = params && params.id ? String(params.id) : "";
|
||||||
const index = list.findIndex((i) => String(i.paramId) === paramId);
|
const index = list.findIndex((i) => String(i.paramId) === paramId);
|
||||||
@@ -752,6 +769,8 @@ export default {
|
|||||||
if (index >= 0) {
|
if (index >= 0) {
|
||||||
list.splice(index, 1);
|
list.splice(index, 1);
|
||||||
}
|
}
|
||||||
|
// 清空表单项的值
|
||||||
|
this.$set(params, 'paramValue', '');
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
const newItem = {
|
const newItem = {
|
||||||
@@ -768,6 +787,9 @@ export default {
|
|||||||
} else {
|
} else {
|
||||||
list.push(newItem);
|
list.push(newItem);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 同步更新表单项的值
|
||||||
|
this.$set(params, 'paramValue', value);
|
||||||
},
|
},
|
||||||
// 编辑sku图片
|
// 编辑sku图片
|
||||||
editSkuPicture(row) {
|
editSkuPicture(row) {
|
||||||
@@ -852,10 +874,30 @@ export default {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
this.renderTableData(this.skuTableData);
|
this.renderTableData(this.skuTableData);
|
||||||
|
this.syncWholesalePriceToSku();
|
||||||
},
|
},
|
||||||
handleDeleteWholesaleData(index) {
|
handleDeleteWholesaleData(index) {
|
||||||
this.wholesaleData.splice(index, 1);
|
this.wholesaleData.splice(index, 1);
|
||||||
this.renderTableData(this.skuTableData);
|
this.renderTableData(this.skuTableData);
|
||||||
|
this.syncWholesalePriceToSku();
|
||||||
|
},
|
||||||
|
// 同步批发价格到SKU
|
||||||
|
syncWholesalePriceToSku() {
|
||||||
|
if (this.baseInfoForm.salesModel === 'WHOLESALE' && this.wholesaleData.length > 0) {
|
||||||
|
// 使用第一个批发价格作为SKU的基础价格
|
||||||
|
const basePrice = this.wholesaleData[0].price || 0;
|
||||||
|
this.skuTableData.forEach(sku => {
|
||||||
|
sku.price = basePrice;
|
||||||
|
});
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 处理销售模式切换
|
||||||
|
handleSalesModeChange() {
|
||||||
|
this.renderTableData(this.skuTableData);
|
||||||
|
// 如果切换到批发模式,同步价格
|
||||||
|
if (this.baseInfoForm.salesModel === 'WHOLESALE') {
|
||||||
|
this.syncWholesalePriceToSku();
|
||||||
|
}
|
||||||
},
|
},
|
||||||
checkWholesaleNum(index) {
|
checkWholesaleNum(index) {
|
||||||
if (this.wholesaleData[index].num < 0) {
|
if (this.wholesaleData[index].num < 0) {
|
||||||
@@ -875,6 +917,7 @@ export default {
|
|||||||
this.wholesaleData[index].num = this.wholesaleData[index - 1].num + 1;
|
this.wholesaleData[index].num = this.wholesaleData[index - 1].num + 1;
|
||||||
}
|
}
|
||||||
this.renderTableData(this.skuTableData);
|
this.renderTableData(this.skuTableData);
|
||||||
|
this.syncWholesalePriceToSku();
|
||||||
},
|
},
|
||||||
checkWholesalePrice(index) {
|
checkWholesalePrice(index) {
|
||||||
if (this.wholesaleData[index].price < 0) {
|
if (this.wholesaleData[index].price < 0) {
|
||||||
@@ -895,6 +938,7 @@ export default {
|
|||||||
this.wholesaleData[index - 1].price - 0.01;
|
this.wholesaleData[index - 1].price - 0.01;
|
||||||
}
|
}
|
||||||
this.renderTableData(this.skuTableData);
|
this.renderTableData(this.skuTableData);
|
||||||
|
this.syncWholesalePriceToSku();
|
||||||
},
|
},
|
||||||
// 商品图片上传成功
|
// 商品图片上传成功
|
||||||
handleSuccessGoodsPicture(res, file) {
|
handleSuccessGoodsPicture(res, file) {
|
||||||
@@ -1213,10 +1257,25 @@ export default {
|
|||||||
return {
|
return {
|
||||||
...p,
|
...p,
|
||||||
paramValue:
|
paramValue:
|
||||||
selectedValue !== undefined ? selectedValue : p.paramValue,
|
selectedValue !== undefined ? selectedValue : (p.paramValue || ""),
|
||||||
};
|
};
|
||||||
})
|
})
|
||||||
.sort((a, b) => Number(a.sort || 0) - Number(b.sort || 0));
|
.sort((a, b) => Number(a.sort || 0) - Number(b.sort || 0));
|
||||||
|
|
||||||
|
// 初始化baseInfoForm.goodsParams用于表单验证
|
||||||
|
this.$set(this.baseInfoForm, 'goodsParams', []);
|
||||||
|
this.goodsParams.forEach((param, index) => {
|
||||||
|
this.$set(this.baseInfoForm.goodsParams, index, {
|
||||||
|
paramValue: param.paramValue || ''
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
// 确保表单验证能正确初始化
|
||||||
|
this.$nextTick(() => {
|
||||||
|
if (this.$refs.baseInfoForm) {
|
||||||
|
this.$refs.baseInfoForm.clearValidate();
|
||||||
|
}
|
||||||
|
});
|
||||||
}
|
}
|
||||||
);
|
);
|
||||||
},
|
},
|
||||||
@@ -1686,12 +1745,20 @@ export default {
|
|||||||
sn: existingCombination.sn || "",
|
sn: existingCombination.sn || "",
|
||||||
quantity: existingCombination.quantity || "",
|
quantity: existingCombination.quantity || "",
|
||||||
cost: existingCombination.cost || "",
|
cost: existingCombination.cost || "",
|
||||||
price: existingCombination.price || "",
|
price: existingCombination.price || (this.baseInfoForm.salesModel === 'WHOLESALE' && this.wholesaleData.length > 0 ? this.wholesaleData[0].price : ""),
|
||||||
weight: existingCombination.weight || ""
|
weight: existingCombination.weight || ""
|
||||||
};
|
};
|
||||||
} else {
|
} else {
|
||||||
// 新组合使用默认值
|
// 新组合使用默认值,批发模式下设置默认价格
|
||||||
return combination;
|
return {
|
||||||
|
...combination,
|
||||||
|
id: "",
|
||||||
|
sn: "",
|
||||||
|
quantity: "",
|
||||||
|
cost: "",
|
||||||
|
price: this.baseInfoForm.salesModel === 'WHOLESALE' && this.wholesaleData.length > 0 ? this.wholesaleData[0].price : "",
|
||||||
|
weight: ""
|
||||||
|
};
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
@@ -1927,6 +1994,7 @@ export default {
|
|||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
let checkFlag = false;
|
let checkFlag = false;
|
||||||
|
let missingParams = [];
|
||||||
this.goodsParams.forEach((param) => {
|
this.goodsParams.forEach((param) => {
|
||||||
if (!param || !param.required) return;
|
if (!param || !param.required) return;
|
||||||
const check = this.baseInfoForm.goodsParamsDTOList.some((paramsItem) => {
|
const check = this.baseInfoForm.goodsParamsDTOList.some((paramsItem) => {
|
||||||
@@ -1935,10 +2003,11 @@ export default {
|
|||||||
});
|
});
|
||||||
if (!check) {
|
if (!check) {
|
||||||
checkFlag = true;
|
checkFlag = true;
|
||||||
|
missingParams.push(param.paramName);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
if (checkFlag) {
|
if (checkFlag) {
|
||||||
this.$Message.error("存在未填写的参数项");
|
this.$Message.error(`以下参数为必填项:${missingParams.join('、')}`);
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
this.submitLoading = true;
|
this.submitLoading = true;
|
||||||
|
|||||||
Reference in New Issue
Block a user