From c5eb0841a5e753d19a3f62733708bfb6693c8c1b Mon Sep 17 00:00:00 2001 From: vben Date: Sun, 2 Jun 2024 21:21:34 +0800 Subject: [PATCH] feat: new interface button parameters, control function display --- apps/antd-view/src/apis/modules/user.ts | 2 +- apps/antd-view/src/forward/index.ts | 1 + .../forward/{request.ts => request/index.ts} | 0 .../views/_essential/authentication/login.vue | 7 +- .../src/authentication/code-login.vue | 17 ++-- .../src/authentication/forget-password.vue | 17 ++-- .../common-ui/src/authentication/index.ts | 4 +- .../common-ui/src/authentication/login.vue | 88 +++++++++++++++++-- .../src/authentication/qrcode-login.vue | 26 ++++-- .../common-ui/src/authentication/register.vue | 13 ++- .../{ => widgets}/color-toggle.vue | 0 .../{ => widgets}/layout-toggle.vue | 0 12 files changed, 135 insertions(+), 40 deletions(-) create mode 100644 apps/antd-view/src/forward/index.ts rename apps/antd-view/src/forward/{request.ts => request/index.ts} (100%) rename packages/business/common-ui/src/authentication/{ => widgets}/color-toggle.vue (100%) rename packages/business/common-ui/src/authentication/{ => widgets}/layout-toggle.vue (100%) diff --git a/apps/antd-view/src/apis/modules/user.ts b/apps/antd-view/src/apis/modules/user.ts index 3bf9d16a..c39090d1 100644 --- a/apps/antd-view/src/apis/modules/user.ts +++ b/apps/antd-view/src/apis/modules/user.ts @@ -1,7 +1,7 @@ import type { UserApiType } from '@/apis/types'; import type { UserInfo } from '@vben/types'; -import { request } from '@/forward/request'; +import { request } from '@/forward'; /** * 登录 diff --git a/apps/antd-view/src/forward/index.ts b/apps/antd-view/src/forward/index.ts new file mode 100644 index 00000000..56e4b055 --- /dev/null +++ b/apps/antd-view/src/forward/index.ts @@ -0,0 +1 @@ +export * from './request'; diff --git a/apps/antd-view/src/forward/request.ts b/apps/antd-view/src/forward/request/index.ts similarity index 100% rename from apps/antd-view/src/forward/request.ts rename to apps/antd-view/src/forward/request/index.ts diff --git a/apps/antd-view/src/views/_essential/authentication/login.vue b/apps/antd-view/src/views/_essential/authentication/login.vue index 2131a2fa..5f1531cd 100644 --- a/apps/antd-view/src/views/_essential/authentication/login.vue +++ b/apps/antd-view/src/views/_essential/authentication/login.vue @@ -67,5 +67,10 @@ const loginLoading = computed(() => { diff --git a/packages/business/common-ui/src/authentication/code-login.vue b/packages/business/common-ui/src/authentication/code-login.vue index 3125cea3..837ff6c8 100644 --- a/packages/business/common-ui/src/authentication/code-login.vue +++ b/packages/business/common-ui/src/authentication/code-login.vue @@ -14,14 +14,19 @@ interface Props { * @zh_CN 是否处于加载处理状态 */ loading?: boolean; + /** + * @zh_CN 登陆路径 + */ + loginPath?: string; } defineOptions({ name: 'AuthenticationCodeLogin', }); -withDefaults(defineProps(), { +const props = withDefaults(defineProps(), { loading: false, + loginPath: '/auth/login', }); const emit = defineEmits<{ @@ -76,8 +81,8 @@ function handleSubmit() { }); } -function handleGo(path: string) { - router.push(path); +function goLogin() { + router.push(props.loginPath); } async function handleSendCode() { @@ -145,11 +150,7 @@ onBeforeUnmount(() => { {{ $t('common.login') }} - + {{ $t('common.back') }} diff --git a/packages/business/common-ui/src/authentication/forget-password.vue b/packages/business/common-ui/src/authentication/forget-password.vue index 04ee4c2b..1832cd50 100644 --- a/packages/business/common-ui/src/authentication/forget-password.vue +++ b/packages/business/common-ui/src/authentication/forget-password.vue @@ -12,14 +12,19 @@ interface Props { * @zh_CN 是否处于加载处理状态 */ loading?: boolean; + /** + * @zh_CN 登陆路径 + */ + loginPath?: string; } defineOptions({ name: 'AuthenticationForgetPassword', }); -withDefaults(defineProps(), { +const props = withDefaults(defineProps(), { loading: false, + loginPath: '/auth/login', }); const emit = defineEmits<{ @@ -44,8 +49,8 @@ function handleSubmut() { emit('submit', formState.email); } -function handleGo(path: string) { - router.push(path); +function goLogin() { + router.push(props.loginPath); } @@ -73,11 +78,7 @@ function handleGo(path: string) { {{ $t('authentication.send-reset-link') }} - + {{ $t('common.back') }} diff --git a/packages/business/common-ui/src/authentication/index.ts b/packages/business/common-ui/src/authentication/index.ts index 1cd9f186..3b9a9230 100644 --- a/packages/business/common-ui/src/authentication/index.ts +++ b/packages/business/common-ui/src/authentication/index.ts @@ -1,8 +1,8 @@ export { default as AuthenticationCodeLogin } from './code-login.vue'; -export { default as AuthenticationColorToggle } from './color-toggle.vue'; export { default as AuthenticationForgetPassword } from './forget-password.vue'; -export { default as AuthenticationLayoutToggle } from './layout-toggle.vue'; export { default as AuthenticationLogin } from './login.vue'; export { default as AuthenticationQrCodeLogin } from './qrcode-login.vue'; export { default as AuthenticationRegister } from './register.vue'; export type { LoginAndRegisterParams, LoginCodeParams } from './typings'; +export { default as AuthenticationColorToggle } from './widgets/color-toggle.vue'; +export { default as AuthenticationLayoutToggle } from './widgets/layout-toggle.vue'; diff --git a/packages/business/common-ui/src/authentication/login.vue b/packages/business/common-ui/src/authentication/login.vue index c9ae74eb..342aabb1 100644 --- a/packages/business/common-ui/src/authentication/login.vue +++ b/packages/business/common-ui/src/authentication/login.vue @@ -16,10 +16,65 @@ import ThirdPartyLogin from './third-party-login.vue'; import type { LoginEmits } from './typings'; interface Props { + /** + * @zh_CN 验证码登录路径 + */ + codeLoginPath?: string; + + /** + * @zh_CN 忘记密码路径 + */ + forgetPasswordPath?: string; + /** * @zh_CN 是否处于加载处理状态 */ loading?: boolean; + + /** + * @zh_CN 密码占位符 + */ + passwordPlaceholder?: string; + + /** + * @zh_CN 二维码登录路径 + */ + qrCodeLoginPath?: string; + + /** + * @zh_CN 注册路径 + */ + registerPath?: string; + + /** + * @zh_CN 是否显示验证码登录 + */ + showCodeLogin?: boolean; + + /** + * @zh_CN 是否显示忘记密码 + */ + showForgetPassword?: boolean; + + /** + * @zh_CN 是否显示二维码登录 + */ + showQrcodeLogin?: boolean; + + /** + * @zh_CN 是否显示注册按钮 + */ + showRegister?: boolean; + + /** + * @zh_CN 是否显示第三方登录 + */ + showThirdPartyLogin?: boolean; + + /** + * @zh_CN 用户名占位符 + */ + usernamePlaceholder?: string; } defineOptions({ @@ -27,7 +82,18 @@ defineOptions({ }); withDefaults(defineProps(), { + codeLoginPath: '/auth/code-login', + forgetPasswordPath: '/auth/forget-password', loading: false, + passwordPlaceholder: '', + qrCodeLoginPath: '/auth/qrcode-login', + registerPath: '/auth/register', + showCodeLogin: true, + showForgetPassword: true, + showQrcodeLogin: true, + showRegister: true, + showThirdPartyLogin: true, + usernamePlaceholder: '', }); const emit = defineEmits<{ @@ -39,6 +105,7 @@ const router = useRouter(); const REMEMBER_ME_KEY = 'REMEMBER_ME_USERNAME'; const localUsername = localStorage.getItem(REMEMBER_ME_KEY) || ''; + const formState = reactive({ password: '', rememberMe: !!localUsername, @@ -81,7 +148,7 @@ function handleGo(path: string) {