<template>
	<view>
		<view class="u-page">
			<Home ref="home" @changeLoading="changeLoading" :bgColor="getBgColor" v-show="current===0" />
			<PolicyList ref="policy" style="height: 100vh" v-show="current===1" />
			<ActivityList ref="activity" v-show="current===2" />
			<My ref="my" v-show="current===3" />
		</view>
		<u-tabbar @change="beforeSwitch" :value="current" activeColor="#94ceff" :list="list"></u-tabbar>
		<Loading :show="loading" />
	</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,// 页面是否滚动到顶
				loading: true,// 加载
			};
		},
		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;
		},
		onShow() {
			let index = uni.getStorageSync('pageIndex');
			this.current = index?index:0;
			this.beforeSwitch(this.current);
		},
		onHide(){
			uni.setStorageSync('pageIndex',this.current);
		},
		methods: {
			beforeSwitch(index){
				try{
					this.current = index;
					this.loading = true;
					uni.setNavigationBarTitle({
						title: this.list[index].text
					});
					switch(index){
						case 0:
							this.$refs['home'].getHomeData();
							break;
						case 1:
							this.$refs['policy'].getDate();
							break;
						case 2:
							this.$refs['activity'].getDate();
							break;
						case 3:
							this.$refs['my'].refresh();
							break;
					}
				}catch(e){
				}finally{
					this.loading = false;
					return true;
				}
			},
			changeLoading(show){
				this.loading = show;
			}
		}
	}
</script>

<style lang="scss" scoped>
</style>