<template>
	<view id="warp">
		<view class="t_login_passList">
			<view class="input_icon">原密码</view>
			<input
				class="input_css"
				v-model="formData.oldPassWord"
				border="none"
				:password="true"
				placeholder="请输入原密码"
			></input>
		</view>
		<view class="t_login_passList">
			<view class="input_icon">新密码</view>
			<input
				class="input_css"
				v-model="formData.passWord"
				border="none"
				:password="true"
				placeholder="6-10位且包含字母和数字"
			></input>
		</view>
		<view class="t_login_passList">
			<view class="input_icon">确认密码</view>
			<input
				class="input_css"
				v-model="formData.rePassWord"
				border="none"
				:password="true"
				placeholder="请再次输入新密码"
			></input>
		</view>
		<view class="btn_css">
			<button class="btn" @tap="registerOk">保存</button>
		</view>
	</view>
</template>

<script>
	const {urlList,https} = require('@/static/api');
	export default {
		data() {
			return {
				formData:{
					oldPassWord:'',
					passWord:'',
					rePassWord:''
				},
			};
		},
		methods:{
			registerOk(){
				const that = this;
				if(that.formData.oldPassWord == ''){
					uni.showToast({
						title:'请输入原密码',
						icon:'none',
						duration:1500
					})
					return;
				}
				if(!/^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{6,10}$/.test(that.formData.passWord)){
					uni.showToast({
						title:'密码格式为6-10位字母和数字组合',
						icon:'none',
						duration:1500
					})
					return;
				};
				if(that.formData.passWord !== that.formData.rePassWord){
					uni.showToast({
						title:'俩次输入的密码不一样',
						icon:'none',
						duration:1500
					})
					return;
				}
				https(urlList.changePassWord,'PUT',that.formData,'修改中...').then(data => {
					uni.showToast({
						title: data.message || '修改成功',
						icon: 'none',
						duration: 1000
					})
					let loginInfo = uni.getStorageSync('loginInfo');
					loginInfo.passWord = that.formData.rePassWord
					uni.setStorageSync('loginInfo', loginInfo)
					setTimeout(e => {
						uni.navigateBack()
					},1000)
				}).catch(err => {
					uni.showToast({
						title:err,
						icon:'none',
						duration:1500
					})
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
#warp{
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	.t_login_passList{
		width:650rpx;
		padding: 20rpx 0rpx;
		border-bottom: 1rpx solid #e6e6e6;
		display: flex;
		flex-direction: row;
		align-items: center;
		.input_icon{
			width: 200rpx;
			display: flex;
			align-items: center;
			padding-left: 10rpx;
		}
		.input_css{
			height: 70rpx;
			width:400rpx;
		}
	}
	.btn_css{
		width: 650rpx;
		position: fixed;
		bottom: 10rpx;
		display: block;
		.btn{
			background-color:#1B64F8FF;
			color: white;
		}
	}
}
</style>
