fanfan 4 months ago
parent 25e87f2701
commit b5fa643572
  1. 46
      pages/gamll/index.vue

@ -18,14 +18,17 @@
</view> </view>
</view> </view>
</view> </view>
<view class="tab_pos" style=""> <view class="tab_fix" :style="{ 'border-radius': radius}">
<view class="tab_bg" :style="{ 'border-radius': radius}"> <!-- <view class="tab_posxi" v-if="isAtTop"></view> -->
<view class="tab_pos">
<view class="tab_bg">
<view :class="[tabIndex==index ? 'tab_active' : 'tab_a']" v-for="(item,index) in tabbar" <view :class="[tabIndex==index ? 'tab_active' : 'tab_a']" v-for="(item,index) in tabbar"
@click="onChage(index)" :key="index"> @click="onChage(index)" :key="index">
{{item}} {{item}}
</view> </view>
</view> </view>
</view> </view>
</view>
<view class="tab-type"> <view class="tab-type">
<view class="tab-pro" v-for="(item,index) in tabType" :class="index==banIndex?'tab-pro-active':''" <view class="tab-pro" v-for="(item,index) in tabType" :class="index==banIndex?'tab-pro-active':''"
@click="onChageBan(index)" :key="index"> @click="onChageBan(index)" :key="index">
@ -255,6 +258,7 @@
retail: '', retail: '',
wholesale: '', wholesale: '',
scrollTop: 0, scrollTop: 0,
isAtTop: ''
} }
}, },
onLoad() { onLoad() {
@ -270,10 +274,19 @@
onShow() { onShow() {
}, },
// onPageScroll(e) { onPageScroll(e) {
// this.scrollTop=e.scrollTop this.checkIfElementIsAtTop()
// }, },
methods: { methods: {
checkIfElementIsAtTop() {
const query = uni.createSelectorQuery().in(this);
query.select('.tab_fix').boundingClientRect(data => {
if (data) {
// top0
this.isAtTop = data.top === 0;
}
}).exec();
},
goRules() { goRules() {
uni.navigateTo({ uni.navigateTo({
url: '/pages/gamll/rules' url: '/pages/gamll/rules'
@ -339,6 +352,7 @@
this.leftNum = index == 0 ? 33.33333 : 66.66666; this.leftNum = index == 0 ? 33.33333 : 66.66666;
this.tabIndex = index; this.tabIndex = index;
this.getRetailList() this.getRetailList()
this.getDescribe()
}, },
onChageBan(index) { onChageBan(index) {
this.banIndex = index this.banIndex = index
@ -689,10 +703,8 @@
} }
.tab_pos { .tab_fix {
position: relative; overflow: hidden;
width: 100%;
height: 126rpx;
position: -webkit-sticky; position: -webkit-sticky;
/* 针对Safari浏览器的兼容性 */ /* 针对Safari浏览器的兼容性 */
position: sticky; position: sticky;
@ -700,6 +712,20 @@
/* 设置吸顶的位置 */ /* 设置吸顶的位置 */
z-index: 99999; z-index: 99999;
/* 确保sticky元素在其他内容之上 */ /* 确保sticky元素在其他内容之上 */
background: linear-gradient(180deg, rgba(253, 202, 197, 1) 0.42%, rgba(254, 231, 229, 1) 32.99%, rgba(255, 255, 255, 1) 100%);
}
.tab_pos {
position: relative;
width: 100%;
height: 126rpx;
}
.tab_posxi {
// background: #fdcac5;
width: 100%;
height: 120rpx;
} }
.tab_bg { .tab_bg {
@ -710,7 +736,7 @@
display: flex; display: flex;
justify-content: center; justify-content: center;
// border-radius: 28rpx 28rpx, 0rpx, 0rpx; // border-radius: 28rpx 28rpx, 0rpx, 0rpx;
background: linear-gradient(180deg, rgba(253, 202, 197, 1) 0.42%, rgba(254, 231, 229, 1) 32.99%, rgba(255, 255, 255, 1) 100%);
} }
.tab_a { .tab_a {

Loading…
Cancel
Save