TalentService-mobile/pages/index/index.vue

71 lines
1.5 KiB
Vue

<template>
<view>
<view class="u-page">
<Home :bgColor="getBgColor" v-show="current===0" />
<PolicyList v-show="current===1" />
<ActivityList v-show="current===2" />
<My v-show="current===3" />
</view>
<u-tabbar v-model="current" activeColor="#94ceff" :list="list"></u-tabbar>
</view>
</template>
<script>
import Home from '@/pages/home/home.vue';
import PolicyList from '@/pages/policy/policyList.vue';
import ActivityList from '@/pages/activity/activityList.vue';
import My from '@/pages/my/my.vue';
export default {
components: {
Home,PolicyList,ActivityList,My
},
data() {
return {
list: [{
iconPath: "home",
selectedIconPath: "home-fill",
text: '首页',
customIcon: false,
},
{
iconPath: "chat",
selectedIconPath: "chat-fill",
text: '最新政策',
customIcon: false,
},
{
iconPath: "grid",
selectedIconPath: "grid-fill",
text: '人才活动',
customIcon: false,
},
{
iconPath: "account",
selectedIconPath: "account-fill",
text: '我的',
customIcon: false,
}
],
menuHeight:uni.getMenuButtonBoundingClientRect(),
current: 0,// 当前页
topLevel: 0,// 页面是否滚动到顶
};
},
computed:{
getBgColor(){
return `rgba(75, 170, 251,${this.topLevel})`;
}
},
onPageScroll(e) {
const level = e.scrollTop/this.menuHeight.height;
if(level<=1) this.topLevel = level;
else this.topLevel = 1;
},
methods: {
}
}
</script>
<style lang="scss" scoped>
</style>