修改登录验证码开关

This commit is contained in:
不做码农 2022-11-18 13:40:27 +08:00
parent ece04bb3d3
commit e503da2d89

View File

@ -13,20 +13,27 @@
</el-input> </el-input>
</el-form-item> </el-form-item>
<el-form-item prop="code" v-if="showCaptcha != 'off'"> <el-form-item prop="code" v-if="showCaptcha != 'off'">
<el-input v-model="loginForm.code" auto-complete="off" placeholder="验证码" style="width: 63%" @keyup.enter.native="handleLogin" ref="codeTxt"> <el-input
v-model="loginForm.code"
auto-complete="off"
placeholder="验证码"
style="width: 63%"
@keyup.enter.native="handleLogin"
ref="codeTxt"
>
<svg-icon slot="prefix" icon-class="validCode" class="el-input__icon input-icon" /> <svg-icon slot="prefix" icon-class="validCode" class="el-input__icon input-icon" />
</el-input> </el-input>
<div class="login-code"> <div class="login-code">
<img :src="codeUrl" @click="getCode" class="login-code-img" /> <img :src="codeUrl" @click="getCode" class="login-code-img" />
</div> </div>
</el-form-item> </el-form-item>
<el-checkbox v-model="loginForm.rememberMe" style="margin:0px 0px 25px 0px;">记住密码</el-checkbox> <el-checkbox v-model="loginForm.rememberMe" style="margin: 0px 0px 25px 0px">记住密码</el-checkbox>
<el-form-item style="width:100%;"> <el-form-item style="width: 100%">
<el-button :loading="loading" size="medium" type="primary" style="width:100%;" @click.native.prevent="handleLogin"> <el-button :loading="loading" size="medium" type="primary" style="width: 100%" @click.native.prevent="handleLogin">
<span v-if="!loading"> </span> <span v-if="!loading"> </span>
<span v-else> 中...</span> <span v-else> 中...</span>
</el-button> </el-button>
<div style="float: right;"> <div style="float: right">
<router-link class="link-type" :to="'/register'">还没有账号立即注册</router-link> <router-link class="link-type" :to="'/register'">还没有账号立即注册</router-link>
</div> </div>
</el-form-item> </el-form-item>
@ -54,42 +61,38 @@ export default {
password: '', password: '',
rememberMe: false, rememberMe: false,
code: '', code: '',
uuid: '' uuid: '',
}, },
title: defaultSettings.title, title: defaultSettings.title,
loginRules: { loginRules: {
username: [ username: [{ required: true, trigger: 'blur', message: '用户名不能为空' }],
{ required: true, trigger: 'blur', message: '用户名不能为空' } password: [{ required: true, trigger: 'blur', message: '密码不能为空' }],
], code: [{ required: true, trigger: 'change', message: '验证码不能为空' }],
password: [
{ required: true, trigger: 'blur', message: '密码不能为空' }
],
code: [{ required: true, trigger: 'change', message: '验证码不能为空' }]
}, },
showCaptcha: '', showCaptcha: '',
loading: false, loading: false,
redirect: undefined redirect: undefined,
} }
}, },
computed: { computed: {
copyRight: function () { copyRight: function () {
return defaultSettings.copyRight return defaultSettings.copyRight
} },
}, },
watch: { watch: {
$route: { $route: {
handler: function (route) { handler: function (route) {
this.redirect = route.query && route.query.redirect this.redirect = route.query && route.query.redirect
}, },
immediate: true immediate: true,
} },
}, },
created() { created() {
this.getCode() this.getCode()
this.getCookie() this.getCookie()
this.getConfigKey('sys.account.captchaOnOff').then((response) => { // this.getConfigKey('sys.account.captchaOnOff').then((response) => {
this.showCaptcha = response.data // this.showCaptcha = response.data
}) // })
}, },
methods: { methods: {
getCode() { getCode() {
@ -97,6 +100,7 @@ export default {
getCodeImg().then((res) => { getCodeImg().then((res) => {
this.codeUrl = 'data:image/gif;base64,' + res.data.img this.codeUrl = 'data:image/gif;base64,' + res.data.img
this.loginForm.uuid = res.data.uuid this.loginForm.uuid = res.data.uuid
this.showCaptcha = res.data.captchaOff
this.$forceUpdate() this.$forceUpdate()
}) })
}, },
@ -108,7 +112,7 @@ export default {
this.loginForm = { this.loginForm = {
username: username === undefined ? this.loginForm.username : username, username: username === undefined ? this.loginForm.username : username,
password: password === undefined ? this.loginForm.password : password, password: password === undefined ? this.loginForm.password : password,
rememberMe: rememberMe === undefined ? false : Boolean(rememberMe) rememberMe: rememberMe === undefined ? false : Boolean(rememberMe),
} }
}, },
handleLogin() { handleLogin() {
@ -118,10 +122,10 @@ export default {
if (this.loginForm.rememberMe) { if (this.loginForm.rememberMe) {
Cookies.set('username', this.loginForm.username, { expires: 30 }) Cookies.set('username', this.loginForm.username, { expires: 30 })
Cookies.set('password', this.loginForm.password, { Cookies.set('password', this.loginForm.password, {
expires: 30 expires: 30,
}) })
Cookies.set('rememberMe', this.loginForm.rememberMe, { Cookies.set('rememberMe', this.loginForm.rememberMe, {
expires: 30 expires: 30,
}) })
} else { } else {
Cookies.remove('username') Cookies.remove('username')
@ -135,7 +139,7 @@ export default {
this.$router.push({ path: this.redirect || '/' }) this.$router.push({ path: this.redirect || '/' })
}) })
.catch((error) => { .catch((error) => {
this.msgError(error.msg); this.msgError(error.msg)
this.loading = false this.loading = false
this.getCode() this.getCode()
this.$refs.codeTxt.focus() this.$refs.codeTxt.focus()
@ -144,8 +148,8 @@ export default {
console.log('未完成') console.log('未完成')
} }
}) })
} },
} },
} }
</script> </script>
@ -155,7 +159,7 @@ export default {
justify-content: center; justify-content: center;
align-items: center; align-items: center;
height: 100%; height: 100%;
background-image: url("../assets/image/login-background.jpg"); background-image: url('../assets/image/login-background.jpg');
background-size: cover; background-size: cover;
// background-color: rgba(56, 157, 170, 0.82); // background-color: rgba(56, 157, 170, 0.82);
} }