<template>
	<view class="page-container">
		<view class="password-container">
			<view class="card">
				<view class="card-content">
					<view v-if="!resetToken" class="input-item">
						<text class="title">原密码</text>
						<input v-model="oldPassword" placeholder="填写原密码" type="text" password />
					</view>
					<view class="input-item">
						<text class="title">新密码</text>
						<input v-model="newPassword" type="text" placeholder="填写新密码" password />
					</view>
					<view class="input-item">
						<text class="title">确认密码</text>
						<input v-model="confirmPassword" type="text" placeholder="填写新密码" password />
					</view>
					<view class="input-msg">
						密码必须是8-16位的英文字母、数字、字符组合（不能是纯数字）
					</view>
					<view class="input-goto" >
							<navigator url="/pages/user/find-password">忘记原密码？</navigator>
					</view>
				</view>
			</view>
		</view>
		<u-button shape="circle" :disabled="loading" :loading="loading" text="立即提交" color="linear-gradient(90deg, #DA2538 0%, #F75F68 100%)"
			class="password-submit-button" @click="submit"></u-button>
	</view>
</template>

<script>
	import {
		user
	} from '@/utils/api'

	export default {
		data() {
			return {
				oldPassword: '',
				newPassword: '',
				confirmPassword: '',
				resetToken: '',
				loading: false
			}
		},
		async onLoad(option) {
			if (option.token) {
				this.resetToken = option.token
			} else {
				await this.$onLaunched
				const token = getApp().globalData.userToken
				if (!token) {
					uni.redirectTo({
						url: '/pages/user/login'
					})
				}
			}
		},
		methods: {
			async submit() {
				const password = /^.{6,16}$/
				if (!this.resetToken && !this.oldPassword) {
					uni.showToast({
						icon: 'none',
						title: '请输入原密码~!',
						duration: 3000
					})
					return
				}
				if (!password.test(this.newPassword)) {
					uni.showToast({
						icon: 'none',
						title: '新密码必须是6-16位~!',
						duration: 3000
					})
					return
				}
				if (this.confirmPassword !== this.newPassword) {
					uni.showToast({
						icon: 'none',
						title: '两次密码不一致~!',
						duration: 3000
					})
					return
				}
				this.loading = true
				await user.password(this.oldPassword, this.newPassword, this.resetToken).then(res => {
					uni.showToast({
						icon: 'none',
						title: res.msg,
						duration: 3000
					})
					if (res.code === 1) {
						uni.removeStorageSync('phoneNumber');
						uni.removeStorageSync('emailNumber');
						setTimeout(() => {
							uni.removeStorage({
								key: 'user_token',
								success: () => {
									getApp().globalData.share.code = ''
									getApp().globalData.userToken = ''

									uni.switchTab({
										url: '/pages/user/index'
									})
								}
							})
						}, 1500)
					}
				}).catch(e => {})
				this.loading = false
			}
		}
	}
</script>

<style lang="scss">
	.page-container {
		padding: 15px 0 0;
		background-color: $uni-bg-color;
		.password-container {
			background-color: #fff;
			.card {
				.card-content {
					.input-item {
						height: 44px;
						margin-bottom: 15px;
						padding: 0 17px;
						font-weight: 400;
						color: #1a1a2a;
						border-bottom: 1px solid #f5f5f5;
						font-size: 15px;
						display: flex;
						&:last-child {
							margin: 0;
						}

						.title {
							width: 120px !important;
							font-size: 14px;
							line-height: 45px;
						}

						uni-input {
							flex: 1 1 0%;
							height: 44px;
						}

					}

					.input-msg {
						font-size: 12px;
						color: rgba(0, 0, 0, 0.5);
					}
					.input-goto{
						padding:10px 0 ;
						font-size: 12px;
						font-family: PingFangSC-Regular, PingFang SC;
						font-weight: 400;
						color: #0091FF;
					}
				}
			}
		}

		.password-submit-button {
			width: auto;
			margin: 20px 15px 0;
			height: 44px;
			line-height: 44px;
		}
	}
</style>