商品规格SKU生成 一键设置

src/views/product/info/index.vue

@@ -315,11 +315,37 @@
               </el-option>
             </el-select>
           </el-form-item>
+          <el-form :inline="true" :model="oneSettingForm" class="demo-form-inline">
+            <el-form-item label="图片">
+              <image-upload
+                :limit="1"
+                :is-show-tip="false"
+                v-model="oneSettingForm.image" placeholder="审批人"></image-upload>
+            </el-form-item>
+            <el-form-item label="价格">
+              <el-input v-model="oneSettingForm.price" placeholder="价格"></el-input>
+            </el-form-item>
+            <el-form-item label="库存">
+              <el-input v-model="oneSettingForm.stock" placeholder="库存"></el-input>
+            </el-form-item>
+            <el-form-item>
+              <el-button type="primary" @click="oneSetting">一键设置</el-button>
+            </el-form-item>
+          </el-form>
           <el-table
             :data="skuList"
             border
             style="width: 100%">
-            <el-table-column v-for="title in titleList" :prop="title.prop" :label="title.label"> </el-table-column>
+            <el-table-column v-for="title in titleList" :prop="title.prop" :label="title.label">
+              <template slot-scope="scope">
+                <span v-if="title.prop.indexOf('prop') > -1">{{scope.row[title.prop]}}</span>
+                <el-input-number v-else-if="['stock','price'].indexOf(title.prop) > -1" v-model="scope.row[title.prop]" :precision="2" :step="0.01"></el-input-number>
+                <image-upload v-else-if="['image'].indexOf(title.prop) > -1" v-model="scope.row[title.prop]"
+                :limit="1"
+                :is-show-tip="false"
+                ></image-upload>
+              </template>
+            </el-table-column>
           </el-table>
         </div>
         <div v-show="stepNumber === 3">
@@ -412,19 +438,26 @@ export default {
         attributeList: []
       },
       templateTitleList: [
+        {
+          "label":"规格图片",
+          "prop":"image"
+        },
         {
           "label":"商品库存",
           "prop":"stock"
         }, {
           "label":"商品价格",
           "prop":"price"
-        }, {
-          "label":"规格图片",
-          "prop":"image"
         }
       ],
       titleList: [],
-      skuList: []
+      skuList: [],
+      oneSettingForm: {
+        "image": null,
+        "stock": null,
+        "price": null
+
+      }
     };
   },
   watch: {
@@ -461,6 +494,9 @@ export default {
     this.getList();
   },
   methods: {
+    oneSetting(){
+
+    },
     changeRule(ruleId){
       this.titleList = []
       let ruleInfo = this.ruleList.find(ruleInfo => ruleInfo.id === ruleId);
@@ -480,7 +516,7 @@ export default {
       for (let i = 0; i < skuTotal; i++) {
         this.skuList.push(
           {
-            "image": "123",
+            "image": null,
             "price": 85.62,
             "stock": 236
           }
@@ -498,11 +534,12 @@ export default {
           forSize = forSize * ruleAttrList[forIndex].valueList.length
         }
         console.log(`${ruleAttrInfo.name} 规格 连续出现次数：${continuousSize}  循环出现次数：${forSize}`)
+        let counter = 0;
         for (let forIndex = 0; forIndex < forSize; forIndex++) {
           const {valueList} = ruleAttrInfo;
           valueList.forEach(value => {
             for (let continuousIndex = 0; continuousIndex < continuousSize; continuousIndex++) {
-              this.skuList
+              this.skuList[counter++]["prop"+currentIndex] = value;
             }
           })
         }