|
|
@@ -10,7 +10,7 @@
|
|
|
<view class="basis-xxl">
|
|
|
<scroll-view scroll-x class="nav z" scroll-with-animation :scroll-left="headTab.scrollLeft">
|
|
|
<block v-for="(item,index) in headTab.list" :key="index">
|
|
|
- <view class="cu-item" :class="index==headTab.TabCur?'select':''" @tap="tabSelect(index,item)" :data-id="index">
|
|
|
+ <view class="cu-item" :class="index== headTab.TabCur ?'select':''" @tap="tabSelect(index,item)" :data-id="index">
|
|
|
<view>{{item}}</view>
|
|
|
<view class="tab-dot bg-white"/>
|
|
|
</view>
|
|
|
@@ -21,8 +21,8 @@
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
- <view class="activity-container">
|
|
|
- <view class="activity-section one clearfix" v-for="(item, index) in dataList">
|
|
|
+ <view class="activity-container" id="activityContainer">
|
|
|
+ <view class="activity-section one clearfix" :class="'activity-section-'+ index" v-for="(item, index) in dataList" :key="index" :data-index='index' >
|
|
|
<view class="section-title" :class="'section-title-'+ index" >
|
|
|
<view class="name">{{item.classificationName}}</view>
|
|
|
</view>
|
|
|
@@ -94,7 +94,8 @@
|
|
|
scrollLeft: 0,
|
|
|
list: [],
|
|
|
},
|
|
|
- dataList:[]
|
|
|
+ dataList:[],
|
|
|
+ scrollTopArray:[]
|
|
|
}
|
|
|
},
|
|
|
onLoad() {
|
|
|
@@ -114,9 +115,10 @@
|
|
|
let data = response.data
|
|
|
this.headTab.list = data.brandNames
|
|
|
this.dataList = data.brandList
|
|
|
- this.dataList.forEach(item =>{
|
|
|
+ this.dataList.forEach((item,index) =>{
|
|
|
let productList = item.productList
|
|
|
let newProductList = []
|
|
|
+ // 处理商品价格
|
|
|
productList.forEach(el=>{
|
|
|
let value = el.retailPrice
|
|
|
let number = Number(value) - Number(value)%1;
|
|
|
@@ -143,16 +145,15 @@
|
|
|
this.$util.msg(error.msg,2000)
|
|
|
})
|
|
|
},
|
|
|
- //tab菜单被点击
|
|
|
- tabSelect(index,item) {
|
|
|
+ tabSelect(index,item) {//tab菜单被点击
|
|
|
this.headTab.TabCur = index;
|
|
|
this.headTab.scrollLeft = (index - 1) * 60;
|
|
|
- let classIndex = '.section-title-'+index;
|
|
|
+ let classIndex = '.activity-section-'+index;
|
|
|
uni.createSelectorQuery().select('.topBanner').boundingClientRect((data)=>{//最外层盒子节点
|
|
|
uni.createSelectorQuery().select(classIndex).boundingClientRect((res)=>{//最外层盒子节点
|
|
|
uni.pageScrollTo({
|
|
|
- duration:500,//过渡时间必须为0，uniapp bug，否则运行到手机会报错
|
|
|
- scrollTop:res.top - data.top - 44,//滚动到实际距离是元素距离顶部的距离减去最外层盒子的滚动距离
|
|
|
+ duration:200,//过渡时间必须为0，uniapp bug，否则运行到手机会报错
|
|
|
+ scrollTop:res.top - data.top - 60,//滚动到实际距离是元素距离顶部的距离减去最外层盒子的滚动距离
|
|
|
})
|
|
|
}).exec()
|
|
|
}).exec()
|
|
|
@@ -185,9 +186,22 @@
|
|
|
onPageScrollTop(){
|
|
|
uni.pageScrollTo({
|
|
|
scrollTop: 0,
|
|
|
- duration: 800
|
|
|
+ duration: 600
|
|
|
});
|
|
|
},
|
|
|
+ createSelectorQuery(e,el){
|
|
|
+ let self = this
|
|
|
+ let index = el.index
|
|
|
+ let classIndex = '.activity-section-'+index;
|
|
|
+ // console.log('滚动条=======>',e.scrollTop)
|
|
|
+ uni.createSelectorQuery().select(classIndex).boundingClientRect((res)=>{//最外层盒子节点4
|
|
|
+ if( res.top < 60 ){
|
|
|
+ self.headTab.TabCur = index;
|
|
|
+ console.log('选项卡索引',self.headTab.TabCur)
|
|
|
+ self.headTab.scrollLeft = (index - 1) * 60;
|
|
|
+ }
|
|
|
+ }).exec()
|
|
|
+ },
|
|
|
},
|
|
|
onShareAppMessage (res){//小程序三点分享转发
|
|
|
if (res.from === 'button') {
|
|
|
@@ -200,16 +214,18 @@
|
|
|
}
|
|
|
},
|
|
|
onPageScroll(e){//实时获取到滚动的值
|
|
|
- if(e.scrollTop>450){
|
|
|
+ if(e.scrollTop > 450){
|
|
|
this.inputActive = 'fixed'
|
|
|
}else{
|
|
|
this.inputActive = 'float'
|
|
|
}
|
|
|
- if(e.scrollTop>1000){
|
|
|
+ if(e.scrollTop>600){
|
|
|
this.showTop = true
|
|
|
}else{
|
|
|
this.showTop = false
|
|
|
}
|
|
|
+ //锚点切换
|
|
|
+ // this.createSelectorQuery(e)
|
|
|
},
|
|
|
onPullDownRefresh() {//下拉刷新
|
|
|
uni.stopPullDownRefresh()
|
|
|
@@ -396,7 +412,7 @@
|
|
|
height: 60rpx;
|
|
|
padding:0 20rpx;
|
|
|
&.none{
|
|
|
- padding: 6rpx 0;
|
|
|
+ padding: 6rpx 20rpx;
|
|
|
margin-top: 30rpx;
|
|
|
.price-left{
|
|
|
float: left;
|
