cxc/qiaoba-vue3
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

load captcha image only when tenant selected

Browse Source
This commit is contained in:
ailanyin
2023-06-12 15:37:47 +08:00
parent 189ffd2255
commit b6fdcba1c3
1 changed files with 76 additions and 71 deletions
Download Patch File Download Diff File Expand all files Collapse all files

39
src/views/login.vue
View File

@ -10,11 +10,11 @@
<el-form-item prop="tenant">
<paged-select
v-model="loginForm.tenant"
:default-label="defaultTenantNamt"
:prop="{
label: 'companyName',
value: 'tenantId',
}"
:default-label="defaultTenantNamt"
:query="{
page: 'pageNum',
size: 'pageSize',
@ -48,7 +48,7 @@
type="text"
>
<template #prefix>
<svg-icon class="el-input__icon input-icon" icon-class="user" />
<svg-icon class="el-input__icon input-icon" icon-class="user"/>
</template>
</el-input>
</el-form-item>
@ -62,11 +62,11 @@
@keyup.enter="handleLogin"
>
<template #prefix>
<svg-icon class="el-input__icon input-icon" icon-class="password" />
<svg-icon class="el-input__icon input-icon" icon-class="password"/>
</template>
</el-input>
</el-form-item>
<el-form-item v-if="captchaEnabled" prop="code">
<el-form-item v-if="captchaEnabled && loginForm.tenant" prop="code">
<el-input
v-model="loginForm.code"
auto-complete="off"
@ -83,7 +83,7 @@
</template>
</el-input>
<div class="login-code">
<img :src="codeUrl" class="login-code-img" @click="getCode" />
<img :src="codeUrl" class="login-code-img" @click="getCode"/>
</div>
</el-form-item>
<el-checkbox
@ -117,15 +117,16 @@
</template>
<script setup>
import { getCodeImg, getTenantNormalList } from "@/api/login";
import {getCodeImg, getTenantNormalList} from "@/api/login";
import Cookies from "js-cookie";
import { decrypt, encrypt } from "@/utils/jsencrypt";
import {decrypt, encrypt} from "@/utils/jsencrypt";
import useUserStore from "@/store/modules/user";
import PagedSelect from "@/components/InfiniteSelect";
import {getCurrentInstance, ref, watchEffect} from "vue";
const userStore = useUserStore();
const router = useRouter();
const { proxy } = getCurrentInstance();
const {proxy} = getCurrentInstance();
const loginForm = ref({
tenant: "",
@ -137,10 +138,10 @@ const loginForm = ref({
});
const loginRules = {
tenant: [{ required: true, trigger: "change", message: "请选择租户" }],
username: [{ required: true, trigger: "blur", message: "请输入您的账号" }],
password: [{ required: true, trigger: "blur", message: "请输入您的密码" }],
code: [{ required: true, trigger: "change", message: "请输入验证码" }],
tenant: [{required: true, trigger: "change", message: "请选择租户"}],
username: [{required: true, trigger: "blur", message: "请输入您的账号"}],
password: [{required: true, trigger: "blur", message: "请输入您的密码"}],
code: [{required: true, trigger: "change", message: "请输入验证码"}],
};
const defaultTenantNamt = ref("");
const codeUrl = ref("");
@ -157,12 +158,12 @@ function handleLogin() {
loading.value = true;
// 勾选了需要记住密码设置在 cookie 中设置记住用户名和密码
if (loginForm.value.rememberMe) {
Cookies.set("tenant", loginForm.value.tenant, { expires: 30 });
Cookies.set("username", loginForm.value.username, { expires: 30 });
Cookies.set("tenant", loginForm.value.tenant, {expires: 30});
Cookies.set("username", loginForm.value.username, {expires: 30});
Cookies.set("password", encrypt(loginForm.value.password), {
expires: 30,
});
Cookies.set("rememberMe", loginForm.value.rememberMe, { expires: 30 });
Cookies.set("rememberMe", loginForm.value.rememberMe, {expires: 30});
} else {
// 否则移除
Cookies.remove("tenant");
@ -174,7 +175,7 @@ function handleLogin() {
userStore
.login(loginForm.value)
.then(() => {
router.push({ path: redirect.value || "/" });
router.push({path: redirect.value || "/"});
})
.catch(() => {
loading.value = false;
@ -229,7 +230,11 @@ const handleTenantConfirm = (option) => {
useUserStore().setTempTenant(option);
};
getCode();
watchEffect(() => {
if (loginForm.value.tenant) {
getCode();
}
})
getCookie();
defaultTenantNamt.value = useUserStore().tempTenantName;
</script>