You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
89 lines
3.0 KiB
89 lines
3.0 KiB
<template>
|
|
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
|
|
<el-form-item :label="$t('account.form.user')" prop="user">
|
|
<el-input v-model="form.user" :placeholder="$t('input_please',{keyword:$t('account.form.user')})"></el-input>
|
|
</el-form-item>
|
|
<el-form-item :label="$t('account.form.password')" prop="password">
|
|
<el-input v-model="form.password" type="password" :placeholder="$t('input_please',{keyword:$t('account.form.password')})"></el-input>
|
|
</el-form-item>
|
|
<el-form-item class="is-required" :label="$t('account.form.confirmPwd')" prop="confirmPwd">
|
|
<el-input v-model="form.confirmPwd" type="password" :placeholder="$t('input_confirm',{keyword:$t('account.form.password')})"></el-input>
|
|
</el-form-item>
|
|
<el-form-item>
|
|
<el-button type="primary" @click="submit">{{$t('account.register')}}</el-button>
|
|
<el-button @click="$refs.form.resetFields()">{{$t('reset')}}</el-button>
|
|
</el-form-item>
|
|
</el-form>
|
|
</template>
|
|
|
|
<script lang="ts">
|
|
|
|
import Vue from 'vue'
|
|
|
|
export default Vue.extend({
|
|
name: 'register',
|
|
data(){
|
|
let that=this
|
|
return {
|
|
//注册表单
|
|
form:{
|
|
user:'',
|
|
password:'',
|
|
confirmPwd:''
|
|
},
|
|
// 表单校验规则
|
|
rules:{
|
|
user:[{
|
|
required: true,
|
|
message: this.$t('input_please', { keyword: this.$t('account.form.user') }),
|
|
}],
|
|
password:[{
|
|
required: true,
|
|
message: this.$t('input_please', { keyword: this.$t('account.form.password') })
|
|
}],
|
|
confirmPwd:[{
|
|
validator:(rule, value, callback) => {
|
|
if (value === '') {
|
|
callback(new Error(rule.msg.a));
|
|
} else if (value !== that.form.password) {
|
|
callback(new Error(rule.msg.b));
|
|
} else {
|
|
callback();
|
|
}
|
|
},
|
|
msg:{
|
|
a:this.$t('input_confirm', { keyword: this.$t('account.form.password') }),
|
|
b:this.$t('account.form.tip.tow_diff')
|
|
}
|
|
}]
|
|
}
|
|
}
|
|
},
|
|
methods:{
|
|
submit(){
|
|
this.$refs.form.validate((valid: boolean)=>{
|
|
if(valid){
|
|
let that=this
|
|
this.GLOBAL.fetchJSON('/v1/api/users/sign_up','POST',{ userName: this.form.user, password: this.form.password },function(res) {
|
|
if(res.code==='200'){
|
|
that.$message.info(that.$t('account.form.tip.register_ok').toString())
|
|
that.$router.push(that.localePath('/'))
|
|
}else if(res.code==='1101'){
|
|
that.$message.error(that.$t('account.form.tip.user_exit',{name:that.form.user}).toString())
|
|
}else{
|
|
that.$message.error(that.$t('error_500').toString())
|
|
}
|
|
})
|
|
}else{
|
|
this.$message.error({
|
|
message:this.$t('form_err').toString(),
|
|
duration:2000
|
|
})
|
|
return false
|
|
}
|
|
})
|
|
|
|
}
|
|
}
|
|
})
|
|
</script>
|
|
|