编辑

src/views/modules/product/index.vue

@@ -56,7 +56,10 @@
       </template>
     </obj-table-plus>
     <!-- 添加或编辑 -->
-    <add-or-update ref="addOrUpdate"></add-or-update>
+    <add-or-update
+      @queryList="$refs.oTable.reload()"
+      ref="addOrUpdate"
+    ></add-or-update>
     <!-- 改价格 -->
     <AddPrice ref="AddPrice" @queryList="$refs.oTable.reload()"></AddPrice>
     <!-- 改库存 -->
@@ -276,8 +279,9 @@ export default {
           align: "center",
           width: "340px",
           render: ({ row }) => {
-            const grant = () => {};
+            let edit = () => {
-            let edit = () => {};
+              this.$refs.addOrUpdate.toggle(row).update();
+            };
             let priceAdjustment = () => {
               console.log(row);
               this.$refs.AddPrice.toggle(row).update();

src/views/modules/product/popup/add-or-update.vue

@@ -151,6 +151,14 @@ export default {
     };
   },
   mounted() {},
+  watch: {
+    "modalConfig.show"(newVal) {
+      if (!newVal) {
+        this.currentPanel = "基础信息";
+        this.fileList = [];
+      }
+    },
+  },
   methods: {
     toggle(e) {
       if (this.modalConfig.show == false) {
@@ -160,12 +168,12 @@ export default {
       }
       if (e) {
         console.log(e);
-        this.init(cloneDeep(e.row));
+        this.init(cloneDeep(e));
       }
       return {
-        add: (item) => {
+        add: () => {
-          console.log(item);
           this.$nextTick(() => {
+            this.modalConfig.title = "添加商品";
             this.modalData = {
               description: "",
               merchantId: "",
@@ -192,21 +200,41 @@ export default {
             this.modalData.shopId = JSON.parse(
               sessionStorage.getItem("userInfo")
             ).shopId;
+            this.passCheck = [];
+            this.place = [];
           });
-          console.log(this.modalData);
 
           this.isAdd = true;
         },
-        update: (row) => {
+        update: () => {
-          this.modalData = row;
+          this.modalConfig.title = "编辑商品";
           this.isAdd = false;
         },
       };
     },
-    init(row) {},
+    init(row) {
+      console.log(row);
+      this.fileList = row.productPhotoList.map((item) => {
+        return {
+          name: "",
+          url: item.url,
+        };
+      });
+      this.place = row.productPlace.split("-");
+      this.modalData = row;
+    },
     addSpecs() {
       console.log("123");
-      this.$refs.addSpecifications.toggle().add();
+      if (this.isAdd) {
+        this.$refs.addSpecifications.toggle().add();
+      } else {
+        this.$refs.addSpecifications
+          .toggle()
+          .update(
+            this.modalData.productAttributeList,
+            this.modalData.productSpecificationList
+          );
+      }
     },
     //获取属性
     getSpecs(tableData, AttributeData, salePrice, stockNum) {
@@ -216,8 +244,6 @@ export default {
           attributeValue: item.attributeValue.join(","),
         };
       });
-      console.log(AttributeList);
-
       this.$set(this.modalData, "productSpecificationList", tableData);
       this.$set(this.modalData, "productAttributeList", AttributeList);
       this.$set(this.modalData, "singlePrice", salePrice);
@@ -236,9 +262,17 @@ export default {
       ];
       console.log(this.modalData);
     },
-    beforeTabLeave(activeName) {
+    beforeTabLeave(activeName, oldActiveName) {
+      if (this.passCheck.includes(activeName)) {
+        return true;
+      }
       let state = "";
       this.$refs.modal.validate((valid) => {
+        if (valid) {
+          if (!this.passCheck.includes(oldActiveName)) {
+            this.passCheck.push(oldActiveName);
+          }
+        }
         state = valid;
       });
       return state;
@@ -270,16 +304,22 @@ export default {
                       if (index == 0) {
                         return {
                           isMain: 1,
-                          url: item.response.data,
+                          url: item.response ? item.response.data : item.url,
                         };
                       } else {
                         return {
-                          url: item.response.data,
+                          url: item.response ? item.response.data : item.url,
                         };
                       }
                     }
                   );
                   console.log(this.modalData.productPhotoList);
+                  this.fileList = fileList.map((item) => {
+                    return {
+                      name: item.name,
+                      url: item.response ? item.response.data : item.url,
+                    };
+                  });
                 };
                 const handleRemove = (file, fileList) => {
                   console.log(file, fileList);
@@ -288,16 +328,22 @@ export default {
                       if (index == 0) {
                         return {
                           isMain: 1,
-                          url: item.response.data,
+                          url: item.url,
                         };
                       } else {
                         return {
-                          url: item.response.data,
+                          url: item.url,
                         };
                       }
                     }
                   );
                   console.log(this.modalData.productPhotoList);
+                  this.fileList = fileList.map((item) => {
+                    return {
+                      name: item.name,
+                      url: item.url,
+                    };
+                  });
                 };
                 return (
                   <el-upload
@@ -316,6 +362,7 @@ export default {
                     }}
                     multiple={true}
                     file-list={this.fileList}
+                    list-type="picture"
                   >
                     <i class="el-icon-upload"></i>
                     <div class="el-upload__text">
@@ -361,6 +408,7 @@ export default {
               prop: "name",
               type: "Input",
               required: true,
+              maxlength: "30",
               rules: {
                 required: true,
                 message: "请输入商品名称",
@@ -382,6 +430,7 @@ export default {
                 return (
                   <el-input
                     type="textarea"
+                    maxlength={100}
                     v-model={this.modalData.description}
                     placeholder="请简单描述，如别称、口感、用途等"
                   />
@@ -412,7 +461,7 @@ export default {
                       return (
                         <el-option
                           label={item.name}
-                          value={item.id}
+                          value={item.name}
                         ></el-option>
                       );
                     })}
@@ -490,7 +539,6 @@ export default {
                 const change = (e) => {
                   console.log(e);
                   this.modalData.productPlace = e.join("-");
-                  console.log(aa);
                 };
                 return (
                   <el-cascader
@@ -637,7 +685,7 @@ export default {
     modalHandles() {
       return [
         {
-          label: this.currentPanel === "其他信息" ? "确定" : "下一步",
+          label: this.currentPanel === "其他信息" ? "立即上架" : "下一步",
           type: "primary",
           loading: this.isLoading,
           submit: true,
@@ -650,10 +698,27 @@ export default {
               console.log("请求接口", this.modalData);
               this.$api.mer_admin.saveProduct(this.modalData).then((res) => {
                 console.log(res);
+                this.$emit("queryList");
+                this.toggle();
               });
             }
           }, 300),
         },
+        {
+          disabled: () => this.currentPanel != "其他信息",
+          label: "放入仓库",
+          type: "primary",
+          loading: this.isLoading,
+          submit: true,
+          handle: debounce(() => {
+            this.modalData.status = "DOWN";
+            this.$api.mer_admin.saveProduct(this.modalData).then((res) => {
+              console.log(res);
+              this.$emit("queryList");
+              this.toggle();
+            });
+          }, 300),
+        },
       ];
     },
   },

src/views/modules/product/popup/add-specifications.vue

@@ -136,12 +136,22 @@ export default {
         add: () => {
           this.modalConfig.title = "属性";
           this.$nextTick(() => {
+            // this.$refs.modal.resetFields();
             this.modalData = {};
-            this.$refs.modal.resetFields();
           });
           this.isAdd = true;
         },
-        update: () => {
+        update: (productAttributeList, productSpecificationList) => {
+          console.log(productAttributeList, productSpecificationList);
+          this.AttributeData = productAttributeList.map((item) => {
+            return {
+              attributeName: item.attributeName,
+              attributeValue: item.attributeValue.split(","),
+              id: item.id,
+              inputVisible: false,
+            };
+          });
+          this.tableData = productSpecificationList;
           this.isAdd = false;
         },
       };
@@ -211,9 +221,9 @@ export default {
       this.tableData = data.map((item) => {
         return {
           attributeValue: item,
-          salePrice: "",
+          salePrice: 0,
-          costPrice: "",
+          costPrice: 0,
-          stockNum: "",
+          stockNum: 0,
         };
       });
       console.log(data);
@@ -259,6 +269,7 @@ export default {
               <div>
                 <el-input-number
                   min={0}
+                  max={row.salePrice}
                   size="small"
                   v-model={row.costPrice}
                   placeholder="请输入成本"
@@ -319,6 +330,7 @@ export default {
           label: this.isAdd ? "确认添加" : "确认修改",
           type: "primary",
           loading: this.isLoading,
+          disabled: () => this.tableData.length <= 0,
           // submit: true,
           handle: () => {
             let salePrice = ""; //价格范围