商品增加小程序底部栏配置

src/views/bxg/activity/bargain/index.vue

@@ -153,6 +153,7 @@ export default {
         price: data.price,
         minPrice: data.minPrice,
         num: data.num,
+        temp_id: data.temp_id,
         bargainMaxPrice: data.bargainMaxPrice,
         bargainMinPrice: data.bargainMinPrice,
         bargainNum: data.bargainNum,

src/views/bxg/shop/goods/form.vue

@@ -209,29 +209,19 @@
               </div>
             </el-form-item>
           </el-col>
-          <el-col :span="12">
-            <el-form-item label="无理由退款(天)：">
-              <div class="acea-row">
-                <el-input-number v-model="formValidate.config.withoutReason"></el-input-number>
-              </div>
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="价保(天)：" >
-              <div class="acea-row">
-                <el-input-number v-model="formValidate.config.confirmed"></el-input-number>
-              </div>
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="无理由退款图标：" prop="image">
-              <single-pic v-model="formValidate.config.withoutReasonPic"  type="image" :num="1" :width="150" :height="150" />
-            </el-form-item>
-          </el-col>
-
-          <el-col :span="12">
-            <el-form-item label="价保图标：" prop="image">
-              <single-pic v-model="formValidate.config.confirmedPic"  type="image" :num="1" :width="150" :height="150" />
+          <el-col :span="24">
+            <el-form-item label="底部栏目配置" >
+              <el-tabs v-model="editableTabsValue" type="card" editable @edit="handleTabsEdit">
+                <el-tab-pane
+                  :key="item.name"
+                  v-for="(item, index) in editableTabs"
+                  :label="item.title"
+                  :name="item.name"
+                >
+                  <span style="display: flex;margin-bottom:10px">当前栏目标题：<el-input style="width:300px" v-model="item.content"></el-input></span>
+                  <single-pic v-model="item.configuration"  type="image" :num="1" :width="150" :height="150" />
+                </el-tab-pane>
+              </el-tabs>
             </el-form-item>
           </el-col>
         </el-row>
@@ -437,6 +427,9 @@ export default {
   components: { editor, picUpload, mulpicUpload, Treeselect, MaterialList, UeditorWrap, singlePic },
   data() {
     return {
+      tabIndex: 0,
+      editableTabsValue: '1',
+      editableTabs:[],
       //品牌列表
       parameter:[],
       brandList:[],
@@ -516,12 +509,7 @@ export default {
         id: 0,
         spec_type: 0,
         temp_id: '',
-        config:{
-          withoutReason:null,
-          withoutReasonPic:'',
-          confirmed:null,
-          confirmedPic:'',
-        },
+        config:[],
         attrs: [],
         items: [
           {
@@ -616,12 +604,49 @@ export default {
       if (val) {
         this.form.slider_image = val.join(',')
       }
-    }
+    },
+    editableTabs: {
+      handler(newVal, oldVal) {
+        console.log(newVal, oldVal);
+        this.formValidate.config=this.editableTabs
+      },
+      // 开启深度监听
+      deep: true
+    },
   },
   mounted () {
     this.getInfo();
   },
   methods: {
+    handleTabsEdit(targetName, action) {
+      if (action === 'add') {
+        let newTabName = ++this.tabIndex + '';
+        this.editableTabs.push({
+          title: 'New Tab',
+          name: newTabName,
+          content: 'New Tab content',
+          configuration:''
+        });
+        this.editableTabsValue = newTabName;
+      }
+      if (action === 'remove') {
+        let tabs = this.editableTabs;
+        let activeName = this.editableTabsValue;
+        if (activeName === targetName) {
+          tabs.forEach((tab, index) => {
+            if (tab.name === targetName) {
+              let nextTab = tabs[index + 1] || tabs[index - 1];
+              if (nextTab) {
+                activeName = nextTab.name;
+              }
+            }
+          });
+        }
+
+        this.editableTabsValue = activeName;
+        this.editableTabs = tabs.filter(tab => tab.name !== targetName);
+      }
+    },
     addParameter(){
       // console.log('this.formValidate.parameter',this.formValidate.parameter)
       if (!this.formValidate.parameter){
@@ -782,13 +807,9 @@ export default {
           let brand_id = parseInt(data.brand_id) || 0;
           this.attrs = data.items || [];
           if (data.config==undefined){
-            data['config']={
-              withoutReason:null,
-              withoutReasonPic:'',
-              confirmed:null,
-              confirmedPic:'',
-            }
+            data['config']=[]
           }
+          that.editableTabs=data.config
           that.formValidate = data;
           that.formValidate.cate_id = cate_id;
           that.formValidate.brand_id = brand_id;