xieruidong 2 years ago
parent
commit
854af49ab5
2 changed files with 106 additions and 37 deletions
  1. 57 20
      application/admin/view/goods/add.html
  2. 49 17
      public/assets/js/backend/goods.js

+ 57 - 20
application/admin/view/goods/add.html

@@ -148,48 +148,85 @@
             </el-form-item>
             <el-form-item label="参数">
                 <div>
-                    <div v-for="(size,sizeIdx) in form.size" :key="sizeIdx">
-                        <div v-for="(spec,specIdx) in form.spec">
-                            <div class="name">{{size.name}}&{{spec.name}}</div>
-                            <el-input v-model="size.spec[specIdx].num_stock" class="sInput" placeholder="库存"></el-input>
-                            <el-input v-model="size.spec[specIdx].num_stock_kill" class="sInput" placeholder="秒杀库存"></el-input>
-                            <el-input v-model="size.spec[specIdx].amount_cost" class="sInput" placeholder="成本价"></el-input>
+                    <div v-for="(size,sizeIdx) in form.sku" :key="sizeIdx">
+                        <div>
+                            <div class="name">{{size.size.name}}&{{size.spec.name}}</div>
+                            <el-input v-model="size.num_stock" class="sInput" placeholder="库存"></el-input>
+                            <el-input v-model="size.num_stock_kill" class="sInput" placeholder="秒杀库存"></el-input>
+                            <el-input v-model="size.amount_cost" class="sInput" placeholder="成本价"></el-input>
                         </div>
                     </div>
                 </div>
             </el-form-item>
-            <el-form-item label="售价">
+           <el-form-item label="售价">
                 <div>
-                    <div v-for="(size,sizeIdx) in form.size" :key="sizeIdx">
-                        <div v-for="(spec,specIdx) in form.spec">
-                            <div class="name">{{size.name}}&{{spec.name}}</div>
-                            <el-button size="mini" @click="addLadder(size.spec[specIdx].amount_ladder)">添加</el-button>
-                            <div v-for="(item,ladderIdx) in size.spec[specIdx].amount_ladder">
+                    <div v-for="(size,sizeIdx) in form.sku" :key="sizeIdx">
+                        <div>
+                            <div class="name">{{size.size.name}}&{{size.spec.name}}</div>
+                            <el-button size="mini" @click="addLadder(size.amount_ladder)">添加</el-button>
+                            <div v-for="(item,ladderIdx) in size.amount_ladder">
                                 <el-input v-model="item.min" class="smInput" placeholder="数量区间"></el-input>
                                 <el-input v-model="item.max" class="smInput" placeholder="数量区间"></el-input>
                                 <el-input v-model="item.amount" class="smInput" placeholder="价格"></el-input>
-                                <el-button @click="delLadder(size.spec[specIdx].amount_ladder,ladderIdx)" size="mini" type="danger">删除</el-button>
+                                <el-button @click="delLadder(size.amount_ladder,ladderIdx)" size="mini" type="danger">删除</el-button>
                             </div>
                         </div>
                     </div>
                 </div>
             </el-form-item>
-            <el-form-item label="秒杀价" v-if="form.is_kill">
+            <el-form-item label="秒杀价">
                 <div>
-                    <div v-for="(size,sizeIdx) in form.size" :key="sizeIdx">
-                        <div v-for="(spec,specIdx) in form.spec">
-                            <div class="name">{{size.name}}&{{spec.name}}</div>
-                            <el-button size="mini" @click="addLadder(size.spec[specIdx].amount_kill_ladder)">添加</el-button>
-                            <div v-for="(item,ladderIdx) in size.spec[specIdx].amount_kill_ladder">
+                    <div v-for="(size,sizeIdx) in form.sku" :key="sizeIdx">
+                        <div>
+                            <div class="name">{{size.size.name}}&{{size.spec.name}}</div>
+                            <el-button size="mini" @click="addLadder(size.amount_kill_ladder)">添加</el-button>
+                            <div v-for="(item,ladderIdx) in size.amount_kill_ladder">
                                 <el-input v-model="item.min" class="smInput" placeholder="数量区间"></el-input>
                                 <el-input v-model="item.max" class="smInput" placeholder="数量区间"></el-input>
                                 <el-input v-model="item.amount" class="smInput" placeholder="价格"></el-input>
-                                <el-button @click="delLadder(size.spec[specIdx].amount_kill_ladder,ladderIdx)" size="mini" type="danger">删除</el-button>
+                                <el-button @click="delLadder(size.amount_kill_ladder,ladderIdx)" size="mini" type="danger">删除</el-button>
                             </div>
                         </div>
                     </div>
                 </div>
             </el-form-item>
+            <form id="add-form" class="form-horizontal" role="form" data-toggle="validator" method="POST">
+                <div class="display-flex" style="margin: 0;align-items: flex-start;">
+                    <label class="control-label" style="width: 100px;
+                    padding-right: 20px;
+                    font-weight: 600;
+                    font-size: 14px;
+                    color: #606266;">{:__('Content')}:</label>
+                    <div style="flex: 1;">
+                        <textarea id="c-content" class="form-control editor" rows="5" name="row[content]" cols="50"></textarea>
+                    </div>
+                </div>
+            </form>
+            <el-form-item label="规格介绍">
+                <div>
+                    <div v-for="(size,sizeIdx) in form.detail" :key="sizeIdx">
+                        <div class="name">{{size.size.name}}</div>
+                        <el-button size="mini" @click="addDetail(size.arr)">添加</el-button>
+                        <div v-for="(item,idx) in size.arr">
+                            <el-input v-model="item.name" class="sInput" placeholder="参数名"></el-input>
+                            <el-input v-model="item.value" class="sInput" placeholder="参数值"></el-input>
+                            <el-button @click="delDetail(size.arr,idx)" size="mini" type="danger">删除</el-button>
+                        </div>
+                    </div>
+                </div>
+            </el-form-item>
+            <el-form-item label="售后服务">
+                <div>
+                    <div>
+                        <el-button size="mini" @click="addService()">添加</el-button>
+                        <div v-for="(size,idx) in form.service" :key="idx">
+                            <el-input v-model="size.name" class="sInput" placeholder="参数名"></el-input>
+                            <el-input v-model="size.value" class="sInput" placeholder="参数值"></el-input>
+                            <el-button @click="delService(idx)" size="mini" type="danger">删除</el-button>
+                        </div>
+                    </div>
+                </div>
+            </el-form-item>
         </el-form>
     </div>
 <script>

+ 49 - 17
public/assets/js/backend/goods.js

@@ -229,14 +229,21 @@ define(['jquery', 'bootstrap', 'backend', 'table', 'form'], function ($, undefin
                             status:1,
                             logo:[],
                             video:null,
-                            size:[],
-                            spec:[],
+                            size:{},
+                            spec:{},
+                            sku:{},
+                            detail:{},
+                            service:[],
                         },
                         category:category,
                         status:status,
-                        logoLength:5
+                        logoLength:5,
+                        idx:1,
                     }
                 },
+                mounted(){
+                    Controller.api.bindevent();
+                },
                 methods:{
                     addImg(type, index, multiple) {
                         let that = this;
@@ -271,34 +278,47 @@ define(['jquery', 'bootstrap', 'backend', 'table', 'form'], function ($, undefin
                         this.form.video=null
                     },
                     addSize(type){
-                        this.form[type].push({
+                        this.idx++
+                        this.$set(this.form[type],this.idx,{
                             type,
                             name:null
                         })
-                        this.form.size.forEach(size=>{
-                            if(!size.spec){
-                                size.spec={}
-                            }
-                            this.form.spec.forEach((spec,spec_idx)=>{
-                                if(!size.spec[spec_idx]){
-                                    size.spec[spec_idx]={
+                        this.$set(this.form.detail,this.idx,{
+                            arr:[],
+                            size:this.form[type][this.idx]
+                        })
+                        Object.keys(this.form.size).forEach(sizeIdx=>{
+                            let size=this.form.size[sizeIdx]
+                            Object.keys(this.form.spec).forEach((spec_idx)=>{
+                                let spec=this.form.spec[spec_idx],key=`${sizeIdx}_${spec_idx}`
+                                if(!this.form.sku[key]){
+                                    this.$set(this.form.sku,key,{
+                                        size,
+                                        spec,
                                         num_stock:null,
                                         num_stock_kill:null,
                                         amount_cost:null,
                                         amount_ladder:[{min:null,max:null,amount:null}],
                                         amount_kill_ladder:[{min:null,max:null,amount:null}],
-                                    }
+                                    })
                                 }
                             })
                         })
                     },
                     delSize(type,idx){
-                        this.form[type].splice(idx,1)
-                        if(type==='spec'){
-                            this.form.size.forEach(size=>{
-                                delete size.spec[idx]
+                        if(type==='size'){
+                            Object.keys(this.form.spec).forEach((spec_idx)=>{
+                                let key=`${idx}_${spec_idx}`
+                                this.$delete(this.form.sku,key)
+                            })
+                        }else{
+                            Object.keys(this.form.size).forEach((size_idx)=>{
+                                let key=`${size_idx}_${idx}`
+                                this.$delete(this.form.sku,key)
                             })
                         }
+                        this.$delete(this.form[type],idx)
+                        this.$delete(this.form.detail,idx)
                     },
                     addLadder(ladder){
                         ladder.push({min:null,max:null,amount:null})
@@ -309,7 +329,19 @@ define(['jquery', 'bootstrap', 'backend', 'table', 'form'], function ($, undefin
                             ladder.splice(idx, 1)
                         }
                         this.$forceUpdate()
-                    }
+                    },
+                    addDetail(arr){
+                        arr.push({name:null,value:null})
+                    },
+                    delDetail(arr,idx){
+                        arr.splice(idx, 1)
+                    },
+                    addService(){
+                        this.form.service.push({name:null,value:null})
+                    },
+                    delService(idx){
+                        this.form.service.splice(idx, 1)
+                    },
                 }
             })
         },