diff --git a/src/views/mall/product/spu/components/SkuList.vue b/src/views/mall/product/spu/components/SkuList.vue
index 9bbd38e4..2b881a46 100644
--- a/src/views/mall/product/spu/components/SkuList.vue
+++ b/src/views/mall/product/spu/components/SkuList.vue
@@ -24,7 +24,7 @@
>
- {{ row.properties[index]?.valueName }}
+ {{ row.properties?.[index]?.valueName }}
@@ -168,7 +168,7 @@
>
- {{ row.properties[index]?.valueName }}
+ {{ row.properties?.[index]?.valueName }}
@@ -248,7 +248,7 @@
>
- {{ row.properties[index]?.valueName }}
+ {{ row.properties?.[index]?.valueName }}
diff --git a/src/views/mall/product/spu/components/index.ts b/src/views/mall/product/spu/components/index.ts
index e2cbe73d..5569bc99 100644
--- a/src/views/mall/product/spu/components/index.ts
+++ b/src/views/mall/product/spu/components/index.ts
@@ -5,6 +5,7 @@ interface PropertyAndValues {
id: number
name: string
values?: PropertyAndValues[]
+ propertyOpts?: PropertyAndValues[]
}
interface RuleConfig {
diff --git a/src/views/mall/product/spu/form/ProductAttributes.vue b/src/views/mall/product/spu/form/ProductAttributes.vue
index ffe7397d..88515829 100644
--- a/src/views/mall/product/spu/form/ProductAttributes.vue
+++ b/src/views/mall/product/spu/form/ProductAttributes.vue
@@ -18,16 +18,28 @@
>
{{ value.name }}
-
+ >
+
+
+
{
const emit = defineEmits(['success']) // 定义 success 事件,用于操作成功后的回调
const handleInputConfirm = async (index: number, propertyId: number) => {
if (inputValue.value) {
+ // 重复添加校验
+ if (attributeList.value[index].values.find((item) => item.name === inputValue.value)) {
+ message.warning('已存在相同属性值,请重试')
+ attributeIndex.value = null
+ inputValue.value = ''
+ return
+ }
// 保存属性值
try {
const id = await PropertyApi.createPropertyValue({ propertyId, name: inputValue.value })
diff --git a/src/views/mall/product/spu/form/ProductPropertyAddForm.vue b/src/views/mall/product/spu/form/ProductPropertyAddForm.vue
index 15c5a8d5..6fc9f912 100644
--- a/src/views/mall/product/spu/form/ProductPropertyAddForm.vue
+++ b/src/views/mall/product/spu/form/ProductPropertyAddForm.vue
@@ -10,7 +10,22 @@
@keydown.enter.prevent="submitForm"
>
-
+
+
+
@@ -24,6 +39,7 @@ import * as PropertyApi from '@/api/mall/product/property'
defineOptions({ name: 'ProductPropertyForm' })
+const emit = defineEmits(['success']) // 定义 success 事件,用于操作成功后的回调
const { t } = useI18n() // 国际化
const message = useMessage() // 消息弹窗
@@ -37,6 +53,7 @@ const formRules = reactive({
})
const formRef = ref() // 表单 Ref
const attributeList = ref([]) // 商品属性列表
+const attrOption = ref([]) // 属性名称下拉框
const props = defineProps({
propertyList: {
type: Array,
@@ -59,6 +76,7 @@ watch(
/** 打开弹窗 */
const open = async () => {
dialogVisible.value = true
+ getAttrOption()
resetForm()
}
defineExpose({ open }) // 提供 open 方法,用于打开弹窗
@@ -80,6 +98,16 @@ const submitForm = async () => {
...formData.value,
values: []
})
+ // 判断最终提交的属性名称是否是选择的 自己手动输入的属性名称不执行emit
+ attrOption.value.forEach((item) => {
+ if (item.name === formData.value.name) {
+ emit('success', propertyId, item.id)
+ message.success(t('common.createSuccess'))
+ dialogVisible.value = false
+ // 中断循环
+ throw new Error()
+ }
+ })
message.success(t('common.createSuccess'))
dialogVisible.value = false
} finally {
@@ -94,4 +122,15 @@ const resetForm = () => {
}
formRef.value?.resetFields()
}
+
+/** 获取商品属性下拉选项 */
+const getAttrOption = async () => {
+ formLoading.value = true
+ try {
+ const data = await PropertyApi.getPropertyPage({ pageNo: 1, pageSize: 100 })
+ attrOption.value = data.list
+ } finally {
+ formLoading.value = false
+ }
+}
diff --git a/src/views/mall/product/spu/form/SkuForm.vue b/src/views/mall/product/spu/form/SkuForm.vue
index 9cc61924..e864550d 100644
--- a/src/views/mall/product/spu/form/SkuForm.vue
+++ b/src/views/mall/product/spu/form/SkuForm.vue
@@ -1,6 +1,13 @@
-
+
-
+