Browse Source

优化商品分类左右联动

feature/feature-compatible
wenghaocan 7 years ago
parent
commit
44134cc409
1 changed files with 29 additions and 13 deletions
  1. 42
      src/view/goods-classify.vue

42
src/view/goods-classify.vue

@ -6,7 +6,7 @@
<div class="content"> <div class="content">
<div class="left" ref="menuWrapper"> <div class="left" ref="menuWrapper">
<ul> <ul>
<li v-if="goodsList.length != 0" v-for="(item,index) in goodsList" :key="index" :class="{'on': currentIndex === index}" @click="selectMenu(index,$event)">
<li v-if="goodsList.length != 0" :class="{'on': (currentIndex < 0 ? 0 : currentIndex) === index}" v-for="(item,index) in goodsList" :key="index" @click="selectMenu(index,$event)">
<a href="javascript:void(0)"> <a href="javascript:void(0)">
{{item.combinationName}} {{item.combinationName}}
<img src="../assets/images/icon/hot.png" class="i-hot" v-if="item.label == '2'" /> <img src="../assets/images/icon/hot.png" class="i-hot" v-if="item.label == '2'" />
@ -62,22 +62,30 @@
imghost: "http://medou.oss-cn-shenzhen.aliyuncs.com/", imghost: "http://medou.oss-cn-shenzhen.aliyuncs.com/",
listHeight: [], // listHeight: [], //
scrollY: {}, scrollY: {},
clickTrue: false,
currentNum: 0 currentNum: 0
} }
}, },
computed: { computed: {
/*currentIndex () {
const { scrollY, listHeight } = this
currentIndex () {
const { scrollY, listHeight, clickTrue, currentNum } = this
let index = listHeight.findIndex((height, index) => { let index = listHeight.findIndex((height, index) => {
return scrollY >= listHeight[index] && scrollY < listHeight[index + 1] return scrollY >= listHeight[index] && scrollY < listHeight[index + 1]
}) })
if (scrollY > listHeight[index] + 50) { if (scrollY > listHeight[index] + 50) {
index++ index++
} }
if(listHeight[listHeight.length-1] - this.$refs.foodWrapper.clientHeight <= scrollY ) {
if(clickTrue) {
return currentNum
} else {
return (listHeight.length-1)
}
}
return index return index
}*/
}
currentIndex(){
/*currentIndex() {
for (let i = 0; i < this.listHeight.length; i++){ for (let i = 0; i < this.listHeight.length; i++){
let height = this.listHeight[i] let height = this.listHeight[i]
let height2 = this.listHeight[i + 1] let height2 = this.listHeight[i + 1]
@ -95,7 +103,7 @@
} }
} }
return 0 return 0
}
}*/
}, },
components: { components: {
Toast, Toast,
@ -129,13 +137,20 @@
that.showLoading = false that.showLoading = false
if ( res.code == 0 ){ if ( res.code == 0 ){
this.goodsList = res.data || [] this.goodsList = res.data || []
let list = []
for (var i = 0; i < this.goodsList.length; i++) {
if (this.goodsList[i].goodsList.length != 0) {
list.push(this.goodsList[i])
}
}
this.goodsList = list
this.$nextTick(function(){ this.$nextTick(function(){
//scroll //scroll
this._initScroll() this._initScroll()
// //
this._calculateHeight(); this._calculateHeight();
// //
this.autoSelect()
this.autoSelect(list, this.c_no)
}) })
} else { } else {
this.$vux.toast.text(res.msg,"middle"); this.$vux.toast.text(res.msg,"middle");
@ -182,24 +197,25 @@
this.foodsScroll.scrollToElement(el,300) this.foodsScroll.scrollToElement(el,300)
},*/ },*/
selectMenu(index, event){ selectMenu(index, event){
this.clickTrue = true //clickTruetrue
this.clickTrue = true //clickTruetrue
this.currentNum = index this.currentNum = index
//better-scrolleventevent_constructed //better-scrolleventevent_constructed
// _constructedreturn // _constructedreturn
if (event && !event._constructed){ if (event && !event._constructed){
return return
} else { } else {
let foodList = this.$refs.foodWrapper.getElementsByClassName("food-list-hook");
let foodList = this.$refs.foodWrapper.getElementsByClassName("food-list-hook");
let el = foodList[index]; let el = foodList[index];
this.foodsScroll.scrollToElement(el,300) this.foodsScroll.scrollToElement(el,300)
} }
}, },
autoSelect() {
for (let i = 0; i < this.goodsList.length; i++) {
if(this.goodsList[i].combinationNo == this.c_no) {
autoSelect(list, no) {
list.forEach((v, i, a) => {
if(v.combinationNo === no) {
this.selectMenu(i) this.selectMenu(i)
} }
}
  })
}, },
ShareWenXin (){ ShareWenXin (){
var merchantNo = this.no var merchantNo = this.no

Loading…
Cancel
Save