<template>
	<view class="ljs-turntable" v-if="show">
		<!-- <view class="close" @click="close">
			<image class="ico" :src="require('./images/ico_close.png')"></image>
		</view> -->
		<view class="box">
		</view>
		<view class="box2">
		</view>
		<view class="but" @click="go">
			<image class="pic" src="../../static/user/prizebtn.png">
			</image>
		</view>
		<view class="rotateBoard" id="rotateBoard" ref="rotateBoard"
			:style="transform !== null?'transform:'+ transform:''">
			<view v-for="(item, i) in truntableData" :key="i" class="sector"
				:style="{'transform': `rotate(${item.start}deg) skewY(${item.scale}deg)`, 'background': color[i]}">
			</view>
			<view class="name" v-for="(item, i) in truntableData" :key="`t${i}`"
				:style="{'transform': `rotate(${item.scaleText}deg)`, 'left': (310 + item.sin) + 'rpx', 'top': (160 - item.cos) +'rpx'}">
				{{item.name}}
			</view>
		</view>

	</view>
</template>

<script>
	import index from './index.js'
	export default index
</script>

<style lang="scss" scoped>
	@import "./style.scss"
</style>