优化

src/views/commodityManage/edit.vue

@@ -34,7 +34,7 @@
                         </el-radio-group>
                     </el-form-item>
 
-                    <el-form-item label="商品图片">
+                    <el-form-item label="商品图片" prop="picUrl">
                         <el-upload :action="uploadPath" :show-file-list="false" :headers="headers"
                             :on-success="uploadPicUrl" class="avatar-uploader" accept=".jpg,.jpeg,.png,.gif">
                             <!-- <img v-if="goods.picUrl" :src="goods.picUrl" class="avatar" /> -->
@@ -45,7 +45,7 @@
                         </el-upload>
                     </el-form-item>
 
-                    <el-form-item label="设计图片">
+                    <el-form-item label="设计图片" prop="designUrl">
                         <el-upload :action="uploadPath" :limit="1" :show-file-list="false" :headers="headers"
                             :on-success="uploadCdUrl" list-type="picture" class="avatar-uploader"
                             accept=".jpg,.jpeg,.png,.gif">
@@ -244,6 +244,7 @@ let specQueryId = ref(); // 查询id
 let products = ref([] as any);
 let partsCopy = [] as any; // 配件 copy
 let selectSpecRef = ref();
+let goodsRef = ref();
 let rules = ref({
     goodsSn: [{ required: true, message: "商品编号不能为空", trigger: "blur" }],
     name: [{ required: true, message: "商品名称不能为空", trigger: "blur" }],
@@ -423,61 +424,65 @@ let handleCancel = () => {
 }
 
 let handleEdit = () => {
-    // 如果要删除数据，再提交时需要把删除记录加上
-    if (deleteData.length !== 0)
-        deleteData.map((item: any) => { products.value.push(item.deleteIndexData) })
-    // 要子数据参数table删除数据
-    if (deleteParamsData.length !== 0) {
-        deleteParamsData.map((item: any) => {
-            products.value[item.deleteIndex].attributeList.map((res: any, r: number) => {
-                if (r === item.deleteIndex) {
-                    products.value[item.deleteIndex].updateTime = null
-                    products.value[r].attributeList.push(item.deleteParamsIndexData)
-                }
-            })
-        })
-    }
-    // 要子数据主要配置table删除数据
-    if (deleteMainData.length !== 0) {
-        deleteMainData.map((item: any) => {
-            products.value[item.deleteIndex].mainConfigurationsList.map((res: any, r: number) => {
-                if (r === item.deleteIndex) {
-                    products.value[item.deleteIndex].updateTime = null
-                    products.value[r].mainConfigurationsList.push(item.deleteMainIndexData)
-                }
-            })
-        })
-    }
-    specifications.value = [...specificationsDeleteData.value, ...specifications.value]
-    const finalGoods = {
-        goods: goods.value,
-        specifications: specifications.value,
-        products: products.value,
-        categoryIds: categoryIds.value,
-        parts: partsData.value
-    };
-    editGoods(finalGoods)
-        .then((res: any) => {
-            if (res.code === 200) {
-                ElNotification({
-                    type: 'success',
-                    title: "成功",
-                    message: "编辑成功",
-                });
-                emits('initShelves')
-                handleCancel()
-            } else if (res.code === 401) {
-                // 因为会有拦截所以的刷新数据
-                specificationsDeleteData.value = []
-                init(specQueryId.value)
+    goodsRef.value?.validate((valid: boolean) => {
+        if (valid) {
+            // 如果要删除数据，再提交时需要把删除记录加上
+            if (deleteData.length !== 0)
+                deleteData.map((item: any) => { products.value.push(item.deleteIndexData) })
+            // 要子数据参数table删除数据
+            if (deleteParamsData.length !== 0) {
+                deleteParamsData.map((item: any) => {
+                    products.value[item.deleteIndex].attributeList.map((res: any, r: number) => {
+                        if (r === item.deleteIndex) {
+                            products.value[item.deleteIndex].updateTime = null
+                            products.value[r].attributeList.push(item.deleteParamsIndexData)
+                        }
+                    })
+                })
             }
-        })
-        .catch((res: any) => {
-            ElMessageBox.alert("业务错误：" + res.msg, "警告", {
-                confirmButtonText: "确定",
-                type: "error",
-            });
-        });
+            // 要子数据主要配置table删除数据
+            if (deleteMainData.length !== 0) {
+                deleteMainData.map((item: any) => {
+                    products.value[item.deleteIndex].mainConfigurationsList.map((res: any, r: number) => {
+                        if (r === item.deleteIndex) {
+                            products.value[item.deleteIndex].updateTime = null
+                            products.value[r].mainConfigurationsList.push(item.deleteMainIndexData)
+                        }
+                    })
+                })
+            }
+            specifications.value = [...specificationsDeleteData.value, ...specifications.value]
+            const finalGoods = {
+                goods: goods.value,
+                specifications: specifications.value,
+                products: products.value,
+                categoryIds: categoryIds.value,
+                parts: partsData.value
+            };
+            editGoods(finalGoods)
+                .then((res: any) => {
+                    if (res.code === 200) {
+                        ElNotification({
+                            type: 'success',
+                            title: "成功",
+                            message: "编辑成功",
+                        });
+                        emits('initShelves')
+                        handleCancel()
+                    } else if (res.code === 401) {
+                        // 因为会有拦截所以的刷新数据
+                        specificationsDeleteData.value = []
+                        init(specQueryId.value)
+                    }
+                })
+                .catch((res: any) => {
+                    ElMessageBox.alert("业务错误：" + res.msg, "警告", {
+                        confirmButtonText: "确定",
+                        type: "error",
+                    });
+                });
+        } else return false
+    })
 }
 let handleClose = (tag: any) => {
     keywords.value.splice(keywords.value.indexOf(tag), 1);

src/views/commodityManage/shelves.vue

@@ -34,7 +34,7 @@
                         </el-radio-group>
                     </el-form-item>
 
-                    <el-form-item label="商品图片">
+                    <el-form-item label="商品图片" prop="picUrl">
                         <el-upload :action="uploadPath" :limit="1" :show-file-list="false" :headers="headers"
                             :on-success="uploadPicUrl" list-type="picture" class="avatar-uploader"
                             accept=".jpg,.jpeg,.png,.gif">
@@ -45,7 +45,7 @@
                         </el-upload>
                     </el-form-item>
 
-                    <el-form-item label="设计图片">
+                    <el-form-item label="设计图片" prop="designUrl">
                         <el-upload :action="uploadPath" :limit="1" :show-file-list="false" :headers="headers"
                             :on-success="uploadCdUrl" list-type="picture" class="avatar-uploader"
                             accept=".jpg,.jpeg,.png,.gif">
@@ -232,9 +232,12 @@ let specifications = ref([] as any);
 let headers = ref({ 'Authorization': sessionStorage.getItem("token") })
 
 let products = ref([]);
+let goodsRef = ref()
 let rules = ref({
     goodsSn: [{ required: true, message: "商品编号不能为空", trigger: "blur" }],
     name: [{ required: true, message: "商品名称不能为空", trigger: "blur" }],
+    picUrl: [{ required: true, message: "商品名称不能为空", trigger: ["blur", 'change'] }],
+    designUrl: [{ required: true, message: "商品名称不能为空", trigger: ["blur", 'change'] }],
 });
 
 let emits = defineEmits(['initShelves'])
@@ -298,27 +301,31 @@ let productsData = (data: any) => {
     products.value = data
 }
 let handlePublish = () => {
-    const finalGoods = {
-        goods: goods.value,
-        specifications: specifications.value,
-        products: products.value,
-        parts: partsData.value
-    };
-    publishGoods(finalGoods)
-        .then((res: any) => {
-            if (res.code === 200) {
-                ElMessage({
-                    type: 'success',
-                    message: "创建成功",
-                });
-                emits('initShelves')
-                handleCancel()
-            }
-        })
-        .catch((res) => {
-            console.log(res, '上架错误');
+    goodsRef.value?.validate((valid: boolean) => {
+        if (valid) {
+            const finalGoods = {
+                goods: goods.value,
+                specifications: specifications.value,
+                products: products.value,
+                parts: partsData.value
+            };
+            publishGoods(finalGoods)
+                .then((res: any) => {
+                    if (res.code === 200) {
+                        ElMessage({
+                            type: 'success',
+                            message: "创建成功",
+                        });
+                        emits('initShelves')
+                        handleCancel()
+                    }
+                })
+                .catch((res) => {
+                    console.log(res, '上架错误');
 
-        });
+                });
+        } else return false
+    })
 }
 
 let partsData = ref([] as any)