商品编辑添加一键设置规格值功能业务

src/views/commodity/commoditySystem/addCommodity.vue

@@ -107,6 +107,7 @@
 
         <div class="style-container">
           <div class="multiple-styles">
+            <el-button class="add-attr-btn" type="primary" @click="showOneSetting">{{ $t('common.one-click-setting') }}</el-button>
             <el-table :data="form.skus" style="width: 100%"
               :header-cell-style="{ background: '#EEF3FF', color: '#333333' }">
               <el-table-column v-for="(skuAttr, index) in form.names" :key="index" :label="langType=='en' ? skuAttr.skuName_EN : skuAttr.skuName_ZH">
@@ -116,21 +117,21 @@
                   }}
                 </template>
               </el-table-column>
-              <el-table-column label="售价">
+              <el-table-column :label="$t('product.price')">
                 <template slot-scope="scope">
                   <!-- <el-input v-model="scope.row.price" type="number" oninput="value=value.replace(/-/, '')" /> -->
                   <el-input-number v-model="scope.row.price" :controls="false" :max="999999999" :min="0" :precision="2"
                     :step="0.01" />
                 </template>
               </el-table-column>
-              <el-table-column label="原价">
+              <el-table-column :label="$t('product.originalprice')">
                 <template slot-scope="scope">
                   <!-- <el-input v-model="scope.row.originalPrice" type="number" oninput="value=value.replace(/-/, '')" /> -->
                   <el-input-number v-model="scope.row.originalPrice" :controls="false" :max="999999999" :min="0"
                     :precision="2" :step="0.01" />
                 </template>
               </el-table-column>
-              <el-table-column label="税率">
+              <el-table-column :label="$t('product.rate')">
                 <template slot-scope="scope">
                   <el-input-number v-model="scope.row.rate" :controls="false" :min="0" :precision="2" :step="0.01" />
                 </template>
@@ -274,6 +275,8 @@
         @sure="editSkuAttrSure"
       />
     </el-dialog>
+
+    <one-setting ref="oneSetting" @onOnSetting="onOnSetting"/>
   </div>
 </template>
 
@@ -295,6 +298,7 @@ import { uploadUrl } from '@/utils/request'
 import { getToken,getBusinessId, getLanguage } from '@/utils/auth'
 import { storehouseGetAll } from '@/api/shopSys'
 import { shopListGetAll } from '@/api/shop'
+import OneSetting from "@/views/commodity/commoditySystem/oneSetting";
 
 export default {
   filters: {
@@ -317,6 +321,7 @@ export default {
     }
   },
   components: {
+    OneSetting,
     Tinymce,
     EditSkuAttr
   },
@@ -945,6 +950,22 @@ export default {
       this.form.names = JSON.parse(JSON.stringify(this.newSkuAttrList))
       console.log(this.form.names)
       this.skuFormat()
+    },
+
+    showOneSetting() {
+      this.$refs.oneSetting.showOnSetDialog = true
+    },
+
+    onOnSetting(settingInfo){
+      console.log('onOnSetting--->', settingInfo)
+      this.form.skus.forEach(sku => {
+        sku.price = settingInfo.price
+        sku.originalPrice = settingInfo.originalPrice
+        sku.rate = settingInfo.rate
+        sku.storehouseId = settingInfo.storehouseId
+        sku.weight = settingInfo.weight
+        sku.sku = settingInfo.sku
+      })
     }
   }
 }

src/views/commodity/commoditySystem/oneSetting.vue

@@ -0,0 +1,128 @@
+<template>
+  <el-dialog :title="$t('common.one-click-setting')" width="70%" :visible.sync="showOnSetDialog" append-to-body @close="onDialogClose">
+    <div>
+
+      <el-row>
+        <el-col :span="4" style="text-align: center">{{$t('product.price')}}</el-col>
+        <el-col :span="4" style="text-align: center">{{$t('product.originalprice')}}</el-col>
+        <el-col :span="4" style="text-align: center">{{$t('product.rate')}}</el-col>
+        <el-col :span="4" style="text-align: center">{{$t('logistics.storehouse')}}</el-col>
+        <el-col :span="4" style="text-align: center">{{$t('product.weight')}}</el-col>
+        <el-col :span="4" style="text-align: center">{{$t('product.Internationalbarcode')}}</el-col>
+      </el-row>
+      <el-row style="margin-top: 10px">
+        <el-col :span="4">
+          <el-input-number v-model="setForm.price" :controls="false" :max="999999999" :min="0" :precision="2"
+                           :step="0.01" />
+        </el-col>
+        <el-col :span="4">
+          <el-input-number v-model="setForm.originalPrice" :controls="false" :max="999999999" :min="0" :precision="2"
+                           :step="0.01" />
+        </el-col>
+        <el-col :span="4">
+          <el-input-number v-model="setForm.rate" :controls="false" :min="0" :precision="2" :step="0.01" />
+        </el-col>
+        <el-col :span="4">
+          <el-select v-model="setForm.storehouseId" :placeholder="$t('logistics.storehousehint')" clearable style="width: 158px">
+            <el-option v-for="(item, index) in storehouseList" :key="index" :label="item.storehouseName"
+                       :value="item.storehouseId" />
+          </el-select>
+        </el-col>
+        <el-col :span="4">
+          <el-input-number v-model="setForm.weight" :controls="false" :max="999" :min="0" :precision="6"
+                           :step="0.01" />
+        </el-col>
+        <el-col :span="4">
+          <el-input v-model="setForm.sku" maxlength="20"  style="width: 158px"/>
+        </el-col>
+      </el-row>
+
+      <div slot="footer" class="dialog-footer" style="margin-top: 30px">
+        <el-button @click="onCancel">{{ $t('common.cancel') }}</el-button>
+        <el-button type="primary" @click="onSubmit">{{ $t('common.sure') }}</el-button>
+      </div>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+import {storehouseGetAll} from "@/api/shopSys";
+
+export default {
+  name: 'oneSetting',
+  data() {
+    return {
+      showOnSetDialog: false,
+      setForm: {
+        price: 0.00,
+        originalPrice: 0.00,
+        rate: 0.00,
+        storehouseId: undefined,
+        weight: 0.00,
+        sku: ''
+      },
+      //仓库列表
+      storehouseList: [],
+    }
+  },
+
+  mounted() {
+    //仓库列表
+    this.getStorehouseList()
+  },
+
+  methods: {
+
+    // 获取仓库
+    async getStorehouseList() {
+      const res = await storehouseGetAll({ page: 1, pageSize: 100 })
+      this.storehouseList = res.data.list
+    },
+
+    onSubmit() {
+      this.$emit('onOnSetting', this.setForm)
+      this.showOnSetDialog = false
+    },
+
+    onCancel() {
+      this.setForm = {
+        price: 0.00,
+        originalPrice: 0.00,
+        rate: 0.00,
+        storehouseId: undefined,
+        weight: 0.00,
+        sku: ''
+      }
+      this.showOnSetDialog = false
+    },
+
+    onDialogClose() {
+      this.setForm = {
+        price: 0.00,
+        originalPrice: 0.00,
+        rate: 0.00,
+        storehouseId: undefined,
+        weight: 0.00,
+        sku: ''
+      }
+    }
+  }
+}
+</script>
+
+<style scoped lang='scss'>
+
+::v-deep .el-input-number.is-without-controls .el-input__inner {
+  padding-left: 15px;
+  padding-right: 15px;
+}
+
+::v-deep .el-input-number .el-input__inner {
+  padding-left: 10px;
+  padding-right: 50px;
+  text-align: center;
+}
+::v-deep .el-input-number{
+  width: 158px;
+}
+</style>