Browse Source

Merge pull request #1153 from colinin/tenant-login

feat: 登录页增加租户选择控件
pull/1162/head
yx lin 1 year ago
committed by GitHub
parent
commit
21fb0bf16a
No known key found for this signature in database GPG Key ID: B5690EEEBB952194
  1. 46
      apps/vben5/apps/app-antd/src/views/_core/authentication/login.vue

46
apps/vben5/apps/app-antd/src/views/_core/authentication/login.vue

@ -1,26 +1,38 @@
<script lang="ts" setup> <script lang="ts" setup>
import type { TwoFactorError } from '@abp/account'; import type { TwoFactorError } from '@abp/account';
import type { VbenFormSchema } from '@vben/common-ui'; import type { ExtendedFormApi, VbenFormSchema } from '@vben/common-ui';
import type { Recordable } from '@vben/types'; import type { Recordable } from '@vben/types';
import { computed } from 'vue'; import { computed, nextTick, onMounted, useTemplateRef } from 'vue';
import { AuthenticationLogin, useVbenModal, z } from '@vben/common-ui'; import { AuthenticationLogin, useVbenModal, z } from '@vben/common-ui';
import { $t } from '@vben/locales'; import { $t } from '@vben/locales';
import { useAbpStore } from '@abp/core';
import { useAbpConfigApi } from '#/api/core/useAbpConfigApi';
import { useAuthStore } from '#/store'; import { useAuthStore } from '#/store';
import TwoFactorLogin from './two-factor-login.vue'; import TwoFactorLogin from './two-factor-login.vue';
interface LoginInstance {
getFormApi(): ExtendedFormApi | undefined;
}
defineOptions({ name: 'Login' }); defineOptions({ name: 'Login' });
const abpStore = useAbpStore();
const authStore = useAuthStore(); const authStore = useAuthStore();
const { getConfigApi } = useAbpConfigApi();
const login = useTemplateRef<LoginInstance>('login');
const formSchema = computed((): VbenFormSchema[] => { const formSchema = computed((): VbenFormSchema[] => {
return [ let schemas: VbenFormSchema[] = [
{ {
component: 'VbenInput', component: 'Input',
componentProps: { componentProps: {
placeholder: $t('authentication.usernameTip'), placeholder: $t('authentication.usernameTip'),
}, },
@ -29,7 +41,7 @@ const formSchema = computed((): VbenFormSchema[] => {
rules: z.string().min(1, { message: $t('authentication.usernameTip') }), rules: z.string().min(1, { message: $t('authentication.usernameTip') }),
}, },
{ {
component: 'VbenInputPassword', component: 'InputPassword',
componentProps: { componentProps: {
placeholder: $t('authentication.password'), placeholder: $t('authentication.password'),
}, },
@ -38,10 +50,31 @@ const formSchema = computed((): VbenFormSchema[] => {
rules: z.string().min(1, { message: $t('authentication.passwordTip') }), rules: z.string().min(1, { message: $t('authentication.passwordTip') }),
}, },
]; ];
if (abpStore.application?.multiTenancy.isEnabled) {
schemas = [
{
component: 'TenantSelect',
fieldName: 'tenant',
componentProps: {
onChange: onInit,
},
},
...schemas,
];
}
return schemas;
}); });
const [TwoFactorModal, twoFactorModalApi] = useVbenModal({ const [TwoFactorModal, twoFactorModalApi] = useVbenModal({
connectedComponent: TwoFactorLogin, connectedComponent: TwoFactorLogin,
}); });
async function onInit() {
const abpConfig = await getConfigApi();
abpStore.setApplication(abpConfig);
nextTick(() => {
const formApi = login.value?.getFormApi();
formApi?.setFieldValue('tenant', abpConfig.currentTenant.name);
});
}
async function onLogin(params: Recordable<any>) { async function onLogin(params: Recordable<any>) {
try { try {
await authStore.authLogin(params); await authStore.authLogin(params);
@ -59,11 +92,14 @@ function onTwoFactorError(params: Recordable<any>, error: any) {
twoFactorModalApi.open(); twoFactorModalApi.open();
} }
} }
onMounted(onInit);
</script> </script>
<template> <template>
<div> <div>
<AuthenticationLogin <AuthenticationLogin
ref="login"
:form-schema="formSchema" :form-schema="formSchema"
:loading="authStore.loginLoading" :loading="authStore.loginLoading"
@submit="onLogin" @submit="onLogin"

Loading…
Cancel
Save