<template>
	<view class="main">
		<view class="wrap">
			<swiper class="swiper" :indicator-dots="indicatorDots" :autoplay="autoplay" :interval="interval">
				<swiper-item>
					<view class="swiper-item">
						<image src="../../static/tongyonh/Illustration.png" class="img1" mode="aspectFit"></image>
						<view class="text_con">
							<view class="text1">
								{{i18n.Decentralised}}
							</view>
							<view class="text2">
								{{i18n.Localstorage}}
							</view>
						</view>

					</view>
				</swiper-item>
				<swiper-item>
					<view class="swiper-item">
						<image src="../../static/tongyonh/Frame.png" class="img1" mode="aspectFit"></image>
						<view class="text_con">
							<view class="text1">
								{{i18n.EasyDecentralised}}
							</view> 
							<view class="text2">
								{{i18n.EasyLocalstorage}}
							</view>
						</view>

					</view>
				</swiper-item>
				<swiper-item>
					<view class="swiper-item">
						<image src="../../static/tongyonh/Nftimg.png" class="img1" mode="aspectFit"></image>
						<view class="text_con">
							<view class="text1">
								{{i18n.NftDecentralised}}
							</view>
							<view class="text2">
								{{i18n.NftLocalstorage}}
							</view>
						</view>
				
					</view>
				</swiper-item>
			</swiper>
		</view>


		<view class="reg_con">
			<view class="reg">
				<view class="border">
					<view class="item flex" @click="createWallet">


						<view class="left flex">
							<image src="../../static/tongyonh/create_wallet.png" mode="aspectFit" class="letimg">
							</image>
							<view class="textcon">
								<view class="text1">
									{{i18n.crewalllet}}
								</view>
								<view class="text2">
									{{i18n.Oneidentity}}
								</view>
							</view>
						</view>
						<image src="../../static/tongyonh/chevron_right_24px.png" class="rigimg" mode="aspectFit">
						</image>
					</view>

				</view>

				<view class="item flex" @click="loginWallet">
					<view class="left flex">
						<image src="../../static/tongyonh/login_wallet.png" mode="aspectFit" class="letimg"></image>
						<view class="textcon">
							<view class="text1">
								{{i18n.Logintowallet}}
							</view>
							<view class="text2">
								{{i18n.Restoreexisting}}
							</view>
						</view>
					</view>
					<image src="../../static/tongyonh/chevron_right_24px.png" class="rigimg" mode="aspectFit"></image>
				</view>




			</view>

			<view class="lans" @click="show = true">
				{{i18n.lans}}
			</view>
			<view class="select">
				<u-checkbox-group @change="checkboxGroupChange">
					<u-checkbox @change="checkboxChange" v-for="(item, index) in list2" :key="index"
						v-model="item.checked" :name="item.name" active-color="#5B53FF"> <text
							class="name">{{i18n.AgreementConfirmation}}
							<text class="active" @click.stop="Terms">{{i18n.TermsofService}}</text>
						</text> </u-checkbox>
				</u-checkbox-group>
			</view>

		</view>

		<u-select :confirm-text="cnt" :cancel-text="can" v-model="show" :list="list3" @confirm="confirm"></u-select>



	</view>
</template>

<script>
	import utils from '@/utils'
	import md5 from 'js-md5'
	import store from '@/store'
	import token from '@/utils/TokenUtil'
	import cont from "@/components/navigation/navigation.vue"

	export default {
		data() {
			return {
				language: this.$store.state.language == 'en' ? 'English' : '简体中文',
				cnt: this.$t('index').Confirm,
				can: this.$t('index').Cancel,
				show: false,
				list3: [{
						label: this.$t('index').langfan,
						disabled: false,
						value: "b",
					},
					{
						label: this.$t('index').langjian,
						disabled: false,
						value: "a",
					},
					{
						label: this.$t('index').eng,
						disabled: false,
						value: "c",
					},

				],
				list2: [{
					name: '',
					checked: false,
					disabled: false,
				}, ],
				list: ['', '../../../static/tongyonh/phone_image.png'],
				indicatorDots: true,
				autoplay: true,
				interval: 3000,
				inde: 1,
				walletInfo: {},
			}
		},
		computed: {
			i18n() {
				return this.$t('index')
			},
		},
		onLoad() {},
		onShow() {
			console.log(uni.getStorageSync('walletInfo'))
			if (uni.getStorageSync('walletInfo')) {
				uni.reLaunch({
					url: '/pages/menu/wallet/index'
				})
			}
			// uni.clearStorageSync();
			this.list2.checked = false;
		},
		methods: {

			
			confirm(e){
				 uni.setStorageSync('lang',e[0].value)	
			
				 if (e[0].value == 'c') {
				 	this._i18n.locale = 'en'
				 	this.$store.commit('setLanguage', 'en')
				 	uni.setStorageSync('langTrue', 'English')
				 	uni.setStorageSync("language", 'en')
					uni.redirectTo({
						url:'/pages/register/index'
					})
				 } else if (e[0].value == 'a') {
				 	this._i18n.locale = 'zh-CN'
				 	this.$store.commit('setLanguage', 'zh-CN')
				 	uni.setStorageSync("language", 'zh-CN')
				 	uni.setStorageSync('langTrue', '简体中文')
					uni.redirectTo({
						url:'/pages/register/index'
					})
				 } else if (e[0].value == 'b'){
				 	this._i18n.locale = 'zh-CNF'
				 	this.$store.commit('setLanguage', 'zh-CNF')
				 	uni.setStorageSync("language", 'zh-CNF')
				 	uni.setStorageSync('langTrue', '繁體中文')
					uni.redirectTo({
						url:'/pages/register/index'
					})
				 }
			},
			checkboxGroupChange() {

			},
			checkboxChange() {
				if (this.inde % 2 == 0) {
					this.list2[0].checked = false;
				} else {
					this.list2[0].checked = true;
				}
				this.inde++
			},
			createWallet() {
				if (this.list2[0].checked != true) {
					uni.showToast({
						title: 'Please check the terms of service',
						icon: 'none',
						duration: 1500
					})
					return;
				}

				// 读到钱包助记词信息,存入缓存
				var word2 = this.$Token.generateMnemonic();
				uni.setStorage({
					key: 'word',
					data: word2,
					success: function() {
						console.log('success', word2)
					}
				});
				console.log(this.list2.checked, 224)
				this.list2[0].checked = false;
				console.log(this.list2.checked, 444)
				uni.navigateTo({
					url: '../menu/backUp/index',
				})
			},

			loginWallet() {
				if (this.list2[0].checked != true) {
					uni.showToast({
						title: 'Please check the terms of service',
						icon: 'none',
						duration: 1500
					})
					return;
				}

				this.list2[0].checked = false;
				uni.navigateTo({
					url: '../menu/backUp/backUp4/index',
				})
			},
			Terms() {
				uni.navigateTo({
					url: '../menu/about/terms/index',
				})
			}
		},
	}
</script>

<style>
	@import './index.css';
</style>
