diff --git a/src/views/mall/product/spu/form/ProductAttributes.vue b/src/views/mall/product/spu/form/ProductAttributes.vue index 7b4fc37c..30b17747 100644 --- a/src/views/mall/product/spu/form/ProductAttributes.vue +++ b/src/views/mall/product/spu/form/ProductAttributes.vue @@ -123,15 +123,25 @@ const showInput = async (index: number) => { const emit = defineEmits(['success']) // 定义 success 事件,用于操作成功后的回调 const handleInputConfirm = async (index: number, propertyId: number) => { if (inputValue.value) { - // 重复添加校验 - // TODO @芋艿:需要测试下 + // 1. 重复添加校验 if (attributeList.value[index].values.find((item) => item.name === inputValue.value)) { message.warning('已存在相同属性值,请重试') attributeIndex.value = null inputValue.value = '' return } - // 保存属性值 + + // 2.1 情况一:属性值已存在,则直接使用并结束 + const existValue = attributeOptions.value.find((item) => item.name === inputValue.value) + if (existValue) { + attributeIndex.value = null + inputValue.value = '' + attributeList.value[index].values.push({ id: existValue.id, name: existValue.name }) + emit('success', attributeList.value) + return + } + + // 2.2 情况二:新属性值,则进行保存 try { const id = await PropertyApi.createPropertyValue({ propertyId, name: inputValue.value }) attributeList.value[index].values.push({ id, name: inputValue.value }) diff --git a/src/views/mall/product/spu/form/ProductPropertyAddForm.vue b/src/views/mall/product/spu/form/ProductPropertyAddForm.vue index 3c07cd74..455fbbb2 100644 --- a/src/views/mall/product/spu/form/ProductPropertyAddForm.vue +++ b/src/views/mall/product/spu/form/ProductPropertyAddForm.vue @@ -83,18 +83,32 @@ defineExpose({ open }) // 提供 open 方法,用于打开弹窗 /** 提交表单 */ const submitForm = async () => { - // 情况一:如果是已存在的属性,直接结束,不提交表单新增 + // 1.1 重复添加校验 for (const attrItem of attributeList.value) { if (attrItem.name === formData.value.name) { return message.error('该属性已存在,请勿重复添加') } } - - // 情况二:如果是不存在的属性,则需要执行新增 - // 校验表单 + // 1.2 校验表单 if (!formRef) return const valid = await formRef.value.validate() if (!valid) return + + // 2.1 情况一:属性名已存在,则直接使用并结束 + const existProperty = attributeOptions.value.find((item) => item.name === formData.value.name) + if (existProperty) { + // 添加到属性列表 + attributeList.value.push({ + id: existProperty.id, + ...formData.value, + values: [] + }) + // 关闭弹窗 + dialogVisible.value = false + return + } + + // 2.2 情况二:如果是不存在的属性,则需要执行新增 // 提交请求 formLoading.value = true try { @@ -106,14 +120,6 @@ const submitForm = async () => { ...formData.value, values: [] }) - // 判断最终提交的属性名称是否是用户下拉选择的 自己手动输入的属性名称就不执行emit获取该属性名下属性值列表 - for (const element of attributeOptions.value) { - if (element.name === formData.value.name) { - message.success(t('common.createSuccess')) - dialogVisible.value = false - return - } - } // 关闭弹窗 message.success(t('common.createSuccess')) dialogVisible.value = false