feat(X-Pack): Add OIDC authentication mechanism

frontend/src/components/layout/Person.vue

@@ -83,8 +83,9 @@ const savePwdHandler = () => {
   pwdFormRef.value?.submit()
 }
 const logout = async () => {
-  await userStore.logout()
-  router.push('/login')
+  if (!(await userStore.logout())) {
+    router.push('/login')
+  }
 }
 </script>
 

frontend/src/components/layout/index.vue

@@ -236,8 +236,9 @@ const menuSelect = (e: any) => {
   router.push(e.index)
 }
 const logout = async () => {
-  await userStore.logout()
-  router.push('/login')
+  if (!(await userStore.logout())) {
+    router.push('/login')
+  }
 }
 const toSystem = () => {
   router.push('/system')

frontend/src/i18n/en.json

@@ -737,7 +737,11 @@
     "revoke_url": "Revocation URL",
     "oauth2_field_mapping_placeholder": "Example: {'{'}\"account\": \"OAuth2Account\", \"name\": \"OAuth2Name\", \"email\": \"email\"{'}'}",
     "token_auth_method": "Token auth method",
-    "userinfo_auth_method": "Userinfo auth method"
+    "userinfo_auth_method": "Userinfo auth method",
+    "oidc_settings": "OIDC Settings",
+    "metadata_url": "Metadata URL",
+    "realm": "Realm",
+    "oidc_field_mapping_placeholder": "e.g., {\"account\": \"oidcAccount\", \"name\": \"oidcName\", \"email\": \"email\"}"
   },
   "login": {
     "default_login": "Default",
@@ -749,7 +753,8 @@
     "qr_code": "QR Code",
     "platform_disable": "{0} settings are not enabled!",
     "input_account": "Please enter account",
-    "redirect_2_auth": "Redirecting to {0} authentication, {1} seconds..."
+    "redirect_2_auth": "Redirecting to {0} authentication, {1} seconds...",
+    "redirect_immediately": "Redirecting immediately"
   },
   "supplier": {
     "alibaba_cloud_bailian": "Alibaba Cloud Bailian",

frontend/src/i18n/ko-KR.json

@@ -737,7 +737,11 @@
     "revoke_url": "취소 URL",
     "oauth2_field_mapping_placeholder": "예: {'{'}\"account\": \"OAuth2Account\", \"name\": \"OAuth2Name\", \"email\": \"email\"{'}'}",
     "token_auth_method": "토큰 인증 방식",
-    "userinfo_auth_method": "사용자 정보 인증 방식"
+    "userinfo_auth_method": "사용자 정보 인증 방식",
+    "oidc_settings": "OIDC 설정",
+    "metadata_url": "메타데이터 URL",
+    "realm": "영역",
+    "oidc_field_mapping_placeholder": "예: {\"account\": \"oidcAccount\", \"name\": \"oidcName\", \"email\": \"email\"}"
   },
   "login": {
     "default_login": "기본값",
@@ -749,7 +753,8 @@
     "qr_code": "QR 코드",
     "platform_disable": "{0} 설정이 활성화되지 않았습니다!",
     "input_account": "계정을 입력해 주세요",
-    "redirect_2_auth": "{0} 인증으로 리디렉션 중입니다, {1}초..."
+    "redirect_2_auth": "{0} 인증으로 리디렉션 중입니다, {1}초...",
+    "redirect_immediately": "지금 이동"
   },
   "supplier": {
     "alibaba_cloud_bailian": "알리바바 클라우드 바이리엔",

frontend/src/i18n/zh-CN.json

@@ -737,7 +737,11 @@
     "revoke_url": "撤销地址",
     "oauth2_field_mapping_placeholder": "例如：{'{'}\"account\": \"oauth2Account\", \"name\": \"oauth2Name\", \"email\": \"email\"{'}'}",
     "token_auth_method": "Token 认证方式",
-    "userinfo_auth_method": "用户信息认证方式"
+    "userinfo_auth_method": "用户信息认证方式",
+    "oidc_settings": "OIDC 设置",
+    "metadata_url": "元数据地址",
+    "realm": "领域",
+    "oidc_field_mapping_placeholder": "例如：{'{'}\"account\": \"oidcAccount\", \"name\": \"oidcName\", \"email\": \"email\"{'}'}"
   },
   "login": {
     "default_login": "默认",
@@ -749,7 +753,8 @@
     "qr_code": "二维码",
     "platform_disable": "{0}设置未开启！",
     "input_account": "请输入账号",
-    "redirect_2_auth": "正在跳转至 {0} 认证，{1} 秒..."
+    "redirect_2_auth": "正在跳转至 {0} 认证，{1} 秒...",
+    "redirect_immediately": "立即跳转"
   },
   "supplier": {
     "alibaba_cloud_bailian": "阿里云百炼",

frontend/src/stores/user.ts

@@ -91,12 +91,15 @@ export const UserStore = defineStore('user', {
       if (res) {
         window.location.href = res
         window.open(res, '_self')
+        return res
       }
       if (getQueryString('code') && getQueryString('state')?.includes('oauth2_state')) {
         const logout_url = location.origin + location.pathname + '#/login'
         window.location.href = logout_url
         window.open(res, logout_url)
+        return logout_url
       }
+      return null
     },
 
     async info() {

frontend/src/views/WelcomeView.vue

@@ -18,8 +18,9 @@ const router = useRouter()
 const userStore = useUserStore()
 
 const logout = async () => {
-  await userStore.logout()
-  router.push('/login')
+  if (!(await userStore.logout())) {
+    router.push('/login')
+  }
 }
 </script>
 

frontend/src/views/login/xpack/Cas.vue

@@ -31,6 +31,7 @@ const execute = () => {
     font-size: 32px;
     border: 1px solid #dee0e3;
     border-radius: 50%;
+    color: var(--ed-color-primary);
   }
   display: flex;
   align-items: center;
@@ -41,7 +42,7 @@ const execute = () => {
     margin-top: 8px;
     color: #000;
     text-align: center;
-    font-family: var(--de-custom_font, 'PingFang');
+    font-family: var(--ed-color-primary, 'PingFang');
     font-size: 12px;
     font-style: normal;
     font-weight: 400;