去掉验证码验证,实现传参带入用户名密码

This commit is contained in:
471615499@qq.com 2024-10-20 20:13:33 +08:00
parent d58fc800fc
commit d5ca9fa6df
2 changed files with 115 additions and 101 deletions

View File

@ -2,7 +2,7 @@
Overview
## 前端文档地址:
https://1x.antdv.com/components/
https://1x.antdv.com/docs/vue/introduce-cn/
----
项目下载和运行

View File

@ -1,35 +1,35 @@
<template>
<div class="main">
<div class='main'>
<a-form
id="formLogin"
class="user-layout-login"
ref="formLogin"
:form="form"
@submit="handleSubmit"
id='formLogin'
class='user-layout-login'
ref='formLogin'
:form='form'
@submit='handleSubmit'
>
<a-alert
v-if="isLoginError"
type="error"
v-if='isLoginError'
type='error'
showIcon
style="margin-bottom: 24px"
:message="errorMsg"
style='margin-bottom: 24px'
:message='errorMsg'
/>
<a-form-item style='margin-top: 25px'>
<a-input
size="large"
type="text"
placeholder="账户"
size='large'
type='text'
placeholder='账户'
v-decorator="['username', {rules: [{ required: true, message: '请输入帐户名或邮箱地址' }, { validator: handleUsernameOrEmail }], validateTrigger: 'change'}]">
<a-icon slot="prefix" type="user" :style="{ color: 'rgba(0,0,0,.25)' }" />
<a-icon slot='prefix' type='user' :style="{ color: 'rgba(0,0,0,.25)' }" />
</a-input>
</a-form-item>
<a-form-item>
<a-input-password
size="large"
placeholder="密码"
size='large'
placeholder='密码'
v-decorator="['password', { rules: [{ required: true, message: '请输入密码' }], validateTrigger: 'blur'}]">
<a-icon slot="prefix" type="lock" :style="{ color: 'rgba(0,0,0,.25)' }" />
<a-icon slot='prefix' type='lock' :style="{ color: 'rgba(0,0,0,.25)' }" />
</a-input-password>
</a-form-item>
<!-- <a-tabs :activeKey="customActiveKey" :tabBarStyle="{ textAlign: 'center', borderBottom: 'unset' }" @change="handleTabClick">-->
@ -78,15 +78,16 @@
<!-- <router-link class="register" style="float: right;" :to="{ name: 'register' }">注册账户</router-link>-->
</a-form-item>
<a-form-item style="margin-top:24px">
<a-form-item style='margin-top:24px'>
<a-button
size="large"
type="primary"
htmlType="submit"
class="login-button"
:loading="state.loginBtn"
:disabled="state.loginBtn"
>确定</a-button>
size='large'
type='primary'
htmlType='submit'
class='login-button'
:loading='state.loginBtn'
:disabled='state.loginBtn'
>确定
</a-button>
</a-form-item>
<!-- <div class="user-login-other">-->
@ -105,17 +106,17 @@
</a-form>
<two-step-captcha
v-if="requiredTwoStepCaptcha"
:visible="stepCaptchaVisible"
@success="stepCaptchaSuccess"
@cancel="stepCaptchaCancel"
v-if='requiredTwoStepCaptcha'
:visible='stepCaptchaVisible'
@success='stepCaptchaSuccess'
@cancel='stepCaptchaCancel'
></two-step-captcha>
<Verify
@success="capctchaCheckSucc"
@success='capctchaCheckSucc'
:mode="'pop'"
:captchaType="'blockPuzzle'"
:imgSize="{ width: '330px', height: '155px' }"
ref="verify"
ref='verify'
></Verify>
</div>
</template>
@ -158,6 +159,18 @@ export default {
}
},
created() {
},
mounted() {
let username = this.$route.query.username
let pwd = this.$route.query.pwd
if (username && username != '' && pwd && pwd != '') {
this.form.setFieldsValue({
'username': username,
'password': pwd
})
this.loginForm()
}
},
methods: {
...mapActions(['Login', 'Logout']),
@ -186,10 +199,11 @@ export default {
this.loginForm()
},
loginForm() {
if (!this.capctchaCheck) {
this.$refs.verify.show()
return false
}
//
// if (!this.capctchaCheck) {
// this.$refs.verify.show()
// return false
// }
const {
form: { validateFields },
state,
@ -303,7 +317,7 @@ export default {
}
</script>
<style lang="less" scoped>
<style lang='less' scoped>
.user-layout-login {
label {
font-size: 14px;