<template>
	<view class="container" style="padding-top: 20rpx;">
		<view class="flex-center-center mt-50">
			<view class="wh-226" style="position: relative;">

				<image class="wh-226 br-113" src="../../static/logo.png"></image>
				<image class="wh-62 br-31" src="../../static/logo.png"
					style="position: absolute;bottom: 0px;right: 0px;"></image>

			</view>

		</view>
		<view class="flex ml-24 mt-80" style="align-items: center;">
			<image class="wh-54" src="../../static/logo.png"></image>
			<text style="color: white;font-size: 42rpx;margin-left: 10rpx;">基本资料</text>
		</view>
		<view class="mt-36 br-20 mlr-24" style=";background: rgba(255,255,255,0.04);">
			<u-cell-group :border="false">
				<u-cell @click="$wskj.to('/pages/yht/user_edit_name')" :titleStyle="{color:'#fff'}"
					:rightIconStyle="{color:'#878787'}" :border="false" size="large" title="昵称：" :value="user_name"
					isLink></u-cell>
				<u-cell @click="birthdaySow=true" :titleStyle="{color:'#fff'}" :rightIconStyle="{color:'#878787'}"
					:border="false" size="large" title="出生日期：" :value="user_birthday" isLink></u-cell>
				<u-cell :titleStyle="{color:'#fff'}" :rightIconStyle="{color:'#878787'}" :border="false" size="large"
					title="年龄：" :value="user_age"></u-cell>
				<u-cell @click="ageShow=true" :titleStyle="{color:'#fff'}" :rightIconStyle="{color:'#878787'}"
					:border="false" size="large" title="性别：" :value="user_sex" isLink></u-cell>
			</u-cell-group>
		</view>
		<!-- 生日选择 -->
		<u-datetime-picker :show="birthdaySow" v-model="value" mode="date" @confirm="onBirthday"
			@cancel="birthdaySow=false" @close="birthdaySow=false" :minDate="-1000000000000"
			:maxDate="currentTimestamp"></u-datetime-picker>
		<!-- 性别选择 -->
		<u-picker :show="ageShow" :columns="ageList" @confirm="onSex" @cancel="ageShow=false"
			@close="ageShow=false"></u-picker>

	</view>


	<!--头像上传弹出层-->
	<!-- <u-action-sheet @select="onHeadSelect" @close="closeHead" :actions="pupList" :show="uploadHeadPortrait"
		cancelText="取消"></u-action-sheet> -->
</template>

<script>
	export default {
		data() {
			return {
				currentTimestamp: 0,
				birthdaySow: false,
				value: Number(new Date()),
				user_name: '',
				user_birthday: '',
				user_age: '',
				user_sex: '',
				ageList: [
					['男', '女', '未知']
				],
				ageShow: false,
				pupList: [{
						name: "拍照",
						index: 0
					},
					{
						name: "从我的相册选择",
						index: 1
					}
				],
			};
		},
		onLoad() {
			this.getTimestamp()
		},
		onShow() {
			
		},
		methods: {
			getTimestamp() {
				const currentDate = new Date(); // 创建一个表示当前时间的Date对象
				this.currentTimestamp = currentDate.getTime(); // 获取当前时间的时间戳并赋值给变量
				console.log(currentDate.getTime())
			},
			onSex(e) {
				//console.log(e.value[0])
				this.user_sex = e.value[0]
				this.ageShow = false;
			},
			onBirthday(e) {
				this.birthdaySow = false;
				this.user_birthday = this.$wskj.timeFormat(e.value, 'yyyy-mm-dd')
				this.$emit('onBirthday', this.user_birthday)
				const age = getAgeFromDateString(this.user_birthday);
				console.log(age)
				this.user_age = age;
			},

		}
	};

	function getAgeFromDateString(dateString) {
		const today = new Date(); // 当前日期
		const birthDate = new Date(dateString); // 出生日期
		let age = today.getFullYear() - birthDate.getFullYear(); // 计算年龄
		// 如果今天的日期还没到出生年份的下一个 birthDate.getMonth() + 1 月份和 birthDate.getDate() 日期，则年龄减一
		if (today.getMonth() < birthDate.getMonth() || (today.getMonth() === birthDate.getMonth() && today.getDate() <
				birthDate.getDate())) {
			age--;
		}
		return age;
	};
</script>

<style>
	.container {
		width: 100%;
		height: 100%;
		background: #0F0F0F;
	}

	/deep/.u-cell--clickable {
		background-color: #191919;
	}
</style>