|
@@ -5,21 +5,20 @@
|
|
<div class="registerFormBox">
|
|
<div class="registerFormBox">
|
|
<van-form @submit="registerSubmit">
|
|
<van-form @submit="registerSubmit">
|
|
<van-field v-model="username" name="username" :label="$t('register.usernameLabel')"
|
|
<van-field v-model="username" name="username" :label="$t('register.usernameLabel')"
|
|
- :placeholder="$t('register.usernamePlaceholder')"
|
|
|
|
- :rules="[{ required: true, message: $t('register.usernameRequired') }]"/>
|
|
|
|
|
|
+ :placeholder="$t('register.usernamePlaceholder')"
|
|
|
|
+ :rules="[{ required: true, message: $t('register.usernameRequired') }]" />
|
|
<br>
|
|
<br>
|
|
<van-field v-model="name" name="name" :label="$t('register.nameLabel')"
|
|
<van-field v-model="name" name="name" :label="$t('register.nameLabel')"
|
|
- :placeholder="$t('register.namePlaceholder')"
|
|
|
|
- :rules="[{ required: true, message: $t('register.nameRequired') }]"/>
|
|
|
|
|
|
+ :placeholder="$t('register.namePlaceholder')"
|
|
|
|
+ :rules="[{ required: true, message: $t('register.nameRequired') }]" />
|
|
<br>
|
|
<br>
|
|
<van-field v-model="password" name="password" type="password" :label="$t('register.passwordLabel')"
|
|
<van-field v-model="password" name="password" type="password" :label="$t('register.passwordLabel')"
|
|
- :placeholder="$t('register.passwordPlaceholder')"
|
|
|
|
- :rules="[{ required: true, message: $t('register.passwordRequired') }]"/>
|
|
|
|
|
|
+ :placeholder="$t('register.passwordPlaceholder')"
|
|
|
|
+ :rules="[{ required: true, message: $t('register.passwordRequired') }]" />
|
|
<br>
|
|
<br>
|
|
- <van-field v-model="passwordCheck" name="passwordCheck" type="password"
|
|
|
|
- :label="$t('register.passwordCheckLabel')"
|
|
|
|
- :placeholder="$t('register.passwordCheckPlaceholder')"
|
|
|
|
- :rules="[{ required: true, message: $t('register.passwordCheckRequired') }]"/>
|
|
|
|
|
|
+ <van-field v-model="passwordCheck" name="passwordCheck" type="password" :label="$t('register.passwordCheckLabel')"
|
|
|
|
+ :placeholder="$t('register.passwordCheckPlaceholder')"
|
|
|
|
+ :rules="[{ required: true, message: $t('register.passwordCheckRequired') }]" />
|
|
<br>
|
|
<br>
|
|
<!-- 国家或地区 -->
|
|
<!-- 国家或地区 -->
|
|
<div class="van-cell van-field">
|
|
<div class="van-cell van-field">
|
|
@@ -36,83 +35,77 @@
|
|
<div class="van-cell van-field">
|
|
<div class="van-cell van-field">
|
|
<div class="van-cell__title van-field__label"><span>{{ $t('register.logonMode') }}</span></div>
|
|
<div class="van-cell__title van-field__label"><span>{{ $t('register.logonMode') }}</span></div>
|
|
<div class="van-cell__value van-field__value radioBox">
|
|
<div class="van-cell__value van-field__value radioBox">
|
|
- <van-radio-group v-model="logonMode" direction="horizontal">
|
|
|
|
|
|
+ <van-radio-group class="o-pr-18" v-model="logonMode" direction="horizontal">
|
|
<van-radio name="10" icon-size="18px" :value="0">{{ $t('register.phoneRegistration') }}</van-radio>
|
|
<van-radio name="10" icon-size="18px" :value="0">{{ $t('register.phoneRegistration') }}</van-radio>
|
|
<van-radio name="11" icon-size="18px" :value="1">{{ $t('register.emailRegistration') }}</van-radio>
|
|
<van-radio name="11" icon-size="18px" :value="1">{{ $t('register.emailRegistration') }}</van-radio>
|
|
</van-radio-group>
|
|
</van-radio-group>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- 国内手机 -->
|
|
<!-- 国内手机 -->
|
|
- <van-field v-if="logonMode === '10'" v-model="phone" name="phone" type="tel"
|
|
|
|
- :label="$t('register.phoneLabel')"
|
|
|
|
- :placeholder="$t('register.phonePlaceholder')"
|
|
|
|
- :rules="[{ required: ifForeign === '0' && logonMode === '10', message: $t('register.phoneRequired') }]"
|
|
|
|
- >
|
|
|
|
|
|
+ <van-field v-if="logonMode === '10'" v-model="phone" name="phone" type="tel" :label="$t('register.phoneLabel')"
|
|
|
|
+ :placeholder="$t('register.phonePlaceholder')"
|
|
|
|
+ :rules="[{ required: ifForeign === '0' && logonMode === '10', message: $t('register.phoneRequired') }]" />
|
|
|
|
+ <br v-if="ifForeign === '0' && logonMode === '10'">
|
|
|
|
+ <!-- 短信验证码 -->
|
|
|
|
+ <van-field v-if="logonMode === '10'" v-model="code" name="code" :label="$t('register.codeLabel')"
|
|
|
|
+ :placeholder="$t('register.codePlaceholder')"
|
|
|
|
+ :rules="[{ required: true, message: $t('register.codeRequired') }]">
|
|
<template #button v-if="ifForeign === '0' && logonMode === '10'">
|
|
<template #button v-if="ifForeign === '0' && logonMode === '10'">
|
|
- <van-button size="small" type="primary" @click="seedVerCode()" :disabled="time !== 0 || phone.length === 0">{{
|
|
|
|
|
|
+ <van-button size="small" type="primary" @click="seedVerCode()"
|
|
|
|
+ :disabled="time !== 0 || phone.length === 0">{{
|
|
time === 0 ?
|
|
time === 0 ?
|
|
- $t('register.seedVerCode') : time + $t('register.replaysInSeconds')
|
|
|
|
|
|
+ $t('register.seedVerCode') : time + $t('register.replaysInSeconds')
|
|
}}
|
|
}}
|
|
</van-button>
|
|
</van-button>
|
|
</template>
|
|
</template>
|
|
</van-field>
|
|
</van-field>
|
|
- <br v-if="ifForeign === '0' && logonMode === '10'">
|
|
|
|
- <!-- 短信验证码 -->
|
|
|
|
- <van-field v-if="logonMode === '10'" v-model="code" name="code" :label="$t('register.codeLabel')"
|
|
|
|
- :placeholder="$t('register.codePlaceholder')"
|
|
|
|
- :rules="[{ required: true, message: $t('register.codeRequired') }]"/>
|
|
|
|
<!-- 国内邮箱 -->
|
|
<!-- 国内邮箱 -->
|
|
- <van-field v-if="logonMode === '11'" v-model="email" name="email"
|
|
|
|
- :label="$t('register.emailLabel')"
|
|
|
|
- :placeholder="$t('register.emailPlaceholder')"
|
|
|
|
- :rules="[
|
|
|
|
- { required: ifForeign === '0' && logonMode === '11', message: $t('register.emailRequired') },
|
|
|
|
- { pattern: /^[a-z0-9]+([._\\-]*[a-z0-9])*@([a-z0-9]+[-a-z0-9]*[a-z0-9]+.){1,63}[a-z0-9]+$/, message: '邮箱格式错误!'}
|
|
|
|
- ]"
|
|
|
|
- :minlength="3"
|
|
|
|
- :maxlength="20"
|
|
|
|
- >
|
|
|
|
|
|
+ <van-field v-if="logonMode === '11'" v-model="email" name="email" :label="$t('register.emailLabel')"
|
|
|
|
+ :placeholder="$t('register.emailPlaceholder')" :rules="[
|
|
|
|
+ { required: ifForeign === '0' && logonMode === '11', message: $t('register.emailRequired') },
|
|
|
|
+ { pattern: /^[a-z0-9]+([._\\-]*[a-z0-9])*@([a-z0-9]+[-a-z0-9]*[a-z0-9]+.){1,63}[a-z0-9]+$/, message: '邮箱格式错误!' }
|
|
|
|
+ ]" :minlength="3" :maxlength="20">
|
|
|
|
+ </van-field>
|
|
|
|
+ <br v-if="ifForeign === '0' && logonMode === '11'">
|
|
|
|
+ <!-- 国内邮箱验证码 -->
|
|
|
|
+ <van-field v-if="logonMode === '11'" v-model="code" name="code" :label="$t('register.emailCodeLabel')"
|
|
|
|
+ :placeholder="$t('register.emailCodePlaceholder')"
|
|
|
|
+ :rules="[{ required: true, message: $t('register.emailCodeRequired') }]">
|
|
<template #button v-if="ifForeign === '0' && logonMode === '11'">
|
|
<template #button v-if="ifForeign === '0' && logonMode === '11'">
|
|
- <van-button size="small" type="primary" @click="seedVerCode()" :disabled="time !== 0 || email.length === 0">{{
|
|
|
|
|
|
+ <van-button size="small" type="primary" @click="seedVerCode()"
|
|
|
|
+ :disabled="time !== 0 || email.length === 0">{{
|
|
time === 0 ?
|
|
time === 0 ?
|
|
- $t('register.seedVerCode') : time + $t('register.replaysInSeconds')
|
|
|
|
|
|
+ $t('register.seedVerCode') : time + $t('register.replaysInSeconds')
|
|
}}
|
|
}}
|
|
</van-button>
|
|
</van-button>
|
|
</template>
|
|
</template>
|
|
</van-field>
|
|
</van-field>
|
|
- <br v-if="ifForeign === '0' && logonMode === '11'">
|
|
|
|
- <!-- 国内邮箱验证码 -->
|
|
|
|
- <van-field v-if="logonMode === '11'" v-model="code" name="code"
|
|
|
|
- :label="$t('register.emailCodeLabel')"
|
|
|
|
- :placeholder="$t('register.emailCodePlaceholder')"
|
|
|
|
- :rules="[{ required: true, message: $t('register.emailCodeRequired') }]"/>
|
|
|
|
</div>
|
|
</div>
|
|
<!-- 海外 -->
|
|
<!-- 海外 -->
|
|
<div v-if="ifForeign === '1'">
|
|
<div v-if="ifForeign === '1'">
|
|
<!-- 海外邮箱 -->
|
|
<!-- 海外邮箱 -->
|
|
- <van-field v-if="ifForeign === '1'" v-model="email" name="email"
|
|
|
|
- :label="$t('register.emailLabel')"
|
|
|
|
- :placeholder="$t('register.emailPlaceholder')"
|
|
|
|
- :rules="[{ required: ifForeign === '1', message: $t('register.emailRequired') }]"
|
|
|
|
- >
|
|
|
|
|
|
+ <van-field v-if="ifForeign === '1'" v-model="email" name="email" :label="$t('register.emailLabel')"
|
|
|
|
+ :placeholder="$t('register.emailPlaceholder')"
|
|
|
|
+ :rules="[{ required: ifForeign === '1', message: $t('register.emailRequired') }]" />
|
|
|
|
+ <br v-if="ifForeign === '1'">
|
|
|
|
+ <!-- 海外邮箱验证码 -->
|
|
|
|
+ <van-field v-if="ifForeign === '1'" v-model="code" name="code" :label="$t('register.emailCodeLabel')"
|
|
|
|
+ :placeholder="$t('register.emailCodePlaceholder')"
|
|
|
|
+ :rules="[{ required: true, message: $t('register.emailCodeRequired') }]">
|
|
<template #button v-if="ifForeign === '1'">
|
|
<template #button v-if="ifForeign === '1'">
|
|
- <van-button size="small" type="primary" @click="seedVerCode()" :disabled="time !== 0 || email.length === 0">{{
|
|
|
|
|
|
+ <van-button size="small" type="primary" @click="seedVerCode()"
|
|
|
|
+ :disabled="time !== 0 || email.length === 0">{{
|
|
time === 0 ?
|
|
time === 0 ?
|
|
- $t('register.seedVerCode') : time + $t('register.replaysInSeconds')
|
|
|
|
|
|
+ $t('register.seedVerCode') : time + $t('register.replaysInSeconds')
|
|
}}
|
|
}}
|
|
</van-button>
|
|
</van-button>
|
|
</template>
|
|
</template>
|
|
</van-field>
|
|
</van-field>
|
|
- <br v-if="ifForeign === '1'">
|
|
|
|
- <!-- 海外邮箱验证码 -->
|
|
|
|
- <van-field v-if="ifForeign === '1'" v-model="code" name="code" :label="$t('register.emailCodeLabel')"
|
|
|
|
- :placeholder="$t('register.emailCodePlaceholder')"
|
|
|
|
- :rules="[{ required: true, message: $t('register.emailCodeRequired') }]"/>
|
|
|
|
</div>
|
|
</div>
|
|
<!-- 提交验证信息 -->
|
|
<!-- 提交验证信息 -->
|
|
<van-button round type="primary" class="register" native-type="submit">{{
|
|
<van-button round type="primary" class="register" native-type="submit">{{
|
|
- $t('register.registerButton')
|
|
|
|
- }}
|
|
|
|
|
|
+ $t('register.registerButton')
|
|
|
|
+ }}
|
|
</van-button>
|
|
</van-button>
|
|
</van-form>
|
|
</van-form>
|
|
</div>
|
|
</div>
|
|
@@ -120,13 +113,13 @@
|
|
</template>
|
|
</template>
|
|
<script>
|
|
<script>
|
|
import md5 from 'js-md5';
|
|
import md5 from 'js-md5';
|
|
-import {ref, onMounted, reactive, toRefs} from 'vue';
|
|
|
|
-import {Toast} from 'vant';
|
|
|
|
-import {sentRegisterCode, tAdminSave} from '@/service/register';
|
|
|
|
|
|
+import { ref, onMounted, reactive, toRefs } from 'vue';
|
|
|
|
+import { Toast } from 'vant';
|
|
|
|
+import { sentRegisterCode, tAdminSave } from '@/service/register';
|
|
import sHeader from '@/components/SimpleHeader';
|
|
import sHeader from '@/components/SimpleHeader';
|
|
import logiLogoImgUrl from "@/assets/login/logo.png";
|
|
import logiLogoImgUrl from "@/assets/login/logo.png";
|
|
-import {useRouter} from 'vue-router';
|
|
|
|
-import {getLocal, setLocal, styleUrl} from '@/common/js/utils';
|
|
|
|
|
|
+import { useRouter } from 'vue-router';
|
|
|
|
+import { getLocal, setLocal, styleUrl } from '@/common/js/utils';
|
|
|
|
|
|
|
|
|
|
export default {
|
|
export default {
|
|
@@ -154,18 +147,19 @@ export default {
|
|
Toast.fail('两次密码不一致,请确认密码');
|
|
Toast.fail('两次密码不一致,请确认密码');
|
|
return false;
|
|
return false;
|
|
}
|
|
}
|
|
- const {data} = await tAdminSave({
|
|
|
|
|
|
+ const { data } = await tAdminSave({
|
|
username: username.value,
|
|
username: username.value,
|
|
name: name.value,
|
|
name: name.value,
|
|
password: md5(password.value),
|
|
password: md5(password.value),
|
|
ifForeign: ifForeign.value,
|
|
ifForeign: ifForeign.value,
|
|
phone: phone.value,
|
|
phone: phone.value,
|
|
email: email.value,
|
|
email: email.value,
|
|
- code: code.value
|
|
|
|
|
|
+ code: code.value,
|
|
|
|
+ companyType: '0',
|
|
});
|
|
});
|
|
if (data.code === '00000') {
|
|
if (data.code === '00000') {
|
|
Toast('注册成功');
|
|
Toast('注册成功');
|
|
- router.push({path: '/login'});
|
|
|
|
|
|
+ router.push({ path: '/login' });
|
|
} else {
|
|
} else {
|
|
Toast.fail(data.message);
|
|
Toast.fail(data.message);
|
|
}
|
|
}
|
|
@@ -181,7 +175,7 @@ export default {
|
|
} else {
|
|
} else {
|
|
phoneOrEmail = email.value;
|
|
phoneOrEmail = email.value;
|
|
}
|
|
}
|
|
- const {data} = await sentRegisterCode({
|
|
|
|
|
|
+ const { data } = await sentRegisterCode({
|
|
ifForeign: ifForeign.value,
|
|
ifForeign: ifForeign.value,
|
|
phoneOrEmail: phoneOrEmail
|
|
phoneOrEmail: phoneOrEmail
|
|
});
|
|
});
|
|
@@ -221,8 +215,8 @@ export default {
|
|
});
|
|
});
|
|
|
|
|
|
const signOptions = [
|
|
const signOptions = [
|
|
- {text: '手机注册', value: "mo"},
|
|
|
|
- {text: '邮箱注册', value: "ema"}
|
|
|
|
|
|
+ { text: '手机注册', value: "mo" },
|
|
|
|
+ { text: '邮箱注册', value: "ema" }
|
|
]
|
|
]
|
|
const option1 = [
|
|
const option1 = [
|
|
{
|
|
{
|
|
@@ -269,123 +263,4 @@ export default {
|
|
</script>
|
|
</script>
|
|
<style lang="less" scoped>
|
|
<style lang="less" scoped>
|
|
@import '../common/style/mixin';
|
|
@import '../common/style/mixin';
|
|
-
|
|
|
|
-.registerPage {
|
|
|
|
- .registerFormBox {
|
|
|
|
- width: 100%;
|
|
|
|
- margin-top: 38px;
|
|
|
|
- text-align: center;
|
|
|
|
-
|
|
|
|
- /deep/ .van-form {
|
|
|
|
- .van-cell {
|
|
|
|
- width: 90%;
|
|
|
|
- height: 38px;
|
|
|
|
- background-color: rgba(255, 255, 255, 1);
|
|
|
|
- padding: 0;
|
|
|
|
- color: rgba(168, 168, 197, 1);
|
|
|
|
- font-size: 13px;
|
|
|
|
- margin: 0 auto;
|
|
|
|
- margin-top: 10px;
|
|
|
|
- overflow: visible;
|
|
|
|
-
|
|
|
|
- &::after {
|
|
|
|
- display: none;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .van-field__button button {
|
|
|
|
- background-color: #8096ec;
|
|
|
|
- color: #fff;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .van-field__control {
|
|
|
|
- height: 38px;
|
|
|
|
- line-height: 38px;
|
|
|
|
- padding: 6px;
|
|
|
|
- border-radius: 2px;
|
|
|
|
- border: 0.5px solid rgba(185, 186, 208, 1);
|
|
|
|
-
|
|
|
|
- &:-internal-autofill-previewed,
|
|
|
|
- &:-internal-autofill-selected {
|
|
|
|
- -webkit-text-fill-color: #323233 !important;
|
|
|
|
- transition: background-color 5000s ease-in-out 0s !important;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .van-field__control::-webkit-input-placeholder {
|
|
|
|
- color: rgba(168, 168, 197, 1);
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .van-cell__value {
|
|
|
|
- width: 100%;
|
|
|
|
- flex: 0 auto;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .van-field__label {
|
|
|
|
- display: flex;
|
|
|
|
- height: 38px;
|
|
|
|
- align-items: center;
|
|
|
|
- // line-height: 38px;
|
|
|
|
- width: 100px;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .radioBox {
|
|
|
|
- display: flex;
|
|
|
|
-
|
|
|
|
- .van-radio-group--horizontal {
|
|
|
|
- width: 100%;
|
|
|
|
- justify-content: space-around;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .van-radio {
|
|
|
|
- overflow: visible;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .van-radio__icon {
|
|
|
|
- font-size: 13px;
|
|
|
|
-
|
|
|
|
- .van-icon {
|
|
|
|
- width: 12px;
|
|
|
|
- height: 12px;
|
|
|
|
- border-color: #4d6add;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .van-radio__label {
|
|
|
|
- line-height: 13px;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .van-radio__icon--checked .van-icon-success {
|
|
|
|
- border-color: #4d6add;
|
|
|
|
- background: #4d6add;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .van-radio__icon--checked .van-icon-success::before {
|
|
|
|
- content: '';
|
|
|
|
- background: #fff;
|
|
|
|
- width: 40%;
|
|
|
|
- height: 40%;
|
|
|
|
- position: absolute;
|
|
|
|
- top: 30%;
|
|
|
|
- left: 30%;
|
|
|
|
- border-radius: 100%;
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .van-radio__icon--checked+.van-radio__label {
|
|
|
|
- color: #4d6add;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-
|
|
|
|
- .register {
|
|
|
|
- background-color: rgba(77, 106, 221, 1);
|
|
|
|
- border-radius: 17px;
|
|
|
|
- height: 34px;
|
|
|
|
- width: 220px;
|
|
|
|
- margin-top: 60px;
|
|
|
|
- font-size: 15px;
|
|
|
|
- font-family: PingFangSC-Medium;
|
|
|
|
- }
|
|
|
|
-}
|
|
|
|
</style>
|
|
</style>
|