个人中心账号设置添加校验
continuous-integration/drone/push Build is passing
Details
continuous-integration/drone/push Build is passing
Details
parent
f2e6ecce8e
commit
ca1b95201c
|
@ -207,7 +207,7 @@ export default {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
return {
|
return {
|
||||||
active: 1,
|
active: 0,
|
||||||
Img,
|
Img,
|
||||||
form: {
|
form: {
|
||||||
EmailOrPhone: '',
|
EmailOrPhone: '',
|
||||||
|
|
|
@ -3,9 +3,14 @@
|
||||||
<div class="trial-myinfo-right-box">
|
<div class="trial-myinfo-right-box">
|
||||||
<div class="trial-myinfo-head">
|
<div class="trial-myinfo-head">
|
||||||
<!-- 账号信息 -->
|
<!-- 账号信息 -->
|
||||||
{{ $t("trials:trials-myinfo:title:accountInfo") }}
|
{{ $t('trials:trials-myinfo:title:accountInfo') }}
|
||||||
</div>
|
</div>
|
||||||
<el-form label-position="right" label-width="100px">
|
<el-form
|
||||||
|
label-position="right"
|
||||||
|
label-width="100px"
|
||||||
|
:rules="rule"
|
||||||
|
:model="userForm"
|
||||||
|
>
|
||||||
<!-- 用户名 -->
|
<!-- 用户名 -->
|
||||||
<el-form-item
|
<el-form-item
|
||||||
:label="$t('trials:trials-myinfo:form:userName')"
|
:label="$t('trials:trials-myinfo:form:userName')"
|
||||||
|
@ -27,18 +32,18 @@
|
||||||
size="small"
|
size="small"
|
||||||
@click="setNewUserName"
|
@click="setNewUserName"
|
||||||
>
|
>
|
||||||
{{ $t("trials:trials-myinfo:button:update") }}
|
{{ $t('trials:trials-myinfo:button:update') }}
|
||||||
</el-button>
|
</el-button>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<!-- 电话 -->
|
<!-- 电话 -->
|
||||||
<el-form-item
|
<el-form-item
|
||||||
:label="$t('trials:trials-myinfo:form:phone')"
|
:label="$t('trials:trials-myinfo:form:phone')"
|
||||||
style="margin-bottom: 5px"
|
style="margin-bottom: 5px"
|
||||||
prop="UserName"
|
prop="Phone"
|
||||||
>
|
>
|
||||||
<span>{{ user.Phone }}</span>
|
<span>{{ user.Phone }}</span>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="" style="position: relative" prop="UserName">
|
<el-form-item label="" style="position: relative" prop="Phone">
|
||||||
<el-input
|
<el-input
|
||||||
v-model="userForm.Phone"
|
v-model="userForm.Phone"
|
||||||
:placeholder="$t('trials:trials-myinfo:form:phone')"
|
:placeholder="$t('trials:trials-myinfo:form:phone')"
|
||||||
|
@ -51,14 +56,14 @@
|
||||||
size="small"
|
size="small"
|
||||||
@click="setNewPhone"
|
@click="setNewPhone"
|
||||||
>
|
>
|
||||||
{{ $t("trials:trials-myinfo:button:update") }}
|
{{ $t('trials:trials-myinfo:button:update') }}
|
||||||
</el-button>
|
</el-button>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<!-- 邮箱 -->
|
<!-- 邮箱 -->
|
||||||
<el-form-item
|
<el-form-item
|
||||||
:label="$t('trials:trials-myinfo:form:email')"
|
:label="$t('trials:trials-myinfo:form:email')"
|
||||||
style="margin-bottom: 5px"
|
style="margin-bottom: 5px"
|
||||||
prop="UserName"
|
prop="EMail"
|
||||||
>
|
>
|
||||||
<span>{{ user.EMail }}</span>
|
<span>{{ user.EMail }}</span>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
|
@ -100,7 +105,7 @@
|
||||||
size="small"
|
size="small"
|
||||||
@click="setNewEmail"
|
@click="setNewEmail"
|
||||||
>
|
>
|
||||||
{{ $t("trials:trials-myinfo:button:update") }}
|
{{ $t('trials:trials-myinfo:button:update') }}
|
||||||
</el-button>
|
</el-button>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-form>
|
</el-form>
|
||||||
|
@ -114,19 +119,19 @@ import {
|
||||||
setNewEmail,
|
setNewEmail,
|
||||||
setNewPhone,
|
setNewPhone,
|
||||||
setNewUserName,
|
setNewUserName,
|
||||||
} from "@/api/system/user.js";
|
} from '@/api/system/user.js'
|
||||||
import { removeToken } from "@/utils/auth";
|
import { removeToken } from '@/utils/auth'
|
||||||
import password from "./password.vue";
|
import password from './password.vue'
|
||||||
var timer = "";
|
var timer = ''
|
||||||
var countdown = 60;
|
var countdown = 60
|
||||||
export default {
|
export default {
|
||||||
name: "account",
|
name: 'account',
|
||||||
components: { password },
|
components: { password },
|
||||||
props: {
|
props: {
|
||||||
user: {
|
user: {
|
||||||
required: true,
|
required: true,
|
||||||
default: () => {
|
default: () => {
|
||||||
return {};
|
return {}
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
IsCanConnectInternet: {
|
IsCanConnectInternet: {
|
||||||
|
@ -138,108 +143,136 @@ export default {
|
||||||
return {
|
return {
|
||||||
userForm: {},
|
userForm: {},
|
||||||
sendDisabled: true,
|
sendDisabled: true,
|
||||||
sendTitle: this.$t("trials:trials-myinfo:button:getVCode"),
|
sendTitle: this.$t('trials:trials-myinfo:button:getVCode'),
|
||||||
};
|
rule: {
|
||||||
|
UserName: [
|
||||||
|
{
|
||||||
|
validator: (rule, value, callback) => {
|
||||||
|
if (!value) return callback()
|
||||||
|
var lang = zzSessionStorage.getItem('lang')
|
||||||
|
? zzSessionStorage.getItem('lang')
|
||||||
|
: 'zh'
|
||||||
|
/* eslint-disable */
|
||||||
|
var reg1 = /^[a-zA-Z0-9_]{4,16}$/ //密码必须是8位以上、必须含有字母、数字、特殊符号
|
||||||
|
if (!reg1.test(value)) {
|
||||||
|
callback(
|
||||||
|
lang === 'zh'
|
||||||
|
? new Error(
|
||||||
|
'1)用户名字符长度最小为4个字符,最大为16个字符,只可使用字母、数字、下划线;'
|
||||||
|
)
|
||||||
|
: new Error(
|
||||||
|
'the username must have:1) At least 4 characters;2) At most 16 characters;3)Only letters, numbers, and underscores are allowed.'
|
||||||
|
)
|
||||||
|
)
|
||||||
|
} else {
|
||||||
|
callback()
|
||||||
|
}
|
||||||
|
},
|
||||||
|
trigger: 'blur',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
setNewEmail() {
|
setNewEmail() {
|
||||||
setNewEmail(this.userForm.EMail, this.userForm.VerificationCode).then(
|
setNewEmail(this.userForm.EMail, this.userForm.VerificationCode).then(
|
||||||
() => {
|
() => {
|
||||||
this.userForm.EMail = "";
|
this.userForm.EMail = ''
|
||||||
this.userForm.VerificationCode = "";
|
this.userForm.VerificationCode = ''
|
||||||
this.$message.success(
|
this.$message.success(
|
||||||
this.$t("trials:trials-myinfo:message:updateSuccessfully")
|
this.$t('trials:trials-myinfo:message:updateSuccessfully')
|
||||||
);
|
)
|
||||||
this.$emit("getUserInfo");
|
this.$emit('getUserInfo')
|
||||||
}
|
}
|
||||||
);
|
)
|
||||||
},
|
},
|
||||||
async setNewUserName() {
|
async setNewUserName() {
|
||||||
try {
|
try {
|
||||||
let confirm = await this.$confirm(
|
let confirm = await this.$confirm(
|
||||||
this.$t("trials:trials-myInfo:confirmMessage:updateUserName"),
|
this.$t('trials:trials-myInfo:confirmMessage:updateUserName'),
|
||||||
{
|
{
|
||||||
type: "warning",
|
type: 'warning',
|
||||||
distinguishCancelAndClose: true,
|
distinguishCancelAndClose: true,
|
||||||
confirmButtonText: this.$t("common:button:confirm"),
|
confirmButtonText: this.$t('common:button:confirm'),
|
||||||
cancelButtonText: this.$t("common:button:cancel"),
|
cancelButtonText: this.$t('common:button:cancel'),
|
||||||
}
|
}
|
||||||
);
|
)
|
||||||
if (confirm !== "confirm") return;
|
if (confirm !== 'confirm') return
|
||||||
let res = await setNewUserName(this.userForm.UserName);
|
let res = await setNewUserName(this.userForm.UserName)
|
||||||
if (res.IsSuccess) {
|
if (res.IsSuccess) {
|
||||||
this.userForm.UserName = "";
|
this.userForm.UserName = ''
|
||||||
this.$message.success(
|
this.$message.success(
|
||||||
this.$t("trials:trials-myinfo:message:updateSuccessfully")
|
this.$t('trials:trials-myinfo:message:updateSuccessfully')
|
||||||
);
|
)
|
||||||
this.$emit("getUserInfo");
|
this.$emit('getUserInfo')
|
||||||
removeToken();
|
removeToken()
|
||||||
this.logout();
|
this.logout()
|
||||||
}
|
}
|
||||||
} catch (err) {
|
} catch (err) {
|
||||||
console.log(err);
|
console.log(err)
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
setNewPhone() {
|
setNewPhone() {
|
||||||
setNewPhone(this.userForm.Phone).then(() => {
|
setNewPhone(this.userForm.Phone).then(() => {
|
||||||
this.userForm.Phone = "";
|
this.userForm.Phone = ''
|
||||||
this.$message.success(
|
this.$message.success(
|
||||||
this.$t("trials:trials-myinfo:message:updateSuccessfully")
|
this.$t('trials:trials-myinfo:message:updateSuccessfully')
|
||||||
);
|
)
|
||||||
this.$emit("getUserInfo");
|
this.$emit('getUserInfo')
|
||||||
});
|
})
|
||||||
},
|
},
|
||||||
handleEmailChange() {
|
handleEmailChange() {
|
||||||
var reg =
|
var reg =
|
||||||
/^[A-Za-z0-9]+([_\.][A-Za-z0-9]+)*@([A-Za-z0-9\-]+\.)+[A-Za-z]{2,6}$/;
|
/^[A-Za-z0-9]+([_\.][A-Za-z0-9]+)*@([A-Za-z0-9\-]+\.)+[A-Za-z]{2,6}$/
|
||||||
if (this.userForm.EMail && reg.test(this.userForm.EMail)) {
|
if (this.userForm.EMail && reg.test(this.userForm.EMail)) {
|
||||||
this.sendDisabled = false;
|
this.sendDisabled = false
|
||||||
} else {
|
} else {
|
||||||
this.sendDisabled = true;
|
this.sendDisabled = true
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
sendVerificationCode() {
|
sendVerificationCode() {
|
||||||
sendVerificationCode(this.userForm.EMail).then(() => {
|
sendVerificationCode(this.userForm.EMail).then(() => {
|
||||||
this.settime(this);
|
this.settime(this)
|
||||||
// 发送成功
|
// 发送成功
|
||||||
this.$message.success(
|
this.$message.success(
|
||||||
this.$t("trials:trials-myinfo:message:sendSuccessfully")
|
this.$t('trials:trials-myinfo:message:sendSuccessfully')
|
||||||
);
|
)
|
||||||
});
|
})
|
||||||
},
|
},
|
||||||
settime(obj) {
|
settime(obj) {
|
||||||
if (countdown === 0) {
|
if (countdown === 0) {
|
||||||
obj.sendDisabled = false;
|
obj.sendDisabled = false
|
||||||
obj.sendTitle = this.$t("trials:trials-myinfo:button:getVCode"); // '获取验证码'
|
obj.sendTitle = this.$t('trials:trials-myinfo:button:getVCode') // '获取验证码'
|
||||||
countdown = 60;
|
countdown = 60
|
||||||
clearTimeout(timer);
|
clearTimeout(timer)
|
||||||
return;
|
return
|
||||||
} else {
|
} else {
|
||||||
obj.sendDisabled = true;
|
obj.sendDisabled = true
|
||||||
obj.sendTitle = `${this.$t(
|
obj.sendTitle = `${this.$t(
|
||||||
"trials:trials-myinfo:button:wait"
|
'trials:trials-myinfo:button:wait'
|
||||||
)}(${countdown}s)`;
|
)}(${countdown}s)`
|
||||||
countdown--;
|
countdown--
|
||||||
// eslint-disable-next-line no-self-assign
|
// eslint-disable-next-line no-self-assign
|
||||||
countdown = countdown;
|
countdown = countdown
|
||||||
timer = setTimeout(function () {
|
timer = setTimeout(function () {
|
||||||
obj.settime(obj);
|
obj.settime(obj)
|
||||||
}, 1000);
|
}, 1000)
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
async logout() {
|
async logout() {
|
||||||
/* eslint-disable */
|
/* eslint-disable */
|
||||||
var loginType = zzSessionStorage.getItem("loginType");
|
var loginType = zzSessionStorage.getItem('loginType')
|
||||||
await this.$store.dispatch("user/logout");
|
await this.$store.dispatch('user/logout')
|
||||||
if (loginType) {
|
if (loginType) {
|
||||||
this.$router.push(`/login?loginType=${loginType}`);
|
this.$router.push(`/login?loginType=${loginType}`)
|
||||||
} else {
|
} else {
|
||||||
this.$router.push(`/login`);
|
this.$router.push(`/login`)
|
||||||
}
|
}
|
||||||
this.$i18n.locale = "zh";
|
this.$i18n.locale = 'zh'
|
||||||
this.setLanguage("zh");
|
this.setLanguage('zh')
|
||||||
this.$updateDictionary();
|
this.$updateDictionary()
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
};
|
}
|
||||||
</script>
|
</script>
|
Loading…
Reference in New Issue