feat: oauth登录(页面 不包含逻辑)

packages/@core/base/icons/src/mdi.ts

@@ -25,3 +25,5 @@ export const CommandLineIcon = createIconifyIcon(
   'flat-color-icons:command-line',
 );
 export const MemoryIcon = createIconifyIcon('la:memory');
+
+export const GiteeIcon = createIconifyIcon('simple-icons:gitee');

packages/effects/common-ui/src/authentication/login.vue

@@ -69,6 +69,10 @@ const emit = defineEmits<{
    * 验证码点击
    */
   captchaClick: [];
+  /**
+   * 第三方登录 platfrom 对应平台的string
+   */
+  oauthLogin: [plateform: string];
   submit: LoginEmits['submit'];
 }>();
 
@@ -269,7 +273,10 @@ defineExpose({ resetCaptcha });
     </div>
 
     <!-- 第三方登录 -->
-    <ThirdPartyLogin v-if="showThirdPartyLogin" />
+    <ThirdPartyLogin
+      v-if="showThirdPartyLogin"
+      @oauth-login="(e) => emit('oauthLogin', e)"
+    />
 
     <div v-if="showRegister" class="text-center text-sm">
       {{ $t('authentication.accountTip') }}

packages/effects/common-ui/src/authentication/third-party-login.vue

@@ -1,11 +1,18 @@
 <script setup lang="ts">
-import { MdiGithub, MdiGoogle, MdiQqchat, MdiWechat } from '@vben/icons';
+import { GiteeIcon, MdiGithub, MdiQqchat, MdiWechat } from '@vben/icons';
 import { $t } from '@vben/locales';
 import { VbenIconButton } from '@vben-core/shadcn-ui';
 
 defineOptions({
   name: 'ThirdPartyLogin',
 });
+
+defineEmits<{
+  /**
+   * 第三方登录 platfrom 对应平台的string
+   */
+  oauthLogin: [plateform: string];
+}>();
 </script>
 
 <template>
@@ -18,18 +25,18 @@ defineOptions({
       <span class="border-input w-[35%] border-b dark:border-gray-600"></span>
     </div>
 
-    <div class="mt-4 flex flex-wrap justify-center">
-      <VbenIconButton class="mb-3">
-        <MdiWechat />
+    <div class="mt-4 flex flex-wrap justify-around">
+      <VbenIconButton class="mb-3" @click="$emit('oauthLogin', 'wechat')">
+        <MdiWechat class="size-[24px] text-green-600" />
       </VbenIconButton>
-      <VbenIconButton class="mb-3">
-        <MdiQqchat />
+      <VbenIconButton class="mb-3" @click="$emit('oauthLogin', 'qq')">
+        <MdiQqchat class="size-[24px]" />
       </VbenIconButton>
-      <VbenIconButton class="mb-3">
-        <MdiGithub />
+      <VbenIconButton class="mb-3" @click="$emit('oauthLogin', 'github')">
+        <MdiGithub class="size-[24px]" />
       </VbenIconButton>
-      <VbenIconButton class="mb-3">
-        <MdiGoogle />
+      <VbenIconButton class="mb-3" @click="$emit('oauthLogin', 'gitee')">
+        <GiteeIcon class="size-[24px] text-red-700" />
       </VbenIconButton>
     </div>
   </div>