<template>
	<view class="accountSecurity-v">
		<u-cell-group style="padding: 0 20rpx;">
			<u-cell-item :title="$t('app.my.accountSecurity.changePassword')"
				@click="handelClick('/pages/my/modifyPsd/index','password')">
			</u-cell-item>
			<u-cell-item :title="$t('app.my.accountSecurity.mobilePhone')" :value="userInfo.mobilePhone"
				@click="handelClick('/pages/my/modifyPsd/index','mobilePhone',userInfo.mobilePhone)">
			</u-cell-item>
			<u-cell-item :title="$t('app.my.accountSecurity.email')" :value="userInfo.email"
				@click="handelClick('/pages/my/modifyPsd/index','email',userInfo.email)">
			</u-cell-item>
			<!-- #ifdef APP-PLUS -->
			<u-cell-item title="注销账号" @click="openPage('/pages/my/cancellation/index')"></u-cell-item>
			<!-- #endif -->
		</u-cell-group>
	</view>
</template>

<script>
	import {
		getUserSettingInfo
	} from "@/api/common.js"
	export default {
		data() {
			return {
				userInfo: {},
				needRefresh: false
			}
		},
		onShow() {
			if (this.needRefresh) {
				this.needRefresh = false;
				this.init();
			}
		},
		onLoad() {
			this.init()
		},
		methods: {
			init() {
				getUserSettingInfo().then(res => {
					this.userInfo = res.data || {}
				})
			},
			openPage(path, type) {
				uni.navigateTo({
					url: path
				})
			},
			handelClick(path, type, vuale) {
				if (!path) return
				this.needRefresh = true
				let config = {
					type,
					vuale
				}
				uni.navigateTo({
					url: path + '?config=' + encodeURIComponent(JSON.stringify(config))
				})
			}
		}
	}
</script>

<style lang="scss">
	page {
		background-color: #f0f2f6;
	}

	:deep(.u-cell) {
		height: 112rpx;
		padding: 20rpx 0;
	}

	.accountSecurity-v {
		background-color: #fff;
		/* #ifdef MP-WEIXIN */
		height: 360rpx;
		/* #endif */
	}
</style>