<!-- 找回密码 -->
<template>
	<view class="confirmpassword">
		<view class="goback" @tap="navBack"
			><image src="../../static/images/backicon.png" class="backicon"></image
		></view>
		<view class="title">找回密码</view>
		<view class="input-item cellphone">
			<input type="password" v-model="password" placeholder="请输入新密码" />
		</view>
		<view class="input-item imgcode">
			<input type="password" v-model="rePassword" class="inputcode" placeholder="请再次输入新密码" />
		</view>
		<view class="btn-warp">
			<view class="btn" @tap="next">确认</view>
		</view>
	</view>
</template>

<script>
export default {
	name: 'confirmpassword',
	components: {},
	data() {
		//这里存放数据
		return {
			password:'',
			rePassword:''
		};
	},
	//监控data中的数据变化
	watch: {},
	onLoad() {},
	//方法集合
	methods: {
		// 返回上一页
		navBack() {
			this.$mRouter.push({route: '/pages/public/resetpassword'})
		},
		// 确认进入下一步
		async next() {
			if(this.password){
				if(this.rePassword){
					if(this.password == this.rePassword){
						await this.$http.post('/WxApplet/findPwd/finPwdSubmit', {
							newPwd:this.rePassword,
							uuid:uni.getStorageSync('uuid')
						}).then(async res => {
						if(res.code == 200){
							uni.showToast({
								title: res.data,
								icon: 'none'
							});
							this.$mRouter.push({ route: '/pages/public/login' });
						}else{
							uni.showToast({
								title: res.msg,
								icon: 'none'
							});
						}							
						});
					}else{
						uni.showToast({
							title: '两次密码不一致',
							icon: 'none'
						});
					}			
				}else{
					uni.showToast({
						title: '请再次输入新密码',
						icon: 'none'
					});
				}
			}else{
				uni.showToast({
					title: '请输入新密码',
					icon: 'none'
				});
			}
			
		}
	}
};
</script>
<style lang="scss" scoped>
.confirmpassword {
	padding: 0 50upx;
	.goback {
		padding-top: 100upx;
		.backicon {
			width: 24upx;
			height: 43upx;
		}
	}
	.title {
		font-size: 48upx;
		color: $titleColor;
		background: url('../../static/images/passworddown.png') no-repeat left 82%;
		background-size: 192upx 14upx;
		margin-top: 65upx;
	}
	.input-item {
		height: 95upx;
		border-bottom: 1px solid #e7e7e7;
		margin-top: 50upx;
		position: relative;
		input {
			width: 100%;
			height: 100%;
			font-size: 32upx;
		}
		.inputcode {
			width: 65%;
		}
		.gifimg {
			position: absolute;
			right: 0;
			top: -17upx;
			width: 200upx;
			height: 80upx;
		}
		.getcode {
			position: absolute;
			right: 0;
			top: 0;
			width: 180upx;
			height: 95upx;
			font-size: 35upx;
			color: #999999;
			text-align: center;
			line-height: 95upx;
		}
	}
	.cellphone {
		margin-top: 100upx;
	}
	.btn-warp {
		display: flex;
		justify-content: center;
		align-items: center;
		margin-top: 170upx;
		.btn {
			width: 586upx;
			height: 98upx;
			border-radius: 35upx;
			background-color: $barColor;
			display: flex;
			justify-content: center;
			align-items: center;
			font-size: 36upx;
			font-weight: 700;
			color: $titleColor;
			letter-spacing: 5upx;
		}
	}
}
</style>
