<template>
<view class="gamecont2">
	<view class="flex cont2_head">
		<view class="head_item item">
			period
		</view>
		<view class="head_item item">
			Price
		</view>
		<view class="head_item item">
			number
		</view>
		<view class="head_item item">
			Result
		</view>
	</view>
	
	<view class="cont2_body">
		<view class="bodycon flex" v-for="(item,index) in gameRecordCont">		
		<view class="body_item item">
			{{item.period}}
		</view>
		<view class="body_item item">
			{{item.price}}
		</view>
		<view class="body_item item">
			{{item.lotteryResult}}
		</view>
		<view class="body_item item">
			<image :src="'/static/color/bg_er@3x'+item+'.png'" mode="" v-for="(item,index) in gameRecordCont[index].lotteryColor" :key="index"></image>
		</view>
		</view>


	</view>
	<cont class="test"></cont>
	<view class="morejia">
		<p class="">More</p>
		<image src="../../static/color/loading_icon_ins@3x(20).png" mode=""></image>
	</view>
</view>
</template>

<script>
	import cont from "../cont/cont.vue"
	const COMPONENT_NAME = 'gamecont2'
	export default {
		name: COMPONENT_NAME,
	   props:["gameRecordCont"],
		data() {
			return {
		    
			}
		},
		computed: {
		
		},
		mounted() {
		      
		},

		methods: {
		 
	},
	}
</script>


<style>
	.flex2{
		display: flex;
		justify-content: center;
	}
	.test{
		position: fixed;
		right: 0;
		top: 75%;
	}
	.morejia{
		display: table;
		width: auto;
		margin: 0 auto;
		padding-top: 48rpx;
		padding-bottom: 62rpx;
	}
	.morejia p{
		font-size: 28rpx;
		color: #954DE3;
		    text-align: center;
	}
	.morejia image{
		display: block;
		width: 24rpx;
		height: 24rpx;
		margin: 0 auto;
	}
	
	.head_item{
		font-weight: bold;
		color: #303133;
	}
	.body_item{
		color: #303133;
	}

	.item{
		text-transform: capitalize;
		font-size: 28rpx;
		text-align: center;
		width: 234rpx;
		line-height: 72rpx;
	}
	.body_item image{
		width: 32rpx;
		height: 32rpx;
	}
	.body_item image:last-child{
		padding-left: 8rpx;
	}
	.flex{
		display: flex;
		justify-content: space-around;
		align-items: center;
	}
.gamecont2{
	padding: 0 36rpx;
	
}
</style>
