<template>
	<page title="设置" ref="pageRef">
		<view class="color-1 marginL15 marginT20">通知</view>
		<view class="cu-list menu sm-border card-menu margin-top">
			<view class="cu-item">
				<view class="content">
					<text class="text-grey">开箱动画</text>
				</view>
				<view class="action">
					<switch class="purple" :checked="animalChecked" @change="changeAnimalChecked"></switch>
				</view>
			</view>
			<view class="cu-item">
				<view class="content">
					<text class="text-grey">开箱震动</text>
				</view>
				<view class="action">
					<switch class="purple" :checked="checked" @change="changeVibratorChecked"></switch>
				</view>
			</view>
		</view>
		<view class="color-1 marginL15 marginT20">关于</view>
		<view class="cu-list menu sm-border card-menu margin-top">
			<view class="cu-item arrow" @click="show('user')">
				<view class="content">
					<text class="text-grey">用户协议</text>
				</view>
			</view>
			<view class="cu-item arrow" @click="show('privacy')">
				<view class="content">
					<text class="text-grey">隐私协议</text>
				</view>
			</view>
		</view>

		<view v-if="isLogin" class="paddingX20 paddingY30">
			<cm-button :height="44" @click="logout">退出登录</cm-button>
			<view style="width: 425rpx;margin:20rpx auto;"><u-button :plain="true" shape="circle" text="注销账号" @click="logoff"></u-button></view>
			
		</view>
	</page>
</template>

<script>
	import {
		H5
	} from '@/utils/config'
	import store from '@/store'
	import {
		SET_CLOSE_VIBRATOR,
		SET_CLOSE_ANIMAL,
		LOGIN_OUT,
		SET_HIDE
	} from '@/store/mutation-types'
	import cmButton from '../../components/cm-button.vue'

	export default {
		components: {
			cmButton
		},
		data() {
			return {
				checked: !this.$store.getters.closeVibrator,
				animalChecked: !this.$store.getters.closeAnimal
			}
		},
		computed: {
			isLogin() {
				return !!store.getters.token
			}
		},
		methods: {
			changeVibratorChecked(e) {
				const checked = e.detail.value
				store.commit(SET_CLOSE_VIBRATOR, !checked)
			},
			changeAnimalChecked(e) {
				const checked = e.detail.value
				store.commit(SET_CLOSE_ANIMAL, !checked)
			},
			show(key) {
				this.$router.web(H5[key].url, H5[key].title)
			},
			logout() {
				this.$message.confirm('确定要退出登录吗?', () => {
					store.commit(LOGIN_OUT)
					store.commit(SET_HIDE, 1)
					this.$router.back()
				})
			},
			logoff() {
				this.$message.confirm('确定要注销当前账号吗?', async () => {
					const res = await this.$service.user.logoff()
					if (res) {
						store.commit(LOGIN_OUT)
						store.commit(SET_HIDE, 1)
						this.$router.back()
					}
				})
			}
		}
	}
</script>