<template>
	<view>
		<view class="listBody">
			<view class="list">
				<view class="list_left">
					我的账号
				</view>
				<view class="list_right">
					{{userInfo.account}}
				</view>
			</view>
			<view class="list" @click="password">
				<view class="list_left">
					修改密码
				</view>
				<view class="list_right">
					<image src="../../static/img/right.svg" mode=""></image>
				</view>
			</view>
		</view>
		<view class="listBody">
			<view class="list" @click="agreement">
				<view class="list_left">
					服务及隐私协议
				</view>
				<view class="list_right">
					<image src="../../static/img/right.svg" mode=""></image>
				</view>
			</view>
		</view>
		<view class="btn" @click="logout">
			退出登录
		</view>
	</view>
</template>

<script>
	import {
		mapGetters
	} from 'vuex'
	export default {
		data() {
			return {

			}
		},
		onLoad() {},
		methods: {
			logout() {
				this.$store.dispatch('LogOut').then(() => {
					uni.reLaunch({
						url: '/pages/login/login'
					})
					this.$store.dispatch('clearAuthState')
					this.$store.dispatch('endRefreshNewsTimer')
				})
			},
			password(){
				uni.navigateTo({
					url: '/pageMy/my/changePassword'
				})
			},
			agreement() {
				uni.navigateTo({
					url: '/pages/user/agreement'
				})
			}
		},
		computed: {
			...mapGetters(['userInfo'])
		}
	}
</script>

<style>
	.btn {
		background-color: #fefefe;
		margin-top: 20rpx;
		padding: 20rpx 0;
		text-align: center;
		font-family: PingFangSC-Regular;
		font-size: 32rpx;
		color: #F46161;
	}

	.list_right image {
		width: 40rpx;
		height: 40rpx;
	}

	.list_right {
		font-family: PingFangSC-Regular;
		font-size: 28rpx;
		color: #999999;
	}

	.list_left {
		font-family: PingFangSC-Regular;
		font-size: 32rpx;
		color: #333333;
	}

	.list {
		padding: 20rpx;
		padding-left: 0;
		display: flex;
		align-items: center;
		justify-content: space-between;
		border-bottom: 1rpx solid #ddd;
	}

	.listBody {
		background-color: #fefefe;
		margin-top: 20rpx;
		padding-left: 20rpx;
	}

	page {
		background-color: #f6f6f6;
	}
</style>
