|
|
@ -3,21 +3,11 @@ |
|
|
|
<div class="d-flex flex-column box"> |
|
|
|
<!-- 切换登录方式 --> |
|
|
|
<div class="d-flex justify-center my-4"> |
|
|
|
<a-button |
|
|
|
:class="type === 1 ? 'baseColor ' : 'textColor'" |
|
|
|
@click="type = 1" |
|
|
|
class="d-flex flex-column" |
|
|
|
type="link" |
|
|
|
> |
|
|
|
<a-button :class="type === 1 ? 'baseColor ' : 'textColor'" @click="type = 1" class="d-flex flex-column" type="link"> |
|
|
|
<span>免密登录</span> |
|
|
|
<div class="head-top mt-1" v-if="type === 1"></div> |
|
|
|
</a-button> |
|
|
|
<a-button |
|
|
|
:class="type === 3 ? 'baseColor ' : 'textColor'" |
|
|
|
@click="type = 3" |
|
|
|
class="d-flex flex-column" |
|
|
|
type="link" |
|
|
|
> |
|
|
|
<a-button :class="type === 3 ? 'baseColor ' : 'textColor'" @click="type = 3" class="d-flex flex-column" type="link"> |
|
|
|
<span>账号登录</span> |
|
|
|
<div class="head-top mt-1" v-if="type === 3"></div> |
|
|
|
</a-button> |
|
|
@ -27,64 +17,28 @@ |
|
|
|
<a-col :span="8" class="explain" flex="auto"> |
|
|
|
<!-- <a-form :form="form" v-model="valid"> --> |
|
|
|
<a-form :form="form" @submit="handleSignIn"> |
|
|
|
<a-form-item |
|
|
|
:label-col="formItemLayout.labelCol" |
|
|
|
:wrapper-col="formItemLayout.wrapperCol" |
|
|
|
label="手机号" |
|
|
|
> |
|
|
|
<a-input |
|
|
|
@change="changePhone" |
|
|
|
placeholder="请输入手机号" |
|
|
|
type="tel" |
|
|
|
v-decorator="['identifier', { rules: phoneRules }]" |
|
|
|
/> |
|
|
|
<a-form-item :label-col="formItemLayout.labelCol" :wrapper-col="formItemLayout.wrapperCol" label="手机号"> |
|
|
|
<a-input @change="changePhone" placeholder="请输入手机号" type="tel" v-decorator="['identifier', { rules: phoneRules }]" /> |
|
|
|
</a-form-item> |
|
|
|
<a-form-item |
|
|
|
:label-col="formItemLayout.labelCol" |
|
|
|
:wrapper-col="formItemLayout.wrapperCol" |
|
|
|
label="图片验证码" |
|
|
|
required |
|
|
|
> |
|
|
|
<a-form-item :label-col="formItemLayout.labelCol" :wrapper-col="formItemLayout.wrapperCol" label="图片验证码" required> |
|
|
|
<div class="d-flex flex-nowrap"> |
|
|
|
<a-input placeholder="图片验证码" type="number" v-model="codeNum" /> |
|
|
|
<img |
|
|
|
:src="picCode.imageBase64" |
|
|
|
@click="changePicCode" |
|
|
|
class="code_img ml-2" |
|
|
|
v-if="picCode && picCode.imageBase64" |
|
|
|
/> |
|
|
|
<img :src="picCode.imageBase64" @click="changePicCode" class="code_img ml-2" v-if="picCode && picCode.imageBase64" /> |
|
|
|
<a-button @click="changePicCode" class="code_img ml-2" size="small" v-else>获取验证码</a-button> |
|
|
|
<!-- <a-input v-decorator="['account', { rules: rules.account }]" /> --> |
|
|
|
</div> |
|
|
|
</a-form-item> |
|
|
|
|
|
|
|
<a-form-item |
|
|
|
:label-col="formItemLayout.labelCol" |
|
|
|
:wrapper-col="formItemLayout.wrapperCol" |
|
|
|
label="短信验证码" |
|
|
|
> |
|
|
|
<a-form-item :label-col="formItemLayout.labelCol" :wrapper-col="formItemLayout.wrapperCol" label="短信验证码"> |
|
|
|
<div class="d-flex flex-nowrap"> |
|
|
|
<a-input |
|
|
|
placeholder="请输入验证码" |
|
|
|
type="number" |
|
|
|
v-decorator="['credential', { rules: codeRules }]" |
|
|
|
/> |
|
|
|
<a-button |
|
|
|
class="ml-2" |
|
|
|
disabled |
|
|
|
type="primary" |
|
|
|
v-if="showInterval" |
|
|
|
>重新发送 {{ interval }}</a-button> |
|
|
|
<a-button |
|
|
|
:disabled="identifier && identifier.length !== 11" |
|
|
|
@click="getCode" |
|
|
|
class="ml-2" |
|
|
|
type="primary" |
|
|
|
v-else |
|
|
|
>获取验证码</a-button> |
|
|
|
<a-input placeholder="请输入验证码" type="number" v-decorator="['credential', { rules: codeRules }]" /> |
|
|
|
<a-button class="ml-2" disabled type="primary" v-if="showInterval">重新发送 {{ interval }}</a-button> |
|
|
|
<a-button :disabled="identifier && identifier.length !== 11" @click="getCode" class="ml-2" type="primary" v-else> |
|
|
|
获取验证码 |
|
|
|
</a-button> |
|
|
|
</div> |
|
|
|
</a-form-item> |
|
|
|
<a-form-item |
|
|
|
<!-- <a-form-item |
|
|
|
:label-col="formItemLayout.labelCol" |
|
|
|
:wrapper-col="formItemLayout.wrapperCol" |
|
|
|
label="来源" |
|
|
@ -92,7 +46,7 @@ |
|
|
|
<a-select placeholder="请选择来源" v-decorator="['source']"> |
|
|
|
<a-select-option value="1">绿谷</a-select-option> |
|
|
|
</a-select> |
|
|
|
</a-form-item> |
|
|
|
</a-form-item> --> |
|
|
|
|
|
|
|
<div class="d-flex flex-row-reverse"> |
|
|
|
<a-button block class="my-5" html-type="submit" style="width: 75%" type="primary">现在登录</a-button> |
|
|
@ -121,35 +75,20 @@ |
|
|
|
<a-row class="d-flex flex-nowrap mt-4" type="flex" v-if="type === 3"> |
|
|
|
<a-col :span="8" class="explain" flex="auto"> |
|
|
|
<a-form :form="form" @submit="handleSignIn"> |
|
|
|
<a-form-item |
|
|
|
:label-col="formItemLayout.labelCol" |
|
|
|
:wrapper-col="formItemLayout.wrapperCol" |
|
|
|
label="账号" |
|
|
|
> |
|
|
|
<a-form-item :label-col="formItemLayout.labelCol" :wrapper-col="formItemLayout.wrapperCol" label="账号"> |
|
|
|
<a-input |
|
|
|
placeholder="请输入用户名/手机号" |
|
|
|
v-decorator="['identifier', { rules: [{ required: true, message: '请输入用户名/手机号' }] }]" |
|
|
|
/> |
|
|
|
</a-form-item> |
|
|
|
<a-form-item |
|
|
|
:label-col="formItemLayout.labelCol" |
|
|
|
:wrapper-col="formItemLayout.wrapperCol" |
|
|
|
label="密码" |
|
|
|
> |
|
|
|
<a-input-password |
|
|
|
placeholder="请输入6-16位数字和字母密码" |
|
|
|
v-decorator="['credential', { rules: passwordRules }]" |
|
|
|
/> |
|
|
|
<a-form-item :label-col="formItemLayout.labelCol" :wrapper-col="formItemLayout.wrapperCol" label="密码"> |
|
|
|
<a-input-password placeholder="请输入6-16位数字和字母密码" v-decorator="['credential', { rules: passwordRules }]" /> |
|
|
|
</a-form-item> |
|
|
|
<a-form-item |
|
|
|
:label-col="formItemLayout.labelCol" |
|
|
|
:wrapper-col="formItemLayout.wrapperCol" |
|
|
|
label="来源" |
|
|
|
> |
|
|
|
<!-- <a-form-item :label-col="formItemLayout.labelCol" :wrapper-col="formItemLayout.wrapperCol" label="来源"> |
|
|
|
<a-select placeholder="请选择来源" v-decorator="['source']"> |
|
|
|
<a-select-option value="1">绿谷</a-select-option> |
|
|
|
</a-select> |
|
|
|
</a-form-item> |
|
|
|
</a-form-item> --> |
|
|
|
<div class="d-flex flex-row-reverse"> |
|
|
|
<a-button block class="my-5" html-type="submit" style="width: 75%" type="primary">现在登录</a-button> |
|
|
|
</div> |
|
|
@ -242,11 +181,11 @@ export default { |
|
|
|
e.preventDefault(); |
|
|
|
this.form.validateFields(async (err, values) => { |
|
|
|
if (!err) { |
|
|
|
console.log('Received values of form: ', values); |
|
|
|
// console.log('Received values of form: ', values); |
|
|
|
try { |
|
|
|
const { identifier, credential, source } = values; |
|
|
|
const { identifier, credential } = values; |
|
|
|
const { type } = this; |
|
|
|
const params = { data: { identifier, credential, source }, type, client: SIGN_IN_CLIENTS.h5 }; |
|
|
|
const params = { data: { identifier, credential, source: 2 }, type, client: SIGN_IN_CLIENTS.h5 }; |
|
|
|
console.log('params: ', params); |
|
|
|
await this.signIn(params); |
|
|
|
// 没有特殊情况就跳转到首页 |
|
|
|