<template>
|
<div>
|
<a-form :form="form" style="max-width: 500px; margin: 40px auto 0;">
|
<a-form-item label="账号名" :labelCol="{ span: 5 }" :wrapperCol="{ span: 19 }">
|
<a-input type="text" autocomplete="false" :value="accountName" disabled> </a-input>
|
</a-form-item>
|
<a-form-item label="新密码" :labelCol="{ span: 5 }" :wrapperCol="{ span: 19 }" class="stepFormText">
|
<a-input v-decorator="['password', validatorRules.password]" type="password" autocomplete="false"> </a-input>
|
</a-form-item>
|
<a-form-item label="确认密码" :labelCol="{ span: 5 }" :wrapperCol="{ span: 19 }" class="stepFormText">
|
<a-input v-decorator="['confirmPassword', validatorRules.confirmPassword]" type="password" autocomplete="false">
|
</a-input>
|
</a-form-item>
|
<a-form-item :wrapperCol="{ span: 19, offset: 5 }">
|
<a-button style="margin-left: 8px" @click="prevStep">上一步</a-button>
|
<a-button :loading="loading" type="primary" @click="nextStep" style="margin-left:20px">提交</a-button>
|
</a-form-item>
|
</a-form>
|
</div>
|
</template>
|
|
<script>
|
import { putAction, getAction } from '@tievd/cube-block/lib/api/manage'
|
export default {
|
name: 'Step3',
|
// components: {
|
// Result
|
// },
|
props: ['userList'],
|
data() {
|
return {
|
loading: false,
|
form: this.$form.createForm(this),
|
accountName: this.userList.username,
|
validatorRules: {
|
username: { rules: [{ required: true, message: '用户名不能为空!' }] },
|
password: {
|
rules: [
|
{
|
required: true,
|
pattern: /^(?=.*[a-zA-Z])(?=.*\d)(?=.*[~!@#$%^&*()_+`\-={}:";'<>?,.\/]).{8,}$/,
|
message: '密码由8位数字、大小写字母和特殊符号组成!!'
|
},
|
{ validator: this.handlePasswordLevel }
|
]
|
},
|
confirmPassword: {
|
rules: [{ required: true, message: '密码不能为空!' }, { validator: this.handlePasswordCheck }]
|
}
|
}
|
}
|
},
|
methods: {
|
nextStep() {
|
let that = this
|
that.loading = true
|
this.form.validateFields((err, values) => {
|
if (!err) {
|
var params = {}
|
params.username = this.userList.username
|
params.password = values.password
|
params.smscode = this.userList.smscode
|
params.phone = this.userList.phone
|
getAction('/sys/user/passwordChange', params).then(res => {
|
if (res.success) {
|
var userList = {
|
username: this.userList.username
|
}
|
console.log(userList)
|
setTimeout(function() {
|
that.$emit('nextStep', userList)
|
}, 1500)
|
} else {
|
this.passwordFailed(res.message)
|
that.loading = false
|
}
|
})
|
} else {
|
that.loading = false
|
}
|
})
|
},
|
prevStep() {
|
this.$emit('prevStep', this.userList)
|
},
|
|
handlePasswordCheck(rule, value, callback) {
|
let password = this.form.getFieldValue('password')
|
if (value && password && value.trim() !== password.trim()) {
|
callback(new Error('两次密码不一致'))
|
}
|
callback()
|
},
|
passwordFailed(err) {
|
this.$notification['error']({
|
message: '更改密码失败',
|
description: err,
|
duration: 4
|
})
|
}
|
}
|
}
|
</script>
|
<style lang="less" scoped>
|
.stepFormText {
|
margin-bottom: 24px;
|
}
|
|
.ant-form-item-label,
|
.ant-form-item-control {
|
line-height: 22px;
|
}
|
</style>
|
