<template>
	<view class="pages">
		<view class="hold-status-bar"><!-- 占据了状态栏位置 --></view>
		<view class="custom-nav">
			<view class="custom-nav-left" @click="$api.goback"><text class="iconfont icon-jiantou"></text></view>
			<view class="custom-nav-center"></view>
		</view>
		<view class="top-img"><image :src="$getimg + 'use-bg-s1.png'" class="img" mode="widthFix"></image></view>
		<view class="use-wrap" :class="{shortscreen:!isheight}">
			<view class="use-wrap-header">
				<view class="til">价值实现</view>
				<view class="subtil" @click="useClick">
					<text>关于价值实现</text>
					<text class="iconfont icon-jiantou"></text>
				</view>
			</view>
			<view class="use-item" @click="lvyue">
				<image :src="$getimg + 'icon-lvyue.png'" class="use-item-img" mode="scaleToFill"></image>
				<view class="use-item-til">碳履约</view>
				<view class="use-item-subtil">(仅履约企业)</view>
			</view>
			<view class="use-item" @click="zhonghe">
				<image :src="$getimg + 'icon-zhonghe.png'" class="use-item-img" mode="scaleToFill"></image>
				<view class="use-item-til">企业碳中和</view>
			</view>
			<view class="use-item" @click="huodong">
				<image :src="$getimg + 'icon-tanpuhui.png'" class="use-item-img" mode="scaleToFill"></image>
				<view class="use-item-til">大型活动碳中和</view>
			</view>
			<view class="use-item" @click="shangcheng">
				<image :src="$getimg + 'icon-huodong.png'" class="use-item-img" mode="scaleToFill"></image>
				<view class="use-item-til">普惠商城</view>
			</view>
		</view>
		
		<!-- 自定义tabBar -->
		<!-- <hans-tabber :list="list" style="position:fixed;bottom:0;width:100%;left:0;right:0;" @tabChange="tabChange"></hans-tabber> -->
	</view>
</template>

<script>
import hansTabber from '../../components/hans-tabbar/hans-tabbar.vue';
export default {
	components: {
		hansTabber
	},
	data() {
		return {
			list: [
				{
					text: '首页',
					iconPath: '/static/img/icon_home.png',
					selectedIconPath: '/static/img/icon_home_active.png'
				},
				{
					text: '价值实现',
					iconPath: '/static/img/icon_use.png',
					selectedIconPath: '/static/img/icon_use_active.png'
				},
				{
					text: '我的信息',
					iconPath: '/static/img/icon_usercenter.png',
					selectedIconPath: '/static/img/icon_usercenter_active.png'
				}
			],
			$getimg: this.$getimg,
			token: '',
			params: {},
			isheight:false,
		};
	},
	onShow() {
		let self = this;
		//判断用户类别
		// uni.getStorage({
		// 	key: 'userInfo',
		// 	success: function(res) {
		// 		console.log('userInfo customerType', res.data.customerType);
		// 		if (res.data.customerType == '1') {
		// 			console.log('个人用户');
		// 			self.$api.href('/pages/mall/mall');
		// 		}
		// 	}
		// });
	},
	onLoad() {
		let self = this;
		uni.getSystemInfo({
		    success: function (res) {
				console.log('getSystemInfo',res);
				let windowscale = res.windowHeight/res.screenWidth;//屏幕高宽比 
				if(res.screenHeight>800){
					self.isheight = true;						
				}
		    }
		}); 
	},
	methods: {
		lvyue() {
			this.checkReject();
		},
		zhonghe() {
			this.checkReject();
		},
		huodong() {
			this.checkReject();
		},
		useClick() {
			this.$api.href('/pages/usercenter/question/question');
			// this.$api.msg('稍后展示')
		},
		shangcheng(){
			this.checkReject();
		},
		tabChange(index) {
			console.log(index);
			switch (index) {
				case 0:
					uni.switchTab({
						url: '../index/index'
					});
					break;
				case 1:
					return;
					break;
				case 2:
					uni.switchTab({
						url: '../usercenter/usercenter'
					});
					break;
				default:
					return;
			}
		},
		checkReject(){
			if(!this.$store.state.hasLogin){
				this.$api.msg('请先登录');
				setTimeout(i=>{
					uni.navigateTo({
						url: '/pages/login/loginType',
						fail:function(err){
							console.log(err)
						}
					});
				},2000);
				return;
			}else{
				this.$api.msg('你没有权限使用该功能!');
			};
		}
	}
};
</script>

<style>
@import url('./use.css');
</style>