<template>
	<view>
		<uni-nav-bar id="nav-bar" status-bar="true" @clickLeft="onBack()" :title="title" color="#000000" fixed="true"
			:border="false">
			<view slot="left">
				<view class=" flex align-center margin-left">
					<image class="p-left-arrow" src="../../../static/p-left-arrow.png"></image>
				</view>
			</view>

		</uni-nav-bar>
		<view class="card-view settings-item" v-for="(item,index) in list" :key="index">
			<view class="content position-relative" @tap="onNavTo(item)">
				<text class="text-black text-regular text-16px margin-left-xl">{{item.gameName}}</text>
				<view class="only-arrow"></view>
			</view>
		</view>
	</view>
</template>

<script>
	import reqUtil from "@/util/util-js/requstUtil.js"
	import config from "@/common/config.js"
	import {
		mapState,
		mapMutations
	} from 'vuex';
	export default {
		computed: mapState(['guideUnlockState']),
		data() {
			return {
				list: [{
						gameName: '新手指导',
						navType: 'personalGuide'
					}, {
						gameName: '蓝牙连接指导',
						navType: 'bluetoothConnect'
					},
					// {
					// 	gameName: '游戏手柄校准指导',
					// 	navType: 'feedback'
					// },
					{
						gameName: '关卡指导',
						navType: 'levelGuide'
					}
				],
				title: "新手指导",
				type: '',
			}
		},
		onLoad(option) {



		},
		methods: {
			...mapMutations(['setGuideUnlockState']),
			onBack() {
				uni.navigateBack({
					delta: 1
				})
			},

			onNavTo(item) {
				// console.log(item);
				let url = '';
				switch (item.navType) {
					case 'personalGuide':
						//跳回首页时候，重置新手教程
						let guideUnlockState = Object.assign(this.guideUnlockState, {
							//是否首次安装
							firstInstallation: true,
							// firstDisconnectBluetooth: true,
							firstUnlockJumpUp: true,
							firstUnlockLeftAndRightJump: true,
							firstUnlockLeftAndRightRotationJump: true,
							firstPromptSelectLevel:true
						});
						this.setGuideUnlockState(guideUnlockState);
						
						uni.switchTab({
							url: '../../personal-page/personal/personal',
							success: res => {},
							fail: () => {},
							complete: () => {}
						});
						return;
					case 'bluetoothConnect':
						url = './guide-ble-scroll';
						break;
					case 'levelGuide':
						url = './guide-level-scroll';
						break;
				}
				uni.navigateTo({
					url: url,
					success: res => {},
					fail: () => {},
					complete: () => {}
				});

			}
		}
	}
</script>

<style>
	.content {
		display: flex;
		flex-direction: row;
		align-items: center;
		height: 50px;
	}

	.settings-item {
		position: relative;
		background-color: #FFFFFF;
		border-radius: 10px;
	}
</style>
