fix(@vben/web-antd): 优化企业微信扫码登录体验
自动社交登录时显示 loading 状态,跳过租户列表加载, 避免闪烁显示登录表单和租户错误信息。 租户 ID 已持久化在 store 中,无需重新获取。 Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -137,11 +137,19 @@ async function handleVerifySuccess({ captchaVerification }: any) {
|
||||
}
|
||||
}
|
||||
|
||||
/** 组件挂载时获取租户信息 */
|
||||
onMounted(async () => {
|
||||
await fetchTenantList();
|
||||
// 是否正在自动社交登录(有 code 说明是 OAuth 回调,直接登录无需展示表单)
|
||||
const isAutoSocialLogin = ref(!!socialCode);
|
||||
|
||||
await tryLogin();
|
||||
/** 组件挂载时 */
|
||||
onMounted(async () => {
|
||||
if (socialCode) {
|
||||
// 自动社交登录:跳过租户列表加载(tenantId 已持久化在 store 中)
|
||||
await tryLogin();
|
||||
return;
|
||||
}
|
||||
// 手动登录绑定:需要展示表单和租户列表
|
||||
isAutoSocialLogin.value = false;
|
||||
await fetchTenantList();
|
||||
});
|
||||
|
||||
const formSchema = computed((): VbenFormSchema[] => {
|
||||
@@ -198,25 +206,39 @@ const formSchema = computed((): VbenFormSchema[] => {
|
||||
|
||||
<template>
|
||||
<div>
|
||||
<AuthenticationLogin
|
||||
ref="loginRef"
|
||||
:form-schema="formSchema"
|
||||
:loading="authStore.loginLoading"
|
||||
:show-code-login="false"
|
||||
:show-qrcode-login="false"
|
||||
:show-third-party-login="false"
|
||||
:show-register="false"
|
||||
@submit="handleLogin"
|
||||
/>
|
||||
<Verification
|
||||
ref="verifyRef"
|
||||
v-if="captchaEnable"
|
||||
:captcha-type="captchaType"
|
||||
:check-captcha-api="checkCaptcha"
|
||||
:get-captcha-api="getCaptcha"
|
||||
:img-size="{ width: '400px', height: '200px' }"
|
||||
mode="pop"
|
||||
@on-success="handleVerifySuccess"
|
||||
/>
|
||||
<!-- 自动社交登录中,显示 loading -->
|
||||
<div
|
||||
v-if="isAutoSocialLogin"
|
||||
class="flex flex-col items-center justify-center py-20"
|
||||
>
|
||||
<div
|
||||
class="mb-4 size-8 animate-spin rounded-full border-4 border-primary border-t-transparent"
|
||||
/>
|
||||
<span class="text-sm text-muted-foreground">正在登录中...</span>
|
||||
</div>
|
||||
|
||||
<!-- 未绑定时,显示账号密码表单供用户绑定登录 -->
|
||||
<template v-else>
|
||||
<AuthenticationLogin
|
||||
ref="loginRef"
|
||||
:form-schema="formSchema"
|
||||
:loading="authStore.loginLoading"
|
||||
:show-code-login="false"
|
||||
:show-qrcode-login="false"
|
||||
:show-third-party-login="false"
|
||||
:show-register="false"
|
||||
@submit="handleLogin"
|
||||
/>
|
||||
<Verification
|
||||
v-if="captchaEnable"
|
||||
ref="verifyRef"
|
||||
:captcha-type="captchaType"
|
||||
:check-captcha-api="checkCaptcha"
|
||||
:get-captcha-api="getCaptcha"
|
||||
:img-size="{ width: '400px', height: '200px' }"
|
||||
mode="pop"
|
||||
@on-success="handleVerifySuccess"
|
||||
/>
|
||||
</template>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
Reference in New Issue
Block a user