From 84ed1f7df39a3e3ef3fdd24c08d0f30b4de339e8 Mon Sep 17 00:00:00 2001
From: puhui999 <puhui999@163.com>
Date: Sun, 30 Apr 2023 17:04:31 +0800
Subject: [PATCH] =?UTF-8?q?=E5=95=86=E5=93=81=E7=AE=A1=E7=90=86:=20?=
 =?UTF-8?q?=E4=BF=9D=E5=AD=98=E5=B1=9E=E6=80=A7=E5=80=BC=E5=88=B0=E6=95=B0?=
 =?UTF-8?q?=E6=8D=AE=E5=BA=93?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

(cherry picked from commit 35c3545e7cf9a6e25c5ace8cb9ae8fc9993fc15f)
---
 .../components/ProductAttributes.vue          | 20 ++++++++++++++-----
 1 file changed, 15 insertions(+), 5 deletions(-)

diff --git a/src/views/mall/product/management/components/ProductAttributes.vue b/src/views/mall/product/management/components/ProductAttributes.vue
index ea9b311a..2283f483 100644
--- a/src/views/mall/product/management/components/ProductAttributes.vue
+++ b/src/views/mall/product/management/components/ProductAttributes.vue
@@ -8,7 +8,7 @@
       <el-text class="mx-1">属性值：</el-text>
       <el-tag
         v-for="(value, valueIndex) in item.values"
-        :key="value.name"
+        :key="value.id"
         :disable-transitions="false"
         class="mx-1"
         closable
@@ -22,8 +22,8 @@
         v-model="inputValue"
         class="!w-20"
         size="small"
-        @blur="handleInputConfirm(index)"
-        @keyup.enter="handleInputConfirm(index)"
+        @blur="handleInputConfirm(index, item.id)"
+        @keyup.enter="handleInputConfirm(index, item.id)"
       />
       <el-button
         v-show="!inputVisible(index)"
@@ -40,7 +40,10 @@
 
 <script lang="ts" name="ProductAttributes" setup>
 import { ElInput } from 'element-plus'
+import * as PropertyApi from '@/api/mall/product/property'
 
+const { t } = useI18n() // 国际化
+const message = useMessage() // 消息弹窗
 const inputValue = ref('') // 输入框值
 const attributeIndex = ref<number | null>(null) // 获取焦点时记录当前属性项的index
 // 输入框显隐控制
@@ -79,9 +82,16 @@ const showInput = async (index) => {
   InputRef.value[index]!.input!.focus()
 }
 /** 输入框失去焦点或点击回车时触发 */
-const handleInputConfirm = (index) => {
+const handleInputConfirm = async (index, propertyId) => {
   if (inputValue.value) {
-    attributeList.value[index].values.push({ name: inputValue.value })
+    // 保存属性值
+    try {
+      const id = await PropertyApi.createPropertyValue({ propertyId, name: inputValue.value })
+      attributeList.value[index].values.push({ id, name: inputValue.value })
+      message.success(t('common.createSuccess'))
+    } catch {
+      message.error('添加失败，请重试') // TODO 缺少国际化
+    }
   }
   attributeIndex.value = null
   inputValue.value = ''