<template>
	<view style="background-color: $color-white !important;">
		<u-navbar :back-text="i18n('Back')" :back-text-style="backStyle" back-icon-color="#fff" title-color="#fff"
			:background="background" title-width="300" :title="i18n('BasicInformation')"></u-navbar>
		<!-- 单元格列表 -->
		<u-cell-group>
			<!-- 头像 -->
			<!-- <u-cell-item :title="$i18n.locale=='zh'?'头像':'Avatar'" :index="0" @click="Avatar" hover-class="none"> -->
			<!-- 上传 -->
			<!-- <u-upload :custom-btn="true">
					<view slot="addBtn" class="slot-btn" hover-class="slot-btn__hover" hover-stay-time="150">
						<u-icon size="60" :color="$u.color['lightColor']"></u-icon>
					</view>
				</u-upload>
			</u-cell-item> -->
			<!-- 手机号 -->
			<u-cell-item :title="$i18n.locale=='zh'?'手机':'Phone'" :value="form.userPreferredMobile" :arrow="false"
				hover-class="none"></u-cell-item>
			<!-- 邮箱 -->
			<u-cell-item :title="$i18n.locale=='zh'?'邮箱':'Email'" :value="form.userEmail" :arrow="false"
				hover-class="none"></u-cell-item>
			<!-- 注册日期 -->
			<u-cell-item :title="$i18n.locale=='zh'?'注册日期':'Registration'" :value="form.userAccountRegistertime"
				:arrow="false" hover-class="none"></u-cell-item>
			<!-- 用户类型 -->
			<u-cell-item :title="$i18n.locale=='zh'?'用户类型':'Type'" :value="region" :arrow="false" hover-class="none">
			</u-cell-item>
			<!-- 最后登录 -->
			<u-cell-item :title="$i18n.locale=='zh'?'最后登录':'Log Last'" :value="form.lastLoginTime" :arrow="false"
				hover-class="none"></u-cell-item>
			<!-- 昵称 -->
			<!-- <u-cell-item  :title="$i18n.locale=='zh'?'昵称':'Nickname'" value="开心每一天" :arrow="false"></u-cell-item> -->
			<!-- 性别 -->
			<!-- <u-cell-item :title="$i18n.locale=='zh'?'性别':'Gender'"></u-cell-item> -->
			<!-- 生日 -->
			<!-- <u-cell-item :title="$i18n.locale=='zh'?'生日':'Birthday'"></u-cell-item> -->
			<!-- 所在地区 -->
			<!-- <u-cell-item :title="$i18n.locale=='zh'?'所在地区':'Address'" :required="true"></u-cell-item> -->
			<!-- 标签 -->
			<!-- <u-cell-item :title="$i18n.locale=='zh'?'标签':'Label'"></u-cell-item> -->
			<!-- 兴趣方向 -->
			<!-- <u-cell-item :title="$i18n.locale=='zh'?'兴趣方向':'InterestDirection'"></u-cell-item> -->
			<!-- 邮箱 -->
			<!-- <u-cell-item :title="$i18n.locale=='zh'?'邮箱':'Email'" value="" :arrow="false"></u-cell-item> -->
			<!-- 介绍 -->
			<!-- <u-cell-item :title="$i18n.locale=='zh'?'介绍':'Introduce'"></u-cell-item> -->
		</u-cell-group>
		<!-- <view  class="SocialInfor">社交信息</view> -->
		<!-- <u-cell-group> -->
		<!-- 微信号 -->
		<!-- <u-cell-item :title="$i18n.locale=='zh'?'微信号':'WeChat'"></u-cell-item> -->
		<!-- QQ号 -->
		<!-- <u-cell-item :title="$i18n.locale=='zh'?'QQ号':'QQ'"></u-cell-item> -->
		<!-- 微博 -->
		<!-- <u-cell-item :title="$i18n.locale=='zh'?'微博':'MicroBlog'"></u-cell-item> -->
		<!-- </u-cell-group> -->
	</view>
</template>

<script>
	import listCell from '@/components/JumpBox';
	import {
		addIntegral,
		addGrowth
	} from '@/components/addPointDetailByTaskDict.js'
	export default {
		components: {
			listCell,
			addIntegral,
			addGrowth
		},
		data() {
			return {
				background: {
					backgroundImage: 'linear-gradient(270deg, #4BC0E2 0%, #538BE7 100%)',
				},
				backStyle: {
					color: '#FFFFFF',
				},
				Storage_data: '',
				AuthToken: '',
				form: {},
				userUsertypeDicts: [],
				region: '',
			};
		},
		onShow() {
			try {
				this.Storage_data = JSON.parse(uni.getStorageSync('user'));
				this.AuthToken = uni.getStorageSync('Auth-Token');
			} catch (e) {

			};
			this.showInfo();
			this.userBasicInfo();
			// addIntegral('point_task_complete_info', '20')
			// addGrowth('point_task_complete_info')
		},
		methods: {
			async showInfo() {
				const result = await this.$myRequest({
					url: '/uc/userCenter/findBasicInfo',
					data: {},
				});
				// this.form = this.Storage_data.umsUser;
				this.form = result.data;

				if (this.form.userEmail) {
					this.form.userEmail = this.AccountHide(this.form.userEmail);
					// this.form.userEmail = this.form.userEmail.substr(0,3) + '****' + this.form.userEmail.substr(-4);
				} else {
					this.form.userEmail = ""
				}
				// this.form.userEmail = this.form.userEmail || "";

				if (this.form.userPreferredMobile) {
					if (this.form.userPreferredMobile.length < 12) {
						this.form.userPreferredMobile = this.form.userPreferredMobile.substr(0, 3) + '****' + this.form
							.userPreferredMobile.substr(-4);
					} else {
						this.form.userPreferredMobile = this.form.userPreferredMobile.substr(4, 3) + '****' + this.form
							.userPreferredMobile.substr(-4);
					}
					// this.form.userPreferredMobile = this.form.userPreferredMobile.substr(4);
				} else {
					this.form.userPreferredMobile = "";
				}
				this.form.userAccountRegistertime = this.formatDate(this.form.userAccountRegistertime,
						"YYYY-MM-DD hh:mm:ss") ||
					"";

				this.form.lastLoginTime = this.formatDate(this.form.lastLoginTime, "YYYY-MM-DD hh:mm:ss") || "";
				console.log(this.form.userAccountRegistertime, this.form.lastLoginTime)
			},
			AccountHide(email) {
				let altIndex = email.indexOf('@');
				let spotIndex = email.lastIndexOf('.');
				let star = '*';
				let starNum1 = 4;
				let starNum2 = 3;
				let emailHide = '';
				let emailHide1 = '';
				let emailHide2 = '';
				if (altIndex > starNum1) {
					emailHide1 = email.slice(0, altIndex - starNum1) + star.repeat(starNum1);
					if (spotIndex - altIndex - 0 > starNum2) {
						emailHide2 = email.slice(altIndex, altIndex + 1) + star.repeat(starNum2) + email.slice(altIndex +
							starNum1);
					} else {
						emailHide2 = email.slice(altIndex, altIndex + 1) + star.repeat(spotIndex - altIndex - 1) + email
							.slice(
								spotIndex);
					}
				} else {
					emailHide1 = email.slice(0, 1) + star.repeat(altIndex - 1);
					if (spotIndex - altIndex - 0 > starNum2) {
						emailHide2 = email.slice(altIndex, altIndex + 1) + star.repeat(starNum2) + email.slice(altIndex +
							starNum1);
					} else {
						emailHide2 = email.slice(altIndex, altIndex + 1) + star.repeat(spotIndex - altIndex - 1) + email
							.slice(
								spotIndex);
					}

				}
				return emailHide = emailHide1 + emailHide2
			},
			async userBasicInfo() {
				if (this.$i18n.locale.toUpperCase() == "EN") {
					const result = await this.$myRequest({
						url: '/sys/sysDicts',
						data: {
							type: 'USERTYPE_DICT_EN'
						}
					});
					if (result.data) {
						this.userUsertypeDicts = result.data['0'] || [];
					}
				} else {
					const result = await this.$myRequest({
						url: '/sys/sysDicts',
						data: {
							type: 'USERTYPE_DICT'
						}
					});
					if (result.data) {
						this.userUsertypeDicts = result.data['0'] || [];
					}
				}
				const that = this;
				this.userUsertypeDicts.forEach((value, index) => {
					let type = this.form.userUsertypeDict;
					if (value.value == type) {
						that.region = value.label;
					}
				});
			},
			Avatar(index) {
				console.log(index)
				console.log(11111)
			},
			navTo(route) {
				this.$mRouter.push({
					route
				});
			},
			i18n(data) {
				return this.$t('common.' + data);
			},
		}
	}
</script>

<style lang="scss" scoped>
	page,
	body.pages-profile-profileSetUp-setUp uni-page-body {
		background-color: #fff !important;
		height: 110vh;

		.SocialInfor {
			background-color: #f8f8f8;
			width: 100%;
			height: 80upx;
			font-size: 28upx;
			line-height: 80upx;
			padding: 0upx 32upx;
		}

		.slot-btn {
			width: 720rpx;
			height: 32rpx;
			display: flex;
			justify-content: center;
			align-items: center;
			background: rgba(0, 0, 0, 0);
			border-radius: 10rpx;
		}

		.slot-btn__hover {
			background-color: rgb(235, 236, 238);
		}
	}
</style>
