feat:更新编辑商品组件为一次性提交

src/app/shop/admin/goods/goods/edit.vue

@@ -78,12 +78,12 @@
                   </el-select> -->
                 </el-form-item>
 
-                <el-form-item label="商品货号" prop="itemNumber" required>
+                <el-form-item label="商品货号" prop="itemNumber">
                   <el-input v-model="formData.itemNumber" placeholder="请输入商品货号" />
                   <div class="form-tip">如果您不输入商品货号，系统将自动生成一个唯一的货号</div>
                 </el-form-item>
 
-                <el-form-item label="商品售价" prop="price" required>
+                <!-- <el-form-item label="商品售价" prop="price" required>
                   <el-input
                     v-model="formData.price"
                     placeholder="请输入商品售价"
@@ -117,7 +117,7 @@
                   <div class="form-tip"
                     >该设置只对单品有效，当商品存在多规格货品时为不可编辑状态，库存数值取决于货品数量</div
                   >
-                </el-form-item>
+                </el-form-item> -->
 
                 <el-form-item label="库存预警值" prop="stockThreshold">
                   <el-input
@@ -422,6 +422,7 @@
   import { CircleCheck, CircleCloseFilled, Edit, Loading } from '@element-plus/icons-vue';
 
   import { api } from '../goods.service';
+  import { request } from '@/sheep/request';
 
   export default {
     name: 'GoodsEditNew',
@@ -508,9 +509,9 @@
     storeName: [{ required: true, message: '请输入商品名称', trigger: 'blur' }],
     itemBrand: [{ required: true, message: '请输入商品品牌', trigger: 'blur' }],
     // tempId: [{ required: true, message: '请选择运费模板', trigger: 'change' }],
-    itemNumber: [{ required: true, message: '请输入商品货号', trigger: 'blur' }],
-    price: [{ required: true, message: '请输入商品售价', trigger: 'blur' }],
-    stock: [{ required: true, message: '请输入商品库存', trigger: 'blur' }],
+    // itemNumber: [{ required: true, message: '请输入商品货号', trigger: 'blur' }],
+    // price: [{ required: true, message: '请输入商品售价', trigger: 'blur' }],
+    // stock: [{ required: true, message: '请输入商品库存', trigger: 'blur' }],
     isShow: [{ required: true, message: '请选择商品状态', trigger: 'change' }],
     itemSupplier: [{ required: true, message: '请输入商品供应商', trigger: 'blur' }],
     image: [{ required: true, message: '请上传商品主图', trigger: 'change' }],
@@ -771,73 +772,6 @@
     return imageString.split(',').filter((img) => img.trim());
   };
 
-  // 提交基本信息（第一步）
-  const submitBasicInfo = async () => {
-    try {
-      submitLoading.value = true;
-      submitError.value = '';
-
-      // 准备提交数据，图片转换为逗号分隔字符串
-      const submitData = {
-        ...formData,
-        image: convertImagesToString(formData.image),
-        sliderImage: convertImagesToString(formData.sliderImage),
-        flatPattern: convertImagesToString(formData.flatPattern),
-      };
-
-      // 调用新增商品接口
-      const response = await api.goods.add(submitData);
-
-      if (response.code == '200') {
-        ElMessage.success('商品基本信息保存成功');
-        // 保存商品ID用于后续SKU设置
-        formData.id = response.data.id;
-        currentStep.value++; // 进入下一步
-      } else {
-        throw new Error(response.message || '保存失败');
-      }
-    } catch (error) {
-      console.error('提交基本信息失败:', error);
-      submitError.value = error.message || '提交失败，请重试';
-      ElMessage.error(submitError.value);
-    } finally {
-      submitLoading.value = false;
-    }
-  };
-
-  const submitForm = async () => {
-    try {
-      submitLoading.value = true;
-      submitError.value = '';
-
-      // 准备提交SKU数据
-      const submitData = {
-        goodsId: formData.id,
-        specType: formData.specType,
-        sku_prices: formData.sku_prices.map((item) => ({
-          ...item,
-          image: item.imageList && item.imageList.length > 0 ? item.imageList[0] : '',
-        })),
-      };
-
-      console.log('提交SKU数据:', submitData);
-
-      // 这里调用SKU设置接口
-      // const response = await api.goods.setSku(submitData);
-
-      // 临时测试逻辑
-      submitSuccess.value = true;
-      currentStep.value = 2; // 跳转到成功页面
-      ElMessage.success('商品SKU设置成功');
-    } catch (error) {
-      console.error('提交SKU失败:', error);
-      submitError.value = error.message || '提交失败，请重试';
-      ElMessage.error(submitError.value);
-    } finally {
-      submitLoading.value = false;
-    }
-  };
-
   // 下一步
   const nextStep = async () => {
     if (currentStep.value === 0) {
@@ -847,15 +781,11 @@
         ElMessage.error('请完善基本信息');
         return;
       }
-
-      // 第一步完成后直接调用新增商品接口
-      await submitBasicInfo();
+      // 进入下一步（商品属性设置）
+      currentStep.value++;
     } else if (currentStep.value === 1) {
-      // 验证SKU并提交
-      if (!validateSku()) {
-        return;
-      }
-      await submitForm();
+      // 第二步：提交所有数据（基本信息 + 商品属性）
+      await submitGoods();
     }
   };
 
@@ -920,27 +850,120 @@
     }
   };
 
-  // 提交商品
+  // 统一提交商品（包含基本信息和属性）
   const submitGoods = async () => {
     try {
+      submitLoading.value = true;
+      submitError.value = '';
+
+      // 验证基本信息表单
+      const basicValid = await basicFormRef.value?.validate().catch(() => false);
+      if (!basicValid) {
+        ElMessage.error('请完善商品基本信息');
+        return;
+      }
+
+      // 验证商品属性（如果有SKU）
+      if (formData.sku_prices && formData.sku_prices.length > 0) {
+        // 验证SKU数据
+        for (let i = 0; i < formData.sku_prices.length; i++) {
+          const item = formData.sku_prices[i];
+          if (!item.price || item.price <= 0) {
+            ElMessage.error(`第${i + 1}个规格的销售价格不能为空且必须大于0`);
+            return;
+          }
+          if (item.stock === null || item.stock === undefined || item.stock < 0) {
+            ElMessage.error(`第${i + 1}个规格的商品库存不能为空且不能小于0`);
+            return;
+          }
+        }
+      }
+
+      // 调用统一保存接口
       const data = { ...formData };
-      // 调用保存接口
       await saveGoods(data);
-      ElMessage.success('商品上架成功');
-      emit('modalCallBack', { event: 'confirm' });
+      // 测试代码
+      submitLoading.value = false;
+      return;
+
+      // 提交成功，跳转到成功页面
+      submitSuccess.value = true;
+      currentStep.value = 2;
+      ElMessage.success('商品保存成功');
     } catch (error) {
+      submitError.value = error.message || '提交失败';
       ElMessage.error('提交失败：' + error.message);
+    } finally {
+      submitLoading.value = false;
     }
   };
 
-  // 保存商品接口调用
+  // 生成后端需要的 attrValue 数据格式
+  const generateAttrValueData = () => {
+    return formData.sku_prices.map((item) => {
+      // 构建规格属性对象，如 {"颜色": "红色", "尺寸": "S"}
+      const attrObj = {};
+      const attrValueObj = {};
+
+      // 根据 goods_sku_text 和对应的规格名称构建属性对象
+      item.goods_sku_text.forEach((value, index) => {
+        const specName = formData.skus[index]?.name;
+        if (specName) {
+          attrObj[specName] = value;
+          attrValueObj[specName] = value;
+        }
+      });
+
+      return {
+        image: item.imageList && item.imageList.length > 0 ? item.imageList[0] : '',
+        price: item.price || '0',
+        stock: item.stock || 0,
+        barCode: item.sn || '',
+        stock_warning: item.stock_warning || 0,
+        attrValue: JSON.stringify(attrValueObj),
+        ...attrObj, // 展开规格属性，如 "颜色": "红色", "尺寸": "S"
+        id: 0,
+        productId: 0,
+      };
+    });
+  };
+
+  // 生成后端需要的 attr 数据格式
+  const generateAttrData = () => {
+    return formData.skus
+      .filter((sku) => sku.name && sku.children.length > 0)
+      .map((sku) => ({
+        attrName: sku.name,
+        attrValues: sku.children.map((child) => child.name).join(','),
+      }));
+  };
+
+  // 统一提交接口 - 保存商品信息和属性
   const saveGoods = async (data) => {
     try {
-      const response = await api.goods.saveGoods(data);
-      if (response.code == '200') {
-        return response.data;
+      // 准备基本商品数据
+      const submitData = {
+        ...data,
+        // 图片转换为逗号分隔字符串
+        image: convertImagesToString(data.image),
+        sliderImage: convertImagesToString(data.sliderImage),
+        flatPattern: convertImagesToString(data.flatPattern),
+      };
+
+      // 添加商品属性数据
+      if (formData.sku_prices && formData.sku_prices.length > 0) {
+        submitData.attrValue = generateAttrValueData();
+        submitData.attr = generateAttrData();
+      }
+
+      // 调用配置文件中的接口 - 根据是否有ID判断新增还是编辑
+      const { code } = isEdit.value
+        ? await api.goods.edit(submitData)
+        : await api.goods.add(submitData);
+      if (code === '200') {
+        return true;
       } else {
-        throw new Error(response.msg || '保存失败');
+        throw new Error('保存失败');
       }
     } catch (error) {
       console.error('保存商品失败:', error);