feature(uniapp商品): 商品加载

Author: Why1092164058

src/api/mall/product/brand.js

@@ -34,6 +34,15 @@ export function getBrand(id) {
   })
 }
 
+// 获得品牌list
+export function getBrandList() {
+  return request({
+    url: '/product/brand/list',
+    method: 'get'
+  })
+}
+
+
 // 获得品牌分页
 export function getBrandPage(query) {
   return request({

src/views/mall/product/spu/index.vue

@@ -179,7 +179,7 @@
 
 
     <el-dialog :title="title" :visible.sync="open" width="900px" append-to-body destroy-on-close :close-on-click-modal="false" >
-      <save @closeDialog="open = false; getList()"/>
+      <save @closeDialog="closeDialog" :type="dialogType" :obj="dialogObj" v-if="open" />
     </el-dialog>
   </div>
 </template>
@@ -257,6 +257,10 @@ export default {
       title: "",
       // 是否显示弹出层
       open: false,
+      // 弹出层类型
+      dialogType: "add",
+      // 弹出层参数
+      dialogObj:{},
       dateRangeCreateTime: [],
       // 查询参数
       queryParams: {
@@ -570,75 +574,25 @@ export default {
     },
     /** 新增按钮操作 */
     handleAdd() {
-      this.reset();
+      this.dialogType = "add";
+      this.dialogObj={};
       this.open = true;
       this.title = "添加商品spu";
-      this.getPropertyPageList();
     },
     /** 修改按钮操作 */
     handleUpdate(row) {
-      this.reset();
-      const id = row.id;
-      getSpu(id).then((response) => {
-        let dataSpu = response.data;
-        this.form = {
-          id: dataSpu.id,
-          name: dataSpu.name,
-          sellPoint: dataSpu.sellPoint,
-          description: dataSpu.sellPoint,
-          categoryId: dataSpu.sellPoint,
-          categoryIds: dataSpu.categoryIds,
-          picUrls: dataSpu.picUrls,
-          sort: dataSpu.sort,
-          likeCount: dataSpu.likeCount,
-          price: dataSpu.price,
-          quantity: dataSpu.quantity,
-          status: dataSpu.status,
-          isShowTagInput: undefined,
-          skus: [],
-          skusList: dataSpu.skus,
-          productPropertyViews: dataSpu.productPropertyViews,
-          // skus:dataSpu.productSkuRespVOS,
-        };
-        this.getDataHandle();
-        this.open = true;
-        this.title = "修改商品spu";
-      });
+      this.dialogType = "upd";
+      this.dialogObj.id = row.id;
+      this.open = true;
+      console.log("修改")
+      this.title = "修改商品spu";
     },
-    getDataHandle() {
-      let that = this;
-      let productPropertyViews = JSON.parse(
-        JSON.stringify(this.form.productPropertyViews)
-      );
-      productPropertyViews = productPropertyViews.sort(
-        (a, b) => a.propertyId - b.propertyId
-      );
-      productPropertyViews.forEach((item) => {
-        item.propertyValues = item.propertyValues.sort((a, b) => a.v1 - b.v1);
-      });
-      let skuIds = [];
-      for (let i = 0; i < productPropertyViews.length; i++) {
-        let han = {
-          name: productPropertyViews[i].name,
-          propertyId: productPropertyViews[i].propertyId,
-          selectValues: [],
-          selectValueIds: [],
-        };
-        for (
-          let j = 0;
-          j < productPropertyViews[i].propertyValues.length;
-          j++
-        ) {
-          han.selectValues.push(productPropertyViews[i].propertyValues[j].v2);
-          han.selectValueIds.push(productPropertyViews[i].propertyValues[j].v1);
-        }
-        skuIds.push(han);
-      }
-      this.skuTags = skuIds;
-      this.unUseTags = this.allhistoryTags.filter((v) =>
-        skuIds.every((val) => val.name != v.name)
-      );
-      this.getHandleTable();
+    closeDialog(){
+      console.log("关闭")
+      this.dialogType = "add";
+      this.dialogObj={};
+      this.open = false;
+      this.getList()
     },
     getHandleTable() {
       this.form.skus = [];
@@ -699,33 +653,6 @@ export default {
         }
       });
     },
-    /** 提交按钮 */
-    submitForm() {
-      this.$refs["form"].validate((valid) => {
-        if (!valid) {
-          return;
-        }
-        this.form.picUrls = this.form.picUrls.split(",");
-        this.form.categoryId =
-          this.form.categoryIds[this.form.categoryIds.length - 1];
-        this.form.status = Number(this.form.status);
-        // 修改的提交
-        if (this.form.id != null) {
-          updateSpu(this.form).then((response) => {
-            this.$modal.msgSuccess("修改成功");
-            this.open = false;
-            this.getList();
-          });
-          return;
-        }
-        // 添加的提交
-        createSpu(this.form).then((response) => {
-          this.$modal.msgSuccess("新增成功");
-          this.open = false;
-          this.getList();
-        });
-      });
-    },
     /** 删除按钮操作 */
     handleDelete(row) {
       const id = row.id;

src/views/mall/product/spu/save.vue

@@ -193,6 +193,16 @@
       <!-- 销售设置 -->
       <el-tab-pane label="销售设置" name="fourth">
         <el-form ref="fourth" :model="baseForm" :rules="rules" label-width="100px" style="width: 95%">
+          <el-form-item label="所属品牌" prop="brandId">
+            <el-select v-model="baseForm.brandId" placeholder="请选择">
+                  <el-option
+                    v-for="item in brandList"
+                    :key="item.id"
+                    :label="item.name"
+                    :value="item.id">
+                  </el-option>
+            </el-select>
+          </el-form-item>
           <el-form-item label="虚拟销量" prop="virtualSalesCount">
             <el-input v-model="baseForm.virtualSalesCount" placeholder="请输入虚拟销量" oninput="value=value.replace(/^(0+)|[^\d]+/g,'')"/>
           </el-form-item>
@@ -221,8 +231,10 @@
 </template>
 
 <script>
+
+import {getBrandList} from "@/api/mall/product/brand";
 import {getProductCategoryList} from "@/api/mall/product/category";
-import {createSpu,} from "@/api/mall/product/spu";
+import {createSpu, getSpu} from "@/api/mall/product/spu";
 import {getPropertyPage,} from "@/api/mall/product/property";
 import Editor from "@/components/Editor";
 import ImageUpload from "@/components/ImageUpload";
@@ -232,6 +244,13 @@ export default {
     Editor,
     ImageUpload
   },
+  props:{//props列表
+    type:{
+      type:String,
+      default:"add" //定义参数默认值
+    },
+    obj: Object
+  },
   data() {
     return {
       activeName: "base",
@@ -251,6 +270,7 @@ export default {
         status: 0,
         virtualSalesCount: 0,
         showStock: true,
+        brandId: null
       },
       categoryList: [],
       // 价格库存
@@ -270,6 +290,7 @@ export default {
         // },
       ],
       propertyPageList: [],
+      brandList: [],
       specValue: null,
 
       // 表单校验
@@ -283,11 +304,13 @@ export default {
       },
     };
   },
-
   created() {
-
+    this.getListBrand();
     this.getListCategory();
     this.getPropertyPageList();
+    if(this.type == 'upd'){
+      this.updateType(this.obj.id)
+    }
   },
   methods: {
     removeSpec(index){
@@ -351,6 +374,13 @@ export default {
       getProductCategoryList().then((response) => {
         this.categoryList = this.handleTree(response.data, "id", "parentId");
       });
+    },
+     /** 查询品牌列表 */
+    getListBrand() {
+      // 执行查询
+      getBrandList().then((response) => {
+        this.brandList = response.data;
+      });
     },
     cancel() {
       this.$emit("closeDialog");
@@ -366,7 +396,13 @@ export default {
         rates.forEach(r => {
           let properties = []
             Array.of(r.spec).forEach(s => {
-              Array.of(s).forEach((v, i) => {
+              let obj;
+               if (s instanceof Array) {
+                  obj = s;
+               }else{
+                  obj = Array.of(s);
+               }
+              obj.forEach((v, i) => {
                 console.log(this.dynamicSpec, r, s, v, i)
                 let specValue = this.dynamicSpec[i].specValue.find(o => o.name == v);
                 console.log(specValue)
@@ -382,9 +418,6 @@ export default {
         rates[0].name = this.baseForm.name;
         rates[0].status = this.baseForm.status;
       }
-
-      console.log(rates)
-
       let form = this.baseForm
       if(form.picUrls instanceof Array){
         form.picUrls = form.picUrls.flatMap(m=>m.split(','))
@@ -422,6 +455,24 @@ export default {
       spec.specValue = obj.propertyValueList;
       this.dynamicSpec = dynamicSpec;
       this.buildRatesFormRates();
+    },
+    updateType(id){
+        getSpu(id).then((response) =>{
+            console.log(response)
+            let data = response.data;
+            this.baseForm.name=data.name;
+            this.baseForm.sellPoint=data.sellPoint;
+            this.baseForm.categoryIds=data.categoryIds;
+            this.baseForm.sort=data.sort;
+            this.baseForm.description=data.description;
+            this.baseForm.picUrls=data.picUrls;
+            this.baseForm.status=data.status;
+            this.baseForm.virtualSalesCount=data.virtualSalesCount;
+            this.baseForm.showStock=data.showStock;
+            this.baseForm.brandId=data.brandId;
+            this.ratesForm.spec=data.specType;
+            this.ratesForm.rates=data.skus
+        })
     }
   },
 };