<template>
	<view class="pages">
		<uni-forms class="form" :value="dataObj" ref="formData" :rules="rules"  :border="true"
			label-width="100">
			<uni-forms-item label="新邮箱" name="email" :required="true" label-width="100">
				<input :value="dataObj.email" type="password" @input="binddata('email',$event.detail.value)"
					class="uni-input" placeholder="请输入新邮箱" />
			</uni-forms-item>
		</uni-forms>
		<button class="but" type="default" :loading="loading" :disabled="loading" @tap="changePass">确认</button>
	</view>
</template>

<script>
	import {
		updateEmail,
	} from '@/common/api.js'
	export default {
		data() {
			return {
				dataObj: {
					email: ""
				}, 
				loading: false,
				rules: {
					email: {
						rules: [{
								required: true,
								errorMessage: '请输入新邮箱',
							},
							{
								validateFunction: function(rule, value, data, callback) {
									var reg = new RegExp("^[a-z0-9]+([._\\-]*[a-z0-9])*@([a-z0-9]+[-a-z0-9]*[a-z0-9]+.){1,63}[a-z0-9]+$"); //正则表达式
									if (!reg.test(data.email)) {
										callback('请输入正确的邮箱')
									}
									return true
								}
							}
						]
					},
				}
			}
		},
		onReady() {
		        this.$refs.formData.setRules(this.rules)
		    },
		methods: {
			binddata(v, e) {
				this.dataObj[v] = e
			},
			changePass() {
				this.$refs.formData.submit().then(res => {
					this.loading = true
					updateEmail({
						email:this.dataObj.email,
						userId:this.$store.state.Token
					}).then(res =>{
						console.log(res)
						this.loading = false
						uni.$emit("changeUser",true)
						plus.nativeUI.toast('修改成功')
						setTimeout(() =>{
							
							uni.navigateBack({
								
							})
						},1000)
						
					}).catch(e =>{
						this.loading = false
					})
				}).catch(err => {
					console.log('表单错误信息：', err);
				})
			}
		}
	}
</script>

<style scoped lang="scss">
	.form {
		border-bottom: 1px solid #EEEEEE;
	}

	.but {
		width: 600rpx;
		margin-top: 420rpx;
		background-color: #0099FF;
		color: #fff;
	}
</style>