<template>
	<view class="statistics">
		<custom-nav :title="pageTitle"></custom-nav>
		<view class="content">
			<scroll-view scroll-y :style="{ height: scrollViewHeight + 'px' }">
				<view @tap="toself" class="item self" v-if="userServerInfo.type === 1">
					<image src="https://api.jiuweiyun.cn/public/uploads/icon/self.png" mode="scaleToFill"></image>
				</view>
				<view @tap="tosold" class="item sold" v-if="userServerInfo.type === 2 || userServerInfo.type === 3">
					<image src="https://api.jiuweiyun.cn/public/uploads/icon/sold.png" mode="scaleToFill"></image>
				</view>
				<view @tap="tojionnum" class="item num" v-if="userServerInfo.type === 2 || userServerInfo.type === 3">
					<image src="https://api.jiuweiyun.cn/public/uploads/icon/num.png" mode="scaleToFill"></image>
				</view>
				<view v-if="userServerInfo.end_time && userServerInfo.end_time < now" @tap="toChengJiDan" class="item num">
					<image src="https://api.jiuweiyun.cn/public/uploads/icon/cjd.png" mode="scaleToFill"></image>
				</view>
			</scroll-view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				pageTitle: '数据统计',
				scrollViewHeight: 0,
				now: Date.now()
			};
		},
		computed: {
			userServerInfo () {
				return this.$store.state.userServerInfo
			}
		},
		methods: {
			toChengJiDan() {
				uni.navigateTo({
					url: '../schoolReport/index'
				})
			},
			toself () {  //去个人数据页面
				uni.navigateTo({  //已登录跳转到用户中心
					url: `../self/self?id=${this.userServerInfo.id}&from=index`
				})
			},
			tosold () {  //去销售统计页面
				uni.navigateTo({
					url: '../sold/sold'
				})
			},
			tojionnum () {  //去参赛人数页面
				uni.navigateTo({
					url: '../joinnum/joinnum'
				})
			}
		},
		created() {
			this.$scrollViewHeight('.content')  //设置页面内 scroll view 的高度
		}
	}
</script>

<style lang="scss" scoped>
	.statistics {
		@include page();
		// border-top:none;
		.content {
			// border-top: $custom-nav-borderbot-height solid $custom-nav-borderbot-color;
			.item {
				width: 656rpx;
				height: 301rpx;
				box-shadow: 0rpx 0rpx 13rpx 0rpx rgba(127,127,127,0.2);
				border-radius: 20rpx;
				overflow: hidden;
				margin: 20rpx auto 0;
				position: relative;
				image {
					width: 100%;
					height: 100%;
				}
				&.self {
					margin-top: 28rpx;
				}
			}
		}
	}
</style>